1/*
2 * Copyright (c) 2023-2023 Huawei Device Co., Ltd.
3 * Licensed under the Apache License, Version 2.0 (the "License");
4 * you may not use this file except in compliance with the License.
5 * You may obtain a copy of the License at
6 *
7 *     http://www.apache.org/licenses/LICENSE-2.0
8 *
9 * Unless required by applicable law or agreed to in writing, software
10 * distributed under the License is distributed on an "AS IS" BASIS,
11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12 * See the License for the specific language governing permissions and
13 * limitations under the License.
14 */
15
16if (!('finalizeConstruction' in ViewPU.prototype)) {
17  Reflect.set(ViewPU.prototype, 'finalizeConstruction', () => { });
18}
19if (PUV2ViewBase.contextStack === undefined) {
20  Reflect.set(PUV2ViewBase, 'contextStack', []);
21}
22const KeyCode = requireNapi('multimodalInput.keyCode').KeyCode;
23const MeasureText = requireNapi('measure');
24const hilog = requireNapi('hilog');
25const PUBLIC_MORE = { 'id': -1, 'type': 20000, params: ['sys.media.ohos_ic_public_more'],
26  'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' };
27const TEXT_EDITABLE_DIALOG = '18.3fp';
28const IMAGE_SIZE = '64vp';
29const MAX_DIALOG = '256vp';
30const MIN_DIALOG = '216vp';
31export class TabTitleBar extends ViewPU {
32  constructor(b14, c14, d14, e14 = -1, f14 = undefined, g14) {
33    super(b14, d14, e14, g14);
34    if (typeof f14 === 'function') {
35      this.paramsGenerator_ = f14;
36    }
37    this.tabItems = [];
38    this.menuItems = [];
39    this.swiperContent = undefined;
40    this.__tabWidth = new ObservedPropertySimplePU(0, this, 'tabWidth');
41    this.__currentIndex = new ObservedPropertySimplePU(0, this, 'currentIndex');
42    this.__fontSize = new ObservedPropertySimplePU(1, this, 'fontSize');
43    this.menuSectionWidth = 0;
44    this.tabOffsets = [];
45    this.imageWidths = [];
46    this.scroller = new Scroller();
47    this.swiperController = new SwiperController();
48    this.settings = new RenderingContextSettings(true);
49    this.leftContext2D = new CanvasRenderingContext2D(this.settings);
50    this.rightContext2D = new CanvasRenderingContext2D(this.settings);
51    this.setInitiallyProvidedValue(c14);
52    this.finalizeConstruction();
53  }
54
55  setInitiallyProvidedValue(a14) {
56    if (a14.tabItems !== undefined) {
57      this.tabItems = a14.tabItems;
58    }
59    if (a14.menuItems !== undefined) {
60      this.menuItems = a14.menuItems;
61    }
62    if (a14.swiperContent !== undefined) {
63      this.swiperContent = a14.swiperContent;
64    }
65    if (a14.tabWidth !== undefined) {
66      this.tabWidth = a14.tabWidth;
67    }
68    if (a14.currentIndex !== undefined) {
69      this.currentIndex = a14.currentIndex;
70    }
71    if (a14.fontSize !== undefined) {
72      this.fontSize = a14.fontSize;
73    }
74    if (a14.menuSectionWidth !== undefined) {
75      this.menuSectionWidth = a14.menuSectionWidth;
76    }
77    if (a14.tabOffsets !== undefined) {
78      this.tabOffsets = a14.tabOffsets;
79    }
80    if (a14.imageWidths !== undefined) {
81      this.imageWidths = a14.imageWidths;
82    }
83    if (a14.scroller !== undefined) {
84      this.scroller = a14.scroller;
85    }
86    if (a14.swiperController !== undefined) {
87      this.swiperController = a14.swiperController;
88    }
89    if (a14.settings !== undefined) {
90      this.settings = a14.settings;
91    }
92    if (a14.leftContext2D !== undefined) {
93      this.leftContext2D = a14.leftContext2D;
94    }
95    if (a14.rightContext2D !== undefined) {
96      this.rightContext2D = a14.rightContext2D;
97    }
98  }
99
100  updateStateVars(z13) {
101  }
102
103  purgeVariableDependenciesOnElmtId(y13) {
104    this.__tabWidth.purgeDependencyOnElmtId(y13);
105    this.__currentIndex.purgeDependencyOnElmtId(y13);
106    this.__fontSize.purgeDependencyOnElmtId(y13);
107  }
108
109  aboutToBeDeleted() {
110    this.__tabWidth.aboutToBeDeleted();
111    this.__currentIndex.aboutToBeDeleted();
112    this.__fontSize.aboutToBeDeleted();
113    SubscriberManager.Get().delete(this.id__());
114    this.aboutToBeDeletedInternal();
115  }
116
117  get tabWidth() {
118    return this.__tabWidth.get();
119  }
120
121  set tabWidth(x13) {
122    this.__tabWidth.set(x13);
123  }
124
125  get currentIndex() {
126    return this.__currentIndex.get();
127  }
128
129  set currentIndex(w13) {
130    this.__currentIndex.set(w13);
131  }
132
133  get fontSize() {
134    return this.__fontSize.get();
135  }
136
137  set fontSize(v13) {
138    this.__fontSize.set(v13);
139  }
140
141  GradientMask(h13, i13, j13, k13, l13, m13 = null) {
142    this.observeComponentCreation2((t13, u13) => {
143      Column.create();
144      Column.blendMode(BlendMode.DST_OUT);
145      Column.width(TabTitleBar.gradientMaskWidth);
146      Column.height(TabTitleBar.totalHeight);
147    }, Column);
148    this.observeComponentCreation2((p13, q13) => {
149      Canvas.create(h13);
150      Canvas.width(TabTitleBar.gradientMaskWidth);
151      Canvas.height(TabTitleBar.totalHeight);
152      Canvas.onReady(() => {
153        let s13 = h13.createLinearGradient(i13, j13, k13, l13);
154        s13.addColorStop(0.0, '#ffffffff');
155        s13.addColorStop(1, '#00ffffff');
156        h13.fillStyle = s13;
157        h13.fillRect(0, 0, TabTitleBar.gradientMaskWidth, TabTitleBar.totalHeight);
158      });
159    }, Canvas);
160    Canvas.pop();
161    Column.pop();
162  }
163
164  aboutToAppear() {
165    this.tabItems.forEach((g13) => {
166      this.imageWidths.push(0);
167    });
168    this.loadOffsets();
169  }
170
171  loadOffsets() {
172    this.tabOffsets.length = 0;
173    let b13 = 0;
174    this.tabOffsets.push(b13);
175    b13 += TabContentItem.marginFirst;
176    this.tabItems.forEach((d13, e13) => {
177      if (d13.icon !== undefined) {
178        if (Math.abs(this.imageWidths[e13]) > TabContentItem.imageHotZoneWidth) {
179          b13 += this.imageWidths[e13];
180        } else {
181          b13 += TabContentItem.imageHotZoneWidth;
182        }
183      } else {
184        b13 += TabContentItem.paddingLeft;
185        b13 += px2vp(MeasureText.measureText({
186          textContent: d13.title.toString(),
187          fontSize: 18,
188          fontWeight: FontWeight.Medium,
189        }));
190        b13 += TabContentItem.paddingRight;
191      }
192      this.tabOffsets.push(b13);
193    });
194  }
195
196  initialRender() {
197    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.push(this);
198    this.observeComponentCreation2((z12, a13) => {
199      Column.create();
200    }, Column);
201    this.observeComponentCreation2((u12, v12) => {
202      Flex.create({
203        justifyContent: FlexAlign.SpaceBetween,
204        alignItems: ItemAlign.Stretch
205      });
206      Flex.backgroundColor({ 'id': -1, 'type': 10001, params: ['sys.color.ohos_id_color_background'],
207        'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' });
208      Flex.margin({ right: { 'id': -1, 'type': 10002, params: ['sys.float.ohos_id_max_padding_end'],
209        'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' } });
210      Flex.onAreaChange((x12, y12) => {
211        this.tabWidth = Number(y12.width) - this.menuSectionWidth;
212      });
213    }, Flex);
214    this.observeComponentCreation2((s12, t12) => {
215      Stack.create({ alignContent: Alignment.End });
216      Stack.blendMode(BlendMode.SRC_OVER, BlendApplyType.OFFSCREEN);
217    }, Stack);
218    this.observeComponentCreation2((q12, r12) => {
219      Stack.create({ alignContent: Alignment.Start });
220    }, Stack);
221    this.observeComponentCreation2((o12, p12) => {
222      Column.create();
223    }, Column);
224    this.observeComponentCreation2((m12, n12) => {
225      List.create({ initialIndex: 0, scroller: this.scroller, space: 0 });
226      List.width('100%');
227      List.height(TabTitleBar.totalHeight);
228      List.constraintSize({ maxWidth: this.tabWidth });
229      List.edgeEffect(EdgeEffect.Spring);
230      List.listDirection(Axis.Horizontal);
231      List.scrollBar(BarState.Off);
232    }, List);
233    this.observeComponentCreation2((i11, j11) => {
234      ForEach.create();
235      const k11 = (m11, n11) => {
236        const o11 = m11;
237        {
238          const p11 = (k12, l12) => {
239            ViewStackProcessor.StartGetAccessRecordingFor(k12);
240            q11(k12, l12);
241            if (!l12) {
242              ListItem.pop();
243            }
244            ViewStackProcessor.StopGetAccessRecording();
245          };
246          const q11 = (i12, j12) => {
247            ListItem.create(r11, true);
248          };
249          const r11 = (v11, w11) => {
250            p11(v11, w11);
251            {
252              this.observeComponentCreation2((y11, z11) => {
253                if (z11) {
254                  let a12 = new TabContentItem(this, {
255                    item: o11,
256                    index: n11,
257                    maxIndex: this.tabItems.length - 1,
258                    currentIndex: this.currentIndex,
259                    onCustomClick: (h12) => this.currentIndex = h12,
260                    onImageComplete: (g12) => {
261                      this.imageWidths[n11] = g12;
262                      this.loadOffsets();
263                    }
264                  }, undefined, y11, () => { }, { page: 'library/src/main/ets/components/MainPage.ets',
265                    line: 129, col: 21 });
266                  ViewPU.create(a12);
267                  let b12 = () => {
268                    return {
269                      item: o11,
270                      index: n11,
271                      maxIndex: this.tabItems.length - 1,
272                      currentIndex: this.currentIndex,
273                      onCustomClick: (f12) => this.currentIndex = f12,
274                      onImageComplete: (e12) => {
275                        this.imageWidths[n11] = e12;
276                        this.loadOffsets();
277                      }
278                    };
279                  };
280                  a12.paramsGenerator_ = b12;
281                }
282                else {
283                  this.updateStateVarsOfChildByElmtId(y11, {
284                    currentIndex: this.currentIndex
285                  });
286                }
287              }, { name: 'TabContentItem' });
288            }
289            ListItem.pop();
290          };
291          this.observeComponentCreation2(q11, ListItem);
292          ListItem.pop();
293        }
294      };
295      this.forEachUpdateFunction(i11, this.tabItems, k11, undefined, true, false);
296    }, ForEach);
297    ForEach.pop();
298    List.pop();
299    Column.pop();
300    this.GradientMask.bind(this)(this.leftContext2D, 0, TabTitleBar.totalHeight / 2, TabTitleBar.gradientMaskWidth,
301      TabTitleBar.totalHeight / 2);
302    Stack.pop();
303    this.GradientMask.bind(this)(this.rightContext2D, TabTitleBar.gradientMaskWidth, TabTitleBar.totalHeight / 2, 0,
304      TabTitleBar.totalHeight / 2);
305    Stack.pop();
306    this.observeComponentCreation2((r10, s10) => {
307      If.create();
308      if (this.menuItems !== undefined && this.menuItems.length > 0) {
309        this.ifElseBranchUpdateFunction(0, () => {
310          this.observeComponentCreation2((d11, e11) => {
311            __Common__.create();
312            __Common__.height(TabTitleBar.totalHeight);
313            __Common__.onAreaChange((g11, h11) => {
314              this.menuSectionWidth = Number(h11.width);
315            });
316          }, __Common__);
317          {
318            this.observeComponentCreation2((x10, y10) => {
319              if (y10) {
320                let z10 = new CollapsibleMenuSection(this, { menuItems: this.menuItems,
321                  index: 1 + TabTitleBar.instanceCount++ }, undefined, x10, () => { },
322                  { page: 'library/src/main/ets/components/MainPage.ets', line: 159, col: 11 });
323                ViewPU.create(z10);
324                let a11 = () => {
325                  return {
326                    menuItems: this.menuItems,
327                    index: 1 + TabTitleBar.instanceCount++
328                  };
329                };
330                z10.paramsGenerator_ = a11;
331              } else {
332                this.updateStateVarsOfChildByElmtId(x10, {});
333              }
334            }, { name: 'CollapsibleMenuSection '});
335          }
336          __Common__.pop();
337        });
338      } else {
339        this.ifElseBranchUpdateFunction(1, () => {
340        });
341      }
342    }, If);
343    If.pop();
344    Flex.pop();
345    this.observeComponentCreation2((p10, q10) => {
346      Column.create();
347    }, Column);
348    this.observeComponentCreation2((j10, k10) => {
349      Swiper.create(this.swiperController);
350      Swiper.index(this.currentIndex);
351      Swiper.itemSpace(0);
352      Swiper.indicator(false);
353      Swiper.width('100%');
354      Swiper.height('100%');
355      Swiper.curve(Curve.Friction);
356      Swiper.onChange((n10) => {
357        const o10 = this.tabOffsets[n10] + TabTitleBar.correctionOffset;
358        this.currentIndex = n10;
359        this.scroller.scrollTo({
360          xOffset: o10 > 0 ? o10 : 0,
361          yOffset: 0,
362          animation: {
363            duration: 300,
364            curve: Curve.EaseInOut
365          }
366        });
367      });
368      Swiper.onAppear(() => {
369        this.scroller.scrollToIndex(this.currentIndex);
370        this.scroller.scrollBy(TabTitleBar.correctionOffset, 0);
371      });
372    }, Swiper);
373    this.swiperContent.bind(this)();
374    Swiper.pop();
375    Column.pop();
376    Column.pop();
377    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.pop();
378  }
379
380  rerender() {
381    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.push(this);
382    this.updateDirtyElements();
383    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.pop();
384  }
385}
386TabTitleBar.totalHeight = 56;
387TabTitleBar.correctionOffset = -40.0;
388TabTitleBar.gradientMaskWidth = 24;
389TabTitleBar.instanceCount = 0;
390class CollapsibleMenuSection extends ViewPU {
391  constructor(p9, q9, r9, s9 = -1, t9 = undefined, u9) {
392    super(p9, r9, s9, u9);
393    if (typeof t9 === 'function') {
394      this.paramsGenerator_ = t9;
395    }
396    this.menuItems = [];
397    this.index = 0;
398    this.item = {
399      value: PUBLIC_MORE,
400      label: { 'id': -1, 'type': 10003, params: ['sys.string.ohos_toolbar_more'],
401        'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' },
402    };
403    this.longPressTime = 500;
404    this.minFontSize = 1.75;
405    this.isFollowingSystemFontScale = false;
406    this.maxFontScale = 1;
407    this.systemFontScale = 1;
408    this.firstFocusableIndex = -1;
409    this.__isPopupShown = new ObservedPropertySimplePU(false, this, 'isPopupShown');
410    this.__isMoreIconOnFocus = new ObservedPropertySimplePU(false, this, 'isMoreIconOnFocus');
411    this.__isMoreIconOnHover = new ObservedPropertySimplePU(false, this, 'isMoreIconOnHover');
412    this.__isMoreIconOnClick = new ObservedPropertySimplePU(false, this, 'isMoreIconOnClick');
413    this.__fontSize = new SynchedPropertySimpleOneWayPU(q9.fontSize, this, 'fontSize');
414    this.dialogController = new CustomDialogController({
415      builder: () => {
416        let v9 = new TabTitleBarDialog(this, {
417          cancel: () => {
418          },
419          confirm: () => {
420          },
421          tabTitleDialog: this.item,
422          tabTitleBarDialog: this.item.label ? this.item.label : '',
423          fontSize: this.fontSize,
424        }, undefined, -1, () => { }, { page: 'library/src/main/ets/components/MainPage.ets', line: 225, col: 14 });
425        v9.setController(this.dialogController);
426        ViewPU.create(v9);
427        let w9 = () => {
428          return {
429            cancel: () => {
430            },
431            confirm: () => {
432            },
433            tabTitleDialog: this.item,
434            tabTitleBarDialog: this.item.label ? this.item.label : '',
435            fontSize: this.fontSize
436          };
437        };
438        v9.paramsGenerator_ = w9;
439      },
440      maskColor: Color.Transparent,
441      isModal: true,
442      customStyle: true
443    }, this);
444    this.setInitiallyProvidedValue(q9);
445    this.finalizeConstruction();
446  }
447  setInitiallyProvidedValue(b9) {
448    if (b9.menuItems !== undefined) {
449      this.menuItems = b9.menuItems;
450    }
451    if (b9.index !== undefined) {
452      this.index = b9.index;
453    }
454    if (b9.item !== undefined) {
455      this.item = b9.item;
456    }
457    if (b9.longPressTime !== undefined) {
458      this.longPressTime = b9.longPressTime;
459    }
460    if (b9.minFontSize !== undefined) {
461      this.minFontSize = b9.minFontSize;
462    }
463    if (b9.isFollowingSystemFontScale !== undefined) {
464      this.isFollowingSystemFontScale = b9.isFollowingSystemFontScale;
465    }
466    if (b9.maxFontScale !== undefined) {
467      this.maxFontScale = b9.maxFontScale;
468    }
469    if (b9.systemFontScale !== undefined) {
470      this.systemFontScale = b9.systemFontScale;
471    }
472    if (b9.firstFocusableIndex !== undefined) {
473      this.firstFocusableIndex = b9.firstFocusableIndex;
474    }
475    if (b9.isPopupShown !== undefined) {
476      this.isPopupShown = b9.isPopupShown;
477    }
478    if (b9.isMoreIconOnFocus !== undefined) {
479      this.isMoreIconOnFocus = b9.isMoreIconOnFocus;
480    }
481    if (b9.isMoreIconOnHover !== undefined) {
482      this.isMoreIconOnHover = b9.isMoreIconOnHover;
483    }
484    if (b9.isMoreIconOnClick !== undefined) {
485      this.isMoreIconOnClick = b9.isMoreIconOnClick;
486    }
487    if (b9.fontSize === undefined) {
488      this.__fontSize.set(1);
489    }
490    if (b9.dialogController !== undefined) {
491      this.dialogController = b9.dialogController;
492    }
493  }
494
495  updateStateVars(w9) {
496    this.__fontSize.reset(w9.fontSize);
497  }
498
499  purgeVariableDependenciesOnElmtId(v9) {
500    this.__isPopupShown.purgeDependencyOnElmtId(v9);
501    this.__isMoreIconOnFocus.purgeDependencyOnElmtId(v9);
502    this.__isMoreIconOnHover.purgeDependencyOnElmtId(v9);
503    this.__isMoreIconOnClick.purgeDependencyOnElmtId(v9);
504    this.__fontSize.purgeDependencyOnElmtId(v9);
505  }
506
507  aboutToBeDeleted() {
508    this.__isPopupShown.aboutToBeDeleted();
509    this.__isMoreIconOnFocus.aboutToBeDeleted();
510    this.__isMoreIconOnHover.aboutToBeDeleted();
511    this.__isMoreIconOnClick.aboutToBeDeleted();
512    this.__fontSize.aboutToBeDeleted();
513    SubscriberManager.Get().delete(this.id__());
514    this.aboutToBeDeletedInternal();
515  }
516
517  get isPopupShown() {
518    return this.__isPopupShown.get();
519  }
520  set isPopupShown(u9) {
521    this.__isPopupShown.set(u9);
522  }
523
524  get isMoreIconOnFocus() {
525    return this.__isMoreIconOnFocus.get();
526  }
527
528  set isMoreIconOnFocus(t9) {
529    this.__isMoreIconOnFocus.set(t9);
530  }
531
532  get isMoreIconOnHover() {
533    return this.__isMoreIconOnHover.get();
534  }
535
536  set isMoreIconOnHover(s9) {
537    this.__isMoreIconOnHover.set(s9);
538  }
539
540  get isMoreIconOnClick() {
541    return this.__isMoreIconOnClick.get();
542  }
543
544  set isMoreIconOnClick(r9) {
545    this.__isMoreIconOnClick.set(r9);
546  }
547
548  get fontSize() {
549    return this.__fontSize.get();
550  }
551
552  set fontSize(q9) {
553    this.__fontSize.set(q9);
554  }
555
556  getMoreIconFgColor() {
557    return this.isMoreIconOnClick
558      ? { 'id': -1, 'type': 10001, params: ['sys.color.ohos_id_color_titlebar_icon_pressed'],
559        'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' } :
560      { 'id': -1, 'type': 10001, params: ['sys.color.ohos_id_color_titlebar_icon'],
561        'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' };
562  }
563
564  getMoreIconBgColor() {
565    if (this.isMoreIconOnClick) {
566      return { 'id': -1, 'type': 10001, params: ['sys.color.ohos_id_color_click_effect'],
567        'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' };
568    }
569    else if (this.isMoreIconOnHover) {
570      return { 'id': -1, 'type': 10001, params: ['sys.color.ohos_id_color_hover'],
571        'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' };
572    }
573    else {
574      return Color.Transparent;
575    }
576  }
577
578  aboutToAppear() {
579    try {
580      let t8 = this.getUIContext();
581      this.isFollowingSystemFontScale = t8.isFollowingSystemFontScale();
582      this.maxFontScale = t8.getMaxFontScale();
583    }
584    catch (q8) {
585      let r8 = q8.code;
586      let s8 = q8.message;
587      hilog.error(0x3900, 'Ace', `Faild to decideFontScale,cause, code: ${r8}, message: ${s8}`);
588    }
589    this.menuItems.forEach((o8, p8) => {
590      if (o8.isEnabled && this.firstFocusableIndex === -1 &&
591        p8 > CollapsibleMenuSection.maxCountOfVisibleItems - 2) {
592        this.firstFocusableIndex = this.index * 1000 + p8 + 1;
593      }
594    });
595  }
596
597  decideFontScale() {
598    let m8 = this.getUIContext();
599    this.systemFontScale = m8.getHostContext()?.config?.fontSizeScale ?? 1;
600    if (!this.isFollowingSystemFontScale) {
601      return 1;
602    }
603    return Math.min(this.systemFontScale, this.maxFontScale);
604  }
605  initialRender() {
606    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.push(this);
607    this.observeComponentCreation2((c9, d9) => {
608      Column.create();
609      Column.height('100%');
610      Column.justifyContent(FlexAlign.Center);
611    }, Column);
612    this.observeComponentCreation2((a9, b9) => {
613      Row.create();
614    }, Row);
615    this.observeComponentCreation2((z6, a7) => {
616      If.create();
617      if (this.menuItems.length <= CollapsibleMenuSection.maxCountOfVisibleItems) {
618        this.ifElseBranchUpdateFunction(0, () => {
619          this.observeComponentCreation2((m8, n8) => {
620            ForEach.create();
621            const o8 = (q8, r8) => {
622              const s8 = q8;
623              {
624                this.observeComponentCreation2((u8, v8) => {
625                  if (v8) {
626                    let w8 = new ImageMenuItem(this, { item: s8, index: this.index * 1000 + r8 + 1 }, undefined, u8,
627                      () => { }, { page: 'library/src/main/ets/components/MainPage.ets', line: 269, col: 13 });
628                    ViewPU.create(w8);
629                    let x8 = () => {
630                      return {
631                        item: s8,
632                        index: this.index * 1000 + r8 + 1
633                      };
634                    };
635                    w8.paramsGenerator_ = x8;
636                  } else {
637                    this.updateStateVarsOfChildByElmtId(u8, {});
638                  }
639                }, { name: 'ImageMenuItem' });
640              }
641            };
642            this.forEachUpdateFunction(m8, this.menuItems, o8, undefined, true, false);
643          }, ForEach);
644          ForEach.pop();
645        });
646      } else {
647        this.ifElseBranchUpdateFunction(1, () => {
648          this.observeComponentCreation2((w7, x7) => {
649            ForEach.create();
650            const y7 = (a8, b8) => {
651              const c8 = a8;
652              {
653                this.observeComponentCreation2((e8, f8) => {
654                  if (f8) {
655                    let g8 = new ImageMenuItem(this, { item: c8, index: this.index * 1000 + b8 + 1 }, undefined, e8,
656                      () => { }, { page: 'library/src/main/ets/components/MainPage.ets', line: 274, col: 15 });
657                    ViewPU.create(g8);
658                    let h8 = () => {
659                      return {
660                        item: c8,
661                        index: this.index * 1000 + b8 + 1
662                      };
663                    };
664                    g8.paramsGenerator_ = h8;
665                  } else {
666                    this.updateStateVarsOfChildByElmtId(e8, {});
667                  }
668                }, { name: 'ImageMenuItem' });
669              }
670            };
671            this.forEachUpdateFunction(w7, this.menuItems.slice(0, CollapsibleMenuSection.maxCountOfVisibleItems - 1),
672              y7, undefined, true, false);
673          }, ForEach);
674          ForEach.pop();
675          this.observeComponentCreation2((h7, i7) => {
676            Row.create();
677            Row.width(ImageMenuItem.imageHotZoneWidth);
678            Row.height(ImageMenuItem.imageHotZoneWidth);
679            Row.borderRadius(ImageMenuItem.buttonBorderRadius);
680            Row.foregroundColor(this.getMoreIconFgColor());
681            Row.backgroundColor(this.getMoreIconBgColor());
682            Row.justifyContent(FlexAlign.Center);
683            ViewStackProcessor.visualState('focused');
684            Row.border({
685              radius: { 'id': -1, 'type': 10002, params: ['sys.float.ohos_id_corner_radius_clicked'],
686                'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' },
687              width: ImageMenuItem.focusBorderWidth,
688              color: { 'id': -1, 'type': 10001, params: ['sys.color.ohos_id_color_focused_outline'],
689                'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' },
690              style: BorderStyle.Solid
691            });
692            ViewStackProcessor.visualState('normal');
693            Row.border({
694              radius: { 'id': -1, 'type': 10002, params: ['sys.float.ohos_id_corner_radius_clicked'],
695                'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' },
696              width: 0
697            });
698            ViewStackProcessor.visualState();
699            Row.onFocus(() => this.isMoreIconOnFocus = true);
700            Row.onBlur(() => this.isMoreIconOnFocus = false);
701            Row.onHover((v7) => this.isMoreIconOnHover = v7);
702            Row.onKeyEvent((u7) => {
703              if (u7.keyCode !== KeyCode.KEYCODE_ENTER && u7.keyCode !== KeyCode.KEYCODE_SPACE) {
704                return;
705              }
706              if (u7.type === KeyType.Down) {
707                this.isMoreIconOnClick = true;
708              }
709              if (u7.type === KeyType.Up) {
710                this.isMoreIconOnClick = false;
711              }
712            });
713            Row.onTouch((t7) => {
714              if (t7.type === TouchType.Down) {
715                this.isMoreIconOnClick = true;
716              }
717              if (t7.type === TouchType.Up || t7.type === TouchType.Cancel) {
718                this.isMoreIconOnClick = false;
719                if (this.fontSize >= this.minFontSize) {
720                  this.dialogController?.close();
721                }
722              }
723            });
724            Row.onClick(() => this.isPopupShown = true);
725            Gesture.create(GesturePriority.Low);
726            LongPressGesture.create({ repeat: false, duration: this.longPressTime });
727            LongPressGesture.onAction((x7) => {
728              this.fontSize = this.decideFontScale();
729              if (x7) {
730                if (this.fontSize >= this.minFontSize) {
731                  this.dialogController?.open();
732                }
733              }
734            });
735            LongPressGesture.pop();
736            Gesture.pop();
737            Row.bindPopup(this.isPopupShown, {
738              builder: { builder: this.popupBuilder.bind(this) },
739              placement: Placement.Bottom,
740              popupColor: Color.White,
741              enableArrow: false,
742              onStateChange: (q7) => {
743                this.isPopupShown = q7.isVisible;
744                if (!q7.isVisible) {
745                  this.isMoreIconOnClick = false;
746                }
747              }
748            });
749          }, Row);
750          this.observeComponentCreation2((f7, g7) => {
751            Image.create(PUBLIC_MORE);
752            Image.width(ImageMenuItem.imageSize);
753            Image.height(ImageMenuItem.imageSize);
754            Image.focusable(true);
755            Image.draggable(false);
756            Image.fillColor({ 'id': -1, 'type': 10001, params: ['sys.color.icon_primary'],
757              'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' });
758          }, Image);
759          Row.pop();
760        });
761      }
762    }, If);
763    If.pop();
764    Row.pop();
765    Column.pop();
766    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.pop();
767  }
768
769  popupBuilder(c6 = null) {
770    this.observeComponentCreation2((t6, u6) => {
771      Column.create();
772      Column.width(ImageMenuItem.imageHotZoneWidth + CollapsibleMenuSection.focusPadding
773        * CollapsibleMenuSection.marginsNum);
774      Column.margin({ top: CollapsibleMenuSection.focusPadding, bottom: CollapsibleMenuSection.focusPadding });
775      Column.onAppear(() => {
776        focusControl.requestFocus(ImageMenuItem.focusablePrefix + this.firstFocusableIndex);
777      });
778    }, Column);
779    this.observeComponentCreation2((f6, g6) => {
780      ForEach.create();
781      const h6 = (j6, k6) => {
782        const l6 = j6;
783        {
784          this.observeComponentCreation2((n6, o6) => {
785            if (o6) {
786              let p6 = new ImageMenuItem(this, { item: l6,
787                index: this.index * 1000 + CollapsibleMenuSection.maxCountOfVisibleItems + k6 }, undefined, n6,
788                () => { }, { page: 'library/src/main/ets/components/MainPage.ets', line: 368, col: 11 });
789              ViewPU.create(p6);
790              let q6 = () => {
791                return {
792                  item: l6,
793                  index: this.index * 1000 + CollapsibleMenuSection.maxCountOfVisibleItems + k6
794                };
795              };
796              p6.paramsGenerator_ = q6;
797            }
798            else {
799              this.updateStateVarsOfChildByElmtId(n6, {});
800            }
801          }, { name: 'ImageMenuItem' });
802        }
803      };
804      this.forEachUpdateFunction(f6, this.menuItems.slice(CollapsibleMenuSection.maxCountOfVisibleItems - 1,
805        this.menuItems.length), h6, undefined, true, false);
806    }, ForEach);
807    ForEach.pop();
808    Column.pop();
809  }
810
811  rerender() {
812    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.push(this);
813    this.updateDirtyElements();
814    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.pop();
815  }
816}
817CollapsibleMenuSection.maxCountOfVisibleItems = 1;
818CollapsibleMenuSection.focusPadding = 4;
819CollapsibleMenuSection.marginsNum = 2;
820class TabContentItem extends ViewPU {
821  constructor(s5, t5, u5, v5 = -1, w5 = undefined, x5) {
822    super(s5, u5, v5, x5);
823    if (typeof w5 === 'function') {
824      this.paramsGenerator_ = w5;
825    }
826    this.item = { title: '' };
827    this.index = 0;
828    this.maxIndex = 0;
829    this.onCustomClick = undefined;
830    this.onImageComplete = undefined;
831    this.__currentIndex = new SynchedPropertySimpleOneWayPU(t5.currentIndex, this, 'currentIndex');
832    this.__isOnFocus = new ObservedPropertySimplePU(false, this, 'isOnFocus');
833    this.__isOnHover = new ObservedPropertySimplePU(false, this, 'isOnHover');
834    this.__isOnClick = new ObservedPropertySimplePU(false, this, 'isOnClick');
835    this.__tabWidth = new ObservedPropertySimplePU(0, this, 'tabWidth');
836    this.__imageWidth = new ObservedPropertySimplePU(24, this, 'imageWidth');
837    this.__imageHeight = new ObservedPropertySimplePU(24, this, 'imageHeight');
838    this.setInitiallyProvidedValue(t5);
839    this.finalizeConstruction();
840  }
841  setInitiallyProvidedValue(x5) {
842    if (x5.item !== undefined) {
843      this.item = x5.item;
844    }
845    if (x5.index !== undefined) {
846      this.index = x5.index;
847    }
848    if (x5.maxIndex !== undefined) {
849      this.maxIndex = x5.maxIndex;
850    }
851    if (x5.onCustomClick !== undefined) {
852      this.onCustomClick = x5.onCustomClick;
853    }
854    if (x5.onImageComplete !== undefined) {
855      this.onImageComplete = x5.onImageComplete;
856    }
857    if (x5.isOnFocus !== undefined) {
858      this.isOnFocus = x5.isOnFocus;
859    }
860    if (x5.isOnHover !== undefined) {
861      this.isOnHover = x5.isOnHover;
862    }
863    if (x5.isOnClick !== undefined) {
864      this.isOnClick = x5.isOnClick;
865    }
866    if (x5.tabWidth !== undefined) {
867      this.tabWidth = x5.tabWidth;
868    }
869    if (x5.imageWidth !== undefined) {
870      this.imageWidth = x5.imageWidth;
871    }
872    if (x5.imageHeight !== undefined) {
873      this.imageHeight = x5.imageHeight;
874    }
875  }
876  updateStateVars(w5) {
877    this.__currentIndex.reset(w5.currentIndex);
878  }
879  purgeVariableDependenciesOnElmtId(v5) {
880    this.__currentIndex.purgeDependencyOnElmtId(v5);
881    this.__isOnFocus.purgeDependencyOnElmtId(v5);
882    this.__isOnHover.purgeDependencyOnElmtId(v5);
883    this.__isOnClick.purgeDependencyOnElmtId(v5);
884    this.__tabWidth.purgeDependencyOnElmtId(v5);
885    this.__imageWidth.purgeDependencyOnElmtId(v5);
886    this.__imageHeight.purgeDependencyOnElmtId(v5);
887  }
888  aboutToBeDeleted() {
889    this.__currentIndex.aboutToBeDeleted();
890    this.__isOnFocus.aboutToBeDeleted();
891    this.__isOnHover.aboutToBeDeleted();
892    this.__isOnClick.aboutToBeDeleted();
893    this.__tabWidth.aboutToBeDeleted();
894    this.__imageWidth.aboutToBeDeleted();
895    this.__imageHeight.aboutToBeDeleted();
896    SubscriberManager.Get().delete(this.id__());
897    this.aboutToBeDeletedInternal();
898  }
899  get currentIndex() {
900    return this.__currentIndex.get();
901  }
902  set currentIndex(b5) {
903    this.__currentIndex.set(b5);
904  }
905  get isOnFocus() {
906    return this.__isOnFocus.get();
907  }
908  set isOnFocus(a5) {
909    this.__isOnFocus.set(a5);
910  }
911  get isOnHover() {
912    return this.__isOnHover.get();
913  }
914  set isOnHover(z4) {
915    this.__isOnHover.set(z4);
916  }
917  get isOnClick() {
918    return this.__isOnClick.get();
919  }
920  set isOnClick(y4) {
921    this.__isOnClick.set(y4);
922  }
923  get tabWidth() {
924    return this.__tabWidth.get();
925  }
926  set tabWidth(x4) {
927    this.__tabWidth.set(x4);
928  }
929  get imageWidth() {
930    return this.__imageWidth.get();
931  }
932  set imageWidth(w4) {
933    this.__imageWidth.set(w4);
934  }
935  get imageHeight() {
936    return this.__imageHeight.get();
937  }
938  set imageHeight(v4) {
939    this.__imageHeight.set(v4);
940  }
941  getBgColor() {
942    if (this.isOnClick) {
943      return { 'id': -1, 'type': 10001, params: ['sys.color.ohos_id_color_click_effect'],
944        'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' };
945    } else if (this.isOnHover) {
946      return { 'id': -1, 'type': 10001, params: ['sys.color.ohos_id_color_hover'],
947        'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' };
948    } else {
949      return Color.Transparent;
950    }
951  }
952  getBorderAttr() {
953    if (this.isOnFocus) {
954      return {
955        radius: { 'id': -1, 'type': 10002, params: ['sys.float.ohos_id_corner_radius_clicked'],
956          'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' },
957        width: TabContentItem.focusBorderWidth,
958        color: { 'id': -1, 'type': 10001, params: ['sys.color.ohos_id_color_focused_outline'],
959          'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' },
960        style: BorderStyle.Solid
961      };
962    }
963    return { width: 0 };
964  }
965  getImageScaleFactor() {
966    return this.index === this.currentIndex ? TabContentItem.imageMagnificationFactor : 1;
967  }
968  getImageLayoutWidth() {
969    return TabContentItem.imageSize / Math.max(this.imageHeight, 1.0) * this.imageWidth;
970  }
971  initialRender() {
972    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.push(this);
973    this.observeComponentCreation2((t4, u4) => {
974      Stack.create();
975      Stack.margin({
976        left: this.index === 0 ? TabContentItem.marginFirst : 0,
977        right: this.index === this.maxIndex ? 12 : 0
978      });
979    }, Stack);
980    this.observeComponentCreation2((o4, p4) => {
981      Row.create();
982      Row.height(TabTitleBar.totalHeight);
983      Row.alignItems(VerticalAlign.Center);
984      Row.justifyContent(FlexAlign.Center);
985      Row.borderRadius(TabContentItem.buttonBorderRadius);
986      Row.backgroundColor(this.getBgColor());
987      Row.onAreaChange((r4, s4) => {
988        this.tabWidth = Number(s4.width);
989      });
990    }, Row);
991    this.observeComponentCreation2((m4, n4) => {
992      Column.create();
993      Column.justifyContent(FlexAlign.Center);
994    }, Column);
995    this.observeComponentCreation2((d3, e3) => {
996      If.create();
997      if (this.item.icon === undefined) {
998        this.ifElseBranchUpdateFunction(0, () => {
999          this.observeComponentCreation2((b4, c4) => {
1000            Text.create(this.item.title);
1001            Context.animation({ duration: 300 });
1002            Text.fontSize(this.index === this.currentIndex ?
1003              { 'id': -1, 'type': 10002, params: ['sys.float.ohos_id_text_size_headline7'],
1004                'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' } :
1005              { 'id': -1, 'type': 10002, params: ['sys.float.ohos_id_text_size_headline9'],
1006                'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' });
1007            Text.fontColor(this.index === this.currentIndex ?
1008              { 'id': -1, 'type': 10001, params: ['sys.color.ohos_id_color_titlebar_text'],
1009                'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' } :
1010              { 'id': -1, 'type': 10001, params: ['sys.color.ohos_id_color_titlebar_text_off'],
1011                'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' });
1012            Text.fontWeight(FontWeight.Medium);
1013            Text.focusable(true);
1014            Context.animation(null);
1015            Text.padding({
1016              top: this.index === this.currentIndex ? 6 : 10,
1017              left: TabContentItem.paddingLeft,
1018              bottom: 2,
1019              right: TabContentItem.paddingRight
1020            });
1021            Text.onFocus(() => this.isOnFocus = true);
1022            Text.onBlur(() => this.isOnFocus = false);
1023            Text.onHover((l4) => this.isOnHover = l4);
1024            Text.onKeyEvent((k4) => {
1025              if (k4.keyCode !== KeyCode.KEYCODE_ENTER && k4.keyCode !== KeyCode.KEYCODE_SPACE) {
1026                return;
1027              }
1028              if (k4.type === KeyType.Down) {
1029                this.isOnClick = true;
1030              }
1031              if (k4.type === KeyType.Up) {
1032                this.isOnClick = false;
1033              }
1034            });
1035            Text.onTouch((j4) => {
1036              if (j4.type === TouchType.Down) {
1037                this.isOnClick = true;
1038              }
1039              if (j4.type === TouchType.Up) {
1040                this.isOnClick = false;
1041              }
1042            });
1043            Text.onClick(() => this.onCustomClick && this.onCustomClick(this.index));
1044          }, Text);
1045          Text.pop();
1046        });
1047      }
1048      else {
1049        this.ifElseBranchUpdateFunction(1, () => {
1050          this.observeComponentCreation2((o3, p3) => {
1051            Row.create();
1052            Context.animation({ duration: 300 });
1053            Row.width(this.getImageLayoutWidth() * this.getImageScaleFactor() +
1054            TabContentItem.paddingLeft + TabContentItem.paddingRight);
1055            Row.constraintSize({
1056              minWidth: TabContentItem.imageHotZoneWidth,
1057              minHeight: TabContentItem.imageHotZoneWidth
1058            });
1059            Context.animation(null);
1060            Row.justifyContent(FlexAlign.Center);
1061            Row.onFocus(() => this.isOnFocus = true);
1062            Row.onBlur(() => this.isOnFocus = false);
1063            Row.onHover((y3) => this.isOnHover = y3);
1064            Row.onKeyEvent((x3) => {
1065              if (x3.keyCode !== KeyCode.KEYCODE_ENTER && x3.keyCode !== KeyCode.KEYCODE_SPACE) {
1066                return;
1067              }
1068              if (x3.type === KeyType.Down) {
1069                this.isOnClick = true;
1070              }
1071              if (x3.type === KeyType.Up) {
1072                this.isOnClick = false;
1073              }
1074            });
1075            Row.onTouch((w3) => {
1076              if (w3.type === TouchType.Down) {
1077                this.isOnClick = true;
1078              }
1079              if (w3.type === TouchType.Up) {
1080                this.isOnClick = false;
1081              }
1082            });
1083            Row.onClick(() => this.onCustomClick && this.onCustomClick(this.index));
1084          }, Row);
1085          this.observeComponentCreation2((i3, j3) => {
1086            Image.create(this.item.icon);
1087            Context.animation({ duration: 300 });
1088            Image.alt(this.item.title);
1089            Image.width(this.getImageLayoutWidth());
1090            Image.height(TabContentItem.imageSize);
1091            Image.objectFit(ImageFit.Fill);
1092            Image.scale({
1093              x: this.getImageScaleFactor(),
1094              y: this.getImageScaleFactor()
1095            });
1096            Context.animation(null);
1097            Image.hitTestBehavior(HitTestMode.None);
1098            Image.focusable(true);
1099            Image.onComplete((n3) => {
1100              if (!this.onImageComplete) {
1101                return;
1102              }
1103              this.imageWidth = px2vp(n3?.width);
1104              this.imageHeight = px2vp(n3?.height);
1105              this.onImageComplete(px2vp(n3?.componentWidth) +
1106              TabContentItem.paddingLeft + TabContentItem.paddingRight);
1107            });
1108            Image.onError((m3) => {
1109              if (!this.onImageComplete) {
1110                return;
1111              }
1112              this.onImageComplete(px2vp(m3.componentWidth) +
1113              TabContentItem.paddingLeft + TabContentItem.paddingRight);
1114            });
1115          }, Image);
1116          Row.pop();
1117        });
1118      }
1119    }, If);
1120    If.pop();
1121    Column.pop();
1122    Row.pop();
1123    this.observeComponentCreation2((w2, x2) => {
1124      If.create();
1125      if (this.isOnFocus && this.tabWidth > 0) {
1126        this.ifElseBranchUpdateFunction(0, () => {
1127          this.observeComponentCreation2((b3, c3) => {
1128            Row.create();
1129            Row.width(this.tabWidth);
1130            Row.height(TabTitleBar.totalHeight);
1131            Row.hitTestBehavior(HitTestMode.None);
1132            Row.borderRadius(TabContentItem.buttonBorderRadius);
1133            ViewStackProcessor.visualState('focused');
1134            Row.border(this.getBorderAttr());
1135            ViewStackProcessor.visualState('normal');
1136            Row.border({
1137              radius: { 'id': -1, 'type': 10002, params: ['sys.float.ohos_id_corner_radius_clicked'],
1138                'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' },
1139              width: 0
1140            });
1141            ViewStackProcessor.visualState();
1142          }, Row);
1143          Row.pop();
1144        });
1145      }
1146      else {
1147        this.ifElseBranchUpdateFunction(1, () => {
1148        });
1149      }
1150    }, If);
1151    If.pop();
1152    Stack.pop();
1153    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.pop();
1154  }
1155  rerender() {
1156    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.push(this);
1157    this.updateDirtyElements();
1158    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.pop();
1159  }
1160}
1161TabContentItem.imageSize = 24;
1162TabContentItem.imageHotZoneWidth = 48;
1163TabContentItem.imageMagnificationFactor = 1.4;
1164TabContentItem.buttonBorderRadius = 8;
1165TabContentItem.focusBorderWidth = 2;
1166TabContentItem.paddingLeft = 8;
1167TabContentItem.paddingRight = 8;
1168TabContentItem.marginFirst = 16;
1169class ImageMenuItem extends ViewPU {
1170  constructor(l2, m2, n2, o2 = -1, p2 = undefined, q2) {
1171    super(l2, n2, o2, q2);
1172    if (typeof p2 === 'function') {
1173      this.paramsGenerator_ = p2;
1174    }
1175    this.item = { value: '' };
1176    this.index = 0;
1177    this.__isOnFocus = new ObservedPropertySimplePU(false, this, 'isOnFocus');
1178    this.__isOnHover = new ObservedPropertySimplePU(false, this, 'isOnHover');
1179    this.__isOnClick = new ObservedPropertySimplePU(false, this, 'isOnClick');
1180    this.setInitiallyProvidedValue(m2);
1181    this.finalizeConstruction();
1182  }
1183  setInitiallyProvidedValue(k2) {
1184    if (k2.item !== undefined) {
1185      this.item = k2.item;
1186    }
1187    if (k2.index !== undefined) {
1188      this.index = k2.index;
1189    }
1190    if (k2.isOnFocus !== undefined) {
1191      this.isOnFocus = k2.isOnFocus;
1192    }
1193    if (k2.isOnHover !== undefined) {
1194      this.isOnHover = k2.isOnHover;
1195    }
1196    if (k2.isOnClick !== undefined) {
1197      this.isOnClick = k2.isOnClick;
1198    }
1199  }
1200  updateStateVars(j2) {
1201  }
1202  purgeVariableDependenciesOnElmtId(i2) {
1203    this.__isOnFocus.purgeDependencyOnElmtId(i2);
1204    this.__isOnHover.purgeDependencyOnElmtId(i2);
1205    this.__isOnClick.purgeDependencyOnElmtId(i2);
1206  }
1207  aboutToBeDeleted() {
1208    this.__isOnFocus.aboutToBeDeleted();
1209    this.__isOnHover.aboutToBeDeleted();
1210    this.__isOnClick.aboutToBeDeleted();
1211    SubscriberManager.Get().delete(this.id__());
1212    this.aboutToBeDeletedInternal();
1213  }
1214  get isOnFocus() {
1215    return this.__isOnFocus.get();
1216  }
1217  set isOnFocus(h2) {
1218    this.__isOnFocus.set(h2);
1219  }
1220  get isOnHover() {
1221    return this.__isOnHover.get();
1222  }
1223  set isOnHover(g2) {
1224    this.__isOnHover.set(g2);
1225  }
1226  get isOnClick() {
1227    return this.__isOnClick.get();
1228  }
1229  set isOnClick(f2) {
1230    this.__isOnClick.set(f2);
1231  }
1232  getFgColor() {
1233    return this.isOnClick ?
1234      { 'id': -1, 'type': 10001, params: ['sys.color.ohos_id_color_titlebar_icon_pressed'],
1235        'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' } :
1236      { 'id': -1, 'type': 10001, params: ['sys.color.ohos_id_color_titlebar_icon'],
1237        'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' };
1238  }
1239  getBgColor() {
1240    if (this.isOnClick) {
1241      return { 'id': -1, 'type': 10001, params: ['sys.color.ohos_id_color_click_effect'],
1242        'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' };
1243    } else if (this.isOnHover) {
1244      return { 'id': -1, 'type': 10001, params: ['sys.color.ohos_id_color_hover'],
1245        'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' };
1246    } else {
1247      return Color.Transparent;
1248    }
1249  }
1250  initialRender() {
1251    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.push(this);
1252    this.observeComponentCreation2((u1, v1) => {
1253      Row.create();
1254      Row.width(ImageMenuItem.imageHotZoneWidth);
1255      Row.height(ImageMenuItem.imageHotZoneWidth);
1256      Row.borderRadius(ImageMenuItem.buttonBorderRadius);
1257      Row.foregroundColor(this.getFgColor());
1258      Row.backgroundColor(this.getBgColor());
1259      Row.justifyContent(FlexAlign.Center);
1260      Row.opacity(this.item.isEnabled ? 1 : ImageMenuItem.disabledImageOpacity);
1261      ViewStackProcessor.visualState('focused');
1262      Row.border({
1263        radius: { 'id': -1, 'type': 10002, params: ['sys.float.ohos_id_corner_radius_clicked'],
1264          'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' },
1265        width: ImageMenuItem.focusBorderWidth,
1266        color: { 'id': -1, 'type': 10001, params: ['sys.color.ohos_id_color_focused_outline'],
1267          'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' },
1268        style: BorderStyle.Solid
1269      });
1270      ViewStackProcessor.visualState('normal');
1271      Row.border({
1272        radius: { 'id': -1, 'type': 10002, params: ['sys.float.ohos_id_corner_radius_clicked'],
1273          'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' },
1274        width: 0
1275      });
1276      ViewStackProcessor.visualState();
1277      Row.onFocus(() => {
1278        if (!this.item.isEnabled) {
1279          return;
1280        }
1281        this.isOnFocus = true;
1282      });
1283      Row.onBlur(() => this.isOnFocus = false);
1284      Row.onHover((e2) => {
1285        if (!this.item.isEnabled) {
1286          return;
1287        }
1288        this.isOnHover = e2;
1289      });
1290      Row.onKeyEvent((d2) => {
1291        if (!this.item.isEnabled) {
1292          return;
1293        }
1294        if (d2.keyCode !== KeyCode.KEYCODE_ENTER && d2.keyCode !== KeyCode.KEYCODE_SPACE) {
1295          return;
1296        }
1297        if (d2.type === KeyType.Down) {
1298          this.isOnClick = true;
1299        }
1300        if (d2.type === KeyType.Up) {
1301          this.isOnClick = false;
1302        }
1303      });
1304      Row.onTouch((c2) => {
1305        if (!this.item.isEnabled) {
1306          return;
1307        }
1308        if (c2.type === TouchType.Down) {
1309          this.isOnClick = true;
1310        }
1311        if (c2.type === TouchType.Up) {
1312          this.isOnClick = false;
1313        }
1314      });
1315      Row.onClick(() => this.item.isEnabled && this.item.action && this.item.action());
1316    }, Row);
1317    this.observeComponentCreation2((s1, t1) => {
1318      Image.create(this.item.value);
1319      Image.width(ImageMenuItem.imageSize);
1320      Image.height(ImageMenuItem.imageSize);
1321      Image.focusable(this.item.isEnabled);
1322      Image.key(ImageMenuItem.focusablePrefix + this.index);
1323    }, Image);
1324    Row.pop();
1325    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.pop();
1326  }
1327  rerender() {
1328    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.push(this);
1329    this.updateDirtyElements();
1330    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.pop();
1331  }
1332}
1333ImageMenuItem.imageSize = 24;
1334ImageMenuItem.imageHotZoneWidth = 48;
1335ImageMenuItem.buttonBorderRadius = 8;
1336ImageMenuItem.focusBorderWidth = 2;
1337ImageMenuItem.disabledImageOpacity = 0.4;
1338ImageMenuItem.focusablePrefix = 'Id-TabTitleBar-ImageMenuItem-';
1339class TabTitleBarDialog extends ViewPU {
1340  constructor(i1, j1, k1, l1 = -1, m1 = undefined, n1) {
1341    super(i1, k1, l1, n1);
1342    if (typeof m1 === 'function') {
1343      this.paramsGenerator_ = m1;
1344    }
1345    this.tabTitleDialog = { value: '' };
1346    this.callbackId = undefined;
1347    this.tabTitleBarDialog = '';
1348    this.mainWindowStage = undefined;
1349    this.controller = undefined;
1350    this.minFontSize = 1.75;
1351    this.maxFontSize = 3.2;
1352    this.screenWidth = 640;
1353    this.verticalScreenLines = 6;
1354    this.horizontalsScreenLines = 1;
1355    this.__mainWindow = this.createStorageLink('mainWindow', undefined, 'mainWindow');
1356    this.__fontSize = new ObservedPropertySimplePU(1, this, 'fontSize');
1357    this.__maxLines = new ObservedPropertySimplePU(1, this, 'maxLines');
1358    this.__windowStandardHeight = this.createStorageProp('windowStandardHeight', 0, 'windowStandardHeight');
1359    this.cancel = () => {
1360    };
1361    this.confirm = () => {
1362    };
1363    this.setInitiallyProvidedValue(j1);
1364    this.finalizeConstruction();
1365  }
1366  setInitiallyProvidedValue(h1) {
1367    if (h1.tabTitleDialog !== undefined) {
1368      this.tabTitleDialog = h1.tabTitleDialog;
1369    }
1370    if (h1.callbackId !== undefined) {
1371      this.callbackId = h1.callbackId;
1372    }
1373    if (h1.tabTitleBarDialog !== undefined) {
1374      this.tabTitleBarDialog = h1.tabTitleBarDialog;
1375    }
1376    if (h1.mainWindowStage !== undefined) {
1377      this.mainWindowStage = h1.mainWindowStage;
1378    }
1379    if (h1.controller !== undefined) {
1380      this.controller = h1.controller;
1381    }
1382    if (h1.minFontSize !== undefined) {
1383      this.minFontSize = h1.minFontSize;
1384    }
1385    if (h1.maxFontSize !== undefined) {
1386      this.maxFontSize = h1.maxFontSize;
1387    }
1388    if (h1.screenWidth !== undefined) {
1389      this.screenWidth = h1.screenWidth;
1390    }
1391    if (h1.verticalScreenLines !== undefined) {
1392      this.verticalScreenLines = h1.verticalScreenLines;
1393    }
1394    if (h1.horizontalsScreenLines !== undefined) {
1395      this.horizontalsScreenLines = h1.horizontalsScreenLines;
1396    }
1397    if (h1.fontSize !== undefined) {
1398      this.fontSize = h1.fontSize;
1399    }
1400    if (h1.maxLines !== undefined) {
1401      this.maxLines = h1.maxLines;
1402    }
1403    if (h1.cancel !== undefined) {
1404      this.cancel = h1.cancel;
1405    }
1406    if (h1.confirm !== undefined) {
1407      this.confirm = h1.confirm;
1408    }
1409  }
1410  updateStateVars(g1) {
1411  }
1412  purgeVariableDependenciesOnElmtId(f1) {
1413    this.__mainWindow.purgeDependencyOnElmtId(f1);
1414    this.__fontSize.purgeDependencyOnElmtId(f1);
1415    this.__maxLines.purgeDependencyOnElmtId(f1);
1416    this.__windowStandardHeight.purgeDependencyOnElmtId(f1);
1417  }
1418  aboutToBeDeleted() {
1419    this.__mainWindow.aboutToBeDeleted();
1420    this.__fontSize.aboutToBeDeleted();
1421    this.__maxLines.aboutToBeDeleted();
1422    this.__windowStandardHeight.aboutToBeDeleted();
1423    SubscriberManager.Get().delete(this.id__());
1424    this.aboutToBeDeletedInternal();
1425  }
1426  setController(e1) {
1427    this.controller = e1;
1428  }
1429  get mainWindow() {
1430    return this.__mainWindow.get();
1431  }
1432  set mainWindow(d1) {
1433    this.__mainWindow.set(d1);
1434  }
1435  get fontSize() {
1436    return this.__fontSize.get();
1437  }
1438  set fontSize(c1) {
1439    this.__fontSize.set(c1);
1440  }
1441  get maxLines() {
1442    return this.__maxLines.get();
1443  }
1444  set maxLines(b1) {
1445    this.__maxLines.set(b1);
1446  }
1447  get windowStandardHeight() {
1448    return this.__windowStandardHeight.get();
1449  }
1450  set windowStandardHeight(a1) {
1451    this.__windowStandardHeight.set(a1);
1452  }
1453  initialRender() {
1454    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.push(this);
1455    this.observeComponentCreation2((e, f) => {
1456      If.create();
1457      if (this.tabTitleBarDialog) {
1458        this.ifElseBranchUpdateFunction(0, () => {
1459          this.observeComponentCreation2((y, z) => {
1460            Column.create();
1461            Column.width(this.fontSize === this.maxFontSize ? MAX_DIALOG : MIN_DIALOG);
1462            Column.constraintSize({ minHeight: this.fontSize === this.maxFontSize ? MAX_DIALOG : MIN_DIALOG });
1463            Column.backgroundBlurStyle(BlurStyle.COMPONENT_ULTRA_THICK);
1464            Column.shadow(ShadowStyle.OUTER_DEFAULT_LG);
1465            Column.borderRadius({ 'id': -1, 'type': 10002, params: ['sys.float.corner_radius_level10'],
1466              'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' });
1467          }, Column);
1468          this.observeComponentCreation2((w, x) => {
1469            Image.create(this.tabTitleDialog.value);
1470            Image.width(IMAGE_SIZE);
1471            Image.height(IMAGE_SIZE);
1472            Image.margin({
1473              top: { 'id': -1, 'type': 10002, params: ['sys.float.padding_level24'],
1474                'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' },
1475              bottom: { 'id': -1, 'type': 10002, params: ['sys.float.padding_level8'],
1476                'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' },
1477            });
1478            Image.fillColor({ 'id': -1, 'type': 10001, params: ['sys.color.icon_primary'],
1479              'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' });
1480          }, Image);
1481          this.observeComponentCreation2((u, v) => {
1482            Column.create();
1483            Column.width('100%');
1484            Column.padding({
1485              left: { 'id': -1, 'type': 10002, params: ['sys.float.padding_level4'],
1486                'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' },
1487              right: { 'id': -1, 'type': 10002, params: ['sys.float.padding_level4'],
1488                'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' },
1489              bottom: { 'id': -1, 'type': 10002, params: ['sys.float.padding_level12'],
1490                'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' },
1491            });
1492          }, Column);
1493          this.observeComponentCreation2((s, t) => {
1494            Text.create(this.tabTitleBarDialog);
1495            Text.fontSize(TEXT_EDITABLE_DIALOG);
1496            Text.textOverflow({ overflow: TextOverflow.Ellipsis });
1497            Text.maxLines(this.maxLines);
1498            Text.width('100%');
1499            Text.textAlign(TextAlign.Center);
1500            Text.fontColor({ 'id': -1, 'type': 10001, params: ['sys.color.font_primary'],
1501              'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' });
1502          }, Text);
1503          Text.pop();
1504          Column.pop();
1505          Column.pop();
1506        });
1507      }
1508      else {
1509        this.ifElseBranchUpdateFunction(1, () => {
1510          this.observeComponentCreation2((l, m) => {
1511            Column.create();
1512            Column.width(this.fontSize === this.maxFontSize ? MAX_DIALOG : MIN_DIALOG);
1513            Column.constraintSize({ minHeight: this.fontSize === this.maxFontSize ? MAX_DIALOG : MIN_DIALOG });
1514            Column.backgroundBlurStyle(BlurStyle.COMPONENT_ULTRA_THICK);
1515            Column.shadow(ShadowStyle.OUTER_DEFAULT_LG);
1516            Column.borderRadius({ 'id': -1, 'type': 10002, params: ['sys.float.corner_radius_level10'],
1517              'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' });
1518            Column.justifyContent(FlexAlign.Center);
1519          }, Column);
1520          this.observeComponentCreation2((j, k) => {
1521            Image.create(this.tabTitleDialog.value);
1522            Image.width(IMAGE_SIZE);
1523            Image.height(IMAGE_SIZE);
1524            Image.fillColor({ 'id': -1, 'type': 10001, params: ['sys.color.icon_primary'],
1525              'bundleName': '__harDefaultBundleName__', 'moduleName': '__harDefaultModuleName__' });
1526          }, Image);
1527          Column.pop();
1528        });
1529      }
1530    }, If);
1531    If.pop();
1532    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.pop();
1533  }
1534
1535  async aboutToAppear() {
1536    let a = this.getUIContext().getHostContext();
1537    this.mainWindowStage = a.windowStage.getMainWindowSync();
1538    let b = this.mainWindowStage.getWindowProperties();
1539    let c = b.windowRect;
1540    if (px2vp(c.height) > this.screenWidth) {
1541      this.maxLines = this.verticalScreenLines;
1542    } else {
1543      this.maxLines = this.horizontalsScreenLines;
1544    }
1545  }
1546
1547  rerender() {
1548    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.push(this);
1549    this.updateDirtyElements();
1550    PUV2ViewBase.contextStack && PUV2ViewBase.contextStack.pop();
1551  }
1552}
1553export default {
1554  TabTitleBar: TabTitleBar
1555};