• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/*
2 * Copyright (c) 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
16/// <reference path='./import.ts' />
17interface XComponentParam {
18  id: string;
19  type: string | XComponentType;
20  imageAIOptions: ImageAIOptions;
21  libraryname?: string;
22  controller?: XComponentController;
23}
24class ArkXComponentComponent extends ArkComponent implements XComponentAttribute {
25  _modifiersWithKeys: Map<Symbol, AttributeModifierWithKey>;
26  nativePtr: KNode;
27
28  constructor(nativePtr: KNode, classType?: ModifierType) {
29    super(nativePtr, classType);
30  }
31  allowChildCount(): number {
32    return 0;
33  }
34  applyModifierPatch(): void {
35    let expiringItemsWithKeys = [];
36    this._modifiersWithKeys.forEach((value, key) => {
37      if (value.applyStage(this.nativePtr)) {
38        expiringItemsWithKeys.push(key);
39      }
40    });
41    expiringItemsWithKeys.forEach(key => {
42      this._modifiersWithKeys.delete(key);
43    });
44  }
45  initialize(value: Object[]): this {
46    if (value[0]) {
47      modifierWithKey(this._modifiersWithKeys, XComponentInitializeModifier.identity,
48        XComponentInitializeModifier, value[0] as XComponentParam);
49    }
50    return this;
51  }
52  outline(value: OutlineOptions): this {
53    throw new Error('Method not implemented.');
54  }
55  outlineColor(value: ResourceColor | EdgeColors): this {
56    throw new Error('Method not implemented.');
57  }
58  outlineRadius(value: Dimension | OutlineRadiuses): this {
59    throw new Error('Method not implemented.');
60  }
61  outlineStyle(value: OutlineStyle | EdgeOutlineStyles): this {
62    throw new Error('Method not implemented.');
63  }
64  outlineWidth(value: Dimension | EdgeOutlineWidths): this {
65    throw new Error('Method not implemented.');
66  }
67  expandSafeArea(types?: SafeAreaType[], edges?: SafeAreaEdge[]): this {
68    throw new Error('Method not implemented.');
69  }
70  responseRegion(value: Rectangle | Rectangle[]): this {
71    throw new Error('Method not implemented.');
72  }
73  mouseResponseRegion(value: Rectangle | Rectangle[]): this {
74    throw new Error('Method not implemented.');
75  }
76  size(value: SizeOptions): this {
77    throw new Error('Method not implemented.');
78  }
79  constraintSize(value: ConstraintSizeOptions): this {
80    throw new Error('Method not implemented.');
81  }
82  touchable(value: boolean): this {
83    throw new Error('Method not implemented.');
84  }
85  hitTestBehavior(value: HitTestMode): this {
86    throw new Error('Method not implemented.');
87  }
88  layoutWeight(value: string | number): this {
89    throw new Error('Method not implemented.');
90  }
91  padding(value: Length | Padding): this {
92    throw new Error('Method not implemented.');
93  }
94  margin(value: Length | Padding): this {
95    throw new Error('Method not implemented.');
96  }
97  background(builder: CustomBuilder, options?: { align?: Alignment; }): this {
98    throw new Error('Method not implemented.');
99  }
100  backgroundColor(value: ResourceColor): this {
101    modifierWithKey(this._modifiersWithKeys, XComponentBackgroundColorModifier.identity,
102      XComponentBackgroundColorModifier, value);
103    return this;
104  }
105  backgroundImage(src: ResourceStr, repeat?: ImageRepeat): this {
106    let arkBackgroundImage = new ArkBackgroundImage();
107    arkBackgroundImage.src = src;
108    arkBackgroundImage.repeat = repeat;
109    modifierWithKey(this._modifiersWithKeys, XComponentBackgroundImageModifier.identity, XComponentBackgroundImageModifier, arkBackgroundImage);
110    return this;
111  }
112  backgroundImageSize(value: SizeOptions | ImageSize): this {
113    modifierWithKey(this._modifiersWithKeys, XComponentBackgroundImageSizeModifier.identity, XComponentBackgroundImageSizeModifier, value);
114    return this;
115  }
116  backgroundImagePosition(value: Alignment | Position): this {
117    modifierWithKey(this._modifiersWithKeys, XComponentBackgroundImagePositionModifier.identity, XComponentBackgroundImagePositionModifier, value);
118    return this;
119  }
120  backgroundBlurStyle(value: BlurStyle, options?: BackgroundBlurStyleOptions): this {
121    throw new Error('Method not implemented.');
122  }
123  foregroundBlurStyle(value: BlurStyle, options?: ForegroundBlurStyleOptions): this {
124    throw new Error('Method not implemented.');
125  }
126  opacity(value: number | Resource): this {
127    modifierWithKey(this._modifiersWithKeys, XComponentOpacityModifier.identity, XComponentOpacityModifier, value);
128    return this;
129  }
130  border(value: BorderOptions): this {
131    throw new Error('Method not implemented.');
132  }
133  borderStyle(value: BorderStyle | EdgeStyles): this {
134    throw new Error('Method not implemented.');
135  }
136  borderWidth(value: Length | EdgeWidths): this {
137    throw new Error('Method not implemented.');
138  }
139  borderColor(value: ResourceColor | EdgeColors): this {
140    throw new Error('Method not implemented.');
141  }
142  borderRadius(value: Length | BorderRadiuses): this {
143    throw new Error('Method not implemented.');
144  }
145  borderImage(value: BorderImageOption): this {
146    throw new Error('Method not implemented.');
147  }
148  foregroundColor(value: string | number | Resource | Color): this {
149    throw new Error('Method not implemented.');
150  }
151  onClick(event: (event: ClickEvent) => void): this {
152    throw new Error('Method not implemented.');
153  }
154  onHover(event: (isHover: boolean, event: HoverEvent) => void): this {
155    throw new Error('Method not implemented.');
156  }
157  hoverEffect(value: HoverEffect): this {
158    throw new Error('Method not implemented.');
159  }
160  onMouse(event: (event: MouseEvent) => void): this {
161    throw new Error('Method not implemented.');
162  }
163  onTouch(event: (event: TouchEvent) => void): this {
164    throw new Error('Method not implemented.');
165  }
166  onKeyEvent(event: (event: KeyEvent) => void): this {
167    throw new Error('Method not implemented.');
168  }
169  onFocus(event: () => void): this {
170    throw new Error('Method not implemented.');
171  }
172  onBlur(event: () => void): this {
173    throw new Error('Method not implemented.');
174  }
175  tabIndex(index: number): this {
176    throw new Error('Method not implemented.');
177  }
178  groupDefaultFocus(value: boolean): this {
179    throw new Error('Method not implemented.');
180  }
181  animation(value: AnimateParam): this {
182    throw new Error('Method not implemented.');
183  }
184  transition(value: TransitionOptions | TransitionEffect): this {
185    throw new Error('Method not implemented.');
186  }
187  gesture(gesture: GestureType, mask?: GestureMask): this {
188    throw new Error('Method not implemented.');
189  }
190  priorityGesture(gesture: GestureType, mask?: GestureMask): this {
191    throw new Error('Method not implemented.');
192  }
193  parallelGesture(gesture: GestureType, mask?: GestureMask): this {
194    throw new Error('Method not implemented.');
195  }
196  blur(value: number): this {
197    modifierWithKey(this._modifiersWithKeys, XComponentBlurModifier.identity, XComponentBlurModifier, value);
198    return this;
199  }
200  linearGradientBlur(value: number, options: LinearGradientBlurOptions): this {
201    if (isUndefined(value) || isNull(value) || isUndefined(options) || isNull(options)) {
202      modifierWithKey(this._modifiersWithKeys, XComponentLinearGradientBlurModifier.identity, XComponentLinearGradientBlurModifier,
203        undefined);
204      return this;
205    }
206    let arkLinearGradientBlur = new ArkLinearGradientBlur();
207    arkLinearGradientBlur.blurRadius = value;
208    arkLinearGradientBlur.fractionStops = options.fractionStops;
209    arkLinearGradientBlur.direction = options.direction;
210    modifierWithKey(this._modifiersWithKeys, XComponentLinearGradientBlurModifier.identity, XComponentLinearGradientBlurModifier,
211      arkLinearGradientBlur);
212    return this;
213  }
214  brightness(value: number): this {
215    modifierWithKey(this._modifiersWithKeys, XComponentBrightnessModifier.identity, XComponentBrightnessModifier, value);
216    return this;
217  }
218  contrast(value: number): this {
219    modifierWithKey(this._modifiersWithKeys, XComponentContrastModifier.identity, XComponentContrastModifier, value);
220    return this;
221  }
222  grayscale(value: number): this {
223    modifierWithKey(this._modifiersWithKeys, XComponentGrayscaleModifier.identity, XComponentGrayscaleModifier, value);
224    return this;
225  }
226  colorBlend(value: string | Resource | Color): this {
227    modifierWithKey(this._modifiersWithKeys, XComponentColorBlendModifier.identity, XComponentColorBlendModifier, value);
228    return this;
229  }
230  saturate(value: number): this {
231    modifierWithKey(this._modifiersWithKeys, XComponentSaturateModifier.identity, XComponentSaturateModifier, value);
232    return this;
233  }
234  sepia(value: number): this {
235    modifierWithKey(this._modifiersWithKeys, XComponentSepiaModifier.identity, XComponentSepiaModifier, value);
236    return this;
237  }
238  invert(value: number): this {
239    modifierWithKey(this._modifiersWithKeys, XComponentInvertModifier.identity, XComponentInvertModifier, value);
240    return this;
241  }
242  hueRotate(value: string | number): this {
243    modifierWithKey(this._modifiersWithKeys, XComponentHueRotateModifier.identity, XComponentHueRotateModifier, value);
244    return this;
245  }
246  useEffect(value: boolean): this {
247    throw new Error('Method not implemented.');
248  }
249  backdropBlur(value: number): this {
250    modifierWithKey(this._modifiersWithKeys, XComponentBackdropBlurModifier.identity, XComponentBackdropBlurModifier, value);
251    return this;
252  }
253  renderGroup(value: boolean): this {
254    throw new Error('Method not implemented.');
255  }
256  translate(value: TranslateOptions): this {
257    throw new Error('Method not implemented.');
258  }
259  scale(value: ScaleOptions): this {
260    throw new Error('Method not implemented.');
261  }
262  gridSpan(value: number): this {
263    throw new Error('Method not implemented.');
264  }
265  gridOffset(value: number): this {
266    throw new Error('Method not implemented.');
267  }
268  rotate(value: RotateOptions): this {
269    throw new Error('Method not implemented.');
270  }
271  transform(value: object): this {
272    throw new Error('Method not implemented.');
273  }
274  onAppear(event: () => void): this {
275    throw new Error('Method not implemented.');
276  }
277  onDisAppear(event: () => void): this {
278    throw new Error('Method not implemented.');
279  }
280  onAttach(event: () => void): this {
281    throw new Error('Method not implemented.');
282  }
283  onDetach(event: () => void): this {
284    throw new Error('Method not implemented.');
285  }
286  onAreaChange(event: (oldValue: Area, newValue: Area) => void): this {
287    throw new Error('Method not implemented.');
288  }
289  visibility(value: Visibility): this {
290    throw new Error('Method not implemented.');
291  }
292  flexGrow(value: number): this {
293    throw new Error('Method not implemented.');
294  }
295  flexShrink(value: number): this {
296    throw new Error('Method not implemented.');
297  }
298  flexBasis(value: string | number): this {
299    throw new Error('Method not implemented.');
300  }
301  alignSelf(value: ItemAlign): this {
302    throw new Error('Method not implemented.');
303  }
304  displayPriority(value: number): this {
305    throw new Error('Method not implemented.');
306  }
307  zIndex(value: number): this {
308    throw new Error('Method not implemented.');
309  }
310  sharedTransition(id: string, options?: sharedTransitionOptions): this {
311    throw new Error('Method not implemented.');
312  }
313  direction(value: Direction): this {
314    throw new Error('Method not implemented.');
315  }
316  align(value: Alignment): this {
317    throw new Error('Method not implemented.');
318  }
319  position(value: Position): this {
320    throw new Error('Method not implemented.');
321  }
322  markAnchor(value: Position): this {
323    throw new Error('Method not implemented.');
324  }
325  offset(value: Position): this {
326    throw new Error('Method not implemented.');
327  }
328  enabled(value: boolean): this {
329    throw new Error('Method not implemented.');
330  }
331  useSizeType(value: {
332    xs?: number | { span: number; offset: number };
333    sm?: number | { span: number; offset: number };
334    md?: number | { span: number; offset: number };
335    lg?: number | { span: number; offset: number };
336  }): this {
337    throw new Error('Method not implemented.');
338  }
339  alignRules(value: AlignRuleOption): this {
340    throw new Error('Method not implemented.');
341  }
342  aspectRatio(value: number): this {
343    throw new Error('Method not implemented.');
344  }
345  clickEffect(value: ClickEffect): this {
346    throw new Error('Method not implemented.');
347  }
348  allowDrop(value: Array<UniformDataType>): this {
349    throw new Error('Method not implemented.');
350  }
351  overlay(value: string | CustomBuilder, options?: { align?: Alignment; offset?: { x?: number; y?: number; }; }): this {
352    throw new Error('Method not implemented.');
353  }
354  linearGradient(value: {
355    angle?: number | string;
356    direction?: GradientDirection;
357    colors: Array<any>;
358    repeating?: boolean;
359  }): this {
360    throw new Error('Method not implemented.');
361  }
362  sweepGradient(value: {
363    center: Array<any>;
364    start?: number | string;
365    end?: number | string;
366    rotation?: number | string;
367    colors: Array<any>;
368    repeating?: boolean;
369  }): this {
370    throw new Error('Method not implemented.');
371  }
372  radialGradient(value: { center: Array<any>; radius: number | string; colors: Array<any>; repeating?: boolean }): this {
373    throw new Error('Method not implemented.');
374  }
375  motionPath(value: MotionPathOptions): this {
376    throw new Error('Method not implemented.');
377  }
378  shadow(value: ShadowOptions | ShadowStyle): this {
379    modifierWithKey(this._modifiersWithKeys, ShadowModifier.identity, ShadowModifier, value);
380    return this;
381  }
382  blendMode(value: BlendMode): this {
383    throw new Error('Method not implemented.');
384  }
385  clip(value: boolean | CircleAttribute | EllipseAttribute | PathAttribute | RectAttribute): this {
386    throw new Error('Method not implemented.');
387  }
388  mask(value: CircleAttribute | EllipseAttribute | PathAttribute | RectAttribute | ProgressMask): this {
389    throw new Error('Method not implemented.');
390  }
391  key(value: string): this {
392    throw new Error('Method not implemented.');
393  }
394  id(value: string): this {
395    throw new Error('Method not implemented.');
396  }
397  geometryTransition(id: string): this {
398    throw new Error('Method not implemented.');
399  }
400  bindPopup(show: boolean, popup: PopupOptions | CustomPopupOptions): this {
401    throw new Error('Method not implemented.');
402  }
403  bindMenu(content: CustomBuilder | MenuElement[], options?: MenuOptions): this {
404    throw new Error('Method not implemented.');
405  }
406  bindContextMenu(content: CustomBuilder, responseType: ResponseType, options?: ContextMenuOptions): this {
407    throw new Error('Method not implemented.');
408  }
409  bindContentCover(isShow: unknown, builder: unknown, options?: unknown): this {
410    throw new Error('Method not implemented.');
411  }
412  bindSheet(isShow: boolean, builder: CustomBuilder, options?: SheetOptions): this {
413    throw new Error('Method not implemented.');
414  }
415  stateStyles(value: StateStyles): this {
416    throw new Error('Method not implemented.');
417  }
418  restoreId(value: number): this {
419    throw new Error('Method not implemented.');
420  }
421  onVisibleAreaChange(ratios: number[], event: (isVisible: boolean, currentRatio: number) => void): this {
422    throw new Error('Method not implemented.');
423  }
424  sphericalEffect(value: number): this {
425    modifierWithKey(this._modifiersWithKeys, XComponentSphericalEffectModifier.identity, XComponentSphericalEffectModifier, value);
426    return this;
427  }
428  lightUpEffect(value: number): this {
429    modifierWithKey(this._modifiersWithKeys, XComponentLightUpEffectModifier.identity, XComponentLightUpEffectModifier, value);
430    return this;
431  }
432  pixelStretchEffect(options: PixelStretchEffectOptions): this {
433    modifierWithKey(this._modifiersWithKeys, XComponentPixelStretchEffectModifier.identity, XComponentPixelStretchEffectModifier, options);
434    return this;
435  }
436  keyboardShortcut(value: string | FunctionKey, keys: ModifierKey[], action?: () => void): this {
437    throw new Error('Method not implemented.');
438  }
439  accessibilityGroup(value: boolean): this {
440    throw new Error('Method not implemented.');
441  }
442  accessibilityText(value: string): this {
443    throw new Error('Method not implemented.');
444  }
445  accessibilityDescription(value: string): this {
446    throw new Error('Method not implemented.');
447  }
448  accessibilityLevel(value: string): this {
449    throw new Error('Method not implemented.');
450  }
451  obscured(reasons: ObscuredReasons[]): this {
452    throw new Error('Method not implemented.');
453  }
454  reuseId(id: string): this {
455    throw new Error('Method not implemented.');
456  }
457  renderFit(fitMode: RenderFit): this {
458    modifierWithKey(this._modifiersWithKeys, XComponentRenderFitModifier.identity, XComponentRenderFitModifier, fitMode);
459    return this;
460  }
461  attributeModifier(modifier: AttributeModifier<CommonAttribute>): this {
462    return this;
463  }
464  onGestureJudgeBegin(callback: (gestureInfo: GestureInfo, event: BaseGestureEvent) => GestureJudgeResult): this {
465    throw new Error('Method not implemented.');
466  }
467  onLoad(callback: (event?: object) => void): this {
468    modifierWithKey(this._modifiersWithKeys, XComponentOnLoadModifier.identity, XComponentOnLoadModifier, callback);
469    return this;
470  }
471  onDestroy(event: () => void): this {
472    modifierWithKey(this._modifiersWithKeys, XComponentOnDestroyModifier.identity, XComponentOnDestroyModifier, event);
473    return this;
474  }
475  enableAnalyzer(value: boolean): this {
476    modifierWithKey(this._modifiersWithKeys, XComponentEnableAnalyzerModifier.identity, XComponentEnableAnalyzerModifier, value);
477    return this;
478  }
479  enableSecure(value: boolean): this {
480    modifierWithKey(this._modifiersWithKeys, XComponentEnableSecureModifier.identity, XComponentEnableSecureModifier, value);
481    return this;
482  }
483}
484
485// @ts-ignore
486globalThis.XComponent.attributeModifier = function (modifier) {
487  const elmtId = ViewStackProcessor.GetElmtIdToAccountFor();
488  let nativeNode = getUINativeModule().getFrameNodeById(elmtId);
489  let component = this.createOrGetNode(elmtId, () => {
490    return new ArkXComponentComponent(nativeNode);
491  });
492  applyUIAttributes(modifier, nativeNode, component);
493  component.applyModifierPatch();
494};
495
496class XComponentInitializeModifier extends ModifierWithKey<XComponentParam> {
497  constructor(value: XComponentParam) {
498    super(value);
499  }
500  static identity: Symbol = Symbol('xComponentInitialize');
501  applyPeer(node: KNode, reset: boolean): void {
502    if (reset) {
503      getUINativeModule().xComponent.resetXComponentInitialize(node);
504    } else {
505      getUINativeModule().xComponent.setXComponentInitialize(node, this.value?.id,
506        this.value?.type, this.value?.imageAIOptions, this.value?.libraryname, this.value?.controller);
507    }
508  }
509}
510
511class XComponentOpacityModifier extends ModifierWithKey<number | Resource> {
512  constructor(value: number | Resource) {
513    super(value);
514  }
515  static identity: Symbol = Symbol('xComponentOpacity');
516  applyPeer(node: KNode, reset: boolean): void {
517    if (reset) {
518      getUINativeModule().xComponent.resetOpacity(node);
519    } else {
520      getUINativeModule().xComponent.setOpacity(node, this.value);
521    }
522  }
523
524  checkObjectDiff(): boolean {
525    return !isBaseOrResourceEqual(this.stageValue, this.value);
526  }
527}
528
529class XComponentBackgroundColorModifier extends ModifierWithKey<ResourceColor> {
530  constructor(value: ResourceColor) {
531    super(value);
532  }
533  static identity: Symbol = Symbol('xComponentBackgroundColor');
534  applyPeer(node: KNode, reset: boolean): void {
535    if (reset) {
536      getUINativeModule().xComponent.resetBackgroundColor(node);
537    } else {
538      getUINativeModule().xComponent.setBackgroundColor(node, this.value);
539    }
540  }
541
542  checkObjectDiff(): boolean {
543    return !isBaseOrResourceEqual(this.stageValue, this.value);
544  }
545}
546
547class XComponentBackgroundImageModifier extends ModifierWithKey<ArkBackgroundImage> {
548  constructor(value: ArkBackgroundImage) {
549    super(value);
550  }
551  static identity: Symbol = Symbol('xComponentBackgroundImage');
552  applyPeer(node: KNode, reset: boolean): void {
553    if (reset) {
554      getUINativeModule().xComponent.resetBackgroundImage(node);
555    } else {
556      getUINativeModule().xComponent.setBackgroundImage(node, this.value.src, this.value.repeat);
557    }
558  }
559
560  checkObjectDiff(): boolean {
561    return !((this.stageValue as ArkBackgroundImage).src === (this.value as ArkBackgroundImage).src &&
562      (this.stageValue as ArkBackgroundImage).repeat === (this.value as ArkBackgroundImage).repeat);
563  }
564}
565
566class XComponentBackgroundImageSizeModifier extends ModifierWithKey<SizeOptions | ImageSize> {
567  constructor(value: SizeOptions | ImageSize) {
568    super(value);
569  }
570  static identity: Symbol = Symbol('xComponentBackgroundImageSize');
571  applyPeer(node: KNode, reset: boolean): void {
572    if (reset) {
573      getUINativeModule().xComponent.resetBackgroundImageSize(node);
574    } else {
575      if (isNumber(this.value)) {
576        getUINativeModule().xComponent.setBackgroundImageSize(node, this.value, undefined, undefined);
577      } else {
578        getUINativeModule().xComponent.setBackgroundImageSize(node, undefined, (this.value as SizeOptions)?.width, (this.value as SizeOptions)?.height);
579      }
580    }
581  }
582  checkObjectDiff(): boolean {
583    return !((this.value as SizeOptions).width === (this.stageValue as SizeOptions).width &&
584      (this.value as SizeOptions).height === (this.stageValue as SizeOptions).height);
585  }
586}
587
588class XComponentBackgroundImagePositionModifier extends ModifierWithKey<Position | Alignment> {
589  constructor(value: Position | Alignment) {
590    super(value);
591  }
592  static identity: Symbol = Symbol('xComponentBackgroundImagePosition');
593  applyPeer(node: KNode, reset: boolean): void {
594    if (reset) {
595      getUINativeModule().xComponent.resetBackgroundImagePosition(node);
596    } else {
597      if (isNumber(this.value)) {
598        getUINativeModule().xComponent.setBackgroundImagePosition(node, this.value, undefined, undefined);
599      } else {
600        getUINativeModule().xComponent.setBackgroundImagePosition(node, undefined, (this.value as Position)?.x, (this.value as Position)?.y);
601      }
602    }
603  }
604  checkObjectDiff(): boolean {
605    return !((this.value as Position)?.x === (this.stageValue as Position)?.x &&
606      (this.value as Position)?.y === (this.stageValue as Position)?.y);
607  }
608}
609
610class XComponentBlurModifier extends ModifierWithKey<number> {
611  constructor(value: number) {
612    super(value);
613  }
614  static identity: Symbol = Symbol('xComponentBlur');
615  applyPeer(node: KNode, reset: boolean): void {
616    if (reset) {
617      getUINativeModule().xComponent.resetBlur(node);
618    } else {
619      getUINativeModule().xComponent.setBlur(node, this.value);
620    }
621  }
622}
623
624class XComponentBackdropBlurModifier extends ModifierWithKey<number> {
625  constructor(value: number) {
626    super(value);
627  }
628  static identity: Symbol = Symbol('xComponentBackdropBlur');
629  applyPeer(node: KNode, reset: boolean): void {
630    if (reset) {
631      getUINativeModule().xComponent.resetBackdropBlur(node);
632    } else {
633      getUINativeModule().xComponent.setBackdropBlur(node, this.value);
634    }
635  }
636}
637
638class XComponentGrayscaleModifier extends ModifierWithKey<number> {
639  constructor(value: number) {
640    super(value);
641  }
642  static identity: Symbol = Symbol('xComponentGrayscale');
643  applyPeer(node: KNode, reset: boolean): void {
644    if (reset) {
645      getUINativeModule().xComponent.resetGrayscale(node);
646    } else {
647      getUINativeModule().xComponent.setGrayscale(node, this.value);
648    }
649  }
650}
651
652class XComponentBrightnessModifier extends ModifierWithKey<number> {
653  constructor(value: number) {
654    super(value);
655  }
656  static identity: Symbol = Symbol('xComponentBrightness');
657  applyPeer(node: KNode, reset: boolean): void {
658    if (reset) {
659      getUINativeModule().xComponent.resetBrightness(node);
660    } else {
661      getUINativeModule().xComponent.setBrightness(node, this.value);
662    }
663  }
664}
665
666class XComponentSaturateModifier extends ModifierWithKey<number> {
667  constructor(value: number) {
668    super(value);
669  }
670  static identity: Symbol = Symbol('xComponentSaturate');
671  applyPeer(node: KNode, reset: boolean): void {
672    if (reset) {
673      getUINativeModule().xComponent.resetSaturate(node);
674    } else {
675      getUINativeModule().xComponent.setSaturate(node, this.value);
676    }
677  }
678}
679
680class XComponentContrastModifier extends ModifierWithKey<number> {
681  constructor(value: number) {
682    super(value);
683  }
684  static identity: Symbol = Symbol('xComponentContrast');
685  applyPeer(node: KNode, reset: boolean): void {
686    if (reset) {
687      getUINativeModule().xComponent.resetContrast(node);
688    } else {
689      getUINativeModule().xComponent.setContrast(node, this.value);
690    }
691  }
692}
693
694class XComponentInvertModifier extends ModifierWithKey<number> {
695  constructor(value: number) {
696    super(value);
697  }
698  static identity: Symbol = Symbol('xComponentInvert');
699  applyPeer(node: KNode, reset: boolean): void {
700    if (reset) {
701      getUINativeModule().xComponent.resetInvert(node);
702    } else {
703      getUINativeModule().xComponent.setInvert(node, this.value);
704    }
705  }
706}
707
708class XComponentSepiaModifier extends ModifierWithKey<number> {
709  constructor(value: number) {
710    super(value);
711  }
712  static identity: Symbol = Symbol('xComponentSepia');
713  applyPeer(node: KNode, reset: boolean): void {
714    if (reset) {
715      getUINativeModule().xComponent.resetSepia(node);
716    } else {
717      getUINativeModule().xComponent.setSepia(node, this.value);
718    }
719  }
720}
721
722class XComponentHueRotateModifier extends ModifierWithKey<number | string> {
723  constructor(value: number | string) {
724    super(value);
725  }
726  static identity: Symbol = Symbol('xComponentHueRotate');
727  applyPeer(node: KNode, reset: boolean): void {
728    if (reset) {
729      getUINativeModule().xComponent.resetHueRotate(node);
730    } else {
731      getUINativeModule().xComponent.setHueRotate(node, this.value);
732    }
733  }
734}
735
736class XComponentColorBlendModifier extends ModifierWithKey<Color | string | Resource> {
737  constructor(value: Color | string | Resource) {
738    super(value);
739  }
740  static identity: Symbol = Symbol('xComponentColorBlend');
741  applyPeer(node: KNode, reset: boolean): void {
742    if (reset) {
743      getUINativeModule().xComponent.resetColorBlend(node);
744    } else {
745      getUINativeModule().xComponent.setColorBlend(node, this.value);
746    }
747  }
748
749  checkObjectDiff(): boolean {
750    return !isBaseOrResourceEqual(this.stageValue, this.value);
751  }
752}
753
754class XComponentSphericalEffectModifier extends ModifierWithKey<number> {
755  constructor(value: number) {
756    super(value);
757  }
758  static identity: Symbol = Symbol('xComponentSphericalEffect');
759  applyPeer(node: KNode, reset: boolean): void {
760    if (reset) {
761      getUINativeModule().xComponent.resetSphericalEffect(node);
762    } else {
763      getUINativeModule().xComponent.setSphericalEffect(node, this.value);
764    }
765  }
766}
767
768class XComponentLightUpEffectModifier extends ModifierWithKey<number> {
769  constructor(value: number) {
770    super(value);
771  }
772  static identity: Symbol = Symbol('xComponentLightUpEffect');
773  applyPeer(node: KNode, reset: boolean): void {
774    if (reset) {
775      getUINativeModule().xComponent.resetLightUpEffect(node);
776    } else {
777      getUINativeModule().xComponent.setLightUpEffect(node, this.value);
778    }
779  }
780}
781
782class XComponentPixelStretchEffectModifier extends ModifierWithKey<PixelStretchEffectOptions> {
783  constructor(value: PixelStretchEffectOptions) {
784    super(value);
785  }
786  static identity: Symbol = Symbol('xComponentPixelStretchEffect');
787  applyPeer(node: KNode, reset: boolean): void {
788    if (reset) {
789      getUINativeModule().xComponent.resetPixelStretchEffect(node);
790    } else {
791      getUINativeModule().xComponent.setPixelStretchEffect(node,
792        this.value.top, this.value.right, this.value.bottom, this.value.left);
793    }
794  }
795
796  checkObjectDiff(): boolean {
797    return !((this.stageValue as PixelStretchEffectOptions).left === (this.value as PixelStretchEffectOptions).left &&
798      (this.stageValue as PixelStretchEffectOptions).right === (this.value as PixelStretchEffectOptions).right &&
799      (this.stageValue as PixelStretchEffectOptions).top === (this.value as PixelStretchEffectOptions).top &&
800      (this.stageValue as PixelStretchEffectOptions).bottom === (this.value as PixelStretchEffectOptions).bottom);
801  }
802}
803
804class XComponentLinearGradientBlurModifier extends ModifierWithKey<ArkLinearGradientBlur> {
805  constructor(value: ArkLinearGradientBlur) {
806    super(value);
807  }
808  static identity: Symbol = Symbol('xComponentlinearGradientBlur');
809  applyPeer(node: KNode, reset: boolean): void {
810    if (reset) {
811      getUINativeModule().xComponent.resetLinearGradientBlur(node);
812    } else {
813      getUINativeModule().xComponent.setLinearGradientBlur(node,
814        this.value.blurRadius, this.value.fractionStops, this.value.direction);
815    }
816  }
817  checkObjectDiff(): boolean {
818    return !this.value.isEqual(this.stageValue);
819  }
820}
821
822class XComponentOnLoadModifier extends ModifierWithKey<(event?: object) => void> {
823  constructor(value: (event?: object) => void) {
824    super(value);
825  }
826  static identity: Symbol = Symbol('xComponentOnLoad');
827  applyPeer(node: KNode, reset: boolean): void {
828    if (reset) {
829      getUINativeModule().xComponent.resetOnLoad(node);
830    } else {
831      getUINativeModule().xComponent.setOnLoad(node, this.value);
832    }
833  }
834}
835
836class XComponentOnDestroyModifier extends ModifierWithKey<() => void> {
837  constructor(value: () => void) {
838    super(value);
839  }
840  static identity: Symbol = Symbol('xComponentOnDestroy');
841  applyPeer(node: KNode, reset: boolean): void {
842    if (reset) {
843      getUINativeModule().xComponent.resetOnDestroy(node);
844    } else {
845      getUINativeModule().xComponent.setOnDestroy(node, this.value);
846    }
847  }
848}
849
850class XComponentEnableAnalyzerModifier extends ModifierWithKey<boolean> {
851  constructor(value: boolean) {
852    super(value);
853  }
854  static identity: Symbol = Symbol('xComponentEnableAnalyzer');
855  applyPeer(node: KNode, reset: boolean): void {
856    if (reset) {
857      getUINativeModule().xComponent.resetEnableAnalyzer(node);
858    } else {
859      getUINativeModule().xComponent.setEnableAnalyzer(node, this.value);
860    }
861  }
862
863  checkObjectDiff(): boolean {
864    return !isBaseOrResourceEqual(this.stageValue, this.value);
865  }
866}
867
868class XComponentEnableSecureModifier extends ModifierWithKey<boolean> {
869  constructor(value: boolean) {
870    super(value);
871  }
872  static identity: Symbol = Symbol('xComponentEnableSecure');
873  applyPeer(node: KNode, reset: boolean): void {
874    if (reset) {
875      getUINativeModule().xComponent.resetEnableSecure(node);
876    } else {
877      getUINativeModule().xComponent.setEnableSecure(node, this.value);
878    }
879  }
880
881  checkObjectDiff(): boolean {
882    return !isBaseOrResourceEqual(this.stageValue, this.value);
883  }
884}
885
886class XComponentRenderFitModifier extends ModifierWithKey<number> {
887  constructor(value: number) {
888    super(value);
889  }
890  static identity: Symbol = Symbol('xComponentRenderFit');
891  applyPeer(node: KNode, reset: boolean): void {
892    if (reset) {
893      getUINativeModule().xComponent.resetRenderFit(node);
894    } else {
895      getUINativeModule().xComponent.setRenderFit(node, this.value);
896    }
897  }
898}