• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/*
2 * Copyright (c) 2024 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}
19const KeyCode = requireNapi('multimodalInput.keyCode').KeyCode;
20const measure = requireNapi('measure');
21const mediaquery = requireNapi('mediaquery');
22const resourceManager = requireNapi('resourceManager');
23const componentUtils = requireNapi('arkui.componentUtils');
24const hilog = requireNapi('hilog');
25const ColorMetrics = requireNapi('arkui.node').ColorMetrics;
26const LengthMetrics = requireNapi('arkui.node').LengthMetrics;
27const LengthUnit = requireNapi('arkui.node').LengthUnit;
28
29const RESOURCE_TYPE_STRING = 10003;
30const RESOURCE_TYPE_FLOAT = 10002;
31const RESOURCE_TYPE_INTEGER = 10007;
32export var ChipSize;
33(function (ChipSize) {
34  ChipSize['NORMAL'] = 'NORMAL';
35  ChipSize['SMALL'] = 'SMALL';
36})(ChipSize || (ChipSize = {}));
37var IconType;
38(function (IconType) {
39  IconType['PREFIX_ICON'] = 'PREFIXICON';
40  IconType['SUFFIX_ICON'] = 'SUFFIXICON';
41  IconType['PREFIX_SYMBOL'] = 'PREFIXSYMBOL';
42  IconType['SUFFIX_SYMBOL'] = 'SUFFIXSYMBOL';
43})(IconType || (IconType = {}));
44var BreakPointsType;
45(function (BreakPointsType) {
46  BreakPointsType['SM'] = 'SM';
47  BreakPointsType['MD'] = 'MD';
48  BreakPointsType['LG'] = 'LG';
49})(BreakPointsType || (BreakPointsType = {}));
50export var AccessibilitySelectedType;
51(function (AccessibilitySelectedType) {
52  AccessibilitySelectedType[(AccessibilitySelectedType['CLICKED'] = 0)] = 'CLICKED';
53  AccessibilitySelectedType[(AccessibilitySelectedType['CHECKED'] = 1)] = 'CHECKED';
54  AccessibilitySelectedType[(AccessibilitySelectedType['SELECTED'] = 2)] = 'SELECTED';
55})(AccessibilitySelectedType || (AccessibilitySelectedType = {}));
56const noop = () => {};
57export function Chip(options, parent = null) {
58  const __options__ = options;
59  {
60    (parent ? parent : this).observeComponentCreation2(
61      (elmtId, isInitialRender, options = __options__) => {
62        if (isInitialRender) {
63          let componentCall = new ChipComponent(
64            parent ? parent : this,
65            {
66              chipSize: options.size,
67              prefixIcon: options.prefixIcon,
68              prefixSymbol: options.prefixSymbol,
69              label: options.label,
70              suffixIcon: options.suffixIcon,
71              suffixSymbol: options.suffixSymbol,
72              suffixSymbolOptions: options.suffixSymbolOptions,
73              allowClose: options.allowClose,
74              closeOptions: options.closeOptions,
75              chipEnabled: options.enabled,
76              chipActivated: options.activated,
77              chipNodeBackgroundColor: options.backgroundColor,
78              chipNodeActivatedBackgroundColor: options.activatedBackgroundColor,
79              chipNodeRadius: options.borderRadius,
80              chipDirection: options.direction,
81              chipAccessibilitySelectedType: options.accessibilitySelectedType,
82              chipAccessibilityDescription: options.accessibilityDescription,
83              chipAccessibilityLevel: options.accessibilityLevel,
84              onClose: options.onClose,
85              onClicked: options.onClicked,
86            },
87            undefined,
88            elmtId,
89            () => {},
90            { page: 'library/src/main/ets/components/MainPage.ets', line: 231, col: 3 }
91          );
92          ViewPU.create(componentCall);
93          let paramsLambda = () => {
94            return {
95              chipSize: options.size,
96              prefixIcon: options.prefixIcon,
97              prefixSymbol: options.prefixSymbol,
98              label: options.label,
99              suffixIcon: options.suffixIcon,
100              suffixSymbol: options.suffixSymbol,
101              suffixSymbolOptions: options.suffixSymbolOptions,
102              allowClose: options.allowClose,
103              closeOptions: options.closeOptions,
104              chipEnabled: options.enabled,
105              chipActivated: options.activated,
106              chipNodeBackgroundColor: options.backgroundColor,
107              chipNodeActivatedBackgroundColor: options.activatedBackgroundColor,
108              chipNodeRadius: options.borderRadius,
109              chipDirection: options.direction,
110              chipAccessibilitySelectedType: options.accessibilitySelectedType,
111              chipAccessibilityDescription: options.accessibilityDescription,
112              chipAccessibilityLevel: options.accessibilityLevel,
113              onClose: options.onClose,
114              onClicked: options.onClicked,
115            };
116          };
117          componentCall.paramsGenerator_ = paramsLambda;
118        } else {
119          (parent ? parent : this).updateStateVarsOfChildByElmtId(elmtId, {
120            chipSize: options.size,
121            prefixIcon: options.prefixIcon,
122            prefixSymbol: options.prefixSymbol,
123            label: options.label,
124            suffixIcon: options.suffixIcon,
125            suffixSymbol: options.suffixSymbol,
126            suffixSymbolOptions: options.suffixSymbolOptions,
127            allowClose: options.allowClose,
128            closeOptions: options.closeOptions,
129            chipEnabled: options.enabled,
130            chipActivated: options.activated,
131            chipNodeBackgroundColor: options.backgroundColor,
132            chipNodeActivatedBackgroundColor: options.activatedBackgroundColor,
133            chipNodeRadius: options.borderRadius,
134            chipDirection: options.direction,
135            chipAccessibilitySelectedType: options.accessibilitySelectedType,
136            chipAccessibilityDescription: options.accessibilityDescription,
137            chipAccessibilityLevel: options.accessibilityLevel,
138          });
139        }
140      },
141      { name: 'ChipComponent' }
142    );
143  }
144}
145function isValidString(dimension, regex) {
146  const matches = dimension.match(regex);
147  if (!matches || matches.length < 3) {
148    return false;
149  }
150  const value = Number.parseFloat(matches[1]);
151  return value >= 0;
152}
153function isValidDimensionString(dimension) {
154  return isValidString(dimension, new RegExp('(-?\\d+(?:\\.\\d+)?)_?(fp|vp|px|lpx|%)?$', 'i'));
155}
156function isValidResource(context, value) {
157  const resourceManager = context?.resourceManager;
158  if (value === void 0 || value === null || resourceManager === void 0) {
159    return false;
160  }
161  if (
162    value.type !== RESOURCE_TYPE_STRING &&
163    value.type !== RESOURCE_TYPE_INTEGER &&
164    value.type !== RESOURCE_TYPE_FLOAT
165  ) {
166    return false;
167  }
168  if (value.type === RESOURCE_TYPE_INTEGER || value.type === RESOURCE_TYPE_FLOAT) {
169    if (resourceManager.getNumber(value.id) >= 0) {
170      return true;
171    } else {
172      return false;
173    }
174  }
175  if (value.type === RESOURCE_TYPE_STRING && !isValidDimensionString(resourceManager.getStringSync(value.id))) {
176    return false;
177  } else {
178    return true;
179  }
180}
181export class ChipComponent extends ViewPU {
182  constructor(parent, params, __localStorage, elmtId = -1, paramsLambda = undefined, extraInfo) {
183    super(parent, __localStorage, elmtId, extraInfo);
184    if (typeof paramsLambda === 'function') {
185      this.paramsGenerator_ = paramsLambda;
186    }
187    this.theme = {
188      prefixIcon: {
189        normalSize: {
190          width: {
191            id: -1,
192            type: 10002,
193            params: ['sys.float.chip_normal_icon_size'],
194            bundleName: '__harDefaultBundleName__',
195            moduleName: '__harDefaultModuleName__',
196          },
197          height: {
198            id: -1,
199            type: 10002,
200            params: ['sys.float.chip_normal_icon_size'],
201            bundleName: '__harDefaultBundleName__',
202            moduleName: '__harDefaultModuleName__',
203          },
204        },
205        smallSize: {
206          width: {
207            id: -1,
208            type: 10002,
209            params: ['sys.float.chip_small_icon_size'],
210            bundleName: '__harDefaultBundleName__',
211            moduleName: '__harDefaultModuleName__',
212          },
213          height: {
214            id: -1,
215            type: 10002,
216            params: ['sys.float.chip_small_icon_size'],
217            bundleName: '__harDefaultBundleName__',
218            moduleName: '__harDefaultModuleName__',
219          },
220        },
221        fillColor: {
222          id: -1,
223          type: 10001,
224          params: ['sys.color.chip_usually_icon_color'],
225          bundleName: '__harDefaultBundleName__',
226          moduleName: '__harDefaultModuleName__',
227        },
228        activatedFillColor: {
229          id: -1,
230          type: 10001,
231          params: ['sys.color.chip_active_icon_color'],
232          bundleName: '__harDefaultBundleName__',
233          moduleName: '__harDefaultModuleName__',
234        },
235        focusFillColor: {
236          id: -1,
237          type: 10001,
238          params: ['sys.color.chip_icon_focus_fill'],
239          bundleName: '__harDefaultBundleName__',
240          moduleName: '__harDefaultModuleName__',
241        },
242        focusActivatedColor: {
243          id: -1,
244          type: 10001,
245          params: ['sys.color.chip_icon_activated_focus_color'],
246          bundleName: '__harDefaultBundleName__',
247          moduleName: '__harDefaultModuleName__',
248        },
249      },
250      label: {
251        normalFontSize: {
252          id: -1,
253          type: 10002,
254          params: ['sys.float.chip_normal_font_size'],
255          bundleName: '__harDefaultBundleName__',
256          moduleName: '__harDefaultModuleName__',
257        },
258        smallFontSize: {
259          id: -1,
260          type: 10002,
261          params: ['sys.float.chip_small_font_size'],
262          bundleName: '__harDefaultBundleName__',
263          moduleName: '__harDefaultModuleName__',
264        },
265        focusFontColor: {
266          id: -1,
267          type: 10001,
268          params: ['sys.color.chip_focus_text'],
269          bundleName: '__harDefaultBundleName__',
270          moduleName: '__harDefaultModuleName__',
271        },
272        focusActiveFontColor: {
273          id: -1,
274          type: 10001,
275          params: ['sys.color.chip_activated_focus_font_color'],
276          bundleName: '__harDefaultBundleName__',
277          moduleName: '__harDefaultModuleName__',
278        },
279        fontColor: {
280          id: -1,
281          type: 10001,
282          params: ['sys.color.chip_font_color'],
283          bundleName: '__harDefaultBundleName__',
284          moduleName: '__harDefaultModuleName__',
285        },
286        activatedFontColor: {
287          id: -1,
288          type: 10001,
289          params: ['sys.color.chip_activated_fontcolor'],
290          bundleName: '__harDefaultBundleName__',
291          moduleName: '__harDefaultModuleName__',
292        },
293        fontFamily: 'HarmonyOS Sans',
294        fontWeight: {
295          id: -1,
296          type: 10002,
297          params: ['sys.float.chip_text_font_weight'],
298          bundleName: '__harDefaultBundleName__',
299          moduleName: '__harDefaultModuleName__',
300        },
301        normalMargin: {
302          left: 6,
303          right: 6,
304          top: 0,
305          bottom: 0,
306        },
307        smallMargin: {
308          left: 4,
309          right: 4,
310          top: 0,
311          bottom: 0,
312        },
313        defaultFontSize: 14,
314        localizedNormalMargin: {
315          start: LengthMetrics.resource({
316            id: -1,
317            type: 10002,
318            params: ['sys.float.chip_normal_text_margin'],
319            bundleName: '__harDefaultBundleName__',
320            moduleName: '__harDefaultModuleName__',
321          }),
322          end: LengthMetrics.resource({
323            id: -1,
324            type: 10002,
325            params: ['sys.float.chip_normal_text_margin'],
326            bundleName: '__harDefaultBundleName__',
327            moduleName: '__harDefaultModuleName__',
328          }),
329          top: LengthMetrics.vp(0),
330          bottom: LengthMetrics.vp(0),
331        },
332        localizedSmallMargin: {
333          start: LengthMetrics.resource({
334            id: -1,
335            type: 10002,
336            params: ['sys.float.chip_small_text_margin'],
337            bundleName: '__harDefaultBundleName__',
338            moduleName: '__harDefaultModuleName__',
339          }),
340          end: LengthMetrics.resource({
341            id: -1,
342            type: 10002,
343            params: ['sys.float.chip_small_text_margin'],
344            bundleName: '__harDefaultBundleName__',
345            moduleName: '__harDefaultModuleName__',
346          }),
347          top: LengthMetrics.vp(0),
348          bottom: LengthMetrics.vp(0),
349        },
350      },
351      suffixIcon: {
352        normalSize: {
353          width: {
354            id: -1,
355            type: 10002,
356            params: ['sys.float.chip_normal_icon_size'],
357            bundleName: '__harDefaultBundleName__',
358            moduleName: '__harDefaultModuleName__',
359          },
360          height: {
361            id: -1,
362            type: 10002,
363            params: ['sys.float.chip_normal_icon_size'],
364            bundleName: '__harDefaultBundleName__',
365            moduleName: '__harDefaultModuleName__',
366          },
367        },
368        smallSize: {
369          width: {
370            id: -1,
371            type: 10002,
372            params: ['sys.float.chip_small_icon_size'],
373            bundleName: '__harDefaultBundleName__',
374            moduleName: '__harDefaultModuleName__',
375          },
376          height: {
377            id: -1,
378            type: 10002,
379            params: ['sys.float.chip_small_icon_size'],
380            bundleName: '__harDefaultBundleName__',
381            moduleName: '__harDefaultModuleName__',
382          },
383        },
384        fillColor: {
385          id: -1,
386          type: 10001,
387          params: ['sys.color.chip_usually_icon_color'],
388          bundleName: '__harDefaultBundleName__',
389          moduleName: '__harDefaultModuleName__',
390        },
391        activatedFillColor: {
392          id: -1,
393          type: 10001,
394          params: ['sys.color.chip_active_icon_color'],
395          bundleName: '__harDefaultBundleName__',
396          moduleName: '__harDefaultModuleName__',
397        },
398        focusFillColor: {
399          id: -1,
400          type: 10001,
401          params: ['sys.color.chip_icon_focus_fill'],
402          bundleName: '__harDefaultBundleName__',
403          moduleName: '__harDefaultModuleName__',
404        },
405        focusActivatedColor: {
406          id: -1,
407          type: 10001,
408          params: ['sys.color.chip_icon_activated_focus_color'],
409          bundleName: '__harDefaultBundleName__',
410          moduleName: '__harDefaultModuleName__',
411        },
412        defaultDeleteIcon: {
413          id: -1,
414          type: 20000,
415          params: ['sys.media.ohos_ic_public_cancel', 16, 16],
416          bundleName: '__harDefaultBundleName__',
417          moduleName: '__harDefaultModuleName__',
418        },
419        focusable: false,
420        isShowMargin: {
421          id: -1,
422          type: 10002,
423          params: ['sys.float.chip_show_close_icon_margin'],
424          bundleName: '__harDefaultBundleName__',
425          moduleName: '__harDefaultModuleName__',
426        },
427      },
428      defaultSymbol: {
429        normalFontColor: [
430          {
431            id: -1,
432            type: 10001,
433            params: ['sys.color.ohos_id_color_secondary'],
434            bundleName: '__harDefaultBundleName__',
435            moduleName: '__harDefaultModuleName__',
436          },
437        ],
438        activatedFontColor: [
439          {
440            id: -1,
441            type: 10001,
442            params: ['sys.color.ohos_id_color_text_primary_contrary'],
443            bundleName: '__harDefaultBundleName__',
444            moduleName: '__harDefaultModuleName__',
445          },
446        ],
447        smallSymbolFontSize: LengthMetrics.resource({
448          id: -1,
449          type: 10002,
450          params: ['sys.float.chip_normal_icon_size'],
451          bundleName: '__harDefaultBundleName__',
452          moduleName: '__harDefaultModuleName__',
453        }).value,
454        normalSymbolFontSize: LengthMetrics.resource({
455          id: -1,
456          type: 10002,
457          params: ['sys.float.chip_small_icon_size'],
458          bundleName: '__harDefaultBundleName__',
459          moduleName: '__harDefaultModuleName__',
460        }).value,
461        defaultEffect: -1,
462      },
463      chipNode: {
464        suitAgeScale: 1.75,
465        minLabelWidth: 12,
466        normalHeight: {
467          id: -1,
468          type: 10002,
469          params: ['sys.float.chip_normal_height'],
470          bundleName: '__harDefaultBundleName__',
471          moduleName: '__harDefaultModuleName__',
472        },
473        smallHeight: {
474          id: -1,
475          type: 10002,
476          params: ['sys.float.chip_small_height'],
477          bundleName: '__harDefaultBundleName__',
478          moduleName: '__harDefaultModuleName__',
479        },
480        enabled: true,
481        activated: false,
482        backgroundColor: {
483          id: -1,
484          type: 10001,
485          params: ['sys.color.chip_background_color'],
486          bundleName: '__harDefaultBundleName__',
487          moduleName: '__harDefaultModuleName__',
488        },
489        activatedBackgroundColor: {
490          id: -1,
491          type: 10001,
492          params: ['sys.color.chip_container_activated_color'],
493          bundleName: '__harDefaultBundleName__',
494          moduleName: '__harDefaultModuleName__',
495        },
496        focusOutlineColor: {
497          id: -1,
498          type: 10001,
499          params: ['sys.color.ohos_id_color_focused_outline'],
500          bundleName: '__harDefaultBundleName__',
501          moduleName: '__harDefaultModuleName__',
502        },
503        focusOutlineMargin: 2,
504        borderColor: {
505          id: -1,
506          type: 10001,
507          params: ['sys.color.chip_border_color'],
508          bundleName: '__harDefaultBundleName__',
509          moduleName: '__harDefaultModuleName__',
510        },
511        defaultBorderWidth: {
512          id: -1,
513          type: 10002,
514          params: ['sys.float.chip_border_width'],
515          bundleName: '__harDefaultBundleName__',
516          moduleName: '__harDefaultModuleName__',
517        },
518        activatedBorderColor: {
519          id: -1,
520          type: 10001,
521          params: ['sys.color.chip_activated_border_color'],
522          bundleName: '__harDefaultBundleName__',
523          moduleName: '__harDefaultModuleName__',
524        },
525        normalBorderRadius: {
526          id: -1,
527          type: 10002,
528          params: ['sys.float.chip_border_radius_normal'],
529          bundleName: '__harDefaultBundleName__',
530          moduleName: '__harDefaultModuleName__',
531        },
532        smallBorderRadius: {
533          id: -1,
534          type: 10002,
535          params: ['sys.float.chip_border_radius_small'],
536          bundleName: '__harDefaultBundleName__',
537          moduleName: '__harDefaultModuleName__',
538        },
539        borderWidth: 2,
540        focusBtnScaleX: {
541          id: -1,
542          type: 10002,
543          params: ['sys.float.chip_focused_btn_scale'],
544          bundleName: '__harDefaultBundleName__',
545          moduleName: '__harDefaultModuleName__',
546        },
547        focusBtnScaleY: {
548          id: -1,
549          type: 10002,
550          params: ['sys.float.chip_focused_btn_scale'],
551          bundleName: '__harDefaultBundleName__',
552          moduleName: '__harDefaultModuleName__',
553        },
554        localizedNormalPadding: {
555          start: LengthMetrics.resource({
556            id: -1,
557            type: 10002,
558            params: ['sys.float.chip_normal_text_padding'],
559            bundleName: '__harDefaultBundleName__',
560            moduleName: '__harDefaultModuleName__',
561          }),
562          end: LengthMetrics.resource({
563            id: -1,
564            type: 10002,
565            params: ['sys.float.chip_normal_text_padding'],
566            bundleName: '__harDefaultBundleName__',
567            moduleName: '__harDefaultModuleName__',
568          }),
569          top: LengthMetrics.vp(4),
570          bottom: LengthMetrics.vp(4),
571        },
572        localizedSmallPadding: {
573          start: LengthMetrics.resource({
574            id: -1,
575            type: 10002,
576            params: ['sys.float.chip_small_text_padding'],
577            bundleName: '__harDefaultBundleName__',
578            moduleName: '__harDefaultModuleName__',
579          }),
580          end: LengthMetrics.resource({
581            id: -1,
582            type: 10002,
583            params: ['sys.float.chip_small_text_padding'],
584            bundleName: '__harDefaultBundleName__',
585            moduleName: '__harDefaultModuleName__',
586          }),
587          top: LengthMetrics.vp(4),
588          bottom: LengthMetrics.vp(4),
589        },
590        hoverBlendColor: {
591          id: -1,
592          type: 10001,
593          params: ['sys.color.chip_hover_color'],
594          bundleName: '__harDefaultBundleName__',
595          moduleName: '__harDefaultModuleName__',
596        },
597        pressedBlendColor: {
598          id: -1,
599          type: 10001,
600          params: ['sys.color.chip_press_color'],
601          bundleName: '__harDefaultBundleName__',
602          moduleName: '__harDefaultModuleName__',
603        },
604        focusBgColor: {
605          id: -1,
606          type: 10001,
607          params: ['sys.color.chip_focus_color'],
608          bundleName: '__harDefaultBundleName__',
609          moduleName: '__harDefaultModuleName__',
610        },
611        focusActivatedBgColor: {
612          id: -1,
613          type: 10001,
614          params: ['sys.color.chip_container_activated_focus_color'],
615          bundleName: '__harDefaultBundleName__',
616          moduleName: '__harDefaultModuleName__',
617        },
618        opacity: { normal: 1, hover: 0.95, pressed: 0.9 },
619        normalShadowStyle: {
620          id: -1,
621          type: 10002,
622          params: ['sys.float.chip_normal_shadow_style'],
623          bundleName: '__harDefaultBundleName__',
624          moduleName: '__harDefaultModuleName__',
625        },
626        smallShadowStyle: {
627          id: -1,
628          type: 10002,
629          params: ['sys.float.chip_small_shadow_style'],
630          bundleName: '__harDefaultBundleName__',
631          moduleName: '__harDefaultModuleName__',
632        },
633        breakPointConstraintWidth: {
634          breakPointMinWidth: 128,
635          breakPointSmMaxWidth: 156,
636          breakPointMdMaxWidth: 280,
637          breakPointLgMaxWidth: 400,
638        },
639      },
640    };
641    this.__chipSize = new SynchedPropertyObjectOneWayPU(params.chipSize, this, 'chipSize');
642    this.__allowClose = new SynchedPropertySimpleOneWayPU(params.allowClose, this, 'allowClose');
643    this.__closeOptions = new SynchedPropertyObjectOneWayPU(params.closeOptions, this, 'closeOptions');
644    this.__chipDirection = new SynchedPropertySimpleOneWayPU(params.chipDirection, this, 'chipDirection');
645    this.__prefixIcon = new SynchedPropertyObjectOneWayPU(params.prefixIcon, this, 'prefixIcon');
646    this.__prefixSymbol = new SynchedPropertyObjectOneWayPU(params.prefixSymbol, this, 'prefixSymbol');
647    this.__label = new SynchedPropertyObjectOneWayPU(params.label, this, 'label');
648    this.__suffixIcon = new SynchedPropertyObjectOneWayPU(params.suffixIcon, this, 'suffixIcon');
649    this.__suffixSymbol = new SynchedPropertyObjectOneWayPU(params.suffixSymbol, this, 'suffixSymbol');
650    this.__suffixSymbolOptions = new SynchedPropertyObjectOneWayPU(
651      params.suffixSymbolOptions,
652      this,
653      'suffixSymbolOptions'
654    );
655    this.__chipNodeBackgroundColor = new SynchedPropertyObjectOneWayPU(
656      params.chipNodeBackgroundColor,
657      this,
658      'chipNodeBackgroundColor'
659    );
660    this.__chipNodeActivatedBackgroundColor = new SynchedPropertyObjectOneWayPU(
661      params.chipNodeActivatedBackgroundColor,
662      this,
663      'chipNodeActivatedBackgroundColor'
664    );
665    this.__isHovering = new ObservedPropertySimplePU(false, this, 'isHovering');
666    this.__chipNodeRadius = new SynchedPropertyObjectOneWayPU(params.chipNodeRadius, this, 'chipNodeRadius');
667    this.__chipEnabled = new SynchedPropertySimpleOneWayPU(params.chipEnabled, this, 'chipEnabled');
668    this.__chipActivated = new SynchedPropertySimpleOneWayPU(params.chipActivated, this, 'chipActivated');
669    this.__chipAccessibilitySelectedType = new SynchedPropertySimpleOneWayPU(
670      params.chipAccessibilitySelectedType,
671      this,
672      'chipAccessibilitySelectedType'
673    );
674    this.__chipAccessibilityDescription = new SynchedPropertyObjectOneWayPU(
675      params.chipAccessibilityDescription,
676      this,
677      'chipAccessibilityDescription'
678    );
679    this.__chipAccessibilityLevel = new SynchedPropertySimpleOneWayPU(
680      params.chipAccessibilityLevel,
681      this,
682      'chipAccessibilityLevel'
683    );
684    this.__isHover = new ObservedPropertySimplePU(false, this, 'isHover');
685    this.__chipScale = new ObservedPropertyObjectPU({ x: 1, y: 1 }, this, 'chipScale');
686    this.__chipOpacity = new ObservedPropertySimplePU(1, this, 'chipOpacity');
687    this.__chipBlendColor = new ObservedPropertyObjectPU(Color.Transparent, this, 'chipBlendColor');
688    this.__deleteChip = new ObservedPropertySimplePU(false, this, 'deleteChip');
689    this.__chipNodeOnFocus = new ObservedPropertySimplePU(false, this, 'chipNodeOnFocus');
690    this.__useDefaultSuffixIcon = new ObservedPropertySimplePU(false, this, 'useDefaultSuffixIcon');
691    this.chipNodeSize = {};
692    this.onClose = noop;
693    this.onClicked = noop;
694    this.__suffixIconOnFocus = new ObservedPropertySimplePU(false, this, 'suffixIconOnFocus');
695    this.__chipBreakPoints = new ObservedPropertySimplePU(BreakPointsType.SM, this, 'chipBreakPoints');
696    this.smListener = mediaquery.matchMediaSync('(0vp<width) and (width<600vp)');
697    this.mdListener = mediaquery.matchMediaSync('(600vp<=width) and (width<840vp)');
698    this.lgListener = mediaquery.matchMediaSync('(840vp<=width)');
699    this.isSuffixIconFocusStyleCustomized = this.resourceToNumber(this.theme.suffixIcon.isShowMargin, 0) !== 0;
700    this.__isShowPressedBackGroundColor = new ObservedPropertySimplePU(false, this, 'isShowPressedBackGroundColor');
701    this.__fontSizeScale = new ObservedPropertyObjectPU(0, this, 'fontSizeScale');
702    this.__fontWeightScale = new ObservedPropertyObjectPU(0, this, 'fontWeightScale');
703    this.callbacks = {
704      onConfigurationUpdated: configuration => {
705        this.fontSizeScale = configuration.fontSizeScale;
706        this.fontWeightScale = configuration.fontWeightScale;
707      },
708      onMemoryLevel() {},
709    };
710    this.callbackId = undefined;
711    this.__prefixSymbolWidth = new ObservedPropertyObjectPU(
712      this.toVp(componentUtils.getRectangleById('PrefixSymbolGlyph')?.size?.width),
713      this,
714      'prefixSymbolWidth'
715    );
716    this.__suffixSymbolWidth = new ObservedPropertyObjectPU(
717      this.toVp(componentUtils.getRectangleById('SuffixSymbolGlyph')?.size?.width),
718      this,
719      'suffixSymbolWidth'
720    );
721    this.__allowCloseSymbolWidth = new ObservedPropertyObjectPU(
722      this.toVp(componentUtils.getRectangleById('AllowCloseSymbolGlyph')?.size?.width),
723      this,
724      'allowCloseSymbolWidth'
725    );
726    this.__symbolEffect = new ObservedPropertyObjectPU(new SymbolEffect(), this, 'symbolEffect');
727    this.setInitiallyProvidedValue(params);
728    this.finalizeConstruction();
729  }
730  setInitiallyProvidedValue(params) {
731    if (params.theme !== undefined) {
732      this.theme = params.theme;
733    }
734    if (params.chipSize === undefined) {
735      this.__chipSize.set(ChipSize.NORMAL);
736    }
737    if (params.allowClose === undefined) {
738      this.__allowClose.set(true);
739    }
740    if (params.chipDirection === undefined) {
741      this.__chipDirection.set(Direction.Auto);
742    }
743    if (params.prefixIcon === undefined) {
744      this.__prefixIcon.set({ src: '' });
745    }
746    if (params.label === undefined) {
747      this.__label.set({ text: '' });
748    }
749    if (params.suffixIcon === undefined) {
750      this.__suffixIcon.set({ src: '' });
751    }
752    if (params.chipNodeBackgroundColor === undefined) {
753      this.__chipNodeBackgroundColor.set(this.theme.chipNode.backgroundColor);
754    }
755    if (params.chipNodeActivatedBackgroundColor === undefined) {
756      this.__chipNodeActivatedBackgroundColor.set(this.theme.chipNode.activatedBackgroundColor);
757    }
758    if (params.isHovering !== undefined) {
759      this.isHovering = params.isHovering;
760    }
761    if (params.chipNodeRadius === undefined) {
762      this.__chipNodeRadius.set(void 0);
763    }
764    if (params.chipEnabled === undefined) {
765      this.__chipEnabled.set(true);
766    }
767    if (params.isHover !== undefined) {
768      this.isHover = params.isHover;
769    }
770    if (params.chipScale !== undefined) {
771      this.chipScale = params.chipScale;
772    }
773    if (params.chipOpacity !== undefined) {
774      this.chipOpacity = params.chipOpacity;
775    }
776    if (params.chipBlendColor !== undefined) {
777      this.chipBlendColor = params.chipBlendColor;
778    }
779    if (params.deleteChip !== undefined) {
780      this.deleteChip = params.deleteChip;
781    }
782    if (params.chipNodeOnFocus !== undefined) {
783      this.chipNodeOnFocus = params.chipNodeOnFocus;
784    }
785    if (params.useDefaultSuffixIcon !== undefined) {
786      this.useDefaultSuffixIcon = params.useDefaultSuffixIcon;
787    }
788    if (params.chipNodeSize !== undefined) {
789      this.chipNodeSize = params.chipNodeSize;
790    }
791    if (params.onClose !== undefined) {
792      this.onClose = params.onClose;
793    }
794    if (params.onClicked !== undefined) {
795      this.onClicked = params.onClicked;
796    }
797    if (params.suffixIconOnFocus !== undefined) {
798      this.suffixIconOnFocus = params.suffixIconOnFocus;
799    }
800    if (params.chipBreakPoints !== undefined) {
801      this.chipBreakPoints = params.chipBreakPoints;
802    }
803    if (params.smListener !== undefined) {
804      this.smListener = params.smListener;
805    }
806    if (params.mdListener !== undefined) {
807      this.mdListener = params.mdListener;
808    }
809    if (params.lgListener !== undefined) {
810      this.lgListener = params.lgListener;
811    }
812    if (params.isSuffixIconFocusStyleCustomized !== undefined) {
813      this.isSuffixIconFocusStyleCustomized = params.isSuffixIconFocusStyleCustomized;
814    }
815    if (params.isShowPressedBackGroundColor !== undefined) {
816      this.isShowPressedBackGroundColor = params.isShowPressedBackGroundColor;
817    }
818    if (params.fontSizeScale !== undefined) {
819      this.fontSizeScale = params.fontSizeScale;
820    }
821    if (params.fontWeightScale !== undefined) {
822      this.fontWeightScale = params.fontWeightScale;
823    }
824    if (params.callbacks !== undefined) {
825      this.callbacks = params.callbacks;
826    }
827    if (params.callbackId !== undefined) {
828      this.callbackId = params.callbackId;
829    }
830    if (params.prefixSymbolWidth !== undefined) {
831      this.prefixSymbolWidth = params.prefixSymbolWidth;
832    }
833    if (params.suffixSymbolWidth !== undefined) {
834      this.suffixSymbolWidth = params.suffixSymbolWidth;
835    }
836    if (params.allowCloseSymbolWidth !== undefined) {
837      this.allowCloseSymbolWidth = params.allowCloseSymbolWidth;
838    }
839    if (params.symbolEffect !== undefined) {
840      this.symbolEffect = params.symbolEffect;
841    }
842  }
843  updateStateVars(params) {
844    this.__chipSize.reset(params.chipSize);
845    this.__allowClose.reset(params.allowClose);
846    this.__closeOptions.reset(params.closeOptions);
847    this.__chipDirection.reset(params.chipDirection);
848    this.__prefixIcon.reset(params.prefixIcon);
849    this.__prefixSymbol.reset(params.prefixSymbol);
850    this.__label.reset(params.label);
851    this.__suffixIcon.reset(params.suffixIcon);
852    this.__suffixSymbol.reset(params.suffixSymbol);
853    this.__suffixSymbolOptions.reset(params.suffixSymbolOptions);
854    this.__chipNodeBackgroundColor.reset(params.chipNodeBackgroundColor);
855    this.__chipNodeActivatedBackgroundColor.reset(params.chipNodeActivatedBackgroundColor);
856    this.__chipNodeRadius.reset(params.chipNodeRadius);
857    this.__chipEnabled.reset(params.chipEnabled);
858    this.__chipActivated.reset(params.chipActivated);
859    this.__chipAccessibilitySelectedType.reset(params.chipAccessibilitySelectedType);
860    this.__chipAccessibilityDescription.reset(params.chipAccessibilityDescription);
861    this.__chipAccessibilityLevel.reset(params.chipAccessibilityLevel);
862  }
863  purgeVariableDependenciesOnElmtId(rmElmtId) {
864    this.__chipSize.purgeDependencyOnElmtId(rmElmtId);
865    this.__allowClose.purgeDependencyOnElmtId(rmElmtId);
866    this.__closeOptions.purgeDependencyOnElmtId(rmElmtId);
867    this.__chipDirection.purgeDependencyOnElmtId(rmElmtId);
868    this.__prefixIcon.purgeDependencyOnElmtId(rmElmtId);
869    this.__prefixSymbol.purgeDependencyOnElmtId(rmElmtId);
870    this.__label.purgeDependencyOnElmtId(rmElmtId);
871    this.__suffixIcon.purgeDependencyOnElmtId(rmElmtId);
872    this.__suffixSymbol.purgeDependencyOnElmtId(rmElmtId);
873    this.__suffixSymbolOptions.purgeDependencyOnElmtId(rmElmtId);
874    this.__chipNodeBackgroundColor.purgeDependencyOnElmtId(rmElmtId);
875    this.__chipNodeActivatedBackgroundColor.purgeDependencyOnElmtId(rmElmtId);
876    this.__isHovering.purgeDependencyOnElmtId(rmElmtId);
877    this.__chipNodeRadius.purgeDependencyOnElmtId(rmElmtId);
878    this.__chipEnabled.purgeDependencyOnElmtId(rmElmtId);
879    this.__chipActivated.purgeDependencyOnElmtId(rmElmtId);
880    this.__chipAccessibilitySelectedType.purgeDependencyOnElmtId(rmElmtId);
881    this.__chipAccessibilityDescription.purgeDependencyOnElmtId(rmElmtId);
882    this.__chipAccessibilityLevel.purgeDependencyOnElmtId(rmElmtId);
883    this.__isHover.purgeDependencyOnElmtId(rmElmtId);
884    this.__chipScale.purgeDependencyOnElmtId(rmElmtId);
885    this.__chipOpacity.purgeDependencyOnElmtId(rmElmtId);
886    this.__chipBlendColor.purgeDependencyOnElmtId(rmElmtId);
887    this.__deleteChip.purgeDependencyOnElmtId(rmElmtId);
888    this.__chipNodeOnFocus.purgeDependencyOnElmtId(rmElmtId);
889    this.__useDefaultSuffixIcon.purgeDependencyOnElmtId(rmElmtId);
890    this.__suffixIconOnFocus.purgeDependencyOnElmtId(rmElmtId);
891    this.__chipBreakPoints.purgeDependencyOnElmtId(rmElmtId);
892    this.__isShowPressedBackGroundColor.purgeDependencyOnElmtId(rmElmtId);
893    this.__fontSizeScale.purgeDependencyOnElmtId(rmElmtId);
894    this.__fontWeightScale.purgeDependencyOnElmtId(rmElmtId);
895    this.__prefixSymbolWidth.purgeDependencyOnElmtId(rmElmtId);
896    this.__suffixSymbolWidth.purgeDependencyOnElmtId(rmElmtId);
897    this.__allowCloseSymbolWidth.purgeDependencyOnElmtId(rmElmtId);
898    this.__symbolEffect.purgeDependencyOnElmtId(rmElmtId);
899  }
900  aboutToBeDeleted() {
901    this.__chipSize.aboutToBeDeleted();
902    this.__allowClose.aboutToBeDeleted();
903    this.__closeOptions.aboutToBeDeleted();
904    this.__chipDirection.aboutToBeDeleted();
905    this.__prefixIcon.aboutToBeDeleted();
906    this.__prefixSymbol.aboutToBeDeleted();
907    this.__label.aboutToBeDeleted();
908    this.__suffixIcon.aboutToBeDeleted();
909    this.__suffixSymbol.aboutToBeDeleted();
910    this.__suffixSymbolOptions.aboutToBeDeleted();
911    this.__chipNodeBackgroundColor.aboutToBeDeleted();
912    this.__chipNodeActivatedBackgroundColor.aboutToBeDeleted();
913    this.__isHovering.aboutToBeDeleted();
914    this.__chipNodeRadius.aboutToBeDeleted();
915    this.__chipEnabled.aboutToBeDeleted();
916    this.__chipActivated.aboutToBeDeleted();
917    this.__chipAccessibilitySelectedType.aboutToBeDeleted();
918    this.__chipAccessibilityDescription.aboutToBeDeleted();
919    this.__chipAccessibilityLevel.aboutToBeDeleted();
920    this.__isHover.aboutToBeDeleted();
921    this.__chipScale.aboutToBeDeleted();
922    this.__chipOpacity.aboutToBeDeleted();
923    this.__chipBlendColor.aboutToBeDeleted();
924    this.__deleteChip.aboutToBeDeleted();
925    this.__chipNodeOnFocus.aboutToBeDeleted();
926    this.__useDefaultSuffixIcon.aboutToBeDeleted();
927    this.__suffixIconOnFocus.aboutToBeDeleted();
928    this.__chipBreakPoints.aboutToBeDeleted();
929    this.__isShowPressedBackGroundColor.aboutToBeDeleted();
930    this.__fontSizeScale.aboutToBeDeleted();
931    this.__fontWeightScale.aboutToBeDeleted();
932    this.__prefixSymbolWidth.aboutToBeDeleted();
933    this.__suffixSymbolWidth.aboutToBeDeleted();
934    this.__allowCloseSymbolWidth.aboutToBeDeleted();
935    this.__symbolEffect.aboutToBeDeleted();
936    SubscriberManager.Get().delete(this.id__());
937    this.aboutToBeDeletedInternal();
938  }
939  get chipSize() {
940    return this.__chipSize.get();
941  }
942  set chipSize(newValue) {
943    this.__chipSize.set(newValue);
944  }
945  get allowClose() {
946    return this.__allowClose.get();
947  }
948  set allowClose(newValue) {
949    this.__allowClose.set(newValue);
950  }
951  get closeOptions() {
952    return this.__closeOptions.get();
953  }
954  set closeOptions(newValue) {
955    this.__closeOptions.set(newValue);
956  }
957  get chipDirection() {
958    return this.__chipDirection.get();
959  }
960  set chipDirection(newValue) {
961    this.__chipDirection.set(newValue);
962  }
963  get prefixIcon() {
964    return this.__prefixIcon.get();
965  }
966  set prefixIcon(newValue) {
967    this.__prefixIcon.set(newValue);
968  }
969  get prefixSymbol() {
970    return this.__prefixSymbol.get();
971  }
972  set prefixSymbol(newValue) {
973    this.__prefixSymbol.set(newValue);
974  }
975  get label() {
976    return this.__label.get();
977  }
978  set label(newValue) {
979    this.__label.set(newValue);
980  }
981  get suffixIcon() {
982    return this.__suffixIcon.get();
983  }
984  set suffixIcon(newValue) {
985    this.__suffixIcon.set(newValue);
986  }
987  get suffixSymbol() {
988    return this.__suffixSymbol.get();
989  }
990  set suffixSymbol(newValue) {
991    this.__suffixSymbol.set(newValue);
992  }
993  get suffixSymbolOptions() {
994    return this.__suffixSymbolOptions.get();
995  }
996  set suffixSymbolOptions(newValue) {
997    this.__suffixSymbolOptions.set(newValue);
998  }
999  get chipNodeBackgroundColor() {
1000    return this.__chipNodeBackgroundColor.get();
1001  }
1002  set chipNodeBackgroundColor(newValue) {
1003    this.__chipNodeBackgroundColor.set(newValue);
1004  }
1005  get chipNodeActivatedBackgroundColor() {
1006    return this.__chipNodeActivatedBackgroundColor.get();
1007  }
1008  set chipNodeActivatedBackgroundColor(newValue) {
1009    this.__chipNodeActivatedBackgroundColor.set(newValue);
1010  }
1011  get isHovering() {
1012    return this.__isHovering.get();
1013  }
1014  set isHovering(newValue) {
1015    this.__isHovering.set(newValue);
1016  }
1017  get chipNodeRadius() {
1018    return this.__chipNodeRadius.get();
1019  }
1020  set chipNodeRadius(newValue) {
1021    this.__chipNodeRadius.set(newValue);
1022  }
1023  get chipEnabled() {
1024    return this.__chipEnabled.get();
1025  }
1026  set chipEnabled(newValue) {
1027    this.__chipEnabled.set(newValue);
1028  }
1029  get chipActivated() {
1030    return this.__chipActivated.get();
1031  }
1032  set chipActivated(newValue) {
1033    this.__chipActivated.set(newValue);
1034  }
1035  get chipAccessibilitySelectedType() {
1036    return this.__chipAccessibilitySelectedType.get();
1037  }
1038  set chipAccessibilitySelectedType(newValue) {
1039    this.__chipAccessibilitySelectedType.set(newValue);
1040  }
1041  get chipAccessibilityDescription() {
1042    return this.__chipAccessibilityDescription.get();
1043  }
1044  set chipAccessibilityDescription(newValue) {
1045    this.__chipAccessibilityDescription.set(newValue);
1046  }
1047  get chipAccessibilityLevel() {
1048    return this.__chipAccessibilityLevel.get();
1049  }
1050  set chipAccessibilityLevel(newValue) {
1051    this.__chipAccessibilityLevel.set(newValue);
1052  }
1053  get isHover() {
1054    return this.__isHover.get();
1055  }
1056  set isHover(newValue) {
1057    this.__isHover.set(newValue);
1058  }
1059  get chipScale() {
1060    return this.__chipScale.get();
1061  }
1062  set chipScale(newValue) {
1063    this.__chipScale.set(newValue);
1064  }
1065  get chipOpacity() {
1066    return this.__chipOpacity.get();
1067  }
1068  set chipOpacity(newValue) {
1069    this.__chipOpacity.set(newValue);
1070  }
1071  get chipBlendColor() {
1072    return this.__chipBlendColor.get();
1073  }
1074  set chipBlendColor(newValue) {
1075    this.__chipBlendColor.set(newValue);
1076  }
1077  get deleteChip() {
1078    return this.__deleteChip.get();
1079  }
1080  set deleteChip(newValue) {
1081    this.__deleteChip.set(newValue);
1082  }
1083  get chipNodeOnFocus() {
1084    return this.__chipNodeOnFocus.get();
1085  }
1086  set chipNodeOnFocus(newValue) {
1087    this.__chipNodeOnFocus.set(newValue);
1088  }
1089  get useDefaultSuffixIcon() {
1090    return this.__useDefaultSuffixIcon.get();
1091  }
1092  set useDefaultSuffixIcon(newValue) {
1093    this.__useDefaultSuffixIcon.set(newValue);
1094  }
1095  get suffixIconOnFocus() {
1096    return this.__suffixIconOnFocus.get();
1097  }
1098  set suffixIconOnFocus(newValue) {
1099    this.__suffixIconOnFocus.set(newValue);
1100  }
1101  get chipBreakPoints() {
1102    return this.__chipBreakPoints.get();
1103  }
1104  set chipBreakPoints(newValue) {
1105    this.__chipBreakPoints.set(newValue);
1106  }
1107  get isShowPressedBackGroundColor() {
1108    return this.__isShowPressedBackGroundColor.get();
1109  }
1110  set isShowPressedBackGroundColor(newValue) {
1111    this.__isShowPressedBackGroundColor.set(newValue);
1112  }
1113  get fontSizeScale() {
1114    return this.__fontSizeScale.get();
1115  }
1116  set fontSizeScale(newValue) {
1117    this.__fontSizeScale.set(newValue);
1118  }
1119  get fontWeightScale() {
1120    return this.__fontWeightScale.get();
1121  }
1122  set fontWeightScale(newValue) {
1123    this.__fontWeightScale.set(newValue);
1124  }
1125  get prefixSymbolWidth() {
1126    return this.__prefixSymbolWidth.get();
1127  }
1128  set prefixSymbolWidth(newValue) {
1129    this.__prefixSymbolWidth.set(newValue);
1130  }
1131  get suffixSymbolWidth() {
1132    return this.__suffixSymbolWidth.get();
1133  }
1134  set suffixSymbolWidth(newValue) {
1135    this.__suffixSymbolWidth.set(newValue);
1136  }
1137  get allowCloseSymbolWidth() {
1138    return this.__allowCloseSymbolWidth.get();
1139  }
1140  set allowCloseSymbolWidth(newValue) {
1141    this.__allowCloseSymbolWidth.set(newValue);
1142  }
1143  get symbolEffect() {
1144    return this.__symbolEffect.get();
1145  }
1146  set symbolEffect(newValue) {
1147    this.__symbolEffect.set(newValue);
1148  }
1149  isChipSizeEnum() {
1150    return typeof this.chipSize === 'string';
1151  }
1152  isShowCloseIconMargin() {
1153    return this.resourceToNumber(this.theme.suffixIcon.isShowMargin, 0) !== 0 && this.allowClose;
1154  }
1155  getLabelFontSize() {
1156    if (this.label?.fontSize !== void 0 && this.toVp(this.label.fontSize) >= 0) {
1157      return this.label.fontSize;
1158    } else {
1159      if (this.isChipSizeEnum() && this.chipSize === ChipSize.SMALL) {
1160        try {
1161          resourceManager
1162            .getSystemResourceManager()
1163            .getNumberByName(this.theme.label.smallFontSize.params[0].split('.')[2]);
1164          return this.theme.label.smallFontSize;
1165        } catch (error) {
1166          return this.theme.label.defaultFontSize;
1167        }
1168      } else {
1169        try {
1170          resourceManager
1171            .getSystemResourceManager()
1172            .getNumberByName(this.theme.label.normalFontSize.params[0].split('.')[2]);
1173          return this.theme.label.normalFontSize;
1174        } catch (error) {
1175          return this.theme.label.defaultFontSize;
1176        }
1177      }
1178    }
1179  }
1180  defaultSymbolFontsize() {
1181    return this.isChipSizeEnum() && this.chipSize == ChipSize.SMALL
1182      ? this.theme.defaultSymbol.smallSymbolFontSize
1183      : this.theme.defaultSymbol.normalSymbolFontSize;
1184  }
1185  resourceToVp(resource) {
1186    let metrics = LengthMetrics.resource(resource);
1187    return this.lengthMetricsToVp(metrics);
1188  }
1189  getActiveFontColor() {
1190    return this.chipNodeOnFocus ? this.theme.label.focusActiveFontColor : this.theme.label.activatedFontColor;
1191  }
1192  getFontColor() {
1193    return this.chipNodeOnFocus ? this.theme.label.focusFontColor : this.theme.label.fontColor;
1194  }
1195  getLabelFontColor() {
1196    if (this.getChipActive()) {
1197      return this.label?.activatedFontColor ?? this.getActiveFontColor();
1198    }
1199    return this.label?.fontColor ?? this.getFontColor();
1200  }
1201  getLabelFontFamily() {
1202    return this.label?.fontFamily ?? this.theme.label.fontFamily;
1203  }
1204  getLabelFontWeight() {
1205    if (this.getChipActive()) {
1206      return FontWeight.Medium;
1207    }
1208    return this.resourceToNumber(this.theme.label.fontWeight, FontWeight.Regular);
1209  }
1210  lengthMetricsToVp(lengthMetrics) {
1211    let defaultValue = 0;
1212    if (lengthMetrics) {
1213      switch (lengthMetrics.unit) {
1214        case LengthUnit.PX:
1215          return px2vp(lengthMetrics.value);
1216        case LengthUnit.VP:
1217          return lengthMetrics.value;
1218        case LengthUnit.FP:
1219          return px2vp(fp2px(lengthMetrics.value));
1220        case LengthUnit.PERCENT:
1221          return Number.NEGATIVE_INFINITY;
1222        case LengthUnit.LPX:
1223          return px2vp(lpx2px(lengthMetrics.value));
1224      }
1225    }
1226    return defaultValue;
1227  }
1228  toVp(value) {
1229    if (value === void 0) {
1230      return Number.NEGATIVE_INFINITY;
1231    }
1232    switch (typeof value) {
1233      case 'number':
1234        return value;
1235      case 'object':
1236        try {
1237          let returnValue = this.lengthMetricsToVp(LengthMetrics.resource(value));
1238          if (returnValue === 0 && !isValidResource(getContext(this), value)) {
1239            return Number.NEGATIVE_INFINITY;
1240          }
1241          return returnValue;
1242        } catch (error) {
1243          return Number.NEGATIVE_INFINITY;
1244        }
1245      case 'string':
1246        let regex = new RegExp('(-?\\d+(?:\\.\\d+)?)_?(fp|vp|px|lpx|%)?$', 'i');
1247        let matches = value.match(regex);
1248        if (!matches) {
1249          return Number.NEGATIVE_INFINITY;
1250        }
1251        let length = Number(matches?.[1] ?? 0);
1252        let unit = matches?.[2] ?? 'vp';
1253        switch (unit.toLowerCase()) {
1254          case 'px':
1255            length = px2vp(length);
1256            break;
1257          case 'fp':
1258            length = px2vp(fp2px(length));
1259            break;
1260          case 'lpx':
1261            length = px2vp(lpx2px(length));
1262            break;
1263          case '%':
1264            length = Number.NEGATIVE_INFINITY;
1265            break;
1266          case 'vp':
1267            break;
1268          default:
1269            break;
1270        }
1271        return length;
1272      default:
1273        return Number.NEGATIVE_INFINITY;
1274    }
1275  }
1276  getChipNodeBorderWidth() {
1277    return this.resourceToVp(this.theme.chipNode.defaultBorderWidth);
1278  }
1279  getChipNodeBorderColor() {
1280    let themeChipNode = this.theme.chipNode;
1281    return this.getChipActive() ? themeChipNode.activatedBorderColor : themeChipNode.borderColor;
1282  }
1283  getLabelMargin() {
1284    let labelMargin = { left: 0, right: 0 };
1285    if (this.label?.labelMargin?.left !== void 0 && this.toVp(this.label.labelMargin.left) >= 0) {
1286      labelMargin.left = this.label?.labelMargin?.left;
1287    } else if (this.prefixSymbol?.normal || this.prefixSymbol?.activated || this.prefixIcon?.src) {
1288      if (this.isChipSizeEnum() && this.chipSize == ChipSize.SMALL) {
1289        labelMargin.left = this.theme.label.smallMargin.left;
1290      } else {
1291        labelMargin.left = this.theme.label.normalMargin.left;
1292      }
1293    }
1294    if (this.label?.labelMargin?.right !== void 0 && this.toVp(this.label.labelMargin.right) >= 0) {
1295      labelMargin.right = this.label?.labelMargin?.right;
1296    } else if (
1297      this.suffixSymbol?.normal ||
1298      this.suffixSymbol?.activated ||
1299      this.suffixIcon?.src ||
1300      this.useDefaultSuffixIcon
1301    ) {
1302      if (this.isChipSizeEnum() && this.chipSize == ChipSize.SMALL) {
1303        labelMargin.right = this.theme.label.smallMargin.right;
1304      } else {
1305        labelMargin.right = this.theme.label.normalMargin.right;
1306      }
1307    }
1308    return labelMargin;
1309  }
1310  getLocalizedLabelMargin() {
1311    let localizedLabelMargin = { start: LengthMetrics.vp(0), end: LengthMetrics.vp(0) };
1312    if (
1313      this.label?.localizedLabelMargin?.start?.value !== void 0 &&
1314      this.lengthMetricsToVp(this.label.localizedLabelMargin.start) >= 0
1315    ) {
1316      localizedLabelMargin.start = this.label?.localizedLabelMargin?.start;
1317    } else if (this.prefixSymbol?.normal || this.prefixSymbol?.activated || this.prefixIcon?.src) {
1318      if (this.isChipSizeEnum() && this.chipSize == ChipSize.SMALL) {
1319        localizedLabelMargin.start = this.theme.label.localizedSmallMargin.start;
1320      } else {
1321        localizedLabelMargin.start = this.theme.label.localizedNormalMargin.start;
1322      }
1323    }
1324    if (
1325      this.label?.localizedLabelMargin?.end?.value !== void 0 &&
1326      this.lengthMetricsToVp(this.label.localizedLabelMargin.end) >= 0
1327    ) {
1328      localizedLabelMargin.end = this.label?.localizedLabelMargin?.end;
1329    } else if (
1330      this.suffixSymbol?.normal ||
1331      this.suffixSymbol?.activated ||
1332      this.suffixIcon?.src ||
1333      this.useDefaultSuffixIcon ||
1334      this.isShowCloseIconMargin()
1335    ) {
1336      if (this.isChipSizeEnum() && this.chipSize == ChipSize.SMALL) {
1337        localizedLabelMargin.end = this.theme.label.localizedSmallMargin.end;
1338      } else {
1339        localizedLabelMargin.end = this.theme.label.localizedNormalMargin.end;
1340      }
1341    }
1342    return localizedLabelMargin;
1343  }
1344  getLabelStartEndVp() {
1345    let labelMargin = this.getLocalizedLabelMargin();
1346    if (this.label && this.label.labelMargin !== void 0 && this.label.localizedLabelMargin === void 0) {
1347      let margin = this.getLabelMargin();
1348      return {
1349        start: LengthMetrics.vp(this.toVp(margin.left)),
1350        end: LengthMetrics.vp(this.toVp(margin.right)),
1351      };
1352    }
1353    return {
1354      start: LengthMetrics.vp(this.lengthMetricsToVp(labelMargin.start)),
1355      end: LengthMetrics.vp(this.lengthMetricsToVp(labelMargin.end)),
1356    };
1357  }
1358  getActualLabelMargin() {
1359    let localizedLabelMargin = this.getLocalizedLabelMargin();
1360    if (this.label && this.label.localizedLabelMargin !== void 0) {
1361      return localizedLabelMargin;
1362    }
1363    if (this.label && this.label.labelMargin !== void 0) {
1364      return this.getLabelMargin();
1365    }
1366    return localizedLabelMargin;
1367  }
1368  getSuffixIconSize() {
1369    let suffixIconSize = { width: 0, height: 0 };
1370    if (this.suffixIcon?.size?.width !== void 0 && this.toVp(this.suffixIcon?.size?.width) >= 0) {
1371      suffixIconSize.width = this.suffixIcon?.size?.width;
1372    } else {
1373      if (this.getSuffixIconSrc()) {
1374        suffixIconSize.width =
1375          this.isChipSizeEnum() && this.chipSize == ChipSize.SMALL
1376            ? this.theme.suffixIcon.smallSize.width
1377            : this.theme.suffixIcon.normalSize.width;
1378      } else {
1379        suffixIconSize.width = 0;
1380      }
1381    }
1382    if (this.suffixIcon?.size?.height !== void 0 && this.toVp(this.suffixIcon?.size?.height) >= 0) {
1383      suffixIconSize.height = this.suffixIcon?.size?.height;
1384    } else {
1385      if (this.getSuffixIconSrc()) {
1386        suffixIconSize.height =
1387          this.isChipSizeEnum() && this.chipSize == ChipSize.SMALL
1388            ? this.theme.suffixIcon.smallSize.height
1389            : this.theme.suffixIcon.normalSize.height;
1390      } else {
1391        suffixIconSize.height = 0;
1392      }
1393    }
1394    return suffixIconSize;
1395  }
1396  getPrefixIconSize() {
1397    let prefixIconSize = { width: 0, height: 0 };
1398    if (this.prefixIcon?.size?.width !== void 0 && this.toVp(this.prefixIcon?.size?.width) >= 0) {
1399      prefixIconSize.width = this.prefixIcon?.size?.width;
1400    } else {
1401      if (this.prefixIcon?.src) {
1402        prefixIconSize.width =
1403          this.isChipSizeEnum() && this.chipSize == ChipSize.SMALL
1404            ? this.theme.prefixIcon.smallSize.width
1405            : this.theme.prefixIcon.normalSize.width;
1406      } else {
1407        prefixIconSize.width = 0;
1408      }
1409    }
1410    if (this.prefixIcon?.size?.height !== void 0 && this.toVp(this.prefixIcon?.size?.height) >= 0) {
1411      prefixIconSize.height = this.prefixIcon?.size?.height;
1412    } else {
1413      if (this.prefixIcon?.src) {
1414        prefixIconSize.height =
1415          this.isChipSizeEnum() && this.chipSize == ChipSize.SMALL
1416            ? this.theme.prefixIcon.smallSize.height
1417            : this.theme.prefixIcon.normalSize.height;
1418      } else {
1419        prefixIconSize.height = 0;
1420      }
1421    }
1422    return prefixIconSize;
1423  }
1424  getDefaultActiveIconColor(iconType) {
1425    if (iconType === IconType.PREFIX_ICON) {
1426      return this.chipNodeOnFocus
1427        ? this.theme.prefixIcon.focusActivatedColor
1428        : this.theme.prefixIcon.activatedFillColor;
1429    } else {
1430      return this.chipNodeOnFocus
1431        ? this.theme.suffixIcon.focusActivatedColor
1432        : this.theme.suffixIcon.activatedFillColor;
1433    }
1434  }
1435  getDefaultFillIconColor(iconType) {
1436    if (iconType === IconType.PREFIX_ICON) {
1437      return this.chipNodeOnFocus ? this.theme.prefixIcon.focusFillColor : this.theme.prefixIcon.fillColor;
1438    } else {
1439      return this.chipNodeOnFocus ? this.theme.suffixIcon.focusFillColor : this.theme.suffixIcon.fillColor;
1440    }
1441  }
1442  getSymbolActiveColor(iconType) {
1443    if (iconType === IconType.PREFIX_SYMBOL) {
1444      return this.getColorArray(
1445        this.prefixIcon?.activatedFillColor,
1446        this.theme.prefixIcon.focusActivatedColor,
1447        this.theme.prefixIcon.activatedFillColor
1448      );
1449    } else if (iconType === IconType.SUFFIX_SYMBOL) {
1450      return this.getColorArray(
1451        this.suffixIcon?.activatedFillColor,
1452        this.theme.suffixIcon.focusActivatedColor,
1453        this.theme.suffixIcon.activatedFillColor
1454      );
1455    } else {
1456      return this.theme.defaultSymbol.activatedFontColor;
1457    }
1458  }
1459  getSymbolFillColor(iconType) {
1460    if (iconType === IconType.PREFIX_SYMBOL) {
1461      return this.getColorArray(
1462        this.prefixIcon?.fillColor,
1463        this.theme.prefixIcon.focusFillColor,
1464        this.theme.prefixIcon.fillColor
1465      );
1466    } else if (iconType === IconType.SUFFIX_SYMBOL) {
1467      return this.getColorArray(
1468        this.suffixIcon?.fillColor,
1469        this.theme.suffixIcon.focusFillColor,
1470        this.theme.suffixIcon.fillColor
1471      );
1472    } else {
1473      return this.theme.defaultSymbol.normalFontColor;
1474    }
1475  }
1476  getColorArray(userDefined, focusColor, normalColor) {
1477    if (userDefined) {
1478      return [userDefined];
1479    }
1480    return this.chipNodeOnFocus ? [focusColor] : [normalColor];
1481  }
1482  getPrefixIconFilledColor() {
1483    if (this.getChipActive()) {
1484      return this.prefixIcon?.activatedFillColor ?? this.getDefaultActiveIconColor(IconType.PREFIX_ICON);
1485    }
1486    return this.prefixIcon?.fillColor ?? this.getDefaultFillIconColor(IconType.PREFIX_ICON);
1487  }
1488  getSuffixIconFilledColor() {
1489    if (this.getChipActive()) {
1490      return this.suffixIcon?.activatedFillColor ?? this.getDefaultActiveIconColor(IconType.SUFFIX_ICON);
1491    }
1492    return this.suffixIcon?.fillColor ?? this.getDefaultFillIconColor(IconType.SUFFIX_ICON);
1493  }
1494  getDefaultSymbolColor(iconType) {
1495    if (this.getChipActive()) {
1496      return this.getSymbolActiveColor(iconType);
1497    }
1498    return this.getSymbolFillColor(iconType);
1499  }
1500  getPrefixSymbolModifier() {
1501    if (this.getChipActive()) {
1502      return this.prefixSymbol?.activated;
1503    }
1504    return this.prefixSymbol?.normal;
1505  }
1506  getSuffixSymbolModifier() {
1507    if (this.getChipActive()) {
1508      return this.suffixSymbol?.activated;
1509    }
1510    return this.suffixSymbol?.normal;
1511  }
1512  getSuffixIconFocusable() {
1513    return (
1514      !this.isSuffixIconFocusStyleCustomized &&
1515      ((this.useDefaultSuffixIcon && (this.allowClose ?? true)) || this.suffixIcon?.action !== void 0)
1516    );
1517  }
1518  getChipNodePadding() {
1519    return this.isChipSizeEnum() && this.chipSize === ChipSize.SMALL
1520      ? this.theme.chipNode.localizedSmallPadding
1521      : this.theme.chipNode.localizedNormalPadding;
1522  }
1523  getChipNodeRadius() {
1524    if (this.chipNodeRadius !== void 0 && this.toVp(this.chipNodeRadius) >= 0) {
1525      return this.chipNodeRadius;
1526    } else {
1527      return this.isChipSizeEnum() && this.chipSize === ChipSize.SMALL
1528        ? this.theme.chipNode.smallBorderRadius
1529        : this.theme.chipNode.normalBorderRadius;
1530    }
1531  }
1532  getChipNodeBackGroundColor() {
1533    let currentColor;
1534    let themeChipNode = this.theme.chipNode;
1535    if (this.getChipActive()) {
1536      currentColor =
1537        this.chipNodeOnFocus && !this.isSetActiveChipBgColor()
1538          ? themeChipNode.focusActivatedBgColor
1539          : (this.chipNodeActivatedBackgroundColor ?? this.theme.chipNode.activatedBackgroundColor);
1540    } else {
1541      currentColor =
1542        this.chipNodeOnFocus && !this.isSetNormalChipBgColor()
1543          ? themeChipNode.focusBgColor
1544          : (this.chipNodeBackgroundColor ?? this.theme.chipNode.backgroundColor);
1545    }
1546    let sourceColor;
1547    try {
1548      sourceColor = ColorMetrics.resourceColor(currentColor);
1549    } catch (err) {
1550      hilog.error(0x3900, 'Ace', `Chip resourceColor, error: ${err.toString()}`);
1551      sourceColor = ColorMetrics.resourceColor(Color.Transparent);
1552    }
1553    if (!this.isShowPressedBackGroundColor) {
1554      return sourceColor.color;
1555    }
1556    return sourceColor.blendColor(ColorMetrics.resourceColor('#19000000')).color;
1557  }
1558  getChipNodeHeight() {
1559    if (this.isChipSizeEnum()) {
1560      return this.chipSize === ChipSize.SMALL ? this.theme.chipNode.smallHeight : this.theme.chipNode.normalHeight;
1561    } else {
1562      this.chipNodeSize = this.chipSize;
1563      return this.chipNodeSize?.height !== void 0 && this.toVp(this.chipNodeSize?.height) >= 0
1564        ? this.toVp(this.chipNodeSize?.height)
1565        : this.theme.chipNode.normalHeight;
1566    }
1567  }
1568  getLabelWidth() {
1569    return px2vp(
1570      measure.measureText({
1571        textContent: this.label?.text ?? '',
1572        fontSize: this.getLabelFontSize(),
1573        fontFamily: this.label?.fontFamily ?? this.theme.label.fontFamily,
1574        fontWeight: this.getLabelFontWeight(),
1575        maxLines: 1,
1576        overflow: TextOverflow.Ellipsis,
1577        textAlign: TextAlign.Center,
1578      })
1579    );
1580  }
1581  getCalculateChipNodeWidth() {
1582    let calWidth = 0;
1583    let startEndVp = this.getLabelStartEndVp();
1584    calWidth += this.getChipNodeBorderWidth() * 2;
1585    calWidth += this.getChipNodePadding().start?.value ?? 0;
1586    calWidth += this.toVp(this.getPrefixChipWidth());
1587    calWidth += this.toVp(startEndVp.start?.value ?? 0);
1588    calWidth += this.getLabelWidth();
1589    calWidth += this.toVp(startEndVp.end?.value ?? 0);
1590    calWidth += this.toVp(this.getSuffixChipWidth());
1591    calWidth += this.getChipNodePadding().end?.value ?? 0;
1592    return calWidth;
1593  }
1594  getPrefixChipWidth() {
1595    if (this.prefixSymbol?.normal || this.prefixSymbol?.activated) {
1596      return this.prefixSymbolWidth;
1597    } else if (this.prefixIcon?.src) {
1598      return this.getPrefixIconSize().width;
1599    } else {
1600      return 0;
1601    }
1602  }
1603  getSuffixChipWidth() {
1604    if (this.suffixSymbol?.normal || this.suffixSymbol?.activated) {
1605      return this.suffixSymbolWidth;
1606    } else if (this.suffixIcon?.src) {
1607      return this.getSuffixIconSize().width;
1608    } else if (!this.suffixIcon?.src && (this.allowClose ?? true)) {
1609      return this.allowCloseSymbolWidth;
1610    } else {
1611      return 0;
1612    }
1613  }
1614  getReserveChipNodeWidth() {
1615    return this.getCalculateChipNodeWidth() - this.getLabelWidth() + this.theme.chipNode.minLabelWidth;
1616  }
1617  getChipEnable() {
1618    return this.chipEnabled || this.chipEnabled === void 0;
1619  }
1620  getChipActive() {
1621    if (typeof this.chipActivated === 'undefined') {
1622      return false;
1623    }
1624    return this.chipActivated;
1625  }
1626  getChipNodeOpacity() {
1627    return this.chipOpacity;
1628  }
1629  handleTouch(event) {
1630    if (!this.getChipEnable()) {
1631      return;
1632    }
1633    if (this.isHover) {
1634      if (event.type === TouchType.Down || event.type === TouchType.Move) {
1635        this.isShowPressedBackGroundColor = true;
1636      } else if (event.type === TouchType.Up) {
1637        this.isShowPressedBackGroundColor = false;
1638      } else {
1639        this.isShowPressedBackGroundColor = false;
1640      }
1641    } else {
1642      if (event.type === TouchType.Down || event.type === TouchType.Move) {
1643        this.isShowPressedBackGroundColor = true;
1644      } else if (event.type === TouchType.Up) {
1645        this.isShowPressedBackGroundColor = false;
1646      } else {
1647        this.isShowPressedBackGroundColor = false;
1648      }
1649    }
1650  }
1651  hoverAnimate(isHover) {
1652    if (!this.getChipEnable()) {
1653      return;
1654    }
1655    this.isHover = isHover;
1656    if (this.isHover) {
1657      this.isShowPressedBackGroundColor = true;
1658    } else {
1659      this.isShowPressedBackGroundColor = false;
1660    }
1661  }
1662  deleteChipNodeAnimate() {
1663    Context.animateTo({ duration: 150, curve: Curve.Sharp }, () => {
1664      this.chipOpacity = 0;
1665      this.chipBlendColor = Color.Transparent;
1666    });
1667    Context.animateTo(
1668      {
1669        duration: 150,
1670        curve: Curve.FastOutLinearIn,
1671        onFinish: () => {
1672          this.deleteChip = true;
1673        },
1674      },
1675      () => {
1676        this.chipScale = { x: 0.85, y: 0.85 };
1677      }
1678    );
1679  }
1680  getSuffixIconSrc() {
1681    this.useDefaultSuffixIcon = !this.suffixIcon?.src && (this.allowClose ?? true);
1682    return this.useDefaultSuffixIcon ? this.theme.suffixIcon.defaultDeleteIcon : (this.suffixIcon?.src ?? void 0);
1683  }
1684  getChipNodeWidth() {
1685    if (!this.isChipSizeEnum()) {
1686      this.chipNodeSize = this.chipSize;
1687      if (this.chipNodeSize?.width !== void 0 && this.toVp(this.chipNodeSize.width) >= 0) {
1688        return this.toVp(this.chipNodeSize.width);
1689      }
1690    }
1691    let constraintWidth = this.getChipConstraintWidth();
1692    return Math.min(Math.max(this.getCalculateChipNodeWidth(), constraintWidth.minWidth), constraintWidth.maxWidth);
1693  }
1694  getFocusOverlaySize() {
1695    return {
1696      width: Math.max(this.getChipNodeWidth(), this.getChipConstraintWidth().minWidth) + 8,
1697      height: this.getChipNodeHeight() + 8,
1698    };
1699  }
1700  getChipConstraintWidth() {
1701    let calcMinWidth = this.getReserveChipNodeWidth();
1702    let constraintWidth = this.getCalculateChipNodeWidth();
1703    let constraintSize;
1704    switch (this.chipBreakPoints) {
1705      case BreakPointsType.SM:
1706        constraintSize = {
1707          minWidth: calcMinWidth,
1708          maxWidth: Math.min(constraintWidth, this.theme.chipNode.breakPointConstraintWidth.breakPointSmMaxWidth),
1709        };
1710        break;
1711      case BreakPointsType.MD:
1712        constraintSize = {
1713          minWidth: Math.max(constraintWidth, this.theme.chipNode.breakPointConstraintWidth.breakPointMinWidth),
1714          maxWidth: Math.min(constraintWidth, this.theme.chipNode.breakPointConstraintWidth.breakPointMdMaxWidth),
1715        };
1716        break;
1717      case BreakPointsType.LG:
1718        constraintSize = {
1719          minWidth: Math.max(constraintWidth, this.theme.chipNode.breakPointConstraintWidth.breakPointMinWidth),
1720          maxWidth: Math.min(constraintWidth, this.theme.chipNode.breakPointConstraintWidth.breakPointLgMaxWidth),
1721        };
1722        break;
1723      default:
1724        constraintSize = { minWidth: calcMinWidth, maxWidth: constraintWidth };
1725        break;
1726    }
1727    constraintSize.minWidth = Math.min(
1728      Math.max(this.getCalculateChipNodeWidth(), constraintSize.minWidth),
1729      constraintSize.maxWidth
1730    );
1731    constraintSize.minHeight = this.getChipNodeHeight();
1732    if (!this.isChipSizeEnum() && this.chipNodeSize?.height !== void 0 && this.toVp(this.chipNodeSize?.height) >= 0) {
1733      constraintSize.maxHeight = this.toVp(this.chipNodeSize.height);
1734      constraintSize.minHeight = this.toVp(this.chipNodeSize.height);
1735    }
1736    if (!this.isChipSizeEnum() && this.chipNodeSize?.width !== void 0 && this.toVp(this.chipNodeSize?.width) >= 0) {
1737      constraintSize.minWidth = this.toVp(this.chipNodeSize.width);
1738      constraintSize.maxWidth = this.toVp(this.chipNodeSize.width);
1739    } else if (this.toVp(this.fontSizeScale) >= this.theme.chipNode.suitAgeScale) {
1740      constraintSize.minWidth = void 0;
1741      constraintSize.maxWidth = void 0;
1742    }
1743    return constraintSize;
1744  }
1745  focusOverlay(parent = null) {
1746    this.observeComponentCreation2((elmtId, isInitialRender) => {
1747      Stack.create();
1748      Stack.direction(this.chipDirection);
1749      Stack.size({ width: 1, height: 1 });
1750      Stack.align(Alignment.Center);
1751    }, Stack);
1752    this.observeComponentCreation2((elmtId, isInitialRender) => {
1753      If.create();
1754      if (this.chipNodeOnFocus && !this.suffixIconOnFocus) {
1755        this.ifElseBranchUpdateFunction(0, () => {
1756          this.observeComponentCreation2((elmtId, isInitialRender) => {
1757            Stack.create();
1758            Stack.direction(this.chipDirection);
1759            Stack.borderRadius(this.toVp(this.getChipNodeRadius()) + 4);
1760            Stack.size(this.getFocusOverlaySize());
1761            Stack.borderColor(this.theme.chipNode.focusOutlineColor);
1762            Stack.borderWidth(this.theme.chipNode.borderWidth);
1763          }, Stack);
1764          Stack.pop();
1765        });
1766      } else {
1767        this.ifElseBranchUpdateFunction(1, () => {});
1768      }
1769    }, If);
1770    If.pop();
1771    Stack.pop();
1772  }
1773  aboutToAppear() {
1774    let uiContent = this.getUIContext();
1775    this.fontSizeScale = uiContent.getHostContext()?.config?.fontSizeScale ?? 1;
1776    this.smListener.on('change', mediaQueryResult => {
1777      if (mediaQueryResult.matches) {
1778        this.chipBreakPoints = BreakPointsType.SM;
1779      }
1780    });
1781    this.mdListener.on('change', mediaQueryResult => {
1782      if (mediaQueryResult.matches) {
1783        this.chipBreakPoints = BreakPointsType.MD;
1784      }
1785    });
1786    this.lgListener.on('change', mediaQueryResult => {
1787      if (mediaQueryResult.matches) {
1788        this.chipBreakPoints = BreakPointsType.LG;
1789      }
1790    });
1791    this.callbackId = this.getUIContext().getHostContext()?.getApplicationContext()?.on('environment', this.callbacks);
1792  }
1793  getVisibility() {
1794    if (this.toVp(this.getChipNodeHeight()) > 0) {
1795      return Visibility.Visible;
1796    } else {
1797      return Visibility.None;
1798    }
1799  }
1800  isSetActiveChipBgColor() {
1801    if (!this.chipNodeActivatedBackgroundColor) {
1802      return false;
1803    }
1804    try {
1805      return (
1806        ColorMetrics.resourceColor(this.chipNodeActivatedBackgroundColor).color !==
1807        ColorMetrics.resourceColor(this.theme.chipNode.activatedBackgroundColor).color
1808      );
1809    } catch (error) {
1810      console.error(`[Chip] failed to get resourceColor`);
1811      return false;
1812    }
1813  }
1814  isSetNormalChipBgColor() {
1815    if (!this.chipNodeBackgroundColor) {
1816      return false;
1817    }
1818    try {
1819      return (
1820        ColorMetrics.resourceColor(this.chipNodeBackgroundColor).color !==
1821        ColorMetrics.resourceColor(this.theme.chipNode.backgroundColor).color
1822      );
1823    } catch (error) {
1824      console.error(`[Chip] failed to get resourceColor`);
1825      return false;
1826    }
1827  }
1828  getShadowStyles() {
1829    if (!this.chipNodeOnFocus) {
1830      return undefined;
1831    }
1832    return this.resourceToNumber(
1833      this.isChipSizeEnum() && this.chipSize == ChipSize.SMALL
1834        ? this.theme.chipNode.smallShadowStyle
1835        : this.theme.chipNode.normalShadowStyle,
1836      -1
1837    );
1838  }
1839  aboutToDisappear() {
1840    this.smListener.off('change');
1841    this.mdListener.off('change');
1842    this.lgListener.off('change');
1843    if (this.callbackId) {
1844      this.getUIContext()?.getHostContext()?.getApplicationContext()?.off('environment', this.callbackId);
1845      this.callbackId = void 0;
1846    }
1847  }
1848  chipBuilder(parent = null) {
1849    this.observeComponentCreation2((elmtId, isInitialRender) => {
1850      Button.createWithChild();
1851      Button.constraintSize(this.getChipConstraintWidth());
1852      Button.direction(this.chipDirection);
1853      Button.type(ButtonType.Normal);
1854      Button.clip(false);
1855      Button.backgroundColor(this.getChipNodeBackGroundColor());
1856      Button.borderRadius(this.getChipNodeRadius());
1857      Button.borderWidth(this.getChipNodeBorderWidth());
1858      Button.borderColor(this.getChipNodeBorderColor());
1859      Button.enabled(this.getChipEnable());
1860      Button.scale(ObservedObject.GetRawObject(this.chipScale));
1861      Button.focusable(true);
1862      Button.opacity(this.getChipNodeOpacity());
1863      Button.shadow(this.getShadowStyles());
1864      Button.padding(0);
1865      Button.accessibilityGroup(true);
1866      Button.accessibilityDescription(this.getAccessibilityDescription());
1867      Button.accessibilityLevel(this.getAccessibilityLevel());
1868      Button.accessibilityChecked(this.getAccessibilityChecked());
1869      Button.accessibilitySelected(this.getAccessibilitySelected());
1870      Button.onFocus(() => {
1871        this.chipNodeOnFocus = true;
1872        if (this.isSuffixIconFocusStyleCustomized) {
1873          this.chipScale = {
1874            x: this.resourceToNumber(this.theme.chipNode.focusBtnScaleX, 1),
1875            y: this.resourceToNumber(this.theme.chipNode.focusBtnScaleY, 1),
1876          };
1877        }
1878      });
1879      Button.onBlur(() => {
1880        this.chipNodeOnFocus = false;
1881        if (this.isSuffixIconFocusStyleCustomized) {
1882          this.chipScale = {
1883            x: 1,
1884            y: 1,
1885          };
1886        }
1887      });
1888      Button.onTouch(event => {
1889        this.handleTouch(event);
1890      });
1891      Button.onHover(isHover => {
1892        if (isHover) {
1893          this.isShowPressedBackGroundColor = true;
1894        } else {
1895          if (!this.isShowPressedBackGroundColor && isHover) {
1896            this.isShowPressedBackGroundColor = true;
1897          } else {
1898            this.isShowPressedBackGroundColor = false;
1899          }
1900        }
1901      });
1902      Button.onKeyEvent(event => {
1903        if (!event || event.type === null || event.type !== KeyType.Down) {
1904          return;
1905        }
1906        let isDeleteChip = event.keyCode === KeyCode.KEYCODE_FORWARD_DEL && !this.suffixIconOnFocus;
1907        let isEnterDeleteChip =
1908          event.keyCode === KeyCode.KEYCODE_ENTER &&
1909          this.allowClose !== false &&
1910          !this.suffixIcon?.src &&
1911          this.isSuffixIconFocusStyleCustomized;
1912        if (isDeleteChip || isEnterDeleteChip) {
1913          this.deleteChipNodeAnimate();
1914        }
1915      });
1916      Button.onClick(this.onClicked === noop ? undefined : this.onClicked.bind(this));
1917    }, Button);
1918    this.observeComponentCreation2((elmtId, isInitialRender) => {
1919      Row.create();
1920      Row.direction(this.chipDirection);
1921      Row.alignItems(VerticalAlign.Center);
1922      Row.justifyContent(FlexAlign.Center);
1923      Row.padding(this.getChipNodePadding());
1924      Row.constraintSize(this.getChipConstraintWidth());
1925    }, Row);
1926    this.observeComponentCreation2((elmtId, isInitialRender) => {
1927      If.create();
1928      if (this.prefixSymbol?.normal || this.prefixSymbol?.activated) {
1929        this.ifElseBranchUpdateFunction(0, () => {
1930          this.observeComponentCreation2((elmtId, isInitialRender) => {
1931            SymbolGlyph.create();
1932            SymbolGlyph.fontSize(this.defaultSymbolFontsize());
1933            SymbolGlyph.fontColor(this.getDefaultSymbolColor(IconType.PREFIX_SYMBOL));
1934            SymbolGlyph.attributeModifier.bind(this)(this.getPrefixSymbolModifier());
1935            SymbolGlyph.effectStrategy(SymbolEffectStrategy.NONE);
1936            SymbolGlyph.symbolEffect(ObservedObject.GetRawObject(this.symbolEffect), false);
1937            SymbolGlyph.symbolEffect(
1938              ObservedObject.GetRawObject(this.symbolEffect),
1939              this.theme.defaultSymbol.defaultEffect
1940            );
1941            SymbolGlyph.onSizeChange((oldValue, newValue) => {
1942              this.prefixSymbolWidth = newValue?.width;
1943            });
1944            SymbolGlyph.key('PrefixSymbolGlyph');
1945          }, SymbolGlyph);
1946        });
1947      } else if (this.prefixIcon?.src !== '') {
1948        this.ifElseBranchUpdateFunction(1, () => {
1949          this.observeComponentCreation2((elmtId, isInitialRender) => {
1950            Image.create(this.prefixIcon?.src);
1951            Image.direction(this.chipDirection);
1952            Image.opacity(this.getChipNodeOpacity());
1953            Image.size(this.getPrefixIconSize());
1954            Image.fillColor(this.getPrefixIconFilledColor());
1955            Image.enabled(this.getChipEnable());
1956            Image.objectFit(ImageFit.Cover);
1957            Image.focusable(false);
1958            Image.flexShrink(0);
1959            Image.visibility(this.getVisibility());
1960            Image.draggable(false);
1961          }, Image);
1962        });
1963      } else {
1964        this.ifElseBranchUpdateFunction(2, () => {});
1965      }
1966    }, If);
1967    If.pop();
1968    this.observeComponentCreation2((elmtId, isInitialRender) => {
1969      Text.create(this.label?.text ?? '');
1970      Text.direction(this.chipDirection);
1971      Text.opacity(this.getChipNodeOpacity());
1972      Text.fontSize(this.getLabelFontSize());
1973      Text.fontColor(this.getLabelFontColor());
1974      Text.fontFamily(this.getLabelFontFamily());
1975      Text.fontWeight(this.getLabelFontWeight());
1976      Text.margin(this.getActualLabelMargin());
1977      Text.enabled(this.getChipEnable());
1978      Text.maxLines(1);
1979      Text.textOverflow({ overflow: TextOverflow.Ellipsis });
1980      Text.flexShrink(1);
1981      Text.focusable(true);
1982      Text.textAlign(TextAlign.Center);
1983      Text.visibility(this.getVisibility());
1984      Text.draggable(false);
1985    }, Text);
1986    Text.pop();
1987    this.observeComponentCreation2((elmtId, isInitialRender) => {
1988      If.create();
1989      if (this.suffixSymbol?.normal || this.suffixSymbol?.activated) {
1990        this.ifElseBranchUpdateFunction(0, () => {
1991          this.observeComponentCreation2((elmtId, isInitialRender) => {
1992            Button.createWithChild({ type: ButtonType.Normal });
1993            Button.onClick(this.getSuffixSymbolAction());
1994            Button.accessibilityText(this.getSuffixSymbolAccessibilityText());
1995            Button.accessibilityDescription(this.getSuffixSymbolAccessibilityDescription());
1996            Button.accessibilityLevel(this.getSuffixSymbolAccessibilityLevel());
1997            Button.backgroundColor(Color.Transparent);
1998            Button.borderRadius(0);
1999            Button.padding(0);
2000            Button.stateEffect(false);
2001            Button.focusable(!this.isSuffixIconFocusStyleCustomized);
2002          }, Button);
2003          this.observeComponentCreation2((elmtId, isInitialRender) => {
2004            SymbolGlyph.create();
2005            SymbolGlyph.fontSize(this.defaultSymbolFontsize());
2006            SymbolGlyph.fontColor(this.getDefaultSymbolColor(IconType.SUFFIX_SYMBOL));
2007            SymbolGlyph.attributeModifier.bind(this)(this.getSuffixSymbolModifier());
2008            SymbolGlyph.effectStrategy(SymbolEffectStrategy.NONE);
2009            SymbolGlyph.symbolEffect(ObservedObject.GetRawObject(this.symbolEffect), false);
2010            SymbolGlyph.symbolEffect(
2011              ObservedObject.GetRawObject(this.symbolEffect),
2012              this.theme.defaultSymbol.defaultEffect
2013            );
2014            SymbolGlyph.onSizeChange((oldValue, newValue) => {
2015              this.suffixSymbolWidth = newValue?.width;
2016            });
2017            SymbolGlyph.key('SuffixSymbolGlyph');
2018          }, SymbolGlyph);
2019          Button.pop();
2020        });
2021      } else if (this.suffixIcon?.src !== '') {
2022        this.ifElseBranchUpdateFunction(1, () => {
2023          this.observeComponentCreation2((elmtId, isInitialRender) => {
2024            Button.createWithChild({ type: ButtonType.Normal });
2025            Button.backgroundColor(Color.Transparent);
2026            Button.borderRadius(0);
2027            Button.padding(0);
2028            Button.size(this.getSuffixIconSize());
2029            Button.accessibilityText(this.getSuffixIconAccessibilityText());
2030            Button.accessibilityDescription(this.getSuffixIconAccessibilityDescription());
2031            Button.accessibilityLevel(this.getSuffixIconAccessibilityLevel());
2032            Button.onClick(() => {
2033              if (!this.getChipEnable()) {
2034                return;
2035              }
2036              if (this.suffixIcon?.action) {
2037                this.suffixIcon.action();
2038                return;
2039              }
2040              if ((this.allowClose ?? true) && this.useDefaultSuffixIcon) {
2041                this.onClose();
2042                this.deleteChipNodeAnimate();
2043                return;
2044              }
2045              this.onClicked();
2046            });
2047            Button.focusable(this.getSuffixIconFocusable());
2048          }, Button);
2049          this.observeComponentCreation2((elmtId, isInitialRender) => {
2050            Image.create(this.getSuffixIconSrc());
2051            Image.direction(this.chipDirection);
2052            Image.opacity(this.getChipNodeOpacity());
2053            Image.size(this.getSuffixIconSize());
2054            Image.fillColor(this.getSuffixIconFilledColor());
2055            Image.enabled(this.getChipEnable());
2056            Image.objectFit(ImageFit.Cover);
2057            Image.flexShrink(0);
2058            Image.visibility(this.getVisibility());
2059            Image.draggable(false);
2060            Image.onFocus(() => {
2061              this.suffixIconOnFocus = true;
2062            });
2063            Image.onBlur(() => {
2064              this.suffixIconOnFocus = false;
2065            });
2066          }, Image);
2067          Button.pop();
2068        });
2069      } else if (this.allowClose ?? true) {
2070        this.ifElseBranchUpdateFunction(2, () => {
2071          this.observeComponentCreation2((elmtId, isInitialRender) => {
2072            Button.createWithChild({ type: ButtonType.Normal });
2073            Button.backgroundColor(Color.Transparent);
2074            Button.borderRadius(0);
2075            Button.padding(0);
2076            Button.accessibilityText(this.getCloseIconAccessibilityText());
2077            Button.accessibilityDescription(this.getCloseIconAccessibilityDescription());
2078            Button.accessibilityLevel(this.getCloseIconAccessibilityLevel());
2079            Button.onClick(() => {
2080              if (!this.getChipEnable()) {
2081                return;
2082              }
2083              this.onClose();
2084              this.deleteChipNodeAnimate();
2085            });
2086            Button.focusable(!this.isSuffixIconFocusStyleCustomized);
2087          }, Button);
2088          this.observeComponentCreation2((elmtId, isInitialRender) => {
2089            SymbolGlyph.create({
2090              id: -1,
2091              type: 40000,
2092              params: ['sys.symbol.xmark'],
2093              bundleName: '__harDefaultBundleName__',
2094              moduleName: '__harDefaultModuleName__',
2095            });
2096            SymbolGlyph.fontSize(this.defaultSymbolFontsize());
2097            SymbolGlyph.fontColor(this.getDefaultSymbolColor(IconType.SUFFIX_SYMBOL));
2098            SymbolGlyph.onSizeChange((oldValue, newValue) => {
2099              this.allowCloseSymbolWidth = newValue?.width;
2100            });
2101            SymbolGlyph.key('AllowCloseSymbolGlyph');
2102          }, SymbolGlyph);
2103          Button.pop();
2104        });
2105      } else {
2106        this.ifElseBranchUpdateFunction(3, () => {});
2107      }
2108    }, If);
2109    If.pop();
2110    Row.pop();
2111    Button.pop();
2112  }
2113  getSuffixSymbolAccessibilityLevel() {
2114    if (this.getChipActive()) {
2115      if (
2116        this.suffixSymbolOptions?.activatedAccessibility?.accessibilityLevel === 'no' ||
2117        this.suffixSymbolOptions?.activatedAccessibility?.accessibilityLevel === 'no-hide-descendants'
2118      ) {
2119        return this.suffixSymbolOptions.activatedAccessibility.accessibilityLevel;
2120      }
2121      return this.suffixSymbolOptions?.action ? 'yes' : 'no';
2122    }
2123    if (
2124      this.suffixSymbolOptions?.normalAccessibility?.accessibilityLevel === 'no' ||
2125      this.suffixSymbolOptions?.normalAccessibility?.accessibilityLevel === 'no-hide-descendants'
2126    ) {
2127      return this.suffixSymbolOptions.normalAccessibility.accessibilityLevel;
2128    }
2129    return this.suffixSymbolOptions?.action ? 'yes' : 'no';
2130  }
2131  getSuffixSymbolAccessibilityDescription() {
2132    if (this.getChipActive()) {
2133      if (typeof this.suffixSymbolOptions?.activatedAccessibility?.accessibilityDescription !== 'undefined') {
2134        return this.suffixSymbolOptions.activatedAccessibility.accessibilityDescription;
2135      }
2136      return undefined;
2137    }
2138    if (typeof this.suffixSymbolOptions?.normalAccessibility?.accessibilityDescription !== 'undefined') {
2139      return this.suffixSymbolOptions.normalAccessibility.accessibilityDescription;
2140    }
2141    return undefined;
2142  }
2143  getSuffixSymbolAccessibilityText() {
2144    if (this.getChipActive()) {
2145      if (typeof this.suffixSymbolOptions?.activatedAccessibility?.accessibilityText !== 'undefined') {
2146        return this.suffixSymbolOptions.activatedAccessibility.accessibilityText;
2147      }
2148      return undefined;
2149    }
2150    if (typeof this.suffixSymbolOptions?.normalAccessibility?.accessibilityText !== 'undefined') {
2151      return this.suffixSymbolOptions.normalAccessibility.accessibilityText;
2152    }
2153    return undefined;
2154  }
2155  getSuffixSymbolAction() {
2156    if (typeof this.suffixSymbolOptions?.action === 'undefined') {
2157      return undefined;
2158    }
2159    return () => {
2160      if (!this.getChipEnable()) {
2161        return;
2162      }
2163      this.suffixSymbolOptions?.action?.();
2164    };
2165  }
2166  getAccessibilitySelected() {
2167    if (this.getChipAccessibilitySelectedType() === AccessibilitySelectedType.SELECTED) {
2168      return this.getChipActive();
2169    }
2170    return undefined;
2171  }
2172  getAccessibilityChecked() {
2173    if (this.getChipAccessibilitySelectedType() === AccessibilitySelectedType.CHECKED) {
2174      return this.getChipActive();
2175    }
2176    return undefined;
2177  }
2178  getChipAccessibilitySelectedType() {
2179    if (typeof this.chipActivated === 'undefined') {
2180      return AccessibilitySelectedType.CLICKED;
2181    }
2182    return this.chipAccessibilitySelectedType ?? AccessibilitySelectedType.CHECKED;
2183  }
2184  getCloseIconAccessibilityLevel() {
2185    if (
2186      this.closeOptions?.accessibilityLevel === 'no' ||
2187      this.closeOptions?.accessibilityLevel === 'no-hide-descendants'
2188    ) {
2189      return this.closeOptions.accessibilityLevel;
2190    }
2191    return 'yes';
2192  }
2193  getCloseIconAccessibilityDescription() {
2194    if (typeof this.closeOptions?.accessibilityDescription === 'undefined') {
2195      return undefined;
2196    }
2197    return this.closeOptions.accessibilityDescription;
2198  }
2199  getCloseIconAccessibilityText() {
2200    if (typeof this.closeOptions?.accessibilityText === 'undefined') {
2201      return {
2202        id: -1,
2203        type: 10003,
2204        params: ['sys.string.delete_used_for_accessibility_text'],
2205        bundleName: '__harDefaultBundleName__',
2206        moduleName: '__harDefaultModuleName__',
2207      };
2208    }
2209    return this.closeOptions.accessibilityText;
2210  }
2211  getSuffixIconAccessibilityLevel() {
2212    if (this.suffixIcon?.accessibilityLevel === 'no' || this.suffixIcon?.accessibilityLevel === 'no-hide-descendants') {
2213      return this.suffixIcon.accessibilityLevel;
2214    }
2215    return this.suffixIcon?.action ? 'yes' : 'no';
2216  }
2217  getSuffixIconAccessibilityDescription() {
2218    if (typeof this.suffixIcon?.accessibilityDescription === 'undefined') {
2219      return undefined;
2220    }
2221    return this.suffixIcon.accessibilityDescription;
2222  }
2223  getSuffixIconAccessibilityText() {
2224    if (typeof this.suffixIcon?.accessibilityText === 'undefined') {
2225      return undefined;
2226    }
2227    return this.suffixIcon.accessibilityText;
2228  }
2229  getAccessibilityLevel() {
2230    return this.chipAccessibilityLevel;
2231  }
2232  getAccessibilityDescription() {
2233    if (typeof this.chipAccessibilityDescription === 'undefined') {
2234      return undefined;
2235    }
2236    return this.chipAccessibilityDescription;
2237  }
2238  resourceToNumber(resource, defaultValue) {
2239    if (!resource || !resource.type) {
2240      console.error('[Chip] failed: resource get fail.');
2241      return defaultValue;
2242    }
2243    const resourceManager = this.getUIContext().getHostContext()?.resourceManager;
2244    if (!resourceManager) {
2245      console.error('[Chip] failed to get resourceManager.');
2246      return defaultValue;
2247    }
2248    switch (resource.type) {
2249      case RESOURCE_TYPE_FLOAT:
2250      case RESOURCE_TYPE_INTEGER:
2251        try {
2252          if (resource.id !== -1) {
2253            return resourceManager.getNumber(resource);
2254          }
2255          return resourceManager.getNumberByName(resource.params[0].split('.')[2]);
2256        } catch (error) {
2257          console.error(`[Chip] get resource error, return defaultValue`);
2258          return defaultValue;
2259        }
2260      default:
2261        return defaultValue;
2262    }
2263  }
2264  initialRender() {
2265    this.observeComponentCreation2((elmtId, isInitialRender) => {
2266      If.create();
2267      if (!this.deleteChip) {
2268        this.ifElseBranchUpdateFunction(0, () => {
2269          this.chipBuilder.bind(this)();
2270        });
2271      } else {
2272        this.ifElseBranchUpdateFunction(1, () => {});
2273      }
2274    }, If);
2275    If.pop();
2276  }
2277  rerender() {
2278    this.updateDirtyElements();
2279  }
2280}
2281export default {
2282  Chip,
2283  ChipSize,
2284  AccessibilitySelectedType,
2285};
2286