import * as i0 from '@angular/core';
import { Injectable, Component, Input, ViewChild, Directive, EventEmitter, Output, TemplateRef, ContentChild, HostListener, NgModule } from '@angular/core';
import * as _ from 'lodash';
import { camelCase, indexOf } from 'lodash';
import { Subject, Observable, throwError } from 'rxjs';
import { first, timeout, catchError } from 'rxjs/operators';
import * as i1 from '@angular/common/http';
import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
import * as i5 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i3 from '@angular/forms';
import { FormsModule } from '@angular/forms';
import { trigger, state, style, transition, animate, group } from '@angular/animations';
import ResizeObserver from 'resize-observer-polyfill';
import * as i2 from '@angular/platform-browser';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

/*
{*******************************************************************}
{                                                                   }

{                                                                   }
{                                                                   }
{   Copyright (C)  Stimulsoft                                       }
{   ALL RIGHTS RESERVED                                             }
{                                                                   }
{   The entire contents of this file is protected by U.S. and       }
{   International Copyright Laws. Unauthorized reproduction,        }
{   reverse-engineering, and distribution of all or any portion of  }
{   the code contained in this file is strictly prohibited and may  }
{   result in severe civil and criminal penalties and will be       }
{   prosecuted to the maximum extent possible under the law.        }
{                                                                   }
{   RESTRICTIONS                                                    }
{                                                                   }
{   THIS SOURCE CODE AND ALL RESULTING INTERMEDIATE FILES           }
{   ARE CONFIDENTIAL AND PROPRIETARY                                }
{   TRADE SECRETS OF Stimulsoft                                     }
{                                                                   }
{   CONSULT THE END USER LICENSE AGREEMENT FOR INFORMATION ON       }
{   ADDITIONAL RESTRICTIONS.                                        }
{                                                                   }
{*******************************************************************}
*/
class Color {
    constructor() {
        this.propertyName = "color";
        this.name = Color.customName;
    }
    static aliceBlue() {
        let color = Color.fromArgb(0xf0, 0xf8, 0xff);
        color.name = "Alice Blue";
        return color;
    }
    static antiqueWhite() {
        let color = Color.fromArgb(0xfa, 0xeb, 0xd7);
        color.name = "Antique White";
        return color;
    }
    static aqua() {
        let color = Color.fromArgb(0x00, 0xff, 0xff);
        color.name = "Aqua";
        return color;
    }
    static aquamarine() {
        let color = Color.fromArgb(0x7f, 0xff, 0xd4);
        color.name = "Aquamarine";
        return color;
    }
    static azure() {
        let color = Color.fromArgb(0xf0, 0xff, 0xff);
        color.name = "Azure";
        return color;
    }
    static beige() {
        let color = Color.fromArgb(0xf5, 0xf5, 0xdc);
        color.name = "Beige";
        return color;
    }
    static bisque() {
        let color = Color.fromArgb(0xff, 0xe4, 0xc4);
        color.name = "Bisque";
        return color;
    }
    static black() {
        let color = Color.fromArgb(0x00, 0x00, 0x00);
        color.name = "Black";
        return color;
    }
    static blanchedAlmond() {
        let color = Color.fromArgb(0xff, 0xeb, 0xcd);
        color.name = "Blanched Almond";
        return color;
    }
    static blue() {
        let color = Color.fromArgb(0x00, 0x00, 0xff);
        color.name = "Blue";
        return color;
    }
    static blueViolet() {
        let color = Color.fromArgb(0x8a, 0x2b, 0xe2);
        color.name = "Blue Violet";
        return color;
    }
    static brown() {
        let color = Color.fromArgb(0xa5, 0x2a, 0x2a);
        color.name = "Brown";
        return color;
    }
    static burlyWood() {
        let color = Color.fromArgb(0xde, 0xb8, 0x87);
        color.name = "Burly Wood";
        return color;
    }
    static cadetBlue() {
        let color = Color.fromArgb(0x5f, 0x9e, 0xa0);
        color.name = "Cadet Blue";
        return color;
    }
    static chartreuse() {
        let color = Color.fromArgb(0x7f, 0xff, 0x00);
        color.name = "Chartreuse";
        return color;
    }
    static chocolate() {
        let color = Color.fromArgb(0xd2, 0x69, 0x1e);
        color.name = "Chocolate";
        return color;
    }
    static coral() {
        let color = Color.fromArgb(0xff, 0x7f, 0x50);
        color.name = "Coral";
        return color;
    }
    static cornflowerBlue() {
        let color = Color.fromArgb(0x64, 0x95, 0xed);
        color.name = "Cornflower Blue";
        return color;
    }
    static cornsilk() {
        let color = Color.fromArgb(0xff, 0xf8, 0xdc);
        color.name = "Cornsilk";
        return color;
    }
    static crimson() {
        let color = Color.fromArgb(0xdc, 0x14, 0x3c);
        color.name = "Crimson";
        return color;
    }
    static cyan() {
        let color = Color.fromArgb(0x00, 0xff, 0xff);
        color.name = "Cyan";
        return color;
    }
    static darkBlue() {
        let color = Color.fromArgb(0x00, 0x00, 0x8b);
        color.name = "Dark Blue";
        return color;
    }
    static darkCyan() {
        let color = Color.fromArgb(0x00, 0x8b, 0x8b);
        color.name = "Dark Cyan";
        return color;
    }
    static darkGoldenrod() {
        let color = Color.fromArgb(0xb8, 0x86, 0x0b);
        color.name = "Dark Goldenrod";
        return color;
    }
    static darkGray() {
        let color = Color.fromArgb(0xa9, 0xa9, 0xa9);
        color.name = "Dark Gray";
        return color;
    }
    static darkGreen() {
        let color = Color.fromArgb(0x00, 0x64, 0x00);
        color.name = "Dark Green";
        return color;
    }
    static darkKhaki() {
        let color = Color.fromArgb(0xbd, 0xb7, 0x6b);
        color.name = "Dark Khaki";
        return color;
    }
    static darkMagenta() {
        let color = Color.fromArgb(0x8b, 0x00, 0x8b);
        color.name = "Dark Magenta";
        return color;
    }
    static darkOliveGreen() {
        let color = Color.fromArgb(0x55, 0x6b, 0x2f);
        color.name = "Dark Olive Green";
        return color;
    }
    static darkOrange() {
        let color = Color.fromArgb(0xff, 0x8c, 0x00);
        color.name = "Dark Orange";
        return color;
    }
    static darkOrchid() {
        let color = Color.fromArgb(0x99, 0x32, 0xcc);
        color.name = "Dark Orchid";
        return color;
    }
    static darkRed() {
        let color = Color.fromArgb(0x8b, 0x00, 0x00);
        color.name = "Dark Red";
        return color;
    }
    static darkSalmon() {
        let color = Color.fromArgb(0xe9, 0x96, 0x7a);
        color.name = "Dark Salmon";
        return color;
    }
    static darkSeaGreen() {
        let color = Color.fromArgb(0x8f, 0xbc, 0x8f);
        color.name = "Dark Sea Green";
        return color;
    }
    static darkSlateBlue() {
        let color = Color.fromArgb(0x48, 0x3d, 0x8b);
        color.name = "Dark Slate Blue";
        return color;
    }
    static darkSlateGray() {
        let color = Color.fromArgb(0x2f, 0x4f, 0x4f);
        color.name = "Dark Slate Gray";
        return color;
    }
    static darkTurquoise() {
        let color = Color.fromArgb(0x00, 0xce, 0xd1);
        color.name = "Dark Turquoise";
        return color;
    }
    static darkViolet() {
        let color = Color.fromArgb(0x94, 0x00, 0xd3);
        color.name = "Dark Violet";
        return color;
    }
    static deepPink() {
        let color = Color.fromArgb(0xff, 0x14, 0x93);
        color.name = "Deep Pink";
        return color;
    }
    static deepSkyBlue() {
        let color = Color.fromArgb(0x00, 0xbf, 0xff);
        color.name = "Deep Sky Blue";
        return color;
    }
    static dimGray() {
        let color = Color.fromArgb(0x69, 0x69, 0x69);
        color.name = "Dim Gray";
        return color;
    }
    static dodgerBlue() {
        let color = Color.fromArgb(0x1e, 0x90, 0xff);
        color.name = "Dodger Blue";
        return color;
    }
    static firebrick() {
        let color = Color.fromArgb(0xb2, 0x22, 0x22);
        color.name = "Firebrick";
        return color;
    }
    static floralWhite() {
        let color = Color.fromArgb(0xff, 0xfa, 0xf0);
        color.name = "Floral White";
        return color;
    }
    static forestGreen() {
        let color = Color.fromArgb(0x22, 0x8b, 0x22);
        color.name = "Forest Green";
        return color;
    }
    static fuchsia() {
        let color = Color.fromArgb(0xff, 0x00, 0xff);
        color.name = "Fuchsia";
        return color;
    }
    static gainsboro() {
        let color = Color.fromArgb(0xdc, 0xdc, 0xdc);
        color.name = "Gainsboro";
        return color;
    }
    static ghostWhite() {
        let color = Color.fromArgb(0xf8, 0xf8, 0xff);
        color.name = "Ghost White";
        return color;
    }
    static gold() {
        let color = Color.fromArgb(0xff, 0xd7, 0x00);
        color.name = "Gold";
        return color;
    }
    static goldenrod() {
        let color = Color.fromArgb(0xda, 0xa5, 0x20);
        color.name = "Goldenrod";
        return color;
    }
    static gray() {
        let color = Color.fromArgb(0x80, 0x80, 0x80);
        color.name = "Gray";
        return color;
    }
    static green() {
        let color = Color.fromArgb(0x00, 0x80, 0x00);
        color.name = "Green";
        return color;
    }
    static greenYellow() {
        let color = Color.fromArgb(0xad, 0xff, 0x2f);
        color.name = "Green Yellow";
        return color;
    }
    static honeydew() {
        let color = Color.fromArgb(0xf0, 0xff, 0xf0);
        color.name = "Honeydew";
        return color;
    }
    static hotPink() {
        let color = Color.fromArgb(0xff, 0x69, 0xb4);
        color.name = "Hot Pink";
        return color;
    }
    static indianRed() {
        let color = Color.fromArgb(0xcd, 0x5c, 0x5c);
        color.name = "Indian Red";
        return color;
    }
    static indigo() {
        let color = Color.fromArgb(0x4b, 0x00, 0x82);
        color.name = "Indigo";
        return color;
    }
    static ivory() {
        let color = Color.fromArgb(0xff, 0xff, 0xf0);
        color.name = "Ivory";
        return color;
    }
    static khaki() {
        let color = Color.fromArgb(0xf0, 0xe6, 0x8c);
        color.name = "Khaki";
        return color;
    }
    static lavender() {
        let color = Color.fromArgb(0xe6, 0xe6, 0xfa);
        color.name = "Lavender";
        return color;
    }
    static lavenderBlush() {
        let color = Color.fromArgb(0xff, 0xf0, 0xf5);
        color.name = "Lavender Blush";
        return color;
    }
    static lawnGreen() {
        let color = Color.fromArgb(0x7c, 0xfc, 0x00);
        color.name = "Lawn Green";
        return color;
    }
    static lemonChiffon() {
        let color = Color.fromArgb(0xff, 0xfa, 0xcd);
        color.name = "Lemon Chiffon";
        return color;
    }
    static lightBlue() {
        let color = Color.fromArgb(0xad, 0xd8, 0xe6);
        color.name = "Light Blue";
        return color;
    }
    static lightCoral() {
        let color = Color.fromArgb(0xf0, 0x80, 0x80);
        color.name = "Light Coral";
        return color;
    }
    static lightCyan() {
        let color = Color.fromArgb(0xe0, 0xff, 0xff);
        color.name = "Light Cyan";
        return color;
    }
    static lightGoldenrodYellow() {
        let color = Color.fromArgb(0xfa, 0xfa, 0xd2);
        color.name = "Light Goldenrod Yellow";
        return color;
    }
    static lightGray() {
        let color = Color.fromArgb(0xd3, 0xd3, 0xd3);
        color.name = "Light Gray";
        return color;
    }
    static lightGreen() {
        let color = Color.fromArgb(0x90, 0xee, 0x90);
        color.name = "Light Green";
        return color;
    }
    static lightPink() {
        let color = Color.fromArgb(0xff, 0xb6, 0xc1);
        color.name = "Light Pink";
        return color;
    }
    static lightSalmon() {
        let color = Color.fromArgb(0xff, 0xa0, 0x7a);
        color.name = "Light Salmon";
        return color;
    }
    static lightSeaGreen() {
        let color = Color.fromArgb(0x20, 0xb2, 0xaa);
        color.name = "Light Sea Green";
        return color;
    }
    static lightSkyBlue() {
        let color = Color.fromArgb(0x87, 0xce, 0xfa);
        color.name = "Light Sky Blue";
        return color;
    }
    static lightSlateGray() {
        let color = Color.fromArgb(0x77, 0x88, 0x99);
        color.name = "Light Slate Gray";
        return color;
    }
    static lightSteelBlue() {
        let color = Color.fromArgb(0xb0, 0xc4, 0xde);
        color.name = "Light Steel Blue";
        return color;
    }
    static lightYellow() {
        let color = Color.fromArgb(0xff, 0xff, 0xe0);
        color.name = "Light Yellow";
        return color;
    }
    static lime() {
        let color = Color.fromArgb(0x00, 0xff, 0x00);
        color.name = "Lime";
        return color;
    }
    static limeGreen() {
        let color = Color.fromArgb(0x32, 0xcd, 0x32);
        color.name = "Lime Green";
        return color;
    }
    static linen() {
        let color = Color.fromArgb(0xfa, 0xf0, 0xe6);
        color.name = "Linen";
        return color;
    }
    static magenta() {
        let color = Color.fromArgb(0xff, 0x00, 0xff);
        color.name = "Magenta";
        return color;
    }
    static maroon() {
        let color = Color.fromArgb(0x80, 0x00, 0x00);
        color.name = "Maroon";
        return color;
    }
    static mediumAquamarine() {
        let color = Color.fromArgb(0x66, 0xcd, 0xaa);
        color.name = "Medium Aquamarine";
        return color;
    }
    static mediumBlue() {
        let color = Color.fromArgb(0x00, 0x00, 0xcd);
        color.name = "Medium Blue";
        return color;
    }
    static mediumOrchid() {
        let color = Color.fromArgb(0xba, 0x55, 0xd3);
        color.name = "Medium Orchid";
        return color;
    }
    static mediumPurple() {
        let color = Color.fromArgb(0x93, 0x70, 0xdb);
        color.name = "Medium Purple";
        return color;
    }
    static mediumSeaGreen() {
        let color = Color.fromArgb(0x3c, 0xb3, 0x71);
        color.name = "Medium Sea Green";
        return color;
    }
    static mediumSlateBlue() {
        let color = Color.fromArgb(0x7b, 0x68, 0xee);
        color.name = "Medium Slate Blue";
        return color;
    }
    static mediumSpringGreen() {
        let color = Color.fromArgb(0x00, 0xfa, 0x9a);
        color.name = "Medium Spring Green";
        return color;
    }
    static mediumTurquoise() {
        let color = Color.fromArgb(0x48, 0xd1, 0xcc);
        color.name = "Medium Turquoise";
        return color;
    }
    static mediumVioletRed() {
        let color = Color.fromArgb(0xc7, 0x15, 0x85);
        color.name = "Medium Violet Red";
        return color;
    }
    static midnightBlue() {
        let color = Color.fromArgb(0x19, 0x19, 0x70);
        color.name = "Midnight Blue";
        return color;
    }
    static mintCream() {
        let color = Color.fromArgb(0xf5, 0xff, 0xfa);
        color.name = "Mint Cream";
        return color;
    }
    static mistyRose() {
        let color = Color.fromArgb(0xff, 0xe4, 0xe1);
        color.name = "Misty Rose";
        return color;
    }
    static moccasin() {
        let color = Color.fromArgb(0xff, 0xe4, 0xb5);
        color.name = "Moccasin";
        return color;
    }
    static navajoWhite() {
        let color = Color.fromArgb(0xff, 0xde, 0xad);
        color.name = "Navajo White";
        return color;
    }
    static navy() {
        let color = Color.fromArgb(0x00, 0x00, 0x80);
        color.name = "Navy";
        return color;
    }
    static oldLace() {
        let color = Color.fromArgb(0xfd, 0xf5, 0xe6);
        color.name = "Old Lace";
        return color;
    }
    static olive() {
        let color = Color.fromArgb(0x80, 0x80, 0x00);
        color.name = "Olive";
        return color;
    }
    static oliveDrab() {
        let color = Color.fromArgb(0x6b, 0x8e, 0x23);
        color.name = "Olive Drab";
        return color;
    }
    static orange() {
        let color = Color.fromArgb(0xff, 0xa5, 0x00);
        color.name = "Orange";
        return color;
    }
    static orangeRed() {
        let color = Color.fromArgb(0xff, 0x45, 0x00);
        color.name = "Orange Red";
        return color;
    }
    static orchid() {
        let color = Color.fromArgb(0xda, 0x70, 0xd6);
        color.name = "Orchid";
        return color;
    }
    static paleGoldenrod() {
        let color = Color.fromArgb(0xee, 0xe8, 0xaa);
        color.name = "Pale Goldenrod";
        return color;
    }
    static paleGreen() {
        let color = Color.fromArgb(0x98, 0xfb, 0x98);
        color.name = "Pale Green";
        return color;
    }
    static paleTurquoise() {
        let color = Color.fromArgb(0xaf, 0xee, 0xee);
        color.name = "Pale Turquoise";
        return color;
    }
    static paleVioletRed() {
        let color = Color.fromArgb(0xdb, 0x70, 0x93);
        color.name = "Pale Violet Red";
        return color;
    }
    static papayaWhip() {
        let color = Color.fromArgb(0xff, 0xef, 0xd5);
        color.name = "Papaya Whip";
        return color;
    }
    static peachPuff() {
        let color = Color.fromArgb(0xff, 0xda, 0xb9);
        color.name = "Peach Puff";
        return color;
    }
    static peru() {
        let color = Color.fromArgb(0xcd, 0x85, 0x3f);
        color.name = "Peru";
        return color;
    }
    static pink() {
        let color = Color.fromArgb(0xff, 0xc0, 0xcb);
        color.name = "Pink";
        return color;
    }
    static plum() {
        let color = Color.fromArgb(0xdd, 0xa0, 0xdd);
        color.name = "Plum";
        return color;
    }
    static powderBlue() {
        let color = Color.fromArgb(0xb0, 0xe0, 0xe6);
        color.name = "Powder Blue";
        return color;
    }
    static purple() {
        let color = Color.fromArgb(0x80, 0x00, 0x80);
        color.name = "Purple";
        return color;
    }
    static red() {
        let color = Color.fromArgb(0xff, 0x00, 0x00);
        color.name = "Red";
        return color;
    }
    static rosyBrown() {
        let color = Color.fromArgb(0xbc, 0x8f, 0x8f);
        color.name = "Rosy Brown";
        return color;
    }
    static royalBlue() {
        let color = Color.fromArgb(0x41, 0x69, 0xe1);
        color.name = "Royal Blue";
        return color;
    }
    static saddleBrown() {
        let color = Color.fromArgb(0x8b, 0x45, 0x13);
        color.name = "Saddle Brown";
        return color;
    }
    static salmon() {
        let color = Color.fromArgb(0xfa, 0x80, 0x72);
        color.name = "Salmon";
        return color;
    }
    static sandyBrown() {
        let color = Color.fromArgb(0xf4, 0xa4, 0x60);
        color.name = "Sandy Brown";
        return color;
    }
    static seaGreen() {
        let color = Color.fromArgb(0x2e, 0x8b, 0x57);
        color.name = "Sea Green";
        return color;
    }
    static seaShell() {
        let color = Color.fromArgb(0xff, 0xf5, 0xee);
        color.name = "Sea Shell";
        return color;
    }
    static sienna() {
        let color = Color.fromArgb(0xa0, 0x52, 0x2d);
        color.name = "Sienna";
        return color;
    }
    static silver() {
        let color = Color.fromArgb(0xc0, 0xc0, 0xc0);
        color.name = "Silver";
        return color;
    }
    static skyBlue() {
        let color = Color.fromArgb(0x87, 0xce, 0xeb);
        color.name = "Sky Blue";
        return color;
    }
    static slateBlue() {
        let color = Color.fromArgb(0x6a, 0x5a, 0xcd);
        color.name = "Slate Blue";
        return color;
    }
    static slateGray() {
        let color = Color.fromArgb(0x70, 0x80, 0x90);
        color.name = "Slate Gray";
        return color;
    }
    static snow() {
        let color = Color.fromArgb(0xff, 0xfa, 0xfa);
        color.name = "Snow";
        return color;
    }
    static springGreen() {
        let color = Color.fromArgb(0x00, 0xff, 0x7f);
        color.name = "Spring Green";
        return color;
    }
    static steelBlue() {
        let color = Color.fromArgb(0x46, 0x82, 0xb4);
        color.name = "Steel Blue";
        return color;
    }
    static tan() {
        let color = Color.fromArgb(0xd2, 0xb4, 0x8c);
        color.name = "Tan";
        return color;
    }
    static teal() {
        let color = Color.fromArgb(0x00, 0x80, 0x80);
        color.name = "Teal";
        return color;
    }
    static thistle() {
        let color = Color.fromArgb(0xd8, 0xbf, 0xd8);
        color.name = "Thistle";
        return color;
    }
    static tomato() {
        let color = Color.fromArgb(0xff, 0x63, 0x47);
        color.name = "Tomato";
        return color;
    }
    static turquoise() {
        let color = Color.fromArgb(0x40, 0xe0, 0xd0);
        color.name = "Turquoise";
        return color;
    }
    static violet() {
        let color = Color.fromArgb(0xee, 0x82, 0xee);
        color.name = "Violet";
        return color;
    }
    static wheat() {
        let color = Color.fromArgb(0xf5, 0xde, 0xb3);
        color.name = "Wheat";
        return color;
    }
    static white() {
        let color = Color.fromArgb(0xff, 0xff, 0xff);
        color.name = "White";
        return color;
    }
    static whiteSmoke() {
        let color = Color.fromArgb(0xf5, 0xf5, 0xf5);
        color.name = "White Smoke";
        return color;
    }
    static yellow() {
        let color = Color.fromArgb(0xff, 0xff, 0x00);
        color.name = "Yellow";
        return color;
    }
    static yellowGreen() {
        let color = Color.fromArgb(0x9a, 0xcd, 0x32);
        color.name = "Yellow Green";
        return color;
    }
    static transparent() {
        let color = Color.fromArgb(0x00, 0xff, 0xff, 0xff);
        color.name = "Transparent";
        return color;
    }
    static empty() {
        let color = Color.fromArgb(0x00, 0xff, 0xff, 0xff);
        color.name = "Empty";
        return color;
    }
    static fromName(name) {
        name = name.replace(/ /gi, "");
        if (this.isNullOrEmpty(name)) {
            return null; // Color.empty;
        }
        name = name.charAt(0).toLowerCase() + name.substr(1);
        let color = Color[name];
        if (color && typeof color == "function") {
            return color();
        }
        return null; //Color.empty;
    }
    static isNullOrEmpty(value) {
        return value == null || value === "" || value === undefined;
    }
    clone() {
        let color = new Color();
        color.r = this.r;
        color.g = this.g;
        color.b = this.b;
        color.a = this._a;
        color.name = this.name;
        return color;
    }
    isChanged() {
        return this.savedColor == null || !this.savedColor.equals(this);
    }
    resetChanged() {
        this.savedColor = this.clone();
    }
    get a() {
        return this._a;
    }
    set a(value) {
        this._a = value;
        this.name = Color.customName;
    }
    get r() {
        return this._r;
    }
    set r(value) {
        this._r = value;
        this.name = Color.customName;
    }
    get g() {
        return this._g;
    }
    set g(value) {
        this._g = value;
        this.name = Color.customName;
    }
    get b() {
        return this._b;
    }
    set b(value) {
        this._b = value;
        this.name = Color.customName;
    }
    static { this.customName = "Custom"; }
    get isNamedColor() {
        return this.name != Color.customName;
    }
    equals(color) {
        if (color != null) {
            if ((color._a == 0x00 && color._r == 0xff && color._g == 0xff && color._b == 0xff) ||
                (this._a == 0x00 && this._r == 0xff && this._g == 0xff && this._b == 0xff))
                return this._a == color._a;
            else
                return this._a == color._a && this._r == color._r && this._g == color._g && this._b == color._b;
        }
        return false;
    }
    static fromArgb(alpha, red, green, blue) {
        if (typeof red == "undefined") {
            blue = alpha & 0xff;
            green = (alpha >> 8) & 0xff;
            red = (alpha >> 16) & 0xff;
            alpha = (alpha >> 24) & 0xff;
        }
        else if (typeof green == "undefined") {
            blue = red._b;
            green = red._g;
            red = red._r;
        }
        else if (typeof blue == "undefined") {
            blue = green;
            green = red;
            red = alpha;
            alpha = 255;
        }
        let color = new Color();
        color._a = alpha;
        color._r = red;
        color._g = green;
        color._b = blue;
        color.name = Color.customName;
        return color;
    }
    toArgb() {
        let argb = this._a << 24;
        argb += this._r << 16;
        argb += this._g << 8;
        argb += this._b;
        return argb;
    }
    componentToHex(c) {
        let hex = c.toString(16);
        return hex.length == 1 ? "0" + hex : hex;
    }
    getHashCode() {
        return this.toArgb();
    }
    toHtmlColor() {
        return `rgba(${this.r}, ${this.g}, ${this.b}, ${Math.round((100 * this.a) / 255) / 100})`;
    }
    toHexColor() {
        return "#" + this.componentToHex(this.r) + this.componentToHex(this.g) + this.componentToHex(this.b);
    }
    get hexColor() {
        return this.toHtmlColor();
    }
    getStringName() {
        if (this.a == 0) {
            return "Transparent";
        }
        else {
            return `${this.a != 255 ? this.a + "," : ""}${this.r + ","}${this.g + ","}${this.b}`;
        }
    }
    set hexColor(value) {
        let oldColor = this.changesInterceptor ? this.clone() : null;
        let num = parseInt(value.substring(1), 16);
        if (num || num == 0) {
            this.b = num & 0xff;
            this.g = (num >> 8) & 0xff;
            this.r = (num >> 16) & 0xff;
            this.a = 255;
        }
        else {
            let num = value.replace("rgba(", "").replace(")", "");
            let array = num.split(",");
            this.r = isNaN(Number(array[0])) ? 0 : Number(array[0]);
            this.g = isNaN(Number(array[1])) ? 0 : Number(array[1]);
            this.b = isNaN(Number(array[2])) ? 0 : Number(array[2]);
            this.a = isNaN(Math.round(255 * Number(array[3]))) ? 255 : Math.round(255 * Number(array[3]));
        }
        this.name = Color.customName;
        if (this.changesInterceptor) {
            this.changesInterceptor.propertyChanged(this.propertyName, this.clone(), oldColor);
        }
    }
    toString() {
        return this.name != Color.customName ? this.name : this.hexColor;
    }
    deserializeFromString(value) {
        let result;
        if (value.indexOf(",") != -1) {
            let strs = value.split(",");
            if (strs.length == 4) {
                result = Color.fromArgb(parseFloat(strs[0].trim()), parseFloat(strs[1].trim()), parseFloat(strs[2].trim()), parseFloat(strs[3].trim()));
            }
            else {
                result = Color.fromArgb(parseFloat(strs[0].trim()), parseFloat(strs[1].trim()), parseFloat(strs[2].trim()));
            }
        }
        else if (value.indexOf("[") == 0 && value.indexOf("]") == value.length - 1 && value.indexOf(":") != -1) {
            let strs = value.substring(1, value.length - 1).split(":");
            if (strs.length == 4) {
                result = Color.fromArgb(parseFloat(strs[0].trim()), parseFloat(strs[1].trim()), parseFloat(strs[2].trim()), parseFloat(strs[3].trim()));
            }
            else {
                result = Color.fromArgb(parseFloat(strs[0].trim()), parseFloat(strs[1].trim()), parseFloat(strs[2].trim()));
            }
        }
        else {
            result = Color.fromName(value);
        }
        this._r = result._r;
        this._b = result._b;
        this._g = result._g;
        this._a = result._a;
        this.name = result.name;
    }
}

/*
{*******************************************************************}
{                                                                   }

{                                                                   }
{                                                                   }
{   Copyright (C)  Stimulsoft                                       }
{   ALL RIGHTS RESERVED                                             }
{                                                                   }
{   The entire contents of this file is protected by U.S. and       }
{   International Copyright Laws. Unauthorized reproduction,        }
{   reverse-engineering, and distribution of all or any portion of  }
{   the code contained in this file is strictly prohibited and may  }
{   result in severe civil and criminal penalties and will be       }
{   prosecuted to the maximum extent possible under the law.        }
{                                                                   }
{   RESTRICTIONS                                                    }
{                                                                   }
{   THIS SOURCE CODE AND ALL RESULTING INTERMEDIATE FILES           }
{   ARE CONFIDENTIAL AND PROPRIETARY                                }
{   TRADE SECRETS OF Stimulsoft                                     }
{                                                                   }
{   CONSULT THE END USER LICENSE AGREEMENT FOR INFORMATION ON       }
{   ADDITIONAL RESTRICTIONS.                                        }
{                                                                   }
{*******************************************************************}
*/
var UnicodeCategory;
(function (UnicodeCategory) {
    /**
     * Uppercase letter. Signified by the Unicode designation "Lu" (letter, uppercase).
     * The value is 0.
     */
    UnicodeCategory[UnicodeCategory["UppercaseLetter"] = 0] = "UppercaseLetter";
    /**
     * Lowercase letter. Signified by the Unicode designation "Ll" (letter, lowercase).
     * The value is 1.
     */
    UnicodeCategory[UnicodeCategory["LowercaseLetter"] = 1] = "LowercaseLetter";
    /**
     * Titlecase letter. Signified by the Unicode designation "Lt" (letter, titlecase).
     * The value is 2.
     */
    UnicodeCategory[UnicodeCategory["TitlecaseLetter"] = 2] = "TitlecaseLetter";
    /**
     * Modifier letter character, which is free-standing spacing character that
     * indicates modifications of a preceding letter. Signified by the Unicode designation
     * "Lm" (letter, modifier). The value is 3.
     */
    UnicodeCategory[UnicodeCategory["ModifierLetter"] = 3] = "ModifierLetter";
    /**
     * Letter that is not an uppercase letter, a lowercase letter, a titlecase letter,
     * or a modifier letter. Signified by the Unicode designation "Lo" (letter,
     * other). The value is 4.
     */
    UnicodeCategory[UnicodeCategory["OtherLetter"] = 4] = "OtherLetter";
    /**
     * Nonspacing character that indicates modifications of a base character. Signified
     * by the Unicode designation "Mn" (mark, nonspacing). The value is 5.
     */
    UnicodeCategory[UnicodeCategory["NonSpacingMark"] = 5] = "NonSpacingMark";
    /**
     * Spacing character that indicates modifications of a base character and affects
     * the width of the glyph for that base character. Signified by the Unicode
     * designation "Mc" (mark, spacing combining). The value is 6.
     */
    UnicodeCategory[UnicodeCategory["SpacingCombiningMark"] = 6] = "SpacingCombiningMark";
    /**
     * Enclosing mark character, which is a nonspacing combining character that
     * surrounds all previous characters up to and including a base character. Signified
     * by the Unicode designation "Me" (mark, enclosing). The value is 7.
     */
    UnicodeCategory[UnicodeCategory["EnclosingMark"] = 7] = "EnclosingMark";
    /**
     * Decimal digit character, that is, a character in the range 0 through 9. Signified
     * by the Unicode designation "Nd" (number, decimal digit). The value is 8.
     */
    UnicodeCategory[UnicodeCategory["DecimalDigitNumber"] = 8] = "DecimalDigitNumber";
    /**
     * Number represented by a letter, instead of a decimal digit, for example,
     * the Roman numeral for five, which is "V". The indicator is signified by the
     * Unicode designation "Nl" (number, letter). The value is 9.
     */
    UnicodeCategory[UnicodeCategory["LetterNumber"] = 9] = "LetterNumber";
    /**
     * Number that is neither a decimal digit nor a letter number, for example,
     * the fraction 1/2. The indicator is signified by the Unicode designation "No"
     * (number, other). The value is 10.
     */
    UnicodeCategory[UnicodeCategory["OtherNumber"] = 10] = "OtherNumber";
    /**
     * Space character, which has no glyph but is not a control or format character.
     * Signified by the Unicode designation "Zs" (separator, space). The value is 11.
     */
    UnicodeCategory[UnicodeCategory["SpaceSeparator"] = 11] = "SpaceSeparator";
    /**
     * Character that is used to separate lines of text. Signified by the Unicode
     * designation "Zl" (separator, line). The value is 12.
     */
    UnicodeCategory[UnicodeCategory["LineSeparator"] = 12] = "LineSeparator";
    /**
     * Character used to separate paragraphs. Signified by the Unicode designation
     * "Zp" (separator, paragraph). The value is 13.
     */
    UnicodeCategory[UnicodeCategory["ParagraphSeparator"] = 13] = "ParagraphSeparator";
    /**
     * Control code character, with a Unicode value of U+007F or in the range U+0000
     * through U+001F or U+0080 through U+009F. Signified by the Unicode designation
     * "Cc" (other, control). The value is 14.
     */
    UnicodeCategory[UnicodeCategory["Control"] = 14] = "Control";
    /**
     * Format character that affects the layout of text or the operation of text
     * processes, but is not normally rendered. Signified by the Unicode designation
     * "Cf" (other, format). The value is 15.
     */
    UnicodeCategory[UnicodeCategory["Format"] = 15] = "Format";
    /**
     * High surrogate or a low surrogate character. Surrogate code values are in
     * the range U+D800 through U+DFFF. Signified by the Unicode designation "Cs"
     * (other, surrogate). The value is 16.
     */
    UnicodeCategory[UnicodeCategory["Surrogate"] = 16] = "Surrogate";
    /**
     * Private-use character, with a Unicode value in the range U+E000 through U+F8FF.
     * Signified by the Unicode designation "Co" (other, private use). The value is 17.
     */
    UnicodeCategory[UnicodeCategory["PrivateUse"] = 17] = "PrivateUse";
    /**
     * Connector punctuation character that connects two characters. Signified by
     * the Unicode designation "Pc" (punctuation, connector). The value is 18.
     */
    UnicodeCategory[UnicodeCategory["ConnectorPunctuation"] = 18] = "ConnectorPunctuation";
    /**
     * Dash or hyphen character. Signified by the Unicode designation "Pd" (punctuation,
     * dash). The value is 19.
     */
    UnicodeCategory[UnicodeCategory["DashPunctuation"] = 19] = "DashPunctuation";
    /**
     * Opening character of one of the paired punctuation marks, such as parentheses,
     * square brackets, and braces. Signified by the Unicode designation "Ps" (punctuation,
     * open). The value is 20.
     */
    UnicodeCategory[UnicodeCategory["OpenPunctuation"] = 20] = "OpenPunctuation";
    /**
     * Closing character of one of the paired punctuation marks, such as parentheses,
     * square brackets, and braces. Signified by the Unicode designation "Pe" (punctuation,
     * close). The value is 21.
     */
    UnicodeCategory[UnicodeCategory["ClosePunctuation"] = 21] = "ClosePunctuation";
    /**
     * Opening or initial quotation mark character. Signified by the Unicode designation
     * "Pi" (punctuation, initial quote). The value is 22.
     */
    UnicodeCategory[UnicodeCategory["InitialQuotePunctuation"] = 22] = "InitialQuotePunctuation";
    /**
     * Closing or final quotation mark character. Signified by the Unicode designation
     * "Pf" (punctuation, final quote). The value is 23.
     */
    UnicodeCategory[UnicodeCategory["FinalQuotePunctuation"] = 23] = "FinalQuotePunctuation";
    /**
     * Punctuation character that is not a connector, a dash, open punctuation,
     * close punctuation, an initial quote, or a final quote. Signified by the Unicode
     * designation "Po" (punctuation, other). The value is 24.
     */
    UnicodeCategory[UnicodeCategory["OtherPunctuation"] = 24] = "OtherPunctuation";
    /**
     * Mathematical symbol character, such as "+" or "= ". Signified by the Unicode
     * designation "Sm" (symbol, math). The value is 25.
     */
    UnicodeCategory[UnicodeCategory["MathSymbol"] = 25] = "MathSymbol";
    /**
     * Currency symbol character. Signified by the Unicode designation "Sc" (symbol,
     * currency). The value is 26.
     */
    UnicodeCategory[UnicodeCategory["CurrencySymbol"] = 26] = "CurrencySymbol";
    /**
     * Modifier symbol character, which indicates modifications of surrounding characters.
     * For example, the fraction slash indicates that the number to the left is
     * the numerator and the number to the right is the denominator. The indicator
     * is signified by the Unicode designation "Sk" (symbol, modifier). The value is 27.
     */
    UnicodeCategory[UnicodeCategory["ModifierSymbol"] = 27] = "ModifierSymbol";
    /**
     * Symbol character that is not a mathematical symbol, a currency symbol or
     * a modifier symbol. Signified by the Unicode designation "So" (symbol, other).
     * The value is 28.
     */
    UnicodeCategory[UnicodeCategory["OtherSymbol"] = 28] = "OtherSymbol";
    /**
     * Character that is not assigned to any Unicode category. Signified by the
     * Unicode designation "Cn" (other, not assigned). The value is 29.
     */
    UnicodeCategory[UnicodeCategory["OtherNotAssigned"] = 29] = "OtherNotAssigned";
})(UnicodeCategory || (UnicodeCategory = {}));

/*
{*******************************************************************}
{                                                                   }

{                                                                   }
{                                                                   }
{   Copyright (C)  Stimulsoft                                       }
{   ALL RIGHTS RESERVED                                             }
{                                                                   }
{   The entire contents of this file is protected by U.S. and       }
{   International Copyright Laws. Unauthorized reproduction,        }
{   reverse-engineering, and distribution of all or any portion of  }
{   the code contained in this file is strictly prohibited and may  }
{   result in severe civil and criminal penalties and will be       }
{   prosecuted to the maximum extent possible under the law.        }
{                                                                   }
{   RESTRICTIONS                                                    }
{                                                                   }
{   THIS SOURCE CODE AND ALL RESULTING INTERMEDIATE FILES           }
{   ARE CONFIDENTIAL AND PROPRIETARY                                }
{   TRADE SECRETS OF Stimulsoft                                     }
{                                                                   }
{   CONSULT THE END USER LICENSE AGREEMENT FOR INFORMATION ON       }
{   ADDITIONAL RESTRICTIONS.                                        }
{                                                                   }
{*******************************************************************}
*/
class Chars {
    static getUnicodeCategory(char) {
        if (char < 0x3400)
            return this._table_0[char];
        if (char < 0x4db6)
            return UnicodeCategory.OtherLetter;
        if (char < 0x4dc0)
            return UnicodeCategory.OtherNotAssigned;
        if (char < 0x4e00)
            return UnicodeCategory.OtherSymbol;
        if (char < 0x9fc0)
            return UnicodeCategory.OtherLetter;
        if (char < 0xac00)
            return this._table_9fc0[char - 0x9fc0];
        if (char < 0xd780)
            return UnicodeCategory.OtherLetter;
        if (char < 0xd800)
            return this._table_d780[char - 0xd780];
        if (char < 0xe000)
            return UnicodeCategory.Surrogate;
        if (char < 0xf900)
            return UnicodeCategory.PrivateUse;
        if (char < 0xfa40)
            return UnicodeCategory.OtherLetter;
        if (char < 0x10000)
            return this._table_fa40[char - 0xfa40];
        return UnicodeCategory.OtherNotAssigned;
    }
    static { this._table_0 = [
        14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 11, 24, 24, 24, 26, 24, 24, 24, 20, 21, 24, 25, 24, 19, 24, 24, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 24, 24, 25, 25, 25, 24,
        24, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 20, 24, 21, 27, 18, 27, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 20, 25, 21, 25, 14,
        14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 14, 11, 24, 26, 26, 26, 26, 28, 28, 27, 28, 1, 22, 25, 19, 28, 27, 28, 25, 10, 10, 27, 1, 28, 24, 27, 10, 1, 23, 10, 10, 10, 24,
        0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 25, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 25, 1, 1, 1, 1, 1, 1, 1, 1,
        0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 1, 0, 1, 0, 1, 0, 1, 0,
        1, 0, 1, 0, 1, 0, 1, 0, 1, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 0, 1, 0, 1, 0, 1, 1,
        1, 0, 0, 1, 0, 1, 0, 0, 1, 0, 0, 0, 1, 1, 0, 0, 0, 0, 1, 0, 0, 1, 0, 0, 0, 1, 1, 1, 0, 0, 1, 0, 0, 1, 0, 1, 0, 1, 0, 0, 1, 0, 1, 1, 0, 1, 0, 0, 1, 0, 0, 0, 1, 0, 1, 0, 0, 1, 1, 4, 0, 1, 1, 1,
        4, 4, 4, 4, 0, 2, 1, 0, 2, 1, 0, 2, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 1, 0, 2, 1, 0, 1, 0, 0, 0, 1, 0, 1, 0, 1, 0, 1,
        0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 1, 1, 1, 1, 1, 1, 0, 0, 1, 0, 0, 1,
        1, 0, 1, 0, 0, 0, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
        1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 4, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3,
        3, 3, 27, 27, 27, 27, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 3, 3, 3, 3, 3, 27, 27, 27, 27, 27, 27, 27, 3, 27, 3, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27,
        5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5,
        5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 0, 1, 0, 1, 3, 27, 0, 1, 29, 29, 3, 1, 1, 1, 24, 0,
        29, 29, 29, 29, 27, 27, 0, 24, 0, 0, 0, 29, 0, 29, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 29, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
        1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 1, 1, 0, 0, 0, 1, 1, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 1, 1, 1, 1, 0, 1, 25, 0, 1, 0, 0, 1, 1, 0, 0, 0,
        0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
        1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1,
        0, 1, 28, 5, 5, 5, 5, 5, 7, 7, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1,
        0, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1,
        0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 29, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
        0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 29, 29, 3, 24, 24, 24, 24, 24, 24, 29, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
        1, 1, 1, 1, 1, 1, 1, 1, 29, 24, 19, 29, 29, 28, 28, 26, 29, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 19, 5,
        24, 5, 5, 24, 5, 5, 24, 5, 29, 29, 29, 29, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 29, 4, 4, 4, 24, 24, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        15, 15, 15, 15, 15, 15, 25, 25, 25, 24, 24, 26, 24, 24, 28, 28, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 24, 15, 29, 24, 24, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        3, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 24, 24, 24, 24, 4, 4, 5, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 24, 4, 5, 5, 5, 5, 5, 5, 5, 15, 28, 5, 5, 5, 5, 5, 5, 3, 3, 5, 5, 28, 5, 5, 5, 5, 4, 4, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 4, 4, 4, 28, 28, 4,
        24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 29, 15, 4, 5, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5,
        5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 4, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 5, 5, 5, 5, 5, 5, 5, 3, 3, 28, 24, 24, 24, 3, 29, 29, 29, 29, 29,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 5, 5, 3, 5, 5, 5, 5, 5, 5, 5, 5, 5, 3, 5, 5, 5, 3, 5, 5, 5, 5, 5, 29, 29, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 29,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 5, 29, 29, 24, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5,
        5, 5, 5, 6, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 6, 5, 4, 6, 6,
        6, 5, 5, 5, 5, 5, 5, 5, 5, 6, 6, 6, 6, 5, 6, 6, 4, 5, 5, 5, 5, 5, 5, 5, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 24, 24, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 24, 3, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 5, 6, 6, 29, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 4, 4, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 29, 4, 29, 29, 29, 4, 4, 4, 4, 29, 29, 5, 4, 6, 6,
        6, 5, 5, 5, 5, 29, 29, 6, 6, 29, 29, 6, 6, 5, 4, 29, 29, 29, 29, 29, 29, 29, 29, 6, 29, 29, 29, 29, 4, 4, 29, 4, 4, 4, 5, 5, 29, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 4, 4, 26, 26, 10, 10, 10, 10, 10, 10, 28, 26, 29, 29, 29, 29,
        29, 5, 5, 6, 29, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 4, 4, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 29, 4, 4, 29, 4, 4, 29, 29, 5, 29, 6, 6,
        6, 5, 5, 29, 29, 29, 29, 5, 5, 29, 29, 5, 5, 5, 29, 29, 29, 5, 29, 29, 29, 29, 29, 29, 29, 4, 4, 4, 4, 29, 4, 29, 29, 29, 29, 29, 29, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 5, 5, 4, 4, 4, 5, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        29, 5, 5, 6, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 29, 4, 4, 4, 4, 4, 29, 29, 5, 4, 6, 6,
        6, 5, 5, 5, 5, 5, 29, 5, 5, 6, 29, 6, 6, 5, 29, 29, 4, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 4, 4, 5, 5, 29, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 24, 26, 29, 29, 29, 29, 29, 29, 29, 4, 29, 29, 29, 29, 29, 29,
        29, 5, 6, 6, 29, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 4, 4, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 29, 4, 4, 4, 4, 4, 29, 29, 5, 4, 6, 5,
        6, 5, 5, 5, 5, 29, 29, 6, 6, 29, 29, 6, 6, 5, 29, 29, 29, 29, 29, 29, 29, 29, 5, 6, 29, 29, 29, 29, 4, 4, 29, 4, 4, 4, 5, 5, 29, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 28, 4, 10, 10, 10, 10, 10, 10, 29, 29, 29, 29, 29, 29, 29, 29,
        29, 29, 5, 4, 29, 4, 4, 4, 4, 4, 4, 29, 29, 29, 4, 4, 4, 29, 4, 4, 4, 4, 29, 29, 29, 4, 4, 29, 4, 29, 4, 4, 29, 29, 29, 4, 4, 29, 29, 29, 4, 4, 4, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 6, 6,
        5, 6, 6, 29, 29, 29, 6, 6, 6, 29, 6, 6, 6, 5, 29, 29, 4, 29, 29, 29, 29, 29, 29, 6, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 10, 10, 10, 28, 28, 28, 28, 28, 28, 26, 28, 29, 29, 29, 29, 29,
        5, 6, 6, 6, 29, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 4, 5, 5,
        5, 6, 6, 6, 6, 29, 5, 5, 5, 29, 5, 5, 5, 5, 29, 29, 29, 29, 29, 29, 29, 5, 5, 29, 4, 4, 4, 29, 29, 29, 29, 29, 4, 4, 5, 5, 29, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 29, 29, 29, 29, 29, 29, 29, 29, 10, 10, 10, 10, 10, 10, 10, 28,
        29, 5, 6, 6, 29, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 29, 29, 5, 4, 6, 5,
        6, 6, 6, 6, 6, 29, 5, 6, 6, 29, 6, 6, 5, 5, 29, 29, 29, 29, 29, 29, 29, 6, 6, 29, 29, 29, 29, 29, 29, 29, 4, 29, 4, 4, 5, 5, 29, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 29, 4, 4, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        29, 5, 6, 6, 29, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 4, 6, 6,
        6, 5, 5, 5, 5, 29, 6, 6, 6, 29, 6, 6, 6, 5, 4, 29, 29, 29, 29, 29, 29, 29, 29, 6, 29, 29, 29, 29, 29, 29, 29, 4, 4, 4, 5, 5, 29, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 10, 10, 10, 10, 10, 10, 29, 29, 29, 28, 4, 4, 4, 4, 4, 4,
        29, 29, 6, 6, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 29, 29,
        4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 5, 29, 29, 29, 29, 6, 6, 6, 5, 5, 5, 29, 5, 29, 6, 6, 6, 6, 6, 6, 6, 6, 29, 29, 29, 29, 29, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 29, 29, 6, 6, 24, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 4, 4, 5, 5, 5, 5, 5, 5, 5, 29, 29, 29, 29, 26,
        4, 4, 4, 4, 4, 4, 3, 5, 5, 5, 5, 5, 5, 5, 5, 24, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 24, 24, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        29, 4, 4, 29, 4, 29, 29, 4, 4, 29, 4, 29, 29, 4, 29, 29, 29, 29, 29, 29, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 29, 4, 29, 4, 29, 29, 4, 4, 29, 4, 4, 4, 4, 5, 4, 4, 5, 5, 5, 5, 5, 5, 29, 5, 5, 4, 29, 29,
        4, 4, 4, 4, 4, 29, 3, 29, 5, 5, 5, 5, 5, 5, 29, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 29, 29, 4, 4, 4, 4, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        4, 28, 28, 28, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 28, 24, 28, 28, 28, 5, 5, 28, 28, 28, 28, 28, 28, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 28, 5, 28, 5, 28, 5, 20, 21, 20, 21, 6, 6,
        4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 6,
        5, 5, 5, 5, 5, 24, 5, 5, 4, 4, 4, 4, 4, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 29, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 29, 28, 28,
        28, 28, 28, 28, 28, 28, 5, 28, 28, 28, 28, 28, 28, 29, 28, 28, 24, 24, 24, 24, 24, 28, 28, 28, 28, 24, 24, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 6, 6, 5, 5, 5, 5, 6, 5, 5, 5, 5, 5, 5, 6, 5, 5, 6, 6, 5, 5, 4,
        8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 24, 24, 24, 24, 24, 24, 4, 4, 4, 4, 4, 4, 6, 6, 5, 5, 4, 4, 4, 4, 5, 5, 5, 4, 6, 6, 6, 4, 4, 6, 6, 6, 6, 6, 6, 6, 4, 4, 4, 5, 5, 5, 5, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 5, 6, 6, 5, 5, 6, 6, 6, 6, 6, 6, 5, 4, 6, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 6, 6, 6, 5, 28, 28, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
        0, 0, 0, 0, 0, 0, 29, 0, 29, 29, 29, 29, 29, 0, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 24, 3, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 29, 29, 4, 4, 4, 4, 4, 4, 4, 29, 4, 29, 4, 4, 4, 4, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 29, 29, 4, 4, 4, 4, 4, 4, 4, 29,
        4, 29, 4, 4, 4, 4, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 5, 5, 5, 24, 24, 24, 24, 24, 24, 24, 24, 24, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 29, 29, 29,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 29, 29, 29, 29, 29, 29, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
        0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 29, 29, 1, 1, 1, 1, 1, 1, 29, 29,
        19, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 24, 24, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        11, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 20, 21, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 24, 24, 24, 9, 9, 9, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 29, 29, 29,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 5, 5, 5, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 5, 24, 24, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 29, 5, 5, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 6, 5, 5, 5, 5, 5, 5, 5, 6, 6,
        6, 6, 6, 6, 6, 6, 5, 6, 6, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 24, 24, 24, 3, 24, 24, 24, 26, 4, 5, 29, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 29, 29, 29, 29, 29, 29, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 29, 29, 29, 29, 29, 29,
        24, 24, 24, 24, 24, 24, 19, 24, 24, 24, 24, 5, 5, 5, 15, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 29, 29, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 3, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 29, 29, 29, 29,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 4, 29, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 5, 5, 5, 6, 6, 6, 6, 5, 5, 6, 6, 6, 29, 29, 29, 29, 6, 6, 5, 6, 6, 6, 6, 6, 6, 5, 5, 5, 29, 29, 29, 29,
        28, 29, 29, 29, 24, 24, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 4, 4, 4, 4, 4, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 29, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 10, 29, 29, 29, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 6, 6, 5, 29, 29, 24, 24, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 6, 5, 6, 5, 5, 5, 5, 5, 5, 5, 29, 5, 6, 5, 6, 6, 5, 5, 5, 5, 5, 5, 5, 5, 6, 6, 6, 6, 6, 6, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 29, 29, 5,
        8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 29, 29, 29, 29, 29, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 29, 29, 29, 29, 29, 29, 24, 24, 24, 24, 24, 24, 24, 3, 24, 24, 24, 24, 24, 24, 29, 29, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 7, 29,
        29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        5, 5, 5, 5, 6, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 6, 5, 5, 5, 5, 5, 6, 5, 6, 6, 6,
        6, 6, 5, 6, 6, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 24, 24, 24, 24, 24, 24, 24, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 5, 5, 5, 5, 5, 5, 5, 5, 5, 28, 28, 28, 28, 28, 28, 28, 28, 28, 29, 29, 29,
        5, 5, 6, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 6, 5, 5, 5, 5, 6, 6, 5, 5, 6, 5, 5, 5, 4, 4, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 6, 5, 5, 6, 6, 6, 5, 6, 5, 5, 5, 6, 6, 29, 29, 29, 29, 29, 29, 29, 29, 24, 24, 24, 24,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 6, 6, 6, 6, 6, 6, 6, 6, 5, 5, 5, 5, 5, 5, 5, 5, 6, 6, 5, 5, 29, 29, 29, 24, 24, 24, 24, 24,
        8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 29, 29, 29, 4, 4, 4, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 3, 3, 3, 3, 3, 3, 24, 24,
        29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        24, 24, 24, 24, 24, 24, 24, 24, 29, 29, 29, 29, 29, 29, 29, 29, 5, 5, 5, 24, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 6, 5, 5, 5, 5, 5, 5, 5, 4, 4, 4, 4, 5, 4, 4, 4, 4, 6, 6, 5, 4, 4, 29, 5, 5, 29, 29, 29, 29, 29, 29,
        1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3,
        3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 3, 1, 1, 1, 1, 1, 1, 1,
        1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3,
        5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 29, 29, 29, 29, 29, 29, 5, 5, 5, 5,
        0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1,
        0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1,
        0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1,
        0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1,
        1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 29, 29, 0, 0, 0, 0, 0, 0, 29, 29, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0,
        1, 1, 1, 1, 1, 1, 29, 29, 0, 0, 0, 0, 0, 0, 29, 29, 1, 1, 1, 1, 1, 1, 1, 1, 29, 0, 29, 0, 29, 0, 29, 0, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 29, 29,
        1, 1, 1, 1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 1, 1, 1, 1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 1, 1, 1, 1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 1, 1, 1, 1, 1, 29, 1, 1, 0, 0, 0, 0, 2, 27, 1, 27,
        27, 27, 1, 1, 1, 29, 1, 1, 0, 0, 0, 0, 2, 27, 27, 27, 1, 1, 1, 1, 29, 29, 1, 1, 0, 0, 0, 0, 29, 27, 27, 27, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 27, 27, 27, 29, 29, 1, 1, 1, 29, 1, 1, 0, 0, 0, 0, 2, 27, 27, 29,
        11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 15, 15, 15, 15, 15, 19, 19, 19, 19, 19, 19, 24, 24, 22, 23, 20, 22, 22, 23, 20, 22, 24, 24, 24, 24, 24, 24, 24, 24, 12, 13, 15, 15, 15, 15, 15, 11, 24, 24, 24, 24, 24, 24, 24, 24, 24, 22, 23, 24, 24, 24, 24, 18,
        18, 24, 24, 24, 25, 20, 21, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 25, 24, 18, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 11, 15, 15, 15, 15, 15, 29, 15, 15, 15, 15, 15, 15, 15, 15, 15, 15, 10, 3, 29, 29, 10, 10, 10, 10, 10, 10, 25, 25, 25, 20, 21, 3,
        10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 25, 25, 25, 20, 21, 29, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 29, 29, 29, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 26, 29,
        29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 7, 7, 7, 7, 5, 7, 7, 7, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        28, 28, 0, 28, 28, 28, 28, 0, 28, 28, 1, 0, 0, 0, 1, 1, 0, 0, 0, 1, 28, 0, 28, 28, 25, 0, 0, 0, 0, 0, 28, 28, 28, 28, 28, 28, 0, 28, 0, 28, 0, 28, 0, 0, 0, 0, 28, 1, 0, 0, 0, 0, 1, 4, 4, 4, 4, 1, 28, 28, 1, 1, 0, 0,
        25, 25, 25, 25, 25, 0, 1, 1, 1, 1, 28, 25, 28, 28, 1, 28, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9,
        9, 9, 9, 0, 1, 9, 9, 9, 9, 10, 28, 28, 29, 29, 29, 29, 25, 25, 25, 25, 25, 28, 28, 28, 28, 28, 25, 25, 28, 28, 28, 28, 25, 28, 28, 25, 28, 28, 25, 28, 28, 28, 28, 28, 28, 28, 25, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 25, 25, 28, 28, 25, 28, 25, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25,
        25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25,
        25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25,
        25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25,
        25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25,
        28, 28, 28, 28, 28, 28, 28, 28, 20, 21, 20, 21, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 25, 25, 28, 28, 28, 28, 28, 28, 28, 20, 21, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 25, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 25, 25, 25, 25, 25, 25, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 29, 29, 29, 29, 29,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10,
        10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 25, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 25, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 25, 25, 25, 25, 25, 25, 25, 25,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 25, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 20, 21, 20, 21, 20, 21, 20, 21, 20, 21, 20, 21, 20, 21, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10,
        10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        25, 25, 25, 25, 25, 20, 21, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 20, 21, 20, 21, 20, 21, 20, 21, 20, 21, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25,
        25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25,
        25, 25, 25, 20, 21, 20, 21, 20, 21, 20, 21, 20, 21, 20, 21, 20, 21, 20, 21, 20, 21, 20, 21, 20, 21, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25,
        25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 20, 21, 20, 21, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 20, 21, 25, 25,
        25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25,
        25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25,
        25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25,
        25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25, 25,
        25, 25, 25, 25, 25, 28, 28, 25, 25, 25, 25, 25, 25, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 29, 29, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 29, 29, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 29, 29, 29, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 29, 28, 28, 28, 28, 28, 28, 28, 28, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 28, 28, 28, 28, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 29, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
        1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 29, 0, 1, 0, 0, 0, 1, 1, 0, 1, 0, 1, 0, 1, 0, 0, 0, 0, 1, 0, 1, 1, 0, 1, 1, 1, 1, 1, 1, 3, 3, 0, 0,
        0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1,
        0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 1, 28, 28, 28, 28, 28, 28, 0, 1, 0, 1, 5, 5, 5, 0, 1, 29, 29, 29, 29, 29, 24, 24, 24, 24, 10, 24, 24,
        1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 29, 1, 29, 29, 29, 29, 29, 1, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 29, 29, 29, 3, 24, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 5,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 29, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 29,
        4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 29, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5,
        24, 24, 22, 23, 22, 23, 24, 24, 24, 22, 23, 24, 22, 23, 24, 24, 24, 24, 24, 24, 24, 24, 24, 19, 24, 24, 19, 24, 22, 23, 24, 24, 22, 23, 20, 21, 20, 21, 20, 21, 20, 21, 24, 24, 24, 24, 24, 3, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 19, 19, 24, 24, 24, 24,
        19, 24, 20, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 29, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 29, 29, 29, 29,
        11, 24, 24, 24, 28, 3, 4, 9, 20, 21, 20, 21, 20, 21, 20, 21, 20, 21, 28, 28, 20, 21, 20, 21, 20, 21, 20, 21, 19, 20, 21, 21, 28, 9, 9, 9, 9, 9, 9, 9, 9, 9, 5, 5, 5, 5, 6, 6, 19, 3, 3, 3, 3, 3, 28, 28, 9, 9, 9, 3, 4, 24, 28, 28,
        29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 5, 5, 27, 27, 3, 3, 4, 19, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 24, 3, 3, 3, 4,
        29, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 28, 28, 10, 10, 10, 10, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 29,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 29, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 10, 10, 10, 10, 10, 10, 10, 10, 28, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 29,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28
    ]; }
    static { this._table_9fc0 = [
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 3, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28, 28,
        28, 28, 28, 28, 28, 28, 28, 29, 29, 29, 29, 29, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 3, 3, 3, 3, 3, 3, 24, 24,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 3, 24, 24, 24, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 4, 4, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 4, 5, 7, 7, 7, 24, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 24, 3,
        0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 3, 3, 5, 5, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 5, 5, 24, 24, 24, 24, 24, 24, 29, 29, 29, 29, 29, 29, 29, 29,
        27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 3, 3, 3, 3, 3, 3, 3, 3, 3, 27, 27, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 1, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1,
        0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 3, 1, 1, 1, 1, 1, 1, 1, 1, 0, 1, 0, 1, 0, 0, 1,
        0, 1, 0, 1, 0, 1, 0, 1, 3, 27, 27, 0, 1, 0, 1, 4, 0, 1, 0, 1, 1, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 0, 0, 0, 29, 29, 0, 0, 0, 0, 0, 1, 0, 1, 29, 29, 29, 29, 29, 29, 29, 29,
        29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 4, 3, 3, 1, 4, 4, 4, 4, 4,
        4, 4, 5, 4, 4, 4, 5, 4, 4, 4, 4, 5, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 6, 6, 5, 5, 6, 28, 28, 28, 28, 29, 29, 29, 29, 10, 10, 10, 10, 10, 10, 28, 28, 26, 28, 29, 29, 29, 29, 29, 29,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 24, 24, 24, 24, 29, 29, 29, 29, 29, 29, 29, 29,
        6, 6, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6,
        6, 6, 6, 6, 5, 29, 29, 29, 29, 29, 29, 29, 29, 29, 24, 24, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 29, 29, 29, 29, 29, 29, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 4, 4, 4, 4, 4, 4, 24, 24, 24, 4, 24, 4, 29, 29,
        8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 5, 5, 5, 5, 5, 5, 24, 24, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 6, 6, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 24, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29,
        5, 5, 5, 6, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 6, 6, 5, 5, 5, 5, 6, 6, 5, 6, 6, 6,
        6, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 29, 3, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 29, 29, 29, 29, 24, 24, 4, 4, 4, 4, 4, 5, 3, 4, 4, 4, 4, 4, 4, 4, 4, 4, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 4, 4, 4, 4, 4, 29,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 5, 5, 5, 5, 5, 6, 6, 5, 5, 6, 6, 5, 5, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        4, 4, 4, 5, 4, 4, 4, 4, 4, 4, 4, 4, 5, 6, 29, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 29, 29, 24, 24, 24, 24, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 3, 4, 4, 4, 4, 4, 4, 28, 28, 28, 4, 6, 5, 6, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 5, 4, 5, 5, 5, 4, 4, 5, 5, 4, 4, 4, 4, 4, 5, 5,
        4, 5, 4, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 4, 4, 3, 24, 24, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 6, 5, 5, 6, 6, 24, 24, 4, 3, 3, 6, 5, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        29, 4, 4, 4, 4, 4, 4, 29, 29, 4, 4, 4, 4, 4, 4, 29, 29, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 29, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 29, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
        1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 27, 3, 3, 3, 3, 1, 1, 1, 1, 1, 1, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
        1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 6, 6, 5, 6, 6, 5, 6, 6, 24, 6, 5, 29, 29, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 29, 29, 29, 29, 29, 29
    ]; }
    static { this._table_d780 = [
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29
    ]; }
    static { this._table_fa40 = [
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29,
        1, 1, 1, 1, 1, 1, 1, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 1, 1, 1, 1, 1, 29, 29, 29, 29, 29, 4, 5, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 25, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 29, 4, 29,
        4, 4, 29, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27, 27,
        27, 27, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 21, 20,
        29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 26, 28, 29, 29,
        5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 24, 24, 24, 24, 24, 24, 24, 20, 21, 24, 29, 29, 29, 29, 29, 29, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 24, 19, 19, 18, 18, 20, 21, 20, 21, 20, 21, 20, 21, 20, 21, 20,
        21, 20, 21, 20, 21, 24, 24, 20, 21, 24, 24, 24, 24, 18, 18, 18, 24, 24, 24, 29, 24, 24, 24, 24, 19, 20, 21, 20, 21, 20, 21, 24, 24, 24, 25, 19, 25, 25, 25, 29, 24, 26, 24, 24, 29, 29, 29, 29, 4, 4, 4, 4, 4, 29, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29, 29, 15,
        29, 24, 24, 24, 26, 24, 24, 24, 20, 21, 24, 25, 24, 19, 24, 24, 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 24, 24, 25, 25, 25, 24, 24, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 20, 24, 21, 27, 18,
        27, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 20, 25, 21, 25, 20, 21, 24, 20, 21, 24, 24, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 3, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4,
        4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 3, 3, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 29,
        29, 29, 4, 4, 4, 4, 4, 4, 29, 29, 4, 4, 4, 4, 4, 4, 29, 29, 4, 4, 4, 4, 4, 4, 29, 29, 4, 4, 4, 29, 29, 29, 26, 26, 25, 27, 28, 26, 26, 29, 28, 25, 25, 25, 25, 28, 28, 29, 29, 29, 29, 29, 29, 29, 29, 29, 29, 15, 15, 15, 28, 28, 29, 29
    ]; }
}

/*
{*******************************************************************}
{                                                                   }

{                                                                   }
{                                                                   }
{   Copyright (C)  Stimulsoft                                       }
{   ALL RIGHTS RESERVED                                             }
{                                                                   }
{   The entire contents of this file is protected by U.S. and       }
{   International Copyright Laws. Unauthorized reproduction,        }
{   reverse-engineering, and distribution of all or any portion of  }
{   the code contained in this file is strictly prohibited and may  }
{   result in severe civil and criminal penalties and will be       }
{   prosecuted to the maximum extent possible under the law.        }
{                                                                   }
{   RESTRICTIONS                                                    }
{                                                                   }
{   THIS SOURCE CODE AND ALL RESULTING INTERMEDIATE FILES           }
{   ARE CONFIDENTIAL AND PROPRIETARY                                }
{   TRADE SECRETS OF Stimulsoft                                     }
{                                                                   }
{   CONSULT THE END USER LICENSE AGREEMENT FOR INFORMATION ON       }
{   ADDITIONAL RESTRICTIONS.                                        }
{                                                                   }
{*******************************************************************}
*/
class Char {
    static isUpper(char, index = 0) {
        let cat = this.getUnicodeCategory(char, index);
        return (cat == UnicodeCategory.UppercaseLetter);
    }
    static isLower(char, index = 0) {
        let cat = this.getUnicodeCategory(char, index);
        return (cat == UnicodeCategory.LowercaseLetter);
    }
    static isLetter(char, index = 0) {
        let cat = this.getUnicodeCategory(char, index);
        return this.checkLetter(cat);
    }
    static isDigit(char, index = 0) {
        if (char != null && typeof char == "number") {
            let cat = Chars.getUnicodeCategory(char);
            return (cat == UnicodeCategory.DecimalDigitNumber);
        }
        let cat = this.getUnicodeCategory(char, index);
        return (cat == UnicodeCategory.DecimalDigitNumber);
    }
    static isLetterOrDigit(char, index = 0) {
        let cat = this.getUnicodeCategory(char, index);
        return this.checkLetter(cat) || cat == UnicodeCategory.DecimalDigitNumber;
    }
    static toLower(char) {
        return char.toLocaleLowerCase();
    }
    static toUpper(char) {
        return char.toLocaleUpperCase();
    }
    static isWhitespace(char, index = 0, allowNbsp = true) {
        if (char == null || char.length < index + 1)
            return false;
        let code = char.charCodeAt(index);
        if ((code == 0x20) || (code >= 0x09 && code <= 0x0d) || (code == 0xa0 && allowNbsp) || code == 0x85)
            return true;
        let cat = Chars.getUnicodeCategory(code);
        return cat == UnicodeCategory.SpaceSeparator ||
            cat == UnicodeCategory.LineSeparator ||
            cat == UnicodeCategory.ParagraphSeparator;
    }
    static checkLetter(uc) {
        return uc == UnicodeCategory.UppercaseLetter ||
            uc == UnicodeCategory.LowercaseLetter ||
            uc == UnicodeCategory.TitlecaseLetter ||
            uc == UnicodeCategory.ModifierLetter ||
            uc == UnicodeCategory.OtherLetter;
    }
    static getUnicodeCategory(char, index = 0) {
        if (char == null || char.length < index + 1)
            return UnicodeCategory.OtherNotAssigned;
        let code = char.charCodeAt(index);
        return Chars.getUnicodeCategory(code);
    }
    static isControl(char, index = 0) {
        return Char.getUnicodeCategory(char, index) == UnicodeCategory.Control;
    }
}

/*
{*******************************************************************}
{                                                                   }

{                                                                   }
{                                                                   }
{   Copyright (C)  Stimulsoft                                       }
{   ALL RIGHTS RESERVED                                             }
{                                                                   }
{   The entire contents of this file is protected by U.S. and       }
{   International Copyright Laws. Unauthorized reproduction,        }
{   reverse-engineering, and distribution of all or any portion of  }
{   the code contained in this file is strictly prohibited and may  }
{   result in severe civil and criminal penalties and will be       }
{   prosecuted to the maximum extent possible under the law.        }
{                                                                   }
{   RESTRICTIONS                                                    }
{                                                                   }
{   THIS SOURCE CODE AND ALL RESULTING INTERMEDIATE FILES           }
{   ARE CONFIDENTIAL AND PROPRIETARY                                }
{   TRADE SECRETS OF Stimulsoft                                     }
{                                                                   }
{   CONSULT THE END USER LICENSE AGREEMENT FOR INFORMATION ON       }
{   ADDITIONAL RESTRICTIONS.                                        }
{                                                                   }
{*******************************************************************}
*/
class Enum {
    static getName(enumType, value) {
        let values = "";
        if (enumType[value] == undefined) {
            // eslint-disable-next-line @typescript-eslint/no-for-in-array
            for (let enumValue in enumType) {
                let enumValueNumber = +enumValue;
                if (enumValueNumber != 0 && (value & enumValueNumber) == enumValueNumber) {
                    value -= enumValueNumber;
                    // eslint-disable-next-line @typescript-eslint/restrict-plus-operands
                    values += (values.length > 0 ? ", " : "") + enumType[enumValueNumber];
                }
            }
            if (values.length == 0)
                values = enumType[0];
            return values;
        }
        return enumType[value];
    }
    static parse(enumType, value, upperFirstChar = true) {
        if (value == null)
            return null;
        if (typeof value == "number" || Char.isDigit(value))
            value = Enum.getName(enumType, +value);
        let values = value.toString().split(",");
        let enumValue;
        // tslint:disable-next-line: prefer-for-of
        for (let index = 0; index < values.length; index++) {
            let strValue = upperFirstChar ? this.upperFirstChar(values[index]) : values[index];
            if (typeof enumValue == "undefined")
                enumValue = enumType[strValue];
            else
                enumValue += enumType[strValue];
        }
        return enumValue;
    }
    static upperFirstChar(str) {
        str = str.trim();
        return str.length > 0 ? str.charAt(0).toUpperCase() + str.slice(1) : str;
    }
    static getNames(enumType) {
        let names = [];
        for (let enumValue in enumType) {
            if (typeof enumType[enumValue] != "number")
                names.push(enumType[enumValue]);
        }
        return names;
    }
    static getValues(enumType) {
        let values = [];
        for (let enumValue in enumType) {
            if (typeof enumType[enumValue] != "number")
                values.push(+enumValue);
        }
        return values;
    }
    toString() {
        return this.name;
    }
    /*compareTo(value: Enum): number {
      if (this.value != null)
        return this.value.compareTo(value.value);
  
      return this.name.compareTo(value.name);
    }*/
    constructor(name, value = null) {
        this.name = name;
        this.value = value;
    }
}

var StiElements;
(function (StiElements) {
    StiElements["StiTextBox"] = "app-sti-text-box";
    StiElements["StiCheckBox"] = "sti-checkbox-component";
    StiElements["StiComboBox"] = "app-sti-combo-box";
    StiElements["StiListBox"] = "app-sti-list-box";
    StiElements["StiNumberBox"] = "app-sti-number-box";
    StiElements["StiDateTimeBox"] = "app-sti-date-time-box";
    StiElements["StiDescription"] = "app-sti-description";
    StiElements["StiMultipleSelection"] = "app-sti-multiple-selection";
    StiElements["StiPanel"] = "app-sti-panel";
    StiElements["StiSignature"] = "app-sti-signature";
    StiElements["StiSingleSelection"] = "app-sti-single-selection";
    StiElements["StiTable"] = "app-sti-table";
})(StiElements || (StiElements = {}));
var StiLabelAlignment;
(function (StiLabelAlignment) {
    StiLabelAlignment[StiLabelAlignment["Left"] = 1] = "Left";
    StiLabelAlignment[StiLabelAlignment["Right"] = 2] = "Right";
    StiLabelAlignment[StiLabelAlignment["Top"] = 3] = "Top";
})(StiLabelAlignment || (StiLabelAlignment = {}));
var StiLineWeight;
(function (StiLineWeight) {
    StiLineWeight[StiLineWeight["Thin"] = 1] = "Thin";
    StiLineWeight[StiLineWeight["Normal"] = 2] = "Normal";
    StiLineWeight[StiLineWeight["Thick"] = 3] = "Thick";
})(StiLineWeight || (StiLineWeight = {}));
var StiTextHorAlignment;
(function (StiTextHorAlignment) {
    StiTextHorAlignment[StiTextHorAlignment["Left"] = 0] = "Left";
    StiTextHorAlignment[StiTextHorAlignment["Center"] = 1] = "Center";
    StiTextHorAlignment[StiTextHorAlignment["Right"] = 2] = "Right";
    StiTextHorAlignment[StiTextHorAlignment["Width"] = 3] = "Width";
})(StiTextHorAlignment || (StiTextHorAlignment = {}));
var StiTextRangeFormat;
(function (StiTextRangeFormat) {
    StiTextRangeFormat[StiTextRangeFormat["Characters"] = 0] = "Characters";
})(StiTextRangeFormat || (StiTextRangeFormat = {}));
var StiNumberRangeFormat;
(function (StiNumberRangeFormat) {
    StiNumberRangeFormat[StiNumberRangeFormat["Digits"] = 0] = "Digits";
    StiNumberRangeFormat[StiNumberRangeFormat["Values"] = 1] = "Values";
})(StiNumberRangeFormat || (StiNumberRangeFormat = {}));
var StiDisplayCurrencyAs;
(function (StiDisplayCurrencyAs) {
    StiDisplayCurrencyAs[StiDisplayCurrencyAs["Symbol"] = 1] = "Symbol";
    StiDisplayCurrencyAs[StiDisplayCurrencyAs["Code"] = 2] = "Code";
})(StiDisplayCurrencyAs || (StiDisplayCurrencyAs = {}));
var StiBarcodeType;
(function (StiBarcodeType) {
    StiBarcodeType[StiBarcodeType["AustraliaPost4State"] = 0] = "AustraliaPost4State";
    StiBarcodeType[StiBarcodeType["Aztec"] = 1] = "Aztec";
    StiBarcodeType[StiBarcodeType["Codabar"] = 2] = "Codabar";
    StiBarcodeType[StiBarcodeType["Code11"] = 3] = "Code11";
    StiBarcodeType[StiBarcodeType["Code128a"] = 4] = "Code128a";
    StiBarcodeType[StiBarcodeType["Code128Auto"] = 5] = "Code128Auto";
    StiBarcodeType[StiBarcodeType["Code128b"] = 6] = "Code128b";
    StiBarcodeType[StiBarcodeType["Code128c"] = 7] = "Code128c";
    StiBarcodeType[StiBarcodeType["Code39"] = 8] = "Code39";
    StiBarcodeType[StiBarcodeType["Code39Ext"] = 9] = "Code39Ext";
    StiBarcodeType[StiBarcodeType["Code93"] = 10] = "Code93";
    StiBarcodeType[StiBarcodeType["Code93Ext"] = 11] = "Code93Ext";
    StiBarcodeType[StiBarcodeType["DataMatrix"] = 12] = "DataMatrix";
    StiBarcodeType[StiBarcodeType["DutchKIX"] = 13] = "DutchKIX";
    StiBarcodeType[StiBarcodeType["EAN128a"] = 14] = "EAN128a";
    StiBarcodeType[StiBarcodeType["EAN128Auto"] = 15] = "EAN128Auto";
    StiBarcodeType[StiBarcodeType["EAN128b"] = 16] = "EAN128b";
    StiBarcodeType[StiBarcodeType["EAN128c"] = 17] = "EAN128c";
    StiBarcodeType[StiBarcodeType["EAN13"] = 18] = "EAN13";
    StiBarcodeType[StiBarcodeType["EAN8"] = 19] = "EAN8";
    StiBarcodeType[StiBarcodeType["FIM"] = 20] = "FIM";
    StiBarcodeType[StiBarcodeType["GS1_128"] = 21] = "GS1_128";
    StiBarcodeType[StiBarcodeType["IntelligentMail4State"] = 22] = "IntelligentMail4State";
    StiBarcodeType[StiBarcodeType["Interleaved2of5"] = 23] = "Interleaved2of5";
    StiBarcodeType[StiBarcodeType["Isbn10"] = 24] = "Isbn10";
    StiBarcodeType[StiBarcodeType["Isbn13"] = 25] = "Isbn13";
    StiBarcodeType[StiBarcodeType["ITF14"] = 26] = "ITF14";
    StiBarcodeType[StiBarcodeType["Jan13"] = 27] = "Jan13";
    StiBarcodeType[StiBarcodeType["Jan8"] = 28] = "Jan8";
    StiBarcodeType[StiBarcodeType["Maxicode"] = 29] = "Maxicode";
    StiBarcodeType[StiBarcodeType["Msi"] = 30] = "Msi";
    StiBarcodeType[StiBarcodeType["Pdf417"] = 31] = "Pdf417";
    StiBarcodeType[StiBarcodeType["Pharmacode"] = 32] = "Pharmacode";
    StiBarcodeType[StiBarcodeType["Plessey"] = 33] = "Plessey";
    StiBarcodeType[StiBarcodeType["Postnet"] = 34] = "Postnet";
    StiBarcodeType[StiBarcodeType["QRCode"] = 35] = "QRCode";
    StiBarcodeType[StiBarcodeType["RoyalMail4State"] = 36] = "RoyalMail4State";
    StiBarcodeType[StiBarcodeType["SSCC18"] = 37] = "SSCC18";
    StiBarcodeType[StiBarcodeType["Standard2of5"] = 38] = "Standard2of5";
    StiBarcodeType[StiBarcodeType["UpcA"] = 39] = "UpcA";
    StiBarcodeType[StiBarcodeType["UpcE"] = 40] = "UpcE";
    StiBarcodeType[StiBarcodeType["UpcSup2"] = 41] = "UpcSup2";
    StiBarcodeType[StiBarcodeType["UpcSup5"] = 42] = "UpcSup5";
})(StiBarcodeType || (StiBarcodeType = {}));
var StiThousandSeparator;
(function (StiThousandSeparator) {
    StiThousandSeparator[StiThousandSeparator["None"] = 0] = "None";
    StiThousandSeparator[StiThousandSeparator["Comma"] = 1] = "Comma";
    StiThousandSeparator[StiThousandSeparator["Dot"] = 2] = "Dot";
    StiThousandSeparator[StiThousandSeparator["NoneComma"] = 3] = "NoneComma";
    StiThousandSeparator[StiThousandSeparator["Apostrophe"] = 4] = "Apostrophe";
})(StiThousandSeparator || (StiThousandSeparator = {}));
var StiNumberType;
(function (StiNumberType) {
    StiNumberType[StiNumberType["Decimal"] = 0] = "Decimal";
    StiNumberType[StiNumberType["Currency"] = 1] = "Currency";
})(StiNumberType || (StiNumberType = {}));
var StiButtonType;
(function (StiButtonType) {
    StiButtonType[StiButtonType["ClearForm"] = 0] = "ClearForm";
    StiButtonType[StiButtonType["SendForm"] = 1] = "SendForm";
    StiButtonType[StiButtonType["AttachFiles"] = 2] = "AttachFiles";
})(StiButtonType || (StiButtonType = {}));
var StiAngle;
(function (StiAngle) {
    StiAngle[StiAngle["Angle0"] = 0] = "Angle0";
    StiAngle[StiAngle["Angle90"] = 90] = "Angle90";
    StiAngle[StiAngle["Angle180"] = 180] = "Angle180";
    StiAngle[StiAngle["Angle270"] = 270] = "Angle270";
})(StiAngle || (StiAngle = {}));
var StiQRCodeErrorCorrectionLevel;
(function (StiQRCodeErrorCorrectionLevel) {
    StiQRCodeErrorCorrectionLevel[StiQRCodeErrorCorrectionLevel["Level1"] = 0] = "Level1";
    StiQRCodeErrorCorrectionLevel[StiQRCodeErrorCorrectionLevel["Level2"] = 1] = "Level2";
    StiQRCodeErrorCorrectionLevel[StiQRCodeErrorCorrectionLevel["Level3"] = 2] = "Level3";
    StiQRCodeErrorCorrectionLevel[StiQRCodeErrorCorrectionLevel["Level4"] = 3] = "Level4";
})(StiQRCodeErrorCorrectionLevel || (StiQRCodeErrorCorrectionLevel = {}));
var HatchStyle;
(function (HatchStyle) {
    HatchStyle[HatchStyle["Horizontal"] = 0] = "Horizontal";
    HatchStyle[HatchStyle["Vertical"] = 1] = "Vertical";
    HatchStyle[HatchStyle["ForwardDiagonal"] = 2] = "ForwardDiagonal";
    HatchStyle[HatchStyle["BackwardDiagonal"] = 3] = "BackwardDiagonal";
    HatchStyle[HatchStyle["Cross"] = 4] = "Cross";
    HatchStyle[HatchStyle["DiagonalCross"] = 5] = "DiagonalCross";
    HatchStyle[HatchStyle["Percent05"] = 6] = "Percent05";
    HatchStyle[HatchStyle["Percent10"] = 7] = "Percent10";
    HatchStyle[HatchStyle["Percent20"] = 8] = "Percent20";
    HatchStyle[HatchStyle["Percent25"] = 9] = "Percent25";
    HatchStyle[HatchStyle["Percent30"] = 10] = "Percent30";
    HatchStyle[HatchStyle["Percent40"] = 11] = "Percent40";
    HatchStyle[HatchStyle["Percent50"] = 12] = "Percent50";
    HatchStyle[HatchStyle["Percent60"] = 13] = "Percent60";
    HatchStyle[HatchStyle["Percent70"] = 14] = "Percent70";
    HatchStyle[HatchStyle["Percent75"] = 15] = "Percent75";
    HatchStyle[HatchStyle["Percent80"] = 16] = "Percent80";
    HatchStyle[HatchStyle["Percent90"] = 17] = "Percent90";
    HatchStyle[HatchStyle["LightDownwardDiagonal"] = 18] = "LightDownwardDiagonal";
    HatchStyle[HatchStyle["LightUpwardDiagonal"] = 19] = "LightUpwardDiagonal";
    HatchStyle[HatchStyle["DarkDownwardDiagonal"] = 20] = "DarkDownwardDiagonal";
    HatchStyle[HatchStyle["DarkUpwardDiagonal"] = 21] = "DarkUpwardDiagonal";
    HatchStyle[HatchStyle["WideDownwardDiagonal"] = 22] = "WideDownwardDiagonal";
    HatchStyle[HatchStyle["WideUpwardDiagonal"] = 23] = "WideUpwardDiagonal";
    HatchStyle[HatchStyle["LightVertical"] = 24] = "LightVertical";
    HatchStyle[HatchStyle["LightHorizontal"] = 25] = "LightHorizontal";
    HatchStyle[HatchStyle["NarrowVertical"] = 26] = "NarrowVertical";
    HatchStyle[HatchStyle["NarrowHorizontal"] = 27] = "NarrowHorizontal";
    HatchStyle[HatchStyle["DarkVertical"] = 28] = "DarkVertical";
    HatchStyle[HatchStyle["DarkHorizontal"] = 29] = "DarkHorizontal";
    HatchStyle[HatchStyle["DashedDownwardDiagonal"] = 30] = "DashedDownwardDiagonal";
    HatchStyle[HatchStyle["DashedUpwardDiagonal"] = 31] = "DashedUpwardDiagonal";
    HatchStyle[HatchStyle["DashedHorizontal"] = 32] = "DashedHorizontal";
    HatchStyle[HatchStyle["DashedVertical"] = 33] = "DashedVertical";
    HatchStyle[HatchStyle["SmallConfetti"] = 34] = "SmallConfetti";
    HatchStyle[HatchStyle["LargeConfetti"] = 35] = "LargeConfetti";
    HatchStyle[HatchStyle["ZigZag"] = 36] = "ZigZag";
    HatchStyle[HatchStyle["Wave"] = 37] = "Wave";
    HatchStyle[HatchStyle["DiagonalBrick"] = 38] = "DiagonalBrick";
    HatchStyle[HatchStyle["HorizontalBrick"] = 39] = "HorizontalBrick";
    HatchStyle[HatchStyle["Weave"] = 40] = "Weave";
    HatchStyle[HatchStyle["Plaid"] = 41] = "Plaid";
    HatchStyle[HatchStyle["Divot"] = 42] = "Divot";
    HatchStyle[HatchStyle["DottedGrid"] = 43] = "DottedGrid";
    HatchStyle[HatchStyle["DottedDiamond"] = 44] = "DottedDiamond";
    HatchStyle[HatchStyle["Shingle"] = 45] = "Shingle";
    HatchStyle[HatchStyle["Trellis"] = 46] = "Trellis";
    HatchStyle[HatchStyle["Sphere"] = 47] = "Sphere";
    HatchStyle[HatchStyle["SmallGrid"] = 48] = "SmallGrid";
    HatchStyle[HatchStyle["SmallCheckerBoard"] = 49] = "SmallCheckerBoard";
    HatchStyle[HatchStyle["LargeCheckerBoard"] = 50] = "LargeCheckerBoard";
    HatchStyle[HatchStyle["OutlinedDiamond"] = 51] = "OutlinedDiamond";
    HatchStyle[HatchStyle["SolidDiamond"] = 52] = "SolidDiamond";
    HatchStyle[HatchStyle["LargeGrid"] = 4] = "LargeGrid";
    HatchStyle[HatchStyle["Min"] = 0] = "Min";
    HatchStyle[HatchStyle["Max"] = 4] = "Max";
})(HatchStyle || (HatchStyle = {}));
var StiQRCodeSize;
(function (StiQRCodeSize) {
    StiQRCodeSize[StiQRCodeSize["Automatic"] = 0] = "Automatic";
    StiQRCodeSize[StiQRCodeSize["v1"] = 1] = "v1";
    StiQRCodeSize[StiQRCodeSize["v2"] = 2] = "v2";
    StiQRCodeSize[StiQRCodeSize["v3"] = 3] = "v3";
    StiQRCodeSize[StiQRCodeSize["v4"] = 4] = "v4";
    StiQRCodeSize[StiQRCodeSize["v5"] = 5] = "v5";
    StiQRCodeSize[StiQRCodeSize["v6"] = 6] = "v6";
    StiQRCodeSize[StiQRCodeSize["v7"] = 7] = "v7";
    StiQRCodeSize[StiQRCodeSize["v8"] = 8] = "v8";
    StiQRCodeSize[StiQRCodeSize["v9"] = 9] = "v9";
    StiQRCodeSize[StiQRCodeSize["v10"] = 10] = "v10";
    StiQRCodeSize[StiQRCodeSize["v11"] = 11] = "v11";
    StiQRCodeSize[StiQRCodeSize["v12"] = 12] = "v12";
    StiQRCodeSize[StiQRCodeSize["v13"] = 13] = "v13";
    StiQRCodeSize[StiQRCodeSize["v14"] = 14] = "v14";
    StiQRCodeSize[StiQRCodeSize["v15"] = 15] = "v15";
    StiQRCodeSize[StiQRCodeSize["v16"] = 16] = "v16";
    StiQRCodeSize[StiQRCodeSize["v17"] = 17] = "v17";
    StiQRCodeSize[StiQRCodeSize["v18"] = 18] = "v18";
    StiQRCodeSize[StiQRCodeSize["v19"] = 19] = "v19";
    StiQRCodeSize[StiQRCodeSize["v20"] = 20] = "v20";
    StiQRCodeSize[StiQRCodeSize["v21"] = 21] = "v21";
    StiQRCodeSize[StiQRCodeSize["v22"] = 22] = "v22";
    StiQRCodeSize[StiQRCodeSize["v23"] = 23] = "v23";
    StiQRCodeSize[StiQRCodeSize["v24"] = 24] = "v24";
    StiQRCodeSize[StiQRCodeSize["v25"] = 25] = "v25";
    StiQRCodeSize[StiQRCodeSize["v26"] = 26] = "v26";
    StiQRCodeSize[StiQRCodeSize["v27"] = 27] = "v27";
    StiQRCodeSize[StiQRCodeSize["v28"] = 28] = "v28";
    StiQRCodeSize[StiQRCodeSize["v29"] = 29] = "v29";
    StiQRCodeSize[StiQRCodeSize["v30"] = 30] = "v30";
    StiQRCodeSize[StiQRCodeSize["v31"] = 31] = "v31";
    StiQRCodeSize[StiQRCodeSize["v32"] = 32] = "v32";
    StiQRCodeSize[StiQRCodeSize["v33"] = 33] = "v33";
    StiQRCodeSize[StiQRCodeSize["v34"] = 34] = "v34";
    StiQRCodeSize[StiQRCodeSize["v35"] = 35] = "v35";
    StiQRCodeSize[StiQRCodeSize["v36"] = 36] = "v36";
    StiQRCodeSize[StiQRCodeSize["v37"] = 37] = "v37";
    StiQRCodeSize[StiQRCodeSize["v38"] = 38] = "v38";
    StiQRCodeSize[StiQRCodeSize["v39"] = 39] = "v39";
    StiQRCodeSize[StiQRCodeSize["v40"] = 40] = "v40";
})(StiQRCodeSize || (StiQRCodeSize = {}));
var StiQRCodeBodyShapeType;
(function (StiQRCodeBodyShapeType) {
    StiQRCodeBodyShapeType[StiQRCodeBodyShapeType["Square"] = 0] = "Square";
    StiQRCodeBodyShapeType[StiQRCodeBodyShapeType["RoundedSquare"] = 1] = "RoundedSquare";
    StiQRCodeBodyShapeType[StiQRCodeBodyShapeType["Dot"] = 2] = "Dot";
    StiQRCodeBodyShapeType[StiQRCodeBodyShapeType["Circle"] = 3] = "Circle";
    StiQRCodeBodyShapeType[StiQRCodeBodyShapeType["Diamond"] = 4] = "Diamond";
    StiQRCodeBodyShapeType[StiQRCodeBodyShapeType["Star"] = 5] = "Star";
    StiQRCodeBodyShapeType[StiQRCodeBodyShapeType["ZebraHorizontal"] = 6] = "ZebraHorizontal";
    StiQRCodeBodyShapeType[StiQRCodeBodyShapeType["ZebraVertical"] = 7] = "ZebraVertical";
    StiQRCodeBodyShapeType[StiQRCodeBodyShapeType["ZebraCross1"] = 8] = "ZebraCross1";
    StiQRCodeBodyShapeType[StiQRCodeBodyShapeType["ZebraCross2"] = 9] = "ZebraCross2";
    StiQRCodeBodyShapeType[StiQRCodeBodyShapeType["Circular"] = 10] = "Circular";
    StiQRCodeBodyShapeType[StiQRCodeBodyShapeType["DockedDiamonds"] = 11] = "DockedDiamonds";
})(StiQRCodeBodyShapeType || (StiQRCodeBodyShapeType = {}));
var StiQRCodeEyeFrameShapeType;
(function (StiQRCodeEyeFrameShapeType) {
    StiQRCodeEyeFrameShapeType[StiQRCodeEyeFrameShapeType["Square"] = 0] = "Square";
    StiQRCodeEyeFrameShapeType[StiQRCodeEyeFrameShapeType["Dots"] = 1] = "Dots";
    StiQRCodeEyeFrameShapeType[StiQRCodeEyeFrameShapeType["Circle"] = 2] = "Circle";
    StiQRCodeEyeFrameShapeType[StiQRCodeEyeFrameShapeType["Round"] = 3] = "Round";
    StiQRCodeEyeFrameShapeType[StiQRCodeEyeFrameShapeType["Round1"] = 4] = "Round1";
    StiQRCodeEyeFrameShapeType[StiQRCodeEyeFrameShapeType["Round3"] = 5] = "Round3";
})(StiQRCodeEyeFrameShapeType || (StiQRCodeEyeFrameShapeType = {}));
var StiQRCodeEyeBallShapeType;
(function (StiQRCodeEyeBallShapeType) {
    StiQRCodeEyeBallShapeType[StiQRCodeEyeBallShapeType["Square"] = 0] = "Square";
    StiQRCodeEyeBallShapeType[StiQRCodeEyeBallShapeType["Dots"] = 1] = "Dots";
    StiQRCodeEyeBallShapeType[StiQRCodeEyeBallShapeType["Circle"] = 2] = "Circle";
    StiQRCodeEyeBallShapeType[StiQRCodeEyeBallShapeType["Round"] = 3] = "Round";
    StiQRCodeEyeBallShapeType[StiQRCodeEyeBallShapeType["Round1"] = 4] = "Round1";
    StiQRCodeEyeBallShapeType[StiQRCodeEyeBallShapeType["Round3"] = 5] = "Round3";
    StiQRCodeEyeBallShapeType[StiQRCodeEyeBallShapeType["Star"] = 6] = "Star";
    StiQRCodeEyeBallShapeType[StiQRCodeEyeBallShapeType["ZebraHorizontal"] = 7] = "ZebraHorizontal";
    StiQRCodeEyeBallShapeType[StiQRCodeEyeBallShapeType["ZebraVertical"] = 8] = "ZebraVertical";
})(StiQRCodeEyeBallShapeType || (StiQRCodeEyeBallShapeType = {}));
var StiBrushIdent;
(function (StiBrushIdent) {
    StiBrushIdent[StiBrushIdent["Empty"] = 1] = "Empty";
    StiBrushIdent[StiBrushIdent["Solid"] = 2] = "Solid";
    StiBrushIdent[StiBrushIdent["Gradient"] = 3] = "Gradient";
    StiBrushIdent[StiBrushIdent["Glare"] = 4] = "Glare";
    StiBrushIdent[StiBrushIdent["Glass"] = 5] = "Glass";
    StiBrushIdent[StiBrushIdent["Hatch"] = 6] = "Hatch";
    StiBrushIdent[StiBrushIdent["Default"] = 7] = "Default";
    StiBrushIdent[StiBrushIdent["Style"] = 8] = "Style";
})(StiBrushIdent || (StiBrushIdent = {}));
var StiBodyBrush;
(function (StiBodyBrush) {
    StiBodyBrush[StiBodyBrush["Empty"] = 1] = "Empty";
    StiBodyBrush[StiBodyBrush["Solid"] = 2] = "Solid";
    StiBodyBrush[StiBodyBrush["Hatch"] = 3] = "Hatch";
    StiBodyBrush[StiBodyBrush["Gradient"] = 4] = "Gradient";
    StiBodyBrush[StiBodyBrush["Glare"] = 5] = "Glare";
    StiBodyBrush[StiBodyBrush["Glass"] = 6] = "Glass";
})(StiBodyBrush || (StiBodyBrush = {}));
var StiButtonSendType;
(function (StiButtonSendType) {
    StiButtonSendType[StiButtonSendType["FDF"] = 0] = "FDF";
    StiButtonSendType[StiButtonSendType["HTML"] = 1] = "HTML";
    StiButtonSendType[StiButtonSendType["XFDF"] = 2] = "XFDF";
    StiButtonSendType[StiButtonSendType["PDF"] = 3] = "PDF";
})(StiButtonSendType || (StiButtonSendType = {}));
var StiUnitAlignment;
(function (StiUnitAlignment) {
    StiUnitAlignment[StiUnitAlignment["Prefix"] = 1] = "Prefix";
    StiUnitAlignment[StiUnitAlignment["Suffix"] = 2] = "Suffix";
    StiUnitAlignment[StiUnitAlignment["PrefixInside"] = 3] = "PrefixInside";
    StiUnitAlignment[StiUnitAlignment["PrefixInsideSpace"] = 4] = "PrefixInsideSpace";
    StiUnitAlignment[StiUnitAlignment["SuffixInside"] = 5] = "SuffixInside";
    StiUnitAlignment[StiUnitAlignment["SuffixInsideSpace"] = 6] = "SuffixInsideSpace";
})(StiUnitAlignment || (StiUnitAlignment = {}));
var StiSignatureType;
(function (StiSignatureType) {
    StiSignatureType[StiSignatureType["Signature"] = 1] = "Signature";
    StiSignatureType[StiSignatureType["DigitalSignature"] = 2] = "DigitalSignature";
})(StiSignatureType || (StiSignatureType = {}));
var ImageType;
(function (ImageType) {
    ImageType[ImageType["png"] = 0] = "png";
    ImageType[ImageType["jpg"] = 1] = "jpg";
})(ImageType || (ImageType = {}));
var StiPageOrientation;
(function (StiPageOrientation) {
    StiPageOrientation[StiPageOrientation["Portrait"] = 1] = "Portrait";
    StiPageOrientation[StiPageOrientation["Landscape"] = 2] = "Landscape";
})(StiPageOrientation || (StiPageOrientation = {}));
var StiDateBoxAlignment;
(function (StiDateBoxAlignment) {
    StiDateBoxAlignment[StiDateBoxAlignment["Left"] = 1] = "Left";
    StiDateBoxAlignment[StiDateBoxAlignment["Right"] = 2] = "Right";
    StiDateBoxAlignment[StiDateBoxAlignment["Inside"] = 3] = "Inside";
})(StiDateBoxAlignment || (StiDateBoxAlignment = {}));
var StiDateTimeBoxType;
(function (StiDateTimeBoxType) {
    StiDateTimeBoxType[StiDateTimeBoxType["Date"] = 1] = "Date";
    StiDateTimeBoxType[StiDateTimeBoxType["Time"] = 2] = "Time";
    StiDateTimeBoxType[StiDateTimeBoxType["DateTime"] = 3] = "DateTime";
})(StiDateTimeBoxType || (StiDateTimeBoxType = {}));
var StiDateTimeBoxValueChoise;
(function (StiDateTimeBoxValueChoise) {
    StiDateTimeBoxValueChoise[StiDateTimeBoxValueChoise["Current"] = 1] = "Current";
    StiDateTimeBoxValueChoise[StiDateTimeBoxValueChoise["Custom"] = 2] = "Custom";
    StiDateTimeBoxValueChoise[StiDateTimeBoxValueChoise["Null"] = 3] = "Null";
})(StiDateTimeBoxValueChoise || (StiDateTimeBoxValueChoise = {}));
var StiImageSize;
(function (StiImageSize) {
    StiImageSize[StiImageSize["Normal"] = 0] = "Normal";
    StiImageSize[StiImageSize["OneHalf"] = 1] = "OneHalf";
    StiImageSize[StiImageSize["Double"] = 2] = "Double";
})(StiImageSize || (StiImageSize = {}));
var SystemScaleID;
(function (SystemScaleID) {
    SystemScaleID[SystemScaleID["x1"] = 0] = "x1";
    SystemScaleID[SystemScaleID["x2"] = 1] = "x2";
    SystemScaleID[SystemScaleID["x3"] = 2] = "x3";
    SystemScaleID[SystemScaleID["x4"] = 3] = "x4";
})(SystemScaleID || (SystemScaleID = {}));
var SystemScaleIconID;
(function (SystemScaleIconID) {
    SystemScaleIconID[SystemScaleIconID["x100"] = 0] = "x100";
    SystemScaleIconID[SystemScaleIconID["x125"] = 1] = "x125";
    SystemScaleIconID[SystemScaleIconID["x150"] = 2] = "x150";
    SystemScaleIconID[SystemScaleIconID["x175"] = 3] = "x175";
    SystemScaleIconID[SystemScaleIconID["x200"] = 4] = "x200";
    SystemScaleIconID[SystemScaleIconID["x225"] = 5] = "x225";
    SystemScaleIconID[SystemScaleIconID["x250"] = 6] = "x250";
    SystemScaleIconID[SystemScaleIconID["x275"] = 7] = "x275";
    SystemScaleIconID[SystemScaleIconID["x300"] = 8] = "x300";
    SystemScaleIconID[SystemScaleIconID["x325"] = 9] = "x325";
    SystemScaleIconID[SystemScaleIconID["x350"] = 10] = "x350";
    SystemScaleIconID[SystemScaleIconID["x375"] = 11] = "x375";
    SystemScaleIconID[SystemScaleIconID["x400"] = 12] = "x400";
})(SystemScaleIconID || (SystemScaleIconID = {}));
var StiColumnType;
(function (StiColumnType) {
    StiColumnType[StiColumnType["CheckBox"] = 0] = "CheckBox";
    StiColumnType[StiColumnType["ComboBox"] = 1] = "ComboBox";
    StiColumnType[StiColumnType["RadioButton"] = 2] = "RadioButton";
    StiColumnType[StiColumnType["TextBox"] = 3] = "TextBox";
    StiColumnType[StiColumnType["NumberBox"] = 4] = "NumberBox";
})(StiColumnType || (StiColumnType = {}));
var StiVerticalAlignment;
(function (StiVerticalAlignment) {
    StiVerticalAlignment[StiVerticalAlignment["Top"] = 1] = "Top";
    StiVerticalAlignment[StiVerticalAlignment["Center"] = 2] = "Center";
    StiVerticalAlignment[StiVerticalAlignment["Bottom"] = 3] = "Bottom";
})(StiVerticalAlignment || (StiVerticalAlignment = {}));
var StiHorizontalAlignment;
(function (StiHorizontalAlignment) {
    StiHorizontalAlignment[StiHorizontalAlignment["Left"] = 1] = "Left";
    StiHorizontalAlignment[StiHorizontalAlignment["Center"] = 2] = "Center";
    StiHorizontalAlignment[StiHorizontalAlignment["Right"] = 3] = "Right";
})(StiHorizontalAlignment || (StiHorizontalAlignment = {}));
var StiPenStyle;
(function (StiPenStyle) {
    StiPenStyle[StiPenStyle["Solid"] = 0] = "Solid";
    StiPenStyle[StiPenStyle["Dash"] = 1] = "Dash";
    StiPenStyle[StiPenStyle["Dot"] = 2] = "Dot";
})(StiPenStyle || (StiPenStyle = {}));
var StiCategories;
(function (StiCategories) {
    StiCategories[StiCategories["General"] = 0] = "General";
    StiCategories[StiCategories["options"] = 1] = "options";
    StiCategories[StiCategories["Validation"] = 2] = "Validation";
    StiCategories[StiCategories["Visibility"] = 3] = "Visibility";
    StiCategories[StiCategories["Appearance"] = 4] = "Appearance";
})(StiCategories || (StiCategories = {}));
var StiAlgorithmExpression;
(function (StiAlgorithmExpression) {
    StiAlgorithmExpression[StiAlgorithmExpression["NumberCellValue"] = 0] = "NumberCellValue";
    StiAlgorithmExpression[StiAlgorithmExpression["NumberColumnMax"] = 1] = "NumberColumnMax";
    StiAlgorithmExpression[StiAlgorithmExpression["NumberColumnSum"] = 2] = "NumberColumnSum";
    StiAlgorithmExpression[StiAlgorithmExpression["Constant"] = 3] = "Constant";
})(StiAlgorithmExpression || (StiAlgorithmExpression = {}));
var PaperKind;
(function (PaperKind) {
    PaperKind[PaperKind["Custom"] = 0] = "Custom";
    PaperKind[PaperKind["Letter"] = 1] = "Letter";
    PaperKind[PaperKind["LetterSmall"] = 2] = "LetterSmall";
    PaperKind[PaperKind["Tabloid"] = 3] = "Tabloid";
    PaperKind[PaperKind["Ledger"] = 4] = "Ledger";
    PaperKind[PaperKind["Legal"] = 5] = "Legal";
    PaperKind[PaperKind["Statement"] = 6] = "Statement";
    PaperKind[PaperKind["Executive"] = 7] = "Executive";
    PaperKind[PaperKind["A3"] = 8] = "A3";
    PaperKind[PaperKind["A4"] = 9] = "A4";
    PaperKind[PaperKind["A4Small"] = 10] = "A4Small";
    PaperKind[PaperKind["A5"] = 11] = "A5";
    PaperKind[PaperKind["B4"] = 12] = "B4";
    PaperKind[PaperKind["B5"] = 13] = "B5";
    PaperKind[PaperKind["Folio"] = 14] = "Folio";
    PaperKind[PaperKind["Quarto"] = 15] = "Quarto";
    PaperKind[PaperKind["Standard10x14"] = 16] = "Standard10x14";
    PaperKind[PaperKind["Standard11x17"] = 17] = "Standard11x17";
    PaperKind[PaperKind["Note"] = 18] = "Note";
    PaperKind[PaperKind["Number9Envelope"] = 19] = "Number9Envelope";
    PaperKind[PaperKind["Number10Envelope"] = 20] = "Number10Envelope";
    PaperKind[PaperKind["Number11Envelope"] = 21] = "Number11Envelope";
    PaperKind[PaperKind["Number12Envelope"] = 22] = "Number12Envelope";
    PaperKind[PaperKind["Number14Envelope"] = 23] = "Number14Envelope";
    PaperKind[PaperKind["CSheet"] = 24] = "CSheet";
    PaperKind[PaperKind["DSheet"] = 25] = "DSheet";
    PaperKind[PaperKind["ESheet"] = 26] = "ESheet";
    PaperKind[PaperKind["DLEnvelope"] = 27] = "DLEnvelope";
    PaperKind[PaperKind["C5Envelope"] = 28] = "C5Envelope";
    PaperKind[PaperKind["C3Envelope"] = 29] = "C3Envelope";
    PaperKind[PaperKind["C4Envelope"] = 30] = "C4Envelope";
    PaperKind[PaperKind["C6Envelope"] = 31] = "C6Envelope";
    PaperKind[PaperKind["C65Envelope"] = 32] = "C65Envelope";
    PaperKind[PaperKind["B4Envelope"] = 33] = "B4Envelope";
    PaperKind[PaperKind["B5Envelope"] = 34] = "B5Envelope";
    PaperKind[PaperKind["B6Envelope"] = 35] = "B6Envelope";
    PaperKind[PaperKind["ItalyEnvelope"] = 36] = "ItalyEnvelope";
    PaperKind[PaperKind["MonarchEnvelope"] = 37] = "MonarchEnvelope";
    PaperKind[PaperKind["PersonalEnvelope"] = 38] = "PersonalEnvelope";
    PaperKind[PaperKind["USStandardFanfold"] = 39] = "USStandardFanfold";
    PaperKind[PaperKind["GermanStandardFanfold"] = 40] = "GermanStandardFanfold";
    PaperKind[PaperKind["GermanLegalFanfold"] = 41] = "GermanLegalFanfold";
    PaperKind[PaperKind["IsoB4"] = 42] = "IsoB4";
    PaperKind[PaperKind["JapanesePostcard"] = 43] = "JapanesePostcard";
    PaperKind[PaperKind["Standard9x11"] = 44] = "Standard9x11";
    PaperKind[PaperKind["Standard10x11"] = 45] = "Standard10x11";
    PaperKind[PaperKind["Standard15x11"] = 46] = "Standard15x11";
    PaperKind[PaperKind["InviteEnvelope"] = 47] = "InviteEnvelope";
    PaperKind[PaperKind["LetterExtra"] = 50] = "LetterExtra";
    PaperKind[PaperKind["LegalExtra"] = 51] = "LegalExtra";
    PaperKind[PaperKind["TabloidExtra"] = 52] = "TabloidExtra";
    PaperKind[PaperKind["A4Extra"] = 53] = "A4Extra";
    PaperKind[PaperKind["LetterTransverse"] = 54] = "LetterTransverse";
    PaperKind[PaperKind["A4Transverse"] = 55] = "A4Transverse";
    PaperKind[PaperKind["LetterExtraTransverse"] = 56] = "LetterExtraTransverse";
    PaperKind[PaperKind["APlus"] = 57] = "APlus";
    PaperKind[PaperKind["BPlus"] = 58] = "BPlus";
    PaperKind[PaperKind["LetterPlus"] = 59] = "LetterPlus";
    PaperKind[PaperKind["A4Plus"] = 60] = "A4Plus";
    PaperKind[PaperKind["A5Transverse"] = 61] = "A5Transverse";
    PaperKind[PaperKind["B5Transverse"] = 62] = "B5Transverse";
    PaperKind[PaperKind["A3Extra"] = 63] = "A3Extra";
    PaperKind[PaperKind["A5Extra"] = 64] = "A5Extra";
    PaperKind[PaperKind["B5Extra"] = 65] = "B5Extra";
    PaperKind[PaperKind["A2"] = 66] = "A2";
    PaperKind[PaperKind["A3Transverse"] = 67] = "A3Transverse";
    PaperKind[PaperKind["A3ExtraTransverse"] = 68] = "A3ExtraTransverse";
    PaperKind[PaperKind["JapaneseDoublePostcard"] = 69] = "JapaneseDoublePostcard";
    PaperKind[PaperKind["A6"] = 70] = "A6";
    PaperKind[PaperKind["JapaneseEnvelopeKakuNumber2"] = 71] = "JapaneseEnvelopeKakuNumber2";
    PaperKind[PaperKind["JapaneseEnvelopeKakuNumber3"] = 72] = "JapaneseEnvelopeKakuNumber3";
    PaperKind[PaperKind["JapaneseEnvelopeChouNumber3"] = 73] = "JapaneseEnvelopeChouNumber3";
    PaperKind[PaperKind["JapaneseEnvelopeChouNumber4"] = 74] = "JapaneseEnvelopeChouNumber4";
    PaperKind[PaperKind["LetterRotated"] = 75] = "LetterRotated";
    PaperKind[PaperKind["A3Rotated"] = 76] = "A3Rotated";
    PaperKind[PaperKind["A4Rotated"] = 77] = "A4Rotated";
    PaperKind[PaperKind["A5Rotated"] = 78] = "A5Rotated";
    PaperKind[PaperKind["B4JisRotated"] = 79] = "B4JisRotated";
    PaperKind[PaperKind["B5JisRotated"] = 80] = "B5JisRotated";
    PaperKind[PaperKind["JapanesePostcardRotated"] = 81] = "JapanesePostcardRotated";
    PaperKind[PaperKind["JapaneseDoublePostcardRotated"] = 82] = "JapaneseDoublePostcardRotated";
    PaperKind[PaperKind["A6Rotated"] = 83] = "A6Rotated";
    PaperKind[PaperKind["JapaneseEnvelopeKakuNumber2Rotated"] = 84] = "JapaneseEnvelopeKakuNumber2Rotated";
    PaperKind[PaperKind["JapaneseEnvelopeKakuNumber3Rotated"] = 85] = "JapaneseEnvelopeKakuNumber3Rotated";
    PaperKind[PaperKind["JapaneseEnvelopeChouNumber3Rotated"] = 86] = "JapaneseEnvelopeChouNumber3Rotated";
    PaperKind[PaperKind["JapaneseEnvelopeChouNumber4Rotated"] = 87] = "JapaneseEnvelopeChouNumber4Rotated";
    PaperKind[PaperKind["B6Jis"] = 88] = "B6Jis";
    PaperKind[PaperKind["B6JisRotated"] = 89] = "B6JisRotated";
    PaperKind[PaperKind["Standard12x11"] = 90] = "Standard12x11";
    PaperKind[PaperKind["JapaneseEnvelopeYouNumber4"] = 91] = "JapaneseEnvelopeYouNumber4";
    PaperKind[PaperKind["JapaneseEnvelopeYouNumber4Rotated"] = 92] = "JapaneseEnvelopeYouNumber4Rotated";
    PaperKind[PaperKind["Prc16K"] = 93] = "Prc16K";
    PaperKind[PaperKind["Prc32K"] = 94] = "Prc32K";
    PaperKind[PaperKind["Prc32KBig"] = 95] = "Prc32KBig";
    PaperKind[PaperKind["PrcEnvelopeNumber1"] = 96] = "PrcEnvelopeNumber1";
    PaperKind[PaperKind["PrcEnvelopeNumber2"] = 97] = "PrcEnvelopeNumber2";
    PaperKind[PaperKind["PrcEnvelopeNumber3"] = 98] = "PrcEnvelopeNumber3";
    PaperKind[PaperKind["PrcEnvelopeNumber4"] = 99] = "PrcEnvelopeNumber4";
    PaperKind[PaperKind["PrcEnvelopeNumber5"] = 100] = "PrcEnvelopeNumber5";
    PaperKind[PaperKind["PrcEnvelopeNumber6"] = 101] = "PrcEnvelopeNumber6";
    PaperKind[PaperKind["PrcEnvelopeNumber7"] = 102] = "PrcEnvelopeNumber7";
    PaperKind[PaperKind["PrcEnvelopeNumber8"] = 103] = "PrcEnvelopeNumber8";
    PaperKind[PaperKind["PrcEnvelopeNumber9"] = 104] = "PrcEnvelopeNumber9";
    PaperKind[PaperKind["PrcEnvelopeNumber10"] = 105] = "PrcEnvelopeNumber10";
    PaperKind[PaperKind["Prc16KRotated"] = 106] = "Prc16KRotated";
    PaperKind[PaperKind["Prc32KRotated"] = 107] = "Prc32KRotated";
    PaperKind[PaperKind["Prc32KBigRotated"] = 108] = "Prc32KBigRotated";
    PaperKind[PaperKind["PrcEnvelopeNumber1Rotated"] = 109] = "PrcEnvelopeNumber1Rotated";
    PaperKind[PaperKind["PrcEnvelopeNumber2Rotated"] = 110] = "PrcEnvelopeNumber2Rotated";
    PaperKind[PaperKind["PrcEnvelopeNumber3Rotated"] = 111] = "PrcEnvelopeNumber3Rotated";
    PaperKind[PaperKind["PrcEnvelopeNumber4Rotated"] = 112] = "PrcEnvelopeNumber4Rotated";
    PaperKind[PaperKind["PrcEnvelopeNumber5Rotated"] = 113] = "PrcEnvelopeNumber5Rotated";
    PaperKind[PaperKind["PrcEnvelopeNumber6Rotated"] = 114] = "PrcEnvelopeNumber6Rotated";
    PaperKind[PaperKind["PrcEnvelopeNumber7Rotated"] = 115] = "PrcEnvelopeNumber7Rotated";
    PaperKind[PaperKind["PrcEnvelopeNumber8Rotated"] = 116] = "PrcEnvelopeNumber8Rotated";
    PaperKind[PaperKind["PrcEnvelopeNumber9Rotated"] = 117] = "PrcEnvelopeNumber9Rotated";
    PaperKind[PaperKind["PrcEnvelopeNumber10Rotated"] = 118] = "PrcEnvelopeNumber10Rotated";
})(PaperKind || (PaperKind = {}));
var DayOfWeek;
(function (DayOfWeek) {
    DayOfWeek[DayOfWeek["Sunday"] = 0] = "Sunday";
    DayOfWeek[DayOfWeek["Monday"] = 1] = "Monday";
    DayOfWeek[DayOfWeek["Tuesday"] = 2] = "Tuesday";
    DayOfWeek[DayOfWeek["Wednesday"] = 3] = "Wednesday";
    DayOfWeek[DayOfWeek["Thursday"] = 4] = "Thursday";
    DayOfWeek[DayOfWeek["Friday"] = 5] = "Friday";
    DayOfWeek[DayOfWeek["Saturday"] = 6] = "Saturday";
})(DayOfWeek || (DayOfWeek = {}));
var StiFormSaveMode;
(function (StiFormSaveMode) {
    StiFormSaveMode[StiFormSaveMode["Automatic"] = 0] = "Automatic";
    StiFormSaveMode[StiFormSaveMode["Manual"] = 1] = "Manual";
})(StiFormSaveMode || (StiFormSaveMode = {}));

class TimeSpan {
    static { this.ticksPerMillisecond = 1; }
    static { this.millisecondsPerTick = 1 / TimeSpan.ticksPerMillisecond; }
    static { this.ticksPerSecond = TimeSpan.ticksPerMillisecond * 1000; }
    static { this.secondsPerTick = 1 / TimeSpan.ticksPerSecond; }
    static { this.ticksPerMinute = TimeSpan.ticksPerSecond * 60; }
    static { this.minutesPerTick = 1 / TimeSpan.ticksPerMinute; }
    static { this.ticksPerHour = TimeSpan.ticksPerMinute * 60; }
    static { this.hoursPerTick = 1 / TimeSpan.ticksPerHour; }
    static { this.ticksPerDay = TimeSpan.ticksPerHour * 24; }
    static { this.daysPerTick = 1 / TimeSpan.ticksPerDay; }
    static { this.millisPerSecond = 1000; }
    static { this.millisPerMinute = TimeSpan.millisPerSecond * 60; }
    static { this.millisPerHour = TimeSpan.millisPerMinute * 60; }
    static { this.millisPerDay = TimeSpan.millisPerHour * 24; }
    static { this.maxSeconds = Number.MAX_VALUE / TimeSpan.ticksPerSecond; }
    static { this.minSeconds = Number.MIN_VALUE / TimeSpan.ticksPerSecond; }
    static { this.maxMilliSeconds = Number.MAX_VALUE / TimeSpan.ticksPerMillisecond; }
    static { this.minMilliSeconds = Number.MIN_VALUE / TimeSpan.ticksPerMillisecond; }
    static { this.ticksPerTenthSecond = TimeSpan.ticksPerMillisecond * 100; }
    get zero() {
        return new TimeSpan();
    }
    static getNetTypeName() {
        return "System.TimeSpan";
    }
    static { this._minValue = null; }
    static minValue() {
        if (this._minValue == null)
            this._minValue = new TimeSpan(0, 0, Number.MIN_VALUE);
        return this._minValue;
    }
    static { this._maxValue = null; }
    static maxValue() {
        if (this._maxValue == null)
            this._maxValue = new TimeSpan(0, 0, Number.MAX_VALUE);
        return this._maxValue;
    }
    get days() {
        return Math.floor(this.ticks / TimeSpan.ticksPerDay);
    }
    get hours() {
        return Math.floor(this.ticks / TimeSpan.ticksPerHour) % 24;
    }
    get milliseconds() {
        return Math.floor(this.ticks / TimeSpan.ticksPerMillisecond) % 1000;
    }
    get minutes() {
        return Math.floor(this.ticks / TimeSpan.ticksPerMinute) % 60;
    }
    get seconds() {
        return Math.floor(this.ticks / TimeSpan.ticksPerSecond) % 60;
    }
    get totalDays() {
        return this.ticks * TimeSpan.daysPerTick;
    }
    get totalHours() {
        return this.ticks * TimeSpan.hoursPerTick;
    }
    get totalMilliseconds() {
        let temp = this.ticks * TimeSpan.millisecondsPerTick;
        if (temp > TimeSpan.maxMilliSeconds)
            return TimeSpan.maxMilliSeconds;
        if (temp < TimeSpan.minMilliSeconds)
            return TimeSpan.minMilliSeconds;
        return temp;
    }
    get totalMinutes() {
        return this.ticks * TimeSpan.minutesPerTick;
    }
    get totalSeconds() {
        return this.ticks * TimeSpan.secondsPerTick;
    }
    static fromString(value, format = null) {
        if (value == null)
            return null;
        let isDefaultFormat = false;
        if (format == null || format.length == 0) {
            format = "hh:mm:ss";
            isDefaultFormat = true;
        }
        let days = 0;
        let hours = 0;
        let minutes = 0;
        let seconds = 0;
        let milliseconds = 0;
        let char;
        let pos = 0;
        let values = [];
        let stringValues = [];
        let minus = false;
        // Parse time into separate numeric values
        while (pos < value.length) {
            char = value.charAt(pos);
            if (Char.isDigit(char)) {
                stringValues.push(char);
                pos++;
                while (pos < value.length && Char.isDigit(char = value.charAt(pos))) {
                    stringValues[stringValues.length - 1] += value.charAt(pos);
                    pos++;
                }
                values.push(+(stringValues[stringValues.length - 1]));
            }
            else if (char == "-")
                minus = true;
            if (isDefaultFormat && char === ".") {
                if (values.length === 1)
                    format = "d.hh:mm:ss";
                else
                    format += ".f";
            }
            pos++;
        }
        pos = 0;
        let index = -1;
        // Parsing format and replacement of appropriate values of time
        while (pos < format.length && index + 1 < values.length) {
            char = format.charAt(pos);
            if (char === "d" || char === "h" || char === "H" || char === "m" || char === "s" || char === "f" || char === "F") {
                index++;
                while (pos < format.length && format.charAt(pos) === char)
                    pos++;
            }
            switch (char) {
                case "d": // days
                    days = values[index];
                    break;
                case "h":
                case "H": // hours
                    hours = values[index];
                    break;
                case "m": // minutes
                    minutes = values[index];
                    break;
                case "s": // seconds
                    seconds = values[index];
                    break;
                case "f":
                case "F": // seconds fraction
                    milliseconds = values[index];
                    break;
                default:
                    pos++;
                    break;
            }
        }
        let timeSpan = TimeSpan.create(days, hours, minutes, seconds, milliseconds);
        timeSpan._minus = minus;
        return timeSpan;
    }
    static interval(value, scale) {
        let tmp = value * scale;
        let millis = tmp + (value >= 0 ? 0.5 : -0.5);
        return new TimeSpan(millis * TimeSpan.ticksPerMillisecond);
    }
    /* static fromTicks(value: number): TimeSpan {
       return new TimeSpan(value);
     }
  
     static fromSeconds(value: number): TimeSpan {
       return this.interval(value, this.millisPerSecond);
     }
  
     static fromMilliseconds(value: number): TimeSpan {
       return this.interval(value, 1);
     }
  
     add(value: number): TimeSpan {
       return new TimeSpan(this.ticks + value);
     }
  
     add2(value: TimeSpan): TimeSpan {
       return new TimeSpan(this.ticks + value.ticks);
     }*/
    toString(format) {
        if (format == null || format.length == 0) {
            format = "hh:mm:ss";
            if (this.days != 0) {
                format = "d.hh:mm:ss";
            }
        }
        /*switch (format) {
          case "t":
            format = CultureInfo.currentCulture.dateTimeFormat.shortTimePattern;
            break;
          case "T":
            format = CultureInfo.currentCulture.dateTimeFormat.longTimePattern;
            break;
        }
    
        format = format.replace(/H/gm, "h");
    */
        let result = "";
        let pos = 0;
        let isDays = false;
        /*  while (pos < format.length) {
            let f = format.charAt(pos);
    
            if (!Char.isLetter(f)) {
              result += f;
              pos++;
              continue;
            }
    
            while (pos + 1 < format.length && Char.isLetter(format.charAt(pos + 1))) {
              pos++;
              f += format.charAt(pos);
            }
    
            switch (f[0]) {
              case "d":
                isDays = true;
                result += Math.abs(this.days).toString().ss.padLeft(f.length, "0");
                break;
              case "h":
                result += Math.abs(isDays ? this.hours : StiMath.trunc(StiMath.round2(this.totalHours, 2))).toString().ss.padLeft(f.length, "0");
                break;
              case "m":
                result += Math.abs(this.minutes).toString().ss.padLeft(f.length, "0");
                break;
              case "s":
                result += Math.abs(this.seconds).toString().ss.padLeft(f.length, "0");
                break;
              case "f":
                result += Math.abs(this.milliseconds).toString().ss.padLeft(f.length, "0");
                break
              case "F":
                if (this.milliseconds != 0)
                  result += Math.abs(this.milliseconds).toString().ss.padLeft(f.length, "0");
                break;
            }
            pos++;
          }
    
          if (this._minus) return "-" + result;*/
        return result;
    }
    negate() {
        if (this.ticks == TimeSpan.minValue().ticks)
            throw new Error("Overflow_NegateTwosCompNum");
        return new TimeSpan(-this.ticks);
    }
    static timeToTicks(day, hour, minute, second, milliseconds) {
        let totalSeconds = day * 86400 + hour * 3600 + minute * 60 + second;
        return totalSeconds * TimeSpan.ticksPerSecond;
    }
    static create(days = 0, hours = 0, minutes = 0, seconds = 0, milliseconds = 0) {
        return null; // new TimeSpan(TimeSpan.timeToTicks(days, hours, minutes, seconds, milliseconds));
    }
    constructor(param1 = 0, minutes = null, seconds = null, milliseconds = null) {
        this._minus = false;
        if (minutes == null) {
            this.ticks = param1;
        }
        else {
            let hours1 = param1;
            if (milliseconds == null)
                milliseconds = 0;
            this.ticks = TimeSpan.timeToTicks(0, hours1, minutes, seconds, milliseconds);
        }
    }
}

class DateTime {
    // Number of 100ns ticks per time unit
    static { this.ticksPerMillisecond = 1000; }
    static { this.ticksPerSecond = DateTime.ticksPerMillisecond * 1000; }
    static { this.ticksPerMinute = DateTime.ticksPerSecond * 60; }
    static { this.ticksPerHour = DateTime.ticksPerMinute * 60; }
    static { this.ticksPerDay = DateTime.ticksPerHour * 24; }
    // Number of milliseconds per time unit
    static { this.millisPerSecond = 1000; }
    static { this.millisPerMinute = DateTime.millisPerSecond * 60; }
    static { this.millisPerHour = DateTime.millisPerMinute * 60; }
    static { this.millisPerDay = DateTime.millisPerHour * 24; }
    // Number of days in a non-leap year
    static { this.daysPerYear = 365; }
    // Number of days in 4 years
    static { this.daysPer4Years = DateTime.daysPerYear * 4 + 1; }
    // Number of days in 100 years
    static { this.daysPer100Years = DateTime.daysPer4Years * 25 - 1; }
    // Number of days in 400 years
    static { this.daysPer400Years = DateTime.daysPer100Years * 4 + 1; }
    // Number of days from 1/1/0001 to 12/31/1600
    static { this.daysTo1601 = DateTime.daysPer400Years * 4; }
    // Number of days from 1/1/0001 to 12/30/1899
    static { this.daysTo1899 = DateTime.daysPer400Years * 4 + DateTime.daysPer100Years * 3 - 367; }
    // Number of days from 1/1/0001 to 12/31/9999
    static { this.daysTo10000 = DateTime.daysPer400Years * 25 - 366; }
    static { this.minTicks = 0; }
    static { this.maxTicks = DateTime.daysTo10000 * DateTime.ticksPerDay - 1; }
    static { this.maxMillis = DateTime.daysTo10000 * DateTime.millisPerDay; }
    static { this.fileTimeOffset = DateTime.daysTo1601 * DateTime.ticksPerDay; }
    static { this.doubleDateOffset = DateTime.daysTo1899 * DateTime.ticksPerDay; }
    // The minimum OA date is 0100/01/01 (Note it's year 100).
    // The maximum OA date is 9999/12/31
    static { this.oADateMinAsTicks = (DateTime.daysPer100Years - DateTime.daysPerYear) * DateTime.ticksPerDay; }
    // All OA dates must be greater than (not >=) OADateMinAsDouble
    static { this.oADateMinAsDouble = -657435; }
    // All OA dates must be less than (not <=) OADateMaxAsDouble
    static { this.oADateMaxAsDouble = 2958466; }
    static { this.datePartYear = 0; }
    static { this.datePartDayOfYear = 1; }
    static { this.datePartMonth = 2; }
    static { this.DatePartDay = 3; }
    static { this.daysToMonth365 = [
        0, 31, 59, 90, 120, 151, 181, 212, 243, 273, 304, 334, 365
    ]; }
    static { this.daysToMonth366 = [
        0, 31, 60, 91, 121, 152, 182, 213, 244, 274, 305, 335, 366
    ]; }
    static { this.minValue = new DateTime(DateTime.minTicks); }
    static { this.maxValue = new DateTime(DateTime.maxTicks); }
    static getNetTypeName() {
        return "System.DateTime";
    }
    get year() {
        return this.innerDate.getFullYear();
    }
    get month() {
        return this.innerDate.getMonth() + 1;
    }
    /*get monthName(): string {
      return CultureInfo.currentCulture.dateTimeFormat.monthNames[this.month - 1];
    }
  
    get monthGenitiveName(): string {
      return CultureInfo.currentCulture.dateTimeFormat.monthGenitiveNames[this.month - 1];
    }
  
    get monthShortName(): string {
      return CultureInfo.currentCulture.dateTimeFormat.abbreviatedMonthNames[this.month - 1];
    }*/
    get day() {
        return this.innerDate.getDate();
    }
    /** 0 – Sunday, 1 – Monday etc */
    get dayOfWeek() {
        return this.innerDate.getDay();
    }
    /*get dayName(): string {
      return CultureInfo.currentCulture.dateTimeFormat.dayNames[this.dayOfWeek];
    }
  
    get dayShortName(): string {
      return CultureInfo.currentCulture.dateTimeFormat.shortestDayNames[this.dayOfWeek];
    }*/
    get hour() {
        return this.innerDate.getHours();
    }
    get minute() {
        return this.innerDate.getMinutes();
    }
    get second() {
        return this.innerDate.getSeconds();
    }
    get millisecond() {
        return this.innerDate.getMilliseconds();
    }
    get ticks() {
        return this.innerDate.getTime();
    }
    get dayOfYear() {
        let oneJan = new Date(this.innerDate.getFullYear(), 0, 1);
        let diff = this.innerDate.getTime() - oneJan.getTime();
        return Math.ceil(diff / 86400000) + 1;
    }
    /*firstDayOfWeek(): DateTime {
      let dayjsDate = Stimulsoft.ExternalLibrary.dayjs(this.innerDate);
      dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
      return new DateTime(dayjsDate.startOf("week").toDate());
    }
  
    lastDayOfWeek(): DateTime {
      let dayjsDate = Stimulsoft.ExternalLibrary.dayjs(this.innerDate);
      dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
      return new DateTime(dayjsDate.endOf("week").toDate());
    }
  
    firstDayOfMonth(): DateTime {
      let dayjsDate = Stimulsoft.ExternalLibrary.dayjs(this.innerDate);
      dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
      return new DateTime(dayjsDate.startOf("month").toDate());
    }
  
    lastDayOfMonth(): DateTime {
      let dayjsDate = Stimulsoft.ExternalLibrary.dayjs(this.innerDate);
      dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
      return new DateTime(dayjsDate.endOf("month").toDate());
    }
  
    firstDayOfQuarter(): DateTime {
      let dayjsDate = Stimulsoft.ExternalLibrary.dayjs(this.innerDate);
      dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
      return new DateTime(dayjsDate.startOf("quarter").toDate());
    }
  
    lastDayOfQuarter(): DateTime {
      let dayjsDate = Stimulsoft.ExternalLibrary.dayjs(this.innerDate);
      dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
      return new DateTime(dayjsDate.endOf("quarter").toDate());
    }
  
    firstDayOfFirthQuarter(): DateTime {
      let dayjsDate = Stimulsoft.ExternalLibrary.dayjs().month(0);
      dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
      return new DateTime(dayjsDate.startOf("quarter").toDate());
    }
  
    lastDayOfFirthQuarter(): DateTime {
      let dayjsDate = Stimulsoft.ExternalLibrary.dayjs().month(0);
      dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
      return new DateTime(dayjsDate.endOf("quarter").toDate());
    }
  
    firstDayOfSecondQuarter(): DateTime {
      let dayjsDate = Stimulsoft.ExternalLibrary.dayjs().month(3);
      dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
      return new DateTime(dayjsDate.startOf("quarter").toDate());
    }
  
    lastDayOfSecondQuarter(): DateTime {
      let dayjsDate = Stimulsoft.ExternalLibrary.dayjs().month(3);
      dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
      return new DateTime(dayjsDate.endOf("quarter").toDate());
    }
  
    firstDayOfThirdQuarter(): DateTime {
      let dayjsDate = Stimulsoft.ExternalLibrary.dayjs().month(6);
      dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
      return new DateTime(dayjsDate.startOf("quarter").toDate());
    }
  
    lastDayOfThirdQuarter(): DateTime {
      let dayjsDate = Stimulsoft.ExternalLibrary.dayjs().month(6);
      dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
      return new DateTime(dayjsDate.endOf("quarter").toDate());
    }
  
    firstDayOfFourthQuarter(): DateTime {
      let dayjsDate = Stimulsoft.ExternalLibrary.dayjs().month(9);
      dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
      return new DateTime(dayjsDate.startOf("quarter").toDate());
    }
  
    lastDayOfFourthQuarter(): DateTime {
      let dayjsDate = Stimulsoft.ExternalLibrary.dayjs().month(9);
      dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
      return new DateTime(dayjsDate.endOf("quarter").toDate());
    }
  
    firstDayOfYear(): DateTime {
      let dayjsDate = Stimulsoft.ExternalLibrary.dayjs(this.innerDate);
      dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
      return new DateTime(dayjsDate.startOf("year").toDate());
    }
  
    lastDayOfYear(): DateTime {
      let dayjsDate = Stimulsoft.ExternalLibrary.dayjs(this.innerDate);
      dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
      return new DateTime(dayjsDate.endOf("year").toDate());
    }
  
    toShortDateString(): string {
      return this.toString(CultureInfo.currentCulture.dateTimeFormat.shortDatePattern);
    }
  
    toShortTimeString(): string {
      return this.toString(CultureInfo.currentCulture.dateTimeFormat.shortTimePattern);
    }*/
    static now() {
        return new DateTime(new Date());
    }
    static today() {
        let today = new DateTime(new Date());
        return new DateTime(today.year, today.month, today.day, 0, 0, 0, 0);
    }
    static isLeapYear(year) {
        return ((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0);
    }
    /** The month number ranging from 1 to 12. JS calculate month from 0. This will even work for December. */
    static daysInMonth(year, month) {
        return 33 - new Date(year, month - 1, 33).getDate();
    }
    static compare(t1, t2) {
        if (t1.ticks < t2.ticks)
            return -1;
        if (t1.ticks > t2.ticks)
            return 1;
        return 0;
    }
    static doubleDateToTicks(value) {
        if (value >= this.oADateMaxAsDouble || value <= this.oADateMinAsDouble)
            return null;
        let millis = (value * this.millisPerDay + (value >= 0 ? 0.5 : -0.5));
        // The interesting thing here is when you have a value like 12.5 it all positive 12 days and 12 hours from 01/01/1899
        // However if you a value of -12.25 it is minus 12 days but still positive 6 hours, almost as though you meant -11.75 all negative
        // This line below fixes up the millis in the negative case
        if (millis < 0) {
            millis -= (millis % this.millisPerDay) * 2;
        }
        millis += this.doubleDateOffset / this.ticksPerMillisecond;
        if (millis < 0 || millis >= this.maxMillis)
            return null;
        return millis * this.ticksPerMillisecond;
    }
    // private static ticksToOADate(value: number): number {
    //     //The time value for the date 1899-12-30 is -2209197600000 milliseconds
    //     let millis: number = (value + 2209197600000) / this.ticksPerMillisecond;
    //     if (millis < 0) {
    //         let frac: number = millis % this.millisPerDay;
    //         if (frac != 0) millis -= (this.millisPerDay + frac) * 2;
    //     }
    //     return millis / this.millisPerDay * 1000;
    // }
    toString(format = "G") {
        /*let dayjsDate = Stimulsoft.ExternalLibrary.dayjs(this.innerDate);
        if (!dayjsDate.isValid()) return "";
        dayjsDate = dayjsDate.locale(`sti_${CultureInfo.currentCulture.name}`);
    
    
        LT: culture.dateTimeFormat.shortTimePattern,
        LTS: culture.dateTimeFormat.longTimePattern,
        L: culture.dateTimeFormat.shortDatePattern,
        LLL: culture.dateTimeFormat.longDatePattern,
        LLLL: culture.dateTimeFormat.fullDateTimePattern
    
        t	ShortTimePattern	h:mm tt       LT: "h:mm A",
        T	LongTimePattern	    h:mm:ss tt    LTS: "h:mm:ss A",
    
        d	ShortDatePattern	M/d/yyyy                L: "M/D/YYYY",
        D	LongDatePattern	    dddd, MMMM dd, yyyy     LLL: "MMMM Do YYYY",
    
        f	(combination of D and t)	dddd, MMMM dd, yyyy h:mm tt
        F	FullDateTimePattern	        dddd, MMMM dd, yyyy h:mm:ss tt LLLL: "dddd, MMMM Do YYYY LT",
    
        g	(combination of d and t)	M/d/yyyy h:mm tt
        G	(combination of d and T)	M/d/yyyy h:mm:ss tt
        */
        /*switch (format) {
          case "t":
            format = CultureInfo.currentCulture.dateTimeFormat.shortTimePattern;
            break;
          case "T":
            format = CultureInfo.currentCulture.dateTimeFormat.longTimePattern;
            break;
          case "d":
            format = CultureInfo.currentCulture.dateTimeFormat.shortDatePattern;
            break;
          case "D":
            format = CultureInfo.currentCulture.dateTimeFormat.longDatePattern;
            break;
          case "f":
            format = CultureInfo.currentCulture.dateTimeFormat.longDatePattern + " " + CultureInfo.currentCulture.dateTimeFormat.shortTimePattern;
            break;
          case "F":
            format = CultureInfo.currentCulture.dateTimeFormat.fullDateTimePattern;
            break;
          case "g":
            format = CultureInfo.currentCulture.dateTimeFormat.shortDatePattern + " " + CultureInfo.currentCulture.dateTimeFormat.shortTimePattern;
            break;
          case "G":
            format = CultureInfo.currentCulture.dateTimeFormat.shortDatePattern + " " + CultureInfo.currentCulture.dateTimeFormat.longTimePattern;
            break;
          case "y":
          case "Y":
            format = CultureInfo.currentCulture.dateTimeFormat.yearMonthPattern;
            break;
          case "s":
            format = "yyyy-MM-dd\\THH:mm:ss";
            break;// ISO
          case "u":
            format = "yyyy-MM-dd HH:mm:ss\\Z";
            break;// ISO
          case "m":
          case "M":   // MonthDayPattern;
            format = CultureInfo.currentCulture.name.ss.contains("en") || CultureInfo.currentCulture.name.ss.contains("us") ? "MMMM d" : "d MMMM";
            break;
          case "r":
          case "R":   // The RFC1123 Format Specifier
            format = "ddd, dd MMM yyyy HH\\:mm\\:ss \\G\\M\\T";
            break;
        }*/
        format = format.replace(/d/gm, "D").replace(/DDDD/gm, "dddd").replace(/DDD/gm, "ddd");
        format = format.replace(/y/gm, "Y");
        format = format.replace(/f/gm, "S").replace(/F/gm, "S");
        format = format.replace(/tt/gm, "A").replace(/t/gm, "A");
        format = format.replace(/zzz/gm, "Z").replace(/zz/gm, "Z").replace(/z/gm, "Z");
        return format + this.DateTimeOffset;
    }
    static ticksNetToTicksJs(ticks) {
        // ticks are in nanotime; convert to microtime
        let ticksToMicrotime = ticks / 10000;
        // ticks are recorded from 1/1/1; get microtime difference from 1/1/1/ to 1/1/1970
        let epochMicrotimeDiff = 62135607600000; // Math.abs(new Date(0, 0, 1).setFullYear(1))
        return ticksToMicrotime - epochMicrotimeDiff;
    }
    negate() {
        if (this.ticks == TimeSpan.minValue().ticks)
            throw new Error("Overflow_NegateTwosCompNum");
        return new DateTime(-this.ticks);
    }
    addYears(value) {
        return new DateTime(this.year + value, this.month, this.day, this.hour, this.minute, this.second, this.millisecond);
    }
    addMonths(value) {
        let newMonth = this.month + value;
        let newYear = this.year;
        if (newMonth < 1) {
            newYear--;
            newMonth = 12 + newMonth;
        }
        return new DateTime(newYear, newMonth, this.day, this.hour, this.minute, this.second, this.millisecond);
    }
    /*addDays(value: number): DateTime {
      let newDate: DateTime = new DateTime(this.innerDate.getTime());
      let newDay = newDate.day + value;
      if (newDay < 1) {
        newDate = newDate.addMonths(-1);
        newDay = newDate.lastDayOfMonth().day + newDay;
      }
      return new DateTime(newDate.year, newDate.month, newDay, newDate.hour, newDate.minute, newDate.second, newDate.millisecond);
    }*/
    addHours(value) {
        return new DateTime(this.year, this.month, this.day, this.hour + value, this.minute, this.second, this.millisecond);
    }
    addMinutes(value) {
        return new DateTime(this.year, this.month, this.day, this.hour, this.minute + value, this.second, this.millisecond);
    }
    addSeconds(value) {
        return new DateTime(this.year, this.month, this.day, this.hour, this.minute, this.second + value, this.millisecond);
    }
    addMilliseconds(value) {
        return new DateTime(this.year, this.month, this.day, this.hour, this.minute, this.second, this.millisecond + value);
    }
    addTicks(value) {
        return new DateTime(this.ticks + value);
    }
    compareTo(value) {
        if (this.ticks < value.ticks)
            return -1;
        if (this.ticks > value.ticks)
            return 1;
        return 0;
    }
    subtract(value) {
        return new TimeSpan(this.ticks - value.ticks);
    }
    get date() {
        return this.innerDate;
    }
    static oaDateToTicks0(oaDate) {
        let ticks = ((oaDate - 25569) * 86400000);
        if (oaDate < 0) {
            const frac = (oaDate - Math.trunc(oaDate)) * 86400000;
            if (frac !== 0) {
                ticks -= frac * 2;
            }
        }
        return ticks;
    }
    static ticksToOADate0(ticks) {
        let oad = (ticks / 86400000) + 25569;
        if (oad < 0) {
            const frac = oad - Math.trunc(oad);
            if (frac !== 0) {
                oad = Math.ceil(oad) - frac - 2;
            }
        }
        return oad;
    }
    toOADate() {
        //return (this.ticks / 86400000) + 25569;
        return DateTime.ticksToOADate0(this.ticks);
    }
    toOADate2(round) {
        let ticks = DateTime.ticksToOADate0(this.ticks);
        //let ticks = DateTime.ticksToOADate(this.ticks);
        if (round)
            return Math.round(ticks);
        return ticks;
    }
    toNetJsonString() {
        return "\\/Date(" + this.ticks.toString() + ")\\/";
    }
    static fromNetJsonString(jsonDate) {
        let m = /-?\d+/.exec(jsonDate);
        let date = new Date(parseInt(m[0]));
        return new DateTime(date);
    }
    static fromOADate(oadate) {
        return new DateTime(DateTime.oaDateToTicks0(oadate));
        //return new DateTime(((oadate - 25569) * 86400000));
        // return new DateTime(this.doubleDateToTicks(d));
    }
    static fromString(d = "2015-12-31", logError = true) {
        try {
            d = d.trim();
            let date = d.split(".").join("-").split("\\").join("-").split(" ").join("-");
            return new DateTime(new Date());
            let dayjsDate;
            /*if (date.indexOf("/") >= 0) {
              // Date
              dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "M/D/YYYY", true);
              if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
              dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "M/D/YY", true);
              if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
              // DateTime
              dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "M/D/YYYY-H:m", true);
              if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
              dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "M/D/YYYY-H:m:s", true);
              if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
              dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "M/D/YYYY-h:m:s-a", true);
              if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
              dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "M/D/YY-H:m", true);
              if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
              dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "M/D/YY-H:m:s", true);
              if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
              dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "M/D/YY-h:m:s-a", true);
              if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
              date = d.split("/").join("-");
            }
      
            // Date
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "YYYY-M-D", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "D-M-YYYY", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "D-M-YY", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            // DateTime
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "YYYY-M-D-H:m", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "YYYY-M-D-H:m:s", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "YYYY-M-D-H:m:s-SSS", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "YYYY-M-D-H:m:s-SSSSSSS", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "YYYY-M-D-h:m:s-a", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "D-M-YYYY-H:m", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "D-M-YYYY-H:m:s", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "D-M-YYYY-h:m:s-a", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "D-M-YY-H:m", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "D-M-YY-H:m:s", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "D-M-YY-h:m:s-a", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            // Time
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "H:m", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "H:m:s", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "h:m:s-a", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            // ISO
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "YYYY-MM-DD", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "YYYY-MM-DDTHH:m:sZ", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "YYYY-MM-DDTHH:m:s-SSSZ", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "YYYY-MM-DDTHH:m:s-SSSSSSSZ", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "YYYY-MM-DDTHH:m:s", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "YYYY-MM-DDTHH:m:s-SSS", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(date, "YYYY-MM-DDTHH:m:s-SSSSSSS", true);
            if (dayjsDate.isValid()) return new DateTime(dayjsDate.toDate());
      
            if (logError) StiError.showError("Parse DateTime Error (" + d + ")", false);*/
            return null;
        }
        catch (e) {
            return null;
        }
    }
    /*
        static fromString2(format = "2015-12-31", value: string, logError = true): DateTime {
          try {
            let dayjsDate = Stimulsoft.ExternalLibrary.dayjs(value, [format], true);
            if (dayjsDate.isValid() == false) {
              if (logError) StiError.showError("Parse DateTime Error (" + value + ")", false);
              return null;
            }
  
            return new DateTime(dayjsDate.toDate());
          }
          catch (e) {
          }
          return null;
        }
  
        static isISO8601String(d: string): boolean {
          try {
            d = d.trim();
  
            let dayjsDate;
  
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(d, "YYYY-MM-DD", true);
            if (dayjsDate.isValid()) return true;
  
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(d, "YYYY-MM-DDTHH:mm", true);
            if (dayjsDate.isValid()) return true;
  
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(d, "YYYY-MM-DDTHH:mmZ", true);
            if (dayjsDate.isValid()) return true;
  
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(d, "YYYY-MM-DDTHH:mm:ss", true);
            if (dayjsDate.isValid()) return true;
  
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(d, "YYYY-MM-DDTHH:mm:ss.SSS", true);
            if (dayjsDate.isValid()) return true;
  
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(d, "YYYY-MM-DDTHH:mm:ss.SSSSSS", true);
            if (dayjsDate.isValid()) return true;
  
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(d, "YYYY-MM-DDTHH:mm:ssZ", true);
            if (dayjsDate.isValid()) return true;
  
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(d, "YYYY-MM-DDTHH:mm:ss.SSSZ", true);
            if (dayjsDate.isValid()) return true;
  
            dayjsDate = Stimulsoft.ExternalLibrary.dayjs(d, "YYYY-MM-DDTHH:mm:ss.SSSSSSZ", true);
            if (dayjsDate.isValid()) return true;
          }
          catch (e) {
          }
  
          return false;
        }*/
    get timeOfDay() {
        return new TimeSpan(this.ticks - new DateTime(this.year, this.month, this.day, 0, 0, 0, 0).ticks);
    }
    get date2() {
        return new DateTime(this.year, this.month, this.day, 0, 0, 0, 0);
    }
    constructor(param1, month, day, hour, minute, second, millisecond) {
        this.DateTimeOffset = "";
        if (typeof param1 == "undefined") {
            this.innerDate = new Date();
        }
        else if (typeof param1 != "number" && param1 instanceof Date) {
            this.innerDate = param1; // set date
        }
        else {
            if (!month) {
                this.innerDate = new Date();
                this.innerDate.setTime(param1); // set ticks
            }
            else {
                this.innerDate = new Date();
                this.innerDate.setFullYear(param1);
                this.innerDate.setMonth(month - 1);
                this.innerDate.setDate(day || 1);
                this.innerDate.setHours(hour || 0);
                this.innerDate.setMinutes(minute || 0);
                this.innerDate.setSeconds(second || 0);
                this.innerDate.setMilliseconds(millisecond || 0);
            }
        }
    }
}

/*
{*******************************************************************}
{                                                                   }

{                                                                   }
{                                                                   }
{   Copyright (C)  Stimulsoft                                       }
{   ALL RIGHTS RESERVED                                             }
{                                                                   }
{   The entire contents of this file is protected by U.S. and       }
{   International Copyright Laws. Unauthorized reproduction,        }
{   reverse-engineering, and distribution of all or any portion of  }
{   the code contained in this file is strictly prohibited and may  }
{   result in severe civil and criminal penalties and will be       }
{   prosecuted to the maximum extent possible under the law.        }
{                                                                   }
{   RESTRICTIONS                                                    }
{                                                                   }
{   THIS SOURCE CODE AND ALL RESULTING INTERMEDIATE FILES           }
{   ARE CONFIDENTIAL AND PROPRIETARY                                }
{   TRADE SECRETS OF Stimulsoft                                     }
{                                                                   }
{   CONSULT THE END USER LICENSE AGREEMENT FOR INFORMATION ON       }
{   ADDITIONAL RESTRICTIONS.                                        }
{                                                                   }
{*******************************************************************}
*/
class StiObject {
    static keys(obj) {
        // if (Object.keys) return Object.keys(obj);
        let keys = [];
        // eslint-disable-next-line @typescript-eslint/no-for-in-array
        for (let i in obj) {
            if (Object.prototype.hasOwnProperty.call(obj, i)) {
                keys.push(i);
            }
        }
        // eslint-disable-next-line @typescript-eslint/no-for-in-array
        for (let i in obj.__proto__) {
            if (Object.prototype.hasOwnProperty.call(obj, i)) {
                keys.push(i);
            }
        }
        return keys;
    }
    static disableAllEnumerable(prototype, obj) {
        // eslint-disable-next-line @typescript-eslint/no-for-in-array
        for (let name in obj) {
            Object.defineProperty(prototype, name, { enumerable: false });
        }
    }
}
class StiString extends StiObject {
    static isNullOrEmpty(value) {
        return value == null || value === "" || value === undefined;
    }
}

/*
{*******************************************************************}
{                                                                   }

{                                                                   }
{                                                                   }
{   Copyright (C)  Stimulsoft                                       }
{   ALL RIGHTS RESERVED                                             }
{                                                                   }
{   The entire contents of this file is protected by U.S. and       }
{   International Copyright Laws. Unauthorized reproduction,        }
{   reverse-engineering, and distribution of all or any portion of  }
{   the code contained in this file is strictly prohibited and may  }
{   result in severe civil and criminal penalties and will be       }
{   prosecuted to the maximum extent possible under the law.        }
{                                                                   }
{   RESTRICTIONS                                                    }
{                                                                   }
{   THIS SOURCE CODE AND ALL RESULTING INTERMEDIATE FILES           }
{   ARE CONFIDENTIAL AND PROPRIETARY                                }
{   TRADE SECRETS OF Stimulsoft                                     }
{                                                                   }
{   CONSULT THE END USER LICENSE AGREEMENT FOR INFORMATION ON       }
{   ADDITIONAL RESTRICTIONS.                                        }
{                                                                   }
{*******************************************************************}
*/
class Hashtable {
    constructor(options = { ignoreCase: false }) {
        this.ignoreCase = false;
        this.isSimpleKeys = false;
        this.keys = new List();
        this.values = new List();
        this.indexObject = {};
        this.ignoreCase = options.ignoreCase;
        if (this.ignoreCase)
            this.isSimpleKeys = true;
    }
    get(key) {
        if (this.isSimpleKeys) {
            if (this.ignoreCase)
                key = key.toLowerCase();
            return this.values[this.indexObject[key]];
        }
        return this.values[this.keys.indexOf(key)];
    }
    set(key, value) {
        if (this.isSimpleKeys) {
            let type = typeof key;
            if (type != "string" && type != "number") {
                this.isSimpleKeys = false;
                this.indexObject = {};
            }
        }
        else if (this.keys.length == 0) {
            let type = typeof key;
            if (type == "string" || type == "number")
                this.isSimpleKeys = true;
        }
        let index = -1;
        if (this.isSimpleKeys) {
            if (this.ignoreCase)
                key = key.toLowerCase();
            index = this.indexObject[key];
        }
        else
            index = this.keys.indexOf(key);
        if (index >= 0)
            this.values[index] = value;
        else {
            if (this.isSimpleKeys) {
                if (this.ignoreCase)
                    key = key.toLowerCase();
                this.indexObject[key] = this.keys.length;
            }
            this.keys.push(key);
            this.values.push(value);
        }
    }
    /** Adds an element with the specified key and value into the Hashtable. */
    add(key, value) {
        this.set(key, value);
    }
    /** Determines whether the Hashtable contains a specific key. */
    contains(key) {
        if (this.isSimpleKeys) {
            if (this.ignoreCase)
                key = key.toLowerCase();
            return this.indexObject[key] != undefined;
        }
        return this.keys.contains(key);
    }
    /** Determines whether the Hashtable contains a specific key. */
    containsKey(key) {
        if (this.isSimpleKeys) {
            if (this.ignoreCase)
                key = key.toLowerCase();
            return this.indexObject[key] != undefined;
        }
        return this.keys.contains(key);
    }
    /** Determines whether the Hashtable contains a specific value. */
    containsValue(value) {
        return this.values.contains(value);
    }
    /** Removes the element with the specified key from the Hashtable. */
    remove(key) {
        let index;
        if (this.isSimpleKeys) {
            if (this.ignoreCase)
                key = key.toLowerCase();
            index = this.indexObject[key];
        }
        else
            index = this.keys.indexOf(key);
        if (index >= 0) {
            this.keys.removeAt(index);
            this.values.removeAt(index);
            if (this.isSimpleKeys) {
                this.indexObject = {};
                for (let index = 0; index < this.keys.length; index++) {
                    this.indexObject[this.ignoreCase ? this.keys[index].toLowerCase() : this.keys[index]] = index;
                }
            }
        }
    }
    /** Removes all elements from the Hashtable. */
    clear() {
        this.keys = new List();
        this.values = new List();
        this.indexObject = {};
        this.isSimpleKeys = false;
    }
    /** Copies the Hashtable elements to a one-dimensional Array instance at the specified index. */
    copyTo(array, arrayIndex) {
        while (array.length < arrayIndex) {
            array.push(null);
        }
        for (let value of this.values) {
            if (array.length > arrayIndex)
                array[arrayIndex] = value;
            else
                array.push(value);
            arrayIndex++;
        }
    }
    /** Gets the number of key/value pairs contained in the Hashtable. */
    get count() {
        return this.keys.length;
    }
    clone() {
        let newHashtable = new Hashtable();
        this.keys.copyTo(newHashtable.keys);
        this.values.copyTo(newHashtable.values);
        if (this.isSimpleKeys)
            for (let key of StiObject.keys(this.indexObject)) {
                newHashtable.indexObject[key] = this.indexObject[key];
            }
        newHashtable.ignoreCase = this.ignoreCase;
        newHashtable.isSimpleKeys = this.isSimpleKeys;
        return newHashtable;
    }
}

/*
{*******************************************************************}
{                                                                   }

{                                                                   }
{                                                                   }
{   Copyright (C)  Stimulsoft                                       }
{   ALL RIGHTS RESERVED                                             }
{                                                                   }
{   The entire contents of this file is protected by U.S. and       }
{   International Copyright Laws. Unauthorized reproduction,        }
{   reverse-engineering, and distribution of all or any portion of  }
{   the code contained in this file is strictly prohibited and may  }
{   result in severe civil and criminal penalties and will be       }
{   prosecuted to the maximum extent possible under the law.        }
{                                                                   }
{   RESTRICTIONS                                                    }
{                                                                   }
{   THIS SOURCE CODE AND ALL RESULTING INTERMEDIATE FILES           }
{   ARE CONFIDENTIAL AND PROPRIETARY                                }
{   TRADE SECRETS OF Stimulsoft                                     }
{                                                                   }
{   CONSULT THE END USER LICENSE AGREEMENT FOR INFORMATION ON       }
{   ADDITIONAL RESTRICTIONS.                                        }
{                                                                   }
{*******************************************************************}
*/
/// <reference path="Hashtable.ts" />
class Dictionary extends Hashtable {
    get pairs() {
        return this.keys.map((value, index) => ({ key: value, value: this.values[index] }));
    }
    tryGetValue(key, out) {
        let index = this.keys.indexOf(key);
        if (index >= 0)
            out.ref = this.values[index];
        else
            out.ref = null;
        return index >= 0;
    }
}

/*
{*******************************************************************}
{                                                                   }

{                                                                   }
{                                                                   }
{   Copyright (C)  Stimulsoft                                       }
{   ALL RIGHTS RESERVED                                             }
{                                                                   }
{   The entire contents of this file is protected by U.S. and       }
{   International Copyright Laws. Unauthorized reproduction,        }
{   reverse-engineering, and distribution of all or any portion of  }
{   the code contained in this file is strictly prohibited and may  }
{   result in severe civil and criminal penalties and will be       }
{   prosecuted to the maximum extent possible under the law.        }
{                                                                   }
{   RESTRICTIONS                                                    }
{                                                                   }
{   THIS SOURCE CODE AND ALL RESULTING INTERMEDIATE FILES           }
{   ARE CONFIDENTIAL AND PROPRIETARY                                }
{   TRADE SECRETS OF Stimulsoft                                     }
{                                                                   }
{   CONSULT THE END USER LICENSE AGREEMENT FOR INFORMATION ON       }
{   ADDITIONAL RESTRICTIONS.                                        }
{                                                                   }
{*******************************************************************}
*/
class List extends Array {
    constructor(items) {
        super();
        if (typeof items == "number") {
        }
        else if (items)
            items.forEach(item => this.push(item));
        try {
            this.__proto__ = List.prototype;
            Object.defineProperty(this, "__proto__", { enumerable: false });
        }
        catch (e) {
            Object.defineProperty(this, "__proto__", { enumerable: false, writable: true });
            this.__proto__ = List.prototype;
        }
    }
    /*static create<T>(t: Type, ...values: any[]): List<T> {
        let isStructure = false;
        if (typeof values[values.length - 1] == "boolean") isStructure = !!values.pop();

        if (values.length == 0) {
            if (t == Number) return <any>0;
            if (t == Boolean) return <any>false;
            if (isStructure) return new (<any>t);
            else return null;
        }

        let newList = new List<T>();
        let count: number = values.shift();
        for (let i = 0; i < count; i++) {
            let value: any = List.create.apply(this, (<any[]>[t]).concat(values, [isStructure]));
            newList.push(value);
        }

        return newList;
    }*/
    get countItems() {
        let properties = StiObject.keys(this);
        return properties.length;
    }
    //#region Range
    addRange(items) {
        for (let item of items)
            this.push(item);
    }
    removeRange(index, count) {
        this.splice(index, count);
    }
    getRange(index, count) {
        if (index == null || index < 0)
            index = 0;
        if (index + count > this.length)
            count = this.length - index;
        return new List(this.slice(index, index + count));
    }
    //#endregion
    add(item) {
        this.push(item);
    }
    insert(index, item) {
        this.splice(index, 0, item);
    }
    getKeys() {
        return StiObject.keys(this).sort((a, b) => {
            if (a < b)
                return -1;
            else if (a > b)
                return 1;
            else
                return 0;
        });
    }
    getByIndex(index, keys = null) {
        if (keys == null)
            keys = this.getKeys();
        return this[keys[index]];
    }
    setByIndex(index, item) {
        let properties = StiObject.keys(this);
        this[properties[index]] = item;
    }
    removeByIndex(index) {
        let removeIndex = this.indexOf(this.getByIndex(index, null));
        delete this[removeIndex];
        return this;
    }
    copyTo(array, index = 0) {
        let destIndex = index;
        for (let sourceIndex = 0; sourceIndex < this.length; sourceIndex++) {
            array[destIndex] = this[sourceIndex];
            destIndex++;
        }
    }
    /** Removes all elements from the List. */
    clear() {
        this.splice(0, this.length);
    }
    peek() {
        return this[this.length - 1];
    }
    remove(item) {
        let index = this.indexOf(item);
        if (index >= 0)
            this.removeAt(index);
    }
    /** Removes the element at the specified index of the Lis.
     * @param index The zero-based index of the element to remove.
     * @throw index is less than 0. -or- index is equal to or greater than Count.
     */
    removeAt(index) {
        this.splice(index, 1);
    }
    exists(predicate) {
        for (let value of this) {
            if (predicate(value))
                return true;
        }
        return false;
    }
    fullOuterJoin(inner, outerKeySelector, innerKeySelector, resultSelector, __this) {
        let innerLookup = inner.toLookup(innerKeySelector, __this);
        let outerLookup = this.toLookup(outerKeySelector, __this);
        let innerJoinItems = inner
            .where(innerItem => !outerLookup.contains(innerKeySelector.apply(__this, [innerItem])))
            .select(innerItem => resultSelector.apply(__this, [null, innerItem]));
        return this
            .selectMany2(outerItem => {
            let innerItems = innerLookup.get(outerKeySelector.apply(__this, [outerItem]));
            return innerItems.any() ? innerItems : new List();
        }, resultSelector, __this)
            .concat(innerJoinItems);
    }
    toList() {
        return new List(this);
    }
    findIndex2(match) {
        for (let index = 0; index < this.length; index++) {
            if (match(this[index]))
                return index;
        }
        return -1;
    }
    findLastIndex2(match) {
        let lastIndex = -1;
        for (let index = 0; index < this.length; index++) {
            if (match(this[index]))
                lastIndex = index;
        }
        return lastIndex;
    }
    zip(second, resultSelector) {
        let result = new List();
        for (let index = 0; index < this.length; index++) {
            result.add(resultSelector(this[index], second[index]));
        }
        return result;
    }
    static repeat(element, count) {
        let list = new List();
        for (let i = 0; i < count; i++) {
            list.push(element);
        }
        return list;
    }
    //#region Filtering
    /** Filters a sequence of values based on a predicate.
     * @param predicate A function to test each element for a condition.
     * @returns An List that contains elements from the input sequence that satisfy the condition.
     */
    where(predicate, __this) {
        let filter = new List();
        for (let index = 0; index < this.length; index++) {
            let value = this[index];
            predicate.apply(__this, [value, index]) ? filter.push(value) : null;
        }
        return filter;
    }
    //#endregion
    //#region Join
    /** Correlates the elements of two sequences based on matching keys. The default
     * equality comparer is used to compare keys.
     * @param inner The sequence to join to the first sequence.
     * @param outerKeySelector A function to extract the join key from each element of the first sequence.
     * @param innerKeySelector A function to extract the join key from each element of the second sequence.
     * @param resultSelector A function to create a result element from two matching elements.
     * @returns An List that has elements of type V
     * that are obtained by performing an inner join on two sequences.
     */
    join2(inner, outerKeySelector, innerKeySelector, resultSelector, __this) {
        let result = new List();
        let innerKeys = new Hashtable();
        for (let i of inner) {
            let innerKey = innerKeySelector.apply(__this, [i]);
            innerKeys.set(innerKey, i);
        }
        for (let o of this) {
            let outerKey = outerKeySelector.apply(__this, [o]);
            let i = innerKeys.get(outerKey);
            if (i != null)
                result.push(resultSelector.apply(__this, [o, i]));
        }
        return result;
    }
    /** Correlates the elements of two sequences based on equality of keys and groups
     * the results. The default equality comparer is used to compare keys.
     * @param inner The sequence to join to the first sequence.
     * @param outerKeySelector A function to extract the join key from each element of the first sequence.
     * @param innerKeySelector A function to extract the join key from each element of the second sequence.
     * @param resultSelector A function to create a result element from an element from the first sequence
     * and a collection of matching elements from the second sequence.
     * @returns An List that contains elements of type V
     * that are obtained by performing a grouped join on two sequences.
     */
    groupJoin(inner, outerKeySelector, innerKeySelector, resultSelector, __this) {
        let result = new List();
        let innerKeys = new Hashtable();
        for (let i of inner) {
            let key = innerKeySelector.apply(__this, [i]);
            let innerResult = innerKeys.get(key);
            if (innerResult == null) {
                innerResult = new List();
                innerKeys.set(key, innerResult);
            }
            innerResult.push(i);
        }
        for (let o of this) {
            let key = outerKeySelector.apply(__this, [o]);
            let innerResult = innerKeys.get(key);
            if (innerResult == null)
                innerResult = new List();
            result.push(resultSelector.apply(__this, [o, innerResult]));
        }
        return result;
    }
    //#endregion
    //#region Projection
    /**
     * Projects each element of a sequence into a new form.
     * @param selector A transform function to apply to each element.
     * @returns An List whose elements are the result of invoking the transform function on each element of source.
     */
    select(selector, __this) {
        let filter = new List();
        this.forEach(value => filter.push(selector.apply(__this, [value])));
        return filter;
    }
    selectMany(selector, __this) {
        let filter = new List();
        this.forEach(value => {
            let result = selector.apply(__this, [value]);
            if (result != null)
                result.forEach(item => filter.push(item));
        });
        return filter;
    }
    selectMany2(collectionSelector, resultSelector, __this) {
        let filter = new List();
        this.forEach(value => {
            let result = collectionSelector.apply(__this, [value]);
            if (result != null)
                result.forEach(item => filter.push(resultSelector.apply(__this, [value, item])));
        });
        return filter;
    }
    //#endregion
    //#region Sorting
    /** Sorts the elements of a sequence in ascending order according to a key or by using a specified comparer.
     * @param keySelector A function to extract a key from an element.
     * @param comparer An System.Collections.Generic.IComparer`1 to compare keys.
     * @returns An System.Linq.IOrderedEnumerable`1 whose elements are sorted according to a key.
     */
    /*orderBy<K>(keySelector: (value: T) => K, comparer?: IComparer<K>): List<T> {
         let sort: T[] = this.ss.toArray();
         if (comparer == null) comparer = {
             compare: (x: K, y: K) => {
                 if (x != null && y == null) return 1;
                 if (x == null && y != null) return -1;
                 if (x == null && y == null) return 0;

                 return x.ss.compareTo(y);
             }
         };

         sort.sort((a: T, b: T) => comparer.compare(keySelector(a), keySelector(b)));

         return new List<T>(sort);
     }

     orderByDescending<K>(keySelector: (value: T) => K, comparer?: IComparer<K>): List<T> {
         let sort: T[] = this.ss.toArray();
         if (comparer == null) comparer = {
             compare: (x: K, y: K) => {
                 if (x != null && y == null) return -1;
                 if (x == null && y != null) return 1;
                 if (x == null && y == null) return 0;

                 return y.ss.compareTo(x);
             }
         };

         sort.sort((a: T, b: T) => comparer.compare(keySelector(a), keySelector(b)));

         return new List<T>(sort);
     }*/
    //#endregion
    //#region Grouping
    /** Groups the elements of a sequence according to a specified key selector function
     * and compares the keys by using a specified comparer.
     * @param keySelector A function to extract the key for each element.
     * @param comparer An System.Collections.Generic.IEqualityComparer`1 to compare keys.
     * @returns An IEnumerable<IGrouping<TKey, TSource>> in C# or IEnumerable(Of IGrouping(Of
     * TKey, TSource)) in Visual Basic where each System.Linq.IGrouping`2 object contains
     * a collection of objects and a key.
     */
    /*-groupBy<K>(keySelector: (value: T) => K, comparer?: IEqualityComparer<K>, __this?: any): List<Grouping<K, T>> {
        let result = new List<Grouping<K, T>>();
        if (comparer == null) comparer = {
            equals: (x: K, y: K) => {
                if (x == y) return true;
                return false;
            },
            getHashCode: () => 0
        };

        for (let item of this) {
            let key = keySelector.apply(__this, [item]);
            let group = result.firstOrDefault(g => comparer.equals(g.key, key));
            if (group == null) {
                group = new Grouping(new List<T>([]));
                group.key = key;
                result.push(group);
            }
            group.push(item);
        }

        return result;
    }*/
    //#endregion
    //#region Conversions
    /** Converts the elements of an List to the specified type.
     * @returns An List that contains each element of the source sequence converted to the specified type.
     */
    cast() {
        let cast = new List();
        let castFunction;
        /*if (typeof <S>{} == "string") castFunction = (value: T) => value.s.toString();
        else if (typeof <S>{} == "number") castFunction = (value: T) => value.s.ss.toNumber();
        else if (typeof <S>{} == "boolean") castFunction = (value: T) => value.s.ss.toBoolean();
        else*/ castFunction = (value) => value;
        this.forEach(value => cast.push(castFunction(value)));
        return cast;
    }
    toDictionary(keySelector, elementSelector) {
        let dictionary = new Dictionary();
        for (let index = 0; index < this.length; index++) {
            dictionary.add(keySelector(this[index]), elementSelector(this[index]));
        }
        return dictionary;
    }
    /** Creates a Lookup from an List
     * according to a specified key selector function.
     * @param keySelector A function to extract a key from each element.
     * @returns A Lookup that contains keys and values.
     */
    toLookup(keySelector, __this) {
        let hashtable = new Hashtable();
        for (let item of this) {
            let key = keySelector.apply(__this, [item]);
            let lookup = hashtable.get(key);
            if (lookup == null) {
                lookup = new List();
                hashtable.set(key, lookup);
            }
            lookup.push(item);
        }
        return hashtable;
    }
    //#endregion
    //#region Concatenation
    /** Concatenates two sequences.
     * @param second The sequence to concatenate to the first sequence.
     * @returns An List that contains the concatenated elements
     * of the two input sequences.
     */
    concat(second) {
        let concatedList = new List();
        for (let item of this)
            concatedList.push(item);
        for (let item of second)
            concatedList.push(item);
        return concatedList;
    }
    //#endregion
    //#region Aggregation
    /**
     * Applies an accumulator function over a sequence.
     * @param func An accumulator function to be invoked on each element.
     * @returns The final accumulator value.
     */
    aggregate(func) {
        let seed = this[0];
        for (let index = 1; index < this.length; index++) {
            seed = func(seed, this[index]);
        }
        return seed;
    }
    aggregate2(seed, func) {
        for (let index = 0; index < this.length; index++) {
            seed = func(seed, this[index]);
        }
        return seed;
    }
    count2(selector, __this) {
        if (selector == null)
            selector = (value) => true;
        let count = 0;
        this.forEach(item => selector.apply(__this, [item]) ? count++ : null);
        return count;
    }
    /** Invokes a transform function on each element of a sequence and returns the maximum value.
     * @param selector A transform function to apply to each element.
     * @returns The maximum value in the sequence.
     */
    /*max<S>(selector?: (value: T) => S): S {
        if (selector == null) selector = (value: T) => <S><any>value;
        if (this.length == 0) return null;
        let max = selector(this[0]);
        let maxFunc: Function;
        if (typeof max == "string") maxFunc = function (strA: string, strB: string): string { return strA.ss.compareTo(strB) >= 0 ? strA : strB; };
        if (typeof max == "number") maxFunc = Math.max;
        if (max instanceof DateTime) maxFunc = function (dateA: DateTime, dateB: DateTime): DateTime { return DateTime.compare(dateA, dateB) >= 0 ? dateA : dateB; };

        for (let index = 1; index < this.length; index++) {
            max = maxFunc(selector(this[index]), max);
        }

        return max;
    }*/
    /** Invokes a transform function on each element of a sequence and returns the minimum value.
     * @parm selector A transform function to apply to each element.
     * @returns The minimum value in the sequence.
     */
    /*min<S>(selector?: (value: T) => S): S {
        if (selector == null) selector = (value: T) => <S><any>value;
        if (this.length == 0) return null;
        let min = selector(this[0]);
        let minFunc: Function;
        if (typeof min == "string") minFunc = function (strA: string, strB: string): string { return strA.ss.compareTo(strB) <= 0 ? strA : strB; };
        if (typeof min == "number") minFunc = Math.min;
        if (min instanceof DateTime) minFunc = function (dateA: DateTime, dateB: DateTime): DateTime { return DateTime.compare(dateA, dateB) <= 0 ? dateA : dateB; };

        for (let index = 1; index < this.length; index++) {
            min = minFunc(selector(this[index]), min);
        }

        return min;
    }*/
    /** Computes the sum of the sequence of System.Decimal values that are obtained by
     * invoking a transform function on each element of the input sequence.
     * @param selector A transform function to apply to each element.
     * @returns The sum of the projected values.
     */
    /*sum(selector?: (value: T) => number): number {
        if (selector == null) selector = (value: T) => value.ss.toNumber();
        let sum = 0;
        this.forEach(value => sum += selector(value));
        return sum;
    }*/
    //#endregion
    //#region Quantifier Operations
    all(predicate, __this) {
        if (predicate == null)
            predicate = (value) => true;
        for (let value of this)
            if (!predicate.apply(__this, [value]))
                return false;
        return true;
    }
    /** Determines whether any element of a sequence satisfies a condition.
     * @param predicate A function to test each element for a condition.
     * @returns true if any elements in the source sequence pass the test in the specified predicate; otherwise, false.
     */
    any(predicate, __this) {
        if (predicate == null)
            predicate = (value) => true;
        for (let value of this)
            if (predicate.apply(__this, [value]))
                return true;
        return false;
    }
    /** Determines whether an element is in the List.
     * @param item The object to locate in the List. The value can be null for reference types.
     * @returns true if item is found in the List otherwise, false.
     */
    contains(item) {
        return this.indexOf(item) >= 0;
    }
    //#endregion
    //#region Partition Operations
    skip(count) {
        let result = new List();
        for (let index = count; index < this.length; index++) {
            result.add(this[index]);
        }
        return result;
    }
    take(count) {
        let result = new List();
        if (count > this.length)
            count = this.length;
        for (let index = 0; index < count; index++) {
            result.add(this[index]);
        }
        return result;
    }
    //#endregion
    //#region Generation Operations
    defaultIfEmpty() {
        if (this.length > 0)
            return this;
        return new List([null]);
    }
    //#endregion
    //#region Set Operations
    /** Returns distinct elements from a sequence by using the default equality comparer to compare values.
     * @returns An List that contains distinct elements from the source sequence.
     */
    distinct() {
        let filter = new List();
        this.forEach(value => filter.indexOf(value) < 0 ? filter.push(value) : null);
        return filter;
    }
    except(second) {
        let result = new List();
        for (let item of this) {
            if (second.indexOf(item) == -1)
                result.add(item);
        }
        return result;
    }
    union(second) {
        let union = new List();
        this.forEach(element => union.add(element));
        second.forEach(element => union.add(element));
        return union.distinct();
    }
    //#endregion
    //#region Equality
    sequenceEqual(second) {
        if (this.length != second.length)
            return false;
        for (let index = 0; index < this.length; index++) {
            if (this[index] != second[index])
                return false;
        }
        return true;
    }
    //#endregion
    //#region Element
    first(selector, __this) {
        if (selector == null)
            selector = (value) => true;
        for (let item of this) {
            if (selector.apply(__this, [item]))
                return item;
        }
        return null;
    }
    /** Returns the first element of the sequence that satisfies a condition or a default value if no such element is found.
     * @param predicate A function to test each element for a condition.
     * @returns if source is empty or if no element passes the test specified by predicate;
     * otherwise, the first element in source that passes the test specified by predicate.
     */
    firstOrDefault(predicate) {
        for (let value of this) {
            if (predicate == null)
                return value;
            if (predicate(value))
                return value;
        }
        return null;
    }
    lastOrDefault() {
        let item;
        for (let value of this) {
            item = value;
        }
        return item;
    }
}
StiObject.disableAllEnumerable(List.prototype, new List());

class StiJson {
    static { this.prettyPrint = true; }
    static dateToJsonDate(date) {
        let offset = date.date.getTimezoneOffset() * -1;
        let hoursOffset = Math.abs(Math.floor(offset / 60)).toString();
        let minutesOffset = Math.abs(offset % 60).toString();
        if (hoursOffset.length == 1)
            hoursOffset = "0" + hoursOffset;
        if (minutesOffset.length == 1)
            minutesOffset = "0" + minutesOffset;
        return (
        /* "/Date(" +*/ Date.parse(date.date.toString()).toString() +
            (offset >= 0 ? "+" : "-") +
            hoursOffset +
            minutesOffset /*+ ")/"*/);
    }
    static jsonDateFormatToDate(jsonDate) {
        let dateStr = jsonDate.split("/Date(").join("").split(")/").join("");
        let date = new DateTime(new Date(parseInt(dateStr)));
        let startOffsetIndex = dateStr.indexOf("+");
        if (startOffsetIndex == -1)
            startOffsetIndex = dateStr.indexOf("-");
        let localOffset = date.date.getTimezoneOffset();
        if (startOffsetIndex != -1)
            localOffset = 0;
        let localHoursOffset = Math.floor(localOffset / 60);
        let localMinutesOffset = localOffset % 60;
        let localHoursOffsetString = (Math.abs(localHoursOffset) < 10 ? "0" : "") + Math.abs(localHoursOffset).toString();
        let localMinutesOffsetString = (Math.abs(localMinutesOffset) < 10 ? "0" : "") + Math.abs(localMinutesOffset).toString();
        let offset = (localOffset >= 0 ? "+" : "-") + localHoursOffsetString + localMinutesOffsetString;
        let multiple = 1;
        if (startOffsetIndex != -1)
            offset = dateStr.substring(startOffsetIndex);
        if (offset.substr(0, 1) == "-")
            multiple = -1;
        date.addHours(localHoursOffset + parseInt(offset.substr(1, 2)) * multiple);
        date.addMinutes(localMinutesOffset + parseInt(offset.substr(3, 2)) * multiple);
        return date;
    }
    properties() {
        if (!this.isProperty) {
            if (this.value instanceof List)
                return this.value;
            else
                return this.value.value;
        }
        return new List();
    }
    removeProperty(propertyName) {
        if (propertyName != null || propertyName != "") {
            let elements = this.value.value.filter((x) => x.name == propertyName);
            if (elements.length > 0) {
                this.value.value.remove(elements[0]);
            }
        }
    }
    addPropertyNumber(propertyName, value) {
        if (this.value == null)
            this.value = new StiJson("", new List());
        this.removeProperty(propertyName);
        this.value.value.push(new StiJson(propertyName, value, true));
    }
    addPropertyNumberNotNull(propertyName, value) {
        if (value) {
            this.addPropertyNumber(propertyName, value);
        }
    }
    addPropertyNumberNoDefaultValue(propertyName, value) {
        if (this.value == null)
            this.value = new StiJson("", new List());
        this.removeProperty(propertyName);
        this.value.value.push(new StiJson(propertyName, value, true));
    }
    addPropertyJObject(propertyName, value) {
        if (this.value == null)
            this.value = new StiJson("", new List());
        this.removeProperty(propertyName);
        if (value == null || value.count == 0)
            return;
        this.value.value.push(new StiJson(propertyName, value));
    }
    addPropertyArray(propertyName, elements) {
        if (this.value == null)
            this.value = new StiJson("", new List());
        this.removeProperty(propertyName);
        if (elements == null)
            return;
        let values = [];
        elements.forEach((e) => values.push(e?.saveToJsonObject != null
            ? e.saveToJsonObject(this.options)
            : typeof e == "string"
                ? `"${e
                    .replace(/[\\]/g, "\\\\")
                    .replace(/[\"]/g, '\\"')
                    // .replace(/[\/]/g, '\\/')
                    .replace(/[\b]/g, "\\b")
                    .replace(/[\f]/g, "\\f")
                    .replace(/\r\n/g, "\n")
                    .replace(/[\r]/g, "\n")
                    .replace(/[\r\n]/g, "\\r\\n")
                    .replace(/[\t]/g, "\\t")
                    // eslint-disable-next-line no-control-regex
                    .replace(/[\u0001-\u001F]/g, (chr) => "\\u" + ("0000" + chr.charCodeAt(0).toString(16)).substr(-4))}"`
                : e));
        let json = new StiJson(propertyName, values);
        json.isArray = true;
        this.value.value.push(json);
    }
    addPropertyIdent(propertyName, value) {
        if (this.value == null)
            this.value = new StiJson("", new List());
        this.value.value.push(new StiJson(propertyName, value, true));
    }
    addPropertyBool(propertyName, value) {
        if (this.value == null)
            this.value = new StiJson("", new List());
        this.removeProperty(propertyName);
        this.value.value.push(new StiJson(propertyName, value, true));
    }
    /*addPropertyDateTime(propertyName: string, value: DateTime) {
        if (this.value == null) this.value = new StiJson("", new List());
        this.removeProperty(propertyName);
  
        this.value.value.push(new StiJson(propertyName, StiJson.dateToJsonDate(value), true));
    }*/
    addPropertyEnum(propertyName, enumType, value, defaultValue = null) {
        if (this.value == null)
            this.value = new StiJson("", new List());
        this.removeProperty(propertyName);
        if (typeof defaultValue != "undefined" && value == defaultValue)
            return;
        this.value.value.push(new StiJson(propertyName, Enum.getName(enumType, value), true));
    }
    addPropertyColor(propertyName, color, defColor = null) {
        if (color == null || color.equals(defColor))
            return;
        let value = color.isNamedColor ? color.name.replace(" ", "") : `${color.a},${color.r},${color.g},${color.b}`;
        this.addPropertyString(propertyName, value);
    }
    addPropertyString(propertyName, value, defaultValue) {
        if (this.value == null)
            this.value = new StiJson("", new List());
        this.removeProperty(propertyName);
        if (value == defaultValue)
            return;
        this.value.value.push(new StiJson(propertyName, value, true));
    }
    addPropertyStringNullOrEmpty(propertyName, value) {
        if (this.value == null)
            this.value = new StiJson("", new List());
        this.removeProperty(propertyName);
        if (StiString.isNullOrEmpty(value))
            return;
        this.value.value.push(new StiJson(propertyName, value, true));
    }
    get count() {
        let count = 0;
        if (!this.isProperty && this.value != null) {
            // eslint-disable-next-line @typescript-eslint/no-unused-vars
            for (let propertyName of this.value.value) {
                count++;
            }
        }
        return count;
    }
    getArray() {
        let result = [];
        this.value.forEach((e) => result.push(e.value));
        return result;
    }
    serialize(indent = 0) {
        let jsonString = "";
        let tabs = StiJson.prettyPrint ? Array(indent + 1).join(" ") : "";
        for (let property of this.value.properties()) {
            let valueString = "";
            if (property.isProperty) {
                if (property.value != null && typeof property.value == "string")
                    valueString =
                        '"' +
                            property.value
                                .replace(/[\\]/g, "\\\\")
                                .replace(/[\"]/g, '\\"')
                                // .replace(/[\/]/g, '\\/')
                                .replace(/[\b]/g, "\\b")
                                .replace(/[\f]/g, "\\f")
                                .replace(/\r\n/g, "\n")
                                .replace(/[\r]/g, "\n")
                                .replace(/[\r\n]/g, "\\r\\n")
                                .replace(/[\t]/g, "\\t")
                                // eslint-disable-next-line no-control-regex
                                .replace(/[\u0001-\u001F]/g, (chr) => "\\u" + ("0000" + chr.charCodeAt(0).toString(16)).substr(-4)) +
                            '"';
                // "\"" + property.value.replace(/\"/gi, "\\\"").replace(/\r\n/gi, "\n").replace(/\r/gi, "\n").replace(/\n/gi, "\\r\\n").replace(/\\/gi, "\\\\") + "\"";
                else
                    valueString = property.value;
            }
            else if (property.isArray) {
                if (property.value.length == 0) {
                    valueString += "[";
                }
                for (let element of property.value) {
                    if (valueString)
                        valueString += ",";
                    else
                        valueString += "[";
                    valueString += element?.serialize != null ? element.serialize(indent + 4) : element;
                }
                valueString += "]";
            }
            else {
                valueString = property.value.serialize(indent + 2);
            }
            if (jsonString)
                jsonString += ",";
            if (StiJson.prettyPrint)
                jsonString += "\n" + tabs + "  ";
            jsonString += '"' + property.name + '":';
            if (StiJson.prettyPrint)
                jsonString += " ";
            jsonString += valueString;
        }
        if (!jsonString)
            return "";
        if (StiJson.prettyPrint)
            return "{" + jsonString + "\n" + tabs + "}";
        return "{" + jsonString + "}";
    }
    deserialize(text) {
        if (typeof text == "string") {
            let pos = 0;
            let start = -1;
            while (pos < text.length) {
                if (text[pos] == '"' &&
                    (pos > 0 && text[pos - 1] != "\\"
                        ? true
                        : pos > 1 && text[pos - 2] == "\\" && pos > 2 && text[pos - 3] != "\\")) {
                    if (start > -1) {
                        let subText = text.substring(start, pos);
                        let modText = subText
                            .replace(/\\\\/gi, "#!!#")
                            .replace(/\\t/gi, "#!t#")
                            .replace(/\\\"/gi, "#!q#")
                            .replace(/\\r\\n/gi, "#!rn#")
                            .replace(/\\r/gi, "#!rn#")
                            .replace(/\\n/gi, "#!rn#");
                        if (modText.length != subText.length) {
                            // eslint-disable-next-line @typescript-eslint/restrict-plus-operands
                            text = text.substring(0, start) + modText + text.substring(pos);
                            pos += modText.length - subText.length;
                        }
                        start = -1;
                    }
                    else
                        start = pos + 1;
                }
                pos++;
            }
        }
        let reportObject = typeof text == "object" ? text : JSON.parse(text);
        this.deserializeFromObject(reportObject);
        this.value = this.value.value;
    }
    deserializeFromObject(child) {
        for (let propertyName in child) {
            if (typeof child[propertyName] == "object") {
                let jObject = new StiJson(propertyName);
                if (this.value == null)
                    this.value = new StiJson(null, new List());
                this.value.value.push(jObject);
                jObject.deserializeFromObject(child[propertyName]);
            }
            else if (typeof child[propertyName] != "function") {
                let jObject = new StiJson(propertyName, child[propertyName], true);
                if (this.value == null)
                    this.value = new StiJson(null, new List());
                this.value.value.push(jObject);
            }
        }
        if (child && Array.isArray(child) && child.length == 0) {
            this.value = new StiJson(null, new List());
        }
    }
    toString() {
        return this.name;
    }
    constructor(name = null, value = null, isProperty = false, options = {}) {
        this.isProperty = false;
        this.isArray = false;
        this.name = name;
        if (value != null && typeof value == "string")
            value = value.replace(/#!rn#/gi, "\r\n").replace(/#!q#/gi, '"').replace(/#!t#/gi, "\t").replace(/#!!#/gi, "\\");
        this.value = value;
        this.isProperty = isProperty;
        this.options = options;
    }
}

class Font {
    constructor(family, size, style = [], changesInterceptor) {
        this.changesInterceptor = changesInterceptor;
        this.fontSizeScale = 0.75;
        this.isChanged = true;
        this._family = family;
        this._size = size;
        this._style = style;
    }
    setProperty(propName, value) {
        switch (propName) {
            case "family":
                this.family = value;
                break;
            case "style":
                this.style = value;
                break;
            case "size":
                this.size = value;
                break;
        }
    }
    set style(value) {
        let this_ = this;
        let font = this.changesInterceptor ? this_.clone() : null;
        this._style = new Proxy(value, {
            deleteProperty: function (target, property) {
                let font = this.changesInterceptor ? this_.clone() : null;
                setTimeout(() => {
                    if (this.changesInterceptor) {
                        this.changesInterceptor.propertyChanged("font.style", this_.cloneStyle, font);
                    }
                    this_.isChanged = true;
                }, 0);
                return true;
            },
            set: function (target, property, value, receiver) {
                let font = this.changesInterceptor ? this_.clone() : null;
                target[property] = value;
                if (this.changesInterceptor) {
                    this.changesInterceptor.propertyChanged("font.style", this_.cloneStyle, font);
                }
                this_.isChanged = true;
                return true;
            },
        });
        if (this.changesInterceptor) {
            this.changesInterceptor.propertyChanged("font.style", this_.cloneStyle, font);
        }
        this_.isChanged = true;
    }
    get cloneStyle() {
        return this.style.map((s) => s);
    }
    get style() {
        return this._style;
    }
    resetChanged() {
        this.isChanged = false;
    }
    get family() {
        return this._family;
    }
    set family(value) {
        let font = this.changesInterceptor ? this.clone() : null;
        let oldValue = this._family;
        this._family = value;
        this.isChanged = true;
        if (this.changesInterceptor && oldValue != this._family) {
            this.changesInterceptor.propertyChanged("font.family", value, font);
        }
    }
    get size() {
        return this._size;
    }
    set size(value) {
        let font = this.changesInterceptor ? this.clone() : null;
        let oldValue = this._size;
        this._size = value;
        this.isChanged = true;
        if (this.changesInterceptor && oldValue != this._size) {
            this.changesInterceptor.propertyChanged("font.size", value, font);
        }
    }
    saveToJsonObject(options) {
        let json = new StiJson();
        json.addPropertyStringNullOrEmpty("Family", this.family);
        json.addPropertyNumber("Size", this.size);
        let style = this.style.filter((s) => s && s != "").join(",");
        json.addPropertyString("Style", style.length != 0 ? style : "Regular");
        return json;
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "Family":
                    this._family = property.value;
                    break;
                case "Size":
                    this._size = property.value;
                    break;
                case "Style":
                    this._style = property.value.replace("Regular", "").split(",");
                    break;
            }
        }
    }
    isBold() {
        return this.style.indexOf("Bold") >= 0;
    }
    isItalic() {
        return this.style.indexOf("Italic") >= 0;
    }
    isUnderline() {
        return this.style.indexOf("Underline") >= 0;
    }
    htmlStyle() {
        return `font-weight:${this.isBold() ? "bold" : "normal"};font-style:${this.isItalic() ? "italic" : "normal"}; text-decoration:${this.isUnderline() ? "underline" : ""};font-family:"${this.family}";font-size:${this.size}pt`;
    }
    equals(font) {
        return this.htmlStyle() == font?.htmlStyle();
    }
    clone() {
        return new Font(this._family, this.size, this.cloneStyle);
    }
}

class StiTextItem {
    constructor(value = "", font = new Font("Segoe UI", 9), color = Color.black(), backgroundColor, horizontalAlignment) {
        this.font = font;
        this.color = color;
        this.backgroundColor = backgroundColor;
        this.horizontalAlignment = horizontalAlignment;
        this._isChanged = true;
        this._value = value;
    }
    get eValue() {
        return this.value;
    }
    set eValue(value) {
        this.value = value;
    }
    get eFont() {
        return this.font;
    }
    set eFont(value) {
        this.font = value;
    }
    get eColor() {
        return this.color;
    }
    set eColor(value) {
        this.color = value;
    }
    get eBackgroundColor() {
        return this.backgroundColor;
    }
    set eBackgroundColor(value) {
        this.backgroundColor = value;
    }
    get value() {
        return this._value;
    }
    set value(value) {
        this._value = value;
        this._isChanged = true;
    }
    isChanged() {
        return this._isChanged || this.font?.isChanged || this.color?.isChanged() || this.backgroundColor?.isChanged();
    }
    setProperty(propName, value, oldObject) {
        if (propName.startsWith("font") && (oldObject === null || this.font.equals(oldObject))) {
            this.font.setProperty(propName.replace("font.", ""), value);
        }
        else if (propName == "color" && (oldObject === null || this.color.equals(oldObject))) {
            this.color = value.clone();
        }
    }
    resetChanged() {
        this._isChanged = false;
        this.font?.resetChanged();
        this.color?.resetChanged();
        this.backgroundColor?.resetChanged();
    }
    haveBackgoundColor() {
        return this.backgroundColor ? true : false;
    }
    haveVerticalAlignment() {
        return false;
    }
    get eContentAlignment() {
        return this.horizontalAlignment;
    }
    set eContentAlignment(value) {
        this.horizontalAlignment = value;
    }
    haveContentAlignment() {
        return this.horizontalAlignment ? true : false;
    }
    saveToJsonObject(options) {
        let json = new StiJson();
        json.addPropertyStringNullOrEmpty("Value", this.value);
        json.addPropertyJObject("Font", this.font.saveToJsonObject(options));
        json.addPropertyColor("Color", this.color);
        if (this.horizontalAlignment) {
            json.addPropertyEnum("HorizontalAlignment", StiHorizontalAlignment, this.horizontalAlignment);
        }
        return json;
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "Value":
                    this.value = property.value;
                    break;
                case "Font":
                    this.font = new Font();
                    this.font.loadFromJsonObject(property.value);
                    break;
                case "Color":
                    this.color = new Color();
                    this.color.deserializeFromString(property.value);
                    break;
                case "HorizontalAlignment":
                    this.horizontalAlignment = Enum.parse(StiHorizontalAlignment, property.value);
                    break;
            }
        }
    }
    htmlStyle() {
        return `${this.font.htmlStyle()};color:${this.color.toHtmlColor()}`;
    }
}

class StiInputTextItem extends StiTextItem {
    get eContentAlignment() {
        return this.element.contentAlignment;
    }
    set eContentAlignment(value) {
        this.element.contentAlignment = value;
    }
}

class StiRectangleGeometry {
    static { this.DELTA = 1; }
    isChanged() {
        return this.savedGeometry == null || !this.savedGeometry.equals(this);
    }
    resetChanged() {
        this.savedGeometry = this.clone();
    }
    saveToJsonObject(options) {
        let json = new StiJson();
        json.addPropertyNumber("X", this.x);
        json.addPropertyNumber("Y", this.y);
        json.addPropertyNumber("Width", this.width);
        json.addPropertyNumber("Height", this.height);
        json.addPropertyNumber("MinWidth", this.minWidth);
        json.addPropertyNumber("MinHeight", this.minHeight);
        json.addPropertyNumber("MaxWidth", this.width);
        json.addPropertyNumber("MaxHeight", this.height);
        return json;
    }
    equals(geometry) {
        return (this.x == geometry.x &&
            this.y == geometry.y &&
            this.width == geometry.width &&
            this.height == geometry.height &&
            this.minHeight == geometry.minHeight &&
            this.minWidth == geometry.minWidth);
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "X":
                    this._x = property.value;
                    break;
                case "Y":
                    this._y = property.value;
                    break;
                case "Width":
                    this._width = property.value;
                    break;
                case "Height":
                    this._height = property.value;
                    break;
                case "MinWidth":
                    this._minWidth = property.value;
                    break;
                case "MinHeight":
                    this._minHeight = property.value;
                    break;
                case "MaxWidth":
                    this._maxWidth = property.value;
                    break;
                case "MaxHeight":
                    //this._minHeight = property.value;
                    break;
            }
        }
    }
    clone() {
        let result = new StiRectangleGeometry(this.width, this.height);
        result._x = this.x;
        result._y = this.y;
        result._minWidth = this.minWidth;
        result._minHeight = this.minHeight;
        return result;
    }
    get x() {
        return this._x;
    }
    set x(value) {
        this._x = value;
    }
    get y() {
        return this._y;
    }
    set y(value) {
        this._y = value;
    }
    get width() {
        return this._width;
    }
    set width(value) {
        let oldGeometry = this.changesInterceptor ? this.clone() : null;
        let oldValue = this._width;
        this._width = Math.max(value, this._minWidth);
        if (this.changesInterceptor && oldValue != this._width) {
            this.changesInterceptor.propertyChanged("geometry.width", value, oldGeometry);
        }
    }
    get height() {
        return this._height;
    }
    set height(value) {
        let oldGeometry = this.changesInterceptor ? this.clone() : null;
        let oldValue = this._height;
        this._height = Math.max(value, this.minHeight);
        if (this.changesInterceptor && oldValue != this._height) {
            this.changesInterceptor.propertyChanged("geometry.height", value, oldGeometry);
        }
    }
    get minWidth() {
        return this._minWidth;
    }
    set minWidth(value) {
        let oldGeometry = this.changesInterceptor ? this.clone() : null;
        let oldValue = this._minWidth;
        this._minWidth = Math.min(value, this._maxWidth);
        this._width = Math.max(this._minWidth, this._width);
        if (this.changesInterceptor && oldValue != this._minWidth) {
            this.changesInterceptor.propertyChanged("geometry.minWidth", value, oldGeometry);
        }
    }
    get minHeight() {
        return this._minHeight;
    }
    set minHeight(value) {
        let oldValue = this._minHeight;
        let oldGeometry = this.changesInterceptor ? this.clone() : null;
        this._minHeight = Math.min(value, this._maxHeight);
        this._height = Math.max(this._minHeight, this._height);
        if (this.changesInterceptor && oldValue != this._minHeight) {
            this.changesInterceptor.propertyChanged("geometry.minHeight", value, oldGeometry);
        }
    }
    /*public get maxWidth(): number {
      return this._maxWidth;
    }
  
    public set maxWidth(value: number) {
      let oldValue = this._maxWidth;
      this._maxWidth = Math.max(value, this._minWidth);
      this._width = Math.min(this._maxWidth, this.width);
      if (this.changesInterceptor && oldValue != this._maxWidth) {
        this.changesInterceptor.propertyChanged("geometry.maxWidth", value);
      }
    }
  
    public get maxHeight(): number {
      return this._maxHeight;
    }
  
    public set maxHeight(value: number) {
      let oldValue = this._maxHeight;
      this._maxHeight = Math.max(value, this._minHeight);
      this._height = Math.min(this._maxHeight, this.height);
      if (this.changesInterceptor && oldValue != this._maxHeight) {
        this.changesInterceptor.propertyChanged("geometry.maxHeight", value);
      }
    }*/
    get right() {
        return this._x + this._width;
    }
    get bottom() {
        return this._y + this._height;
    }
    get centerX() {
        return this._x + this._width / 2;
    }
    get centerY() {
        return this._y + this._height / 2;
    }
    constructor(width = 0, height = 0, changesInterceptor) {
        this._x = 0;
        this._y = 0;
        this._minWidth = 0;
        this._minHeight = 0;
        this._maxWidth = 10000000;
        this._maxHeight = 10000000;
        this.width = width;
        this.height = height;
        this._minWidth = 5;
        this._minHeight = height;
        this.changesInterceptor = changesInterceptor;
    }
    withY(newY) {
        let copy = this.clone();
        copy.y = newY;
        return copy;
    }
    xProjectionIntersectsWith(other) {
        return (this.x < other.right &&
            this.right > other.x &&
            Math.abs(this.right - other.x) > StiRectangleGeometry.DELTA &&
            Math.abs(this.x - other.right) > StiRectangleGeometry.DELTA);
    }
    intersectWith(geometry) {
        let aLeftOfB = geometry.right - StiRectangleGeometry.DELTA < this.x;
        let aRightOfB = geometry.x > this.right - StiRectangleGeometry.DELTA;
        let aAboveB = geometry.y > this.bottom - StiRectangleGeometry.DELTA;
        let aBelowB = geometry.bottom - StiRectangleGeometry.DELTA < this.y;
        return !(aLeftOfB || aRightOfB || aAboveB || aBelowB);
    }
}

class StiLocalizationService {
    get localizationList() {
        return this._localizationList;
    }
    set localizationList(array) {
        let locList = this.toCamelCase(array);
        this._localizationList = locList;
    }
    static { this.localization = {}; }
    static { this.deflocalization = JSON.parse('{"Localization":{"@language":"English","@description":"English","@cultureName":"en","A_WebViewer":{"AbbreviatedDayFriday":"Fr","AbbreviatedDayMonday":"Mo","AbbreviatedDaySaturday":"Sa","AbbreviatedDaySunday":"Su","AbbreviatedDayThursday":"Th","AbbreviatedDayTuesday":"Tu","AbbreviatedDayWednesday":"We","Attachment":"Attachment:","ButtonNext":"Next","ButtonPrev":"Previous","ButtonSend":"Send","CategoryAlreadyExists":"The category with that name already exists!","DayFriday":"Friday","DayMonday":"Monday","Days":"Days","DaySaturday":"Saturday","DaySunday":"Sunday","DayThursday":"Thursday","DayTuesday":"Tuesday","DayWednesday":"Wednesday","Email":"Email:","EmailOptions":"Email Options","FirstPage":"First Page","Hours":"Hours","LabelFrom":"From:","LabelSelectExportFormat":"Select the format to which you want to save the report:","LabelTo":"To:","LastPage":"Last Page","Loading":"Loading...","Message":"Message:","Minutes":"Minutes","MonthApril":"April","MonthAugust":"August","MonthDecember":"December","MonthFebruary":"February","MonthJanuary":"January","MonthJuly":"July","MonthJune":"June","MonthMarch":"March","MonthMay":"May","MonthNovember":"November","MonthOctober":"October","MonthSeptember":"September","NextPage":"Next Page","OnePage":"One Page","Page":"Page","PageOf":"of","PreviousPage":"Previous Page","PrintContinue":"Click Print to continue","PrintReport":"Print","PrintToPdf":"PDF","PrintToXps":"Microsoft XPS","PrintWithoutPreview":"Print","PrintWithPreview":"Preview","SaveReport":"Save","Subject":"Subject:","TabItemContacts":"Contacts","TextComputer":"Computer","TextItemsRoot":"Root","TodayDate":"Today","WholeReport":"Whole Report"},"Adapters":{"AdapterBusinessObjects":"Data from Business Objects","AdapterConnection":"Data from {0}","AdapterCrossTabDataSource":"Data from Cross-Tab","AdapterCsvFiles":"Data from CSV Files","AdapterDataTables":"Data from DataSet, DataTables","AdapterDataViews":"Data from DataViews","AdapterDB2Connection":"Data from IBM DB2 Connection","AdapterDBaseFiles":"Data from dBase Files","AdapterFirebirdConnection":"Data from Firebird Connection","AdapterInformixConnection":"Data from Informix Connection","AdapterMySQLConnection":"Data from MySQL Connection","AdapterOdbcConnection":"Data from ODBC Connection","AdapterOleDbConnection":"Data from OLE DB Connection","AdapterOracleConnection":"Data from Oracle Connection","AdapterOracleODPConnection":"Data from Oracle ODP.NET Connection","AdapterPostgreSQLConnection":"Data from PostgreSQL Connection","AdapterSqlCeConnection":"Data from SQL CE Connection","AdapterSqlConnection":"Data from SQL Connection","AdapterSQLiteConnection":"Data from SQLite Connection","AdapterTeradataConnection":"Data from Teradata Connection","AdapterUniDirectConnection":"Data from Uni Direct Connection","AdapterUserSources":"Data from User Sources","AdapterVirtualSource":"Data from other Data Source","AdapterVistaDBConnection":"Data from VistaDB Connection"},"BarCode":{"Post":"Post","TwoDimensional":"Two-Dimensional"},"Buttons":{"Add":"Add","AddAllColumns":"Add All Columns","Attach":"Attach","Build":"Build...","Buttons":"Buttons","Cancel":"&amp;Cancel","Check":"Check","Close":"Close","Delete":"Delete","Design":"Design","Down":"Down","Duplicate":"Duplicate","Export":"Export","ForceDelete":"Force Delete","Help":"Help","Install":"Install","LessOptions":"Less Options","LoadDataSet":"Load DataSet (*.data)","More":"More","MoreApps":"More Apps","MoreOptions":"More Options","MoveLeft":"Move Left","MoveRight":"Move Right","MoveToResource":"Move to Resource","No":"&amp;No","Ok":"&amp;OK","Open":"Open","OpenContainingFolder":"Open Containing Folder","Print":"Print","Publish":"Publish","QuickPrint":"Quick Print","Remove":"Remove","RemoveAll":"Remove All","Rename":"Rename","RestoreDefaults":"Restore Defaults","Reverse":"Reverse","Save":"Save","SaveCopy":"Save a Copy","SetAll":"Set All","ShowLess":"Show Less","ShowMore":"Show More","ShowSpecific":"Show \'{0}\'","Sign":"Sign","Submit":"Submit","SwitchTo":"Switch to {0}","Test":"Test","Up":"Up","Upgrade":"Upgrade","UpgradeNow":"Upgrade Now","Upload":"Upload","Waiting":"Waiting","Yes":"&amp;Yes"},"Chart":{"AddCondition":"&amp;Add Condition","AddConstantLine":"Add Constant Line","AddFilter":"&amp;Add Filter","AddSeries":"&amp;Add Series","AddStrip":"Add Strip","AddTrendLine":"Add Trend Line","Area":"Area","Axes":"Axes","AxisReverse":"Reverse","AxisX":"Axis X","AxisY":"Axis Y","BoxAndWhisker":"Box and Whisker","Bubble":"Bubble","Candlestick":"Candlestick","ChartConditionsCollectionForm":"Conditions","ChartEditorForm":"Chart Editor","ChartFiltersCollectionForm":"Filters","ChartType":"Chart Type","CheckBoxAutoRotation":"Auto Rotation","ClusteredBar":"Clustered Bar","ClusteredColumn":"Clustered Column","Common":"Common","ConstantLine":"Constant Line","ConstantLinesEditorForm":"Constant Lines Editor","DataColumns":"Data Columns","Doughnut":"Doughnut","Financial":"Financial","FullStackedArea":"Full-Stacked Area","FullStackedBar":"Full-Stacked Bar","FullStackedColumn":"Full-Stacked Column","FullStackedLine":"Full-Stacked Line","FullStackedSpline":"Full-Stacked Spline","FullStackedSplineArea":"Full-Stacked Spline Area","Funnel":"Funnel","FunnelWeightedSlices":"Funnel Weighted Slices","Gantt":"Gantt","GridInterlaced":"Interlaced","GridLines":"Grid Lines","Histogram":"Histogram","LabelAlignment":"Alignment:","LabelAlignmentHorizontal":"Horizontal:","LabelAlignmentVertical":"Vertical:","LabelAngle":"Angle:","LabelArgumentDataColumn":"Argument Data Column:","LabelAutoRotation":"Auto Rotation:","LabelCloseValueDataColumn":"Close Value Data Column:","LabelEndValueDataColumn":"End Value Data Column:","LabelHighValueDataColumn":"High Value Data Column:","LabelHorizontal":"Horizontal:","LabelLowValueDataColumn":"Low Value Data Column:","LabelMinorCount":"Minor Count:","LabelOpenValueDataColumn":"Open Value Data Column:","Labels":"Labels","LabelsCenter":"Center","LabelSeriesName":"Series Name:","LabelsInside":"Inside","LabelsInsideBase":"Inside Base","LabelsInsideEnd":"Inside End","LabelsNone":"None","LabelsOutside":"Outside","LabelsOutsideBase":"Outside Base","LabelsOutsideEnd":"Outside End","LabelsOverlay":"Overlay","LabelsStyleCategory":"Category","LabelsStyleCategoryPercentOfTotal":"Category - Percent Of Total","LabelsStyleCategoryValue":"Category - Value","LabelsStylePercentOfTotal":"Percent Of Total","LabelsStyleValue":"Value","LabelsTwoColumns":"Two Columns","LabelTextAfter":"Text After:","LabelTextBefore":"Text Before:","LabelTitleAlignment":"Alignment:","LabelValueDataColumn":"Value Data Column:","LabelValueType":"Value Type:","LabelVertical":"Vertical:","LabelVisible":"Visible:","Legend":"Legend","LegendSpacing":"Spacing","Line":"Line","ListOfValues":"List of Values","Marker":"Marker","MoveConstantLineDown":"Move Constant Line Down","MoveConstantLineUp":"Move Constant Line Up","MoveSeriesDown":"Move Series Down","MoveSeriesUp":"Move Series Up","MoveStripDown":"Move Strip Down","MoveStripUp":"Move Strip Up","NoConditions":"No Conditions","NoFilters":"No Filters","Pareto":"Pareto","Pictorial":"Pictorial","PictorialStacked":"Pictorial Stacked","Pie":"Pie","Radar":"Radar","RadarArea":"Radar Area","RadarColumn":"Radar Column","RadarLine":"Radar Line","RadarPoint":"Radar Point","Range":"Range","RangeBar":"Range Bar","RemoveCondition":"&amp;Remove Condition","RemoveConstantLine":"Remove Constant Line","RemoveFilter":"&amp;Remove Filter","RemoveSeries":"&amp;Remove Series","RemoveStrip":"Remove Strip","Ribbon":"Ribbon","RunChartWizard":"Run Chart &amp;Wizard","Scatter":"Scatter","ScatterLine":"Scatter Line","ScatterSpline":"Scatter Spline","Series":"Series","SeriesColorsCollectionForm":"Series Colors","SeriesEditorForm":"Series Editor","Serieses":"Series","SparklinesArea":"Area","SparklinesColumn":"Column","SparklinesLine":"Line","SparklinesWinLoss":"Win / Loss","Spline":"Spline","SplineArea":"Spline Area","SplineRange":"Spline Range","StackedArea":"Stacked Area","StackedBar":"Stacked Bar","StackedColumn":"Stacked Column","StackedLine":"Stacked Line","StackedSpline":"Stacked Spline","StackedSplineArea":"Stacked Spline Area","SteppedArea":"Stepped Area","SteppedLine":"Stepped Line","SteppedRange":"Stepped Range","Stock":"Stock","Strip":"Strip","StripsEditorForm":"Strips Editor Form","Style":"Style","Sunburst":"Sunburst","Treemap":"Treemap","TrendLinesEditorForm":"Trend Lines Editor","Waterfall":"Waterfall"},"CharterMapEditor":{"Characters":"Characters"},"ChartRibbon":{"Axes":"Axes","AxesArrowStyle":"Arrow Style","AxesArrowStyleLines":"Lines","AxesArrowStyleNone":"None","AxesArrowStyleTriangle":"Triangle","AxesLabel":"Label Placement","AxesLabelsNone":"None","AxesLabelsOneLine":"One Line","AxesLabelsTwoLines":"Two Lines","AxesReverseHorizontal":"Reverse Horizontal","AxesReverseVertical":"Reverse Vertical","AxesTicks":"Ticks","AxesTicksMajor":"Major","AxesTicksMinor":"Minor","AxesTicksNone":"None","AxesVisible":"Visible","AxesXAxis":"X Axis","AxesXTopAxis":"X Top Axis","AxesYAxis":"Y Axis","AxesYRightAxis":"Y Right Axis","CenterLabels":"Center","ChangeType":"Change Type","GridLines":"Grid Lines","GridLinesHorizontal":"Grid Lines Horizontal","GridLinesVertical":"Grid Lines Vertical","HorAlCenter":"&lt;b&gt;Overlay Legend at Center&lt;/b&gt;&lt;br&gt;Show Legend at center of the chart&lt;/br&gt;&lt;br&gt;without resizing&lt;/br&gt;","HorAlLeft":"&lt;b&gt;Overlay Legend at Left&lt;/b&gt;&lt;br&gt;Show Legend at left of the chart&lt;/br&gt;&lt;br&gt;without resizing&lt;/br&gt;","HorAlLeftOutside":"&lt;b&gt;Show Legend at Left&lt;/b&gt;&lt;br&gt;Show Legend and align left&lt;/br&gt;","HorAlRight":"&lt;b&gt;Overlay Legend at Right&lt;/b&gt;&lt;br&gt;Show Legend at right of the chart&lt;/br&gt;&lt;br&gt;without resizing&lt;/br&gt;","HorAlRightOutside":"&lt;b&gt;Show Legend at Right&lt;/b&gt;&lt;br&gt;Show Legend and align right&lt;/br&gt;","HorizontalMajor":"&lt;b&gt;Major&lt;/b&gt;&lt;br&gt;Display Horizontal Gridlines for Major units&lt;/br&gt;","HorizontalMajorMinor":"&lt;b&gt;Major &amp;&amp; Minor Gridlines&lt;/b&gt;&lt;br&gt;Display Horizontal Gridlines for Major and Minor units&lt;/br&gt;","HorizontalMinor":"&lt;b&gt;Minor&lt;/b&gt;&lt;br&gt;Display Horizontal Gridlines for Minor units&lt;/br&gt;","HorizontalNone":"&lt;b&gt;None&lt;/b&gt;&lt;br&gt;Do not display Horizontal Grirdlines&lt;/br&gt;","InsideBaseLabels":"Inside Base","InsideEndLabels":"Inside End","Labels":"Series Labels","Legend":"Legend","LegendHorizontalAlignment":"Horizontal Alignment","LegendMarker":"Marker","LegendMarkerAlignmentLeft":"Left","LegendMarkerAlignmentRight":"Right","LegendMarkerVisible":"Visible","LegendVerticalAlignment":"Vertical Alignment","LegendVisible":"Visible","NoneLabels":"None","OutsideBaseLabels":"Outside Base","OutsideEndLabels":"Outside End","OutsideLabels":"Outside","ribbonBarAxis":"Axes","ribbonBarChartStyles":"Chart Styles","ribbonBarChartType":"Chart Type","ribbonBarLabels":"Labels","ribbonBarLegend":"Legend","Style":"Change Style","TwoColumnsPieLabels":"Two Columns","VertAlBottom":"&lt;b&gt;Overlay Legend at Bottom&lt;/b&gt;&lt;br&gt;Show Legend at bottom of the chart&lt;/br&gt;&lt;br&gt;without resizing&lt;/br&gt;","VertAlBottomOutside":"&lt;b&gt;Show Legend at Bottom&lt;/b&gt;&lt;br&gt;Show Legend and align bottom&lt;/br&gt;","VertAlCenter":"&lt;b&gt;Overlay Legend at Center&lt;/b&gt;&lt;br&gt;Show Legend at center of the chart&lt;/br&gt;&lt;br&gt;without resizing&lt;/br&gt;","VertAlTop":"&lt;b&gt;Overlay Legend at Top&lt;/b&gt;&lt;br&gt;Show Legend at top of the chart&lt;/br&gt;&lt;br&gt;without resizing&lt;/br&gt;","VertAlTopOutside":"&lt;b&gt;Show Legend at Top&lt;/b&gt;&lt;br&gt;Show Legend and align top&lt;/br&gt;","VerticalMajor":"&lt;b&gt;Major&lt;/b&gt;&lt;br&gt;Display Vertical Gridlines for Major units&lt;/br&gt;","VerticalMajorMinor":"&lt;b&gt;Major &amp;&amp; Minor Gridlines&lt;/b&gt;&lt;br&gt;Display Vertical Gridlines for Major and Minor units&lt;/br&gt;","VerticalMinor":"&lt;b&gt;Minor&lt;/b&gt;&lt;br&gt;Display Vertical Gridlines for Minor units&lt;/br&gt;","VerticalNone":"&lt;b&gt;None&lt;/b&gt;&lt;br&gt;Do not display Vertical Gridlines&lt;/br&gt;"},"Cloud":{"AcceptTermsAndPrivacyPolicy":"I read and accept the {0} and {1}","Account":"Account","AccountSettings":"Account Settings","AddAPlace":"Add a Place","AreYouSureYouWantDeleteReport":"Are you sure you want to delete \\"{0}\\" report from disk?","Authorize":"Authorize","AuthorizeWithLicenseKey":"Authorize with License Key","ButtonChangePassword":"Change Password","ButtonDeleteAll":"Delete All","ButtonDesign":"Design Report","ButtonLater":"Later","ButtonLogInWith":"Log In with {0}","ButtonLogout":"Logout","ButtonPublish":"Publish","ButtonPurchase":"Purchase","ButtonRecover":"Recover","ButtonRenew":"Renew","ButtonResendEmail":"Resend Email","ButtonResetPassword":"Reset Password","ButtonRun":"Run","ButtonScheduler":"Scheduler","ButtonShare":"Share","ButtonSignUp":"Sign Up","ButtonSignUpWith":"Sign Up with {0}","ButtonSkip":"Skip","ButtonView":"View","ButtonWhereUsed":"Where is it used?","Cancel":"Cancel","CheckBoxMoveToRecycleBin":"Move to Recycle Bin","CheckBoxRememberMe":"Remember Me","CheckForUpdate":"Check for Update","Cloud":"Cloud","Collection":"Collection","Create":"Create","CreateError":"Error while creating report!","CreateNewCollection":"Create New Collection","CreateYourTeam":"Create your team","CreatingReport":"Creating report...","DashboardWindowTitleNew":"New Dashboard","DeleteFile":"Delete File","DoNotAskMe":"Do not ask me again","EnterUserNameToLogin":"Enter User Name (email) to log in.","ExecutionError":"Execution error","ExpiredDate":"Expired Date","FileStorageWindowTitleEdit":"Edit File Storage","FileStorageWindowTitleNew":"New File Storage","FolderWindowTitleEdit":"Edit Folder","FolderWindowTitleNew":"New Folder","ForExample":"For example","GroupBoxAttachedItems":"Attached Items","HyperlinkAgreeToTerms":"By registering you agree to Terms.","HyperlinkAlreadyHaveAccount":"Already have account","HyperlinkForgotPassword":"Forgot password","HyperlinkHavePassword":"Have password","HyperlinkRegisterAccount":"Register FREE account","InstallSamples":"Install Samples","Invitations":"Invitations","Invite":"Invite","LabelAddCloudFolder":"Connect your Stimulsoft Cloud folder with reports and dashboards.","LabelAddFolder":"Add your local folder with reports and dashboards.","labelCollectionName":"Collection Name:","LabelCreated":"Created:","LabelCreateFolder":"Create a new category in which you can place other items.","LabelCreateNewDashboard":"Create new dashboard.","LabelCreateReportTemplate":"Create report template.","LabelCurrentPassword":"Current Password:","LabelDataFile":"Data File:","LabelDataUrl":"Data URL:","LabelEndDate":"End Date:","labelFileName":"File Name:","LabelForeground":"Foreground:","LabelFromReport":"From Report","LabelFromReportCode":"From Report (define in code)","LabelInviteUser":"Invite new users to your team. Send invitations to their emails.","LabelLastLogin":"Last Log In:","LabelLastTime":"Last Time:","LabelModified":"Modified:","LabelNewPassword":"New Password:","LabelNextTime":"Next Time:","labelPassword":"Password:","LabelPermission":"Permission:","LabelPicture":"Picture:","LabelRenderedReport":"Rendered report","LabelResponseAsFile":"Response as File","LabelResultType":"Result Type:","LabelSeparateReport":"Separate report (and scripts) file","LabelShowReport":"Show report:","LabelStartDate":"Start Date:","labelUserName":"User Name:","License":"License","LicenseInformation":"License Information","LicenseKey":"License Key","Login":"Log In","MyTeam":"My Team","NofM":"{0}: {1} of {2}","Open":"Open","OpenFile":"Open File","OperationCreate":"Create \'{0}\'","OperationDelete":"Delete \'{0}\' from Server","OperationDownload":"Download from Server","OperationGetList":"Get List of Files from Server","OperationLogin":"Log In to Server","OperationRename":"Rename \'{0}\' to \'{1}\'","OperationUpload":"Upload \'{0}\' to Server","page":"page","Platforms":"Platforms","Port":"Port","PrivacyPolicy":"Privacy","Products":"Products","Proxy":"Proxy","PublishMessage":"In order to publish this report you should submit it to our service publish.stimulsoft.com","questionOpenThisFile":"Are you sure want to open \'{0}\' item?","questionOverrideItem":"Do you really want to override \'{0}\' item?","questionRemoveItem":"Do you really want to remove \'{0}\' item?","RefreshList":"Refresh List","ReportDocumentFormatNotRecognized":"Format of \'{0}\' item is not recognized as rendered report format!","ReportTemplateFormatNotRecognized":"Format of \'{0}\' item is not recognized as report template format!","RequestChangesWhenSavingToCloud":"Request Changes when Saving to Stimulsoft Cloud","RibbonButtonAddRole":"Add Role","RibbonButtonAddUser":"Add User","RibbonButtonAddWorkspace":"Add Workspace","RibbonButtonFolder":"Folder","RibbonTabUsers":"Users","Root":"Root","RootFolder":"Root Folder","Save":"Save","SaveAccountSettings":"Save Account Settings","SaveAsType":"Save as type","SaveFile":"Save File","SavingToStimulsoftCloudPleaseWait":"Saving the report to Stimulsoft Cloud. Please wait!","SearchForOnlineTemplates":"Search Stimulsoft templates online","ShareWindowTitleNew":"Share","ShowAllFiles":"Show All Files","ShowNotificationMessages":"Show Notification Messages","Subscriptions":"Subscriptions","TabItemEmbedCode":"Embed Code","TabItemQRCode":"QR Code","TabItemShare":"Link to Share","Team":"Team","TermsOfUse":"Terms","TextActivated":"Activated","TextActivationDate":"Activation Date","TextDelete":"Delete","TextDeletingItems":"Deleting items...","TextDescriptionChanges":"Please, type a description of the changes:","TextFirstName":"First Name","TextFromTo":"From {0} to {1} (Total - {2})","TextItemsWorkspace":"Workspace","TextLastName":"Last Name","TextModify":"Modify","TextNewsLetters":"News Letters","TextNoFavoriteFiles":"No favorite files","TextNoFiles":"No files","TextNoNotifications":"No Notifications","TextNoRecentFiles":"No recent files","TextOwner":"Owner","TextProfile":"Profile","TextReports":"Reports","TextRestoringItems":"Restoring items...","TextRole":"Role","TextRun":"Run","TextUser":"User","TextUserName":"User Name (Email)","TimeHoursAgoFive":"Five hours ago, {0:t}","TimeHoursAgoFour":"Four hours ago, {0:t}","TimeHoursAgoOne":"One hour ago, {0:t}","TimeHoursAgoThree":"Three hours ago, {0:t}","TimeHoursAgoTwo":"Two hours ago, {0:t}","TimeMinutesAgoFive":"Five minutes ago, {0:t}","TimeMinutesAgoFour":"Four minutes ago, {0:t}","TimeMinutesAgoLessOne":"Less than a minute ago","TimeMinutesAgoN":"{0} minutes ago, {1:t}","TimeMinutesAgoOne":"One minute ago, {0:t}","TimeMinutesAgoThree":"Three minutes ago, {0:t}","TimeMinutesAgoTwo":"Two minutes ago, {0:t}","TimeToday":"Today, {0:t}","TimeYesterday":"Yesterday, {0:t}","ToolTipAddRole":"Creating a new role in the workspace.","ToolTipAddUser":"Creating a new user in the selected role.","ToolTipAspNet":"Publish the selected report to the ASP.NET application.","ToolTipAspNetMvc":"Publish the selected report to the ASP.NET MVC application.","ToolTipAttach":"Attach items to the selected report.","ToolTipCreate":"Create a new item.","ToolTipDelete":"Delete the selected items.","ToolTipDeleted":"Show deleted items","ToolTipDownload":"Download the selected item.","ToolTipEdit":"Edit the selected item.","ToolTipGridMode":"List view","ToolTipInfo":"View details","ToolTipJs":"Publish the selected report as the HTML page","ToolTipPublish":"Prepare the selected report to be deployed in your application.","ToolTipRecover":"Recover the selected items.","ToolTipRunWithoutPreview":"Render the selected report without preview","ToolTipShare":"Share the selected file.","ToolTipSort":"Sort options","ToolTipThumbnailMode":"Thumbnail View","ToolTipViewFile":"Show the selected file.","ToolTipViewReport":"Show the selected report in the viewer.","WeDidntFindAnything":"We didn\'t find anything to show here.","WindowDescriptionDelete":"Are you sure you want to delete the selected items?","WindowDescriptionRecover":"Selected items will be recovered from the Recycle Bin.","WindowTitleDelete":"Delete Items","WindowTitleForgotPassword":"Forgot Password","WindowTitleLogin":"Log In","WindowTitleRecover":"Recover Items","WindowTitleRoleEdit":"Edit Role","WindowTitleRoleNew":"New Role","WindowTitleSignUp":"Sign Up","WindowTitleUserEdit":"Edit User","WindowTitleUserNew":"New User","WindowTitleWorkspaceEdit":"Edit Workspace","WindowTitleWorkspaceNew":"New Workspace","WizardBlankReportDescription":"Create a blank report","WizardExcelDescription":"Create a report with Excel data.","WizardJsonDescription":"Create a report with JSON data.","WizardPrivateShare":"No Access","WizardPrivateShareDescription":"External access to the item is restricted.","WizardPublicShare":"Public Access","WizardPublicShareDescription":"External access for any unauthorized user.","WizardRegisteredShare":"Authorized Access","WizardRegisteredShareDescription":"External access only for registered users from any workspace.","WizardTeamShare":"Team Access","WizardTeamShareDescription":"External access for users of one workspace only.","WizardXmlDescription":"Create a report with XML data."},"Components":{"StiBarCode":"Bar Code","StiButton":"Button","StiCards":"Cards","StiChart":"Chart","StiCheckBox":"Check Box","StiChildBand":"Child","StiClone":"Clone","StiColumnFooterBand":"Column Footer","StiColumnHeaderBand":"Column Header","StiComboBox":"Combo Box","StiComponent":"Component","StiContainer":"Container","StiContourText":"Contour Text","StiCrossColumn":"Cross-Column","StiCrossColumnTotal":"Cross-Column Total","StiCrossDataBand":"Cross-Data","StiCrossFooterBand":"Cross-Footer","StiCrossGroupFooterBand":"Cross-Group Footer","StiCrossGroupHeaderBand":"Cross-Group Header","StiCrossHeaderBand":"Cross-Header","StiCrossRow":"Cross-Row","StiCrossRowTotal":"Cross-Row Total","StiCrossSummary":"Cross-Summary","StiCrossSummaryHeader":"Cross-Summary Header","StiCrossTab":"Cross-Tab","StiCrossTitle":"Cross-Title","StiDashboard":"Dashboard","StiDataBand":"Data","StiDatePicker":"Date Picker","StiElectronicSignature":"Electronic Signature","StiEmptyBand":"Empty Data","StiFooterBand":"Footer","StiGauge":"Gauge","StiGroupFooterBand":"Group Footer","StiGroupHeaderBand":"Group Header","StiHeaderBand":"Header","StiHierarchicalBand":"Hierarchical Data","StiHorizontalLinePrimitive":"Horizontal Line","StiImage":"Image","StiIndicator":"Indicator","StiListBox":"List Box","StiMap":"Map","StiMathFormula":"Math Formula","StiMultipleSelection":"Multiple Selection","StiNumberBox":"Number Box","StiOnlineMap":"Online Map","StiOverlayBand":"Overlay","StiPage":"Page","StiPageFooterBand":"Page Footer","StiPageHeaderBand":"Page Header","StiPanel":"Panel","StiPdfDigitalSignature":"PDF Digital Signature","StiPivotColumn":"Pivot Column","StiPivotRow":"Pivot Row","StiPivotSummary":"Pivot Summary","StiPivotTable":"Pivot Table","StiProgress":"Progress","StiRectanglePrimitive":"Rectangle","StiRegionMap":"Region Map","StiReport":"Report","StiReportSummaryBand":"Report Summary","StiReportTitleBand":"Report Title","StiRichText":"Rich Text","StiRoundedRectanglePrimitive":"Rounded Rectangle","StiScreen":"Screen","StiShape":"Shape","StiSignature":"Signature","StiSingleSelection":"Single Selection","StiSparkline":"Sparkline","StiSubReport":"Sub-Report","StiSystemText":"System Text","StiTable":"Table","StiTableOfContents":"Table of Contents","StiText":"Text","StiTextInCells":"Text in Cells","StiTreeView":"Tree View","StiTreeViewBox":"Tree View Box","StiVerticalLinePrimitive":"Vertical Line","StiWinControl":"Win Control","StiZipCode":"ZIP Code"},"CustomMapWindow":{"CheckedAll":"Checked All","HideText":"Hide Text","KeysChangePosition":"Keys (Left, Top, Right, Bottom) change the position of the text","KeysChangeSize":"Shift + keys (Left, Top, Right, Bottom) change the size of the text area","UncheckedAll":"Unchecked All"},"Dashboard":{"AddRange":"Add Range","AfterGroupingData":"Apply after grouping data","AfterSortingData":"Apply after grouping and sorting data","AllowUserColumnSelection":"Allow User Column Selection","AllowUserDrillDown":"Allow User Drill-Down","AllowUserFiltering":"Allow User Filtering","AllowUserSorting":"Allow User Sorting","BeforeTransformation":"Apply before data transformation","Blank":"(Blank)","Blanks":"(Blanks)","BooleanFilters":"Boolean Filters","CannotLoadDashboard":"You cannot load a report with dashboards.","ChangeChartType":"Change Chart Type","ChangeMapType":"Change Map Type","ClearAllFormatting":"Clear All Formatting","ClearFilterFrom":"Clear Filter from \'{0}\'","ColorScale":"Color Scale","ColumnInteractions":"Column Interactions","CustomFilter":"Custom &amp;Filter...","DashboardsNotSupportedIntheWPFDesigner":"Dashboards are not supported in the WPF Designer.","DataBars":"Data Bars","DataFilterGrouping":"This operation is used for grouping different columns only.","DataNotDefined":"Data is not defined","DateFilters":"Date Filters","Dimension":"Dimension","Dimensions":"Dimensions","DragDropBlocks":"Drag &amp; drop blocks from panel","DragDropData":"Drag &amp; drop data","DragDropDataFromDictionary":"Drag &amp; drop data from Dictionary","DrillDown":"Drill-Down","DrillDownFiltered":"Drill-Down Filtered","DrillDownSelected":"Drill-Down Selected","DrillUp":"Drill Up","DuplicateField":"Duplicate Field","EditExpression":"Edit Expression","EditField":"Edit Field","EmptyDashboardFooter":"Drag &amp; drop component from ToolBox or data from Dictionary","EmptyDashboardHeader":"Dashboard is empty","FieldInteractions":"Field Interactions","FieldTypeRestrictionHint":"Only \'{0}\' type field can be used!","FirstLastPoints":"First / Last Points","FirstRowIndex":"First Row Index","FullRowSelect":"Full Row Select","HighLowPoints":"High / Low Points","ImageNotSpecified":"Image not specified","Indicator":"Indicator","InitialValue":"Initial Value","LimitRows":"Skip and Limit Rows","Measure":"Measure","Measures":"Measures","Metrics":"Metrics","NewDimension":"New Dimension","NewField":"New Field","NewMeasure":"New Measure","NoRanges":"No Ranges","NoResult":"No Result","NSelected":"{0} selected","Nulls":"(Nulls)","NumberFilters":"Number Filters","ParentElement":"Parent Element","Priority":"Priority","RangeMode":"Range Mode","RangeType":"Range Type","RemoveActions":"R&amp;emove Actions","RemoveAllFields":"Remove All Fields","RemoveField":"Remove Field","RemoveMobileSurface":"Remove Mobile Surface","ReplaceValues":"Replace Values","ReportSnapshot":"Report Snapshot","RowsCount":"Rows Count","RunFieldsEditor":"Run Fields Editor","RunFieldsEditorInfo":"Run the Fields Editor to change interaction of each table column.","SelectAll":"(Select &amp;All)","ShowAllValue":"Show (All) Value","ShowAsPercentages":"Show as Percentages","ShowBlanks":"Show Blanks","SkipFirstRows":"Skip First Rows","SortAZ":"Sort A to Z","SortLargestToSmallest":"Sort Largest to Smallest","SortNewestToOldest":"Sort Newest to Oldest","SortOldestToNewest":"Sort Oldest to Newest","SortSmallestToLargest":"Sort Smallest to Largest","SortZA":"Sort Z to A","Sparklines":"Sparklines","StringFilters":"String Filters","TransformationHint":"Click on the table header to apply sorting, filtering or change data. This transformation will be applied only to the data of this item.","Trend":"Trend","ViewEditCompilationNotice":"You can\'t edit the report which has the \'Report.CalculationMode\' property equals to \'Compilation\' value. Please set that property to an \'Interpretation\' value.","ViewModeDesktop":"Desktop","ViewModeMobile":"Mobile"},"Database":{"Connection":"Connection","Database":"{0} Connection","DatabaseDB2":"IBM DB2 Connection","DatabaseFirebird":"Firebird Connection","DatabaseInformix":"Informix Connection","DatabaseJson":"JSON Data","DatabaseMySQL":"MySQL Connection","DatabaseOdbc":"ODBC Connection","DatabaseOleDb":"OLE DB Connection","DatabaseOracle":"Oracle Connection","DatabaseOracleODP":"Oracle ODP.NET Connection","DatabasePostgreSQL":"PostgreSQL Connection","DatabaseSql":"SQL Connection","DatabaseSqlCe":"SQLServerCE Connection","DatabaseSQLite":"SQLite Connection","DatabaseTeradata":"Teradata Connection","DatabaseUniDirect":"Uni Direct Connection","DatabaseVistaDB":"VistaDB Connection","DatabaseXml":"XML Data"},"DatePickerRanges":{"CurrentMonth":"Current Month","CurrentQuarter":"Current Quarter","CurrentWeek":"Current Week","CurrentYear":"Current Year","DaysAgo":"{0} Days Ago","FirstQuarter":"First Quarter","FourthQuarter":"Fourth Quarter","Index":"Index","Last14Days":"Last 14 Days","Last30Days":"Last 30 Days","Last7Days":"Last 7 Days","MonthToDate":"Month To Date","NextMonth":"Next Month","NextQuarter":"Next Quarter","NextWeek":"Next Week","NextYear":"Next Year","PreviousMonth":"Previous Month","PreviousQuarter":"Previous Quarter","PreviousWeek":"Previous Week","PreviousYear":"Previous Year","Quarter":"Quarter","QuarterToDate":"Quarter To Date","SecondQuarter":"Second Quarter","ThirdQuarter":"Third Quarter","Today":"Today","Tomorrow":"Tomorrow","WeekToDate":"Week To Date","Year":"Year","YearToDate":"Year To Date","Yesterday":"Yesterday"},"DesignerFx":{"AlreadyExists":"\'{0}\' already exists.","CanNotLoadThisReportTemplate":"Can\'t load this report template.","CloseDataSourceEditor":"Do you want to close data source editor?","CloseEditor":"Do you want to close editor?","CompilingReport":"Compiling Report","Connecting":"Connecting to Server","ConnectionError":"Connection error","ConnectionSuccessfull":"Connection was successful","Continue":"Continue","DecryptionError":"Decryption error: Wrong password or corrupted file.","EmailSuccessfullySent":"The Email has been successfully sent.","ErrorAtSaving":"Error at saving","ErrorCode":"Error at saving. Error code: {0}","ErrorServer":"Error at saving. Server doesn\'t respond.","ExportingReport":"Exporting Report","LoadingCode":"Loading Code","LoadingConfiguration":"Loading Configuration","LoadingData":"Loading Data","LoadingDocument":"Loading Document","LoadingImages":"Loading Images","LoadingLanguage":"Loading Language","LoadingReport":"Loading Report","PreviewAs":"Preview as {0}","RenderingReport":"Rendering Report","ReportSuccessfullySaved":"Report is successfully saved.","RetrieveError":"Retrieve columns error","RetrievingColumns":"Retrieving Columns","Saving":"Saving","SavingConfiguration":"Saving Configuration","SavingReport":"Saving Report","TestConnection":"Test Connection","TextNotFound":"The specified text was not found. Text : {0}"},"Desktop":{"Beginner":"Beginner","ButtonAddCloud":"Add Cloud Folder","ButtonAddFolder":"Add Folder","ButtonCreateDashboard":"Create Dashboard","ButtonCreateReport":"Create Report","ChooseYourSkillLevel":"Choose your skill level","Creator":"Creator","Developer":"Developer","DoYouWantToInstallReports":"Do you want to install templates of reports and dashboards?","InstallSamplesDesc":"Let\'s install our sample projects. They will help you learn the basics of working with our software.","PleaseAnswerWhoAreYou":"Please, answer who you are?","SkillLevel":"Skill Level","WhoAreYou":"Who Are you?","WhoAreYouBeginnerDescription":"Perfect fit if you are doing the first run of the designer.","WhoAreYouCreatorDescription":"Perfect fit for creating reports. The necessary functionality for design is available.","WhoAreYouDeveloperDescription":"Perfect fit for creating applications. Complete functionality for the report design and embedding components included."},"Dialogs":{"StiButtonControl":"Button","StiCheckBoxControl":"Check Box","StiCheckedListBoxControl":"Checked List Box","StiComboBoxControl":"Combo Box","StiDateTimePickerControl":"Date Time Picker","StiForm":"Form","StiGridControl":"Grid","StiGroupBoxControl":"Group Box","StiLabelControl":"Label","StiListBoxControl":"List Box","StiListViewControl":"List View","StiLookUpBoxControl":"LookUp Box","StiNumericUpDownControl":"Numeric Up Down","StiPanelControl":"Panel","StiPictureBoxControl":"Picture Box","StiRadioButtonControl":"Radio Button","StiReportControl":"Report Control","StiRichTextBoxControl":"Rich Text Box","StiTextBoxControl":"Text Box","StiTreeViewControl":"Tree View"},"Editor":{"AllowSQLFormatting":"Allow SQL Formatting","BetweenMetrics":"Between 1 and 10 metrics can be selected.","CantFind":"Cannot find the data you\'re searching for.","CollapseToDefinitions":"C&amp;ollapse to Definitions","Column":"Column: {0}","EntireScope":"&amp;Entire Scope","Find":"&amp;Find","FindNext":"&amp;Find Next","FindWhat":"Find What:","FromCursor":"From Cursor","GotoLine":"Go To &amp;Line","InsertLink":"Insert Link","InsertSymbol":"Insert Symbol","Line":"Line: {0}","LineNumber":"Line Number:","LineNumberIndex":"Line Number ({0} - {1})","MarkAll":"&amp;Mark All","MatchCase":"Match &amp;Case","MatchWholeWord":"Match &amp;Whole Word","MaximumDimensions":"Maximum 7 dimensions can be selected.","Outlining":"Out&amp;lining","PromptOnReplace":"Prompt on Replace","Replace":"&amp;Replace","ReplaceAll":"Replace &amp;All","ReplaceWith":"Replace With:","Search":"Search","SearchHiddenText":"Hidden Text","SearchUp":"Search &amp;Up","SelectionOnly":"Selection &amp;Only","ShowAutoGeneratedCode":"Show Auto Generated Code","ShowLineNumbers":"Show Line Numbers","StopOutlining":"Sto&amp;p Outlining","titleFind":"Find","titleGotoLine":"Go To Line","titleReplace":"Replace","ToggleAllOutlining":"Toggle A&amp;ll Outlining","ToggleOutliningExpansion":"&amp;Toggle Outlining Expansion","TypeToSearch":"Type to search","UseRegularExpressions":"Use &amp;Regular Expressions"},"Errors":{"ComponentIsNotRelease":"Component is not release \\"{0}\\".","ContainerIsNotValidForComponent":"Container {0} is not valid for component {1}.","DataNotFound":"Data not found.","DataNotLoaded":"No data loaded.","Error":"Error!","ErrorsList":"Errors List","FieldRequire":"Field \\"{0}\\" required filling.","FileNotFound":"File \\"{0}\\" not found.","IdentifierIsNotValid":"Identifier \'{0}\' is not valid.","ImpossibleFindDataSource":"Impossible to Find Data Source.","NameExists":"There is already an object named \'{0}\'. Objects must have unique names.","NoServices":"Services are not found in \'{0}\'","NotAssign":"Data Source is not specified.","NotCorrectFormat":"Input string was not in a correct format.","OneTableOfContentsAllowed":"Only one \'Table of Contents\' component can be used in a report at the same time!","PrimaryColumnAction":"Unable to apply this action to the primary column of the \'{0}\'.","RelationsNotFound":"Relations not found.","ReportCannotBeSaveDueToErrors":"Report cannot be saved due to errors!","ServiceNotFound":"\'{0}\' Service not found."},"ExceptionProvider":{"Assemblies":"Assemblies","ClickIgnore":"Click \'Ignore\' to delete all auto-saved files.","Exception":"Exception","ExceptionReport":"Exception Report","Framework":"Framework","General":"General","Message":"Message","Number":"Number","PleaseEnterDetailedInformation":"Please enter detailed information about events which cause this exception.","SaveToFile":"Save to File","SendErrorFailed":"Failed to deliver the error message.","SendErrorSuccess":"The error message delivered successfully.","Source":"Source","StackTrace":"Stack Trace","YouCanRestore":"You can restore unsaved changes from a backup file.","YourPreviousWorkSession":"In your previous work session, the designer terminated unexpectedly."},"Export":{"AddPageBreaks":"Add Page Breaks","AllBands":"All bands","AllowAddOrModifyTextAnnotations":"Allow Add or Modify Text Annotations","AllowCopyTextAndGraphics":"Allow Copy Text and Graphics","AllowEditable":"Allow Editable:","AllowModifyContents":"Allow Modify Contents","AllowPrintDocument":"Allow Print Document","Auto":"Auto","BandsFilter":"Bands Filter:","CancelExport":"Cancel Export","Color":"Color","Compressed":"Compressed","CompressToArchive":"Compress to Archive","ContinuousPages":"Continuous Pages","DataAndHeaders":"Data and Headers","DataAndHeadersFooters":"Data and Headers/Footers","DataOnly":"Data only","DigitalSignature":"Digital Signature","DigitalSignatureCertificateNotSelected":"Certificate is not selected","DigitalSignatureError":"Digital Signature error at step","DocumentSecurity":"Document Security","DotMatrixMode":"Dot-Matrix Mode","EmbeddedFonts":"Embedded Fonts","EmbeddedImageData":"Embedded Image Data","EnableAnimation":"Enable Animation","Encoding":"Encoding:","EncryptionError":"Encryption error at step","EscapeCodes":"Escape Codes","Exactly":"Exactly","ExceptEditableFields":"Except Editable Fields","ExportDataOnly":"Export Data Only","ExportEachPageToSheet":"Export Each Page to Sheet","Exporting":"Exporting","ExportingCalculatingCoordinates":"Calculating Coordinates","ExportingCreatingDocument":"Creating Document","ExportingFormatingObjects":"Formatting Objects","ExportingReport":"Exporting Report","ExportMode":"Export Mode:","ExportModeFrame":"Frame","ExportModeTable":"Table","ExportObjectFormatting":"Export Object Formatting","ExportPageBreaks":"Export Page Breaks","ExportRtfTextAsImage":"Export Rich Text as Image","ExportTypeBmpFile":"BMP Image...","ExportTypeCalcFile":"OpenDocument Calc File...","ExportTypeCsvFile":"CSV File...","ExportTypeDataFile":"Data File...","ExportTypeDbfFile":"dBase DBF File...","ExportTypeDifFile":"Data Interchange Format (DIF) File...","ExportTypeExcel2007File":"Microsoft Excel 2007 File...","ExportTypeExcelFile":"Microsoft Excel File...","ExportTypeExcelXmlFile":"Microsoft Excel XML File...","ExportTypeGifFile":"GIF Image...","ExportTypeHtml5File":"HTML5 File...","ExportTypeHtmlFile":"HTML File...","ExportTypeImageFile":"Image File...","ExportTypeJpegFile":"JPEG Image...","ExportTypeJsonFile":"JSON File...","ExportTypeMetafile":"Windows Metafile...","ExportTypeMhtFile":"MHT Web Archive...","ExportTypePcxFile":"PCX Image...","ExportTypePdfFile":"Adobe PDF File...","ExportTypePngFile":"PNG Image...","ExportTypePpt2007File":"Microsoft PowerPoint File...","ExportTypeRtfFile":"Rich Text File...","ExportTypeSvgFile":"Scalable Vector Graphics (SVG) File...","ExportTypeSvgzFile":"Compressed SVG (SVGZ) File...","ExportTypeSylkFile":"Symbolic Link (SYLK) File...","ExportTypeTiffFile":"TIFF Image...","ExportTypeTxtFile":"Text File...","ExportTypeWord2007File":"Microsoft Word File...","ExportTypeWriterFile":"OpenDocument Writer File...","ExportTypeXmlFile":"XML File...","ExportTypeXpsFile":"Microsoft XPS File...","GetCertificateFromCryptoUI":"Get Certificate from Crypto UI","ImageCompressionMethod":"Image Compression Method:","ImageCutEdges":"Cut Edges","ImageFormat":"Image Format:","ImageGrayscale":"Grayscale","ImageMonochrome":"Monochrome","ImageQuality":"Image Quality:","ImageResolution":"Image Resolution:","ImageResolutionMode":"Image Resolution Mode:","ImageType":"Image Type","labelEncryptionKeyLength":"Encryption Key Length:","labelOwnerPassword":"Owner Password:","labelSubjectNameString":"Subject Name String:","labelUserPassword":"User Password:","MonochromeDitheringType":"Monochrome Dithering Type:","MoreSettings":"More Settings","MultipleFiles":"Multiple Files","NoMoreThan":"No More Than","OpenAfterExport":"Open After Export","PdfACompliance":"PDF/A Compliance","PrintingReport":"Printing Report","RemoveEmptySpaceAtBottom":"Remove Empty Space at Bottom of Page","RestrictEditing":"Restrict Editing:","Scale":"Scale:","Separator":"Separator:","Settings":"Settings","SkipColumnHeaders":"Skip Column Headers","StandardPDFFonts":"Standard PDF Fonts","TiffCompressionScheme":"TIFF Compression Scheme:","title":"Export Settings","TxtBorderType":"Border Type","TxtBorderTypeDouble":"Unicode-Double","TxtBorderTypeSimple":"Simple","TxtBorderTypeSingle":"Unicode-Single","TxtCutLongLines":"Cut Long Lines","TxtDrawBorder":"Draw Border","TxtKillSpaceGraphLines":"Kill Space Graph Lines","TxtKillSpaceLines":"Kill Space Lines","TxtPutFeedPageCode":"Put Feed Page Code","Type":"Type:","UseDefaultSystemEncoding":"Use Default System Encoding","UseDigitalSignature":"Use Digital Signature","UseEscapeCodes":"Use Escape Codes","UseOnePageHeaderAndFooter":"Use One Page Header and Footer","UsePageHeadersAndFooters":"Use Page Headers and Footers","UseUnicode":"Use Unicode","X":"X:","Y":"Y:","Zoom":"Zoom:"},"FileFilters":{"AllFiles":"All Files","AllImageFiles":"All Image Files","BitmapFiles":"Bitmap Files","BmpFiles":"BMP Images (*.bmp)|*.bmp","CalcFiles":"OpenDocument Calc Files (*.ods)|*.ods","CsvFiles":"CSV Files (*.csv)|*.csv","DashboardTemplates":"Dashboard Templates (*.sbi)|*.sbi","DataSetXmlData":"DataSet XML Data (*.xml)|*.xml","DataSetXmlSchema":"DataSet XML Schema (*.xsd)|*.xsd","DbfFiles":"DBF Files (*.dbf)|*.dbf","DictionaryFiles":"Report Dictionaries (*.dct)|*.dct","DifFiles":"DIF Files (*.dif)|*.dif","DllFiles":"DLL Files (*.dll)|*.dll","DocumentFiles":"Report Documents (*.mdc)|*.mdc","EmfFiles":"Metafiles (*.emf)|*.emf","EncryptedDocumentFiles":"Encrypted Report Documents (*.mdx)|*.mdx","EncryptedReportFiles":"Encrypted Report Templates (*.mrx)|*.mrx","Excel2007Files":"Microsoft Excel files (*.xlsx)|*.xlsx","ExcelAllFiles":"Microsoft Excel files (*.xlsx;*.xls)|*.xlsx;*.xls","ExcelFiles":"Microsoft Excel 97-2003 files (*.xls)|*.xls","ExcelXmlFiles":"Microsoft Excel XML files (*.xml)|*.xml","ExeFiles":"EXE Files (*.exe)|*.exe","GifFiles":"GIF Image (*.gif)|*.gif","HtmlFiles":"HTML Files (*.html)|*.html","InheritedLanguageFiles":"{0} Classes for Inherited Reports (*.{1})|*.{2}","JpegFiles":"JPEG image (*.jpg;*.jpeg)|*.jpg;*.jpeg","JsonDocumentFiles":"JSON Report Documents (*.mdc)|*.mdc","JsonFiles":"JSON Files (*.json)|*.json","JsonReportFiles":"JSON Report Templates (*.mrt)|*.mrt","LanguageFiles":"{0} Classes (*.{1})|*.{2}","LanguageForSilverlightFiles":"{0} Classes for Silverlight Reports (*.{1})|*.{2}","MetaFiles":"Metafiles","MhtFiles":"MHT Web Archives (*.mht)|*.mht","PackedDocumentFiles":"Packed Report Documents (*.mdz)|*.mdz","PackedReportFiles":"Packed Report Templates (*.mrz)|*.mrz","PageFiles":"Report Pages (*.pg)|*.pg","PcxFiles":"PCX Images (*.pcx)|*.pcx","PdfFiles":"Adobe PDF Files (*.pdf)|*.pdf","PngFiles":"PNG Images (*.png)|*.png","Ppt2007Files":"Microsoft PowerPoint 2007/2013 Files (*.pptx)|*.pptx","ReportEmbededDataFiles":"Report Templates with Embedded Data (*.mrt)|*.mrt","ReportFiles":"Report Templates (*.mrt)|*.mrt","RtfFiles":"Rich Text (*.rtf)|*.rtf","StandaloneReportFiles":"Standalone Reports (*.exe)|*.exe","StylesFiles":"Report Styles (*.sts)|*.sts","SvgFiles":"SVG Images (*.svg)|*.svg","SvgzFiles":"Compressed SVG Images (*.svgz)|*.svgz","SylkFiles":"SYLK Files (*.slk)|*.slk","TiffFiles":"TIFF Images (*.tiff)|*.tiff","TxtFiles":"Plain Text Files (*.txt)|*.txt","Word2007Files":"Microsoft Word 2007-2016 Files (*.docx)|*.docx","WordFiles":"Microsoft Word 97-2003 Files (*.doc)|*.doc","WriterFiles":"OpenDocument Writer Files (*.odt)|*.odt","XmlFiles":"XML Files (*.xml)|*.xml","XpsFiles":"Microsoft XPS Files (*.xps)|*.xps","ZipArchives":"ZIP Archives (*.zip)|*.zip"},"Formats":{"custom01":"d","custom02":"D","custom03":"f","custom04":"F","custom05":"yy/MM/dd","custom06":"yyyy/MM/dd","custom07":"G","custom08":"$0.00","custom09":"$0","custom10":"c","custom11":"c1","custom12":"c2","custom13":"#.00","custom14":"#.#","custom15":"n","custom16":"n1","custom17":"n2","custom18":"(###) ### - ####","date01":"*d","date02":"*D","date03":"M.dd","date04":"yy.M.dd","date05":"yy.MM.dd","date06":"MMM.dd","date07":"yy.MMM.dd","date08":"yyyy, MMMM","date09":"*f","date10":"*F","date11":"MM.dd.yyyy","date12":"dd/MM/yyyy","date13":"*g","date14":"*G","date15":"*y","date16":"*m","date17":"s","date18":"u","date19":"*Q","date20":"*YQ","date21":"QI","date22":"YQI","time01":"*t","time02":"*T","time03":"HH:mm","time04":"H:mm","time06":"HH:mm:ss"},"FormBand":{"AddFilter":"&amp;Add Filter","AddGroup":"&amp;Add Group","AddResult":"&amp;Add Result","AddSort":"&amp;Add Sort","And":"and","Ascending":"Ascending","Descending":"Descending","NoFilters":"No Filters","NoSort":"No Sorting","RemoveFilter":"&amp;Remove Filter","RemoveGroup":"&amp;Remove Group","RemoveResult":"&amp;Remove Result","RemoveSort":"&amp;Remove Sort","SortBy":"Sort by","ThenBy":"Then by","title":"Data Setup"},"FormColorBoxPopup":{"Color":"Color","Custom":"Custom","NoColor":"No Color","Others":"Others...","System":"System","Web":"Web"},"FormConditions":{"AaBbCcYyZz":"AaBbCcYyZz","AddCondition":"&amp;Add Condition","AddLevel":"Add Level","AssignExpression":"Assign Expression","BreakIfTrue":"Break if True","BreakIfTrueToolTip":"Breaks condition processing if current one is fulfilled","ChangeBorder":"Change Border...","ChangeFont":"Change Font...","ComponentIsEnabled":"Component is Enabled","NoConditions":"No Conditions","RemoveCondition":"&amp;Remove Condition","SelectStyle":"Select Style","title":"Conditions"},"FormCrossTabDesigner":{"Columns":"Columns:","DataSource":"Data Source:","Properties":"Properties:","Rows":"Rows:","Summary":"Summary:","Swap":"Swap Rows / Columns","title":"Cross-Tab Designer"},"FormDatabaseEdit":{"AccessToken":"Access token","AccountKey":"Account Key","AccountName":"Account Name","AuthorizationCode":"Authorization Code","BlobContentType":"Blob Content Type","BlobName":"Blob Name","ClientId":"Client Id","ClientSecret":"Client Secret","ConnectionString":"Connection String:","ContainerName":"Container Name","DashboardConnections":"Dashboard Connections","DatabaseSecret":"Database Secret","DatasetId":"Dataset Id","DB2Edit":"Edit IBM DB2 Connection","DB2New":"New IBM DB2 Connection","EditConnection":"Edit {0} Connection","Favorites":"Favorites","FirebirdEdit":"Edit Firebird Connection","FirebirdNew":"New Firebird Connection","FirstRowIsHeader":"First Row is Header","GetAuthorizationCode":"Get authorization code","GetTokens":"Get tokens","GisEdit":"Edit GIS Data","GisNew":"New GIS Data","ImportData":"Import Data","InformixEdit":"Edit Informix Connection","InformixNew":"New Informix Connection","InitialCatalog":"Initial Catalog:","JsonEdit":"Edit JSON Data","JsonNew":"New JSON Data","MySQLEdit":"Edit MySQL Connection","MySQLNew":"New MySQL Connection","NewConnection":"New {0} Connection","OdbcEdit":"Edit ODBC Connection","OdbcNew":"New ODBC Connection","OleDbEdit":"Edit OLE DB Connection","OleDbNew":"New OLE DB Connection","OracleEdit":"Edit Oracle Connection","OracleNew":"New Oracle Connection","OracleODPEdit":"Edit Oracle ODP.NET Connection","OracleODPNew":"New Oracle ODP.NET Connection","PathData":"Path to XML Data:","PathGisData":"Path to Gis Data:","PathJsonData":"Path to JSON Data:","PathSchema":"Path to XSD Schema:","PathToData":"Path to Data:","Pin":"Pin","PostgreSQLEdit":"Edit PostgreSQL Connection","PostgreSQLNew":"New PostgreSQL Connection","ProjectId":"Project Id","PromptUserNameAndPassword":"Prompt User Name and Password","RecentConnections":"Recent","RedirectUrl":"Redirect URL","RefreshAccessToken":"Refresh access token","RefreshToken":"Refresh token","RelationDirection":"Relation Direction:","ReportConnections":"Report Connections","SelectData":"Select Data","ServiceAccountKeyFile":"Service Account Key File","SpreadsheetId":"Spreadsheet Id","SqlCeEdit":"Edit SQLServerCE Connection","SqlCeNew":"New SQLServerCE Connection","SqlEdit":"Edit SQL Connection","SQLiteEdit":"Edit SQLite Connection","SQLiteNew":"New SQLite Connection","SqlNew":"New SQL Connection","TeradataEdit":"Edit Teradata Connection","TeradataNew":"New Teradata Connection","Token":"Token","UniDirectEdit":"Edit Uni Direct Connection","UniDirectNew":"New Uni Direct Connection","Unpin":"Unpin","UseBearerAuthentication":"Use Bearer Authentication","UseOwnClientID":"Use own \\"Client ID\\" and \\"Client Secret\\"","UseToken":"Use Token","VistaDBEdit":"Edit VistaDB Connection","VistaDBNew":"New VistaDB Connection","XmlEdit":"Edit XML Data","XmlNew":"New XML Data","XmlType":"XML Type:"},"FormDesigner":{"Code":"Code","ColumnsOne":"One","ColumnsThree":"Three","ColumnsTwo":"Two","CompilingReport":"Compiling Report","CopyPropertyName":"Copy Property Name","DockingPanels":"Panels","HtmlPreview":"HTML Preview","JsPreview":"JS Preview","labelPleaseSelectTypeOfInterface":"Please, select type of interface","LoadImage":"Load Image...","LocalizePropertyGrid":"Localize Property Grid","MarginsNarrow":"Narrow","MarginsNormal":"Normal","MarginsWide":"Wide","OrderToolbars":"Order Toolbars","Others":"Others","Pages":"Pages","Preview":"Preview","PropertyChange":"Change of property \'{0}\'","RTPreview":"WinRT Preview","SetupToolbox":"Setup Toolbox","ShowDescription":"Show Description","SLPreview":"Silverlight Preview","title":"Designer","WebPreview":"Flash Preview"},"FormDictionaryDesigner":{"Actions":"Actions","AutoSort":"Auto Sort","BusinessObjectEdit":"Edit Business Object","CalcColumnEdit":"Edit Calculated Column","CalcColumnNew":"New Calculated Column","CategoryEdit":"Edit Category","CategoryNew":"New Category","Child":"Child","ChildOfBusinessObject":"Child of Business Object","ChildSource":"Child Data Source:","ClickHere":"Click here","ColumnEdit":"Edit Column","ColumnNew":"New Column","CreateNewDataSource":"to create the new data source","CreateNewReport":"to create the new report","CsvSeparatorComma":"Comma","CsvSeparatorOther":"Other","CsvSeparatorSemicolon":"Semicolon","CsvSeparatorSpace":"Space","CsvSeparatorSystem":"System","CsvSeparatorTab":"Tab","DatabaseEdit":"Edit Database","DatabaseNew":"New Database","DataMonitor":"Data Monitor","DataParameterEdit":"Edit Parameter","DataParameterNew":"New Parameter","DataSetToBusinessObjects":"DataSet To Business Objects","DataSourceEdit":"Edit Data Source","DataSourceNew":"New Data Source","DataSourcesNew":"New Data Sources","DataTransformationEdit":"Edit Data Transformation","DataTransformationNew":"New Data Transformation","Delete":"Delete","DesignTimeQueryText":"Design-Time Query Text","DictionaryMerge":"Merge Dictionary...","DictionaryNew":"New Dictionary...","DictionaryOpen":"Open Dictionary...","DictionarySaveAs":"Save Dictionary As...","DragNewDataSource":"drag your data directly to this panel","DragNewReport":"drag your report directly to this panel","EditQuery":"Edit Query","EnableDataMonitor":"Enable Data Monitor","ExecutedSQLStatementSuccessfully":"SQL statement executed successfully","ExpressionNew":"New Expression","GetColumnsFromAssembly":"Get Columns from Assembly","HideUnsupportedDatabases":"Hide Unsupported Data Sources","ImportRelations":"Import Relations","LabelSeparator":"Separator:","MarkUsedItems":"Mark Used Items","NewBusinessObject":"New Business Object","NewItem":"New Item","OpenAssembly":"Open Assembly","Parent":"Parent","ParentSource":"Parent Source:","Queries":"Queries","QueryNew":"New Query","QueryText":"Query Text","QueryTimeout":"Query Timeout","RelationEdit":"Edit Relation","RelationNew":"New Relation","ResourceEdit":"Edit Resource","ResourceNew":"New Resource","RetrieveColumns":"Retrieve Columns","RetrieveColumnsAllowRun":"Allow Run StoredProc","RetrieveColumnsAndParameters":"Retrieve Columns and Parameters","RetrieveParameters":"Retrieve Parameters","RetrievingDatabaseInformation":"Retrieving database information...","Run":"Run","SelectTypeOfBusinessObject":"Select Type of Business Object","SkipSchemaWizard":"Skip Schema Wizard","SortItems":"Sort Items","Synchronize":"Synchronize","SynchronizeHint":"Synchronizes contents of the Data Store and contents of the Dictionary","TextDropDataFileHere":"Drop Data File Here","TextDropFileHere":"Drop File Here","TextDropImageHere":"Drop Image File Here","title":"Dictionary Designer","ValueNew":"New Value","VariableEdit":"Edit Variable","VariableNew":"New Variable","ViewData":"View Data","ViewQuery":"View Query"},"FormFormatEditor":{"Boolean":"Boolean","BooleanDisplay":"Display:","BooleanValue":"Value:","Currency":"Currency","CurrencySymbol":"Currency Symbol:","Custom":"Custom","Date":"Date","DateTimeFormat":"Date Time Format","DecimalDigits":"Decimal Digits:","DecimalSeparator":"Decimal Separator:","FormatMask":"Format Mask:","Formats":"Formats","General":"General","GroupSeparator":"Group Separator:","GroupSize":"Group Size:","nameFalse":"False","nameNo":"No","nameOff":"Off","nameOn":"On","nameTrue":"True","nameYes":"Yes","NegativeInRed":"Negative in Red","NegativePattern":"Negative Pattern:","Number":"Number","Percentage":"Percentage","PercentageSymbol":"Percentage Symbol:","PositivePattern":"Positive Pattern:","Properties":"Properties","Sample":"Sample","SampleText":"Sample Text","TextFormat":"Text Format","Time":"Time","title":"Format","UseAbbreviation":"Use Abbreviation","UseGroupSeparator":"Use Group Separator","UseLocalSetting":"Use Local Setting"},"FormGlobalizationEditor":{"AddCulture":"&amp;Add Culture","AutoLocalizeReportOnRun":"Auto Localize Report on Run","CreateNewCulture":"to create the new culture","GetCulture":"Get Culture Settings from Report","qnGetCulture":"Do you really want to get culture settings from report and override current culture settings?","qnSetCulture":"Do you really want to set culture settings to report components?","RemoveCulture":"&amp;Remove Culture","SetCulture":"Set Culture Settings to Report","title":"Globalization Editor"},"FormInteraction":{"HyperlinkExternalDocuments":"Hyperlink to External Document","HyperlinkUsingInteractionBookmark":"Hyperlink using Bookmark","HyperlinkUsingInteractionTag":"Hyperlink using Tag"},"FormOptions":{"AutoSave":"Auto Save","AutoSaveReportToReportClass":"Auto Save Report to C# or VB.NET File","BlankDashboard":"Blank Dashboard","BlankForm":"Blank Form","BlankReport":"Blank Report","BlankScreen":"Blank Screen","Default":"Default","DefaultScriptMode":"Default Script Mode","Drawing":"Drawing","DrawMarkersWhenMoving":"Draw Markers When Moving","EditAfterInsert":"Edit After Insert","EnableAutoSaveMode":"Enable Auto Save Mode","FillBands":"Fill Bands","FillComponents":"Fill Components","FillContainers":"Fill Containers","FillCrossBands":"Fill Cross Bands","GenerateLocalizedName":"Generate Localized Name","Grid":"Grid","GridDots":"Dots","GridLines":"Lines","GridMode":"Grid Mode","GridSize":"Grid Size","groupAutoSaveOptions":"Auto save options","groupColorScheme":"Please select color scheme of GUI","groupGridDrawingOptions":"Grid drawing options","groupGridOptions":"Grid options","groupGridSize":"Grid size","groupMainOptions":"Main options for working with designer","groupMarkersStyle":"Marker style","groupOptionsOfQuickInfo":"Options of Quick Info","groupPleaseSelectTypeOfGui":"Please, select the type of GUI","groupReportDisplayOptions":"Report display options","labelColorScheme":"Color Scheme:","labelInfoAutoSave":"Change parameters of reports autosaving","labelInfoDrawing":"Setting parameters of report drawing","labelInfoGrid":"How Grid is shown and used in a report","labelInfoGui":"Select the mode of using GUI in the report designer","labelInfoMain":"Setting basic parameters of the report designer","labelInfoQuickInfo":"Components Quick Info on a page","Main":"Main","MarkersStyle":"Markers Style","MarkersStyleCorners":"Corners","MarkersStyleDashedRectangle":"Dashed Rectangle","MarkersStyleNone":"None","MessageLeftRightNotValid":"Left and Right value is not a valid.","MessageTopBottomNotValid":"Top and Bottom value is not a valid.","Minutes":"{0} minutes","SaveReportEvery":"Save Report Every:","ScaleMode":"Scale Mode","SelectUILanguage":"Select UI Language","ShowDialogForms":"Show Dialog Forms","ShowDimensionLines":"Show Dimension Lines","ShowOldGaugeEditor":"Show Old Gauge Editor","StartScreen":"Start Screen","title":"Options","UseComponentColor":"Use Component Color for Filling","UseLastFormat":"Use Last Format","Welcome":"Welcome"},"FormPageSetup":{"ApplyTo":"Apply to","Bottom":"Bottom:","Columns":"Columns","groupColumns":"Page columns","groupImage":"Watermark image","groupMargins":"Page margins","groupOrientation":"Paper orientation","groupPaper":"Paper size","groupPaperSource":"Paper source","groupText":"Watermark text","Height":"Height:","labelAngle":"Angle:","labelColumnGaps":"Column Gaps:","labelColumnWidth":"Column Width:","labelImageAlignment":"Image Alignment:","labelImageTransparency":"Image Transparency:","labelInfoColumns":"Setting page columns","labelInfoPaper":"Setting size and orientation for the current page","labelInfoUnit":"Page margins are specified in the current units","labelInfoWatermark":"Setting parameters for showing watermark","labelMultipleFactor":"Multiple Factor:","labelPaperSourceOfFirstPage":"Paper Source of First Page:","labelPaperSourceOfOtherPages":"Paper Source of Other Pages:","labelSelectBrush":"Select Brush:","labelSelectColor":"Select Color:","labelSelectFont":"Select Font:","labelSelectImage":"Select Image:","labelText":"Text:","Left":"Left:","Margins":"Margins","NumberOfColumns":"Number of Columns:","Orientation":"Orientation","PageOrientationLandscape":"Landscape","PageOrientationPortrait":"Portrait","Paper":"Paper:","RebuildReport":"Rebuild Report","Right":"Right:","ScaleContent":"Scale Content","Size":"Size:","title":"Page Setup","Top":"Top:","Width":"Width:"},"FormReportSetup":{"groupDates":"A date of report creation and a date of the last report change","groupDescription":"Report description","groupMainParameters":"Parameters which effect on report rendering","groupNames":"Report name, report alias, and report author","groupScript":"Script language of your report","groupUnits":"Size and coordinates in a report will be in specified units","labelInfoDescription":"Indicate the information of a report","labelInfoMain":"Change of basic report parameters","labelNumberOfPass":"Number of Pass:","labelReportCacheMode":"Report Cache Mode:","ReportChanged":"Report Changed:","ReportCreated":"Report Created:","title":"Report Options"},"FormRichTextEditor":{"Bullets":"Bullets","FontName":"Font Name","FontSize":"Font Size","Insert":"Insert Expression","title":"Rich Text Editor"},"FormStyleDesigner":{"Add":"Add Style","AddCollectionName":"Add Collection Name","ApplyStyleCollectionToReportComponents":"Apply Style Collection to Report Components","ApplyStyles":"Apply Styles","ColorCollectionEditor":"Color Collection Editor","CreateNewComponentStyle":"to create the new component style","CreateStyleCollection":"Create Style Collection","CreateStyleOnBase":"Create a style based on another style","Duplicate":"Duplicate Style","EditColors":"Edit Colors","FromStyle":"From Style","GetStyle":"Get Style from Selected Components","MoreStyles":"More Styles","NotSpecified":"Not Specified","Open":"Open Style","Predefined":"Predefined","qnApplyStyleCollection":"Do you want to apply style collection to report components?","Remove":"Remove Style","RemoveExistingStyles":"Remove Existing Styles","Save":"Save Style","Style":"Style","StyleCollectionsNotFound":"Style Collections Not Found!","title":"Style Designer"},"FormSystemTextEditor":{"Condition":"Condition","LabelDataBand":"Data Band:","LabelDataColumn":"Data Column:","LabelShowInsteadNullValues":"Show Instead Null Values:","LabelSummaryFunction":"Summary Function:","pageExpression":"Expression","pageSummary":"Summary","pageSystemVariable":"System Variable","RunningTotal":"Running Total","SummaryRunning":"Summary Running","SummaryRunningByColumn":"Column","SummaryRunningByPage":"Page","SummaryRunningByReport":"Report"},"FormTitles":{"ChartWizardForm":"Chart Wizard","ConditionEditorForm":"Condition","ConnectionSelectForm":"Select Type of Connection","ContainerSelectForm":"Select Container","DataAdapterServiceSelectForm":"Select Type of Data","DataRelationSelectForm":"Select Data Relation","DataSetName":"Enter DataSet Name","DataSourceSelectForm":"Select Data Source","DataSourcesNewForm":"New Data Sources","DataStoreViewerForm":"Data Store Viewer","DesignerApplication":"Report Designer","EventEditorForm":"Event Editor","ExpressionEditorForm":"Expression Editor","GroupConditionForm":"Group","InteractionDrillDownPageSelectForm":"Select Drill-Down Page","MasterComponentSelectForm":"Select Master Component","PageAddForm":"Add Page","PageSizeForm":"Page Size","PagesManagerForm":"Pages Manager","PromptForm":"Enter information to logon on to the database","ReportWizard":"Report Wizard","ServiceSelectForm":"Select Service","SqlExpressionsForm":"SQL Expressions","SubReportPageSelectForm":"Select Sub-Report Page","TextEditorForm":"Text Editor","ViewDataForm":"View Data","ViewerApplication":"Report Viewer"},"FormViewer":{"Bookmarks":"Bookmarks","Close":"Close","CollapseAll":"Collapse All","CompressedDocumentFile":"Compressed Document File","ContextMenu":"Context Menu","DocumentFile":"Document File...","Editor":"Editor","EncryptedDocumentFile":"Encrypted Document File","ExpandAll":"Expand All","Export":"Export...","Find":"Find","FirstPage":"First Page","FullScreen":"Full Screen","GoToPage":"Go To Page","HorScrollBar":"Horizontal Scroll Bar","LabelPageN":"Page:","LastPage":"Last Page","NextPage":"Next Page","Open":"Open...","PageControl":"Page Control","PageDelete":"Delete Page","PageDesign":"Edit Page...","PageNew":"New Page","PageNofM":"Page {0} of {1}","PageofM":"of {0}","PageSize":"Page Size...","PageViewModeContinuous":"Continuous","PageViewModeMultiplePages":"Multiple Pages","PageViewModeSinglePage":"Single Page","Parameters":"Parameters","PrevPage":"Previous Page","Print":"Print...","qnPageDelete":"Do you want to delete page?","Save":"Save...","SendEMail":"Send Email...","StatusBar":"Status Bar","Thumbnails":"Thumbnails","title":"Viewer","titlePageSettings":"Page Settings","Toolbar":"Tool bar","VerScrollBar":"Vertical Scroll Bar","ViewMode":"View Mode","Zoom":"Zoom","ZoomMultiplePages":"Multiple Pages","ZoomOnePage":"One Page","ZoomPageWidth":"Page Width","ZoomTwoPages":"Two Pages","ZoomXXPages":"{0} X {1} Pages","ZoomXXPagesCancel":"Cancel"},"FormViewerFind":{"Close":"Close","FindNext":"Find Next","FindPrevious":"Find Previous","FindWhat":"Find What:"},"Gauge":{"AddNewItem":"Add New Item","BarRangeList":"Bar Range List","GaugeEditorForm":"Gauge Editor","Kind":"Kind","LinearBar":"Linear Bar","LinearMarker":"Linear Marker","LinearRange":"Linear Range","LinearRangeList":"Linear Range List","LinearScale":"Linear Scale","LinearTickLabelCustom":"Linear Tick Label Custom","LinearTickLabelMajor":"Linear Tick Label Major","LinearTickLabelMinor":"Linear Tick Label Minor","LinearTickMarkCustom":"Linear Tick Mark Custom","LinearTickMarkMajor":"Linear Tick Mark Major","LinearTickMarkMinor":"Linear Tick Mark Minor","Needle":"Needle","RadialBar":"Radial Bar","RadialMarker":"Radial Marker","RadialRange":"Radial Range","RadialRangeList":"Radial Range List","RadialScale":"Radial Scale","RadialTickLabelCustom":"Radial Tick Label Custom","RadialTickLabelMajor":"Radial Tick Label Major","RadialTickLabelMinor":"Radial Tick Label Minor","RadialTickMarkCustom":"Radial Tick Mark Custom","RadialTickMarkMajor":"Radial Tick Mark Major","RadialTickMarkMinor":"Radial Tick Mark Minor","StateIndicator":"State Indicator","StateIndicatorFilter":"State Indicator Filter","TickCustomValue":"Tick Custom Value"},"Gui":{"barname_cancel":"Cancel","barname_caption":"New Toolbar","barname_msginvalidname":"Toolbar name cannot be empty.","barname_name":"&amp;Toolbar Name:","barname_ok":"OK","barrename_caption":"Rename Toolbar","barsys_autohide_tooltip":"Auto-Hide","barsys_close_tooltip":"Close","barsys_customize_tooltip":"Customize","ClickAndDragPickColor":"Click and Drag to pick color","colorpicker_morecolors":"&amp;More Colors...","colorpicker_nofill":"&amp;No Fill","colorpicker_standardcolorslabel":"Standard Colors","colorpicker_themecolorslabel":"Theme Colors","colorpickerdialog_alphalabel":"&amp;Alpha:","colorpickerdialog_bluelabel":"&amp;Blue:","colorpickerdialog_cancelbutton":"Cancel","colorpickerdialog_caption":"Colors","colorpickerdialog_colormodellabel":"Color Model:","colorpickerdialog_currentcolorlabel":"Current","colorpickerdialog_customcolorslabel":"Colors:","colorpickerdialog_greenlabel":"&amp;Green:","colorpickerdialog_newcolorlabel":"New","colorpickerdialog_okbutton":"OK","colorpickerdialog_redlabel":"&amp;Red:","colorpickerdialog_rgblabel":"RGB","colorpickerdialog_standardcolorslabel":"Colors:","colorpickerdialog_tabcustom":"Custom","colorpickerdialog_tabstandard":"Standard","cust_btn_close":"Close","cust_btn_delete":"Delete","cust_btn_keyboard":"&amp;Keyboard...","cust_btn_new":"&amp;New...","cust_btn_rename":"&amp;Rename...","cust_btn_reset":"&amp;Reset...","cust_btn_resetusage":"&amp;Reset my usage data","cust_caption":"Customize","cust_cbo_fade":"Fade","cust_cbo_none":"(None)","cust_cbo_random":"Random","cust_cbo_slide":"Slide","cust_cbo_system":"System Default","cust_cbo_unfold":"Unfold","cust_chk_delay":"Show full menus after a short delay","cust_chk_fullmenus":"Always show full menus","cust_chk_showsk":"Show &amp;Shortcut Keys in ScreenTips","cust_chk_showst":"Show Screen&amp;Tips on Toolbars","cust_lbl_cats":"Cate&amp;gories:","cust_lbl_cmds":"Comman&amp;ds:","cust_lbl_cmdsins":"To add a command to Bar select the category and drag the command out of this box to a Bar.","cust_lbl_menuan":"Menu Animation:","cust_lbl_other":"Other:","cust_lbl_pmt":"Personalized Menus and Toolbars","cust_lbl_tlbs":"Toolb&amp;ars:","cust_mnu_addremove":"&amp;Add or Remove Buttons","cust_mnu_cust":"Customize...","cust_mnu_reset":"Reset Bar","cust_mnu_tooltip":"Bar Options","cust_msg_delete":"Are you sure you want to delete the &lt;barname&gt; toolbar?","cust_pm_begingroup":"Begin Group","cust_pm_delete":"Delete","cust_pm_name":"Name:","cust_pm_reset":"Reset","cust_pm_stydef":"Default Style","cust_pm_styimagetext":"Image and Text (Always)","cust_pm_stytextonly":"Text Only (Always)","cust_tab_commands":"Commands","cust_tab_options":"Options","cust_tab_toolbar_alignment":"Toolbar Alignment","cust_tab_toolbars":"Toolbars","mdisysmenu_close":"Close","mdisysmenu_maximize":"Maximize","mdisysmenu_minimize":"Minimize","mdisysmenu_move":"Move","mdisysmenu_next":"Next","mdisysmenu_restore":"Restore","mdisysmenu_size":"Size","mdisystt_close":"Close","mdisystt_minimize":"Minimize","mdisystt_restore":"Restore","monthcalendar_clearbutton":"Clear","monthcalendar_todaybutton":"Today","navbar_navpaneoptions":"Na&amp;vigation Pane Options...","navbar_showfewerbuttons":"Show &amp;Fewer Buttons","navbar_showmorebuttons":"Show &amp;More Buttons","navPaneCollapseTooltip":"Collapse the Navigation Pane","navPaneExpandTooltip":"Expand the Navigation Pane","sys_custombar":"Custom Bar","sys_morebuttons":"More Buttons"},"HelpComponents":{"StiBarCode":"This component allows showing bar codes in a report. Bar code data are sent to an object as a string. The string may contain any symbols but only allowed symbols for the selected chart can be displayed.","StiButtonElement":"This component is used to execute an event script when a user is interacting.","StiCardsElement":"This component is used to display grouped data as cards.","StiChart":"This component allows showing charts in a report. Different types of charts are available. Among them are bar, line, pie, doughnut, lines, areas, Gantt, scatter charts etc. ","StiChartElement":"This element allows showing charts in a dashboard. Different types of charts are available.","StiCheckBox":"This component allows showing a checkbox in a report. It can display two modes: \\"enable\\" or \\"disable\\".","StiChildBand":"The Child band can be used to output two bands on one data row.","StiClone":"This component is used to clone parts of a report into a required part of a report. Cloning can be applied only to the panel contents.","StiColumnFooterBand":"This band is used to output footers of columns on the Data band. The Column Footer band is output once under each column. All components which are placed on this band will also be output under each column.","StiColumnHeaderBand":"This band is used to output column headers. The Column Header band is used to output only once. All components which are placed on the band can be output above each column.","StiComboBoxElement":"Represents the ComboBox that is used to either type a value directly into the control or choose from the list of existing options.","StiContainer":"This is the rectangular region where other components, including bands, can be placed. When moving the container the components in it will be moved too. The container can be placed both on a band and on a page.","StiCrossDataBand":"This band is connected to the data source. It is output as many times as there are rows in the data source. A Cross band is output from left to right.","StiCrossFooterBand":"This band is used to output footers of the Cross-Data band. The band is output once after all rows of the Data band. A Cross band is output from left to right.","StiCrossGroupFooterBand":"This band is used to output footers of a group. It is placed under the Cross-Data band. Each Cross-Footer belongs to the specified Cross-Header band. A Cross band is output from left to right.","StiCrossGroupHeaderBand":"This band is the basic one for the report rendering with grouping, when Cross-Data are used. It is impossible to create grouping without this band. The components for showing information by the group are placed on the group header. The information can be group name, date, condition of grouping etc. The band is output in the beginning of each group. A Cross band is output from left to right.","StiCrossHeaderBand":"This band is used to output headers. It is used in association with the Cross band. A Cross band is output from left to right.","StiCrossTab":"The cross-tab component is used for the structured data representation as a table.","StiDataBand":"The Data band is connected to the data source and is output as many times as there are rows in the data source.","StiDatePickerElement":"The element is used to select the date and time.","StiEmptyBand":"This band is used to fill free space on the bottom of a page. This band fills free space on each page of a report.","StiFilterCategory":"A group of elements used for selecting and filtering values.","StiFooterBand":"This band is used to output summary by the Data band. It is placed under the Data band and is output once after all data rows which Data band outputs.","StiGauge":"The component allows you to display a value within a predefined range. It can have different graphical representation.","StiGaugeElement":"The element allows you to display a value within a predefined range. It can have different graphical representation.","StiGroupFooterBand":"The Group Footer band is used to output the group footer. This band is placed after the Data band. And this is the Data band with what the Group Header band is bound. Each Group Footer band belongs to the specified Group Header band. The Group Footer band will not be output without the Group Header band.","StiGroupHeaderBand":"This band is the basic band for rendering reports with grouping. The components for showing information by this group are placed on the group header. It can be group name, date, condition of grouping etc. This band is output once in the beginning of each group.","StiHeaderBand":"This band is used to output headers. It is used together with the data band.","StiHierarchicalBand":"This band is connected to the data source and output as many times as there are rows in the data source. Data are output as a tree.","StiHorizontalLinePrimitive":"This component is used to output a line.","StiImage":"This component is used to output images.","StiImageElement":"This element is used to output images. It supports the following graphic formats, such as BMP, JPG, JPEG, GIF, TIFF, PNG, ICO, WMF, EMF.","StiIndicatorElement":"The element displays the difference in values between the input data.","StiListBoxElement":"The element allows selecting items from a list.","StiMap":"This component is used to display data that is geographically targeted.","StiMapCategory":"Group of elements for working with maps and data.","StiMapElement":"This element is used to display data that is geographically targeted.","StiMathFormula":"This component is used to display math formulas in a report.","StiOnlineMapElement":"This element is used to display geographic markers on the online map.","StiOverlayBand":"This band is used to output watermarks on a page.","StiPageFooterBand":"This band is used to output the information on the bottom of each page such as page numbers, dates, and other additional information.","StiPageHeaderBand":"This band is used to output the page header such as page numbers, dates, and other additional information. It is output on the top of each page.","StiPanel":"A rectangular region that can contain other components, including bands. When the panel is moved the components in it are moved too. A panel can be placed either on a band or on a page.","StiPanelElement":"A rectangular region that can contain other elements. When the panel is moved the elements in it are moved too.","StiPivotTableElement":"The pivot table element is used for the structured data representation as a table.","StiProgressElement":"The element displays the ratio of the input data. It can be presented in different modes - a pie, donut, bars.","StiRectanglePrimitive":"This component is used to output rectangles.","StiRegionMapElement":"This element is used to display data that is geographically targeted.","StiReportSummaryBand":"This band is used to output summaries through the entire report. It is output once in the end of a report.","StiReportTitleBand":"This band is used to output the report title. It is output in the beginning of a report.","StiRichText":"This component is used to output and edit the RTF text. It also supports loading and saving files in the RTF format.","StiRoundedRectanglePrimitive":"This component is used to output rounded rectangles.","StiShape":"This component is used to insert ready-made shapes, such as arrows, diagonal line down, diagonal line up, horizontal line, left and right lines, oval, rectangle, rounded rectangle, top and bottom lines, triangle, vertical line.","StiShapeElement":"This element is used to insert ready-made shapes, such as arrows, diagonal line down, diagonal line up, horizontal line, left and right lines, oval, rectangle, rounded rectangle, top and bottom lines, triangle, vertical line.","StiSignature":"This component is used to add an electronic or digital signature to a report.","StiSparkline":"This component is used to create micrographics in a report. It allows you to track dynamically changing data as bars, lines, areas.","StiSubReport":"This component is used to output additional data in different places of a report.","StiTable":"This component is a set of data elements that is organized using a model of vertical columns and horizontal rows.","StiTableElement":"This element is a set of data elements that is organized using a model of vertical columns and horizontal rows.","StiTableOfContents":"This component is used to create a table of contents in a report.","StiText":"This component is a basic object to output data as a text.","StiTextElement":"This element is a basic object to output data as a text.","StiTextInCells":"The component is used to output a text in cells. It is frequently used for creating forms.","StiTreeViewBoxElement":"The element is used to select values with a drop-down list as a tree.","StiTreeViewElement":"Represents the element that is used to show the hierarchical data as a tree.","StiVerticalLinePrimitive":"This component is used to output vertical lines.","StiWinControl":"The component allows showing visual controls from .NET Framework.","StiZipCode":"This component is used to output the ZIP code."},"HelpDesigner":{"ActiveRelation":"Sets the priority Relation to bind two tables. It is used in Data Transformation and Dashboards. Only one Relation in each Data Source can be active.","Align":"Change the location of selected components.","AlignBottom":"Align the contents of a component to bottom.","AlignCenter":"Align the contents of a component to center.","AlignComponentBottom":"Allows you to align objects horizontally along the bottom edge of selected components.","AlignComponentCenter":"Allows you to align objects horizontally along the center edge of selected components.","AlignComponentLeft":"Allows you to align objects vertically along the left edge of selected components.","AlignComponentMiddle":"Allows you to align objects vertically along the center edge of selected components.","AlignComponentRight":"Allows you to align objects vertically along the right edge of selected components.","AlignComponentTop":"Allows you to align objects horizontally along the top edge of selected components.","AlignLeft":"Align the contents of a component to left.","AlignMiddle":"Center the contents by the top and bottom borders of a component.","AlignRight":"Align contents of a component to right.","AlignToGrid":"Align the selected components to grid nodes.","AlignTop":"Align the contents of a component to top.","AlignWidth":"Justify the contents of a component.","Angle":"Rotate the contents of the component.","AngleWatermark":"The watermark text rotation angle.","Background":"Change the background of the selected components.","biConditions":"Control list of conditions of the selected components.","BorderColor":"Select the border color of the selected component.","BorderSidesAll":"Switch on all borders sides of the selected components.","BorderSidesBottom":"Switch on bottom border side of the selected components.","BorderSidesLeft":"Switch on left border side of the selected components.","BorderSidesNone":"Switch off all borders sides of the selected components.","BorderSidesRight":"Switch on right border side of the selected components.","BorderSidesTop":"Switch on top border side of the selected components.","BorderStyle":"Select the border style of the selected components.","BringToFront":"Bring the selected component to front.","CenterHorizontally":"Allows you to align a component horizontally relative to container edges in what it is placed.","CenterVertically":"Allows you to align a component vertically relative to container edges in what it is placed.","Close":"Close the Report Designer.","Columns":"Split a page into columns.","ComponentSize":"Change the size of the selected components.","CopyStyle":"Copy Style","CopyToClipboard":"Copy to Clipboard","CurrencySymbol":"Select the currency symbol.","DashboardNew":"Create a new dashboard.","DataStore":"Show data, registered in a report.","DateTimeFormat":"Select the date and time format for the selected components.","DockingPanels":"Panel settings.","DockStyleBottom":"Dock selected components to the bottom side.","DockStyleFill":"Dock selected components to all sides.","DockStyleLeft":"Dock selected components to the left side.","DockStyleNone":"Undock selected components.","DockStyleRight":"Dock selected components to the right side.","DockStyleTop":"Dock selected components to the top side.","FontGrow":"Make the text size larger.","FontName":"The text font.","FontNameWatermark":"The watermark text font.","FontShrink":"Make the text size smaller.","FontSize":"Font size.","FontSizeWatermark":"Change the font size.","FontStyleBold":"Make the text bold.","FontStyleBoldWatermark":"Make the text of the watermark bold.","FontStyleItalic":"Make the text Italic.","FontStyleItalicWatermark":"Make the watermark text Italic.","FontStyleStrikeout":"Make the text strikeout.","FontStyleUnderline":"Make the text underlined.","FontStyleUnderlineWatermark":"Make the watermark text underlined.","FormatBoolean":"This format is used to format values of the boolean type.","FormatCurrency":"Display a value as currency. It allows you to display a number with the default currency symbol.","FormatCustom":"This type is used to show values according to custom requirements. This type allows data formatting in the Format Mask.","FormatDate":"Display a value as date. The date format is based on the regional date settings.","FormatGeneral":"Display a value without specific format.","FormatNumber":"It is used for general display of numbers.","FormatPercentage":"Display a value as percentage. Numbers are multiplied by 100 to convert them to percentages.","FormatTime":"Display a value as time. The time format is based on the regional time settings.","FormNew":"Create a new dialog form.","GridMode":"Show grid in lines or dots.","ImageAlignment":"Put a watermark image on a page.","ImageTransparency":"Change the transparency of the watermark image.","Interaction":"Control an interaction of the selected components.","LineSpacing":"Choose how much space appears between lines of text or between paragraphs.","Link":"Link the component to the current container.","LoadImage":"Load watermark images from the file.","Lock":"Lock the component. The component cannot be moved and resized.","MainMenu":"Click here to see the list of possible operations with a report, including opening, closing, and previewing.","MakeHorizontalSpacingEqual":"Allows you to set equal horizontal spacing between selected components.","MakeVerticalSpacingEqual":"Allows you to set equal vertical spacing between selected components.","Margins":"Select the margins of the current page.","menuCheckIssues":"Check to find errors, warnings and get recommendations.","menuDesignerOptions":"Setup report designer options.","menuEditClearContents":"Clear the contents.","menuEditCopy":"Copy the selected components and put them on the Clipboard.","menuEditCut":"Cut the selected components from a report and put them on the Clipboard.","menuEditDelete":"Delete selected components.","menuEditPaste":"Paste the contents of the Clipboard into report.","menuFAQPage":"Go to the web page with frequently asked questions.","menuGlobalizationStrings":"Call the Globalization Strings editor of the current report.","menuHelpAboutProgramm":"Get information about the version of report generator and the version of .NET Framework.","menuHomePage":"Go to the Home page of the product.","menuPageOptions":"Setup the basic parameters of the current page. All page options can be changed using the Property panel.","menuPagesManager":"Run the Pages Manager. It allows moving pages, deleting pages, and creating new pages.","menuPreviewSettings":"Call the Preview Settings editor of the current report. Settings will be applied only when viewing the current report.","menuPrint":"Select a printer, number of copies, and other printing options before printing.","menuPrintPreview":"Preview a report before printing.","menuPrintQuick":"Print a report directly to the default printer. The printing dialog is not displayed.","menuReportOptions":"Setup the basic report options. All options can be changed using the Property panel.","menuStyleDesigner":"Call the Style Designer of the current report.","menuSupport":"Go to the support page to ask a question.","menuViewAlignToGrid":"Align components to grid.","menuViewNormal":"Normal view of a page.","menuViewPageBreakPreview":"The mode of showing a page with borders of segments.","menuViewQuickInfo":"Show quick information of components: component name, alias, contents, events etc.","menuViewShowGrid":"Turn on grid lines to which you can align objects in a report.","menuViewShowHeaders":"Show headers of bands.","menuViewShowOrder":"Show order of components on a page.","menuViewShowRulers":"View the rulers, used to measure and line up objects on a page.","MoveBackward":"Move a component to one level higher in order of placing components on a page.","MoveForward":"Move a component to one level lower in order of placing components on a page.","Orientation":"Switch the pages between portrait and landscape layouts.","PageDelete":"Delete current page from a report.","PageNew":"Create a new page.","PageSetup":"Show the Page Setup dialog box.","PageSize":"Choose the paper size for the current page of a report.","PagesManager":"Run the Pages Manager.","PressF1":"Press F1 for More Details","Redo":"Redo the previously canceled change in a report.","ReportNew":"Create a new report.","ReportOpen":"Open a report in the designer.","ReportPreview":"Preview an edited report in the viewer.","ReportSave":"Save currently edited report.","SelectAll":"Select all components on the current page.","SelectUILanguage":"Select the UI language.","SendToBack":"Move the selected component to back relative to other components.","ServicesConfigurator":"Run the Services Configurator.","Shadow":"Show the shadow of a component.","ShowBehind":"Show the watermark text behind the components.","ShowImageBehind":"Put the watermark image behind all components on a page.","ShowToolbox":"Show the toolbox.","StimulsoftHelp":"Stimulsoft Help","StyleDesigner":"Run Style Designer.","TellMeMore":"Tell me more","Text":"Watermark text.","TextBrush":"Change the text color.","TextBrushWatermark":"Change the text color of the watermark.","TextColor":"Change the text color.","TextFormat":"Select the format of values.","ToolbarStyle":"Set selected style to all selected components.","Undo":"Undo the latest change in a report.","WordWrap":"Wrap the text of a component.","Zoom":"Specify the zoom level of the report."},"HelpDialogs":{"StiButtonControl":"Represents the Button control.","StiCheckBoxControl":"Represents the Flag control.","StiCheckedListBoxControl":"Shows the List object, in what a flag on the left is shown for each elements.","StiComboBoxControl":"Represents the ComboBox that is used to either type a value directly into the control or choose from the list of existing options.","StiDateTimePickerControl":"Represents the control that allows selecting the date and time. It also allows you to output the date and time in specified format.","StiGridControl":"Represents the Grid control that consist of rows and columns.","StiGroupBoxControl":"Represents the control that creates a container with borders and a header for the UI content.","StiLabelControl":"A label is an user interface control which displays text on a form. It is usually a static control having no interactivity.","StiListBoxControl":"Contains the list of elements for selection.","StiListViewControl":"Represents the ListView control that shows the list of data elements.","StiLookUpBoxControl":"Contains the list of elements for selection.","StiNumericUpDownControl":"Represents the control that shows numeric values.","StiPanelControl":"The Panel elements are used for placing and arrangement objects.","StiPictureBoxControl":"Represents the control for showing an image.","StiRadioButtonControl":"Represents the Radio button control that allows the user to choose only one of a predefined set of options. ","StiRichTextBoxControl":"Represents the RichText control with widen editing.","StiTextBoxControl":"Represents the Text control that is used for showing or editing a text.","StiTreeViewControl":"Represents the control that is used to show the hierachical data as a tree."},"HelpViewer":{"AddPageBreaks":"Visual separator of report pages.","AllowAddOrModifyTextAnnotations":"Limited access to work with annotations in the document.","AllowCopyTextAndGraphics":"Limited access to copying information.","AllowEditable":"Allows changing components with the Editable property enabled.","AllowModifyContents":"Limited access to the text editing.","AllowPrintDocument":"Limited access to the print operation.","Bookmarks":"Show the bookmark panel that is used for quick navigation to jump directly to a bookmarked location.","BorderType":"The border type of components: simple - drawing borders of components with characters +, -, |; Unicode single - drawing the borders with single box-drawing characters, Unicode double - drawing the borders with double box-drawing characters.","Close":"Close the Report Preview.","CloseDotMatrix":"Close the Dot Matrix Viewer.","Compressed":"Compression of the ready document. It is recommended to always include file compression.","CompressToArchive":"Pack all files and folders in the zip archive.","ContinuousPages":"The mode of placing report pages as a vertical strip.","CurrentPage":"Processing the current page. If this option is selected, then a selected report page will be processed.","CutEdges":"Trim the borders of report pages.","CutLongLines":"Trim the long lines (text lines) by the borders of components.","DigitalSignature":"The digital signature of the file.","DitheringType":"Dithering type: None - no dithering, Ordered, FloydSt. - with dithering.","DotMatrixMode":"This mode allows you to see how will a report look like if to print it on a dot matrix printer.","DrawBorder":"Drawing the borders of components with graphic characters.","Edit":"Edit components.","EmbeddedFonts":"Embed the font files into a PDF file.","EmbeddedImageData":"Embed images directly into the HTML file.","Encoding":"Encoding the report text after export.","EncodingData":"Encoding data file.","EncryptionKeyLength":"The length of the encryption key. The longer the length is, the more difficult it is to decrypt the document, and, accordingly, the document security is on higher priority.","ExportDataOnly":"Export only Data bands (the Table component, Hierachical band).","ExportEachPageToSheet":"Export each report page in a separate Excel sheet.","ExportMode":"Apply a filter condition when exporting. Data Only - only data bands (Table component, Hierarchical Band) will be exported. Data and Headers/Footers - data bands (Table component, Hierarchical Band) and their headers/footers will be exported. All Bands - All the report bands will be exported.","ExportModeHtml":"The way of the HTML page markup.","ExportModeRtf":"Presentation of the report data after export. The Table - the report will look like a table, where each report component is a table cell. Frame - each component will look like a single frame, but without any relationship between them.","ExportObjectFormatting":"Apply formatting to export data from Data bands (Table component, Hierachical band).","ExportPageBreaks":"Show the borders of the report pages on the Excel sheet.","ExportRtfTextAsImage":"Convert the RTF text into the image. If the option is enabled, then, when exporting, RichText decomposes into simpler primitives supported by the PDF format. RichText with complex formatting (embedded images, tables) cannot always be converted correctly. In this case it is recommended to enable this option.","Find":"Find a text in the report.","FullScreen":"Full screen reading.","GetCertificateFromCryptoUI":"Using the interface of the system cryptography library.","ImageCompressionMethod":"The compression method: JPEG - this may cause loss of quality, Flate – no quality loss, Simple, Ordered, FloydSt. - images are output in monochrome.","ImageFormat":"The image format in the finished file.","ImageQuality":"Allows you to choose the ratio of the image quality/size of the file. The higher the quality is, the larger is the size of the finished file.","ImageQualityPdf":"The option is available only in JPEG compression, and allows you to select the ratio of the image quality/size of the file. The higher the quality is, the larger is the size of the finished file.","ImageResolution":"The number of pixels per inch. The higher the number of pixels is, the better is the quality of the image. The size of the finished file is much larger.","ImageType":"The color scheme of the image: color - image after exporting will fully match the image in the viewer; gray – an image after exporting will be of the gray shade; monochrome - the images will be strictly black and white. At the same time, it should be considered that the monochrome has three modes None, Ordered, FloydSt.","KillSpaceLines":"Remove blank lines (rows) in the document.","MultipleFiles":"Each report page can be a separate file.","Open":"Open the previously saved report in the window of preview.","OpenAfterExport":"Automatic opening of the created document (after export) by the program set for these file types.","OwnerPassword":"The password to access operations with files.","PageAll":"Processing of all report pages.","PageDelete":"Delete the selected report page.","PageDesign":"Edit the selected page in the report designer.","PageFirst":"Go to the first report page.","PageGoTo":"Go to the specified report page.","PageLast":"Go to the last report page.","PageNew":"Add a new page to a report.","PageNext":"Go to the next report page.","PagePrevious":"Go to the previous report page.","PageSize":"Change the page parameters in a report.","Parameters":"Showing parameters panel which is used when report rendering.","PdfACompliance":"Support for the standard of the long-term archiving and storing of electronic documents.","Print":"Print a report.","PutFeedPageCode":"Feed pages in the final document with a special character.","RangePages":"The page numbers to be processed. You can specify a single page, a list of pages (using a comma as the separator), as well as specify the range by setting the start page of the range separated by \\"-\\" and the end page of the range. For example: 1,3,5-12.","RemoveEmptySpaceAtBottom":"Minimize the empty space at the bottom of the page.","Resources":"Showing resources panel","RestrictEditing":"Limits on changes in a Word document.","Save":"Save a report for further using.","ScaleHtml":"The size (scale) of report pages and items after the export.","ScaleImage":"The size (scale) of the report after exporting. The lower scale is, the greater is the number of pixels per inch, and vice versa.","SendEMail":"Send a report via Email.","Separator":"Separator between the data in the CSV file.","SkipColumnHeaders":"Enable/disable the column headers.","StandardPdfFonts":"14 standard Adobe fonts. If this option is enabled, then only standard 14 fonts will be used in the PDF file. All report fonts are converted into them.","SubjectNameString":"Certificate identifier. The identifier is the name of the certificate owner (full line) or a part of the name (substring).","Thumbnails":"Show the thumbnails that can be used for quick navigation to find the section of the report that you want to jump to.","TiffCompressionScheme":"Compression scheme for TIFF files.","ToolEditor":"This tool allows you to edit contents of text components directly in the report viewer.","TypeExport":"The file the report will be converted into.","UseDefaultSystemEncoding":"Use system coding by default or specify the encoding by standard.","UseOnePageHeaderAndFooter":"Define the page bands Header and Footer as the header and footer of the Microsoft Word document.","UsePageHeadersAndFooters":"Define the bands Page Header and Footer as the header and footer of the document in Microsoft Word.","UserPassword":"The password required to open the document.","UseUnicode":"Extended support for encoding characters. It affects on the internal character encoding within the PDF file, and improves the copying of the text from the PDF file.","ViewModeContinuous":"Show all report pages as a vertical ribbon.","ViewModeMultiplePages":"Zoom the report so that as many pages as can be fit in window are displayed.","ViewModeSinglePage":"Show a single page in the window of preview.","ZoomMultiplePages":"Zoom the report so that the selected pages fit in the window.","ZoomOnePage":"Zoom the report so that an entire page fits in the window.","ZoomPageWidth":"Zoom the report so that the width of the page matches the width of the window.","ZoomTwoPages":"Zoom the report so that two pages fit in the window.","ZoomTxt":"The report size (scale): X - change the horizontal scale, Y - to change the vertical scale."},"Interface":{"Mouse":"Mouse","MouseDescription":"Optimized for used with mouse","Touch":"Touch","TouchDescription":"Optimized for used with touch"},"MainMenu":{"menuCheckIssues":"Check for Issues","menuContextClone":"Clone...","menuContextDesign":"Design...","menuContextTextFormat":"Text Format...","menuConvertToCheckBox":"Convert to CheckBox","menuConvertToImage":"Convert to Image","MenuConvertToRichText":"Convert to RichText","menuConvertToText":"Convert to Text","menuDeleteColumn":"Delete Column","menuDeleteRow":"Delete Row","menuEdit":"&amp;Edit","menuEditBusinessObjectFromDataSetNew":"New Business Object From DataSet...","menuEditBusinessObjectNew":"New Business Object...","menuEditCalcColumnNew":"New Calculated Column...","menuEditCantRedo":"Can\'t Redo","menuEditCantUndo":"Can\'t Undo","menuEditCategoryNew":"New Category...","menuEditClearContents":"Clear Contents","menuEditColumnNew":"New Column...","menuEditConnectionNew":"New Connection...","menuEditCopy":"&amp;Copy","menuEditCut":"Cu&amp;t","menuEditDataParameterNew":"New Parameter...","menuEditDataSourceNew":"New Data Source...","menuEditDataSourcesNew":"New Data Sources...","menuEditDataTransformationNew":"New Data Transformation...","menuEditDelete":"&amp;Delete","menuEditEdit":"Edit","menuEditImportRelations":"Import Relations...","menuEditPaste":"&amp;Paste","menuEditRedo":"&amp;Redo","menuEditRedoText":"&amp;Redo {0}","menuEditRelationNew":"New Relation...","menuEditRemoveUnused":"Remove Unused Items","menuEditResourceNew":"New Resource...","menuEditSelectAll":"Select &amp;All","menuEditSynchronize":"Synchronize","menuEditUndo":"&amp;Undo","menuEditUndoText":"&amp;Undo {0}","menuEditVariableNew":"New Variable...","menuEditViewData":"View Data...","menuEmbedAllDataToResources":"Embed all data to resources","menuFile":"&amp;File","menuFileClose":"&amp;Close","menuFileDashboardDelete":"Delete Dashboard","menuFileDashboardNew":"New Dashboard","menuFileDashboardOpen":"&amp;Open Dashboard...","menuFileDashboardSaveAs":"Save Dashboard &amp;As...","menuFileExit":"E&amp;xit","menuFileExportXMLSchema":"Export XML Schema...","menuFileFormNew":"New Form","menuFileFormOpen":"Open Form","menuFileImportXMLSchema":"Import XML Schema...","menuFileMerge":"Merge...","menuFileMergeXMLSchema":"Merge XML Schema...","menuFileNew":"&amp;New","menuFileOpen":"&amp;Open...","menuFilePageDelete":"Delete Page","menuFilePageNew":"New Page","menuFilePageOpen":"Open Page...","menuFilePageSaveAs":"Save Page As...","menuFilePageSetup":"Page Setup...","menuFileRecentDocuments":"Recent Documents","menuFileRecentLocations":"Recent Locations","menuFileReportNew":"&amp;New Report...","menuFileReportOpen":"&amp;Open Report...","menuFileReportOpenFromGoogleDocs":"Open Report from Google Docs...","menuFileReportPreview":"&amp;Preview","menuFileReportSave":"&amp;Save Report","menuFileReportSaveAs":"Save Report &amp;As...","menuFileReportSaveAsToGoogleDocs":"Save Report As to Google Docs...","menuFileReportSetup":"Report &amp;Setup...","menuFileReportWizardNew":"New Report with &amp;Wizard...","menuFileSave":"&amp;Save","menuFileSaveAs":"Save As...","menuFileScreenNew":"New Screen","menuHelp":"&amp;Help","menuHelpAboutProgramm":"&amp;About...","menuHelpContents":"&amp;Contents","menuHelpDemos":"Demos","menuHelpDocumentation":"Documentation","menuHelpFAQPage":"FAQ Page","menuHelpForum":"Forum","menuHelpHowToRegister":"How to Register","menuHelpProductHomePage":"Product Home Page","menuHelpSamples":"Samples","menuHelpSupport":"&amp;Support","menuHelpTrainingCourses":"Training Courses","menuHelpVideos":"Videos","menuInsertColumnToLeft":"Insert Column To Left","menuInsertColumnToRight":"Insert Column To Right","menuInsertRowAbove":"Insert Row Above","menuInsertRowBelow":"Insert Row Below","menuJoinCells":"Join Cells","menuMakeThisRelationActive":"Make This Relation Active","menuSelectColumn":"Select Column","menuSelectRow":"Select Row","menuTable":"Table","menuTools":"&amp;Tools","menuToolsDataStore":"Data &amp;Store...","menuToolsDictionary":"&amp;Dictionary...","menuToolsOptions":"&amp;Options...","menuToolsPagesManager":"&amp;Pages Manager...","menuToolsServicesConfigurator":"Services &amp;Configurator...","menuToolsStyleDesigner":"Style &amp;Designer...","menuView":"&amp;View","menuViewAlignToGrid":"Align to Grid","menuViewNormal":"&amp;Normal","menuViewOptions":"Options","menuViewPageBreakPreview":"Page &amp;Break Preview","menuViewQuickInfo":"Quick Info","menuViewQuickInfoNone":"None","menuViewQuickInfoOverlay":"Display Over Components","menuViewQuickInfoShowAliases":"Show Aliases","menuViewQuickInfoShowComponentsNames":"Show Components Names","menuViewQuickInfoShowContent":"Show Content","menuViewQuickInfoShowEvents":"Show Events","menuViewQuickInfoShowFields":"Show Fields","menuViewQuickInfoShowFieldsOnly":"Show Fields Only","menuViewShowGrid":"Show Grid","menuViewShowHeaders":"Show Headers","menuViewShowInsertTab":"Show \'Insert\' Tab","menuViewShowOrder":"Show Order","menuViewShowRulers":"Show Rulers","menuViewShowToolbox":"Show Toolbox","menuViewToolbars":"Toolbars"},"Map":{"LinkDataForm":"Link Data","MapEditorForm":"Map Editor"},"MathFormula":{"Alphabets":"Alphabets","Arrows":"Arrows","Formulas":"Formulas","Maths":"Maths","Operators":"Operators"},"Messages":{"ChangeRequestTimeout":"The request timeout for SQL queries exceeds the request timeout of the report designer. Set the request timeout for the designer component in no less than {0} seconds.","DoNotShowAgain":"Do not show again","LatexFormat":"The LaTeX format is used to display mathematical formulas.","MessageTimeOutExpired":"Command timeout has expired!","RenderingWillOccurInTheInterpretationMode":"When viewing the shared report, the rendering will occur in the interpretation mode!","ResourceCannotBeDeleted":"The resource \\"{0}\\" cannot be deleted, because it is used in the report!","ShareURLOfTheItemHasBeenUpdated":"The share URL of the item has been updated!","ShareYourReportYouShouldSave":"To share your report you should save the report to Stimulsoft Cloud!","SwitchingBetweenModes":"Switching between modes will cause the loss of changes. Do you want to proceed?","SwitchParametersOrientation":"Please change the value of the \'ParametersOrientation\' report property to \'{0}\' to show this category on the parameters panel.","TextRegistrationSuccessfully":"\\nRegistration completed successfully!\\n\\nThe Email was sent to \\"{0}\\".\\nIt contains a link to confirm your registration. To complete the registration please follow the link from the Email you received.\\n","ThisFieldIsNotSpecified":"This Field is Not Specified!","ThisFunctionEmbedsAllReportDataToTheReport":"This function embeds all report data to the report resources and makes your report standalone. Be careful! All your data settings will be changed and can\'t be restored. Please, make a backup copy of your report firstly.{0}Are you sure?","YouNeedToLoginFirstToStartUsingTheSoftware":"You need to login first to start using the software. The application will close if you quit the login form."},"Notices":{"AccessDenied":"Access Denied!","AccountLocked":"Your account is locked! In order to resolve it, please send your request to sales@stimulsoft.com!","ActivationContact1":"Please contact our sales department at ","ActivationContact2":" to resolve this.","ActivationExpiriedBeforeFirstRelease":"Your Subscription of Stimulsoft Reports.Ultimate expired earlier than the first version of our Stimulsoft Server was released!","ActivationLicenseIsNotCorrect":"License file is not correct! Please contact our sales department at sales@stimulsoft.com!","ActivationLockedAccount":"Your account is locked. Please contact our sales department at sales@stimulsoft.com!","ActivationLockedAccountExt":"Your account is locked.","ActivationMaxActivationsReached":"You reached the maximum number of activations. Please contact our sales department at sales@stimulsoft.com!","ActivationMaxActivationsReached1":"You can manage the registered computers from your ","ActivationMaxActivationsReached2":"Stimulsoft Account.","ActivationMaxComputersReached":"You’ve already registered the maximum number of computers available for your subscription.","ActivationServerIsNotAvailableNow":"Stimulsoft Activation Server is not available now! Please try again later.","ActivationServerVersionNotAllowed":"You cannot activate this version of Stimulsoft Server because your Subscription Program expired! Please log in to your account and check which version of the Stimulsoft Server you can install and activate.","ActivationSomeTroublesOccurred":"An error occurred during activation. Please try again later.","ActivationTrialExpired":"You can continue to use Stimulsoft Designer by purchasing the software.","ActivationTrialExtend1":"If you are interested in extending your trial, please ","ActivationTrialExtend2":"tell us why.","ActivationUserNameOrPasswordIsWrong":"Your user name (Email) or password is wrong!","ActivationWrongAccountType":"Your account type does not allow to activate Stimulsoft Server!","Alert":"Alert","AuthAccountAlreadyExists":"The account with this User Name (email) already exists. To associate it with your {0} account, please use your Stimulsoft account password.","AuthAccountCantBeUsedNow":"The account cannot be used now!","AuthAccountIsNotActivated":"The account is not activated yet! Please follow the instructions sent to the Email during registration.","AuthCantChangeRoleBecauseLastAdministratorUser":"The user role cannot be changed because this is the last administrator user in this workspace!","AuthCantChangeRoleBecauseLastSupervisorUser":"The user role cannot be changed because this is the last supervisor user at this server!","AuthCantChangeSystemRole":"The system role cannot be changed!","AuthCantDeleteHimselfUser":"The user cannot delete himself!","AuthCantDeleteLastAdministratorUser":"The user cannot be deleted because this is the last administrator user in this workspace!","AuthCantDeleteLastSupervisorUser":"The user cannot be deleted because this is the last supervisor user at this server!","AuthCantDeleteSystemRole":"Cannot delete this role, because it is a system role!","AuthCantDisableUserBecauseLastAdministratorUser":"The user cannot be disabled because this is the last administrator user in this workspace!","AuthCantDisableUserBecauseLastSupervisorUser":"The user cannot be disabled because this is the last supervisor user at this server!","AuthFirstNameIsNotSpecified":"The first name is not specified!","AuthLastNameIsNotSpecified":"The last name is not specified!","AuthOAuthIdNotSpecified":"The OAuth identificator is not specified!","AuthPasswordIsNotCorrect":"The password is not correct!","AuthPasswordIsNotSpecified":"The password is not specified!","AuthPasswordIsTooShort":"The password is too short (a minimum length is 6 chars)!","AuthRoleCantBeDeletedBecauseUsedByUsers":"You cannot delete the role because it is used by other users.","AuthRoleNameAlreadyExists":"The role with the specified name \\"{0}\\" already exists!","AuthRoleNameIsSystemRole":"The role with the specified name \\"{0}\\" is a system role!","AuthSendMessageWithInstructions":"A message with further instructions is sent to \\"{0}\\"!","AuthTokenIsNotCorrect":"Token is not correct!","AuthUserHasLoggedOut":"You have logged out!","AuthUserNameAlreadyExists":"The username (Email) is already in use!","AuthUserNameEmailIsBlocked":"This Email address cannot be used!","AuthUserNameIsNotSpecified":"The username (Email) is not specified!","AuthUserNameNotAssociatedWithYourAccount":"Username (Email) {0} is not associated with your {1} account!","AuthUserNameOrPasswordIsNotCorrect":"The username (Email) or password is incorrect!","AuthUserNameShouldLookLikeAnEmailAddress":"The username should be similar to the Email address!","AuthWorkspaceNameAlreadyInUse":"The workspace name is already in use!","CommandTimeOut":"Waiting time of processing the command is elapsed!","Congratulations":"Congratulations!","DeveloperInformation":"Developer Information","EndDateShouldBeGreaterThanCurrentDate":"The end date should be greater than the current date!","EndDateShouldBeGreaterThanStartDate":"The end date should be greater than start date!","ExecutionError":"Execution error","IsIdentical":"\\"{0}\\" and \\"{1}\\" are identical.\\"","IsNotAuthorized":"No access to \\"{0}\\"!","IsNotCorrect":"\\"{0}\\" is incorrect!","IsNotDeleted":"\\"{0}\\" is not deleted!","IsNotEqual":"\\"{0}\\" is not equal!","IsNotFound":"\\"{0}\\" is not found!","IsNotRecognized":"\\"{0}\\" is not recognized!","IsNotSpecified":"\\"{0}\\" is not specified!","IsRequiredFile":"You should add at least one file!","ItemCantBeAttachedToItself":"The item cannot be attached to itself!","ItemCantBeDeletedBecauseItemIsAttachedToOtherItems":"The elements \\"{0}\\" cannot be deleted because they are attached to other elements!","ItemCantBeMovedToSpecifiedPlace":"The item cannot be moved to a specified place!","ItemDoesNotSupport":"The item does not support \\"{0}\\"!","KeyAndToKeyAreEqual":"A Key and ToKey are equal!","MaximumComputers":"Maximum of Computers","MessageMaximumFileSizeExceeded":"Attention! The size of the file that you are trying to add exceeds the maximum-allowed size. Do you want to add this file anyway (report processing may slow down significantly)?","NewDesignerAvailable":"Stimulsoft Designer {0} is available.","NewProduct":"The new product is added to your subscription!","NewVersionsAvailable":"New version","NotificationConnectPackage":"Connect the \\"{0}\\" package for the correct work.","NotificationFailed":"Failed result!","NotificationFailedAddFollowingFiles":"Failed to add the following files. Exceeded the size {0} MB.","NotificationFilesUploadingComplete":"The files uploaded successfully.","NotificationFileUploading":"The file \\"{0}\\" is uploading.","NotificationItemDelete":"The items are deleting.","NotificationItemDeleteComplete":"The items are deleted successfully.","NotificationItemExtraComponentRequired":"Extra component required","NotificationItemInstallWebView":"Please install the WebView2 Runtime to work with the Blockly editor correctly.","NotificationItemRestore":"The items are restoring.","NotificationItemRestoreComplete":"The items are restored successfully.","NotificationItemTransfer":"The items are transferring.","NotificationItemTransferComplete":"The items are transferred successfully.","NotificationItemWaitingProcessing":"The items are waiting processing.","NotificationMailing":"Sending","NotificationMailingComplete":"The mailing \\"{0}\\" is complete.","NotificationMailingWaitingProcessing":"The mailing \\"{0}\\" is waiting processing.","NotificationOperationAborted":"Operation aborted!","NotificationPackageRequiredToDisplay":"To display this content, please download the \\"{0}\\" package from NuGet.","NotificationRecycleBinCleaning":"The Recycle Bin is cleaning.","NotificationRecycleBinCleaningComplete":"The Recycle Bin is cleaned successfully.","NotificationRecycleBinWaitingProcessing":"The Recycle Bin cleaning is waiting processing.","NotificationReportExporting":"The report \\"{0}\\" is exporting","NotificationReportExportingComplete":"The report \\"{0}\\" is exported successfully.","NotificationReportRendering":"The report \\"{0}\\" is rendering","NotificationReportRenderingComplete":"The report \\"{0}\\" is rendered.","NotificationReportWaitingProcessing":"The report \\"{0}\\" is waiting processing.","NotificationReturnToDesigner":"Return to the Stimulsoft Designer to continue.","NotificationSchedulerRunning":"The scheduler \\"{0}\\" is running.","NotificationSchedulerRunningComplete":"The scheduler \\"{0}\\" running complete.","NotificationSchedulerWaitingProcessing":"The scheduler \\"{0}\\" is waiting processing.","NotificationTitleFilesUploading":"Uploading files","NotificationTitleItemRefreshing":"Refreshing item \\"{0}\\"","NotificationTitleItemTransferring":"Transferring item \\"{0}\\"","NotificationTitleMailing":"Mailing \\"{0}\\"","NotificationTitleReportExporting":"Exporting report \\"{0}\\"","NotificationTitleReportRendering":"Rendering report \\"{0}\\"","NotificationTitleSchedulerRunning":"Running scheduler \\"{0}\\"","NotificationTransferring":"The \\"{0}\\" is tranferring to \\"{1}\\".","NotificationTransferringComplete":"The \\"{0}\\" is succesfully transffered to \\"{1}\\".","NotificationValueIsNotCorrect":"This value is not correct for the type {0}","OutOfRange":"Out of range (\\"{0}\\")!","ParsingCommandException":"An exception of processing the command in the specified xml: {0}","PleaseLogin":"Please login using your Stimulsoft account credentials or register a new account before publishing report.","QuotaMaximumComputingCyclesCountExceeded":"Maximum computing cycles exceeded.","QuotaMaximumDataRowsCountExceeded":"Maximum data rows in one data source exceeded.","QuotaMaximumFileSizeExceeded":"Maximum file size exceeded.","QuotaMaximumItemsCountExceeded":"Maximum items exceeded.","QuotaMaximumRefreshCountExceeded":"Maximum refresh count exceeded","QuotaMaximumReportPagesCountExceeded":"Maximum report pages exceeded.","QuotaMaximumResourcesCountExceeded":"Maximum resources exceeded.","QuotaMaximumResourceSizeExceeded":"Maximum resource size exceeded.","QuotaMaximumUsersCountExceeded":"Maximum users exceeded.","QuotaMaximumWorkspacesCountExceeded":"Maximum workspaces exceeded.","SchedulerCantRunItSelf":"The scheduler cannot run itself!","SessionTimeOut":"Session timeout","SnapshotAlreadyProcessed":"The report snapshot is already processed!","SpecifiedItemIsNot":"The specified item is not \\"{0}\\"!","SubscriptionExpired":"Your subscription has expired!","SubscriptionExpiredDate":"Your subscription will expire on {0}","SubscriptionExpiredDays":"Expires in {0} days","SubscriptionExpiredExt":"Your subscription has expired. Update your subscription to get the last version.","SubscriptionExpiredShort":"Subscription expired","SubscriptionsOut10":"10 days left when the subscription expires!","SubscriptionsOut20":"The subscription period will expire in 20 days!","SuccessfullyRenewed":"Your subscription has been successfully updated!","TrialToLicense":"We would like to thank you for choosing our software!","VersionCopyFromItem":"Copy from item \\"{0}\\".","VersionCreatedFromFile":"Created from file \\"{0}\\".","VersionCreatedFromItem":"Created from item \\"{0}\\".","VersionLoadedFromFile":"Loaded from file \\"{0}\\".","VersionNewItemCreation":"New item creation.","Warning":"Warning","WindowClosePreventWhileUploading":"Some files are uploading now, if you close page they will lost. Are you sure you want to close page?","WithSpecifiedKeyIsNotFound":"\\"{0}\\" with the specified key is not found!","WouldYouLikeToUpdateNow":"Would you like to update now?","YourTimeSessionHasExpired":"Your time session has expired!","YourTrialHasExpired":"Your trial has expired","YourTrialWillExpire":"Your trial will expire in {0} days.","YouUsingTrialVersion":"You are using a trial version!"},"NuGet":{"AlreadyDownloaded":"Already Downloaded","AssemblyLoadedSuccessfully":"The assembly is loaded successfully.","AssemblyNotFound":"It is impossible to find {0} assembly to use the {1} connection!","Author":"Author","Dependencies":"Dependencies:","Download":"Download","DownloadAll":"Download All","DownloadAndInstall":"Download and Install","DownloadDataAdapter":"Download Data Adapter","Downloads":"Downloads:","IAccept":"I Accept","IDecline":"I Decline","LicenceFormDesc":"The following package require that you accept their license terms before installing.","LicenceFormDesc1":"By clicking \\"I Accept\\" you agree to the license terms for the package listed above. If you do not agree to the license terms, click \\"I Decline\\".","LicenceFormTitle":"Licence Acceptance","License":"License:","ProjectUrl":"Project URL:","ReportAbuse":"Report Abuse:","RetrievingInformation":"Retrieving information...","Tags":"Tags:","Title":"Data Adapter from NuGet","ViewLicense":"View License"},"Panels":{"Dictionary":"Dictionary","Messages":"Messages","Properties":"Properties","ReportTree":"Report Tree"},"Password":{"gbPassword":"Encrypting of the file","lbPasswordLoad":"Enter the password to open the file","lbPasswordSave":"Password:","PasswordNotEntered":"The password is not entered","StiLoadPasswordForm":"Document encrypting","StiSavePasswordForm":"Password"},"Permissions":{"AdminAPI":"API","AdminBackgroundTasks":"Background Tasks","AdminPermissions":"Permissions","AdminRecycleBin":"Recycle Bin","AdminShare":"Share","AdminTransfers":"Transfers","ItemCalendars":"Calendars","ItemCloudStorages":"Cloud Storages","ItemContactLists":"Contact Lists","ItemDashboards":"Dashboards","ItemDataSources":"Data Sources","ItemFiles":"Files","ItemFolders":"Folders","ItemForms":"Forms","ItemReportSnapshots":"Report Snapshots","ItemReportTemplates":"Report Templates","ItemSchedulers":"Schedulers","ReportDesignerBusinessObjects":"Business Objects","ReportDesignerDataColumns":"Data Columns","ReportDesignerDataConnections":"Data Connections","ReportDesignerDataRelations":"Data Relations","ReportDesignerDataSources":"Data Sources","ReportDesignerDictionaryActions":"Dictionary Actions","ReportDesignerRestrictions":"Restrictions","ReportDesignerVariables":"Variables","SystemBackupRestore":"Backup &amp; Restore","SystemEmailTemplates":"Email Templates","SystemLicensing":"Licensing","SystemMonitoring":"Monitoring","SystemUpdate":"Update","SystemWorkspaces":"Workspaces","TextAdministration":"Administration","TextItems":"Items","TextReportDesigner":"Report Designer","TextSystem":"System","TextUsers":"Users","UserHimself":"Himself","UserRoles":"Roles","Users":"Users","UserWorkspace":"Workspace"},"PlacementComponent":{"MoveLeftFreeSpace":"Moves a component to the left side of a free space, increasing the height of the component to the height of free space.","MoveRightFreeSpace":"Moves a component to the right side of a free space, increasing the height of the component to the height of free space."},"PromptForm":{"CacheLoginData":"Cache login data for current session"},"PropertyCategory":{"AppearanceCategory":"Appearance","AreaCategory":"Area","ArgumentCategory":"Argument","AxisCategory":"Axis","BarCodeAdditionalCategory":"Bar Code Additional","BarCodeCategory":"Bar Code","BehaviorCategory":"Behavior","ButtonCategory":"Button","CapNeedle":"Cap Needle","CardsCategory":"Cards","CellCategory":"Cell","ChartAdditionalCategory":"Chart Additional","ChartCategory":"Chart","ChartMap":"Map","CheckCategory":"Check","ColorsCategory":"Colors","ColumnsCategory":"Columns","ComboBoxCategory":"Combo Box","CommonCategory":"Common","ControlCategory":"Control","ControlsEventsCategory":"Controls Events","CrossTabCategory":"Cross-Tab","DashboardCategory":"Dashboard","DataCategory":"Data","DataCells":"Data Cells","DatePickerCategory":"Date Picker","DescriptionCategory":"Description","DesignCategory":"Design","DisplayCategory":"Display","EngineCategory":"Engine","ExportCategory":"Export","ExportEventsCategory":"Export Events","FooterTableCategory":"Footer Table","GaugeCategory":"Gauge","GlobalizationCategory":"Globalization","GridLinesCategory":"Grid Lines","HeaderTableCategory":"Header Table","HierarchicalCategory":"Hierarchical","ImageAdditionalCategory":"Image Additional","ImageCategory":"Image","IndicatorCategory":"Indicator","InterlacingCategory":"Interlacing","LabelsCategory":"Labels","LegendCategory":"Legend","LinearScaleBarCategory":"Linear Scale Bar","LinearScaleCategory":"Linear Scale","ListBoxCategory":"List Box","MainCategory":"Main","MarkerCategory":"Marker","MathFormulaCategory":"Math Formula","MiscCategory":"Misc","MouseEventsCategory":"Mouse Events","NavigationCategory":"Navigation","NavigationEventsCategory":"Navigation Events","Needle":"Needle","NeedleCategory":"Needle","OnlineMapCategory":"Online Map","OptionsCategory":"Options","PageAdditionalCategory":"Page Additional","PageCategory":"Page","PageColumnBreakCategory":"Page and Column Break","ParametersCategory":"Parameters","PivotTableCategory":"Pivot Table","PositionCategory":"Position","PrimitiveCategory":"Primitive","PrintEventsCategory":"Print Events","ProgressCategory":"Progress","RadialScaleBarCategory":"Radial Scale Bar","RegionMapCategory":"Region Map","RenderEventsCategory":"Render Events","SeriesCategory":"Series","SeriesLabelsCategory":"Series Labels","ShapeCategory":"Shape","Size":"Size","SubReportCategory":"Sub-Report","TableCategory":"Table","TableOfContents":"Table of Contents","TextAdditionalCategory":"Text Additional","TextCategory":"Text","TickLabelMajorCategory":"Tick Label Major","TickLabelMinorCategory":"Tick Label Minor","TickMarkMajorCategory":"Tick Mark Major","TickMarkMinorCategory":"Tick Mark Minor","TitleCategory":"Title","TreeViewBoxCategory":"Tree View Box","TreeViewCategory":"Tree View","TrendLineCategory":"Trend Line","ValueCategory":"Value","ValueCloseCategory":"Value Close","ValueEndCategory":"Value End","ValueEventsCategory":"Value Events","ValueHighCategory":"Value High","ValueLowCategory":"Value Low","ValueOpenCategory":"Value Open","ViewCategory":"View","WeightCategory":"Weight","WinControlCategory":"Win Control","ZipCodeCategory":"ZIP Code"},"PropertyColor":{"AliceBlue":"Alice Blue","AntiqueWhite":"Antique White","Aqua":"Aqua","Aquamarine":"Aquamarine","Azure":"Azure","Beige":"Beige","Bisque":"Bisque","Black":"Black","BlanchedAlmond":"Blanched Almond","Blue":"Blue","BlueViolet":"Blue Violet","Brown":"Brown","BurlyWood":"Burly Wood","CadetBlue":"Cadet Blue","Carmine":"Carmine","Chartreuse":"Chartreuse","Chocolate":"Chocolate","Coral":"Coral","CornflowerBlue":"Cornflower Blue","Cornsilk":"Cornsilk","Crimson":"Crimson","Cyan":"Cyan","DarkBlue":"Dark Blue","DarkCyan":"Dark Cyan","DarkGoldenrod":"Dark Goldenrod","DarkGray":"Dark Gray","DarkGreen":"Dark Green","DarkKhaki":"Dark Khaki","DarkMagenta":"Dark Magenta","DarkOliveGreen":"Dark Olive Green","DarkOrange":"Dark Orange","DarkOrchid":"Dark Orchid","DarkRed":"Dark Red","DarkSalmon":"Dark Salmon","DarkSeaGreen":"Dark Sea Green","DarkSlateBlue":"Dark Slate Blue","DarkSlateGray":"Dark Slate Gray","DarkTurquoise":"Dark Turquoise","DarkViolet":"Dark Violet","DeepPink":"Deep Pink","DeepSkyBlue":"Deep Sky Blue","DimGray":"Dim Gray","DodgerBlue":"Dodger Blue","Firebrick":"Firebrick","FloralWhite":"Floral White","ForestGreen":"Forest Green","Fuchsia":"Fuchsia","Gainsboro":"Gainsboro","GhostWhite":"Ghost White","Gold":"Gold","Goldenrod":"Goldenrod","Gray":"Gray","Green":"Green","GreenYellow":"Green Yellow","Honeydew":"Honeydew","HotPink":"Hot Pink","IndianRed":"Indian Red","Indigo":"Indigo","Ivory":"Ivory","Khaki":"Khaki","Lavender":"Lavender","LavenderBlush":"Lavender Blush","LawnGreen":"Lawn Green","LemonChiffon":"Lemon Chiffon","LightBlue":"Light Blue","LightCoral":"Light Coral","LightCyan":"Light Cyan","LightGoldenrodYellow":"Light Goldenrod Yellow","LightGray":"Light Gray","LightGreen":"Light Green","LightPink":"Light Pink","LightSalmon":"Light Salmon","LightSeaGreen":"Light Sea Green","LightSkyBlue":"Light Sky Blue","LightSlateGray":"Light Slate Gray","LightSteelBlue":"Light Steel Blue","LightYellow":"Light Yellow","Lime":"Lime","LimeGreen":"Lime Green","Linen":"Linen","Magenta":"Magenta","Maroon":"Maroon","MediumAquamarine":"Medium Aquamarine","MediumBlue":"Medium Blue","MediumOrchid":"Medium Orchid","MediumPurple":"Medium Purple","MediumSeaGreen":"Medium Sea Green","MediumSlateBlue":"Medium Slate Blue","MediumSpringGreen":"Medium Spring Green","MediumTurquoise":"Medium Turquoise","MediumVioletRed":"Medium Violet Red","MidnightBlue":"Midnight Blue","MintCream":"Mint Cream","MistyRose":"Misty Rose","Moccasin":"Moccasin","NavajoWhite":"Navajo White","Navy":"Navy","OldLace":"Old Lace","Olive":"Olive","OliveDrab":"Olive Drab","Orange":"Orange","OrangeRed":"Orange Red","Orchid":"Orchid","PaleGoldenrod":"Pale Goldenrod","PaleGreen":"Pale Green","PaleTurquoise":"Pale Turquoise","PaleVioletRed":"Pale Violet Red","PapayaWhip":"Papaya Whip","PeachPuff":"Peach Puff","Peru":"Peru","Pink":"Pink","Plum":"Plum","PowderBlue":"Powder Blue","Purple":"Purple","Red":"Red","RosyBrown":"Rosy Brown","RoyalBlue":"Royal Blue","SaddleBrown":"Saddle Brown","Salmon":"Salmon","SandyBrown":"Sandy Brown","SeaGreen":"Sea Green","SeaShell":"Sea Shell","Sienna":"Sienna","Silver":"Silver","SkyBlue":"Sky Blue","SlateBlue":"Slate Blue","SlateGray":"Slate Gray","Snow":"Snow","SpringGreen":"Spring Green","SteelBlue":"Steel Blue","Tan":"Tan","Teal":"Teal","Thistle":"Thistle","Tomato":"Tomato","Transparent":"Transparent","Turquoise":"Turquoise","VeryDarkGray":"Very Dark Gray","Violet":"Violet","Wheat":"Wheat","White":"White","WhiteSmoke":"White Smoke","Yellow":"Yellow","YellowGreen":"Yellow Green"},"PropertyEnum":{"boolFalse":"False","boolTrue":"True","BorderStyleFixed3D":"Fixed 3D","BorderStyleFixedSingle":"Fixed Single","BorderStyleNone":"None","ChartAxesTicksAll":"All","ChartAxesTicksMajor":"Major","ChartAxesTicksNone":"None","ChartGridLinesAll":"All","ChartGridLinesMajor":"Major","ChartGridLinesNone":"None","ComboBoxStyleDropDown":"Drop Down","ComboBoxStyleDropDownList":"Drop Down List","ComboBoxStyleSimple":"Simple","ContentAlignmentBottomCenter":"Bottom Center","ContentAlignmentBottomLeft":"Bottom Left","ContentAlignmentBottomRight":"Bottom Right","ContentAlignmentMiddleCenter":"Middle Center","ContentAlignmentMiddleLeft":"Middle Left","ContentAlignmentMiddleRight":"Middle Right","ContentAlignmentTopCenter":"Top Center","ContentAlignmentTopLeft":"Top Left","ContentAlignmentTopRight":"Top Right","DataGridLineStyleNone":"None","DataGridLineStyleSolid":"Solid","DateTimePickerFormatCustom":"Custom","DateTimePickerFormatLong":"Long","DateTimePickerFormatShort":"Short","DateTimePickerFormatTime":"Time","DialogResultAbort":"Abort","DialogResultCancel":"Cancel","DialogResultIgnore":"Ignore","DialogResultNo":"No","DialogResultNone":"None","DialogResultOK":"OK","DialogResultRetry":"Retry","DialogResultYes":"Yes","DuplexDefault":"Default","DuplexHorizontal":"Horizontal","DuplexSimplex":"Simplex","DuplexVertical":"Vertical","FormStartPositionCenterParent":"Center Parent","FormStartPositionCenterScreen":"Center Screen","FormStartPositionManual":"Manual","FormStartPositionWindowsDefaultBounds":"Windows Default Bounds","FormStartPositionWindowsDefaultLocation":"Windows Default Location","FormWindowStateMaximized":"Maximized","FormWindowStateMinimized":"Minimized","FormWindowStateNormal":"Normal","HorizontalAlignmentCenter":"Center","HorizontalAlignmentLeft":"Left","HorizontalAlignmentRight":"Right","HotkeyPrefixHide":"Hide","HotkeyPrefixNone":"None","HotkeyPrefixShow":"Show","LeftRightAlignmentLeft":"Left","LeftRightAlignmentRight":"Right","PictureBoxSizeModeAutoSize":"Auto Size","PictureBoxSizeModeCenterImage":"Center Image","PictureBoxSizeModeNormal":"Normal","PictureBoxSizeModeStretchImage":"Stretch Image","RelationDirectionChildToParent":"Child-To-Parent","RelationDirectionParentToChild":"Parent-To-Child","RightToLeftInherit":"Inherit","RightToLeftNo":"No","RightToLeftYes":"Yes","SelectionModeMultiExtended":"Multi Extended","SelectionModeMultiSimple":"Multi Simple","SelectionModeNone":"None","SelectionModeOne":"One","StiAnchorModeBottom":"Bottom","StiAnchorModeLeft":"Left","StiAnchorModeRight":"Right","StiAnchorModeTop":"Top","StiAngleAngle0":"0 Degrees","StiAngleAngle180":"180 Degrees","StiAngleAngle270":"270 Degrees","StiAngleAngle45":"45 Degrees","StiAngleAngle90":"90 Degrees","StiArrowStyleArc":"Arc","StiArrowStyleArcAndCircle":"Arc and Circle","StiArrowStyleCircle":"Circle","StiArrowStyleLines":"Lines","StiArrowStyleNone":"None","StiArrowStyleTriangle":"Triangle","StiBorderSidesAll":"All","StiBorderSidesBottom":"Bottom","StiBorderSidesLeft":"Left","StiBorderSidesNone":"None","StiBorderSidesRight":"Right","StiBorderSidesTop":"Top","StiBorderStyleBump":"Bump","StiBorderStyleEtched":"Etched","StiBorderStyleFlat":"Flat","StiBorderStyleNone":"None","StiBorderStyleRaised":"Raised","StiBorderStyleRaisedInner":"Raised Inner","StiBorderStyleRaisedOuter":"Raised Outer","StiBorderStyleSunken":"Sunken","StiBorderStyleSunkenInner":"Sunken Inner","StiBorderStyleSunkenOuter":"Sunken Outer","StiBrushTypeGlare":"Glare Brush","StiBrushTypeGradient0":"Gradient Brush, Angle 0","StiBrushTypeGradient180":"Gradient Brush, Angle 180","StiBrushTypeGradient270":"Gradient Brush, Angle 270","StiBrushTypeGradient45":"Gradient Brush, Angle 45","StiBrushTypeGradient90":"Gradient Brush, Angle 90","StiBrushTypeSolid":"Solid Brush","StiButtonSendTypeFDF":"FDF","StiButtonSendTypeHTML":"HTML","StiButtonSendTypePDF":"PDF","StiButtonSendTypeXFDF":"XFDF","StiCalculationModeCompilation":"Compilation","StiCalculationModeInterpretation":"Interpretation","StiCapStyleArrow":"Arrow","StiCapStyleDiamond":"Diamond","StiCapStyleNone":"None","StiCapStyleOpen":"Open","StiCapStyleOval":"Oval","StiCapStyleSquare":"Square","StiCapStyleStealth":"Stealth","StiChartLabelsStyleCategory":"Category","StiChartLabelsStyleCategoryPercentOfTotal":"Category - Percent Of Total","StiChartLabelsStyleCategoryValue":"Category - Value","StiChartLabelsStylePercentOfTotal":"Percent Of Total","StiChartLabelsStyleValue":"Value","StiChartTitleDockBottom":"Bottom","StiChartTitleDockLeft":"Left","StiChartTitleDockRight":"Right","StiChartTitleDockTop":"Top","StiChartTrendLineTypeExponential":"Exponential","StiChartTrendLineTypeLinear":"Linear","StiChartTrendLineTypeLogarithmic":"Logarithmic","StiChartTrendLineTypeNone":"None","StiCheckStateChecked":"Checked","StiCheckStateIndeterminate":"Indeterminate","StiCheckStateUnchecked":"Unchecked","StiCheckStyleCheck":"Check","StiCheckStyleCheckRectangle":"Check Rectangle","StiCheckStyleCross":"Cross","StiCheckStyleCrossCircle":"Cross Circle","StiCheckStyleCrossRectangle":"Cross Rectangle","StiCheckStyleDotCircle":"Dot Circle","StiCheckStyleDotRectangle":"Dot Rectangle","StiCheckStyleNone":"None","StiCheckStyleNoneCircle":"None Circle","StiCheckStyleNoneRectangle":"None Rectangle","StiCheckSumNo":"No","StiCheckSumYes":"Yes","StiCode11CheckSumAuto":"Auto","StiCode11CheckSumNone":"None","StiCode11CheckSumOneDigit":"One Digit","StiCode11CheckSumTwoDigits":"Two Digits","StiColorScaleTypeColor2":"2-Color Scale","StiColorScaleTypeColor3":"3-Color Scale","StiColumnDirectionAcrossThenDown":"Across Then Down","StiColumnDirectionDownThenAcross":"Down Then Across","StiColumnShape3DBox":"Box","StiColumnShape3DPartialPyramid":"Partial Pyramid","StiColumnShape3DPyramid":"Pyramid","StiCrossHorAlignmentCenter":"Center","StiCrossHorAlignmentLeft":"Left","StiCrossHorAlignmentNone":"None","StiCrossHorAlignmentRight":"Right","StiDashboardContentAlignmentCenter":"Center","StiDashboardContentAlignmentLeft":"Left","StiDashboardContentAlignmentRight":"Right","StiDashboardContentAlignmentStretchX":"Stretch X","StiDashboardContentAlignmentStretchXY":"Stretch XY","StiDateSelectionModeAutoRange":"Auto Range","StiDateSelectionModeRange":"Range","StiDateSelectionModeSingle":"Single","StiDateTimeTypeDate":"Date","StiDateTimeTypeDateAndTime":"Date and Time","StiDateTimeTypeTime":"Time","StiDesignerScaleModeAutomaticScaling":"Automatic Scaling","StiDesignerScaleModeScaling100":"100% Scaling","StiDesignerSpecificationAuto":"Determine Automatically","StiDesignerSpecificationBeginner":"I\'m Beginner","StiDesignerSpecificationBICreator":"I\'m Creator","StiDesignerSpecificationDeveloper":"I\'m Developer","StiDirectionBottomToTop":"Bottom to Top","StiDirectionLeftToRight":"Left to Right","StiDirectionRightToLeft":"Right to Left","StiDirectionTopToBottom":"Top to Bottom","StiDisplayNameTypeFull":"Full","StiDisplayNameTypeNone":"None","StiDisplayNameTypeShort":"Short","StiDockStyleBottom":"Bottom","StiDockStyleFill":"Fill","StiDockStyleLeft":"Left","StiDockStyleNone":"None","StiDockStyleRight":"Right","StiDockStyleTop":"Top","StiDrillDownModeMultiPage":"Multi Page","StiDrillDownModeSinglePage":"Single Page","StiEanSupplementTypeFiveDigit":"FiveDigit","StiEanSupplementTypeNone":"None","StiEanSupplementTypeTwoDigit":"TwoDigit","StiEmptyCellsAsConnectPointsWithLine":"Connect Points with Line","StiEmptyCellsAsGap":"Gap","StiEmptyCellsAsZero":"Zero","StiEmptySizeModeAlignFooterToBottom":"Align Footer to Bottom","StiEmptySizeModeAlignFooterToTop":"Align Footer to Top","StiEmptySizeModeDecreaseLastRow":"Decrease Last Row","StiEmptySizeModeIncreaseLastRow":"Increase Last Row","StiEnumeratorTypeABC":"ABC","StiEnumeratorTypeArabic":"Arabic","StiEnumeratorTypeNone":"None","StiEnumeratorTypeRoman":"Roman","StiExtendedStyleBoolFalse":"False","StiExtendedStyleBoolFromStyle":"From Style","StiExtendedStyleBoolTrue":"True","StiFilterConditionBeginningWith":"beginning with","StiFilterConditionBetween":"between","StiFilterConditionContaining":"containing","StiFilterConditionEndingWith":"ending with","StiFilterConditionEqualTo":"equal to","StiFilterConditionGreaterThan":"greater than","StiFilterConditionGreaterThanOrEqualTo":"greater than or equal to","StiFilterConditionIsBlank":"is blank","StiFilterConditionIsNotBlank":"is not blank","StiFilterConditionIsNotNull":"is not null","StiFilterConditionIsNull":"is null","StiFilterConditionLessThan":"less than","StiFilterConditionLessThanOrEqualTo":"less than or equal to","StiFilterConditionNotBetween":"not between","StiFilterConditionNotContaining":"not containing","StiFilterConditionNotEqualTo":"not equal to","StiFilterDataTypeBoolean":"Boolean","StiFilterDataTypeDateTime":"DateTime","StiFilterDataTypeExpression":"Expression","StiFilterDataTypeNumeric":"Numeric","StiFilterDataTypeString":"String","StiFilterEngineReportEngine":"Report Engine","StiFilterEngineSQLQuery":"SQL Query","StiFilterItemArgument":"Argument","StiFilterItemExpression":"Expression","StiFilterItemValue":"Value","StiFilterItemValueClose":"Value Close","StiFilterItemValueEnd":"Value End","StiFilterItemValueHigh":"Value High","StiFilterItemValueLow":"Value Low","StiFilterItemValueOpen":"Value Open","StiFilterModeAnd":"And","StiFilterModeOr":"Or","StiFontIconGroupAccessibilityIcons":"Accessibility","StiFontIconGroupBrandIcons":"Brand","StiFontIconGroupDirectionalIcons":"Directional","StiFontIconGroupGenderIcons":"Gender","StiFontIconGroupMedicalIcons":"Medical","StiFontIconGroupPaymentIcons":"Payment","StiFontIconGroupSpinnerIcons":"Spinner","StiFontIconGroupTransportationIcons":"Transportation","StiFontIconGroupVideoPlayerIcons":"Video","StiFontIconGroupWebApplicationIcons":"Application","StiFontSizeModeAuto":"Auto","StiFontSizeModeTarget":"Target","StiFontSizeModeValue":"Value","StiFormStartModeOnEnd":"On End","StiFormStartModeOnPreview":"On Preview","StiFormStartModeOnStart":"On Start","StiGaugeCalculationModeAuto":"Auto","StiGaugeCalculationModeCustom":"Custom","StiGaugeRangeModePercentage":"Percentage","StiGaugeRangeModeValue":"Value","StiGaugeRangeTypeColor":"Color","StiGaugeRangeTypeNone":"None","StiGaugeTypeBullet":"Bullet","StiGaugeTypeFullCircular":"Full Circular","StiGaugeTypeHalfCircular":"Half-Circular","StiGaugeTypeHorizontalLinear":"Horizontal Linear","StiGaugeTypeLinear":"Vertical Linear","StiGroupSortDirectionAscending":"Ascending","StiGroupSortDirectionDescending":"Descending","StiGroupSortDirectionNone":"None","StiHorAlignmentCenter":"Center","StiHorAlignmentLeft":"Left","StiHorAlignmentRight":"Right","StiIconAlignmentBottom":"Bottom","StiIconAlignmentLeft":"Left","StiIconAlignmentNone":"None","StiIconAlignmentRight":"Right","StiIconAlignmentTop":"Top","StiImageProcessingDuplicatesTypeGlobalHide":"Global Hide","StiImageProcessingDuplicatesTypeGlobalMerge":"Global Merge","StiImageProcessingDuplicatesTypeGlobalRemoveImage":"Global Remove Image","StiImageProcessingDuplicatesTypeHide":"Hide","StiImageProcessingDuplicatesTypeMerge":"Merge","StiImageProcessingDuplicatesTypeNone":"None","StiImageProcessingDuplicatesTypeRemoveImage":"Remove Image","StiImageRotationFlipHorizontal":"Flip Horizontal","StiImageRotationFlipVertical":"Flip Vertical","StiImageRotationNone":"None","StiImageRotationRotate180":"Rotate 180°","StiImageRotationRotate90CCW":"Rotate 90° CCW","StiImageRotationRotate90CW":"Rotate 90° CW","StiInteractionOnClick":"None","StiInteractionOnClickApplyFilter":"Apply Filter","StiInteractionOnClickDrillDown":"Drill-Down","StiInteractionOnClickOpenHyperlink":"Open Hyperlink","StiInteractionOnClickShowDashboard":"Show Dashboard","StiInteractionOnHoverNone":"None","StiInteractionOnHoverShowHyperlink":"Show Hyperlink","StiInteractionOnHoverShowToolTip":"Show Tool Tip","StiInteractionOpenHyperlinkDestinationCurrentTab":"Current Tab","StiInteractionOpenHyperlinkDestinationNewTab":"New Tab","StiItemOrientationHorizontal":"Horizontal","StiItemOrientationVertical":"Vertical","StiItemSelectionModeMulti":"Multi","StiItemSelectionModeOne":"One","StiKeepDetailsKeepDetailsTogether":"Keep Details Together","StiKeepDetailsKeepFirstDetailTogether":"Keep First Detail Together","StiKeepDetailsKeepFirstRowTogether":"Keep First Row Together","StiKeepDetailsNone":"None","StiLabelPlacementInside":"Inside","StiLabelPlacementOutside":"Outside","StiLabelsPlacementAutoRotation":"Auto Rotation","StiLabelsPlacementNone":"None","StiLabelsPlacementOneLine":"One Line","StiLabelsPlacementTwoLines":"Two Lines","StiLegendDirectionBottomToTop":"Bottom to Top","StiLegendDirectionLeftToRight":"Left to Right","StiLegendDirectionRightToLeft":"Right to Left","StiLegendDirectionTopToBottom":"Top to Bottom","StiLegendHorAlignmentCenter":"Center","StiLegendHorAlignmentLeft":"Left","StiLegendHorAlignmentLeftOutside":"Left Outside","StiLegendHorAlignmentRight":"Right","StiLegendHorAlignmentRightOutside":"Right Outside","StiLegendVertAlignmentBottom":"Bottom","StiLegendVertAlignmentBottomOutside":"Bottom Outside","StiLegendVertAlignmentCenter":"Center","StiLegendVertAlignmentTop":"Top","StiLegendVertAlignmentTopOutside":"Top Outside","StiLineWeightNormal":"Normal","StiLineWeightThick":"Thick","StiLineWeightThin":"Thin","StiMapModeChoropleth":"Choropleth","StiMapModeOnline":"Online","StiMapTypeGroup":"Group","StiMapTypeHeatmap":"Heatmap","StiMapTypeHeatmapWithGroup":"Heatmap With Group","StiMapTypeIndividual":"Individual","StiMapTypeNone":"None","StiMapTypePoints":"Points","StiMarkerAlignmentCenter":"Center","StiMarkerAlignmentLeft":"Left","StiMarkerAlignmentRight":"Right","StiMarkerTypeCircle":"Circle","StiMarkerTypeHalfCircle":"Half Circle","StiMarkerTypeHexagon":"Hexagon","StiMarkerTypeRectangle":"Rectangle","StiMarkerTypeStar5":"Star 5","StiMarkerTypeStar6":"Star 6","StiMarkerTypeStar7":"Star 7","StiMarkerTypeStar8":"Star 8","StiMarkerTypeTriangle":"Triangle","StiNestedFactorHigh":"High","StiNestedFactorLow":"Low","StiNestedFactorNormal":"Normal","StiNumberOfPassDoublePass":"Double Pass","StiNumberOfPassSinglePass":"Single Pass","StiOnlineMapHeatmapColorGradientTypeAddRange":"Add Range","StiOnlineMapHeatmapColorGradientTypeBlackAquaWhite":"Black Aqua White","StiOnlineMapHeatmapColorGradientTypeBlueRed":"Blue Red","StiOnlineMapHeatmapColorGradientTypeColorSpectrum":"Color Spectrum","StiOnlineMapHeatmapColorGradientTypeDeepSea":"Deep Sea","StiOnlineMapHeatmapColorGradientTypeHeatedMetal":"Heated Metal","StiOnlineMapHeatmapColorGradientTypeIncandescent":"Incandescent","StiOnlineMapHeatmapColorGradientTypeSteppedColors":"Stepped Colors","StiOnlineMapHeatmapColorGradientTypeSunrise":"Sunrise","StiOnlineMapHeatmapColorGradientTypeVisibleSpectrum":"Visible Spectrum","StiOnlineMapLocationTypeAdminDivision1":"AdminDivision1","StiOnlineMapLocationTypeAdminDivision2":"AdminDivision2","StiOnlineMapLocationTypeAuto":"Auto","StiOnlineMapLocationTypeCountryRegion":"CountryRegion","StiOnlineMapLocationTypeNeighborhood":"Neighborhood","StiOnlineMapLocationTypePopulatedPlace":"PopulatedPlace","StiOnlineMapLocationTypePostcode1":"Postcode1","StiOnlineMapLocationTypePostcode2":"Postcode2","StiOnlineMapLocationTypePostcode3":"Postcode3","StiOnlineMapLocationTypePostcode4":"Postcode4","StiOrientationHorizontal":"Horizontal","StiOrientationHorizontalRight":"Horizontal Right","StiOrientationVertical":"Vertical","StiPageOrientationLandscape":"Landscape","StiPageOrientationPortrait":"Portrait","StiPenStyleDash":"Dash","StiPenStyleDashDot":"Dash Dot","StiPenStyleDashDotDot":"Dash Dot Dot","StiPenStyleDot":"Dot","StiPenStyleDouble":"Double","StiPenStyleNone":"None","StiPenStyleSolid":"Solid","StiPlacementInside":"Inside","StiPlacementOutside":"Outside","StiPlacementOverlay":"Overlay","StiPlesseyCheckSumModulo10":"Modulo10","StiPlesseyCheckSumModulo11":"Modulo11","StiPlesseyCheckSumNone":"None","StiPreviewModeDotMatrix":"Dot-Matrix","StiPreviewModeStandard":"Standard","StiPreviewModeStandardAndDotMatrix":"Standard and Dot-Matrix","StiPrintOnEvenOddPagesTypeIgnore":"Ignore","StiPrintOnEvenOddPagesTypePrintOnEvenPages":"Print on Even Pages","StiPrintOnEvenOddPagesTypePrintOnOddPages":"Print on Odd Pages","StiPrintOnTypeAllPages":"All Pages","StiPrintOnTypeExceptFirstAndLastPage":"Except First and Last Page","StiPrintOnTypeExceptFirstPage":"Except First Page","StiPrintOnTypeExceptLastPage":"Except Last Page","StiPrintOnTypeOnlyFirstAndLastPage":"Only First and Last Page","StiPrintOnTypeOnlyFirstPage":"Only First Page","StiPrintOnTypeOnlyLastPage":"Only Last Page","StiProcessAtEndOfPage":"End of Page","StiProcessAtEndOfReport":"End of Report","StiProcessAtNone":"None","StiProcessingDuplicatesTypeBasedOnTagHide":"Hide based on Tag","StiProcessingDuplicatesTypeBasedOnTagMerge":"Merge based on Tag","StiProcessingDuplicatesTypeBasedOnTagRemoveText":"Remove Text based on Tag","StiProcessingDuplicatesTypeBasedOnValueAndTagHide":"Hide based on Value and Tag","StiProcessingDuplicatesTypeBasedOnValueAndTagMerge":"Merge based on Value and Tag","StiProcessingDuplicatesTypeBasedOnValueRemoveText":"Remove based on Value Text","StiProcessingDuplicatesTypeGlobalBasedOnValueAndTagHide":"Global Hide based on Value and Tag","StiProcessingDuplicatesTypeGlobalBasedOnValueAndTagMerge":"Global Merge based on Value and Tag","StiProcessingDuplicatesTypeGlobalBasedOnValueRemoveText":"Global Remove based on Value Text","StiProcessingDuplicatesTypeGlobalHide":"Global Hide","StiProcessingDuplicatesTypeGlobalMerge":"Global Merge","StiProcessingDuplicatesTypeGlobalRemoveText":"Global Remove Text","StiProcessingDuplicatesTypeHide":"Hide","StiProcessingDuplicatesTypeMerge":"Merge","StiProcessingDuplicatesTypeNone":"None","StiProcessingDuplicatesTypeRemoveText":"Remove Text","StiProgressElementModeCircle":"Circle","StiProgressElementModeDataBars":"DataBars","StiProgressElementModePie":"Pie","StiQRCodeBodyShapeTypeCircle":"Circle","StiQRCodeBodyShapeTypeCircular":"Circular","StiQRCodeBodyShapeTypeDiamond":"Diamond","StiQRCodeBodyShapeTypeDockedDiamonds":"Docked Diamonds","StiQRCodeBodyShapeTypeDot":"Dot","StiQRCodeBodyShapeTypeRoundedSquare":"Rounded Square","StiQRCodeBodyShapeTypeSquare":"Square","StiQRCodeBodyShapeTypeStar":"Star","StiQRCodeBodyShapeTypeZebraCross":"Zebra Cross","StiQRCodeBodyShapeTypeZebraHorizontal":"Zebra Horizontal","StiQRCodeBodyShapeTypeZebraVertical":"Zebra Vertical","StiQRCodeEyeBallShapeTypeCircle":"Circle","StiQRCodeEyeBallShapeTypeDots":"Dots","StiQRCodeEyeBallShapeTypeRound":"Round","StiQRCodeEyeBallShapeTypeSquare":"Square","StiQRCodeEyeBallShapeTypeStar":"Star","StiQRCodeEyeBallShapeTypeZebraHorizontal":"Zebra Horizontal","StiQRCodeEyeBallShapeTypeZebraVertical":"Zebra Vertical","StiRadarStyleXFCircle":"Circle","StiRadarStyleXFPolygon":"Polygon","StiReportCacheModeAuto":"Auto","StiReportCacheModeOff":"Off","StiReportCacheModeOn":"On","StiReportUnitTypeCentimeters":"Centimeters","StiReportUnitTypeHundredthsOfInch":"Hundredths of Inch","StiReportUnitTypeInches":"Inches","StiReportUnitTypeMillimeters":"Millimeters","StiReportUnitTypePixels":"Pixels","StiRestrictionsAll":"All","StiRestrictionsAllowChange":"Allow Change","StiRestrictionsAllowDelete":"Allow Delete","StiRestrictionsAllowMove":"Allow Move","StiRestrictionsAllowResize":"Allow Resize","StiRestrictionsAllowSelect":"Allow Select","StiRestrictionsNone":"None","StiSelectionModeFirst":"First","StiSelectionModeFromVariable":"From Variable","StiSelectionModeNothing":"Nothing","StiSeriesLabelsValueTypeArgument":"Argument","StiSeriesLabelsValueTypeArgumentValue":"Argument - Value","StiSeriesLabelsValueTypeSeriesTitle":"Series Title","StiSeriesLabelsValueTypeSeriesTitleArgument":"Series Title - Argument","StiSeriesLabelsValueTypeSeriesTitleValue":"Series Title - Value","StiSeriesLabelsValueTypeTag":"Tag","StiSeriesLabelsValueTypeValue":"Value","StiSeriesLabelsValueTypeValueArgument":"Value - Argument","StiSeriesLabelsValueTypeWeight":"Weight","StiSeriesSortDirectionAscending":"Ascending","StiSeriesSortDirectionDescending":"Descending","StiSeriesSortTypeArgument":"Argument","StiSeriesSortTypeNone":"None","StiSeriesSortTypeValue":"Value","StiSeriesXAxisBottomXAxis":"Bottom X Axis","StiSeriesXAxisTopXAxis":"Top X Axis","StiSeriesYAxisLeftYAxis":"Left Y Axis","StiSeriesYAxisRightYAxis":"Right Y Axis","StiShapeDirectionDown":"Down","StiShapeDirectionLeft":"Left","StiShapeDirectionRight":"Right","StiShapeDirectionUp":"Up","StiShiftModeDecreasingSize":"Decreasing Size","StiShiftModeIncreasingSize":"Increasing Size","StiShiftModeNone":"None","StiShiftModeOnlyInWidthOfComponent":"Only in Width of Component","StiShowSeriesLabelsFromChart":"From Chart","StiShowSeriesLabelsFromSeries":"From Series","StiShowSeriesLabelsNone":"None","StiShowXAxisBoth":"Both","StiShowXAxisBottom":"Bottom","StiShowXAxisCenter":"Center","StiShowYAxisBoth":"Both","StiShowYAxisCenter":"Center","StiShowYAxisLeft":"Left","StiSignatureTypeDigitalSignature":"Digital Signature","StiSignatureTypeDraw":"Draw","StiSignatureTypeType":"Type","StiSizeModeAutoSize":"Auto Size","StiSizeModeFit":"Fit","StiSortDirectionAsc":"Ascending","StiSortDirectionDesc":"Descending","StiSortDirectionNone":"None","StiSortTypeByDisplayValue":"by Display Value","StiSortTypeByValue":"by Value","StiSqlSourceTypeStoredProcedure":"Stored Procedure","StiSqlSourceTypeTable":"Query","StiStyleComponentTypeChart":"Chart","StiStyleComponentTypeCheckBox":"Check Box","StiStyleComponentTypeCrossTab":"Cross-Tab","StiStyleComponentTypeImage":"Image","StiStyleComponentTypePrimitive":"Primitive","StiStyleComponentTypeText":"Text","StiStyleConditionTypeComponentName":"Component Name","StiStyleConditionTypeComponentType":"Component Type","StiStyleConditionTypeLocation":"Location","StiStyleConditionTypePlacement":"Placement","StiSummaryValuesAllValues":"All Values","StiSummaryValuesSkipNulls":"Skip Nulls","StiSummaryValuesSkipZerosAndNulls":"Skip Zeros and Nulls","StiTablceCellTypeCheckBox":"CheckBox","StiTablceCellTypeImage":"Image","StiTablceCellTypeRichText":"RichText","StiTablceCellTypeText":"Text","StiTableAutoWidthNone":"None","StiTableAutoWidthPage":"Page","StiTableAutoWidthTable":"Table","StiTableAutoWidthTypeFullTable":"Full Table","StiTableAutoWidthTypeLastColumns":"Last Columns","StiTableAutoWidthTypeNone":"None","StiTargetModePercentage":"Percentage","StiTargetModeVariation":"Variation","StiTextHorAlignmentCenter":"Center","StiTextHorAlignmentLeft":"Left","StiTextHorAlignmentRight":"Right","StiTextHorAlignmentWidth":"Width","StiTextPositionCenterBottom":"Center Bottom","StiTextPositionCenterTop":"Center Top","StiTextPositionLeftBottom":"Left Bottom","StiTextPositionLeftTop":"Left Top","StiTextPositionRightBottom":"Right Bottom","StiTextPositionRightTop":"Right Top","StiTextQualityStandard":"Standard","StiTextQualityTypographic":"Typographic","StiTextQualityWysiwyg":"Wysiwyg","StiTextSizeModeFit":"Fit","StiTextSizeModeTrimming":"Trimming","StiTextSizeModeWordWrap":"Word Wrap","StiTimeDateStepDay":"Day","StiTimeDateStepHour":"Hour","StiTimeDateStepMinute":"Minute","StiTimeDateStepMonth":"Month","StiTimeDateStepNone":"None","StiTimeDateStepSecond":"Second","StiTimeDateStepYear":"Year","StiTitlePositionInside":"Inside","StiTitlePositionOutside":"Outside","StiTopNModeBottom":"Bottom","StiTopNModeNone":"None","StiTopNModeTop":"Top","StiTypeModeList":"List","StiTypeModeNullableValue":"Nullable Value","StiTypeModeRange":"Range","StiTypeModeValue":"Value","StiUnitAlignmentPrefix":"Prefix","StiUnitAlignmentPrefixInside":"Prefix Inside","StiUnitAlignmentPrefixInsideWithSpace":"Prefix Inside with Space","StiUnitAlignmentSuffix":"Suffix","StiUnitAlignmentSuffixInside":"Suffix Inside","StiUnitAlignmentSuffixInsideWithSpace":"Suffix Inside with Space","StiVertAlignmentBottom":"Bottom","StiVertAlignmentCenter":"Center","StiVertAlignmentTop":"Top","StiViewModeNormal":"Normal","StiViewModePageBreakPreview":"Page Break Preview","StiXmlTypeAdoNetXml":"ADO.NET XML","StiXmlTypeXml":"XML","StringAlignmentCenter":"Center","StringAlignmentFar":"Far","StringAlignmentNear":"Near","StringTrimmingCharacter":"Character","StringTrimmingEllipsisCharacter":"Ellipsis Character","StringTrimmingEllipsisPath":"Ellipsis Path","StringTrimmingEllipsisWord":"Ellipsis Word","StringTrimmingNone":"None","StringTrimmingWord":"Word"},"PropertyEvents":{"AfterPrintEvent":"After Print","AfterSelectEvent":"After Select","BeforePrintEvent":"Before Print","BeginRenderEvent":"Begin Render","CheckedChangedEvent":"Checked Changed","ClickEvent":"Click","ClosedFormEvent":"Closed Form","ClosingFormEvent":"Closing Form","ColumnBeginRenderEvent":"Column Begin Render","ColumnEndRenderEvent":"Column End Render","ConnectedEvent":"ConnectedEvent","ConnectingEvent":"ConnectingEvent","DisconnectedEvent":"Disconnected","DisconnectingEvent":"Disconnecting","DoubleClickEvent":"Double Click","EndRenderEvent":"End Render","EnterEvent":"Enter","ExportedEvent":"Exported","ExportingEvent":"Exporting","FillParametersEvent":"Fill Parameters","GetArgumentEvent":"Get Argument","GetBarCodeEvent":"Get BarCode","GetBookmarkEvent":"Get Bookmark","GetCheckedEvent":"Get Checked","GetCollapsedEvent":"Get Collapsed","GetCrossValueEvent":"Get Cross Value","GetCutPieListEvent":"Get Cut Pie List","GetDataUrlEvent":"Get DataUrl","GetDisplayCrossValueEvent":"Get Display Cross Value","GetDrillDownReportEvent":"Get Drill-Down Report","GetExcelSheetEvent":"Get Excel Sheet","GetExcelValueEvent":"Get Excel Value","GetHyperlinkEvent":"Get Hyperlink","GetImageDataEvent":"Get Image Data","GetImageURLEvent":"Get Image URL","GetListOfArgumentsEvent":"Get List of Arguments","GetListOfHyperlinksEvent":"Get List of Hyperlinks","GetListOfTagsEvent":"Get List of Tags","GetListOfToolTipsEvent":"Get List of Tool Tips","GetListOfValuesEndEvent":"Get List of Values End","GetListOfValuesEvent":"Get List of Values","GetListOfWeights":"Get List of Weights","GetListOfWeightsEvent":"Get List of Weights","GetPointerEvent":"Get Pointer","GetSummaryExpressionEvent":"Get Summary Expression","GetTagEvent":"Get Tag","GetTitleEvent":"Get Title","GetToolTipEvent":"Get Tool Tip","GetValueEndEvent":"Get Value End","GetValueEvent":"Get Value","GetWeightEvent":"Get Weight","LeaveEvent":"Leave","LoadFormEvent":"Load Form","MouseDownEvent":"Mouse Down","MouseEnterEvent":"Mouse Enter","MouseLeaveEvent":"Mouse Leave","MouseMoveEvent":"Mouse Move","MouseUpEvent":"Mouse Up","NewAutoSeriesEvent":"New Auto Series","PositionChangedEvent":"Position Changed","PrintedEvent":"Printed","PrintingEvent":"Printing","ProcessCellEvent":"Process Cell","ProcessChartEvent":"Process Chart","RenderingEvent":"Rendering","ReportCacheProcessingEvent":"Report Cache Processing","SelectedIndexChangedEvent":"Selected Index Changed","StateRestoreEvent":"State Restore","StateSaveEvent":"State Save","ValueChangedEvent":"Value Changed"},"PropertyHatchStyle":{"BackwardDiagonal":"Backward Diagonal","Cross":"Cross","DarkDownwardDiagonal":"Dark Downward Diagonal","DarkHorizontal":"Dark Horizontal","DarkUpwardDiagonal":"Dark Upward Diagonal","DarkVertical":"Dark Vertical","DashedDownwardDiagonal":"Dashed Downward Diagonal","DashedHorizontal":"Dashed Horizontal","DashedUpwardDiagonal":"Dashed Upward Diagonal","DashedVertical":"Dashed Vertical","DiagonalBrick":"Diagonal Brick","DiagonalCross":"Diagonal Cross","Divot":"Divot","DottedDiamond":"Dotted Diamond","DottedGrid":"Dotted Grid","ForwardDiagonal":"Forward Diagonal","Horizontal":"Horizontal","HorizontalBrick":"Horizontal Brick","LargeCheckerBoard":"Large Checker Board","LargeConfetti":"Large Confetti","LargeGrid":"Large Grid","LightDownwardDiagonal":"Light Downward Diagonal","LightHorizontal":"Light Horizontal","LightUpwardDiagonal":"Light Upward Diagonal","LightVertical":"Light Vertical","NarrowHorizontal":"Narrow Horizontal","NarrowVertical":"Narrow Vertical","OutlinedDiamond":"Outlined Diamond","Percent05":"Percent05","Percent10":"Percent10","Percent20":"Percent20","Percent25":"Percent25","Percent30":"Percent30","Percent40":"Percent40","Percent50":"Percent50","Percent60":"Percent60","Percent70":"Percent70","Percent75":"Percent75","Percent80":"Percent80","Percent90":"Percent90","Plaid":"Plaid","Shingle":"Shingle","SmallCheckerBoard":"Small Checker Board","SmallConfetti":"Small Confetti","SmallGrid":"Small Grid","SolidDiamond":"Solid Diamond","Sphere":"Sphere","Trellis":"Trellis","Vertical":"Vertical","Wave":"Wave","Weave":"Weave","WideDownwardDiagonal":"Wide Downward Diagonal","WideUpwardDiagonal":"Wide Upward Diagonal","ZigZag":"Zig Zag"},"PropertyMain":{"AcceptsReturn":"Accepts Return","AcceptsTab":"Accepts Tab","Actual":"Actual","AddClearZone":"Add Clear Zone","Advanced":"Advanced","AggregateFunction":"Aggregate Function","AggregateFunctions":"Aggregate Functions","Alias":"Alias","Alignment":"Alignment","AllowApplyBorderColor":"Allow Apply Border Color","AllowApplyBrush":"Allow Apply Brush","AllowApplyBrushNegative":"Allow Apply Brush Negative","AllowApplyColorNegative":"Allow Apply Color Negative","AllowApplyLineColor":"Allow Apply Line Color","AllowApplyStyle":"Allow Apply Style","AllowExpressions":"Allow Expressions","AllowHtmlTags":"Allow HTML Tags","AllowNull":"Allow Null","AllowSeries":"Allow Series","AllowSeriesElements":"Allow Series Elements","AllowSorting":"Allow Sorting","AllowUseBackColor":"Allow Use Back Color","AllowUseBorder":"Allow Use Border","AllowUseBorderFormatting":"Allow Use Border Formatting","AllowUseBorderSides":"Allow Use Border Sides","AllowUseBorderSidesFromLocation":"Allow Use Border Sides from Location","AllowUseBrush":"Allow Use Brush","AllowUseFont":"Allow Use Font","AllowUseForeColor":"Allow Use Fore Color","AllowUseHorAlignment":"Allow Use Hor Alignment","AllowUseImage":"Allow Use Image","AllowUseNegativeTextBrush":"Allow Use Negative Text Brush","AllowUserValues":"Allow User Values","AllowUseTextBrush":"Allow Use Text Brush","AllowUseTextFormat":"Allow Use Text Format","AllowUseTextOptions":"Allow Use Text Options","AllowUseVertAlignment":"Allow Use Vert Alignment","AllowUsingAsSqlParameter":"Allow using as SQL parameter","AlternatingBackColor":"Alternating Back Color","AlternatingCellBackColor":"Alternating Cell Back Color","AlternatingCellForeColor":"Alternating Cell Fore Color","AlternatingDataColor":"Alternating Data Color","AlternatingDataForeground":"Alternating Data Foreground","Always":"Always","Anchor":"Anchor","Angle":"Angle","Antialiasing":"Antialiasing","Apply":"Apply","Area":"Area","Argument":"Argument","ArgumentDataColumn":"Argument Data Column","ArgumentFormat":"Argument Format","Arguments":"Arguments","ArrowHeight":"Arrow Height","ArrowStyle":"Arrow Style","ArrowWidth":"Arrow Width","AspectRatio":"Aspect Ratio","Author":"Author","Auto":"Auto","AutoCalculateCenterPoint":"Auto Calculate Center Point","AutoDataColumns":"Auto Data Columns","AutoDataRows":"Auto Data Rows","AutoLocalizeReportOnRun":"Auto Localize Report on Run","AutoRefresh":"Auto Refresh","AutoRotate":"Auto Rotate","AutoScale":"Auto Scale","AutoSeriesColorDataColumn":"Auto Series Color Data Column","AutoSeriesKeyDataColumn":"Auto Series Key Data Column","AutoSeriesTitleDataColumn":"Auto Series Title Data Column","AutoWidth":"Auto Width","AutoWidthType":"Auto Width Type","AvailableInTheViewer":"Available in the Viewer","AxisLabelsColor":"Axis Labels Color","AxisLineColor":"Axis Line Color","AxisTitleColor":"Axis Title Color","AxisValue":"Axis Value","BackColor":"Back Color","Background":"Background","BackgroundColor":"Background Color","BandColor":"Band Color","BarCodeType":"Bar Code Type","BasicStyleColor":"Basic Style Color","Blend":"Blend","Blocks":"Blocks","BodyBrush":"Body Brush","BodyShape":"Body Shape","Bold":"Bold","Bookmark":"Bookmark","Border":"Border","BorderBrush":"Border Brush","BorderColor":"Border Color","BorderColorNegative":"Border Color Negative","Borders":"Borders","BorderSize":"Border Size","BorderStyle":"Border Style","BorderThickness":"Border Thickness","BorderWidth":"Border Width","Bottom":"Bottom","BottomLeft":"Bottom-Left","BottomRight":"Bottom-Right","BottomSide":"Bottom Side","BreakIfLessThan":"Break if Less Than","Brush":"Brush","BrushNegative":"Brush Negative","BrushType":"Brush Type","BubbleBackColor":"Bubble Back Color","BubbleBorderColor":"Bubble Border Color","BusinessObject":"Business Object","CacheAllData":"Cache All Data","CacheTotals":"Cache Totals","CalcInvisible":"Calc Invisible","CalculatedDataColumn":"Calculated Data Column","CalculationMode":"Calculation Mode","CanBreak":"Can Break","Cancel":"Cancel","CanGrow":"Can Grow","CanShrink":"Can Shrink","Categories":"Categories","Category":"Category","CategoryConnections":"Connections","CellAlignment":"Cell Alignment","CellBackColor":"Cell Back Color","CellDockStyle":"Cell Dock Style","CellForeColor":"Cell Fore Color","CellHeight":"Cell Height","CellType":"Cell Type","CellWidth":"Cell Width","Center":"Center","CenterPoint":"Center Point","ChartAreaBorderColor":"Chart Area Border Color","ChartAreaBrush":"Chart Area Brush","ChartAreaShowShadow":"Chart Area Show Shadow","ChartType":"Chart Type","CheckAlignment":"Check Alignment","CheckColor":"Check Color","Checked":"Checked","CheckedIcon":"Checked Icon","CheckOnClick":"Check on Click","CheckStyle":"Check Style","CheckStyleForFalse":"Check Style for False","CheckStyleForTrue":"Check Style for True","Checksum":"Checksum","CheckSum":"CheckSum","CheckSum1":"CheckSum1","CheckSum2":"CheckSum2","Child":"Child","ChildColumns":"Child Columns","ChildSource":"Child Source","City":"City","ClearFormat":"Clear Format","CloneContainer":"Clone Container","CloseValues":"Close Values","Code":"Code","CodePage":"Code Page","Collapsed":"Collapsed","CollapseGroupFooter":"Collapse Group Footer","CollapsingEnabled":"Collapsing Enabled","Collate":"Collate","CollectionName":"Collection Name","Color":"Color","ColorDataColumn":"Color Data Column","ColorEach":"Color Each","ColorMeter":"Color Meter","Colors":"Colors","ColorScaleCondition":"Color Scale Condition","ColorScaleType":"Color Scale Type","Column":"Column","ColumnCount":"Column Count","ColumnDirection":"Column Direction","ColumnGaps":"Column Gaps","ColumnHeaderBackColor":"Column Header Back Color","ColumnHeaderForeColor":"Column Header Fore Color","ColumnHeadersVisible":"Column Headers Visible","Columns":"Columns","ColumnShape":"Column Shape","ColumnWidth":"Column Width","CommandTimeout":"Command Timeout","CompanyPrefix":"Company Prefix","ComponentStyle":"Component Style","Condition":"Condition","ConditionOptions":"Condition Options","Conditions":"Conditions","ConnectionString":"Connection String","ConnectOnStart":"Connect on Start","ConstantLines":"Constant Lines","Container":"Container","ContentAlignment":"Content Alignment","ContinuousText":"Continuous Text","ContourColor":"Contour Color","Converting":"Converting","ConvertNulls":"Convert Nulls","Copies":"Copies","CornerRadius":"Corner Radius","Count":"Count","CountData":"Count Data","Country":"Country","Create":"Create","CreateFieldOnDoubleClick":"Create Field on Double Click","CreateLabel":"Create Label","CrossFiltering":"Cross-Filtering","Culture":"Culture","CustomFonts":"Custom Fonts","CustomFormat":"Custom Format","CutPieList":"Cut Pie List","Data":"Data","DataAdapter":"Data Adapter","DataAdapters":"Data Adapters","DataBarCondition":"Data Bar Condition","DataBindings":"Data Bindings","DataCells":"Data Cells","DataColor":"Data Color","DataColumn":"Data Column","DataColumns":"Data Columns","DataField":"Data Field","DataForeground":"Data Foreground","DataRelation":"Data Relation","DataRows":"Data Rows","DataSource":"Data Source","DataSources":"Data Sources","DataTextField":"Data Text Field","DataTransformation":"Data Transformation","DataType":"Data Type","DataUrl":"Data URL","DateInfo":"Date Info","DateTimeMode":"DateTime Mode","DateTimeStep":"Date Time Step","Default":"Default","DefaultColor":"Default Color","DefaultHeightCell":"Default Height of Cell","DefaultNamespace":"Default Namespace","DependentColumn":"Dependent Column","DependentValue":"Dependent Value","Description":"Description","Destination":"Destination","DetectUrls":"Detect URLs","DeviceWidth":"Device Width","DialogResult":"Dialog Result","Diameter":"Diameter","Direction":"Direction","Disabled":"Disabled","DisplayNameType":"Display Name Type","DisplayValue":"Display Value","Distance":"Distance","DistanceBetweenTabs":"Distance Between Tabs","Dock":"Dock","DockableTable":"Dockable Table","DockStyle":"Dock Style","DrawBorder":"Draw Border","DrawHatch":"Draw Hatch","DrawLine":"Draw Line","DrillDown":"Drill-Down","DrillDownEnabled":"Drill-Down Enabled","DrillDownMode":"Drill-Down Mode","DrillDownPage":"Drill-Down Page","DrillDownParameter1":"Drill-Down Parameter 1","DrillDownParameter2":"Drill-Down Parameter 2","DrillDownParameter3":"Drill-Down Parameter 3","DrillDownParameter4":"Drill-Down Parameter 4","DrillDownParameter5":"Drill-Down Parameter 5","DrillDownParameters":"Drill-Down Parameters","DrillDownReport":"Drill-Down Report","DropDownAlign":"Drop Down Align","DropDownStyle":"Drop Down Style","DropDownWidth":"Drop Down Width","DropShadow":"Drop Shadow","Duplex":"Duplex","Editable":"Editable","Effects":"Effects","EmptyBorderBrush":"Empty Border Brush","EmptyBorderWidth":"Empty Border Width","EmptyBrush":"Empty Brush","EmptyValue":"Empty Value","Enabled":"Enabled","EnableLog":"Enabled Log","EncodingMode":"Encoding Mode","EncodingType":"Encoding Type","EndCap":"End Cap","EndColor":"End Color","EndValue":"End Value","EndValues":"End Values","EndWidth":"End Width","EngineVersion":"Engine Version","EnumeratorSeparator":"Enumerator Separator","EnumeratorType":"Enumerator Type","ErrorCorrectionLevel":"Error Correction Level","ErrorsCorrectionLevel":"Errors Correction Level","EvenStyle":"Even Style","ExceedMargins":"Exceed Margins","ExcelSheet":"Excel Sheet","ExcelValue":"Excel Value","Expand":"Expand","Exponential":"Exponential","ExportAsImage":"Export as Image","Expression":"Expression","ExtensionDigit":"Extension Digit","EyeBallBrush":"Eye Ball Brush","EyeBallShape":"Eye Ball Shape","EyeFrameBrush":"Eye Frame Brush","EyeFrameShape":"Eye Frame Shape","FaqPage":"FAQ Page","Field":"Field","FieldIs":"Field Is","Fifth":"Fifth","File":"File","Fill":"Fill","FillColor":"Fill Color","Filter":"Filter","FilterElements":"Filter Elements","FilterEngine":"Filter Engine","FilterMode":"Filter Mode","FilterOn":"Filter On","Filters":"Filters","First":"First","FirstTabOffset":"First Tab Offset","FixedWidth":"Fixed Width","Flat":"Flat","FlatMode":"Flat Mode","Focus":"Focus","Font":"Font","FontBold":"Font Bold","FontItalic":"Font Italic","FontName":"Font Name","FontSize":"Font Size","FontSizeMode":"Font Size Mode","FontStrikeout":"Font Strikeout","FontSubscript":"Subscript","FontSuperscript":"Superscript","FontUnderline":"Font Underline","FontUnit":"Font Unit","FooterCanBreak":"Footer Can Break","FooterCanGrow":"Footer Can Grow","FooterCanShrink":"Footer Can Shrink","FooterColor":"Footer Color","FooterFont":"Footer Font","FooterForeColor":"Footer Fore Color","FooterForeground":"Footer Foreground","FooterPrintAtBottom":"Footer Print At Bottom","FooterPrintIfEmpty":"Footer Print If Empty","FooterPrintOn":"Footer Print On","FooterPrintOnAllPages":"Footer Print On All Pages","FooterPrintOnEvenOddPages":"Footer Print On Even Odd Pages","FooterRowsCount":"Footer Rows Count","Footers":"Footers","ForeColor":"Fore Color","Format":"Format","FormSettings":"Form Settings","Fourth":"Fourth","From":"From","FrozenColumns":"Frozen Columns","FullConvertExpression":"Full Convert Expression","FullName":"Full Name","Function":"Function","Functions":"Functions","GisSettings":"Gis Settings","GlobalizationStrings":"Globalization Strings","GlobalizedName":"Globalized Name","GlyphColor":"Glyph Color","GridColor":"Grid Color","GridColumns":"Grid Columns","GridLineColor":"Grid Line Color","GridLinesHor":"Grid Lines Horizontal","GridLinesHorColor":"Grid Lines Horizontal Color","GridLinesHorRight":"Grid Lines Horizontal Right","GridLineStyle":"Grid Line Style","GridLinesVert":"Grid Lines Vertical","GridLinesVertColor":"Grid Lines Vertical Color","GridOutline":"Grid Outline","GridVerticalStep":"Grid Vertical Step","Group":"Group","GroupDataColumn":"Group Data Column","GroupMeter":"Group Meter","GrowToHeight":"Grow to Height","Header":"Header","HeaderAlignment":"Header Alignment","HeaderBackColor":"Header Back Color","HeaderCanBreak":"Header Can Break","HeaderCanGrow":"Header Can Grow","HeaderCanShrink":"Header Can Shrink","HeaderColor":"Header Color","HeaderFont":"Header Font","HeaderForeColor":"Header Fore Color","HeaderForeground":"Header Foreground","HeaderPrintAtBottom":"Header Print At Bottom","HeaderPrintIfEmpty":"Header Print If Empty","HeaderPrintOn":"Header Print On","HeaderPrintOnAllPages":"Header Print On All Pages","HeaderPrintOnEvenOddPages":"Header Print On Even Odd Pages","HeaderRowsCount":"Header Rows Count","Headers":"Headers","HeaderText":"Header Text","Heading":"Heading","Heatmap":"Heatmap","HeatmapColors":"Heatmap Colors","HeatmapWithGroup":"Heatmap With Group","Height":"Height","HideSeriesWithEmptyTitle":"Hide Series with Empty Title","HideZeros":"Hide Zeros","High":"High","HighlightCondition":"Highlight Condition","HighValues":"High Values","HorAlignment":"Horizontal Alignment","HorSpacing":"Horizontal Spacing","HotBackColor":"Hot Back Color","HotColumnHeaderBackColor":"Hot Column Header Back Color","HotForeColor":"Hot Fore Color","HotGlyphColor":"Hot Glyph Color","HotHeaderColor":"Hot Header Color","HotkeyPrefix":"Hotkey Prefix","HotRowHeaderBackColor":"Hot Row Header Back Color","HotSelectedBackColor":"Hot Selected Back Color","HotSelectedForeColor":"Hot Selected Fore Color","HotSelectedGlyphColor":"Hot Selected Glyph Color","HtmlPreviewMode":"HTML Preview Mode","HtmlTags":"HTML Tags","Hyperlink":"Hyperlink","HyperlinkDataColumn":"Hyperlink Data Column","HyperlinkPattern":"Hyperlink Pattern","Icon":"Icon","IconAlignment":"Icon Alignment","IconBrush":"Icon Brush","IconColor":"Icon Color","IconSet":"Icon Set","IconSetCondition":"Icon Set Condition","Idents":"Indents","Image":"Image","ImageAlign":"Image Align","ImageAlignment":"Image Alignment","ImageData":"Image Data","ImageHorAlignment":"Image Horizontal Alignment","ImageMultipleFactor":"Image Multiple Factor","ImageRotation":"Image Rotation","ImageStretch":"Image Stretch","ImageTiling":"Image Tiling","ImageTransparency":"Image Transparency","ImageURL":"Image URL","ImageVertAlignment":"Image Vertical Alignment","ImportRelations":"Import Relations","Increment":"Increment","Indent":"Indent","IndividualColor":"Individual Color","InitBy":"Init by","Initials":"Initials","InitialSelection":"Initial Selection","InitialSelectionSource":"Initial Selection Source","InnerText":"Inner Text","Insert":"Insert","Interaction":"Interaction","InterlacedBrush":"Interlaced Brush","InterlacingHor":"Interlacing Horizontal","InterlacingHorBrush":"Interlacing Horizontal Brush","InterlacingVert":"Interlacing Vertical","InterlacingVertBrush":"Interlacing Vertical Brush","Interpolation":"Interpolation","IsReversed":"Is Reversed","Italic":"Italic","Item":"Item","ItemHeight":"Item Height","Items":"Items","KeepChildTogether":"Keep Child Together","KeepCrossTabTogether":"Keep Cross-Tab Together","KeepDetails":"Keep Details","KeepDetailsTogether":"Keep Details Together","KeepFooterTogether":"Keep Footer Together","KeepGroupFooterTogether":"Keep Group Footer Together","KeepGroupHeaderTogether":"Keep Group Header Together","KeepGroupTogether":"Keep Group Together","KeepHeaderTogether":"Keep Header Together","KeepMergedCellsTogether":"Keep Merged Cells Together","KeepReportSummaryTogether":"Keep Report Summary Together","KeepSubReportTogether":"Keep Sub-Report Together","Key":"Key","KeyDataColumn":"Key Data Column","KeyMeter":"Key Meter","KeyMeters":"Key Meters","Keys":"Keys","Label":"Label","LabelColor":"Label Color","LabelForeground":"Label Foreground","LabelRotationMode":"Label Rotation Mode","Labels":"Labels","LabelsColor":"Labels Color","LabelShadowForeground":"Label Shadow Foreground","LabelsOffset":"Labels Offset","Language":"Language","LargeHeight":"Large Height","LargeHeightFactor":"Large Height Factor","LaTexExpression":"LaTex Expression","Latitude":"Latitude","Layout":"Layout","Left":"Left","LeftSide":"Left Side","Legend":"Legend","LegendBorderColor":"Legend Border Color","LegendBrush":"Legend Brush","LegendLabelsColor":"Legend Labels Color","LegendTitleColor":"Legend Title Color","LegendValueType":"Legend Value Type","Length":"Length","LengthUnderLabels":"Length under Labels","Lighting":"Lighting","LimitRows":"Limit Rows","Linear":"Linear","LinearBarBorderBrush":"Linear Bar Border Brush","LinearBarBrush":"Linear Bar Brush","LinearBarEmptyBorderBrush":"Linear Bar Empty Border Brush","LinearBarEmptyBrush":"Linear Bar Empty Brush","LinearScaleBrush":"Linear Scale Brush","LineColor":"Line Color","LineColorNegative":"Line Color Negative","LineLength":"Line Length","LineLimit":"Line Limit","LineMarker":"Line Marker","LinesOfUnderline":"Lines of Underline","LineSpacing":"Line Spacing","LineStyle":"Line Style","LineWidth":"Line Width","Linked":"Linked","ListOfArguments":"List of Arguments","ListOfHyperlinks":"List of Hyperlinks","ListOfTags":"List of Tags","ListOfToolTips":"List of Tooltips","ListOfValues":"List of Values","ListOfValuesClose":"List of Values Close","ListOfValuesEnd":"List of Values End","ListOfValuesHigh":"List of Values High","ListOfValuesLow":"List of Values Low","ListOfValuesOpen":"List of Values Open","ListOfWeights":"List of Weights","Localizable":"Localizable","Location":"Location","Locked":"Locked","Logarithmic":"Logarithmic","LogarithmicScale":"Logarithmic Scale","Longitude":"Longitude","Low":"Low","LowValues":"Low Values","MajorInterval":"Major Interval","MapAfrica":"Africa","MapAsia":"Asia","MapCustom":"Custom","MapEurope":"Europe","MapID":"Map ID","MapNorthAmerica":"North America","MapOceania":"Oceania","MapPopularMaps":"Popular maps","Maps":"Maps","MapSouthAmerica":"South America","MapStyle":"Map Style","MapType":"Map Type","Margin":"Margin","Margins":"Margins","Marker":"Marker","MarkerAlignment":"Marker Alignment","MarkerAngle":"Marker Angle","MarkerBorder":"Marker Border","MarkerBrush":"Marker Brush","MarkerColor":"Marker Color","MarkerSize":"Marker Size","MarkerType":"Marker Type","MarkerVisible":"Marker Visible","MasterComponent":"Master Component","MasterKeyDataColumn":"Master Key Data Column","MatrixSize":"Matrix Size","MaxDate":"Max Date","MaxDropDownItems":"Max Drop Down Items","MaxHeight":"Max Height","Maximum":"Maximum","MaximumValue":"Maximum Value","MaxLength":"Max Length","MaxNumberOfLines":"Max Number of Lines","MaxSize":"Max Size","MaxValue":"Max Value","MaxWidth":"Max Width","MergeDuplicates":"Merge Duplicates","MergeHeaders":"Merge Headers","Mid":"Mid","MinDate":"Min Date","MinHeight":"Min Height","Minimum":"Minimum","MinimumFontSize":"Minimum Font Size","MinimumValue":"Minimum Value","MinorColor":"Minor Color","MinorCount":"Minor Count","MinorInterval":"Minor Interval","MinorLength":"Minor Length","MinorStyle":"Minor Style","MinorVisible":"Minor Visible","MinRowsInColumn":"Min Rows in Column","MinSize":"Min Size","MinValue":"Min Value","MinWidth":"Min Width","MirrorMargins":"Mirror Margins","Mode":"Mode","Module":"Module","Move":"Move","Multiline":"Multiline","MultipleFactor":"Multiple Factor","MultipleInitialization":"Multiple Initialization","Name":"Name","NameDataColumn":"Name Data Column","NameInSource":"Name in Source","NameMeter":"Name Meter","NameParent":"Parent Name","Namespaces":"Namespaces","NeedleBorderBrush":"Needle Border Brush","NeedleBorderWidth":"Needle Border Width","NeedleBrush":"Needle Brush","NeedleCapBorderBrush":"Needle Cap Border Brush","NeedleCapBrush":"Needle Cap Brush","Negative":"Negative","NegativeColor":"Negative Color","NegativeSeriesColors":"Negative Series Colors","NegativeTextBrush":"Negative Text Brush","NestedLevel":"Nested Level","NewColumnAfter":"New Column After","NewColumnBefore":"New Column Before","NewPageAfter":"New Page After","NewPageBefore":"New Page Before","NextPage":"Next Page","NoElements":"No Elements","NoIcon":"No Icon","NullText":"Null Text","NumberOfColumns":"Number of Columns","NumberOfCopies":"Number of Copies","NumberOfPass":"Number of Pass","NumberOfValues":"Number of Values","OddStyle":"Odd Style","Offset":"Offset","OffsetAngle":"Offset Angle","OnClick":"On Click","OnDataManipulation":"On Data Manipulation","OnHover":"On Hover","OnlyText":"Only Text","Opacity":"Opacity","OpenValues":"Open Values","Operation":"Operation","Options":"Options","Options3D":"Options 3D","Orientation":"Orientation","OthersText":"Others Text","Padding":"Padding","PageHeight":"Page Height","PageNumbers":"Page Numbers","PageWidth":"Page Width","Paper":"Paper","PaperSize":"Paper Size","PaperSourceOfFirstPage":"Paper Source of First Page","PaperSourceOfOtherPages":"Paper Source of Other Pages","Parameter":"Parameter","Parameters":"Parameters","ParametersDateFormat":"Parameters Date Format","ParametersOrientation":"Parameters Orientation","ParameterWidth":"Parameter Width","ParentColumns":"Parent Columns","ParentSource":"Parent Data Source","ParentValue":"Parent Value","ParetoSeriesColors":"Pareto Series Colors","PasswordChar":"Password Char","Path":"Path","PathData":"Path Data","PathSchema":"Path Schema","Pattern":"Pattern","PDFPreview":"PDF Preview","PenColor":"Pen Color","Placeholder":"Placeholder","Placement":"Placement","PlaceOnToolbox":"Place on Toolbox","PointAtCenter":"Point at Center","Position":"Position","Positive":"Positive","PositiveColor":"Positive Color","PreferredColumnWidth":"Preferred Column Width","PreferredRowHeight":"Preferred Row Height","PreventIntersection":"Prevent Intersection","PreviewMode":"Preview Mode","PreviewSettings":"Preview Settings","Printable":"Printable","PrintAtBottom":"Print at Bottom","PrinterName":"Printer Name","PrinterSettings":"Printer Settings","PrintHeadersFootersFromPreviousPage":"Print Headers and Footers from Previous Page","PrintIfDetailEmpty":"Print if Detail Empty","PrintIfEmpty":"Print if Empty","PrintIfParentDisabled":"Print if Parent Disabled","PrintOn":"Print on","PrintOnAllPages":"Print on All Pages","PrintOnEvenOddPages":"Print on Even Odd Pages","PrintOnPreviousPage":"Print on Previous Page","PrintTitleOnAllPages":"Print Title On All Pages","PrintVerticalBars":"Print Vertical Bars","ProcessAt":"Process at","ProcessAtEnd":"Process at End","ProcessingDuplicates":"Processing Duplicates","ProcessTilde":"Process Tilde","ProductHomePage":"Product Home Page","Property":"Property","Provider":"Provider","RadarStyle":"Radar Style","RadialBarBorderBrush":"Radial Bar Border Brush","RadialBarBrush":"Radial Bar Brush","RadialBarEmptyBorderBrush":"Radial Bar Empty Border Brush","RadialBarEmptyBrush":"Radial Bar Empty Brush","Radius":"Radius","RadiusMode":"Radius Mode","Range":"Range","RangeColorMode":"Range Color Mode","RangeFrom":"From","RangeMode":"Range Mode","RangeScrollEnabled":"Range Scroll Enabled","RangeTo":"To","RangeType":"Range Type","Ratio":"Ratio","RatioY":"Ratio Y","ReadOnly":"Read Only","RecentFonts":"Recent Fonts","ReconnectOnEachRow":"Reconnect on Each Row","ReferencedAssemblies":"Referenced Assemblies","Refresh":"Refresh","RefreshTime":"Refresh Time","Regular":"Regular","Relation":"Relation","RelationName":"Relation Name","Relations":"Relations","RelativeHeight":"Relative Height","RelativeWidth":"Relative Width","RemoveUnusedDataBeforeStart":"Remove Unused Data Before Start","RenderTo":"Render to","ReportAlias":"Report Alias","ReportAuthor":"Report Author","ReportCacheMode":"Report Cache Mode","ReportDescription":"Report Description","ReportIcon":"Report Icon","ReportImage":"Report Image","ReportName":"Report Name","ReportUnit":"Report Unit","RequestFromUser":"Request from User","RequestParameters":"Request Parameters","Required":"Required","ResetAllFilters":"Reset All Filters","ResetDataSource":"Reset Data Source","ResetPageNumber":"Reset Page Number","Resize":"Resize","Resource":"Resource","Resources":"Resources","Restrictions":"Restrictions","RetrieveOnlyUsedData":"Retrieve Only Used Data","ReturnValue":"Return Value","ReverseHor":"Reverse Horizontal","ReverseVert":"Reverse Vertical","Right":"Right","RightSide":"Right Side","RightToLeft":"Right to Left","Rotation":"Rotation","RotationLabels":"Rotation Labels","RotationMode":"Rotation Mode","Round":"Round","RoundValues":"Round Values","RowCount":"Row Count","RowHeaderBackColor":"Row Header Back Color","RowHeaderForeColor":"Row Header Fore Color","RowHeadersVisible":"Row Headers Visible","RowHeaderWidth":"Row Header Width","Rows":"Rows","Scale":"Scale","ScaleHor":"Scale Hor","ScriptLanguage":"Script Language","Second":"Second","SegmentPerHeight":"Segment per Height","SegmentPerWidth":"Segment per Width","SelectedBackColor":"Selected Back Color","SelectedCellBackColor":"Selected Cell Back Color","SelectedCellForeColor":"Selected Cell Fore Color","SelectedDataColor":"Selected Data Color","SelectedDataForeground":"Selected Data Foreground","SelectedForeColor":"Selected Fore Color","SelectedGlyphColor":"Selected Glyph Color","SelectedIndex":"Selected Index","SelectedItem":"Selected Item","SelectedKey":"Selected Key","SelectedValue":"Selected Value","Selection":"Selection","SelectionBackColor":"Selection Back Color","SelectionEnabled":"Selection Enabled","SelectionForeColor":"Selection Fore Color","SelectionMode":"Selection Mode","SelectStyle":"Select Style","SendType":"Send Type","SeparatorColor":"Separator Color","SerialNumber":"Serial Number","Series":"Series","SeriesBorderThickness":"Series Border Thickness","SeriesColors":"Series Colors","SeriesCornerRadius":"Series Corner Radius","SeriesLabels":"Series Labels","SeriesLabelsBorderColor":"Series Labels Border Color","SeriesLabelsBrush":"Series Labels Brush","SeriesLabelsColor":"Series Labels Color","SeriesLabelsLineColor":"Series Labels Line Color","SeriesLighting":"Series Lighting","SeriesShowBorder":"Series Show Border","SeriesShowShadow":"Series Show Shadow","SeriesTitle":"Series Title","Shadow":"Shadow","ShadowBrush":"Shadow Brush","ShadowColor":"Shadow Color","ShadowSize":"Shadow Size","ShapeType":"Shape Type","Shift":"Shift","ShiftMode":"Shift Mode","ShortName":"Short Name","ShortValue":"Short Value","ShowAllValue":"Show All Value","ShowBehind":"Show Behind","ShowBubble":"Show Bubble","ShowDialog":"Show Dialog","ShowEdgeValues":"Show Edge Values","ShowHyperlink":"Show Hyperlink","ShowImageBehind":"Show Image Behind","ShowInLegend":"Show in Legend","ShowInnerPoints":"Show Inner Points","ShowInPercent":"Show in Percent","ShowLabel":"Show Label","ShowLabels":"Show Labels","ShowLabelText":"Show Label Text","ShowLegend":"Show Legend","ShowMarker":"Show Marker","ShowMeanMarkers":"Show Mean Markers","ShowNulls":"Show Nulls","ShowOthers":"Show Others","ShowPercents":"Show Percents","ShowPlacemark":"Show Placemark","ShowQuietZoneIndicator":"Show Quiet Zone Indicator","ShowQuietZones":"Show Quiet Zones","ShowScrollBar":"Show Scroll Bar","ShowSelectAll":"Show Select All","ShowSeriesLabels":"Show Series Labels","ShowShadow":"Show Shadow","ShowTotal":"Show Total","ShowTotalSummary":"Show Total Summary","ShowUpDown":"Show Up Down","ShowValue":"Show Value","ShowXAxis":"Show X Axis","ShowYAxis":"Show Y Axis","ShowZeros":"Show Zeros","ShrinkFontToFit":"Shrink Font to Fit","ShrinkFontToFitMinimumSize":"Shrink Font to Fit Minimum Size","Side":"Side","SideBySide":"Side-by-Side","Sides":"Sides","SignatureType":"Type","Simple":"Simple","Size":"Size","SizeMode":"Size Mode","Skin":"Skin","SkipFirst":"Skip First","SkipIndices":"Skip Indices","SkipIndicesObj":"Skip Indices","SkipMajorValues":"Skip Major Values","SkipValues":"Skip Values","SkipValuesObj":"Skip Values","Smoothing":"Smoothing","Sort":"Sort","SortBy":"Sort by","SortDirection":"Sort Direction","Sorted":"Sorted","SortingColumn":"Sorting Column","SortingEnabled":"Sorting Enabled","SortLetters":"A-Z","SortType":"Sort Type","Space":"Space","SpaceRatio":"Space Ratio","Spacing":"Spacing","SqlCommand":"Sql Command","StartAngle":"Start Angle","StartCap":"Start Cap","StartColor":"Start Color","StartFromZero":"Start From Zero","StartMode":"Start Mode","StartNewPage":"Start New Page","StartNewPageIfLessThan":"Start New Page if Less Than","StartPosition":"Start Position","StartValue":"Start Value","StartWidth":"Start Width","State":"State","Step":"Step","Stop":"Stop","StopBeforePage":"Stop Before Page","StopBeforePrint":"Stop Before Print","StoreImagesInResources":"Store Images in Resources","StreetAddress":"Street Address","Stretch":"Stretch","StretchToPrintArea":"Stretch to Print Area","Strikeout":"Strikeout","StripBrush":"Strip Brush","Strips":"Strips","Stroke":"Stroke","StructuredAppendPosition":"Structured Append Position","StructuredAppendTotal":"Structured Append Total","Style":"Style","StyleColors":"Style Colors","Styles":"Styles","SubmissionMessage":"Submission Message","SubReportPage":"Sub Report","Summaries":"Summaries","Summary":"Summary","SummaryAlignment":"Summary Alignment","SummaryExpression":"Summary Expression","SummarySortDirection":"Summary Sort Direction","SummaryType":"Summary Type","SummaryValues":"Summary Values","SupplementCode":"Supplement Code","SupplementType":"Supplement Type","SweepAngle":"Sweep Angle","SystemFonts":"System Fonts","SystemVariable":"System Variable","SystemVariables":"System Variables","Table":"Table","Tag":"Tag","TagDataColumn":"Tag Data Column","TagValue":"Tag Value","Target":"Target","TargetColor":"Target Color","TargetIcon":"Target Icon","TargetMode":"Target Mode","TargetSettings":"Target","Tension":"Tension","Text":"Text","TextAfter":"Text After","TextAlign":"Text Align","TextAlignment":"Text Alignment","TextBefore":"Text Before","TextBrush":"Text Brush","TextColor":"Text Color","TextFormat":"Text Format","TextOnly":"Text Only","TextOptions":"Text Options","TextQuality":"Text Quality","Third":"Third","TickLabelMajorFont":"Tick Label Major Font","TickLabelMajorTextBrush":"Tick Label Major Text Brush","TickLabelMinorFont":"Tick Label Minor Font","TickLabelMinorTextBrush":"Tick Label Minor Text Brush","TickMarkMajorBorder":"Tick Mark Major Border","TickMarkMajorBorderWidth":"Tick Mark Major Border Width","TickMarkMajorBrush":"Tick Mark Major Brush","TickMarkMinorBorder":"Tick Mark Minor Border","TickMarkMinorBorderWidth":"Tick Mark Minor Border Width","TickMarkMinorBrush":"Tick Mark Minor Brush","Ticks":"Ticks","Title":"Title","TitleBeforeHeader":"Title Before Header","TitleColor":"Title Color","TitleDirection":"TitleDirection","TitleFont":"Title Font","TitleVisible":"Title Visible","To":"To","Today":"Today","ToolTip":"Tool Tip","ToolTipBorder":"Tool Tip Border","ToolTipBrush":"Tool Tip Brush","ToolTipCornerRadius":"Tool Tip Corner Radius","ToolTipDataColumn":"Tool Tip Data Column","ToolTipTextBrush":"Tool Tip Text Brush","Top":"Top","TopLeft":"Top-Left","Topmost":"Topmost","TopmostLine":"Topmost Line","TopN":"Top N","TopRight":"Top-Right","TopSide":"Top Side","Total":"Total","TotalCellColumnBackColor":"Total Cell Column Back Color","TotalCellColumnForeColor":"Total Cell Column Fore Color","TotalCellRowBackColor":"Total Cell Row Back Color","TotalCellRowForeColor":"Total Cell Row Fore Color","TotalLabel":"Total Label","Totals":"Totals","TrackColor":"Track Color","TransparentColor":"Transparent Color","TrendLine":"Trend Line","TrendLineColor":"Trend Line Color","TrendLines":"Trend Lines","TrendLineShowShadow":"Trend Line Show Shadow","TrimExcessData":"Trim Excess Data","Trimming":"Trimming","Type":"Type","TypeName":"Type Name","Types":"Types","UncheckedIcon":"Unchecked Icon","Underline":"Underline","UndoLimit":"Undo Limit","Unit":"Unit","UnitAlignment":"Unit Alignment","UnlimitedBreakable":"Unlimited Breakable","UnlimitedHeight":"Unlimited Height","UnlimitedWidth":"Unlimited Width","UpperMarks":"Upper Marks","URL":"URL","UseAliases":"Use Aliases","UseExternalReport":"Use External Report","UseParentStyles":"Use Parent Styles","UseRangeColor":"Use Range Color","UseRectangularSymbols":"Use Rectangular Symbols","UseSeriesColor":"Use Series Color","UseStyleOfSummaryInColumnTotal":"Use Style of Summary in Column Total","UseStyleOfSummaryInRowTotal":"Use Style of Summary in Row Total","UseValuesFromTheSpecifiedRange":"Use Values From The Specified Range","Value":"Value","ValueClose":"Value Close","ValueDataColumn":"Value Data Column","ValueDataColumnClose":"Value Data Column Close","ValueDataColumnEnd":"Value Data Column End","ValueDataColumnHigh":"Value Data Column High","ValueDataColumnLow":"Value Data Column Low","ValueDataColumnOpen":"Value Data Column Open","ValueEnd":"Value End","ValueFormat":"Value Format","ValueHigh":"Value High","ValueLow":"Value Low","ValueMeter":"Value Meter","ValueOpen":"Value Open","Values":"Values","ValueType":"Value Type","ValueTypeSeparator":"Value Type Separator","Variable":"Variable","Variables":"Variables","Variation":"Variation","Version":"Version","VertAlignment":"Vertical Alignment","VertSpacing":"Vertical Spacing","ViewMode":"View Mode","Visible":"Visible","VisualStates":"Visual States","Watermark":"Watermark","Weight":"Weight","WeightDataColumn":"Weight Data Column","Weights":"Weights","Width":"Width","WindowState":"Window State","WordWrap":"Word Wrap","Wrap":"Wrap","WrapGap":"WrapGap","WrapLine":"Wrap Line","XAxis":"X Axis","XTopAxis":"X Top Axis","YAxis":"Y Axis","YRightAxis":"Y Right Axis","ZeroColor":"Zero Color","Zoom":"Zoom"},"PropertySystemColors":{"ActiveBorder":"Active Border","ActiveCaption":"Active Caption","ActiveCaptionText":"Active Caption Text","AppWorkspace":"App Workspace","Control":"Control","ControlDark":"Control Dark","ControlDarkDark":"Control Dark Dark","ControlLight":"Control Light","ControlLightLight":"Control Light Light","ControlText":"Control Text","Desktop":"Desktop","GrayText":"Gray Text","Highlight":"Highlight","HighlightText":"Highlight Text","HotTrack":"Hot Track","InactiveBorder":"Inactive Border","InactiveCaption":"Inactive Caption","InactiveCaptionText":"Inactive Caption Text","Info":"Info","InfoText":"Info Text","Menu":"Menu","MenuText":"Menu Text","ScrollBar":"Scroll Bar","Window":"Window","WindowFrame":"Window Frame","WindowText":"Window Text"},"QueryBuilder":{"AddObject":"Add Object","AddSubQuery":"Add Derived Table","AllObjects":"(All objects)","BadFromObjectExpression":"Invalid FROM object expression!","BadObjectName":"Invalid object name!","BadSelectStatement":"Invalid SELECT statement!","Collections":"Collections","CreateLinksFromForeignKeys":"Create Links from Foreign Keys","CriteriaAlias":"Alias","CriteriaCriteria":"Criteria","CriteriaExpression":"Expression","CriteriaGroupBy":"Group By","CriteriaOr":"Or...","CriteriaOutput":"Output","CriteriaSortOrder":"Sort Order","CriteriaSortType":"Sort Type","Database":"Database","DataSourceProperties":"Data Source Properties","DialectDontSupportDatabases":"The server does not support queries with objects from different databases.","DialectDontSupportSchemas":"The server does not support schemas.","DialectDontSupportUnions":"This server does not support unions.","DialectDontSupportUnionsBrackets":"This server does not support brackets in unions.","DialectDontSupportUnionsBracketsInSubQuery":"This server doesn\'t support brackets in unions in subqueries.","DialectDontSupportUnionsInSubQueries":"This server does not support unions in subqueries.","Edit":"Edit","EncloseWithBrackets":"Enclose with brackets","Expressions":"Expressions","InsertEmptyItem":"Insert Empty Item","JoinExpression":"Join Expression","LabelAlias":"Alias:","LabelFilterObjectsBySchemaName":"Filter Objects by Schema Name:","LabelJoinExpression":"Join Expression:","LabelLeftColumn":"Left Column:","LabelLeftObject":"Left Object:","LabelObject":"Object:","LabelRightColumn":"Right Column:","LabelRightObject":"Right Object:","LinkProperties":"Link Properties","MetadataProviderCantExecSQL":"Used metadata provider cannot execute SQL queries.","MetaProviderCantLoadMetadata":"Used metadata provider cannot automatically load metadata.","MetaProviderCantLoadMetadataForDatabase":"Used metadata provider cannot automatically load metadata for database: {0}","MoveDown":"Move Down","MoveUp":"Move Up","NewUnionSubQuery":"New union sub-query","NoConnectionObject":"No connection object (property {0} not assigned).","NoTransactionObject":"No transaction object (property {0} not assigned).","Objects":"Objects","ProcedureParameters":"Procedure Parameters","Procedures":"Procedures","qnSaveChanges":"Do you want to save changes of query?","Query":"Query","QueryBuilder":"Query Builder","QueryParameters":"Query Parameters","QueryProperties":"Query Properties","Remove":"Remove","RemoveBrackets":"Remove brackets","RunQueryBuilder":"Run Query Builder","SelectAllFromLeft":"Select All from Left","SelectAllFromRight":"Select All from Right","SwitchToDerivedTable":"Switch to Derived Table","Tables":"Tables","UnexpectedTokenAt":"Unexpected token \\"{0}\\" at line {1}, pos {2}!","Unions":"Unions","UnionSubMenu":"Union","ViewQuery":"View Query","Views":"Views"},"Questions":{"qnConfiguration":"Please choose the type of configuration for the properties panel. The type of the selected configuration depends on the number of visible properties and their complexity for the developer of reports. You can always change the configuration type from the context menu of the properties panel.","qnCopyCategory":"Do you want to copy all variables of this category?","qnDictionaryNew":"Do you want to create new Dictionary?","qnLanguageNew":"You have changed the language of the report. This will lead to the new report code generation. Are you certain you want to save the new language?","qnPageDelete":"Do you want to delete page?","qnRemove":"Do you want to remove?","qnRemoveService":"Do you want to remove Service?","qnRemoveServiceCategory":"Do you want to remove Category?","qnRemoveUnused":"Do you want to remove Unused?","qnReplace":"Do you want to replace the existing item {0}?","qnRestoreDefault":"Restore defaults?","qnSaveChanges":"Save changes in {0}?","qnSaveChangesToPreviewPage":"Do you want to save page changes?","qnSynchronize":"Synchronized contents of the Data Store and contents of the Dictionary?","qnSynchronizeServices":"Synchronized services?"},"RecentFiles":{"AddAPlace":"Add a Place","AddAPlaceDesc":"You can add locations to make it easier to save Reports to the cloud.","ChangeFileType":"Change file type","ChooseALocation":"Choose a Location","ClearUnpinnedItems":"Clear unpinned items","CopyPathToClipboard":"Copy path to clipboard","DateModified":"Date modified","Documents":"Documents","DoYouWantTo":"Do you want to:","LastWeek":"Last Week","LocalDisk":"Local Disk ({0})","MessageInvalidFolderName":"Invalid folder name.","MessageThatNameAlreadyExists":"That name already exists. Please use a different name.","MoreLocations":"More Locations →","Older":"Older","OtherLocations":"Other locations","Personal":"Personal","Pinned":"Pinned","PinToList":"Pin to list","PinToRecentList":"Pin to Recent list","RemoveFromList":"Remove from list","ReplaceExistingFile":"Replace existing file.","SaveChangesWithADifferentName":"Save changes with a different name.","SaveThisFile":"Save this file","SelectToNavigateUpOneLevel":"Select to navigate up one level","SetAsDefaultLocation":"Set as Default Location","ThisPC":"This PC","UnpinFromList":"Unpin from list"},"Report":{"ActiveRelation":"Active Relation","Address":"Address","Alphabetical":"Alphabetical","Bands":"Bands","Basic":"Basic","BasicConfiguration":"Minimal number of object properties, which are necessary for rendering the basic report types.","BusinessObjects":"Business Objects","Categorized":"Categorized","Charts":"Charts","Checking":"Checking...","ClickForMoreDetails":"Click for More Details","CollapseAll":"Collapse All","Collection":"Collection","CompilingReport":"Compiling Report","Complete":"Complete","Components":"Components","ConnectingToData":"Connecting to Data","CopyOf":"Copy","CreateNewReportPageForm":"Create a new report, add a page, add a form","CreatingReport":"Creating Report","CrossBands":"Cross","Dialogs":"Dialogs","EditStyles":"Edit Styles","Enhancements":"Enhancements","EnterDataManually":"Enter data manually","Errors":"Errors","EventsTab":"Events Tab","ExpandAll":"Expand All","FilterAnd":"And","FilterOr":"Or","FinishingReport":"Finishing Report","FirstPass":"First Pass","FixedBugs":"Fixed Bugs","FromCurrentState":"From Current State","FromDefaultState":"From Default State","Gallery":"Gallery","GenerateNewCode":"Generate New Code","History":"History","Infographics":"Infographics","InfoMessage":"{0} - {1} found.","InformationMessages":"Information Messages","LabelAlias":"Alias:","LabelAuthor":"Author:","LabelBackground":"Background:","LabelCategory":"Category:","LabelCentimeters":"Centimeters:","LabelCollectionName":"Collection Name:","LabelColor":"Color:","LabelCountData":"Count Data:","LabelDataBand":"DataBand:","LabelDataColumn":"Data Column:","LabelDefaultValue":"Default Value:","LabelExpression":"Expression:","LabelFactorLevel":"Nested Factor:","LabelFontName":"Font Name:","LabelFunction":"Function:","LabelHundredthsOfInch":"Hundredths of Inch:","LabelInches":"Inches:","LabelMillimeters":"Millimeters:","LabelName":"Name:","LabelNameInSource":"Name in Source:","LabelNestedLevel":"Nested Level:","LabelPassword":"Password:","LabelPixels":"Pixels:","LabelQueryTimeout":"Query Timeout:","LabelSystemVariable":"System Variable:","LabelTableOfContentsHint":"Please, check the components which should form the table of contents. One component is equal to one heading level.","LabelTotals":"Totals","LabelType":"Type:","LabelUserName":"User Name:","LabelValue":"Value:","LoadingReport":"Loading Report","nameAssembly":"Assembly","NewFeatures":"New Features","No":"No","NoFixes":"There are no fixes or updates for this version!","NoIssues":"No Issues","NoNewVersions":"There are no new versions available!","NotAssigned":"Not Assigned","Null":"Null","Obsoleted":"Obsoleted","Office2010Back":"Back","PageNofM":"Page {0} of {1}","PreparingReport":"Preparing Report","Professional":"Professional","ProfessionalConfiguration":"All object properties.","PropertiesTab":"Properties Tab","RangeAll":"All","RangeCurrentPage":"Current Page","RangeInfo":"Enter page number and/or pages ranges separated by commas. For example: 1, 3, 5-12","RangePage":"Page Range","RangePages":"Pages:","ReportChecker":"Checker","ReportRenderingMessages":"Report Rendering Messages","RestartDesigner":"You need to restart the report designer","SaveReportPagesOrFormsFromReport":"Save the report, pages or forms","SavingReport":"Saving Report","SecondPass":"Second Pass","Shapes":"Shapes","ShowOnParametersPanel":"Show on Parameters Panel","Standard":"Standard","StandardConfiguration":"Main object properties except rarely used ones.","StiEmptyBrush":"Empty","StiGlareBrush":"Glare","StiGlassBrush":"Glass","StiGradientBrush":"Gradient","StiHatchBrush":"Hatch","StiSolidBrush":"Solid","StyleBad":"Bad","StyleGood":"Good","StyleNeutral":"Neutral","StyleNormal":"Normal","StyleNote":"Note","StyleWarning":"Warning","UseDataFields":"Use Data Fields","VisualChecked":"Checked","VisualDefault":"Default","VisualDisabled":"Disabled","VisualHover":"Hover","VisualPressed":"Pressed","Warnings":"Warnings","WhatsNewInVersion":"What\'s New in {0}","When":"when {0} {1}","WhenAnd":"when {0} {1} and","WhenValueIs":"when value is"},"ReportInfo":{"CheckIssuesAdditionalDescription":"Check for errors and find inaccuracies.","EncryptWithPassword":"Encrypt with Password","EncryptWithPasswordAdditionalDescription":"Set the password to prevent unauthorized working with the report.","EncryptWithPasswordDescription":"Protect Report","Info":"Info","ReportOptions":"Report Options","ReportOptionsAdditionalDescription":"Setup the basic information and parameters in the report."},"ReportOpen":{"Browse":"Browse","Import":"Import"},"Scheduler":{"ActionRunReport":"Run Report","AdvancedSettings":"Advanced Settings","CheckBoxOverwriteIfExists":"Overwrite If Exists","DayAll":"All","DayDayX":"Day {0}","DayLast":"Last","DayNone":"None","DaysOfWeekAll":"All","DaysOfWeekNone":"None","DelayTaskForUpToRandomDelay":"Delay task for up to (random delay)","EditScheduler":"Edit Scheduler","EnableSSL":"Enable SSL","Expire":"Expire","ForADurationOf":"for a duration of","GetFolder":"Get Folder","GroupBoxFiles":"Files","Host":"Host","Info":"Windows Task Scheduler is used to run schedulers.","LabelDaysOfWeek":"Days of Week","LabelMessage":"Message","LabelResultName":"Result Name","LabelRunAtDay":"Run at Day","LabelRunAtMonth":"Run at Month","LabelRunAtTime":"Run at Time","LabelRunEvery":"Run Every","LabelSubject":"Subject","LabelTo":"To","Logs":"Logs","MessageInvalidName":"Task names may not include any characters which are invalid for file names.","MessageInvalidTaskName":"Task names ending with a period followed by three or fewer characters cannot be retrieved due to a bug in the native library.","MessagePropertyNotSet":"\'{0}\' not set!","MonthAll":"All","MonthNone":"None","NewAction":"New Action","NewScheduler":"New Scheduler","NoLogs":"No Logs","NoSchedulers":"No Schedulers","NumberOfDayAll":"All","NumberOfDayFirst":"First","NumberOfDayFourth":"Fourth","NumberOfDayLast":"Last","NumberOfDayNone":"None","NumberOfDaySecond":"Second","NumberOfDayThird":"Third","OpenWindowsTaskScheduler":"Open Windows Task Scheduler","PleaseSelectSchedulerType":"Please select a scheduler type","RadioButtonDay":"Day","RadioButtonOn":"On","RepeatTaskEvery":"Repeat task every","Schedule":"Schedule","Scheduler":"Scheduler","Schedulers":"Schedulers","SenderEmail":"Sender Email","SmtpSettings":"Smtp Settings","StopAllRunningTasksAtEndOfRepetitionDuration":"Stop all running tasks at end of repetition duration","StopTasksIfItRunsLongerThan":"Stop tasks if it runs longer than","TextDragDropDestinationHere":"Drag &amp; Drop the Destination Folder Here","TextDragDropReportHere":"Drag &amp; Drop the Report Here","TextPressPlusIconAddNewAction":"Click the icon plus to add a new action!","ToolTipSetParameters":"Defining Report Parameters","WizardDaily":"Daily","WizardDailyDescription":"Once a day, at a specified time.","WizardHourly":"Hourly","WizardHourlyDescription":"Once an hour.","WizardMonthly":"Monthly","WizardMonthlyDescription":"Monthly, on selected days of the week or days of the month, at a specified time.","WizardOnce":"Once","WizardOnceDescription":"Run the scheduler once at any time.","WizardWeekly":"Weekly","WizardWeeklyDescription":"On the selected days of the week, at a specified time."},"Services":{"categoryContextTools":"Context Tools","categoryDesigner":"Designer","categoryDictionary":"Dictionary","categoryExport":"Exports","categoryLanguages":"Languages","categoryPanels":"Panels","categoryRender":"Render","categoryShapes":"Shapes","categorySL":"Save / Load","categorySystem":"System","categoryTextFormat":"Text Format"},"Shapes":{"Arrow":"Arrow","BasicShapes":"Basic Shapes","BentArrow":"Bent Arrow","BlockArrows":"Block Arrows","Chevron":"Chevron","ComplexArrow":"Complex Arrow","DiagonalDownLine":"Diagonal Line Down","DiagonalUpLine":"Diagonal Line Up","Division":"Division","Equal":"Equal","EquationShapes":"Equation Shapes","Flowchart":"Flowchart","FlowchartCard":"Flowchart: Card","FlowchartCollate":"Flowchart: Collate","FlowchartDecision":"Flowchart: Decision","FlowchartManualInput":"Flowchart: Manual Input","FlowchartOffPageConnector":"Flowchart: Off Page Connector","FlowchartPreparation":"Flowchart: Preparation","FlowchartSort":"Flowchart: Sort","Frame":"Frame","HorizontalLine":"Horizontal Line","InsertShapes":"Insert Shapes","LeftAndRightLine":"Left and Right Line","Lines":"Lines","Minus":"Minus","Multiply":"Multiply","Octagon":"Octagon","Oval":"Oval","Parallelogram":"Parallelogram","Plus":"Plus","Rectangle":"Rectangle","Rectangles":"Rectangles","RegularPentagon":"Regular: Pentagon","RoundedRectangle":"Rounded Rectangle","ServiceCategory":"Shapes","ShapeStyles":"Shape Styles","SnipDiagonalSideCornerRectangle":"Snip Diagonal Side Corner Rectangle","SnipSameSideCornerRectangle":"Snip Same Side Corner Rectangle","TopAndBottomLine":"Top and Bottom Line","Trapezoid":"Trapezoid","Triangle":"Triangle","VerticalLine":"Vertical Line"},"Signature":{"DigitalSignatureEmptyWatermark":"Place for digital signature in PDF Viewer","InsertImage":"Insert Image","InsertText":"Insert Text","LoadSignature":"Load signature","NoSavedItems":"No saved items","SaveSignature":"Save signature","SignatureSavedSuccessfully":"Signature saved successfully.","UseBrush":"Use Brush"},"SystemVariables":{"Column":"Returns the current column number (starts from 1).","GroupLine":"Returns the current group line number (starts from 1).","IsFirstPage":"Returns true, if, in the current moment, the first page of a report is printed.","IsFirstPageThrough":"Returns true, if, in the current moment, the first report page is printed. When calculating the IsFirstPageThrough, all ResetPageNumber properties are ignored and numbering starts from the beginning of report. For correct calculation of a variable it is required to execute two passes.","IsLastPage":"Returns true, if, in the current moment, the last page of a report is printed. For correct calculation of a variable it is required to execute two passes.","IsLastPageThrough":"Returns true, if, in the current moment, the last page of a report is printed. When calculating the IsLastPageThrough, all properties ResetPageNumber are ignored and numbering starts from the beginning of report. For correct calculation of a variable it is required to execute two passes.","Line":"Returns the current line number (starts from 1).","LineABC":"Returns the alphabetical analogue of the current line number.","LineRoman":"Returns the current line number in Roman numerals.","LineThrough":"Returns the current line number (starts from 1). When calculating the number, all groupings are ignored and numbering starts from the beginning of printing.","PageCopyNumber":"Return a number of a current copy of a page (starts from 1).","PageNofM":"Returns a localized string, showing \\"Page N of M\\" where N is the current page number and M is the TotalPageCount of a report.","PageNofMThrough":"Returns a localized string, showing \\"Page N of M\\" where N is the current page number and M is the TotalPageCount of a report. When calculating the PageNofMThrough, all properties ResetPageNumber are ignored and numbering starts from the beginning of a report.","PageNumber":"Returns the current page number (starts from 1).","PageNumberThrough":"Returns the current page number (starts from 1). When calculating the PageNumberThrough, all properties ResetPageNumber are ignored and numbering starts from the beginning of a report.","ReportAlias":"Returns the report alias. You can change the ReportAlias with help of the ReportAlias property of a report.","ReportAuthor":"Returns the report author. You can change ReportAuthor with help of the ReportAuthor property of a report.","ReportChanged":"The Date when a report was changed.","ReportCreated":"The Date when a report was created.","ReportDescription":"Returns the report description. You can change the ReportName with help of the ReportDescription property of a report.","ReportName":"Returns the report name. You can change the ReportName with help of the ReportName property of a report.","Time":"Returns the current time.","Today":"Returns the current date.","TotalPageCount":"Returns the number of pages in a report.","TotalPageCountThrough":"Returns the number of pages in a report. When calculating the TotalPageCountThrough, all properties ResetPageNumber are ignored and numbering starts from the beginning of report."},"TableRibbon":{"BuiltIn":"Built-In","Delete":"Delete","DeleteColumns":"Delete Columns","DeleteRows":"Delete Rows","DeleteTable":"Delete Table","DistributeColumns":"Distribute Columns","DistributeRows":"Distribute Rows","InsertAbove":"Insert Above","InsertBelow":"Insert Below","InsertLeft":"Insert Left","InsertRight":"Insert Right","PlainTables":"Plain Tables","ribbonBarRowsColumns":"Rows and Columns","ribbonBarTable":"Table","ribbonBarTableStyles":"Table Styles","Select":"Select","SelectColumn":"Select Column","SelectRow":"Select Row","SelectTable":"Select Table"},"Toolbars":{"Align":"Align","AlignBottom":"Align Bottom","AlignCenter":"Align Center","AlignLeft":"Align Left","AlignMiddle":"Align Middle","AlignRight":"Align Right","AlignToGrid":"Align to Grid","AlignTop":"Align Top","AlignWidth":"Justify","BringToFront":"Bring to Front","CenterHorizontally":"Center Horizontally","CenterVertically":"Center Vertically","Conditions":"Conditions","FontGrow":"Grow Font","FontName":"Font Name","FontShrink":"Shrink Font","FontSize":"Font Size","FontStyleBold":"Font Style Bold","FontStyleItalic":"Font Style Italic","FontStyleUnderline":"Font Style Underline","Link":"Link","Lock":"Lock","MakeHorizontalSpacingEqual":"Make Horizontal Spacing Equal","MakeSameHeight":"Make Same Height as {0}","MakeSameSize":"Make Same Size as {0}","MakeSameWidth":"Make Same Width as {0}","MakeVerticalSpacingEqual":"Make Vertical Spacing Equal","MoveBackward":"Move Backward","MoveForward":"Move Forward","Order":"Order","SendToBack":"Send to Back","Size":"Size","StyleDesigner":"Style Designer","Styles":"List of the styles","TabHome":"Home","TabLayout":"Layout","TabPage":"Page","TabView":"View","TextBrush":"Text Brush","ToolbarAlignment":"Alignment","ToolbarArrange":"Arrange","ToolbarBorders":"Borders","ToolbarClipboard":"Clipboard","ToolbarDockStyle":"Dock Style","ToolbarFont":"Font","ToolbarFormatting":"Formatting","ToolbarLayout":"Layout","ToolbarPageSetup":"Page Setup","ToolbarStandard":"Standard","ToolbarStyle":"Style","ToolbarTextFormat":"Text Format","ToolbarTools":"Tools","ToolbarViewOptions":"View Options","ToolbarWatermarkImage":"Watermark Image","ToolbarWatermarkText":"Watermark Text"},"Toolbox":{"Create":"Creation components","Hand":"Hand","Select":"Select","Style":"Copy Style","TextEditor":"Text Editor","title":"Toolbox"},"WelcomeScreen":{"AllDownloadsWillCanceled":"Are you sure you want to close this window? All downloads will be canceled.","Description":"We have selected for you reports that we think are the best for a quick start.","GetStarted":"Get Started","GetStartedWithDashboards":"Get Started with Dashboards","GetStartedWithReports":"Get Started with Reports","MoreReports":"More Reports","ShowNextTime":"Show \'{0}\' next time","Title":"Welcome to Stimulsoft Demo"},"Wizards":{"BlankDashboard":"Blank Dashboard","BlankForm":"Blank Form","BlankReport":"Blank Report","BlankScreen":"Blank Screen","ButtonBack":"&lt; &amp;Back","ButtonCancel":"Cancel","ButtonFinish":"&amp;Finish","ButtonNext":"&amp;Next &gt;","ColumnsOrder":"Columns Order","Company":"Company","Custom":"Custom","DataRelation":"Relation","DataSource":"Data Source","DataSources":"Data Sources","DefaultThemes":"Default Themes","Filters":"Filters","FromReportTemplate":"From Report Template","GetData":"Get Data","groupCreateNewDashboard":"Create a New Dashboard","groupCreateNewPageOrForm":"Create a New Page or Form","groupCreateNewReport":"Create a New Report","Groups":"Groups","groupTemplates":"Templates","groupWizards":"Wizards","infoColumnsOrder":"Arrange columns in the necessary order.","infoCompanyInfo":"Enter your company information.","infoDataSource":"Select one Data Source from available.","infoDataSources":"Select Data Sources from available. The first selected one will be the Master data source.","infoFilters":"Filter Data for your report","infoGroups":"Select columns on which necessary to group.","infoLabelSettings":"Set the settings of labels.","infoLanguages":"Select the report culture.","infoLayout":"Specify layout of report.","infoRelation":"Select one Data Relation from available.","infoSelectColumns":"Select columns from which the information will be displayed.","infoSelectTemplate":"Choose the appropriate template for your needs.","infoSort":"Set the sorting of data. You can sort immediately on multiple columns.","infoThemes":"Select theme for your report.","infoTotals":"Add summary information to your report.","LabelDirection":"Direction:","LabelHeight":"Height:","LabelHorizontalGap":"Horizontal Gap:","LabelLabelType":"Label Type:","LabelLeftMargin":"Left Margin:","LabelNumberOfColumns":"Number of Columns:","LabelNumberOfRows":"Number of Rows:","LabelPageHeight":"Page Height:","LabelPageWidth":"Page Width:","LabelReport":"Label Report","LabelSettings":"Label Settings","LabelSize":"Size:","LabelTopMargin":"Top Margin:","LabelVerticalGap":"Vertical Gap:","LabelWidth":"Width:","Layout":"Layout","Mapping":"Mapping","MarkAll":"Mark &amp;All","MasterDetailReport":"Master-Detail Report","NoFunction":"[None]","OpenExistingReport":"Open Existing File","OpenFrom":"Open from {0}","Preview":"Preview","Reset":"&amp;Reset","Results":"Results","RunWizard":"Run Wizard","SelectColumns":"Select Columns","SelectTemplate":"Template","Sort":"Sort","StandardReport":"Standard Report","Themes":"Themes","title":"New Report","Totals":"Totals","UseDemoData":"Use Demo Data","UsingReportWizard":"Using Report Wizard","YouHaveNotOpenedAnyReportRecently":"You haven\'t opened any report recently. To browse for a report, start by clicking on Open Existing File."},"Zoom":{"EmptyValue":"Empty Value","MultiplePages":"Multiple Pages","OnePage":"One Page","PageHeight":"Page Height","PageWidth":"Page Width","TwoPages":"Two Pages","ZoomTo100":"Zoom to 100%"}}}'); }
    constructor() {
        this._localizationList = [];
        StiLocalizationService.setDeflocalization();
    }
    static setDeflocalization() {
        this.localization = JSON.parse(JSON.stringify(this.deflocalization));
    }
    static { this.needToRefresh = new Subject(); }
    toCamelCase(obj) {
        if (Array.isArray(obj)) {
            return obj.map((v) => this.toCamelCase(v));
        }
        else if (obj != null && obj.constructor === Object) {
            return Object.keys(obj).reduce((result, key) => ({
                ...result,
                [camelCase(key)]: this.toCamelCase(obj[key]),
            }), {});
        }
        return obj;
    }
    static updateLocalization(from, to) {
        for (let promName in from) {
            if (typeof from[promName] === "string") {
                to[promName] = from[promName];
            }
            else {
                if (to[promName] == undefined) {
                    to[promName] = from[promName];
                }
                else {
                    this.updateLocalization(from[promName], to[promName]);
                }
            }
        }
    }
    loadLocalization(str) {
        StiLocalizationService.setLocalization(str);
        StiLocalizationService.needToRefresh.next(true);
    }
    changeCurrentLocalization(locName) {
        this.currentLocalization = this.localizationList.find((loc) => loc.cultureName == locName);
    }
    static setLocalization(str) {
        if (str) {
            this.setDeflocalization();
            let jsonLoc = str;
            if (str && str.indexOf("<?xml") == 0) {
                let xml = new DOMParser().parseFromString(str, "text/xml");
                jsonLoc = this.xml2json(xml);
            }
            this.updateLocalization(jsonLoc, this.localization);
        }
    }
    static get(category, key) {
        let loc = this.localization?.Localization;
        return loc && loc[category][key] ? loc[category][key] : key;
    }
    getP(key) {
        return StiLocalizationService.get("PropertyMain", key);
    }
    get2(category, key) {
        return StiLocalizationService.get(category, key);
    }
    static xml2json(xml, tab = "") {
        let X = {
            toObj: function (xml) {
                let o = {};
                if (xml.nodeType == 1) {
                    // element node ..
                    if (xml.attributes.length)
                        // element with attributes  ..
                        for (let i = 0; i < xml.attributes.length; i++)
                            o["@" + xml.attributes[i].nodeName] = (xml.attributes[i].nodeValue || "").toString();
                    if (xml.firstChild) {
                        // element has child nodes ..
                        let textChild = 0, cdataChild = 0, hasElementChild = false;
                        for (let n = xml.firstChild; n; n = n.nextSibling) {
                            if (n.nodeType == 1)
                                hasElementChild = true;
                            else if (n.nodeType == 3 && n.nodeValue.match(/[^ \f\n\r\t\v]/))
                                textChild++; // non-whitespace text
                            else if (n.nodeType == 4)
                                cdataChild++; // cdata section node
                        }
                        if (hasElementChild) {
                            if (textChild < 2 && cdataChild < 2) {
                                // structured element with evtl. a single text or/and cdata node ..
                                X.removeWhite(xml);
                                for (let n = xml.firstChild; n; n = n.nextSibling) {
                                    if (n.nodeType == 3)
                                        // text node
                                        o["#text"] = X.escape(n.nodeValue);
                                    else if (n.nodeType == 4)
                                        // cdata node
                                        o["#cdata"] = X.escape(n.nodeValue);
                                    else if (o[n.nodeName]) {
                                        // multiple occurence of element ..
                                        if (o[n.nodeName] instanceof Array)
                                            o[n.nodeName][o[n.nodeName].length] = X.toObj(n);
                                        else
                                            o[n.nodeName] = [o[n.nodeName], X.toObj(n)];
                                    } // first occurence of element..
                                    else
                                        o[n.nodeName] = X.toObj(n);
                                }
                            }
                            else {
                                // mixed content
                                if (!xml.attributes.length)
                                    o = X.escape(X.innerXml(xml));
                                else
                                    o["#text"] = X.escape(X.innerXml(xml));
                            }
                        }
                        else if (textChild) {
                            // pure text
                            if (!xml.attributes.length)
                                o = X.escape(X.innerXml(xml));
                            else
                                o["#text"] = X.escape(X.innerXml(xml));
                        }
                        else if (cdataChild) {
                            // cdata
                            if (cdataChild > 1)
                                o = X.escape(X.innerXml(xml));
                            else
                                for (let n = xml.firstChild; n; n = n.nextSibling)
                                    o["#cdata"] = X.escape(n.nodeValue);
                        }
                    }
                    if (!xml.attributes.length && !xml.firstChild)
                        o = null;
                }
                else if (xml.nodeType == 9) {
                    // document.node
                    o = X.toObj(xml.documentElement);
                }
                else
                    alert("unhandled node type: " + xml.nodeType);
                return o;
            },
            toJson: function (o, name, ind) {
                let json = name ? '"' + name + '"' : "";
                if (o instanceof Array) {
                    for (let i = 0, n = o.length; i < n; i++)
                        o[i] = X.toJson(o[i], "", ind + "\t");
                    json +=
                        (name ? ":[" : "[") +
                            (o.length > 1 ? "\n" + ind + "\t" + o.join(",\n" + ind + "\t") + "\n" + ind : o.join("")) +
                            "]";
                }
                else if (o == null)
                    json += (name && ":") + "null";
                else if (typeof o == "object") {
                    let arr = [];
                    for (let m in o)
                        arr[arr.length] = X.toJson(o[m], m, ind + "\t");
                    json +=
                        (name ? ":{" : "{") +
                            (arr.length > 1 ? "\n" + ind + "\t" + arr.join(",\n" + ind + "\t") + "\n" + ind : arr.join("")) +
                            "}";
                }
                else if (typeof o == "string")
                    json += (name && ":") + '"' + o.toString() + '"';
                else
                    json += (name && ":") + o.toString();
                return json;
            },
            innerXml: function (node) {
                let s = "";
                if ("innerHTML" in node)
                    s = node.innerHTML;
                else {
                    let asXml = function (n) {
                        let s = "";
                        if (n.nodeType == 1) {
                            s += "<" + n.nodeName;
                            for (let i = 0; i < n.attributes.length; i++)
                                s += " " + n.attributes[i].nodeName + '="' + (n.attributes[i].nodeValue || "").toString() + '"';
                            if (n.firstChild) {
                                s += ">";
                                for (let c = n.firstChild; c; c = c.nextSibling)
                                    s += asXml(c);
                                s += "</" + n.nodeName + ">";
                            }
                            else
                                s += "/>";
                        }
                        else if (n.nodeType == 3)
                            s += n.nodeValue;
                        else if (n.nodeType == 4)
                            s += "<![CDATA[" + n.nodeValue + "]]>";
                        return s;
                    };
                    for (let c = node.firstChild; c; c = c.nextSibling)
                        s += asXml(c);
                }
                return s;
            },
            escape: function (txt) {
                return txt.replace(/[\\]/g, "\\\\").replace(/[\"]/g, '\\"').replace(/[\n]/g, "\\n").replace(/[\r]/g, "\\r");
            },
            removeWhite: function (e) {
                e.normalize();
                for (let n = e.firstChild; n;) {
                    if (n.nodeType == 3) {
                        // text node
                        if (!n.nodeValue.match(/[^ \f\n\r\t\v]/)) {
                            // pure whitespace text node
                            let nxt = n.nextSibling;
                            e.removeChild(n);
                            n = nxt;
                        }
                        else
                            n = n.nextSibling;
                    }
                    else if (n.nodeType == 1) {
                        // element node
                        X.removeWhite(n);
                        n = n.nextSibling;
                    } // any other node
                    else
                        n = n.nextSibling;
                }
                return e;
            },
        };
        if (xml.nodeType == 9)
            // document node
            xml = xml.documentElement;
        let json = X.toJson(X.toObj(X.removeWhite(xml)), xml.nodeName, "\t");
        return JSON.parse("{\n" + tab + (tab ? json.replace(/\t/g, tab) : json.replace(/\t|\n/g, "")) + "\n}");
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiLocalizationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiLocalizationService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiLocalizationService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [] });

class StiPadding {
    constructor(left = 0, top = 0, right = 0, bottom = 0, changesInterceptor) {
        this._left = 0;
        this._right = 0;
        this._top = 0;
        this._bottom = 0;
        this._left = left;
        this._right = right;
        this._top = top;
        this._bottom = bottom;
        this.changesInterceptor = changesInterceptor;
    }
    get left() {
        return this._left;
    }
    set left(value) {
        let oldPadding = this.changesInterceptor ? this.clone() : null;
        let oldValue = this._left;
        this._left = value;
        if (this.changesInterceptor && oldValue != value) {
            this.changesInterceptor.propertyChanged("padding.left", value, oldPadding);
        }
    }
    get right() {
        return this._right;
    }
    set right(value) {
        let oldPadding = this.changesInterceptor ? this.clone() : null;
        let oldValue = this._right;
        this._right = value;
        if (this.changesInterceptor && oldValue != value) {
            this.changesInterceptor.propertyChanged("padding.right", value, oldPadding);
        }
    }
    get top() {
        return this._top;
    }
    set top(value) {
        let oldPadding = this.changesInterceptor ? this.clone() : null;
        let oldValue = this._top;
        this._top = value;
        if (this.changesInterceptor && oldValue != value) {
            this.changesInterceptor.propertyChanged("padding.top", value, oldPadding);
        }
    }
    get bottom() {
        return this._bottom;
    }
    set bottom(value) {
        let oldPadding = this.changesInterceptor ? this.clone() : null;
        let oldValue = this._bottom;
        this._bottom = value;
        if (this.changesInterceptor && oldValue != value) {
            this.changesInterceptor.propertyChanged("padding.bottom", value, oldPadding);
        }
    }
    isChanged() {
        return this.savedPadding == null || !this.savedPadding.equals(this);
    }
    resetChanged() {
        this.savedPadding = this.clone();
    }
    saveToJsonObject(options) {
        let json = new StiJson();
        json.addPropertyNumber("Left", this.left);
        json.addPropertyNumber("Top", this.top);
        json.addPropertyNumber("Right", this.right);
        json.addPropertyNumber("Bottom", this.bottom);
        return json;
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "Left":
                    this.left = property.value;
                    break;
                case "Top":
                    this.top = property.value;
                    break;
                case "Right":
                    this.right = property.value;
                    break;
                case "Bottom":
                    this.bottom = property.value;
                    break;
            }
        }
    }
    clone() {
        return new StiPadding(this.left, this.top, this.right, this.bottom);
    }
    equals(padding) {
        return (this.left == padding.left &&
            this.top == padding.top &&
            this.right == padding.right &&
            this.bottom == padding.bottom);
    }
}

/*
{*******************************************************************}
{                                                                   }

{                                                                   }
{                                                                   }
{   Copyright (C)  Stimulsoft                                       }
{   ALL RIGHTS RESERVED                                             }
{                                                                   }
{   The entire contents of this file is protected by U.S. and       }
{   International Copyright Laws. Unauthorized reproduction,        }
{   reverse-engineering, and distribution of all or any portion of  }
{   the code contained in this file is strictly prohibited and may  }
{   result in severe civil and criminal penalties and will be       }
{   prosecuted to the maximum extent possible under the law.        }
{                                                                   }
{   RESTRICTIONS                                                    }
{                                                                   }
{   THIS SOURCE CODE AND ALL RESULTING INTERMEDIATE FILES           }
{   ARE CONFIDENTIAL AND PROPRIETARY                                }
{   TRADE SECRETS OF Stimulsoft                                     }
{                                                                   }
{   CONSULT THE END USER LICENSE AGREEMENT FOR INFORMATION ON       }
{   ADDITIONAL RESTRICTIONS.                                        }
{                                                                   }
{*******************************************************************}
*/
class Guid {
    static newGuid() {
        return new Guid(Guid.s4() + Guid.s4() + "-" + Guid.s4() + "-" + Guid.s4() + "-" +
            Guid.s4() + "-" + Guid.s4() + Guid.s4() + Guid.s4());
    }
    static newGuidString() {
        return Guid.s4() + Guid.s4() + Guid.s4() + Guid.s4() +
            Guid.s4() + Guid.s4() + Guid.s4() + Guid.s4();
    }
    static s4() {
        return Math
            .floor((1 + Math.random()) * 0x10000)
            .toString(16)
            .substring(1);
    }
    toString() {
        return this.id;
    }
    static empty() {
        return new Guid("00000000-0000-0000-0000-000000000000");
    }
    static compareTo(value) {
        let x = this.toString();
        let y = value.toString();
        return (x < y ? -1 : (x > y ? 1 : 0));
    }
    constructor(id) {
        this.id = id.toLowerCase();
    }
}

class StiFormObject {
    constructor() {
        this.guid = Guid.newGuid().toString();
    }
    static { this.TYPE_PROPERTY_NAME = "Type"; }
    saveToJsonObject(options) {
        let json = new StiJson();
        if (this.type) {
            json.addPropertyString(StiFormObject.TYPE_PROPERTY_NAME, this.type.replace("_", ""));
        }
        json.addPropertyString("Guid", this.guid);
        return json;
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "Guid":
                    this.guid = property.value;
                    break;
            }
        }
    }
    deserializeCollection(jObject) {
        let result = [];
        for (let property of jObject.properties()) {
            let typeJson = property.value.value.filter((x) => x.name == StiFormObject.TYPE_PROPERTY_NAME);
            if (typeJson.length == 1) {
                let inst = this.createElementClass(typeJson[0].value);
                inst.loadFromJsonObject(property.value);
                result.push(inst);
            }
        }
        return result;
    }
    createElementClass(type) {
        return {};
    }
}

class StiLabelItem extends StiTextItem {
    constructor(parent, value = "", font = new Font("Segoe UI", 10), color = Color.black(), alignment = StiLabelAlignment.Left, verticalAlignment = StiVerticalAlignment.Top, width = 150) {
        super(value, font, color, null);
        this.font = font;
        this.color = color;
        this.alignment = alignment;
        this.eVerticalAlignment = verticalAlignment;
        this.width = width;
        this.eParent = parent;
    }
    get alignment() {
        return this._alignment;
    }
    set alignment(value) {
        this._alignment = value;
        this._isChanged = true;
        if (this.eParent?.fitTable) {
            this.eParent?.fitTable();
        }
    }
    get eVerticalAlignment() {
        return this._verticalAlignment;
    }
    set eVerticalAlignment(value) {
        this._verticalAlignment = value;
        this._isChanged = true;
    }
    get verticalAlignment() {
        return this.isUnchangedVAlign() ? StiVerticalAlignment.Center : this.eVerticalAlignment;
    }
    set verticalAlignment(value) {
        this.eVerticalAlignment = value;
    }
    get width() {
        return this._width;
    }
    set width(value) {
        if (value <= 0) {
            this._width = 0;
        }
        else {
            this._width = value;
        }
        this._isChanged = true;
    }
    haveContentAlignment() {
        return false;
    }
    haveVerticalAlignment() {
        return true;
    }
    setProperty(propName, value, oldObject) {
        super.setProperty(propName, value, oldObject);
        if (this[propName] && (oldObject === null || this[propName] == oldObject)) {
            this[propName] = value.clone ? value.clone() : value;
        }
    }
    saveToJsonObject(options) {
        let json = super.saveToJsonObject(options);
        json.addPropertyEnum("Alignment", StiLabelAlignment, this.alignment);
        json.addPropertyEnum("VerticalAlignment", StiVerticalAlignment, this.isUnchangedVAlign() ? StiVerticalAlignment.Center : this.eVerticalAlignment);
        if (this.width != null) {
            json.addPropertyNumber("Width", this.width);
        }
        return json;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Alignment":
                    this.alignment = Enum.parse(StiLabelAlignment, property.value);
                    break;
                case "Width":
                    this.width = property.value;
                    break;
                case "VerticalAlignment":
                    this._verticalAlignment = Enum.parse(StiVerticalAlignment, property.value);
                    break;
            }
        }
    }
    htmlStyle() {
        return `${super.htmlStyle()};text-align:${this.alignment == StiLabelAlignment.Top ? "Center" : Enum.getName(StiLabelAlignment, this.alignment)}`;
    }
    isUnchangedVAlign() {
        return (this.eParent.type == "Text_BoxElement" ||
            this.eParent.type == "Number_BoxElement" ||
            this.eParent.type == "Combo_BoxElement" ||
            this.eParent.type == "Check_BoxElement" ||
            this.eParent.type == "DateTime_BoxElement");
    }
}

class StiFormElement extends StiFormObject {
    constructor() {
        super(...arguments);
        this._visible = true;
        this._geometry = new StiRectangleGeometry(0, 0, this);
        this._padding = new StiPadding(8, 8, 8, 8, this);
        this._label = new StiLabelItem(this, "");
        this._readOnly = false;
        this._isChanged = true;
        this.render = true;
        this.position = "absolute";
        // public label: StiLabelItem = new StiLabelItem(this, "");
        this.hasGeometry = false;
        this.isAdded = false;
    }
    get maxWidth() {
        if (this.label.alignment == StiLabelAlignment.Top || this.label.eValue.length == 0) {
            return this.geometry.width - this.padding.left - this.padding.right;
        }
        else {
            return this.geometry.width - this.label.width - this.padding.left - this.padding.right;
        }
    }
    setDefaultValues() { }
    isChanged() {
        return this._isChanged || this._geometry.isChanged() || this._padding.isChanged();
    }
    getDefaultEditableContent() {
        return null;
    }
    canUpdateProperty(propName) {
        return true;
    }
    isLabelTopAlignment() {
        return this.label.alignment == StiLabelAlignment.Top ? true : false;
    }
    getVerticalAlignment() {
        if (this.label.verticalAlignment == StiVerticalAlignment.Top) {
            return "start";
        }
        else if (this.label.verticalAlignment == StiVerticalAlignment.Center) {
            return "center";
        }
        else {
            return "flex-end";
        }
    }
    resetChanged() {
        this._isChanged = false;
        this._geometry.resetChanged();
        this._padding.resetChanged();
    }
    get visible() {
        return this._visible;
    }
    set visible(value) {
        this._visible = value;
        this._isChanged = true;
    }
    get label() {
        return this._label;
    }
    set label(value) {
        let oldValue = this._label;
        if (oldValue != value) {
            this._label = value;
            this._isChanged = true;
        }
    }
    get geometry() {
        return this._geometry;
    }
    set geometry(value) {
        if (!this.geometry || !value || !this.geometry.equals(value)) {
            this._isChanged = true;
        }
        else {
            value.resetChanged();
        }
        this._geometry = value;
        this._geometry.changesInterceptor = this;
    }
    get padding() {
        return this._padding;
    }
    set padding(value) {
        let oldValue = this._padding;
        if (oldValue != value) {
            this._padding = value;
            this._padding.changesInterceptor = this;
            this._isChanged = true;
            this.propertyChanged("padding");
        }
    }
    get name() {
        return this._name;
    }
    set name(value) {
        this._name = value;
        this._isChanged = true;
    }
    get readOnly() {
        return this._readOnly;
    }
    set readOnly(value) {
        this._readOnly = value;
        this._isChanged = true;
    }
    get computedHeight() {
        return Number(this.height) + Number(this.padding.top) + Number(this.padding.bottom);
    }
    get computedWidth() {
        return Number(this.width) - Number(this.padding.left) - Number(this.padding.right);
    }
    get height() {
        return this.geometry.height;
    }
    set height(value) {
        this.geometry.height = value;
    }
    get width() {
        return this.geometry.width;
    }
    set width(value) {
        this.geometry.width = value;
    }
    get x() {
        return this.geometry.x;
    }
    set x(value) {
        this.geometry.x = value;
    }
    get y() {
        return this.geometry.y;
    }
    set y(value) {
        this.geometry.y = value;
    }
    hasText() {
        return false;
    }
    propertyChanged(propName) { }
    showLabelPlaceholder(isSelected) {
        return this.label.alignment == StiLabelAlignment.Top || this.label.width < 15 || !isSelected ? true : false;
    }
    getContentAlign() {
        return this.label.alignment == StiLabelAlignment.Right ? "end" : "start";
    }
    getLabelWidth() {
        return this.label.alignment == StiLabelAlignment.Top ? "100%" : this.label.width + "px";
    }
    getTopMargin() {
        return this.label.alignment == StiLabelAlignment.Top && this.label.value ? "8" : "0";
    }
    setProperty(propName, value, oldObject) {
        if (!this.canUpdateProperty(propName)) {
            return;
        }
        if (propName.startsWith("label") && "label" in this) {
            this.label.setProperty(propName.replace("label.", ""), value.clone ? value.clone() : value, oldObject);
        }
        else if (propName.startsWith("description") && "description" in this) {
            this.description.setProperty(propName.replace("description.", ""), value.clone ? value.clone() : value, oldObject);
        }
        else if (this[propName] &&
            (oldObject === null ||
                (propName == "padding" && this[propName].equals(oldObject)) ||
                this[propName] == oldObject)) {
            this[propName] = value.clone ? value.clone() : value;
        }
        else if (propName == "innerText.color" &&
            this["textColor"] &&
            (oldObject === null || oldObject.equals(this["textColor"]))) {
            this["textColor"] = value.clone();
        }
        else if (propName == "innerText.backgroundColor" &&
            this["backgroundColor"] &&
            (oldObject === null || oldObject.equals(this["backgroundColor"]))) {
            this["backgroundColor"] = value.clone();
        }
        else if (propName == "innerText.borderColor" &&
            this["borderColor"] &&
            (oldObject === null || oldObject.equals(this["borderColor"]))) {
            this["borderColor"] = value.clone();
        }
        else if (propName == "innerText.checkColor" &&
            this["checkColor"] &&
            (oldObject === null || oldObject.equals(this["checkColor"]))) {
            this["checkColor"] = value.clone();
        }
        else if (propName == "innerText.borderWeight" &&
            this["borderWeight"] &&
            (oldObject === null || this["borderWeight"] == oldObject)) {
            this["borderWeight"] = value;
        }
        else if (propName == "innerText.contentAlignment" &&
            this["contentAlignment"] &&
            (oldObject === null || this["contentAlignment"] == oldObject)) {
            this["contentAlignment"] = value;
        }
        else if (propName.startsWith("innerText.font") &&
            this["font"] &&
            (oldObject === null || oldObject.equals(this["font"]))) {
            this["font"].setProperty(propName.replace("innerText.font.", ""), value);
        }
        else if (propName.startsWith("padding.") &&
            this["padding"] &&
            (oldObject === null || oldObject.equals(this["padding"]))) {
            let opt = propName.replace("padding.", "");
            this["padding"][opt] = value;
        }
    }
    arrayOfStylesToString(array) {
        let styles = [];
        if (array.length > 0) {
            array.forEach((item) => {
                if (item != "Underline") {
                    styles.push(item);
                }
            });
        }
        return styles.length > 0 ? styles.join(" ").toLocaleLowerCase() : "";
    }
    getUsedFonts(usedFonts) {
        usedFonts.add(this._label.font.family, this.arrayOfStylesToString(this._label.font.style), this._label.font.size);
    }
    getParent(form) {
        let container;
        form.pages.forEach((page) => {
            if (page.elements.indexOf(this) >= 0) {
                container = page;
            }
            else {
                page.allElements.forEach((e) => {
                    let elements = e.elements;
                    if (elements && elements.indexOf(this) >= 0) {
                        container = e;
                    }
                });
            }
        });
        return container;
    }
    getOverPageGeometry(form) {
        let geometry = this.geometry.clone();
        form.pages.forEach((page) => {
            let allElements = page.allElements;
            let child = this;
            let find = true;
            while (find) {
                find = false;
                allElements.forEach((e) => {
                    let elements = e.elements;
                    if (elements && elements.indexOf(child) >= 0) {
                        geometry.x += e.geometry.x + e.padding.left;
                        geometry.y += e.geometry.y + e.padding.top;
                        child = e;
                        find = true;
                    }
                });
            }
        });
        return geometry;
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyBool("Visible", this.visible);
        jObject.addPropertyBool("ReadOnly", this.readOnly);
        jObject.addPropertyJObject("Padding", this.padding.saveToJsonObject(options));
        jObject.addPropertyJObject("Geometry", this.geometry.saveToJsonObject(options));
        jObject.addPropertyStringNullOrEmpty("Name", this.name);
        return jObject;
    }
    loadFromJsonObject(json) {
        this.isAdded = true;
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Visible":
                    this.visible = property.value;
                    break;
                case "Enabled":
                case "ReadOnly":
                    if (property.name == "Enabled") {
                        this.readOnly = !property.value;
                    }
                    else {
                        this.readOnly = property.value;
                    }
                    break;
                case "Padding":
                    this.padding = new StiPadding();
                    this.padding.loadFromJsonObject(property.value);
                    break;
                case "Geometry":
                    this.geometry = new StiRectangleGeometry();
                    this.geometry.loadFromJsonObject(property.value);
                    break;
                case "Name":
                    this.name = property.value;
                    break;
            }
        }
    }
}

class StiComboBoxElement extends StiFormElement {
    constructor() {
        super();
        this.type = "Combo_BoxElement";
        this.tooltip = "";
        this.required = false;
        this.description = new StiTextItem();
        this.font = new Font("Segoe UI", 10);
        this.backgroundColor = Color.white();
        this.textColor = Color.black();
        this.borderColor = Color.lightGray();
        this.borderWeight = StiLineWeight.Thin;
        this.editable = false;
        this.options = [];
        this.selectedOption = "";
        this.geometry = new StiRectangleGeometry(150, 40);
        this.label = new StiLabelItem(this, StiLocalizationService.get("Components", "StiComboBox"));
        this.options.push(StiLocalizationService.get("PropertyMain", "First"));
        this.options.push(StiLocalizationService.get("PropertyMain", "Second"));
        this.options.push(StiLocalizationService.get("PropertyMain", "Third"));
    }
    setDefaultValues() {
        this.selectedOption = "";
    }
    setTabIndex(value) {
        this.tabIndex = value++;
        return value;
    }
    getUsedFonts(usedFonts) {
        super.getUsedFonts(usedFonts);
        usedFonts.add(this.font.family, this.arrayOfStylesToString(this.font.style), this.font.size);
        usedFonts.add(this.description.font.family, this.arrayOfStylesToString(this.description.font.style), this.description.font.size);
    }
    getDefaultEditableContent() {
        let textItem = new StiInputTextItem(this.selectedOption, this.font, this.textColor, this.backgroundColor);
        textItem.element = this;
        return textItem;
    }
    get eFont() {
        return this.font;
    }
    set eFont(value) {
        this.font = value;
    }
    get eBackgroundColor() {
        return this.backgroundColor;
    }
    set eBackgroundColor(value) {
        this.backgroundColor = value;
    }
    get eColor() {
        return this.textColor;
    }
    set eColor(value) {
        this.textColor = value;
    }
    get value() {
        return this.selectedOption;
    }
    haveBackgoundColor() {
        return true;
    }
    haveContentAlignment() {
        return false;
    }
    haveVerticalAlignment() {
        return false;
    }
    htmlStyle() {
        return `${this.font.htmlStyle()};color:${this.eColor.toHtmlColor()}}`;
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Label", this.label.saveToJsonObject(options));
        jObject.addPropertyJObject("Description", this.description.saveToJsonObject(options));
        jObject.addPropertyJObject("Font", this.font.saveToJsonObject(options));
        jObject.addPropertyColor("BackgroundColor", this.backgroundColor);
        jObject.addPropertyColor("TextColor", this.textColor);
        jObject.addPropertyString("Tooltip", this.tooltip);
        jObject.addPropertyBool("Required", this.required);
        jObject.addPropertyColor("BorderColor", this.borderColor);
        jObject.addPropertyEnum("BorderWeight", StiLineWeight, this.borderWeight);
        jObject.addPropertyBool("Editable", this.editable);
        jObject.addPropertyString("SelectedOption", this.selectedOption);
        jObject.addPropertyArray("Options", this.options);
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "BackgroundColor":
                    this.backgroundColor = new Color();
                    this.backgroundColor.deserializeFromString(property.value);
                    break;
                case "TextColor":
                    this.textColor = new Color();
                    this.textColor.deserializeFromString(property.value);
                    break;
                case "Label":
                    this.label = new StiLabelItem(this);
                    this.label.loadFromJsonObject(property.value);
                    break;
                case "Font":
                    this.font = new Font();
                    this.font.loadFromJsonObject(property.value);
                    break;
                case "Description":
                    this.description = new StiTextItem();
                    this.description.loadFromJsonObject(property.value);
                    break;
                case "Tooltip":
                    this.tooltip = property.value;
                    break;
                case "Required":
                    this.required = property.value;
                    break;
                case "BorderColor":
                    this.borderColor = new Color();
                    this.borderColor.deserializeFromString(property.value);
                    break;
                case "BorderWeight":
                    this.borderWeight = Enum.parse(StiLineWeight, property.value);
                    break;
                case "Editable":
                    this.editable = property.value;
                    break;
                case "SelectedOption":
                    this.selectedOption = property.value;
                    break;
                case "Options":
                    this.options = [];
                    property.value.properties().forEach((p) => this.options.push(p.value));
                    break;
            }
        }
    }
}

class StiAddressLabelItem {
    get eFont() {
        return this.parent.descriptionFont;
    }
    set eFont(value) {
        this.parent.descriptionFont = value;
    }
    get eColor() {
        return this.parent.descriptionColor;
    }
    set eColor(value) {
        this.parent.descriptionColor = value;
    }
    haveBackgoundColor() {
        return false;
    }
    get eContentAlignment() {
        return this.parent.contentAlignment;
    }
    set eContentAlignment(value) {
        this.parent.contentAlignment = value;
    }
    haveContentAlignment() {
        return true;
    }
    htmlStyle() {
        return this.parent ? `${this.eFont.htmlStyle()};color:${this.eColor.toHtmlColor()}` : "";
    }
    set eValue(value) {
        this.parent[this.property] = value;
    }
    get eValue() {
        return this.parent[this.property];
    }
    haveVerticalAlignment() {
        return false;
    }
    constructor(value, parent) {
        this.parent = parent;
        this.property = value;
    }
}

class StiAddressElement extends StiFormElement {
    constructor() {
        super();
        this.type = "AddressElement";
        this.font = new Font("Segoe UI", 10);
        this.descriptionFont = new Font("Segoe UI", 9);
        this.descriptionColor = Color.black();
        this.backgroundColor = Color.white();
        this.textColor = Color.black();
        this.borderColor = Color.lightGray();
        this.borderWeight = StiLineWeight.Thin;
        this.contentAlignment = StiHorizontalAlignment.Left;
        this.streetAddress = "";
        this.streetAddress2 = "";
        this.city = "";
        this.state = "";
        this.zipCode = "";
        this.country = "";
        this.streetAddressLabel = StiLocalizationService.get("PropertyMain", "StreetAddress");
        this.streetAddress2Label = StiLocalizationService.get("PropertyMain", "StreetAddress") + " 2";
        this.cityLabel = StiLocalizationService.get("PropertyMain", "City");
        this.stateLabel = StiLocalizationService.get("PropertyMain", "State");
        this.zipCodeLabel = StiLocalizationService.get("Components", "StiZipCode");
        this.countryLabel = StiLocalizationService.get("PropertyMain", "Country");
        this.streetAddressLabelItem = new StiAddressLabelItem("streetAddressLabel", this);
        this.streetAddress2LabelItem = new StiAddressLabelItem("streetAddress2Label", this);
        this.cityLabelItem = new StiAddressLabelItem("cityLabel", this);
        this.stateLabelItem = new StiAddressLabelItem("stateLabel", this);
        this.zipCodeLabelItem = new StiAddressLabelItem("zipCodeLabel", this);
        this.countryLabelItem = new StiAddressLabelItem("countryLabel", this);
        this.useStreetAddress = true;
        this.useStreetAddress2 = true;
        this.useCity = true;
        this.useState = true;
        this.useZipCode = true;
        this.useCountry = true;
        this.maximum = 255;
        this.geometry = new StiRectangleGeometry(150, 200);
        this.label = new StiLabelItem(this, StiLocalizationService.get("Report", "Address"));
        this.geometry.minWidth = 150;
        this.geometry.minHeight = 50;
    }
    setDefaultValues() {
        this.streetAddress = "";
        this.streetAddress2 = "";
        this.city = "";
        this.state = "";
        this.zipCode = "";
        this.country = "";
    }
    setTabIndex(value) {
        this.tabIndex = value;
        return value + 6;
    }
    get contentAreaWidth() {
        let margin = this.padding;
        return this.width - margin.left - margin.right;
    }
    get contentAreaHeight() {
        let margin = this.padding;
        return this.height - margin.top - margin.bottom - 35;
    }
    getUsedFonts(usedFonts) {
        super.getUsedFonts(usedFonts);
        usedFonts.add(this.font.family, this.arrayOfStylesToString(this.font.style), this.font.size);
        usedFonts.add(this.descriptionFont.family, this.arrayOfStylesToString(this.descriptionFont.style), this.descriptionFont.size);
    }
    getDefaultEditableContent() {
        let textItem = new StiInputTextItem("", this.font, this.textColor, this.backgroundColor, this.contentAlignment);
        textItem.element = this;
        return textItem;
    }
    setProperty(propName, value, oldObject) {
        super.setProperty(propName, value, oldObject);
        if (propName.startsWith("description.font") &&
            (oldObject === null || oldObject.equals(this.descriptionFont))) {
            this.descriptionFont.setProperty(propName.replace("description.font.", ""), value);
        }
        else if (propName == "description.color" &&
            (oldObject === null || oldObject.equals(this.descriptionColor))) {
            this.descriptionColor = value.clone();
        }
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Label", this.label.saveToJsonObject(options));
        jObject.addPropertyColor("BackgroundColor", this.backgroundColor);
        jObject.addPropertyColor("TextColor", this.textColor);
        jObject.addPropertyJObject("Font", this.font.saveToJsonObject(options));
        jObject.addPropertyJObject("DescriptionFont", this.descriptionFont.saveToJsonObject(options));
        jObject.addPropertyColor("DescriptionColor", this.descriptionColor);
        jObject.addPropertyColor("BorderColor", this.borderColor);
        jObject.addPropertyString("StreetAddress", this.streetAddress);
        jObject.addPropertyString("StreetAddress2", this.streetAddress2);
        jObject.addPropertyString("City", this.city);
        jObject.addPropertyString("State", this.state);
        jObject.addPropertyString("ZipCode", this.zipCode);
        jObject.addPropertyString("Country", this.country);
        jObject.addPropertyString("StreetAddressLabel", this.streetAddressLabel);
        jObject.addPropertyString("StreetAddress2Label", this.streetAddress2Label);
        jObject.addPropertyString("CityLabel", this.cityLabel);
        jObject.addPropertyString("StateLabel", this.stateLabel);
        jObject.addPropertyString("ZipCodeLabel", this.zipCodeLabel);
        jObject.addPropertyString("CountryLabel", this.countryLabel);
        jObject.addPropertyEnum("BorderWeight", StiLineWeight, this.borderWeight);
        jObject.addPropertyEnum("ContentAlignment", StiHorizontalAlignment, this.contentAlignment);
        jObject.addPropertyBool("UseCity", this.useCity);
        jObject.addPropertyBool("UseCountry", this.useCountry);
        jObject.addPropertyBool("UseState", this.useState);
        jObject.addPropertyBool("UseStreetAddress", this.useStreetAddress);
        jObject.addPropertyBool("UseStreetAddress2", this.useStreetAddress2);
        jObject.addPropertyBool("UseZipCode", this.useZipCode);
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Label":
                    this.label = new StiLabelItem(this);
                    this.label.loadFromJsonObject(property.value);
                    break;
                case "BackgroundColor":
                    this.backgroundColor = new Color();
                    this.backgroundColor.deserializeFromString(property.value);
                    break;
                case "DescriptionColor":
                    this.descriptionColor = new Color();
                    this.descriptionColor.deserializeFromString(property.value);
                    break;
                case "TextColor":
                    this.textColor = new Color();
                    this.textColor.deserializeFromString(property.value);
                    break;
                case "BorderColor":
                    this.borderColor = new Color();
                    this.borderColor.deserializeFromString(property.value);
                    break;
                case "Font":
                    this.font = new Font();
                    this.font.loadFromJsonObject(property.value);
                    break;
                case "DescriptionFont":
                    this.descriptionFont = new Font();
                    this.descriptionFont.loadFromJsonObject(property.value);
                    break;
                case "StreetAddress":
                    this.streetAddress = property.value;
                    break;
                case "StreetAddress2":
                    this.streetAddress2 = property.value;
                    break;
                case "City":
                    this.city = property.value;
                    break;
                case "State":
                    this.state = property.value;
                    break;
                case "ZipCode":
                    this.zipCode = property.value;
                    break;
                case "Country":
                    this.country = property.value;
                    break;
                case "StreetAddressLabel":
                    this.streetAddressLabel = property.value;
                    break;
                case "StreetAddress2Label":
                    this.streetAddress2Label = property.value;
                    break;
                case "CityLabel":
                    this.cityLabel = property.value;
                    break;
                case "StateLabel":
                    this.stateLabel = property.value;
                    break;
                case "ZipCodeLabel":
                    this.zipCodeLabel = property.value;
                    break;
                case "CountryLabel":
                    this.countryLabel = property.value;
                    break;
                case "BorderWeight":
                    this.borderWeight = Enum.parse(StiLineWeight, property.value);
                    break;
                case "ContentAlignment":
                    this.contentAlignment = Enum.parse(StiHorizontalAlignment, property.value);
                    break;
                case "UseCity":
                    this.useCity = property.value;
                    break;
                case "UseCountry":
                    this.useCountry = property.value;
                    break;
                case "UseState":
                    this.useState = property.value;
                    break;
                case "UseStreetAddress":
                    this.useStreetAddress = property.value;
                    break;
                case "UseStreetAddress2":
                    this.useStreetAddress2 = property.value;
                    break;
                case "UseZipCode":
                    this.useZipCode = property.value;
                    break;
            }
        }
    }
    htmlStyle() {
        return `${this.font.htmlStyle()};color:${this.textColor.toHtmlColor()};text-align:${Enum.getName(StiHorizontalAlignment, this.contentAlignment)}`;
    }
    comboBoxHtmlStyle() {
        return `${this.font.htmlStyle()};color:${this.textColor.toHtmlColor()}}`;
    }
}

class StiBarcodeElement extends StiFormElement {
    propertyChanged(propName) {
        this._isChanged = true;
    }
    get backColor() {
        return this._backColor;
    }
    set backColor(value) {
        let oldValue = this._backColor;
        if (oldValue != value) {
            this._backColor = value;
            this._backColor.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get foreColor() {
        return this._foreColor;
    }
    set foreColor(value) {
        let oldValue = this._foreColor;
        if (oldValue != value) {
            this._foreColor = value;
            value.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get style() {
        return this._style;
    }
    set style(value) {
        let oldValue = this._style;
        if (oldValue != value) {
            this._style = value;
            this.setStyle(value);
            this._isChanged = true;
        }
    }
    get Width() {
        return this._width;
    }
    set Width(value) {
        let oldValue = this._width;
        if (oldValue != value) {
            this._width = value;
            this._isChanged = true;
        }
    }
    get Height() {
        return this._height;
    }
    set Height(value) {
        let oldValue = this._height;
        if (oldValue != value) {
            this._height = value;
            this._isChanged = true;
        }
    }
    constructor() {
        super();
        this.type = "BarCodeElement";
        this.tooltip = "";
        this._description = new StiTextItem();
        this._barcodeType = StiBarcodeType.QRCode;
        this._matrixSize = StiQRCodeSize.Automatic;
        this._errorCorrectionLevel = StiQRCodeErrorCorrectionLevel.Level1;
        this._bodyBrushType = StiBodyBrush.Solid;
        this._bodyBrushColor = Color.black();
        this._startBodyBrushColor = Color.black();
        this._endBodyBrushColor = Color.black();
        this._bodyBrushBackColor = Color.transparent();
        this._bodyBrushForeColor = Color.black();
        this._bodyShapeType = StiQRCodeBodyShapeType.Square;
        this._bodyBrushAngle = 0;
        this._bodyBrushHatchStyle = HatchStyle.Horizontal;
        this._bodyBrushFocus = 0.5;
        this._bodyBrushBlend = 0.2;
        this._bodyBrushDrawHatch = false;
        this._eyeBallBrushType = StiBodyBrush.Solid;
        this._eyeBallBrushColor = Color.black();
        this._startEyeBallBrushColor = Color.black();
        this._endEyeBallBrushColor = Color.black();
        this._eyeBallBrushBackColor = Color.transparent();
        this._eyeBallBrushForeColor = Color.black();
        this._eyeBallShapeType = StiQRCodeEyeBallShapeType.Square;
        this._eyeBallBrushAngle = 0;
        this._eyeBallBrushHatchStyle = HatchStyle.Horizontal;
        this._eyeBallBrushFocus = 0.5;
        this._eyeBallBrushBlend = 0.2;
        this._eyeBallBrushDrawHatch = false;
        this._eyeFrameBrushType = StiBodyBrush.Solid;
        this._eyeFrameBrushColor = Color.black();
        this._startEyeFrameBrushColor = Color.black();
        this._endEyeFrameBrushColor = Color.black();
        this._eyeFrameBrushBackColor = Color.transparent();
        this._eyeFrameBrushForeColor = Color.black();
        this._eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Square;
        this._eyeFrameBrushAngle = 0;
        this._eyeFrameBrushHatchStyle = HatchStyle.Horizontal;
        this._eyeFrameBrushFocus = 0.5;
        this._eyeFrameBrushBlend = 0.2;
        this._eyeFrameBrushDrawHatch = false;
        this._codeString = StiLocalizationService.get("Components", "StiBarCode");
        this._width = 90;
        this._height = 90;
        this._style = 1;
        this._backColor = Color.transparent();
        this._foreColor = Color.black();
        this.showProgress = false;
        this.showBodyBrushEditor = false;
        this.showEyeBallBrushEditor = false;
        this.showEyeFrameBrushEditor = false;
        this.geometry = new StiRectangleGeometry(170, 110);
        this.label = new StiLabelItem(this, StiLocalizationService.get("Components", "StiBarCode"));
        this.backColor = Color.transparent();
        this.foreColor = Color.black();
        this.bodyBrushColor = Color.black();
        this.startBodyBrushColor = Color.black();
        this.endBodyBrushColor = Color.black();
        this.bodyBrushBackColor = Color.transparent();
        this.bodyBrushForeColor = Color.black();
        this.eyeBallBrushColor = Color.black();
        this.startEyeBallBrushColor = Color.black();
        this.endEyeBallBrushColor = Color.black();
        this.eyeBallBrushBackColor = Color.transparent();
        this.eyeBallBrushForeColor = Color.black();
        this.eyeFrameBrushColor = Color.black();
        this.startEyeFrameBrushColor = Color.black();
        this.endEyeFrameBrushColor = Color.black();
        this.eyeFrameBrushBackColor = Color.transparent();
        this.eyeFrameBrushForeColor = Color.black();
    }
    getUsedFonts(usedFonts) {
        super.getUsedFonts(usedFonts);
        usedFonts.add(this.description.font.family, this.arrayOfStylesToString(this.description.font.style), this.description.font.size);
    }
    isChanged() {
        return super.isChanged() || this.label?.isChanged() || this.description?.isChanged();
    }
    setStyle(value) {
        switch (value) {
            case 1:
                this.backColor = Color.transparent();
                this.bodyBrushType = StiBodyBrush.Solid;
                this.bodyBrushColor = Color.black();
                this.bodyShapeType = StiQRCodeBodyShapeType.Square;
                this.eyeBallBrushType = StiBodyBrush.Solid;
                this.eyeBallBrushColor = Color.black();
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Square;
                this.eyeFrameBrushType = StiBodyBrush.Solid;
                this.eyeFrameBrushColor = Color.black();
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Square;
                break;
            case 2:
                this.backColor = Color.transparent();
                this.bodyBrushType = StiBodyBrush.Solid;
                this.bodyBrushColor = Color.fromArgb(96, 75, 117);
                this.bodyShapeType = StiQRCodeBodyShapeType.Diamond;
                this.eyeBallBrushType = StiBodyBrush.Gradient;
                this.startEyeBallBrushColor = Color.fromArgb(3, 152, 152);
                this.endEyeBallBrushColor = Color.fromArgb(44, 110, 154);
                this.eyeBallBrushAngle = 30;
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Round1;
                this.eyeFrameBrushType = StiBodyBrush.Glass;
                this.eyeFrameBrushColor = Color.fromArgb(118, 202, 226);
                this.eyeFrameBrushDrawHatch = false;
                this.eyeFrameBrushBlend = 0.2;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Round1;
                break;
            case 3:
                this.backColor = Color.transparent();
                this.bodyBrushType = StiBodyBrush.Solid;
                this.bodyBrushColor = Color.fromArgb(85, 85, 85);
                this.bodyShapeType = StiQRCodeBodyShapeType.Circle;
                this.eyeBallBrushType = StiBodyBrush.Glare;
                this.startEyeBallBrushColor = Color.fromArgb(100, 115, 53);
                this.endEyeBallBrushColor = Color.fromArgb(137, 73, 106);
                this.eyeBallBrushAngle = 5;
                this.eyeBallBrushFocus = 0.5;
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Circle;
                this.eyeFrameBrushType = StiBodyBrush.Glass;
                this.eyeFrameBrushColor = Color.fromArgb(57, 94, 133);
                this.eyeFrameBrushDrawHatch = false;
                this.eyeFrameBrushBlend = 0.2;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Circle;
                break;
            case 4:
                this.backColor = Color.transparent();
                this.bodyBrushType = StiBodyBrush.Glare;
                this.startBodyBrushColor = Color.fromArgb(116, 46, 44);
                this.endBodyBrushColor = Color.fromArgb(33, 77, 132);
                this.bodyBrushAngle = 7;
                this.bodyBrushFocus = 0.9;
                this.bodyShapeType = StiQRCodeBodyShapeType.RoundedSquare;
                this.eyeBallBrushType = StiBodyBrush.Hatch;
                this.eyeBallBrushHatchStyle = HatchStyle.LargeCheckerBoard;
                this.eyeBallBrushForeColor = Color.fromArgb(120, 57, 72);
                this.eyeBallBrushBackColor = Color.fromArgb(105, 82, 137);
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Round;
                this.eyeFrameBrushType = StiBodyBrush.Gradient;
                this.startEyeFrameBrushColor = Color.fromArgb(90, 1, 179);
                this.endEyeFrameBrushColor = Color.fromArgb(59, 73, 144);
                this.eyeFrameBrushAngle = 30;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Round;
                break;
            case 5:
                this.backColor = Color.transparent();
                this.bodyBrushType = StiBodyBrush.Glare;
                this.startBodyBrushColor = Color.fromArgb(184, 5, 8);
                this.endBodyBrushColor = Color.fromArgb(48, 117, 132);
                this.bodyBrushAngle = 3;
                this.bodyBrushFocus = 0.5;
                this.bodyShapeType = StiQRCodeBodyShapeType.ZebraCross1;
                this.eyeBallBrushType = StiBodyBrush.Solid;
                this.eyeBallBrushColor = Color.fromArgb(12, 172, 172);
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Circle;
                this.eyeFrameBrushType = StiBodyBrush.Gradient;
                this.startEyeFrameBrushColor = Color.fromArgb(191, 0, 178);
                this.endEyeFrameBrushColor = Color.fromArgb(193, 0, 64);
                this.eyeFrameBrushAngle = 10;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Round1;
                break;
            case 6:
                this.backColor = Color.transparent();
                this.bodyBrushType = StiBodyBrush.Glare;
                this.startBodyBrushColor = Color.fromArgb(73, 57, 99);
                this.endBodyBrushColor = Color.fromArgb(1, 123, 46);
                this.bodyBrushAngle = 3;
                this.bodyBrushFocus = 0.5;
                this.bodyShapeType = StiQRCodeBodyShapeType.Dot;
                this.eyeBallBrushType = StiBodyBrush.Solid;
                this.eyeBallBrushColor = Color.fromArgb(36, 82, 143);
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Dots;
                this.eyeFrameBrushType = StiBodyBrush.Glare;
                this.startEyeFrameBrushColor = Color.fromArgb(179, 1, 166);
                this.endEyeFrameBrushColor = Color.fromArgb(49, 53, 28);
                this.eyeFrameBrushAngle = 10;
                this.eyeFrameBrushFocus = 0.8;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Dots;
                break;
            case 7:
                this.backColor = Color.fromArgb(37, 86, 99);
                this.bodyBrushType = StiBodyBrush.Hatch;
                this.bodyBrushHatchStyle = HatchStyle.DashedHorizontal;
                this.bodyBrushForeColor = Color.fromArgb(216, 238, 243);
                this.bodyBrushBackColor = Color.fromArgb(229, 185, 183);
                this.bodyShapeType = StiQRCodeBodyShapeType.Square;
                this.eyeBallBrushType = StiBodyBrush.Gradient;
                this.startEyeBallBrushColor = Color.fromArgb(242, 242, 242);
                this.endEyeBallBrushColor = Color.fromArgb(255, 147, 147);
                this.eyeBallBrushAngle = 4;
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Square;
                this.eyeFrameBrushType = StiBodyBrush.Glare;
                this.startEyeFrameBrushColor = Color.fromArgb(178, 161, 199);
                this.endEyeFrameBrushColor = Color.fromArgb(253, 234, 218);
                this.eyeFrameBrushAngle = 4;
                this.eyeFrameBrushFocus = 0.5;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Square;
                break;
            case 8:
                this.backColor = Color.fromArgb(87, 118, 157);
                this.bodyBrushType = StiBodyBrush.Gradient;
                this.startBodyBrushColor = Color.fromArgb(219, 238, 243);
                this.endBodyBrushColor = Color.fromArgb(203, 184, 168);
                this.bodyBrushAngle = 5;
                this.bodyShapeType = StiQRCodeBodyShapeType.Dot;
                this.eyeBallBrushType = StiBodyBrush.Gradient;
                this.startEyeBallBrushColor = Color.fromArgb(219, 238, 243);
                this.endEyeBallBrushColor = Color.fromArgb(203, 184, 168);
                this.eyeBallBrushAngle = 5;
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Square;
                this.eyeFrameBrushType = StiBodyBrush.Gradient;
                this.startEyeFrameBrushColor = Color.fromArgb(219, 238, 243);
                this.endEyeFrameBrushColor = Color.fromArgb(203, 184, 168);
                this.eyeFrameBrushAngle = 5;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Square;
                break;
            case 9:
                this.backColor = Color.fromArgb(144, 60, 57);
                this.bodyBrushType = StiBodyBrush.Gradient;
                this.startBodyBrushColor = Color.fromArgb(219, 238, 243);
                this.endBodyBrushColor = Color.fromArgb(251, 213, 181);
                this.bodyBrushAngle = 3;
                this.bodyShapeType = StiQRCodeBodyShapeType.Square;
                this.eyeBallBrushType = StiBodyBrush.Gradient;
                this.startEyeBallBrushColor = Color.fromArgb(219, 238, 243);
                this.endEyeBallBrushColor = Color.fromArgb(251, 213, 181);
                this.eyeBallBrushAngle = 3;
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Square;
                this.eyeFrameBrushType = StiBodyBrush.Gradient;
                this.startEyeFrameBrushColor = Color.fromArgb(219, 238, 243);
                this.endEyeFrameBrushColor = Color.fromArgb(251, 213, 181);
                this.eyeFrameBrushAngle = 3;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Square;
                break;
            case 10:
                this.backColor = Color.fromArgb(37, 86, 99);
                this.bodyBrushType = StiBodyBrush.Hatch;
                this.bodyBrushHatchStyle = HatchStyle.DashedHorizontal;
                this.bodyBrushForeColor = Color.fromArgb(219, 238, 243);
                this.bodyBrushBackColor = Color.fromArgb(229, 185, 183);
                this.bodyShapeType = StiQRCodeBodyShapeType.Square;
                this.eyeBallBrushType = StiBodyBrush.Hatch;
                this.eyeBallBrushHatchStyle = HatchStyle.DashedHorizontal;
                this.eyeBallBrushForeColor = Color.fromArgb(219, 238, 243);
                this.eyeBallBrushBackColor = Color.fromArgb(229, 185, 183);
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Square;
                this.eyeFrameBrushType = StiBodyBrush.Hatch;
                this.eyeFrameBrushHatchStyle = HatchStyle.DashedHorizontal;
                this.eyeFrameBrushForeColor = Color.fromArgb(219, 238, 243);
                this.eyeFrameBrushBackColor = Color.fromArgb(229, 185, 183);
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Square;
                break;
            case 11:
                this.foreColor = Color.fromArgb(191, 178, 205);
                this.backColor = Color.fromArgb(38, 38, 38);
                this.bodyBrushType = StiBodyBrush.Gradient;
                this.startBodyBrushColor = Color.fromArgb(254, 243, 255);
                this.endBodyBrushColor = Color.fromArgb(154, 143, 167);
                this.bodyBrushAngle = 1;
                this.bodyShapeType = StiQRCodeBodyShapeType.Diamond;
                this.eyeBallBrushType = StiBodyBrush.Empty;
                this.startEyeBallBrushColor = Color.fromArgb(254, 243, 255);
                this.endEyeBallBrushColor = Color.fromArgb(154, 143, 167);
                this.eyeBallBrushAngle = 3;
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Square;
                this.eyeFrameBrushType = StiBodyBrush.Empty;
                this.startEyeFrameBrushColor = Color.fromArgb(254, 243, 255);
                this.endEyeFrameBrushColor = Color.fromArgb(154, 143, 16);
                this.eyeFrameBrushAngle = 1;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Square;
                break;
            case 12:
                this.backColor = Color.fromArgb(37, 86, 99);
                this.bodyBrushType = StiBodyBrush.Glare;
                this.startBodyBrushColor = Color.fromArgb(178, 161, 199);
                this.endBodyBrushColor = Color.fromArgb(0, 255, 120);
                this.bodyBrushAngle = 3;
                this.bodyBrushFocus = 0.5;
                this.bodyShapeType = StiQRCodeBodyShapeType.Dot;
                this.eyeBallBrushType = StiBodyBrush.Solid;
                this.eyeBallBrushColor = Color.fromArgb(141, 179, 226);
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Dots;
                this.eyeFrameBrushType = StiBodyBrush.Gradient;
                this.startEyeFrameBrushColor = Color.fromArgb(255, 147, 251);
                this.endEyeFrameBrushColor = Color.fromArgb(146, 208, 80);
                this.eyeFrameBrushAngle = 4;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Dots;
                break;
            case 13:
                this.backColor = Color.transparent();
                this.bodyBrushType = StiBodyBrush.Solid;
                this.bodyBrushColor = Color.fromArgb(28, 125, 138);
                this.bodyShapeType = StiQRCodeBodyShapeType.ZebraVertical;
                this.eyeBallBrushType = StiBodyBrush.Solid;
                this.eyeBallBrushColor = Color.fromArgb(211, 136, 84);
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.ZebraHorizontal;
                this.eyeFrameBrushType = StiBodyBrush.Solid;
                this.eyeFrameBrushColor = Color.fromArgb(88, 66, 111);
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Round;
                break;
            case 14:
                this.backColor = Color.transparent();
                this.bodyBrushType = StiBodyBrush.Solid;
                this.bodyBrushColor = Color.fromArgb(34, 82, 94);
                this.bodyShapeType = StiQRCodeBodyShapeType.RoundedSquare;
                this.eyeBallBrushType = StiBodyBrush.Solid;
                this.eyeBallBrushColor = Color.fromArgb(34, 82, 94);
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Square;
                this.eyeFrameBrushType = StiBodyBrush.Solid;
                this.eyeFrameBrushColor = Color.fromArgb(34, 82, 94);
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Square;
                break;
            case 15:
                this.backColor = Color.transparent();
                this.bodyBrushType = StiBodyBrush.Hatch;
                this.bodyBrushHatchStyle = HatchStyle.DarkHorizontal;
                this.bodyBrushForeColor = Color.fromArgb(176, 71, 67);
                this.bodyBrushBackColor = Color.fromArgb(91, 139, 150);
                this.bodyShapeType = StiQRCodeBodyShapeType.Square;
                this.eyeBallBrushType = StiBodyBrush.Glare;
                this.startEyeBallBrushColor = Color.fromArgb(191, 183, 184);
                this.endEyeBallBrushColor = Color.fromArgb(199, 29, 28);
                this.eyeBallBrushAngle = 30;
                this.eyeBallBrushFocus = 0.5;
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Square;
                this.eyeFrameBrushType = StiBodyBrush.Glare;
                this.startEyeFrameBrushColor = Color.fromArgb(102, 79, 128);
                this.endEyeFrameBrushColor = Color.fromArgb(189, 95, 32);
                this.eyeFrameBrushAngle = 0;
                this.eyeFrameBrushFocus = 0;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Square;
                break;
            case 16:
                this.backColor = Color.transparent();
                this.bodyBrushType = StiBodyBrush.Gradient;
                this.startBodyBrushColor = Color.fromArgb(147, 60, 53);
                this.endBodyBrushColor = Color.fromArgb(122, 106, 66);
                this.bodyBrushAngle = 3;
                this.bodyShapeType = StiQRCodeBodyShapeType.ZebraCross2;
                this.eyeBallBrushType = StiBodyBrush.Gradient;
                this.startEyeBallBrushColor = Color.fromArgb(147, 60, 53);
                this.endEyeBallBrushColor = Color.fromArgb(122, 106, 66);
                this.eyeBallBrushAngle = 3;
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Square;
                this.eyeFrameBrushType = StiBodyBrush.Gradient;
                this.startEyeFrameBrushColor = Color.fromArgb(147, 60, 53);
                this.endEyeFrameBrushColor = Color.fromArgb(122, 106, 66);
                this.eyeFrameBrushAngle = 3;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Square;
                break;
            case 17:
                this.backColor = Color.transparent();
                this.bodyBrushType = StiBodyBrush.Gradient;
                this.startBodyBrushColor = Color.fromArgb(203, 7, 203);
                this.endBodyBrushColor = Color.fromArgb(18, 158, 177);
                this.bodyBrushAngle = 5;
                this.bodyShapeType = StiQRCodeBodyShapeType.Square;
                this.eyeBallBrushType = StiBodyBrush.Gradient;
                this.startEyeBallBrushColor = Color.fromArgb(203, 7, 203);
                this.endEyeBallBrushColor = Color.fromArgb(18, 158, 177);
                this.eyeBallBrushAngle = 5;
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Square;
                this.eyeFrameBrushType = StiBodyBrush.Gradient;
                this.startEyeFrameBrushColor = Color.fromArgb(203, 7, 203);
                this.endEyeFrameBrushColor = Color.fromArgb(18, 158, 177);
                this.eyeFrameBrushAngle = 5;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Square;
                break;
            case 18:
                this.backColor = Color.transparent();
                this.bodyBrushType = StiBodyBrush.Gradient;
                this.startBodyBrushColor = Color.fromArgb(138, 57, 0);
                this.endBodyBrushColor = Color.fromArgb(137, 3, 15);
                this.bodyBrushAngle = 3;
                this.bodyShapeType = StiQRCodeBodyShapeType.Star;
                this.eyeBallBrushType = StiBodyBrush.Hatch;
                this.eyeBallBrushHatchStyle = HatchStyle.Plaid;
                this.eyeBallBrushForeColor = Color.fromArgb(81, 68, 115);
                this.eyeBallBrushBackColor = Color.fromArgb(125, 42, 35);
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Round3;
                this.eyeFrameBrushType = StiBodyBrush.Gradient;
                this.startEyeFrameBrushColor = Color.fromArgb(131, 50, 49);
                this.endEyeFrameBrushColor = Color.fromArgb(42, 82, 92);
                this.eyeFrameBrushAngle = 8;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Round3;
                break;
            case 19:
                this.backColor = Color.fromArgb(37, 86, 99);
                this.bodyBrushType = StiBodyBrush.Glare;
                this.startBodyBrushColor = Color.fromArgb(0, 226, 120);
                this.endBodyBrushColor = Color.yellow();
                this.bodyBrushAngle = 3;
                this.bodyBrushFocus = 0.5;
                this.bodyShapeType = StiQRCodeBodyShapeType.ZebraCross1;
                this.eyeBallBrushType = StiBodyBrush.Gradient;
                this.startEyeBallBrushColor = Color.fromArgb(178, 161, 199);
                this.endEyeBallBrushColor = Color.white();
                this.eyeBallBrushAngle = 4;
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.ZebraVertical;
                this.eyeFrameBrushType = StiBodyBrush.Hatch;
                this.eyeFrameBrushHatchStyle = HatchStyle.DarkVertical;
                this.eyeFrameBrushForeColor = Color.fromArgb(253, 234, 218);
                this.eyeFrameBrushBackColor = Color.fromArgb(198, 217, 240);
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Dots;
                break;
            case 20:
                this.backColor = Color.fromArgb(37, 86, 99);
                this.bodyBrushType = StiBodyBrush.Glare;
                this.startBodyBrushColor = Color.fromArgb(255, 147, 147);
                this.endBodyBrushColor = Color.fromArgb(219, 238, 243);
                this.bodyBrushAngle = 0;
                this.bodyBrushFocus = 0.5;
                this.bodyShapeType = StiQRCodeBodyShapeType.ZebraCross2;
                this.eyeBallBrushType = StiBodyBrush.Glass;
                this.eyeBallBrushColor = Color.fromArgb(147, 255, 255);
                this.eyeBallBrushDrawHatch = false;
                this.eyeBallBrushBlend = 0.2;
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Circle;
                this.eyeFrameBrushType = StiBodyBrush.Gradient;
                this.startEyeFrameBrushColor = Color.fromArgb(255, 147, 251);
                this.endEyeFrameBrushColor = Color.fromArgb(255, 147, 14);
                this.eyeFrameBrushAngle = 5;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Round1;
                break;
            case 21:
                this.backColor = Color.fromArgb(37, 86, 99);
                this.bodyBrushType = StiBodyBrush.Gradient;
                this.startBodyBrushColor = Color.white();
                this.endBodyBrushColor = Color.fromArgb(165, 165, 165);
                this.bodyBrushAngle = 3;
                this.bodyShapeType = StiQRCodeBodyShapeType.Circle;
                this.eyeBallBrushType = StiBodyBrush.Glare;
                this.startEyeBallBrushColor = Color.fromArgb(215, 227, 188);
                this.endEyeBallBrushColor = Color.fromArgb(255, 147, 251);
                this.eyeBallBrushAngle = 5;
                this.eyeBallBrushFocus = 0.5;
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Circle;
                this.eyeFrameBrushType = StiBodyBrush.Glass;
                this.eyeFrameBrushColor = Color.fromArgb(219, 229, 241);
                this.eyeFrameBrushDrawHatch = false;
                this.eyeFrameBrushBlend = 0.2;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Circle;
                break;
            case 22:
                this.backColor = Color.fromArgb(37, 86, 99);
                this.bodyBrushType = StiBodyBrush.Glare;
                this.startBodyBrushColor = Color.fromArgb(229, 182, 183);
                this.endBodyBrushColor = Color.fromArgb(141, 179, 226);
                this.bodyBrushAngle = 7;
                this.bodyBrushFocus = 0.9;
                this.bodyShapeType = StiQRCodeBodyShapeType.RoundedSquare;
                this.eyeBallBrushType = StiBodyBrush.Hatch;
                this.eyeBallBrushHatchStyle = HatchStyle.LargeCheckerBoard;
                this.eyeBallBrushForeColor = Color.fromArgb(204, 193, 217);
                this.eyeBallBrushBackColor = Color.fromArgb(242, 220, 219);
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Round;
                this.eyeFrameBrushType = StiBodyBrush.Glare;
                this.startEyeFrameBrushColor = Color.fromArgb(201, 147, 255);
                this.endEyeFrameBrushColor = Color.fromArgb(219, 229, 241);
                this.eyeFrameBrushAngle = 5;
                this.eyeFrameBrushFocus = 0.5;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Round;
                break;
            case 23:
                this.backColor = Color.fromArgb(37, 86, 99);
                this.bodyBrushType = StiBodyBrush.Gradient;
                this.startBodyBrushColor = Color.fromArgb(165, 165, 165);
                this.endBodyBrushColor = Color.white();
                this.bodyBrushAngle = 3;
                this.bodyShapeType = StiQRCodeBodyShapeType.Diamond;
                this.eyeBallBrushType = StiBodyBrush.Glare;
                this.startEyeBallBrushColor = Color.fromArgb(147, 255, 255);
                this.endEyeBallBrushColor = Color.fromArgb(112, 48, 160);
                this.eyeBallBrushAngle = 5;
                this.eyeBallBrushFocus = 0.5;
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Round1;
                this.eyeFrameBrushType = StiBodyBrush.Glass;
                this.eyeFrameBrushColor = Color.fromArgb(216, 238, 243);
                this.eyeFrameBrushDrawHatch = false;
                this.eyeFrameBrushBlend = 0.2;
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Round1;
                break;
            case 24:
                this.backColor = Color.fromArgb(37, 86, 99);
                this.bodyBrushType = StiBodyBrush.Glare;
                this.startBodyBrushColor = Color.fromArgb(255, 40, 100);
                this.endBodyBrushColor = Color.fromArgb(146, 215, 80);
                this.bodyBrushAngle = 3;
                this.bodyBrushFocus = 0.5;
                this.bodyShapeType = StiQRCodeBodyShapeType.ZebraHorizontal;
                this.eyeBallBrushType = StiBodyBrush.Gradient;
                this.startEyeBallBrushColor = Color.fromArgb(0, 176, 240);
                this.endEyeBallBrushColor = Color.fromArgb(229, 224, 236);
                this.eyeBallBrushAngle = 0;
                this.eyeBallShapeType = StiQRCodeEyeBallShapeType.Star;
                this.eyeFrameBrushType = StiBodyBrush.Hatch;
                this.eyeFrameBrushHatchStyle = HatchStyle.DashedUpwardDiagonal;
                this.eyeFrameBrushForeColor = Color.fromArgb(184, 204, 228);
                this.eyeFrameBrushBackColor = Color.fromArgb(178, 161, 199);
                this.eyeFrameShapeType = StiQRCodeEyeFrameShapeType.Circle;
                break;
        }
    }
    resetChanged() {
        super.resetChanged();
        if (this.label != null) {
            this.label.resetChanged();
        }
        if (this.description != null) {
            this.description.resetChanged();
        }
    }
    get description() {
        return this._description;
    }
    set description(value) {
        let oldValue = this._description;
        if (oldValue != value) {
            this._description = value;
            this._isChanged = true;
        }
    }
    get barcodeType() {
        return this._barcodeType;
    }
    set barcodeType(value) {
        let oldValue = this._barcodeType;
        if (oldValue != value) {
            this._barcodeType = value;
            this._isChanged = true;
        }
    }
    get matrixSize() {
        return this._matrixSize;
    }
    set matrixSize(value) {
        let oldValue = this._matrixSize;
        if (oldValue != value) {
            this._matrixSize = value;
            this._isChanged = true;
        }
    }
    get errorCorrectionLevel() {
        return this._errorCorrectionLevel;
    }
    set errorCorrectionLevel(value) {
        let oldValue = this._errorCorrectionLevel;
        if (oldValue != value) {
            this._errorCorrectionLevel = value;
            this._isChanged = true;
        }
    }
    get codeString() {
        return this._codeString;
    }
    set codeString(value) {
        let oldValue = this._codeString;
        if (oldValue != value) {
            this._codeString = value;
            this._isChanged = true;
        }
    }
    get eyeBallBrushType() {
        return this._eyeBallBrushType;
    }
    set eyeBallBrushType(value) {
        let oldValue = this._eyeBallBrushType;
        if (oldValue != value) {
            this._eyeBallBrushType = value;
            this._isChanged = true;
        }
    }
    get eyeBallBrushColor() {
        return this._eyeBallBrushColor;
    }
    set eyeBallBrushColor(value) {
        let oldValue = this._eyeBallBrushColor;
        if (oldValue != value) {
            this._eyeBallBrushColor = value;
            this._eyeBallBrushColor.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get startEyeBallBrushColor() {
        return this._startEyeBallBrushColor;
    }
    set startEyeBallBrushColor(value) {
        let oldValue = this._startEyeBallBrushColor;
        if (oldValue != value) {
            this._startEyeBallBrushColor = value;
            this._startEyeBallBrushColor.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get endEyeBallBrushColor() {
        return this._endEyeBallBrushColor;
    }
    set endEyeBallBrushColor(value) {
        let oldValue = this._endEyeBallBrushColor;
        if (oldValue != value) {
            this._endEyeBallBrushColor = value;
            this._endEyeBallBrushColor.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get eyeBallBrushBackColor() {
        return this._eyeBallBrushBackColor;
    }
    set eyeBallBrushBackColor(value) {
        let oldValue = this._eyeBallBrushBackColor;
        if (oldValue != value) {
            this._eyeBallBrushBackColor = value;
            this._eyeBallBrushBackColor.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get eyeBallBrushForeColor() {
        return this._eyeBallBrushForeColor;
    }
    set eyeBallBrushForeColor(value) {
        let oldValue = this._eyeBallBrushForeColor;
        if (oldValue != value) {
            this._eyeBallBrushForeColor = value;
            this._eyeBallBrushForeColor.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get eyeBallShapeType() {
        return this._eyeBallShapeType;
    }
    set eyeBallShapeType(value) {
        let oldValue = this._eyeBallShapeType;
        if (oldValue != value) {
            this._eyeBallShapeType = value;
            this._isChanged = true;
        }
    }
    get eyeBallBrushAngle() {
        return this._eyeBallBrushAngle;
    }
    set eyeBallBrushAngle(value) {
        let oldValue = this._eyeBallBrushAngle;
        if (oldValue != value) {
            if (value <= 0) {
                this._eyeBallBrushAngle = 0;
            }
            else {
                this._eyeBallBrushAngle = value;
            }
            this._isChanged = true;
        }
    }
    get eyeBallBrushHatchStyle() {
        return this._eyeBallBrushHatchStyle;
    }
    set eyeBallBrushHatchStyle(value) {
        let oldValue = this._eyeBallBrushHatchStyle;
        if (oldValue != value) {
            this._eyeBallBrushHatchStyle = value;
            this._isChanged = true;
        }
    }
    get eyeBallBrushFocus() {
        return this._eyeBallBrushFocus;
    }
    set eyeBallBrushFocus(value) {
        let oldValue = this._eyeBallBrushFocus;
        if (oldValue != value) {
            if (value <= 0) {
                this._eyeBallBrushFocus = 0;
            }
            else {
                this._eyeBallBrushFocus = value;
            }
            this._isChanged = true;
        }
    }
    get eyeBallBrushBlend() {
        return this._eyeBallBrushBlend;
    }
    set eyeBallBrushBlend(value) {
        let oldValue = this._eyeBallBrushBlend;
        if (oldValue != value) {
            if (value <= 0) {
                this._eyeBallBrushBlend = 0;
            }
            else {
                this._eyeBallBrushBlend = value;
            }
            this._isChanged = true;
        }
    }
    get eyeBallBrushDrawHatch() {
        return this._eyeBallBrushDrawHatch;
    }
    set eyeBallBrushDrawHatch(value) {
        let oldValue = this._eyeBallBrushDrawHatch;
        if (oldValue != value) {
            this._eyeBallBrushDrawHatch = value;
            this._isChanged = true;
        }
    }
    get bodyBrushType() {
        return this._bodyBrushType;
    }
    set bodyBrushType(value) {
        let oldValue = this._bodyBrushType;
        if (oldValue != value) {
            this._bodyBrushType = value;
            this._isChanged = true;
        }
    }
    get bodyBrushColor() {
        return this._bodyBrushColor;
    }
    set bodyBrushColor(value) {
        let oldValue = this._bodyBrushColor;
        if (oldValue != value) {
            this._bodyBrushColor = value;
            this._bodyBrushColor.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get startBodyBrushColor() {
        return this._startBodyBrushColor;
    }
    set startBodyBrushColor(value) {
        let oldValue = this._startBodyBrushColor;
        if (oldValue != value) {
            this._startBodyBrushColor = value;
            this._startBodyBrushColor.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get endBodyBrushColor() {
        return this._endBodyBrushColor;
    }
    set endBodyBrushColor(value) {
        let oldValue = this._endBodyBrushColor;
        if (oldValue != value) {
            this._endBodyBrushColor = value;
            this._endBodyBrushColor.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get bodyBrushBackColor() {
        return this._bodyBrushBackColor;
    }
    set bodyBrushBackColor(value) {
        let oldValue = this._bodyBrushBackColor;
        if (oldValue != value) {
            this._bodyBrushBackColor = value;
            this._bodyBrushBackColor.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get bodyBrushForeColor() {
        return this._bodyBrushForeColor;
    }
    set bodyBrushForeColor(value) {
        let oldValue = this._bodyBrushForeColor;
        if (oldValue != value) {
            this._bodyBrushForeColor = value;
            this._bodyBrushForeColor.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get bodyShapeType() {
        return this._bodyShapeType;
    }
    set bodyShapeType(value) {
        let oldValue = this._bodyShapeType;
        if (oldValue != value) {
            this._bodyShapeType = value;
            this._isChanged = true;
        }
    }
    get bodyBrushAngle() {
        return this._bodyBrushAngle;
    }
    set bodyBrushAngle(value) {
        let oldValue = this._bodyBrushAngle;
        if (oldValue != value) {
            if (value <= 0) {
                this._bodyBrushAngle = 0;
            }
            else {
                this._bodyBrushAngle = value;
            }
            this._isChanged = true;
        }
    }
    get bodyBrushHatchStyle() {
        return this._bodyBrushHatchStyle;
    }
    set bodyBrushHatchStyle(value) {
        let oldValue = this._bodyBrushHatchStyle;
        if (oldValue != value) {
            this._bodyBrushHatchStyle = value;
            this._isChanged = true;
        }
    }
    get bodyBrushFocus() {
        return this._bodyBrushFocus;
    }
    set bodyBrushFocus(value) {
        let oldValue = this._bodyBrushFocus;
        if (oldValue != value) {
            if (value <= 0) {
                this._bodyBrushFocus = 0;
            }
            else {
                this._bodyBrushFocus = value;
            }
            this._isChanged = true;
        }
    }
    get bodyBrushBlend() {
        return this._bodyBrushBlend;
    }
    set bodyBrushBlend(value) {
        let oldValue = this._bodyBrushBlend;
        if (oldValue != value) {
            if (value <= 0) {
                this._bodyBrushBlend = 0;
            }
            else {
                this._bodyBrushBlend = value;
            }
            this._isChanged = true;
        }
    }
    get bodyBrushDrawHatch() {
        return this._bodyBrushDrawHatch;
    }
    set bodyBrushDrawHatch(value) {
        let oldValue = this._bodyBrushDrawHatch;
        if (oldValue != value) {
            this._bodyBrushDrawHatch = value;
            this._isChanged = true;
        }
    }
    get eyeFrameBrushType() {
        return this._eyeFrameBrushType;
    }
    set eyeFrameBrushType(value) {
        let oldValue = this._eyeFrameBrushType;
        if (oldValue != value) {
            this._eyeFrameBrushType = value;
            this._isChanged = true;
        }
    }
    get eyeFrameBrushColor() {
        return this._eyeFrameBrushColor;
    }
    set eyeFrameBrushColor(value) {
        let oldValue = this._eyeFrameBrushColor;
        if (oldValue != value) {
            this._eyeFrameBrushColor = value;
            this._eyeFrameBrushColor.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get startEyeFrameBrushColor() {
        return this._startEyeFrameBrushColor;
    }
    set startEyeFrameBrushColor(value) {
        let oldValue = this._startEyeFrameBrushColor;
        if (oldValue != value) {
            this._startEyeFrameBrushColor = value;
            this._startEyeFrameBrushColor.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get endEyeFrameBrushColor() {
        return this._endEyeFrameBrushColor;
    }
    set endEyeFrameBrushColor(value) {
        let oldValue = this._endEyeFrameBrushColor;
        if (oldValue != value) {
            this._endEyeFrameBrushColor = value;
            this._endEyeFrameBrushColor.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get eyeFrameBrushBackColor() {
        return this._eyeFrameBrushBackColor;
    }
    set eyeFrameBrushBackColor(value) {
        let oldValue = this._eyeFrameBrushBackColor;
        if (oldValue != value) {
            this._eyeFrameBrushBackColor = value;
            this._eyeFrameBrushBackColor.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get eyeFrameBrushForeColor() {
        return this._eyeFrameBrushForeColor;
    }
    set eyeFrameBrushForeColor(value) {
        let oldValue = this._eyeFrameBrushForeColor;
        if (oldValue != value) {
            this._eyeFrameBrushForeColor = value;
            this._eyeFrameBrushForeColor.changesInterceptor = this;
            this._isChanged = true;
        }
    }
    get eyeFrameShapeType() {
        return this._eyeFrameShapeType;
    }
    set eyeFrameShapeType(value) {
        let oldValue = this._eyeFrameShapeType;
        if (oldValue != value) {
            this._eyeFrameShapeType = value;
            this._isChanged = true;
        }
    }
    get eyeFrameBrushAngle() {
        return this._eyeFrameBrushAngle;
    }
    set eyeFrameBrushAngle(value) {
        let oldValue = this._eyeFrameBrushAngle;
        if (oldValue != value) {
            if (value <= 0) {
                this._eyeFrameBrushAngle = 0;
            }
            else {
                this._eyeFrameBrushAngle = value;
            }
            this._isChanged = true;
        }
    }
    get eyeFrameBrushHatchStyle() {
        return this._eyeFrameBrushHatchStyle;
    }
    set eyeFrameBrushHatchStyle(value) {
        let oldValue = this._eyeFrameBrushHatchStyle;
        if (oldValue != value) {
            this._eyeFrameBrushHatchStyle = value;
            this._isChanged = true;
        }
    }
    get eyeFrameBrushFocus() {
        return this._eyeFrameBrushFocus;
    }
    set eyeFrameBrushFocus(value) {
        let oldValue = this._eyeFrameBrushFocus;
        if (oldValue != value) {
            if (value <= 0) {
                this._eyeFrameBrushFocus = 0;
            }
            else {
                this._eyeFrameBrushFocus = value;
            }
            this._isChanged = true;
        }
    }
    get eyeFrameBrushBlend() {
        return this._eyeFrameBrushBlend;
    }
    set eyeFrameBrushBlend(value) {
        let oldValue = this._eyeFrameBrushBlend;
        if (oldValue != value) {
            if (value <= 0) {
                this._eyeFrameBrushBlend = 0;
            }
            else {
                this._eyeFrameBrushBlend = value;
            }
            this._isChanged = true;
        }
    }
    get eyeFrameBrushDrawHatch() {
        return this._eyeFrameBrushDrawHatch;
    }
    set eyeFrameBrushDrawHatch(value) {
        let oldValue = this._eyeFrameBrushDrawHatch;
        if (oldValue != value) {
            this._eyeFrameBrushDrawHatch = value;
            this._isChanged = true;
        }
    }
    saveToJsonObject(options) {
        if (this.element && this.element.nativeElement) {
            if (this.element.nativeElement?.offsetWidth > 0 &&
                this.element.nativeElement?.offsetHeight > 0 &&
                (this.barcodeType == StiBarcodeType.Aztec ||
                    this.barcodeType == StiBarcodeType.QRCode ||
                    this.barcodeType == StiBarcodeType.DataMatrix ||
                    this.barcodeType == StiBarcodeType.Maxicode)) {
                if (this.element.nativeElement?.offsetWidth < this.element.nativeElement?.offsetHeight) {
                    this.Width = this.element.nativeElement?.offsetWidth;
                    this.Height = this.element.nativeElement?.offsetWidth;
                }
                else {
                    this.Width = this.element.nativeElement?.offsetHeight;
                    this.Height = this.element.nativeElement?.offsetHeight;
                }
            }
            else {
                this.Width = this.element.nativeElement?.offsetWidth;
                this.Height = this.element.nativeElement?.offsetHeight;
            }
        }
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Label", this.label.saveToJsonObject(options));
        jObject.addPropertyJObject("Description", this.description.saveToJsonObject(options));
        jObject.addPropertyEnum("BarcodeType", StiBarcodeType, this.barcodeType);
        jObject.addPropertyString("CodeString", this.codeString);
        // jObject.addPropertyString("Tooltip", this.tooltip);
        jObject.addPropertyNumber("Width", this.Width);
        jObject.addPropertyNumber("Height", this.Height);
        jObject.addPropertyNumber("Style", this.style);
        jObject.addPropertyColor("BackColor", this.backColor);
        jObject.addPropertyColor("ForeColor", this.foreColor);
        jObject.addPropertyEnum("MatrixSize", StiQRCodeSize, this.matrixSize);
        jObject.addPropertyEnum("ErrorCorrectionLevel", StiQRCodeErrorCorrectionLevel, this.errorCorrectionLevel);
        jObject.addPropertyEnum("BodyBrushType", StiBodyBrush, this.bodyBrushType);
        jObject.addPropertyEnum("EyeBallBrushType", StiBodyBrush, this.eyeBallBrushType);
        jObject.addPropertyEnum("EyeFrameBrushType", StiBodyBrush, this.eyeFrameBrushType);
        jObject.addPropertyEnum("BodyShapeType", StiQRCodeBodyShapeType, this.bodyShapeType);
        jObject.addPropertyColor("BodyBrushColor", this.bodyBrushColor);
        jObject.addPropertyColor("StartBodyBrushColor", this.startBodyBrushColor);
        jObject.addPropertyColor("EndBodyBrushColor", this.endBodyBrushColor);
        jObject.addPropertyColor("BodyBrushForeColor", this.bodyBrushForeColor);
        jObject.addPropertyColor("BodyBrushBackColor", this.bodyBrushBackColor);
        jObject.addPropertyNumber("BodyBrushAngle", this.bodyBrushAngle);
        jObject.addPropertyEnum("BodyBrushHatchStyle", HatchStyle, this.bodyBrushHatchStyle);
        jObject.addPropertyNumber("BodyBrushFocus", this.bodyBrushFocus);
        jObject.addPropertyNumber("BodyBrushBlend", this.bodyBrushBlend);
        jObject.addPropertyBool("BodyBrushDrawHatch", this.bodyBrushDrawHatch);
        jObject.addPropertyColor("EyeBallBrushColor", this.eyeBallBrushColor);
        jObject.addPropertyColor("StartEyeBallBrushColor", this.startEyeBallBrushColor);
        jObject.addPropertyColor("EndEyeBallBrushColor", this.endEyeBallBrushColor);
        jObject.addPropertyEnum("EyeBallShapeType", StiQRCodeEyeBallShapeType, this.eyeBallShapeType);
        jObject.addPropertyColor("EyeBallBrushForeColor", this.eyeBallBrushForeColor);
        jObject.addPropertyColor("EyeBallBrushBackColor", this.eyeBallBrushBackColor);
        jObject.addPropertyNumber("EyeBallBrushAngle", this.eyeBallBrushAngle);
        jObject.addPropertyNumber("EyeBallBrushBlend", this.eyeBallBrushBlend);
        jObject.addPropertyEnum("EyeBallBrushHatchStyle", HatchStyle, this.eyeBallBrushHatchStyle);
        jObject.addPropertyNumber("EyeBallBrushFocus", this.eyeBallBrushFocus);
        jObject.addPropertyBool("EyeBallBrushDrawHatch", this.eyeBallBrushDrawHatch);
        jObject.addPropertyColor("EyeFrameBrushColor", this.eyeFrameBrushColor);
        jObject.addPropertyColor("StartEyeFrameBrushColor", this.startEyeFrameBrushColor);
        jObject.addPropertyColor("EndEyeFrameBrushColor", this.endEyeFrameBrushColor);
        jObject.addPropertyEnum("EyeFrameShapeType", StiQRCodeEyeFrameShapeType, this.eyeFrameShapeType);
        jObject.addPropertyColor("EyeFrameBrushForeColor", this.eyeFrameBrushForeColor);
        jObject.addPropertyColor("EyeFrameBrushBackColor", this.eyeFrameBrushBackColor);
        jObject.addPropertyNumber("EyeFrameBrushAngle", this.eyeFrameBrushAngle);
        jObject.addPropertyNumber("EyeFrameBrushBlend", this.eyeFrameBrushBlend);
        jObject.addPropertyEnum("EyeFrameBrushHatchStyle", HatchStyle, this.eyeFrameBrushHatchStyle);
        jObject.addPropertyNumber("EyeFrameBrushFocus", this.eyeFrameBrushFocus);
        jObject.addPropertyBool("EyeFrameBrushDrawHatch", this.eyeFrameBrushDrawHatch);
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Label":
                    this.label = new StiLabelItem(this);
                    this.label.loadFromJsonObject(property.value);
                    break;
                case "Description":
                    this.description = new StiTextItem();
                    this.description.loadFromJsonObject(property.value);
                    break;
                case "BarcodeType":
                    this.barcodeType = Enum.parse(StiBarcodeType, property.value);
                    break;
                case "CodeString":
                    this.codeString = property.value;
                    break;
                /*  case "Tooltip":
                  this.tooltip = property.value;
                  break; */
                case "Width":
                    this.Width = property.value;
                    break;
                case "Height":
                    this.Height = property.value;
                    break;
                case "Style":
                    this.style = property.value;
                    break;
                case "BackColor":
                    this.backColor = new Color();
                    this.backColor.deserializeFromString(property.value);
                    break;
                case "ForeColor":
                    this.foreColor = new Color();
                    this.foreColor.deserializeFromString(property.value);
                    break;
                case "MatrixSize":
                    this.matrixSize = Enum.parse(StiQRCodeSize, property.value, false);
                    break;
                case "ErrorCorrectionLevel":
                    this.errorCorrectionLevel = Enum.parse(StiQRCodeErrorCorrectionLevel, property.value);
                    break;
                case "BodyBrushType":
                    this.bodyBrushType = Enum.parse(StiBodyBrush, property.value);
                    break;
                case "EyeBallBrushType":
                    this.eyeBallBrushType = Enum.parse(StiBodyBrush, property.value);
                    break;
                case "EyeFrameBrushType":
                    this.eyeFrameBrushType = Enum.parse(StiBodyBrush, property.value);
                    break;
                case "BodyShapeType":
                    this.bodyShapeType = Enum.parse(StiQRCodeBodyShapeType, property.value);
                    break;
                case "BodyBrushColor":
                    this.bodyBrushColor = new Color();
                    this.bodyBrushColor.deserializeFromString(property.value);
                    break;
                case "StartBodyBrushColor":
                    this.startBodyBrushColor = new Color();
                    this.startBodyBrushColor.deserializeFromString(property.value);
                    break;
                case "EndBodyBrushColor":
                    this.endBodyBrushColor = new Color();
                    this.endBodyBrushColor.deserializeFromString(property.value);
                    break;
                case "BodyBrushForeColor":
                    this.bodyBrushForeColor = new Color();
                    this.bodyBrushForeColor.deserializeFromString(property.value);
                    break;
                case "BodyBrushBackColor":
                    this.bodyBrushBackColor = new Color();
                    this.bodyBrushBackColor.deserializeFromString(property.value);
                    break;
                case "BodyBrushAngle":
                    this.bodyBrushAngle = property.value;
                    break;
                case "BodyBrushBlend":
                    this.bodyBrushBlend = property.value;
                    break;
                case "EyeBallBrushBlend":
                    this.eyeBallBrushBlend = property.value;
                    break;
                case "EyeFrameBrushBlend":
                    this.eyeFrameBrushBlend = property.value;
                    break;
                case "BodyBrushHatchStyle":
                    this.bodyBrushHatchStyle = Enum.parse(HatchStyle, property.value);
                    break;
                case "BodyBrushFocus":
                    this.bodyBrushFocus = property.value;
                    break;
                case "BodyBrushDrawHatch":
                    this.bodyBrushDrawHatch = property.value;
                    break;
                case "EyeBallBrushColor":
                    this.eyeBallBrushColor = new Color();
                    this.eyeBallBrushColor.deserializeFromString(property.value);
                    break;
                case "StartEyeBallBrushColor":
                    this.startEyeBallBrushColor = new Color();
                    this.startEyeBallBrushColor.deserializeFromString(property.value);
                    break;
                case "EndEyeBallBrushColor":
                    this.endEyeBallBrushColor = new Color();
                    this.endEyeBallBrushColor.deserializeFromString(property.value);
                    break;
                case "EyeBallShapeType":
                    this.eyeBallShapeType = Enum.parse(StiQRCodeEyeBallShapeType, property.value);
                    break;
                case "EyeBallBrushForeColor":
                    this.eyeBallBrushForeColor = new Color();
                    this.eyeBallBrushForeColor.deserializeFromString(property.value);
                    break;
                case "EyeBallBrushBackColor":
                    this.eyeBallBrushBackColor = new Color();
                    this.eyeBallBrushBackColor.deserializeFromString(property.value);
                    break;
                case "EyeBallBrushAngle":
                    this.eyeBallBrushAngle = property.value;
                    break;
                case "EyeBallBrushHatchStyle":
                    this.eyeBallBrushHatchStyle = Enum.parse(HatchStyle, property.value);
                    break;
                case "EyeBallBrushFocus":
                    this.eyeBallBrushFocus = property.value;
                    break;
                case "EyeBallBrushDrawHatch":
                    this.eyeBallBrushDrawHatch = property.value;
                    break;
                case "EyeFrameBrushColor":
                    this.eyeFrameBrushColor = new Color();
                    this.eyeFrameBrushColor.deserializeFromString(property.value);
                    break;
                case "StartEyeFrameBrushColor":
                    this.startEyeFrameBrushColor = new Color();
                    this.startEyeFrameBrushColor.deserializeFromString(property.value);
                    break;
                case "EndEyeFrameBrushColor":
                    this.endEyeFrameBrushColor = new Color();
                    this.endEyeFrameBrushColor.deserializeFromString(property.value);
                    break;
                case "EyeFrameShapeType":
                    this.eyeFrameShapeType = Enum.parse(StiQRCodeEyeFrameShapeType, property.value);
                    break;
                case "EyeFrameBrushForeColor":
                    this.eyeFrameBrushForeColor = new Color();
                    this.eyeFrameBrushForeColor.deserializeFromString(property.value);
                    break;
                case "EyeFrameBrushBackColor":
                    this.eyeFrameBrushBackColor = new Color();
                    this.eyeFrameBrushBackColor.deserializeFromString(property.value);
                    break;
                case "EyeFrameBrushAngle":
                    this.eyeFrameBrushAngle = property.value;
                    break;
                case "EyeFrameBrushHatchStyle":
                    this.eyeFrameBrushHatchStyle = Enum.parse(HatchStyle, property.value);
                    break;
                case "EyeFrameBrushFocus":
                    this.eyeFrameBrushFocus = property.value;
                    break;
                case "EyeFrameBrushDrawHatch":
                    this.eyeFrameBrushDrawHatch = property.value;
                    break;
            }
        }
    }
}

class StiBackgroundedTextItem extends StiTextItem {
    constructor(value = "", font = new Font("Segoe UI", 9), color = Color.black(), backgroundColor = Color.white()) {
        super(value, font, color, backgroundColor);
        this.font = font;
        this.color = color;
        this.backgroundColor = backgroundColor;
    }
    saveToJsonObject(options) {
        let json = super.saveToJsonObject(options);
        json.addPropertyColor("BackgroundColor", this.backgroundColor);
        return json;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "BackgroundColor":
                    this.backgroundColor = new Color();
                    this.backgroundColor.deserializeFromString(property.value);
                    break;
            }
        }
    }
    getBackgroundColor() {
        return this.backgroundColor;
    }
    haveContentAlignment() {
        return false;
    }
    haveBackgoundColor() {
        return true;
    }
}

class StiButtonElement extends StiFormElement {
    constructor() {
        super();
        this.type = "ButtonElement";
        this.tooltip = "";
        this.submissionMessage = "Thank you! Your submission has been sent.";
        this.text = new StiBackgroundedTextItem(StiLocalizationService.get("Buttons", "Submit"), new Font("Segoe UI", 14), Color.black(), Color.lightGray());
        this.buttonType = StiButtonType.SendForm;
        this.formSendURL = "";
        this.buttonSendType = StiButtonSendType.XFDF;
        this.geometry = new StiRectangleGeometry(100, 40);
        this.padding = new StiPadding(4, 0, 4, 0, this);
    }
    canUpdateProperty(propName) {
        return !(propName.indexOf("padding") >= 0);
    }
    getUsedFonts(usedFonts) {
        super.getUsedFonts(usedFonts);
        usedFonts.add(this.text.font.family, this.arrayOfStylesToString(this.text.font.style), this.text.font.size);
    }
    getDefaultEditableContent() {
        return this.text;
    }
    setProperty(propName, value, oldObject) {
        super.setProperty(propName, value, oldObject);
        if (propName.startsWith("label.font") || propName == "label.color") {
            this.text.setProperty(propName.replace("label.", ""), value.clone ? value.clone() : value, oldObject);
        }
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyString("Tooltip", this.tooltip);
        jObject.addPropertyJObject("Text", this.text.saveToJsonObject(options));
        jObject.addPropertyEnum("ButtonType", StiButtonType, this.buttonType);
        jObject.addPropertyString("FormSendURL", this.formSendURL);
        jObject.addPropertyEnum("ButtonSendType", StiButtonSendType, this.buttonSendType);
        jObject.addPropertyString("SubmissionMessage", this.submissionMessage);
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Text":
                    this.text = new StiBackgroundedTextItem();
                    this.text.loadFromJsonObject(property.value);
                    break;
                case "Tooltip":
                    this.tooltip = property.value;
                    break;
                case "ButtonType":
                    this.buttonType = Enum.parse(StiButtonType, property.value);
                    break;
                case "FormSendURL":
                    this.formSendURL = property.value;
                    break;
                case "ButtonSendType":
                    this.buttonSendType = Enum.parse(StiButtonSendType, property.value);
                    break;
                case "SubmissionMessage":
                    this.submissionMessage = property.value;
                    break;
            }
        }
    }
    htmlStyle() {
        return `${this.text.htmlStyle()};
    )}`;
    }
}

class StiCheckBoxElement extends StiFormElement {
    constructor() {
        super();
        this.type = "Check_BoxElement";
        this.tooltip = "";
        this.required = false;
        this.description = new StiTextItem();
        this.text = new StiTextItem(StiLocalizationService.get("Components", "StiCheckBox"), new Font("Segoe UI", 9));
        this.isChecked = false;
        this.backgroundColor = Color.white();
        this.checkColor = Color.black();
        this.borderColor = Color.lightGray();
        this.initialState = false;
        this.geometry = new StiRectangleGeometry(100, 40);
        this.label = new StiLabelItem(this, StiLocalizationService.get("Components", "StiCheckBox"));
    }
    setDefaultValues() {
        this.isChecked = false;
    }
    setTabIndex(value) {
        this.tabIndex = value++;
        return value;
    }
    getUsedFonts(usedFonts) {
        super.getUsedFonts(usedFonts);
        usedFonts.add(this.text.font.family, this.arrayOfStylesToString(this.text.font.style), this.text.font.size);
        usedFonts.add(this.description.font.family, this.arrayOfStylesToString(this.description.font.style), this.description.font.size);
    }
    get value() {
        return this.isChecked;
    }
    getDefaultEditableContent() {
        let textItem = new StiInputTextItem("", this.text.font, this.text.color);
        textItem.element = this;
        return textItem;
    }
    setProperty(propName, value, oldObject) {
        super.setProperty(propName, value, oldObject);
        if (propName == "innerText.backgroundColor" &&
            (oldObject === null || this.text.backgroundColor.equals(oldObject))) {
            this.text.backgroundColor = value.clone();
        }
        else if (propName == "innerText.borderColor" && (oldObject === null || this.borderColor.equals(oldObject))) {
            this.borderColor = value.clone();
        }
        else if (propName.startsWith("innerText.font") || propName == "innerText.color") {
            this.text.setProperty(propName.replace("innerText.", ""), value.clone ? value.clone() : value, oldObject);
        }
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Label", this.label.saveToJsonObject(options));
        jObject.addPropertyJObject("Description", this.description.saveToJsonObject(options));
        jObject.addPropertyString("Tooltip", this.tooltip);
        jObject.addPropertyBool("Required", this.required);
        jObject.addPropertyJObject("Text", this.text.saveToJsonObject(options));
        jObject.addPropertyBool("IsChecked", this.isChecked);
        jObject.addPropertyColor("BackgroundColor", this.backgroundColor);
        jObject.addPropertyColor("CheckColor", this.checkColor);
        jObject.addPropertyColor("BorderColor", this.borderColor);
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "BackgroundColor":
                    this.backgroundColor = new Color();
                    this.backgroundColor.deserializeFromString(property.value);
                    break;
                case "Label":
                    this.label = new StiLabelItem(this);
                    this.label.loadFromJsonObject(property.value);
                    break;
                case "Text":
                    this.text = new StiTextItem();
                    this.text.loadFromJsonObject(property.value);
                    break;
                case "Description":
                    this.description = new StiTextItem();
                    this.description.loadFromJsonObject(property.value);
                    break;
                case "Tooltip":
                    this.tooltip = property.value;
                    break;
                case "Required":
                    this.required = property.value;
                    break;
                case "IsChecked":
                    this.isChecked = property.value;
                    break;
                case "BorderColor":
                    this.borderColor = new Color();
                    this.borderColor.deserializeFromString(property.value);
                    break;
                case "CheckColor":
                    this.checkColor = new Color();
                    this.checkColor.deserializeFromString(property.value);
                    break;
            }
        }
    }
    htmlStyle() {
        return `${this.text.htmlStyle()};
    )}`;
    }
}

class StiStaticHelperService {
    static { this.browserLanguage = navigator["defaultLocalization"] || navigator.language || navigator["browserLanguage"]; }
    static dateToJsonDate(date) {
        let offset = date.getTimezoneOffset() * -1;
        let hoursOffset = Math.abs(Math.floor(offset / 60)).toString();
        let minutesOffset = Math.abs(offset % 60).toString();
        if (hoursOffset.length == 1)
            hoursOffset = "0" + hoursOffset;
        if (minutesOffset.length == 1)
            minutesOffset = "0" + minutesOffset;
        return ("/Date(" + Date.parse(date.toString()).toString() + (offset >= 0 ? "+" : "-") + hoursOffset + minutesOffset + ")/");
    }
    static jsonDateFormatToDate(dateJSONFormat, format) {
        if (dateJSONFormat.substring(0, 6) == "/Date(") {
            var dateStr = dateJSONFormat.replace("/Date(", "").replace(")/", "");
            return typeof format == "boolean"
                ? this.formatDate2(new Date(parseInt(dateStr)), "m/d/yy h:MM tt")
                : format
                    ? this.formatDate2(new Date(parseInt(dateStr)), format)
                    : new Date(parseInt(dateStr));
        }
        else {
            return dateJSONFormat;
        }
    }
    static formatDate2(formatDate, formatString) {
        let yyyy = formatDate.getFullYear();
        let yy = yyyy.toString().substring(2);
        let m = formatDate.getMonth() + 1;
        let mm = m < 10 ? "0" + m : m;
        let d = formatDate.getDate();
        let dd = d < 10 ? "0" + d : d;
        let h = formatDate.getHours();
        let hh = h < 10 ? "0" + h : h;
        let n = formatDate.getMinutes();
        let nn = n < 10 ? "0" + n : n;
        let s = formatDate.getSeconds();
        let ss = s < 10 ? "0" + s : s;
        formatString = formatString.replace(/yyyy/i, yyyy);
        formatString = formatString.replace(/yy/i, yy);
        formatString = formatString.replace(/mm/i, mm);
        formatString = formatString.replace(/m/i, m);
        formatString = formatString.replace(/dd/i, dd);
        formatString = formatString.replace(/d/i, d);
        formatString = formatString.replace(/hh/i, hh);
        formatString = formatString.replace(/h/i, h);
        formatString = formatString.replace(/nn/i, nn);
        formatString = formatString.replace(/n/i, n);
        formatString = formatString.replace(/ss/i, ss);
        formatString = formatString.replace(/s/i, s);
        return formatString;
    }
    static { this.formats = [
        { format: "mmmm", option: "month", options: { month: "long" } },
        { format: "mmm", option: "month", options: { month: "short" } },
        { format: "mm", option: "month", options: { month: "2-digit" }, digits: 2 },
        { format: "m", option: "month", options: { month: "numeric" } },
        { format: "dd", option: "day", options: { day: "2-digit" }, digits: 2 },
        { format: "d", option: "day", options: { day: "numeric" } },
        { format: "yyyy", option: "year", options: { year: "numeric" } },
        { format: "yy", option: "year", options: { year: "2-digit" }, digits: 2 },
        { format: "HH", option: "hour", options: { hour: "2-digit", hour12: false }, digits: 2 },
        { format: "h", option: "hour", options: { hour: "numeric", hour12: true } },
        { format: "MM", option: "minute", options: { minute: "2-digit", hourCycle: "h24" }, digits: 2 },
        { format: "ss", option: "second", options: { second: "2-digit", hour12: false }, digits: 2 },
        { format: "tt", option: "dayPeriod", options: { dayPeriod: "narrow", hourCycle: "h12", hour12: true } }
    ]; }
    static formatDate(date, format, locale) {
        var result = [];
        locale = locale?.length > 0 ? locale : (this.browserLanguage ?? "en-us");
        var parseFormat = format;
        try {
            this.formats.forEach((dtFormat) => {
                if (parseFormat.indexOf(dtFormat.format) >= 0) {
                    var formatResult = dtFormat.format == "tt" ? (date.getHours() < 12 ? [{ value: "am" }] : [{ value: "pm" }]) :
                        new Intl.DateTimeFormat(locale, dtFormat.options).formatToParts(date);
                    result.push({ format: dtFormat.format, result: this.fixParsedValue(formatResult[0].value, dtFormat) });
                    parseFormat = parseFormat.replace(new RegExp(dtFormat.format, "g"), "");
                }
            });
        }
        catch (e) {
            console.error(e);
        }
        result.forEach((option) => {
            format = format.replace(new RegExp(option.format, "g"), option.result);
        });
        return format;
    }
    static fixParsedValue(value, format) {
        if (format.digits)
            value = _.padStart(value, format.digits, "0");
        return value;
    }
    constructor() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiStaticHelperService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiStaticHelperService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiStaticHelperService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [] });

class StiDateTimeBoxElement extends StiFormElement {
    constructor(form) {
        super();
        this.type = "DateTime_BoxElement";
        this.tooltip = "";
        this.required = false;
        this.description = new StiTextItem();
        this.font = new Font("Segoe UI", 10);
        this.contentAlignment = StiHorizontalAlignment.Left;
        this.backgroundColor = Color.white();
        this.textColor = Color.black();
        this.borderColor = Color.lightGray();
        this.borderWeight = StiLineWeight.Thin;
        this.allowNull = false;
        this._dateTimeValueIsNotNull = true;
        this._dateTimeFormat = "m/d/yy h:MM tt";
        this._dateFomat = "dd.mm.yyyy";
        this._timeFormat = "HH:MM:ss";
        this._initialState = StiDateTimeBoxValueChoise.Custom;
        this._dateValue = new Date();
        this._valueType = StiDateTimeBoxType.Date;
        this._dateValueString = "";
        this.form = form;
        this.geometry = new StiRectangleGeometry(150, 40);
        this.label = new StiLabelItem(this, StiLocalizationService.get("Dialogs", "StiDateTimePickerControl"));
        this.updateDateValueString();
    }
    updateToViewerMode() {
        this.initialState = StiDateTimeBoxValueChoise.Custom;
    }
    get dateValueString() {
        return this._dateValueString;
    }
    get dateTimeValueIsNotNull() {
        return this._dateTimeValueIsNotNull;
    }
    set dateTimeValueIsNotNull(value) {
        this._dateTimeValueIsNotNull = value;
        this.updateDateValueString();
    }
    set form(value) {
        this._form = value;
        this.updateDateValueString();
    }
    get form() {
        return this._form;
    }
    get initialState() {
        return this._initialState;
    }
    get dateValue() {
        return this._dateValue;
    }
    set dateValue(value) {
        this._dateValue = value;
        this._initialState = StiDateTimeBoxValueChoise.Custom;
        this.updateDateValueString();
    }
    updateDateValueString() {
        if ((this.allowNull && !this.dateTimeValueIsNotNull) || (this.dateValue == null)) {
            this._dateValueString = "";
        }
        else {
            this._dateValueString = StiStaticHelperService.formatDate(this.dateValue, this.format, this.form?.settings.culture);
        }
    }
    set initialState(value) {
        if (value != this._initialState && value == StiDateTimeBoxValueChoise.Current) {
            this._dateValue = new Date();
        }
        this._initialState = value;
        this.updateDateValueString();
    }
    setDefaultValues() {
        this.initialState = StiDateTimeBoxValueChoise.Current;
    }
    get valueType() {
        return this._valueType;
    }
    set valueType(value) {
        this._valueType = value;
        this.updateDateValueString();
    }
    get value() {
        return this.dateValue;
    }
    get format() {
        let format = this.valueType == StiDateTimeBoxType.Date ? this._dateFomat :
            (this.valueType == StiDateTimeBoxType.DateTime ? this._dateTimeFormat : this._timeFormat);
        return format ?? "";
    }
    get dateTimeFormat() {
        return this._dateTimeFormat;
    }
    set dateTimeFormat(value) {
        this._dateTimeFormat = value;
        this.updateDateValueString();
    }
    get dateFormat() {
        return this._dateFomat;
    }
    set dateFormat(value) {
        this._dateFomat = value;
        this.updateDateValueString();
    }
    get timeFormat() {
        return this._timeFormat;
    }
    set timeFormat(value) {
        this._timeFormat = value;
        this.updateDateValueString();
    }
    setTabIndex(value) {
        this.tabIndex = value++;
        return value;
    }
    getUsedFonts(usedFonts) {
        super.getUsedFonts(usedFonts);
        usedFonts.add(this.font.family, this.arrayOfStylesToString(this.font.style), this.font.size);
        usedFonts.add(this.description.font.family, this.arrayOfStylesToString(this.description.font.style), this.description.font.size);
    }
    getDefaultEditableContent() {
        let textItem = new StiInputTextItem("", this.font, this.textColor, this.backgroundColor, this.contentAlignment);
        textItem.element = this;
        return textItem;
    }
    htmlStyle() {
        return `${this.font.htmlStyle()};color:${this.textColor.toHtmlColor()};text-align:${Enum.getName(StiHorizontalAlignment, this.contentAlignment)}`;
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Label", this.label.saveToJsonObject(options));
        jObject.addPropertyJObject("Description", this.description.saveToJsonObject(options));
        jObject.addPropertyJObject("Font", this.font.saveToJsonObject(options));
        jObject.addPropertyColor("BackgroundColor", this.backgroundColor);
        jObject.addPropertyColor("TextColor", this.textColor);
        jObject.addPropertyString("Tooltip", this.tooltip);
        jObject.addPropertyString("DateTimeFormat", this.dateTimeFormat);
        jObject.addPropertyString("DateFormat", this.dateFormat);
        jObject.addPropertyString("TimeFormat", this.timeFormat);
        jObject.addPropertyBool("Required", this.required);
        jObject.addPropertyColor("BorderColor", this.borderColor);
        jObject.addPropertyEnum("BorderWeight", StiLineWeight, this.borderWeight);
        jObject.addPropertyEnum("HorizontalAlignment", StiHorizontalAlignment, this.contentAlignment);
        jObject.addPropertyEnum("ValueType", StiDateTimeBoxType, this.valueType);
        jObject.addPropertyEnum("InitialState", StiDateTimeBoxValueChoise, this.initialState);
        jObject.addPropertyBool("AllowNull", this.allowNull);
        jObject.addPropertyBool("DateTimeValueIsNotNull", this.dateTimeValueIsNotNull);
        jObject.addPropertyString("DateValue", this.dateValue?.toJSON(), "");
        jObject.addPropertyString("DateValueString", this._dateValueString, "");
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        let dateValue;
        for (let property of json.properties()) {
            switch (property.name) {
                case "BackgroundColor":
                    this.backgroundColor = new Color();
                    this.backgroundColor.deserializeFromString(property.value);
                    break;
                case "TextColor":
                    this.textColor = new Color();
                    this.textColor.deserializeFromString(property.value);
                    break;
                case "Label":
                    this.label = new StiLabelItem(this);
                    this.label.loadFromJsonObject(property.value);
                    break;
                case "Font":
                    this.font = new Font();
                    this.font.loadFromJsonObject(property.value);
                    break;
                case "Description":
                    this.description = new StiTextItem();
                    this.description.loadFromJsonObject(property.value);
                    break;
                case "Tooltip":
                    this.tooltip = property.value;
                    break;
                case "DateTimeFormat":
                    this.dateTimeFormat = property.value;
                    break;
                case "DateFormat":
                    this.dateFormat = property.value;
                    break;
                case "TimeFormat":
                    this.timeFormat = property.value;
                    break;
                case "Required":
                    this.required = property.value;
                    break;
                case "BorderColor":
                    this.borderColor = new Color();
                    this.borderColor.deserializeFromString(property.value);
                    break;
                case "HorizontalAlignment":
                    this.contentAlignment = Enum.parse(StiHorizontalAlignment, property.value);
                    break;
                case "BorderWeight":
                    this.borderWeight = Enum.parse(StiLineWeight, property.value);
                    break;
                case "ValueType":
                    this.valueType = Enum.parse(StiDateTimeBoxType, property.value);
                    break;
                case "InitialState":
                    this.initialState = Enum.parse(StiDateTimeBoxValueChoise, property.value);
                    break;
                case "AllowNull":
                    this.allowNull = property.value;
                    break;
                case "DateTimeValueIsNotNull":
                    this.dateTimeValueIsNotNull = property.value;
                    break;
                case "DateValue":
                    if (property.value?.length > 0) {
                        dateValue = new Date(property.value);
                    }
                    break;
                case "DateValueString":
                    //this.dateValueString = property.value;
                    break;
            }
        }
        this._dateValue = this.initialState == StiDateTimeBoxValueChoise.Current || dateValue == null ? new Date() : dateValue;
        this.updateDateValueString();
    }
}

class StiDescriptionSettings {
    constructor(changesInterceptor) {
        this.changesInterceptor = changesInterceptor;
        this._font = new Font("Segoe UI", 9, [], this);
        this._color = Color.gray();
        this._color.changesInterceptor = this;
    }
    propertyChanged(propName, value, oldObject) {
        this.changesInterceptor.propertyChanged(`description.${propName}`, value, oldObject);
    }
    get color() {
        return this._color;
    }
    set color(value) {
        let oldValue = this._color.clone();
        this._color = value;
        value.changesInterceptor = this;
        if (oldValue && !oldValue.equals(value)) {
            this.propertyChanged("color", value, oldValue);
        }
    }
    get font() {
        return this._font;
    }
    set font(value) {
        let oldValue = this._font;
        this._font = value;
        if (oldValue && oldValue.equals(oldValue)) {
            this._font.changesInterceptor = this;
        }
    }
    saveToJsonObject(options) {
        let json = new StiJson();
        json.addPropertyJObject("Font", this.font.saveToJsonObject(options));
        json.addPropertyColor("Color", this.color);
        return json;
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "Font":
                    this._font = new Font("Segoe UI", 9, [], this);
                    this._font.loadFromJsonObject(property.value);
                    break;
                case "Color":
                    this._color = new Color();
                    this._color.changesInterceptor = this;
                    this._color.deserializeFromString(property.value);
                    break;
            }
        }
    }
}

class StiInnerTextSettings extends StiDescriptionSettings {
    constructor(changesInterceptor) {
        super(changesInterceptor);
        this.changesInterceptor = changesInterceptor;
        this._borderWeight = StiLineWeight.Thin;
        this._contentAlignment = StiHorizontalAlignment.Left;
        this._backgroundColor = Color.white();
        this._backgroundColor.changesInterceptor = this;
        this._backgroundColor.propertyName = "backgroundColor";
        this._borderColor = Color.lightGray();
        this._borderColor.changesInterceptor = this;
        this._borderColor.propertyName = "borderColor";
        this._checkColor = Color.black();
        this._checkColor.changesInterceptor = this;
        this._checkColor.propertyName = "checkColor";
        this._color = Color.black();
        this._color.changesInterceptor = this;
        this._font._size = 10;
    }
    propertyChanged(propName, value, oldObject) {
        this.changesInterceptor.propertyChanged(`innerText.${propName}`, value, oldObject);
    }
    get backgroundColor() {
        return this._backgroundColor;
    }
    set backgroundColor(value) {
        let oldValue = this._backgroundColor.clone();
        this._backgroundColor = value;
        this._backgroundColor.changesInterceptor = this;
        if (oldValue && !oldValue.equals(value)) {
            this.propertyChanged("backgroundColor", value, oldValue);
        }
    }
    get borderColor() {
        return this._borderColor;
    }
    set borderColor(value) {
        let oldValue = this._borderColor.clone();
        this._borderColor = value;
        this._borderColor.changesInterceptor = this;
        if (oldValue && !oldValue.equals(value)) {
            this.propertyChanged("borderColor", value, oldValue);
        }
    }
    get checkColor() {
        return this._checkColor;
    }
    set checkColor(value) {
        let oldValue = this._checkColor.clone();
        this._checkColor = value;
        this._checkColor.changesInterceptor = this;
        if (oldValue && !oldValue.equals(value)) {
            this.propertyChanged("checkColor", value, oldValue);
        }
    }
    get borderWeight() {
        return this._borderWeight;
    }
    set borderWeight(value) {
        let oldValue = this._borderWeight;
        this._borderWeight = value;
        if (oldValue != value) {
            this.propertyChanged("borderWeight", value, oldValue);
        }
    }
    get contentAlignment() {
        return this._contentAlignment;
    }
    set contentAlignment(value) {
        let oldValue = this._contentAlignment;
        this._contentAlignment = value;
        if (oldValue != value) {
            this.propertyChanged("contentAlignment", value, oldValue);
        }
    }
    saveToJsonObject(options) {
        let json = super.saveToJsonObject(options);
        json.addPropertyColor("BackgroundColor", this.backgroundColor);
        json.addPropertyColor("BorderColor", this.borderColor);
        json.addPropertyColor("CheckColor", this.checkColor);
        json.addPropertyEnum("BorderWeight", StiLineWeight, this.borderWeight);
        json.addPropertyEnum("ContentAlignment", StiHorizontalAlignment, this.contentAlignment);
        return json;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "BackgroundColor":
                case "BackColor":
                    this._backgroundColor = new Color();
                    this._backgroundColor.changesInterceptor = this;
                    this._backgroundColor.propertyName = "backgroundColor";
                    this._backgroundColor.deserializeFromString(property.value);
                    break;
                case "BorderColor":
                    this._borderColor = new Color();
                    this._borderColor.changesInterceptor = this;
                    this._borderColor.propertyName = "borderColor";
                    this._borderColor.deserializeFromString(property.value);
                    break;
                case "CheckColor":
                    this._checkColor = new Color();
                    this._checkColor.changesInterceptor = this;
                    this._checkColor.propertyName = "checkColor";
                    this._checkColor.deserializeFromString(property.value);
                    break;
                case "BorderWeight":
                    this._borderWeight = Enum.parse(StiLineWeight, property.value);
                    break;
                case "contentAlignment":
                case "ContentAlignment":
                    this._contentAlignment = Enum.parse(StiHorizontalAlignment, property.value);
                    break;
            }
        }
    }
}

class StiLabelSettings extends StiDescriptionSettings {
    constructor(changesInterceptor) {
        super(changesInterceptor);
        this.changesInterceptor = changesInterceptor;
        this._alignment = StiLabelAlignment.Left;
        this._verticalAlignment = StiVerticalAlignment.Center;
        this._width = 150;
        this._font = new Font("Segoe UI", 10, [], this);
        this._color = Color.black();
        this._color.changesInterceptor = this;
    }
    propertyChanged(propName, value, oldObject) {
        this.changesInterceptor.propertyChanged(`label.${propName}`, value, oldObject);
    }
    get alignment() {
        return this._alignment;
    }
    set alignment(value) {
        let oldValue = this._alignment;
        this._alignment = value;
        if (oldValue != value) {
            this.propertyChanged("alignment", value, oldValue);
        }
    }
    get verticalAlignment() {
        return this._verticalAlignment;
    }
    set verticalAlignment(value) {
        let oldValue = this._verticalAlignment;
        this._verticalAlignment = value;
        if (oldValue != value) {
            this.propertyChanged("verticalAlignment", value, oldValue);
        }
    }
    get width() {
        return this._width;
    }
    set width(value) {
        let oldValue = this._width;
        this._width = value;
        if (oldValue != value) {
            this.propertyChanged("width", value, oldValue);
        }
    }
    saveToJsonObject(options) {
        let json = super.saveToJsonObject(options);
        json.addPropertyEnum("Alignment", StiLabelAlignment, this.alignment);
        json.addPropertyEnum("VerticalAlignment", StiVerticalAlignment, this.verticalAlignment);
        json.addPropertyNumber("Width", this.width);
        return json;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Alignment":
                    this._alignment = Enum.parse(StiLabelAlignment, property.value);
                    break;
                case "VerticalAlignment":
                    this._verticalAlignment = Enum.parse(StiVerticalAlignment, property.value);
                    break;
                case "Width":
                    this._width = property.value;
                    break;
            }
        }
    }
}

class StiFormSettings {
    constructor(form) {
        this.form = form;
        this._label = new StiLabelSettings(this);
        this._description = new StiDescriptionSettings(this);
        this._innerText = new StiInnerTextSettings(this);
        this._dateTimeFormat = "m/d/yy h:MM tt";
        this._dateFomat = "dd.mm.yyyy";
        this._timeFormat = "HH:MM:ss";
        this._currency = "USD";
        this._currencyFormat = StiDisplayCurrencyAs.Code;
        this._unitAlignment = StiUnitAlignment.Prefix;
        this._thousandSeparator = StiThousandSeparator.Comma;
        this._decimalDigits = 2;
        this._padding = new StiPadding(8, 8, 8, 8, this);
        this._gridColumns = 12;
        this._gridVerticalStep = 5;
    }
    getCulture() {
        return this.culture || navigator.language || navigator.userLanguage;
    }
    set culture(value) {
        this._culture = value;
        this.form?.updateCultureDependecies();
    }
    get culture() {
        return this._culture;
    }
    get reportImage() {
        return this.form.reportImage;
    }
    set reportImage(value) {
        let oldValue = this.reportImage;
        this.form.reportImage = value;
        if (oldValue != value) {
            this.propertyChanged("reportImage", value, {});
        }
    }
    get formName() {
        return this.form.formName;
    }
    set formName(value) {
        let oldValue = this.form.formName;
        this.form.formName = value;
        if (oldValue != value) {
            this.propertyChanged("formName", value, {});
        }
    }
    get gridColumns() {
        return this._gridColumns;
    }
    set gridColumns(value) {
        let oldValue = this._gridColumns;
        if (typeof value != "number" ? Number(value) < 12 : value < 12) {
            this._gridColumns = 12;
        }
        else {
            this._gridColumns = value;
        }
        if (oldValue != value) {
            this.propertyChanged("gridColumns", value, {});
        }
    }
    get gridVerticalStep() {
        return this._gridVerticalStep;
    }
    set gridVerticalStep(value) {
        let oldValue = this._gridVerticalStep;
        if (value <= 1) {
            this._gridVerticalStep = 1;
        }
        else if (this.form?.pages.length > 0 && value > this.form.pages[this.form.pages.length - 1].contentAreaHeight) {
            this._gridVerticalStep = this.form.pages[this.form.pages.length - 1].contentAreaHeight;
        }
        else {
            this._gridVerticalStep = value;
        }
        if (oldValue != value) {
            this.propertyChanged("gridVerticalStep", value, {});
        }
    }
    get padding() {
        return this._padding;
    }
    set padding(value) {
        let oldObject = this._padding.clone();
        this._padding = value;
        this._padding.changesInterceptor = this;
        this.propertyChanged("padding", value, oldObject);
    }
    get label() {
        return this._label;
    }
    set label(value) {
        this._label = value;
    }
    get description() {
        return this._description;
    }
    set description(value) {
        this._description = value;
    }
    get innerText() {
        return this._innerText;
    }
    set innerText(value) {
        this._innerText = value;
    }
    get dateTimeFormat() {
        return this._dateTimeFormat;
    }
    set dateTimeFormat(value) {
        let oldValue = this._dateTimeFormat;
        this._dateTimeFormat = value;
        if (oldValue != value) {
            this.propertyChanged("dateTimeFormat", value, oldValue);
        }
    }
    get dateFormat() {
        return this._dateFomat;
    }
    set dateFormat(value) {
        let oldValue = this._dateFomat;
        this._dateFomat = value;
        if (oldValue != value) {
            this.propertyChanged("dateFormat", value, oldValue);
        }
    }
    get timeFormat() {
        return this._timeFormat;
    }
    set timeFormat(value) {
        let oldValue = this._timeFormat;
        this._timeFormat = value;
        if (oldValue != value) {
            this.propertyChanged("timeFormat", value, oldValue);
        }
    }
    get currency() {
        return this._currency;
    }
    set currency(value) {
        let oldValue = this._currency;
        this._currency = value;
        if (oldValue != value) {
            this.propertyChanged("currency", value, oldValue);
        }
    }
    get currencyFormat() {
        return this._currencyFormat;
    }
    set currencyFormat(value) {
        let oldValue = this._currencyFormat;
        this._currencyFormat = value;
        if (oldValue != value) {
            this.propertyChanged("currencyFormat", value, oldValue);
        }
    }
    get unitAlignment() {
        return this._unitAlignment;
    }
    set unitAlignment(value) {
        let oldValue = this._unitAlignment;
        this._unitAlignment = value;
        if (oldValue != value) {
            this.propertyChanged("unitAlignment", value, oldValue);
        }
    }
    get thousandSeparator() {
        return this._thousandSeparator;
    }
    set thousandSeparator(value) {
        let oldValue = this._thousandSeparator;
        this._thousandSeparator = value;
        if (oldValue != value) {
            this.propertyChanged("thousandSeparator", value, oldValue);
        }
    }
    get decimalDigits() {
        return this._decimalDigits;
    }
    set decimalDigits(value) {
        let oldValue = this._decimalDigits;
        if (value <= 0) {
            this._decimalDigits = 0;
        }
        else {
            this._decimalDigits = value;
        }
        if (oldValue != value) {
            this.propertyChanged("decimalDigits", value, oldValue);
        }
    }
    propertyChanged(propName, value, oldObject) {
        this.form.pages.forEach((p) => p.allElements.forEach((el) => {
            el.setProperty(propName, value["clone"] ? value.clone() : value, oldObject);
        }));
        if (propName.toLowerCase().indexOf("color") == -1) {
            this.form.formEvents.next({ name: "UpdateAllSizes" });
        }
        if (propName == "thousandSeparator" || propName == "decimalDigits") {
            this.form.formEvents.next({ name: "UpdateForm" });
        }
    }
    saveToJsonObject(options) {
        let json = new StiJson();
        json.addPropertyJObject("Label", this.label.saveToJsonObject(options));
        json.addPropertyJObject("Description", this.description.saveToJsonObject(options));
        json.addPropertyJObject("InnerText", this.innerText.saveToJsonObject(options));
        json.addPropertyString("TimeFormat", this.timeFormat);
        json.addPropertyString("DateFormat", this.dateFormat);
        json.addPropertyString("DateTimeFormat", this.dateTimeFormat);
        json.addPropertyNumber("DecimalDigits", this.decimalDigits);
        json.addPropertyNumber("GridColumns", this.gridColumns);
        json.addPropertyNumber("GridVerticalStep", this.gridVerticalStep);
        json.addPropertyString("Currency", this.currency);
        json.addPropertyEnum("CurrencyFormat", StiDisplayCurrencyAs, this.currencyFormat);
        json.addPropertyEnum("UnitAlignment", StiUnitAlignment, this.unitAlignment);
        json.addPropertyEnum("ThousandSeparator", StiThousandSeparator, this.thousandSeparator);
        json.addPropertyJObject("Padding", this.padding.saveToJsonObject(options));
        json.addPropertyString("Culture", this.culture);
        return json;
    }
    loadFormJsonString(text) {
        let jObject = new StiJson();
        jObject.deserialize(text);
        this.loadFromJsonObject(jObject);
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "Label":
                    this._label = new StiLabelSettings(this);
                    this._label.loadFromJsonObject(property.value);
                    break;
                case "Description":
                    this._description = new StiDescriptionSettings(this);
                    this._description.loadFromJsonObject(property.value);
                    break;
                case "InnerText":
                    this._innerText = new StiInnerTextSettings(this);
                    this._innerText.loadFromJsonObject(property.value);
                    break;
                case "TimeFormat":
                    this.timeFormat = property.value;
                    break;
                case "DateFormat":
                    this.dateFormat = property.value;
                    break;
                case "DateTimeFormat":
                    this.dateTimeFormat = property.value;
                    break;
                case "DecimalDigits":
                    this.decimalDigits = property.value;
                    break;
                case "Culture":
                    this.culture = property.value;
                    break;
                case "GridColumns":
                    this.gridColumns = property.value < 12 ? 12 : property.value;
                    break;
                case "GridVerticalStep":
                    this.gridVerticalStep = property.value;
                    break;
                case "Currency":
                    this._currency = property.value;
                    break;
                case "CurrencyFormat":
                    this._currencyFormat = Enum.parse(StiDisplayCurrencyAs, property.value);
                    break;
                case "UnitAlignment":
                    this._unitAlignment = Enum.parse(StiUnitAlignment, property.value);
                    break;
                case "Separator":
                case "ThousandSeparator":
                    this._thousandSeparator = Enum.parse(StiThousandSeparator, property.value);
                    break;
                case "Padding":
                    this._padding = new StiPadding();
                    this._padding.loadFromJsonObject(property.value);
                    break;
            }
        }
    }
    applySettings(element) {
        element.setProperty("label.font.family", this.label.font.family, null);
        element.setProperty("label.font.style", this.label.font.cloneStyle, null);
        element.setProperty("label.font.size", this.label.font.size, null);
        element.setProperty("label.color", this.label.color, null);
        element.setProperty("label.alignment", this.label.alignment, null);
        element.setProperty("label.width", this.label.width, null);
        element.setProperty("padding", this.padding, null);
        element.setProperty("description.font.family", this.description.font.family, null);
        element.setProperty("description.font.style", this.description.font.cloneStyle, null);
        element.setProperty("description.font.size", this.description.font.size, null);
        element.setProperty("description.color", this.description.color.clone(), null);
        element.setProperty("innerText.font.family", this.innerText.font.family, null);
        element.setProperty("innerText.font.style", this.innerText.font.cloneStyle, null);
        element.setProperty("innerText.font.size", this.innerText.font.size, null);
        element.setProperty("innerText.color", this.innerText.color.clone(), null);
        element.setProperty("innerText.backgroundColor", this.innerText.backgroundColor.clone(), null);
        element.setProperty("innerText.borderColor", this.innerText.borderColor.clone(), null);
        element.setProperty("innerText.borderWeight", this.innerText.borderWeight, null);
        element.setProperty("innerText.checkColor", this.innerText.checkColor.clone(), null);
        element.setProperty("innerText.contentAlignment", this.innerText.contentAlignment, null);
        element.setProperty("timeFormat", this.timeFormat, null);
        element.setProperty("dateFormat", this.dateFormat, null);
        element.setProperty("dateTimeFormat", this.dateTimeFormat, null);
        element.setProperty("currency", this.currency, null);
        element.setProperty("currencyFormat", this.currencyFormat, null);
        element.setProperty("unitAlignment", this.unitAlignment, null);
        element.setProperty("thousandSeparator", this.thousandSeparator, null);
        element.setProperty("decimalDigits", this.decimalDigits, null);
    }
}

class StiPagePaperKind extends StiFormObject {
    static { this._availableStandardKinds = []; }
    constructor(name, kind, width, height) {
        super();
        this.name = name;
        this.kind = kind;
        this._width = width;
        this._height = height;
    }
    get width() {
        return this._width;
    }
    set width(value) {
        this._width = value;
        this.updatePaperKind();
    }
    get height() {
        return this._height;
    }
    set height(value) {
        this._height = value;
        this.updatePaperKind();
    }
    updatePaperKind() {
        this.kind =
            StiPagePaperKind.availableStandardKinds().find((k) => k.height == this.height && k.width == this.width)?.kind ??
                PaperKind.Custom;
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyEnum("Kind", PaperKind, this.kind);
        if (this.kind == PaperKind.Custom) {
            jObject.addPropertyNumber("Width", this.width);
            jObject.addPropertyNumber("Height", this.height);
        }
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Kind":
                    this.kind = Enum.parse(PaperKind, property.value);
                    break;
                case "Width":
                    this.width = property.value;
                    break;
                case "Height":
                    this.height = property.value;
                    break;
            }
        }
    }
    clone() {
        return new StiPagePaperKind(this.name, this.kind, this.width, this.height);
    }
    static availableStandardKinds() {
        if (this._availableStandardKinds.length == 0) {
            this._availableStandardKinds.push(new StiPagePaperKind("Custom", PaperKind.Custom, 794, 1123));
            this._availableStandardKinds.push(new StiPagePaperKind("Letter", PaperKind.Letter, 816, 1056));
            this._availableStandardKinds.push(new StiPagePaperKind("Tabloid", PaperKind.Tabloid, 1056, 1632));
            this._availableStandardKinds.push(new StiPagePaperKind("Legal", PaperKind.Legal, 816, 1344));
            this._availableStandardKinds.push(new StiPagePaperKind("Statement", PaperKind.Statement, 528, 816));
            this._availableStandardKinds.push(new StiPagePaperKind("Executive", PaperKind.Executive, 696, 1008));
            this._availableStandardKinds.push(new StiPagePaperKind("A3", PaperKind.A3, 1123, 1587));
            this._availableStandardKinds.push(new StiPagePaperKind("A4", PaperKind.A4, 794, 1123));
            this._availableStandardKinds.push(new StiPagePaperKind("A5", PaperKind.A5, 559, 794));
            this._availableStandardKinds.push(new StiPagePaperKind("B4", PaperKind.B4, 971, 1376));
            this._availableStandardKinds.push(new StiPagePaperKind("B5", PaperKind.B5, 688, 971));
        }
        return this._availableStandardKinds;
    }
    static fromStandardPaperKind(standardPaperKind) {
        if (standardPaperKind == PaperKind.Custom) {
            return null;
        }
        return this.availableStandardKinds().filter((k) => k.kind === standardPaperKind)[0].clone();
    }
}

class StiPen {
    static dimGraySolid() {
        return new StiPen(Color.dimGray(), StiPenStyle.Solid, 1);
    }
    constructor(color, style = StiPenStyle.Solid, width = 1) {
        this.color = color;
        this.style = style;
        this.width = width;
    }
    get width() {
        return this._width;
    }
    set width(value) {
        if (value <= 0) {
            this._width = 0;
        }
        else if (value >= 395) {
            this._width = 395;
        }
        else {
            this._width = value;
        }
    }
    saveToJsonObject(options) {
        let json = new StiJson();
        json.addPropertyColor("Color", this.color);
        json.addPropertyEnum("Style", StiPenStyle, this.style);
        json.addPropertyNumber("Width", this.width);
        return json;
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "Color":
                    this.color = new Color();
                    this.color.deserializeFromString(property.value);
                    break;
                case "Style":
                    this.style = Enum.parse(StiPenStyle, property.value);
                    break;
                case "Width":
                    this.width = property.value;
                    break;
            }
        }
    }
    toHtmlBorder() {
        return `${this.width}px ${this.getHtmlStyle()} ${this.color.toHtmlColor()}`;
    }
    getHtmlStyle() {
        switch (this.style) {
            case StiPenStyle.Solid:
                return "solid";
            case StiPenStyle.Dash:
                return "dashed";
            case StiPenStyle.Dot:
                return "dotted";
        }
    }
}

class StiBorder {
    constructor(pen, drawLeft, drawTop, drawRight, drawBottom) {
        this.pen = pen;
        this.drawLeft = drawLeft;
        this.drawTop = drawTop;
        this.drawRight = drawRight;
        this.drawBottom = drawBottom;
    }
    saveToJsonObject(options) {
        let json = new StiJson();
        json.addPropertyJObject("Pen", this.pen.saveToJsonObject(options));
        json.addPropertyBool("DrawLeft", this.drawLeft);
        json.addPropertyBool("DrawTop", this.drawTop);
        json.addPropertyBool("DrawRight", this.drawRight);
        json.addPropertyBool("DrawBottom", this.drawBottom);
        return json;
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "Pen":
                    this.pen = new StiPen();
                    this.pen.loadFromJsonObject(property.value);
                    break;
                case "DrawLeft":
                    this.drawLeft = property.value;
                    break;
                case "DrawTop":
                    this.drawTop = property.value;
                    break;
                case "DrawBottom":
                    this.drawBottom = property.value;
                    break;
                case "DrawRight":
                    this.drawRight = property.value;
                    break;
            }
        }
    }
}

class StiImageElement extends StiFormElement {
    constructor() {
        super();
        this.type = "ImageElement";
        this.tooltip = "";
        this.font = new Font("Segoe UI", 10);
        this.description = new StiTextItem();
        this.canvasHeight = 195;
        this.border = new StiBorder(StiPen.dimGraySolid(), false, false, false, false);
        this.showBorderEditor = true;
        this.preserveAspectRatio = true;
        this.hyperlink = "";
        this.geometry = new StiRectangleGeometry(170, 195);
        this.label = new StiLabelItem(this, "");
        this.label.alignment = StiLabelAlignment.Top;
        this.padding = new StiPadding(0, 0, 0, 0, this);
    }
    canUpdateProperty(propName) {
        return !(propName.indexOf("padding") >= 0 || propName == "label.alignment");
    }
    getUsedFonts(usedFonts) {
        super.getUsedFonts(usedFonts);
        usedFonts.add(this.font.family, this.arrayOfStylesToString(this.font.style), this.font.size);
        usedFonts.add(this.description.font.family, this.arrayOfStylesToString(this.description.font.style), this.description.font.size);
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Label", this.label.saveToJsonObject(options));
        jObject.addPropertyJObject("Description", this.description.saveToJsonObject(options));
        jObject.addPropertyString("Tooltip", this.tooltip);
        jObject.addPropertyStringNullOrEmpty("Hyperlink", this.hyperlink);
        jObject.addPropertyJObject("Border", this.border.saveToJsonObject(options));
        if (!(options && options["notSerializeImages"])) {
            jObject.addPropertyStringNullOrEmpty("Image", this.image?.substring(this.image.indexOf("base64,") + 7));
        }
        jObject.addPropertyBool("PreserveAspectRatio", this.preserveAspectRatio);
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Label":
                    this.label = new StiLabelItem(this);
                    this.label.loadFromJsonObject(property.value);
                    break;
                case "Description":
                    this.description = new StiTextItem();
                    this.description.loadFromJsonObject(property.value);
                    break;
                case "Tooltip":
                    this.tooltip = property.value;
                    break;
                case "Image":
                case "BackgroundImage":
                    this.image = `data:image/png;base64,${property.value}`;
                    break;
                case "PreserveAspectRatio":
                    this.preserveAspectRatio = property.value;
                    break;
                case "Border":
                    this.border = new StiBorder();
                    this.border.loadFromJsonObject(property.value);
                    break;
                case "Hyperlink":
                    this.hyperlink = property.value;
                    break;
            }
        }
    }
}

class StiExceedMargins {
    constructor(drawLeft, drawTop, drawRight, drawBottom) {
        this.drawLeft = drawLeft;
        this.drawTop = drawTop;
        this.drawRight = drawRight;
        this.drawBottom = drawBottom;
    }
}

class StiBackgroundedAlignedTextItem extends StiBackgroundedTextItem {
    constructor(value = "", font = new Font("Segoe UI", 15), color = Color.black(), backgroundColor = Color.white(), horizontalAlignment = StiHorizontalAlignment.Center, verticalAlignment = StiVerticalAlignment.Center) {
        super(value, font, color, backgroundColor);
        this.font = font;
        this.color = color;
        this.backgroundColor = backgroundColor;
        this.horizontalAlignment = horizontalAlignment;
        this.verticalAlignment = verticalAlignment;
    }
    get eContentAlignment() {
        return this.horizontalAlignment;
    }
    set eContentAlignment(value) {
        this.horizontalAlignment = value;
    }
    get eVerticalAlignment() {
        return this.verticalAlignment;
    }
    set eVerticalAlignment(value) {
        this.verticalAlignment = value;
    }
    haveVerticalAlignment() {
        return true;
    }
    haveContentAlignment() {
        return true;
    }
    saveToJsonObject(options) {
        let json = super.saveToJsonObject(options);
        json.addPropertyEnum("HorizontalAlignment", StiHorizontalAlignment, this.horizontalAlignment);
        json.addPropertyEnum("VerticalAlignment", StiVerticalAlignment, this.verticalAlignment);
        return json;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "HorizontalAlignment":
                    this.horizontalAlignment = Enum.parse(StiHorizontalAlignment, property.value);
                    break;
                case "VerticalAlignment":
                    this.verticalAlignment = Enum.parse(StiVerticalAlignment, property.value);
                    break;
            }
        }
    }
}

class StiLabelElement extends StiFormElement {
    constructor() {
        super();
        this.type = "LabelElement";
        this.exceedMargins = new StiExceedMargins(false, false, false, false);
        this.text = new StiBackgroundedAlignedTextItem("", new Font("Segoe UI", 9), Color.black(), Color.transparent());
        this.border = new StiBorder(StiPen.dimGraySolid(), false, false, false, false);
        this.showBorderEditor = true;
        this.hyperlink = "";
        this.geometry = new StiRectangleGeometry(100, 40);
        this.padding = new StiPadding(0, 0, 0, 0, this);
    }
    get expression() {
        return this.text?.value;
    }
    canUpdateProperty(propName) {
        return !(propName.indexOf("padding") >= 0);
    }
    getUsedFonts(usedFonts) {
        super.getUsedFonts(usedFonts);
        usedFonts.add(this.text.font.family, this.arrayOfStylesToString(this.text.font.style), this.text.font.size);
    }
    setProperty(propName, value, oldObject) {
        super.setProperty(propName, value, oldObject);
        if (propName == "innerText.backgroundColor") {
            //this.text.backgroundColor = value.clone();
        }
        else if (propName == "innerText.contentAlignment") {
            //this.text.horizontalAlignment = value;
        }
        else if (propName.startsWith("label.font") || propName == "label.color") {
            this.text.setProperty(propName.replace("label.", ""), value.clone ? value.clone() : value, oldObject);
        }
    }
    getDefaultEditableContent() {
        return this.text;
    }
    htmlStyle() {
        return `${this.text.font.htmlStyle()};color:${this.text.color.toHtmlColor()};justify-content:${Enum.getName(StiHorizontalAlignment, this.text.horizontalAlignment)};align-items:${Enum.getName(StiVerticalAlignment, this.text.verticalAlignment)}`;
    }
    saveToJsonObject(options) {
        let states = [];
        if (this.exceedMargins.drawTop &&
            this.exceedMargins.drawBottom &&
            this.exceedMargins.drawLeft &&
            this.exceedMargins.drawRight) {
            states.push("All");
        }
        else if (!this.exceedMargins.drawTop &&
            !this.exceedMargins.drawBottom &&
            !this.exceedMargins.drawLeft &&
            !this.exceedMargins.drawRight) {
            states.push("None");
        }
        else {
            if (this.exceedMargins.drawTop) {
                states.push("Top");
            }
            if (this.exceedMargins.drawLeft) {
                states.push("Left");
            }
            if (this.exceedMargins.drawRight) {
                states.push("Right");
            }
            if (this.exceedMargins.drawBottom) {
                states.push("Bottom");
            }
        }
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Text", this.text.saveToJsonObject(options));
        jObject.addPropertyJObject("Border", this.border.saveToJsonObject(options));
        jObject.addPropertyString("ExceededMargins", states.join());
        jObject.addPropertyStringNullOrEmpty("Hyperlink", this.hyperlink);
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Hyperlink":
                    this.hyperlink = property.value;
                    break;
                case "Text":
                    this.text = new StiBackgroundedAlignedTextItem();
                    this.text.loadFromJsonObject(property.value);
                    break;
                case "Border":
                    this.border = new StiBorder();
                    this.border.loadFromJsonObject(property.value);
                    break;
                case "ExceededMargins":
                    let string = property.value;
                    this.exceedMargins.drawBottom = false;
                    this.exceedMargins.drawLeft = false;
                    this.exceedMargins.drawRight = false;
                    this.exceedMargins.drawTop = false;
                    if (string.indexOf("All") >= 0) {
                        this.exceedMargins.drawBottom = true;
                        this.exceedMargins.drawLeft = true;
                        this.exceedMargins.drawRight = true;
                        this.exceedMargins.drawTop = true;
                    }
                    else {
                        if (string.indexOf("Top") >= 0) {
                            this.exceedMargins.drawTop = true;
                        }
                        if (string.indexOf("Left") >= 0) {
                            this.exceedMargins.drawLeft = true;
                        }
                        if (string.indexOf("Right") >= 0) {
                            this.exceedMargins.drawRight = true;
                        }
                        if (string.indexOf("Bottom") >= 0) {
                            this.exceedMargins.drawBottom = true;
                        }
                    }
                    break;
            }
        }
    }
}

class StiLineElement extends StiFormElement {
    constructor() {
        super();
        this.type = "LineElement";
        this.description = new StiTextItem();
        this.lineColor = Color.fromArgb(255, 192, 191, 192);
        this.verticalAlignment = StiVerticalAlignment.Center;
        this.style = StiPenStyle.Solid;
        this.lineThickness = 1;
        this.geometry = new StiRectangleGeometry(100, 20);
        this.padding = new StiPadding(0, 0, 0, 0);
    }
    canUpdateProperty(propName) {
        return !propName.startsWith("padding");
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Description", this.description.saveToJsonObject(options));
        jObject.addPropertyColor("LineColor", this.lineColor);
        jObject.addPropertyNumber("LineThickness", this.lineThickness);
        jObject.addPropertyEnum("VerticalAlignment", StiVerticalAlignment, this.verticalAlignment);
        jObject.addPropertyEnum("Style", StiPenStyle, this.style);
        return jObject;
    }
    toHtmlBorder() {
        return `${this.lineThickness}px ${this.getHtmlStyle()} ${this.lineColor.toHtmlColor()}`;
    }
    getHtmlStyle() {
        switch (this.style) {
            case StiPenStyle.Solid:
                return "solid";
            case StiPenStyle.Dash:
                return "dashed";
            case StiPenStyle.Dot:
                return "dotted";
        }
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Description":
                    this.description = new StiTextItem();
                    this.description.loadFromJsonObject(property.value);
                    break;
                case "LineColor":
                    this.lineColor = new Color();
                    this.lineColor.deserializeFromString(property.value);
                    break;
                case "LineThickness":
                    this.lineThickness = property.value;
                    break;
                case "VerticalAlignment":
                    this.verticalAlignment = Enum.parse(StiVerticalAlignment, property.value);
                    break;
                case "Style":
                    this.style = Enum.parse(StiPenStyle, property.value);
                    break;
            }
        }
    }
}

class StiListBoxElement extends StiFormElement {
    setDefaultValues() {
        this.selectedOptions = [];
    }
    constructor() {
        super();
        this.type = "List_BoxElement";
        this.tooltip = "";
        this.required = false;
        this.description = new StiTextItem();
        this.font = new Font("Segoe UI", 10);
        this.backgroundColor = Color.white();
        this.textColor = Color.black();
        this.borderColor = Color.lightGray();
        this.borderWeight = StiLineWeight.Thin;
        this.allowMultiselection = false;
        this.options = [];
        this.selectedOptions = [];
        this.geometry = new StiRectangleGeometry(150, 90);
        this.label = new StiLabelItem(this, StiLocalizationService.get("Components", "StiListBox"));
        this.options.push(StiLocalizationService.get("PropertyMain", "First"));
        this.options.push(StiLocalizationService.get("PropertyMain", "Second"));
        this.options.push(StiLocalizationService.get("PropertyMain", "Third"));
    }
    setTabIndex(value) {
        this.tabIndex = value++;
        return value;
    }
    getUsedFonts(usedFonts) {
        super.getUsedFonts(usedFonts);
        usedFonts.add(this.font.family, this.arrayOfStylesToString(this.font.style), this.font.size);
        usedFonts.add(this.description.font.family, this.arrayOfStylesToString(this.description.font.style), this.description.font.size);
    }
    htmlStyle() {
        return `${this.font.htmlStyle()};color:${this.textColor.toHtmlColor()};`;
    }
    getDefaultEditableContent() {
        let textItem = new StiInputTextItem("", this.font, this.textColor, this.backgroundColor);
        textItem.element = this;
        return textItem;
    }
    get value() {
        if (this.selectedOptions) {
            return this.selectedOptions.length == 1 ? this.selectedOptions[0] : this.selectedOptions;
        }
        return null;
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Label", this.label.saveToJsonObject(options));
        jObject.addPropertyJObject("Description", this.description.saveToJsonObject(options));
        jObject.addPropertyJObject("Font", this.font.saveToJsonObject(options));
        jObject.addPropertyColor("BackgroundColor", this.backgroundColor);
        jObject.addPropertyColor("TextColor", this.textColor);
        jObject.addPropertyString("Tooltip", this.tooltip);
        jObject.addPropertyBool("Required", this.required);
        jObject.addPropertyColor("BorderColor", this.borderColor);
        jObject.addPropertyEnum("BorderWeight", StiLineWeight, this.borderWeight);
        jObject.addPropertyBool("AllowMultiselection", this.allowMultiselection);
        jObject.addPropertyArray("SelectedOptions", this.selectedOptions);
        jObject.addPropertyArray("Options", this.options);
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "BackgroundColor":
                    this.backgroundColor = new Color();
                    this.backgroundColor.deserializeFromString(property.value);
                    break;
                case "TextColor":
                    this.textColor = new Color();
                    this.textColor.deserializeFromString(property.value);
                    break;
                case "Label":
                    this.label = new StiLabelItem(this);
                    this.label.loadFromJsonObject(property.value);
                    break;
                case "Font":
                    this.font = new Font();
                    this.font.loadFromJsonObject(property.value);
                    break;
                case "Description":
                    this.description = new StiTextItem();
                    this.description.loadFromJsonObject(property.value);
                    break;
                case "Tooltip":
                    this.tooltip = property.value;
                    break;
                case "Required":
                    this.required = property.value;
                    break;
                case "BorderColor":
                    this.borderColor = new Color();
                    this.borderColor.deserializeFromString(property.value);
                    break;
                case "BorderWeight":
                    this.borderWeight = Enum.parse(StiLineWeight, property.value);
                    break;
                case "AllowMultiselection":
                    this.allowMultiselection = property.value;
                    break;
                case "SelectedOptions":
                    this.selectedOptions = [];
                    property.value.properties().forEach((p) => this.selectedOptions.push(p.value));
                    break;
                case "Options":
                    this.options = [];
                    property.value.properties().forEach((p) => this.options.push(p.value));
                    break;
            }
        }
    }
}

class StiOptionItem {
    get eFont() {
        return this.element.font;
    }
    set eFont(value) {
        this.element.font = value;
    }
    get eColor() {
        return this.element.textColor;
    }
    set eColor(value) {
        this.element.textColor = value;
    }
    haveBackgoundColor() {
        return false;
    }
    haveContentAlignment() {
        return false;
    }
    haveVerticalAlignment() {
        return false;
    }
    htmlStyle() {
        return this.element ? `${this.eFont.htmlStyle()};color:${this.eColor.toHtmlColor()}` : "";
    }
    set eValue(value) {
        this.value = value;
        this.element.nativeOptions[this.index] = value;
    }
    get eValue() {
        return this.value;
    }
    constructor(value, element, index) {
        this.element = element;
        this.index = index;
        this.value = value;
    }
}

class StiMultipleSelectionElement extends StiFormElement {
    setDefaultValues() {
        this.selectedOptions = [];
    }
    constructor() {
        super();
        this.type = "Multiple_SelectionElement";
        this.tooltip = "";
        this.required = false;
        this.description = new StiTextItem();
        this.font = new Font("Segoe UI", 10);
        this._columns = 1;
        this.backgroundColor = Color.white();
        this.textColor = Color.black();
        this.checkColor = Color.black();
        this.borderColor = Color.lightGray();
        this.prefix = "";
        this.suffix = "";
        this.optionsContentEditable = [];
        this.useCustomOption = false;
        this.customOptionText = "";
        this.selectedOptions = [];
        this.geometry = new StiRectangleGeometry(150, 80);
        this.label = new StiLabelItem(this, StiLocalizationService.get("Components", "StiMultipleSelection"));
        this.options = [];
        this.options.push(StiLocalizationService.get("PropertyMain", "First"));
        this.options.push(StiLocalizationService.get("PropertyMain", "Second"));
        this.options.push(StiLocalizationService.get("PropertyMain", "Third"));
    }
    setTabIndex(value) {
        this.tabIndex = value++;
        return value;
    }
    set options(value) {
        this.nativeOptions = value;
        let this_ = this;
        this._options = new Proxy(value, {
            deleteProperty: function (target, property) {
                setTimeout(() => {
                    this_.updateOptionsContentEditable();
                }, 0);
                return true;
            },
            set: function (target, property, value, receiver) {
                target[property] = value;
                this_.updateOptionsContentEditable();
                return true;
            },
        });
        this.updateOptionsContentEditable();
    }
    updateOptionsContentEditable() {
        this.optionsContentEditable = [];
        this.options.forEach((l, index) => this.optionsContentEditable.push(new StiOptionItem(l, this, index)));
    }
    getDefaultEditableContent() {
        let textItem = new StiInputTextItem("", this.font, this.textColor);
        textItem.element = this;
        return textItem;
    }
    get options() {
        return this._options;
    }
    get value() {
        if (this.selectedOptions) {
            return this.selectedOptions.length == 1 ? this.selectedOptions[0] : this.selectedOptions;
        }
        return null;
    }
    get columns() {
        return this._columns;
    }
    set columns(value) {
        if (value <= 1) {
            this._columns = 1;
        }
        else {
            this._columns = value;
        }
    }
    getUsedFonts(usedFonts) {
        super.getUsedFonts(usedFonts);
        usedFonts.add(this.font.family, this.arrayOfStylesToString(this.font.style), this.font.size);
        usedFonts.add(this.description.font.family, this.arrayOfStylesToString(this.description.font.style), this.description.font.size);
    }
    htmlStyle() {
        return `${this.font.htmlStyle()};color:${this.textColor.toHtmlColor()};`;
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Label", this.label.saveToJsonObject(options));
        jObject.addPropertyJObject("Description", this.description.saveToJsonObject(options));
        jObject.addPropertyString("Tooltip", this.tooltip);
        jObject.addPropertyBool("Required", this.required);
        jObject.addPropertyJObject("Font", this.font.saveToJsonObject(options));
        jObject.addPropertyNumber("Columns", this.columns);
        jObject.addPropertyColor("BackgroundColor", this.backgroundColor);
        jObject.addPropertyColor("TextColor", this.textColor);
        jObject.addPropertyColor("CheckColor", this.checkColor);
        jObject.addPropertyColor("BorderColor", this.borderColor);
        jObject.addPropertyArray("Options", this.options);
        jObject.addPropertyBool("UseCustomOption", this.useCustomOption);
        jObject.addPropertyString("CustomOptionText", this.customOptionText);
        jObject.addPropertyArray("SelectedOptions", this.selectedOptions);
        jObject.addPropertyString("Prefix", this.prefix);
        jObject.addPropertyString("Suffix", this.suffix);
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "BackgroundColor":
                    this.backgroundColor = new Color();
                    this.backgroundColor.deserializeFromString(property.value);
                    break;
                case "TextColor":
                    this.textColor = new Color();
                    this.textColor.deserializeFromString(property.value);
                    break;
                case "Label":
                    this.label = new StiLabelItem(this);
                    this.label.loadFromJsonObject(property.value);
                    break;
                case "Font":
                    this.font = new Font();
                    this.font.loadFromJsonObject(property.value);
                    break;
                case "Description":
                    this.description = new StiTextItem();
                    this.description.loadFromJsonObject(property.value);
                    break;
                case "Tooltip":
                    this.tooltip = property.value;
                    break;
                case "Required":
                    this.required = property.value;
                    break;
                case "Columns":
                    this.columns = property.value;
                    break;
                case "BorderColor":
                    this.borderColor = new Color();
                    this.borderColor.deserializeFromString(property.value);
                    break;
                case "CheckColor":
                    this.checkColor = new Color();
                    this.checkColor.deserializeFromString(property.value);
                    break;
                case "CustomOptionText":
                    this.customOptionText = property.value;
                    break;
                case "UseCustomOption":
                    this.useCustomOption = property.value;
                    break;
                case "Prefix":
                    this.prefix = property.value;
                    break;
                case "Suffix":
                    this.suffix = property.value;
                    break;
                case "SelectedOptions":
                    this.selectedOptions = [];
                    property.value.properties().forEach((p) => this.selectedOptions.push(p.value));
                    break;
                case "Options":
                    this.options = [];
                    property.value.properties().forEach((p) => this.options.push(p.value));
                    break;
            }
        }
    }
}

class StiNumberBoxElement extends StiFormElement {
    constructor() {
        super();
        this._decimalDigits = 2;
        this._maximum = 15;
        this.type = "Number_BoxElement";
        this.tooltip = "";
        this.required = false;
        this.description = new StiTextItem();
        this.font = new Font("Segoe UI", 10);
        this.contentAlignment = StiHorizontalAlignment.Right;
        this.backgroundColor = Color.white();
        this.textColor = Color.black();
        this.value = 0;
        this.allowNegative = true;
        this.numberType = StiNumberType.Decimal;
        this.thousandSeparator = StiThousandSeparator.None;
        this.useRange = false;
        this._minimum = 0;
        this.rangeFormat = StiNumberRangeFormat.Digits;
        this.unitLabel = "";
        this.unitAlignment = StiUnitAlignment.Suffix;
        this.unitForeground = Color.black();
        this.currencyLabelFormat = StiDisplayCurrencyAs.Code;
        this.currency = "USD";
        this.borderColor = Color.lightGray();
        this.borderWeight = StiLineWeight.Thin;
        this.geometry = new StiRectangleGeometry(150, 40);
        this.label = new StiLabelItem(this, StiLocalizationService.get("Components", "StiNumberBox"));
    }
    setDefaultValues() {
        this.value = 0;
    }
    setTabIndex(value) {
        this.tabIndex = value++;
        return value;
    }
    getDefaultEditableContent() {
        let textItem = new StiInputTextItem(this.value?.toString(), this.font, this.textColor, this.backgroundColor, this.contentAlignment);
        textItem.element = this;
        return textItem;
    }
    get isCurrency() {
        return this.numberType == StiNumberType.Currency ? true : false;
    }
    get eValue() {
        return this.value.toString();
    }
    get decimalDigits() {
        return this._decimalDigits;
    }
    set decimalDigits(value) {
        this._decimalDigits = Math.max(0, Math.min(10, value));
    }
    get maximum() {
        return this._maximum;
    }
    set maximum(value) {
        this._maximum = value <= this.minimum ? this.minimum : value;
    }
    get minimum() {
        return this._minimum;
    }
    set minimum(value) {
        this._minimum = value >= this.maximum ? this.maximum : value;
    }
    set eValue(value) {
        try {
            this.value = parseFloat(value);
        }
        catch {
            this.value = 0;
        }
    }
    get eFont() {
        return this.font;
    }
    set eFont(value) {
        this.font = value;
    }
    get eBackgroundColor() {
        return this.backgroundColor;
    }
    set eBackgroundColor(value) {
        this.backgroundColor = value;
    }
    get eContentAlignment() {
        return this.contentAlignment;
    }
    set eContentAlignment(value) {
        this.contentAlignment = value;
    }
    haveContentAlignment() {
        return true;
    }
    haveVerticalAlignment() {
        return false;
    }
    getUsedFonts(usedFonts) {
        super.getUsedFonts(usedFonts);
        usedFonts.add(this.font.family, this.arrayOfStylesToString(this.font.style), this.font.size);
        usedFonts.add(this.description.font.family, this.arrayOfStylesToString(this.description.font.style), this.description.font.size);
    }
    haveBackgoundColor() {
        return true;
    }
    get eColor() {
        return this.textColor;
    }
    set eColor(value) {
        this.textColor = value;
    }
    htmlStyle() {
        return `${this.font.htmlStyle()};color:${this.textColor.toHtmlColor()};text-align:${Enum.getName(StiHorizontalAlignment, this.contentAlignment)}`;
    }
    setProperty(propName, value, oldObject) {
        super.setProperty(propName, value, oldObject);
        if (propName == "thousandSeparator" && (oldObject === null || oldObject == this.thousandSeparator)) {
            this.thousandSeparator = value;
        }
        else if (propName == "currencyFormat" && (oldObject === null || oldObject == this.currencyLabelFormat)) {
            this.currencyLabelFormat = value;
        }
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Label", this.label.saveToJsonObject(options));
        jObject.addPropertyJObject("Description", this.description.saveToJsonObject(options));
        jObject.addPropertyString("Tooltip", this.tooltip);
        jObject.addPropertyBool("Required", this.required);
        jObject.addPropertyJObject("Font", this.font.saveToJsonObject(options));
        jObject.addPropertyNumber("Value", this.value);
        jObject.addPropertyBool("AllowNegative", this.allowNegative);
        jObject.addPropertyEnum("NumberType", StiNumberType, this.numberType);
        jObject.addPropertyEnum("ThousandSeparator", StiThousandSeparator, this.thousandSeparator);
        jObject.addPropertyNumber("DecimalDigits", this.decimalDigits);
        jObject.addPropertyEnum("ContentAlignment", StiHorizontalAlignment, this.contentAlignment);
        jObject.addPropertyBool("UseRange", this.useRange);
        jObject.addPropertyNumber("Minimum", this.minimum);
        jObject.addPropertyNumber("Maximum", this.maximum);
        jObject.addPropertyEnum("RangeFormat", StiNumberRangeFormat, this.rangeFormat);
        jObject.addPropertyString("UnitLabel", this.unitLabel);
        jObject.addPropertyEnum("UnitAlignment", StiUnitAlignment, this.unitAlignment);
        jObject.addPropertyColor("UnitForeground", this.unitForeground);
        jObject.addPropertyEnum("CurrencyLabelFormat", StiDisplayCurrencyAs, this.currencyLabelFormat);
        jObject.addPropertyString("Currency", this.currency);
        jObject.addPropertyColor("BackgroundColor", this.backgroundColor);
        jObject.addPropertyColor("TextColor", this.textColor);
        jObject.addPropertyColor("BorderColor", this.borderColor);
        jObject.addPropertyEnum("BorderWeight", StiLineWeight, this.borderWeight);
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Label":
                    this.label = new StiLabelItem(this);
                    this.label.loadFromJsonObject(property.value);
                    break;
                case "Description":
                    this.description = new StiTextItem();
                    this.description.loadFromJsonObject(property.value);
                    break;
                case "Tooltip":
                    this.tooltip = property.value;
                    break;
                case "Required":
                    this.required = property.value;
                    break;
                case "Font":
                    this.font = new Font();
                    this.font.loadFromJsonObject(property.value);
                    break;
                case "Value":
                    this.value = property.value;
                    break;
                case "AllowNegative":
                    this.allowNegative = property.value;
                    break;
                case "NumberType":
                    this.numberType = Enum.parse(StiNumberType, property.value);
                    break;
                case "ThousandSeparator":
                    this.thousandSeparator = Enum.parse(StiThousandSeparator, property.value);
                    break;
                case "DecimalDigits":
                    this.decimalDigits = property.value;
                    break;
                case "ContentAlignment":
                    this.contentAlignment = Enum.parse(StiHorizontalAlignment, property.value);
                    break;
                case "UseRange":
                    this.useRange = property.value;
                    break;
                case "Minimum":
                    this.minimum = property.value;
                    break;
                case "Maximum":
                    this.maximum = property.value;
                    break;
                case "RangeFormat":
                    this.rangeFormat = Enum.parse(StiNumberRangeFormat, property.value);
                    break;
                case "UnitLabel":
                    this.unitLabel = property.value;
                    break;
                case "UnitAlignment":
                    this.unitAlignment = Enum.parse(StiUnitAlignment, property.value);
                    break;
                case "UnitForeground":
                    this.unitForeground = new Color();
                    this.unitForeground.deserializeFromString(property.value);
                    break;
                case "CurrencyLabelFormat":
                    this.currencyLabelFormat = Enum.parse(StiDisplayCurrencyAs, property.value);
                    break;
                case "Currency":
                    this.currency = property.value;
                    break;
                case "BackgroundColor":
                    this.backgroundColor = new Color();
                    this.backgroundColor.deserializeFromString(property.value);
                    break;
                case "TextColor":
                    this.textColor = new Color();
                    this.textColor.deserializeFromString(property.value);
                    break;
                case "BorderColor":
                    this.borderColor = new Color();
                    this.borderColor.deserializeFromString(property.value);
                    break;
                case "BorderWeight":
                    this.borderWeight = Enum.parse(StiLineWeight, property.value);
                    break;
            }
        }
    }
}

class StiPDFSignatureElement extends StiFormElement {
    constructor() {
        super();
        this.type = "PDFSignatureElement";
        this.required = false;
        this.description = new StiTextItem();
        this.signaturePanelWidth = 185;
        this.signaturePanelHeight = 100;
        this.placeholder = "Place for Digital Signature";
        this.placeholderBackColor = Color.transparent();
        this.canvasHeight = 120;
        this.loadWithAspectRatio = false;
        this.geometry = new StiRectangleGeometry(180, 145);
        this.label = new StiLabelItem(this, StiLocalizationService.get("Components", "StiPdfDigitalSignature"));
    }
    saveToJsonObject(options) {
        if (this.element) {
            if (this.element.nativeElement?.offsetWidth > 0 && this.element.nativeElement?.offsetHeight > 0) {
                this.signaturePanelWidth = this.element.nativeElement?.offsetWidth;
                this.signaturePanelHeight = this.element.nativeElement?.offsetHeight;
            }
        }
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Label", this.label.saveToJsonObject(options));
        jObject.addPropertyJObject("Description", this.description.saveToJsonObject(options));
        jObject.addPropertyBool("Required", this.required);
        jObject.addPropertyStringNullOrEmpty("Placeholder", this.placeholder);
        jObject.addPropertyColor("PlaceholderBackColor", this.placeholderBackColor);
        jObject.addPropertyNumber("SignaturePanelWidth", this.signaturePanelWidth);
        jObject.addPropertyNumber("SignaturePanelHeight", this.signaturePanelHeight);
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Label":
                    this.label = new StiLabelItem(this);
                    this.label.loadFromJsonObject(property.value);
                    break;
                case "Description":
                    this.description = new StiTextItem();
                    this.description.loadFromJsonObject(property.value);
                    break;
                case "Required":
                    this.required = property.value;
                    break;
                case "SignaturePanelWidth":
                    this.signaturePanelWidth = property.value;
                    break;
                case "SignaturePanelHeight":
                    this.signaturePanelHeight = property.value;
                    break;
                case "Placeholder":
                    this.placeholder = property.value;
                    break;
                case "PlaceholderBackColor":
                    this.placeholderBackColor = new Color();
                    this.placeholderBackColor.deserializeFromString(property.value);
                    break;
            }
        }
    }
}

class StiImageEditorResult {
    constructor() {
        this.loadedImage = "";
        this.verticalAlignment = StiVerticalAlignment.Center;
        this.horizontalAlignment = StiHorizontalAlignment.Center;
        this.aspectRatio = false;
        this.stretch = false;
        this.naturalWidth = 0;
        this.naturalHeight = 0;
    }
    saveToJsonObject(options) {
        let json = new StiJson();
        json.addPropertyBool("AspectRatio", this.aspectRatio);
        json.addPropertyBool("Stretch", this.stretch);
        if (!(options && options["notSerializeImages"])) {
            json.addPropertyStringNullOrEmpty("LoadedImage", this.loadedImage?.substring(this.loadedImage.indexOf("base64,") + 7));
        }
        json.addPropertyNumber("NaturalWidth", this.naturalWidth);
        json.addPropertyNumber("NaturalHeight", this.naturalHeight);
        json.addPropertyEnum("HorizontalAlignment", StiHorizontalAlignment, this.horizontalAlignment);
        json.addPropertyEnum("VerticalAlignment", StiVerticalAlignment, this.verticalAlignment);
        return json;
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "AspectRatio":
                    this.aspectRatio = property.value;
                    break;
                case "Stretch":
                    this.stretch = property.value;
                    break;
                case "LoadedImage":
                    this.loadedImage = `data:image/png;base64,${property.value}`;
                    break;
                case "NaturalWidth":
                    this.naturalWidth = property.value;
                    break;
                case "NaturalHeight":
                    this.naturalHeight = property.value;
                    break;
                case "HorizontalAlignment":
                    this.horizontalAlignment = Enum.parse(StiHorizontalAlignment, property.value);
                    break;
                case "VerticalAlignment":
                    this.verticalAlignment = Enum.parse(StiVerticalAlignment, property.value);
                    break;
            }
        }
    }
}

class StiSignatureElement extends StiFormElement {
    get value() {
        return this.currentSignatureMode == "Draw" ? this.backgroundImage : this.getTypeImage();
    }
    getTypeImage() {
        if (this.element?.nativeElement) {
            let canvas = document.createElement('canvas');
            canvas.width = this.element?.nativeElement.offsetWidth;
            canvas.height = this.element?.nativeElement.offsetHeight;
            var ctx = canvas.getContext("2d");
            ctx.font = "16pt " + this.specialFont;
            ctx.fillText(`${this.fullName} ${this.initials}`, 0, this.element?.nativeElement.offsetHeight - (this.specialFont == "Teddy Bear" ? 20 : (this.specialFont == "MADE Likes Script" ? 11 : 4)));
            return canvas.toDataURL('image/png');
        }
        return "";
    }
    constructor() {
        super();
        this.type = "SignatureElement";
        this.required = false;
        this.description = new StiTextItem();
        this.signaturePanelWidth = 185;
        this.signaturePanelHeight = 100;
        this.insertedImage = new StiImageEditorResult();
        this.insertedText = new StiTextItem();
        this.penColor = Color.black();
        this.fullName = "";
        this.initials = "";
        this.specialFont = "Teddy Bear";
        this.currentSignatureMode = "Type";
        this.canvasHeight = 120;
        this.isSigned = false;
        this.geometry = new StiRectangleGeometry(180, 145);
        this.label = new StiLabelItem(this, StiLocalizationService.get("Components", "StiElectronicSignature"));
        this.description.value = "Signature";
        this.insertedText.font.size = 20;
        this.insertedText.horizontalAlignment = StiHorizontalAlignment.Center;
    }
    saveToJsonObject(options) {
        if (this.element) {
            if (this.element.nativeElement?.offsetWidth > 0 && this.element.nativeElement?.offsetHeight > 0) {
                this.signaturePanelWidth = this.element.nativeElement?.offsetWidth;
                this.signaturePanelHeight = this.element.nativeElement?.offsetHeight;
            }
        }
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Label", this.label.saveToJsonObject(options));
        jObject.addPropertyJObject("Description", this.description.saveToJsonObject(options));
        jObject.addPropertyNumber("SignaturePanelWidth", this.signaturePanelWidth);
        jObject.addPropertyNumber("SignaturePanelHeight", this.signaturePanelHeight);
        jObject.addPropertyColor("PenColor", this.penColor);
        jObject.addPropertyJObject("InsertedImage", this.insertedImage?.saveToJsonObject(options));
        jObject.addPropertyJObject("InsertedText", this.insertedText?.saveToJsonObject(options));
        if (!(options && options["notSerializeImages"])) {
            jObject.addPropertyStringNullOrEmpty("DrawedImage", this.drawedImage?.substring(this.drawedImage.indexOf("base64,") + 7));
        }
        jObject.addPropertyStringNullOrEmpty("FullName", this.fullName);
        jObject.addPropertyStringNullOrEmpty("Initials", this.initials);
        jObject.addPropertyStringNullOrEmpty("SpecialFont", this.specialFont);
        jObject.addPropertyStringNullOrEmpty("CurrentSignatureMode", this.currentSignatureMode);
        if (!(options && options["notSerializeImages"])) {
            jObject.addPropertyStringNullOrEmpty("BackgroundImage", this.backgroundImage?.substring(this.backgroundImage.indexOf("base64,") + 7));
        }
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Label":
                    this.label = new StiLabelItem(this);
                    this.label.loadFromJsonObject(property.value);
                    break;
                case "Description":
                    this.description = new StiTextItem();
                    this.description.loadFromJsonObject(property.value);
                    break;
                case "SignaturePanelWidth":
                    this.signaturePanelWidth = property.value;
                    break;
                case "PenColor":
                    this.penColor = new Color();
                    this.penColor.deserializeFromString(property.value);
                    break;
                case "SignaturePanelHeight":
                    this.signaturePanelHeight = property.value;
                    break;
                case "InsertedImage":
                    this.insertedImage = new StiImageEditorResult();
                    this.insertedImage.loadFromJsonObject(property.value);
                    break;
                case "InsertedText":
                    this.insertedText = new StiTextItem();
                    this.insertedText.loadFromJsonObject(property.value);
                    break;
                case "DrawedImage":
                    this.drawedImage = `data:image/png;base64,${property.value}`;
                    break;
                case "FullName":
                    this.fullName = property.value;
                    break;
                case "Initials":
                    this.initials = property.value;
                    break;
                case "SpecialFont":
                    this.specialFont = property.value;
                    break;
                case "CurrentSignatureMode":
                    this.currentSignatureMode = property.value;
                    break;
                case "BackgroundImage":
                    this.backgroundImage = `data:image/png;base64,${property.value}`;
                    break;
            }
        }
    }
}

class StiSingleSelectionElement extends StiFormElement {
    constructor() {
        super();
        this.type = "Single_SelectionElement";
        this.tooltip = "";
        this.required = false;
        this.description = new StiTextItem();
        this.font = new Font("Segoe UI", 10);
        this._columns = 1;
        this.backgroundColor = Color.white();
        this.textColor = Color.black();
        this.checkColor = Color.black();
        this.borderColor = Color.lightGray();
        this.prefix = "";
        this.suffix = "";
        this.optionsContentEditable = [];
        this.useCustomOption = false;
        this.customOptionText = "";
        this.selectedOption = "";
        this.geometry = new StiRectangleGeometry(150, 80);
        this.label = new StiLabelItem(this, StiLocalizationService.get("Components", "StiSingleSelection"));
        this.options = [];
        this.options.push(StiLocalizationService.get("PropertyMain", "First"));
        this.options.push(StiLocalizationService.get("PropertyMain", "Second"));
        this.options.push(StiLocalizationService.get("PropertyMain", "Third"));
    }
    setDefaultValues() {
        this.selectedOption = "";
    }
    setTabIndex(value) {
        this.tabIndex = value;
        return value + (this.options?.length ?? 0);
    }
    get columns() {
        return this._columns;
    }
    set columns(value) {
        if (value <= 1) {
            this._columns = 1;
        }
        else {
            this._columns = value;
        }
    }
    set options(value) {
        this.nativeOptions = value;
        let this_ = this;
        this._options = new Proxy(value, {
            deleteProperty: function (target, property) {
                setTimeout(() => {
                    this_.updateOptionsContentEditable();
                }, 0);
                return true;
            },
            set: function (target, property, value, receiver) {
                target[property] = value;
                this_.updateOptionsContentEditable();
                return true;
            },
        });
        this.updateOptionsContentEditable();
    }
    getUsedFonts(usedFonts) {
        super.getUsedFonts(usedFonts);
        usedFonts.add(this.font.family, this.arrayOfStylesToString(this.font.style), this.font.size);
        usedFonts.add(this.description.font.family, this.arrayOfStylesToString(this.description.font.style), this.description.font.size);
    }
    updateOptionsContentEditable() {
        this.optionsContentEditable = [];
        this.options.forEach((l, index) => this.optionsContentEditable.push(new StiOptionItem(l, this, index)));
    }
    getDefaultEditableContent() {
        let textItem = new StiInputTextItem("", this.font, this.textColor);
        textItem.element = this;
        return textItem;
    }
    get value() {
        return this.selectedOption;
    }
    get options() {
        return this._options;
    }
    htmlStyle() {
        return `${this.font.htmlStyle()};color:${this.textColor.toHtmlColor()};`;
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Label", this.label.saveToJsonObject(options));
        jObject.addPropertyJObject("Description", this.description.saveToJsonObject(options));
        jObject.addPropertyString("Tooltip", this.tooltip);
        jObject.addPropertyBool("Required", this.required);
        jObject.addPropertyJObject("Font", this.font.saveToJsonObject(options));
        jObject.addPropertyNumber("Columns", this.columns);
        jObject.addPropertyColor("BackgroundColor", this.backgroundColor);
        jObject.addPropertyColor("TextColor", this.textColor);
        jObject.addPropertyColor("CheckColor", this.checkColor);
        jObject.addPropertyColor("BorderColor", this.borderColor);
        jObject.addPropertyArray("Options", this.options);
        jObject.addPropertyBool("UseCustomOption", this.useCustomOption);
        jObject.addPropertyString("CustomOptionText", this.customOptionText);
        jObject.addPropertyString("SelectedOption", this.selectedOption);
        jObject.addPropertyString("Prefix", this.prefix);
        jObject.addPropertyString("Suffix", this.suffix);
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "BackgroundColor":
                    this.backgroundColor = new Color();
                    this.backgroundColor.deserializeFromString(property.value);
                    break;
                case "TextColor":
                    this.textColor = new Color();
                    this.textColor.deserializeFromString(property.value);
                    break;
                case "Label":
                    this.label = new StiLabelItem(this);
                    this.label.loadFromJsonObject(property.value);
                    break;
                case "Font":
                    this.font = new Font();
                    this.font.loadFromJsonObject(property.value);
                    break;
                case "Description":
                    this.description = new StiTextItem();
                    this.description.loadFromJsonObject(property.value);
                    break;
                case "Tooltip":
                    this.tooltip = property.value;
                    break;
                case "Required":
                    this.required = property.value;
                    break;
                case "Columns":
                    this.columns = property.value;
                    break;
                case "BorderColor":
                    this.borderColor = new Color();
                    this.borderColor.deserializeFromString(property.value);
                    break;
                case "CheckColor":
                    this.checkColor = new Color();
                    this.checkColor.deserializeFromString(property.value);
                    break;
                case "CustomOptionText":
                    this.customOptionText = property.value;
                    break;
                case "UseCustomOption":
                    this.useCustomOption = property.value;
                    break;
                case "SelectedOption":
                    this.selectedOption = property.value;
                    break;
                case "Prefix":
                    this.prefix = property.value;
                    break;
                case "Suffix":
                    this.suffix = property.value;
                    break;
                case "Options":
                    this.options = [];
                    property.value.properties().forEach((p) => this.options.push(p.value));
                    break;
            }
        }
    }
}

class StiInnerBorder {
    constructor(pen, drawHorizontal, drawVertical) {
        this.pen = pen;
        this.drawHorizontal = drawHorizontal;
        this.drawVertical = drawVertical;
    }
    saveToJsonObject(options) {
        let json = new StiJson();
        json.addPropertyJObject("Pen", this.pen?.saveToJsonObject(options));
        json.addPropertyBool("DrawHorizontal", this.drawHorizontal);
        json.addPropertyBool("DrawVertical", this.drawVertical);
        return json;
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "Pen":
                    this.pen = new StiPen();
                    this.pen.loadFromJsonObject(property.value);
                    break;
                case "DrawHorizontal":
                    this.drawHorizontal = property.value;
                    break;
                case "DrawVertical":
                    this.drawVertical = property.value;
                    break;
            }
        }
    }
}

class StiCheckBoxCellItem {
    constructor(name, isChecked) {
        this.name = name;
        this.isChecked = isChecked;
    }
    saveToJsonObject(options) {
        let jObject = new StiJson();
        jObject.addPropertyString("Name", this.name);
        jObject.addPropertyBool("IsChecked", this.isChecked);
        return jObject;
    }
    get value() {
        return this.isChecked;
    }
    createCell() {
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "Name":
                    this.name = property.value;
                    break;
                case "IsChecked":
                    this.isChecked = property.value;
                    break;
            }
        }
    }
}

class StiColumnItem extends StiFormObject {
    constructor(label, form) {
        super();
        this.label = label;
        this.form = form;
        this.headerAlignment = StiHorizontalAlignment.Left;
        this.cellAlignment = StiHorizontalAlignment.Left;
        this.headerForeColor = Color.black();
        this.headerBackColor = Color.transparent();
        this.backgroundColor = Color.transparent();
        this.cellBackColor = Color.white();
        this.cellForeColor = Color.black();
        this.cellBorderColor = Color.lightGray();
        this.font = new Font("Segoe UI", 10);
        this.useWordWrap = false;
    }
    setDefaultValues() { }
    copyFrom(parentItem) {
        this.headerAlignment = parentItem.headerAlignment;
        this.cellAlignment = parentItem.cellAlignment;
        this.headerForeColor = parentItem.headerForeColor.clone();
        this.headerBackColor = parentItem.headerBackColor.clone();
        this.backgroundColor = parentItem.backgroundColor.clone();
        this.cellBackColor = parentItem.cellBackColor.clone();
        this.cellForeColor = parentItem.cellForeColor.clone();
        this.cellBorderColor = parentItem.cellBorderColor.clone();
        this.font = parentItem.font.clone();
        this.useWordWrap = parentItem.useWordWrap;
    }
    createCell() {
        return null;
    }
    get eValue() {
        return this.label;
    }
    set eValue(value) {
        this.label = value;
    }
    get eFont() {
        return this.font;
    }
    set eFont(value) {
        this.font = value;
    }
    get eColor() {
        return this.headerForeColor;
    }
    set eColor(value) {
        this.headerForeColor = value;
    }
    get eBackgroundColor() {
        return this.headerBackColor;
    }
    set eBackgroundColor(value) {
        this.headerBackColor = value;
    }
    get eContentAlignment() {
        return this.headerAlignment;
    }
    set eContentAlignment(value) {
        this.headerAlignment = value;
    }
    haveContentAlignment() {
        return true;
    }
    haveVerticalAlignment() {
        return false;
    }
    haveBackgoundColor() {
        return true;
    }
    htmlStyle() {
        return this.eParent
            ? `${this.eFont.htmlStyle()};color:${this.eColor.toHtmlColor()};text-align:${Enum.getName(StiHorizontalAlignment, this.cellAlignment)}`
            : "";
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyString("Label", this.label);
        jObject.addPropertyEnum("HeaderAlignment", StiHorizontalAlignment, this.headerAlignment);
        jObject.addPropertyEnum("CellAlignment", StiHorizontalAlignment, this.cellAlignment);
        jObject.addPropertyColor("HeaderBackColor", this.headerBackColor);
        jObject.addPropertyColor("HeaderForeColor", this.headerForeColor);
        jObject.addPropertyColor("BackgroundColor", this.backgroundColor);
        jObject.addPropertyColor("CellBackColor", this.cellBackColor);
        jObject.addPropertyColor("CellForeColor", this.cellForeColor);
        jObject.addPropertyColor("CellBorderColor", this.cellBorderColor);
        jObject.addPropertyBool("UseWordWrap", this.useWordWrap);
        jObject.addPropertyNumber("Width", this.width);
        jObject.addPropertyJObject("Font", this.font.saveToJsonObject(options));
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Label":
                    this.label = property.value;
                    break;
                case "Width":
                    this.width = property.value;
                    break;
                case "UseWordWrap":
                    this.useWordWrap = property.value;
                    break;
                case "HeaderAlignment":
                    this.headerAlignment = Enum.parse(StiHorizontalAlignment, property.value);
                    break;
                case "CellAlignment":
                    this.cellAlignment = Enum.parse(StiHorizontalAlignment, property.value);
                    break;
                case "HeaderBackColor":
                    this.headerBackColor = new Color();
                    this.headerBackColor.deserializeFromString(property.value);
                    break;
                case "HeaderForeColor":
                    this.headerForeColor = new Color();
                    this.headerForeColor.deserializeFromString(property.value);
                    break;
                case "BackgroundColor":
                    this.backgroundColor = new Color();
                    this.backgroundColor.deserializeFromString(property.value);
                    break;
                case "CellBackColor":
                    this.cellBackColor = new Color();
                    this.cellBackColor.deserializeFromString(property.value);
                    break;
                case "CellForeColor":
                    this.cellForeColor = new Color();
                    this.cellForeColor.deserializeFromString(property.value);
                    break;
                case "CellBorderColor":
                    this.cellBorderColor = new Color();
                    this.cellBorderColor.deserializeFromString(property.value);
                    break;
                case "Font":
                    this.font = new Font();
                    this.font.loadFromJsonObject(property.value);
                    break;
            }
        }
        if (!json.properties().find((property) => property.name == "Font")) {
            this.font = this.eParent.font.clone();
        }
    }
}

class StiCheckBoxColumnItem extends StiColumnItem {
    constructor() {
        super(...arguments);
        this.type = "CheckBoxColumn";
        this.cells = [];
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyArray("Cells", this.cells);
        return jObject;
    }
    setDefaultValues() {
        this.cells.forEach((cell) => {
            cell.isChecked = false;
        });
    }
    get value() {
        let result = [];
        this.cells.forEach((c) => result.push(c.isChecked));
        return result;
    }
    createCell() {
        return new StiCheckBoxCellItem("", false);
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Cells":
                    this.cells = [];
                    for (let cellJson of property.value.value) {
                        let cell = new StiCheckBoxCellItem();
                        cell.loadFromJsonObject(cellJson);
                        this.cells.push(cell);
                    }
                    break;
            }
        }
    }
}

class StiComboBoxCellItem {
    constructor(name, selectedIndex) {
        this.name = name;
        this.selectedIndex = selectedIndex;
    }
    saveToJsonObject(options) {
        let jObject = new StiJson();
        jObject.addPropertyString("Name", this.name);
        jObject.addPropertyNumber("SelectedIndex", this.selectedIndex);
        return jObject;
    }
    get value() {
        return this.selectedIndex ? this.selectedIndex : 0;
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "Name":
                    this.name = property.value;
                    break;
                case "SelectedIndex":
                    this.selectedIndex = property.value;
                    break;
            }
        }
    }
}

class StiComboBoxColumnItem extends StiColumnItem {
    constructor() {
        super(...arguments);
        this.type = "ComboBoxColumn";
        this.cells = [];
        this.comboBoxOptions = [];
    }
    get value() {
        let result = [];
        this.cells.forEach((c) => result.push(c.selectedIndex > 0 && this.comboBoxOptions.length < c.selectedIndex
            ? this.comboBoxOptions[c.selectedIndex]
            : null));
        return result;
    }
    setDefaultValues() {
        this.cells.forEach((cell) => {
            cell.selectedIndex = 0;
        });
    }
    createCell() {
        return new StiComboBoxCellItem("", 0);
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyArray("Cells", this.cells);
        jObject.addPropertyArray("ComboBoxOptions", this.comboBoxOptions);
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Cells":
                    this.cells = [];
                    for (let cellJson of property.value.value) {
                        let cell = new StiComboBoxCellItem();
                        cell.loadFromJsonObject(cellJson);
                        this.cells.push(cell);
                    }
                    break;
                case "ComboBoxOptions":
                    this.comboBoxOptions = [];
                    property.value.properties().forEach((p) => this.comboBoxOptions.push(p.value));
                    break;
            }
        }
    }
}

class StiLabelColumnItem extends StiColumnItem {
    constructor(label, form) {
        super(label, form);
        this.label = label;
        this.form = form;
        this._decimalDigits = 2;
        this.type = "LabelColumn";
        this.expression = "";
        this.prefix = "";
        this.suffix = "";
        this.cells = [];
        this.thousandSeparator = StiThousandSeparator.None;
        if (form) {
            this._decimalDigits = form.settings.decimalDigits;
            this.thousandSeparator = form.settings.thousandSeparator;
        }
    }
    copyFrom(parentItem) {
        super.copyFrom(parentItem);
        if (parentItem instanceof StiLabelColumnItem) {
            let label = parentItem;
            this._decimalDigits = label._decimalDigits;
            this.thousandSeparator = label.thousandSeparator;
            this.prefix = label.prefix;
            this.suffix = label.suffix;
        }
    }
    createCell() {
        return "";
    }
    setDefaultValues() {
        this.cells.forEach((cell) => {
            cell = "";
        });
    }
    get value() {
        let result = [];
        this.cells.forEach((c) => result.push(c));
        return result;
    }
    set value(value) { }
    get decimalDigits() {
        return this.expression?.indexOf("{Line}") >= 0 ? 0 : this._decimalDigits;
    }
    set decimalDigits(value) {
        this._decimalDigits = Math.max(0, Math.min(value, 10));
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyArray("Cells", this.cells);
        jObject.addPropertyString("Expression", this.expression);
        jObject.addPropertyString("Prefix", this.prefix);
        jObject.addPropertyString("Suffix", this.suffix);
        jObject.addPropertyNumber("DecimalDigits", this.decimalDigits);
        jObject.addPropertyEnum("ThousandSeparator", StiThousandSeparator, this.thousandSeparator);
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Expression":
                    this.expression = property.value;
                    break;
                case "Cells":
                    this.cells = [];
                    property.value.properties().forEach((p) => this.cells.push(p.value));
                    break;
                case "ThousandSeparator":
                    this.thousandSeparator = Enum.parse(StiThousandSeparator, property.value);
                    break;
                case "DecimalDigits":
                    this.decimalDigits = property.value;
                    break;
                case "Prefix":
                    this.prefix = property.value;
                    break;
                case "Suffix":
                    this.suffix = property.value;
                    break;
            }
        }
    }
}

class StiNumberBoxCellItem {
    constructor(name, number = 0) {
        this.name = name;
        this.number = number;
    }
    saveToJsonObject(options) {
        let jObject = new StiJson();
        jObject.addPropertyString("Name", this.name);
        jObject.addPropertyNumber("Number", this.number);
        return jObject;
    }
    get value() {
        return this.number ? this.number : 0;
    }
    set value(value) {
        this.number = value;
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "Name":
                    this.name = property.value;
                    break;
                case "Number":
                    this.number = property.value;
                    break;
            }
        }
    }
}

class StiNumberBoxColumnItem extends StiColumnItem {
    constructor(label, form) {
        super(label, form);
        this.label = label;
        this.form = form;
        this._decimalDigits = 2;
        this.type = "NumberBoxColumn";
        this.unitLabel = "";
        this.cells = [];
        this.thousandSeparator = StiThousandSeparator.None;
        this.numberType = StiNumberType.Decimal;
        this.unitAlignment = StiUnitAlignment.Suffix;
        this.currencyLabelFormat = StiDisplayCurrencyAs.Code;
        this.currency = "USD";
        if (form) {
            this._decimalDigits = form.settings.decimalDigits;
            this.thousandSeparator = form.settings.thousandSeparator;
            this.unitAlignment = form.settings.unitAlignment;
            this.currency = form.settings.currency;
            this.currencyLabelFormat = form.settings.currencyFormat;
        }
    }
    copyFrom(parentItem) {
        super.copyFrom(parentItem);
        if (parentItem instanceof StiNumberBoxColumnItem) {
            let numberBox = parentItem;
            this.unitLabel = numberBox.unitLabel;
            this.thousandSeparator = numberBox.thousandSeparator;
            this.numberType = numberBox.numberType;
            this.unitAlignment = numberBox.unitAlignment;
            this.currencyLabelFormat = numberBox.currencyLabelFormat;
            this.currency = numberBox.currency;
        }
    }
    createCell() {
        return new StiNumberBoxCellItem("", 0);
    }
    setDefaultValues() {
        this.cells.forEach((cell) => {
            cell.number = 0;
        });
    }
    get decimalDigits() {
        return this._decimalDigits;
    }
    set decimalDigits(value) {
        if (value <= 0) {
            this._decimalDigits = 0;
        }
        else {
            this._decimalDigits = value;
        }
    }
    get value() {
        let result = [];
        this.cells.forEach((c) => result.push(c.number));
        return result;
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyArray("Cells", this.cells);
        jObject.addPropertyEnum("CurrencyLabelFormat", StiDisplayCurrencyAs, this.currencyLabelFormat);
        jObject.addPropertyString("Currency", this.currency);
        jObject.addPropertyString("UnitLabel", this.unitLabel);
        jObject.addPropertyEnum("UnitAlignment", StiUnitAlignment, this.unitAlignment);
        jObject.addPropertyEnum("NumberType", StiNumberType, this.numberType);
        jObject.addPropertyEnum("ThousandSeparator", StiThousandSeparator, this.thousandSeparator);
        jObject.addPropertyNumber("DecimalDigits", this.decimalDigits);
        return jObject;
    }
    htmlStyle() {
        if (this.eParent) {
            return super.htmlStyle();
        }
        else
            return `${this.eParent ? super.htmlStyle() + ";" : ""}color:${this.cellForeColor?.toHtmlColor()};text-align:${Enum.getName(StiHorizontalAlignment, this.cellAlignment)}`;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Cells":
                    this.cells = [];
                    for (let cellJson of property.value.value) {
                        let cell = new StiNumberBoxCellItem("", 0);
                        cell.loadFromJsonObject(cellJson);
                        this.cells.push(cell);
                    }
                    break;
                case "NumberType":
                    this.numberType = Enum.parse(StiNumberType, property.value);
                    break;
                case "ThousandSeparator":
                    this.thousandSeparator = Enum.parse(StiThousandSeparator, property.value);
                    break;
                case "DecimalDigits":
                    this.decimalDigits = property.value;
                    break;
                case "UnitLabel":
                    this.unitLabel = property.value;
                    break;
                case "UnitAlignment":
                    this.unitAlignment = Enum.parse(StiUnitAlignment, property.value);
                    break;
                case "CurrencyLabelFormat":
                    this.currencyLabelFormat = Enum.parse(StiDisplayCurrencyAs, property.value);
                    break;
                case "Currency":
                    this.currency = property.value;
                    break;
            }
        }
    }
}

class StiRadioButtonCellItem {
    constructor(name, isChecked) {
        this.name = name;
        this.isChecked = isChecked;
    }
    saveToJsonObject(options) {
        let jObject = new StiJson();
        jObject.addPropertyString("Name", this.name);
        jObject.addPropertyBool("IsChecked", this.isChecked);
        return jObject;
    }
    get value() {
        return this.isChecked;
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "Name":
                    this.name = property.value;
                    break;
                case "IsChecked":
                    this.isChecked = property.value;
                    break;
            }
        }
    }
}

class StiRadioButtonColumnItem extends StiColumnItem {
    constructor() {
        super(...arguments);
        this.type = "RadioButtonColumn";
        this.cells = [];
    }
    get value() {
        let result = [];
        this.cells.forEach((c) => result.push(c.isChecked));
        return result;
    }
    setDefaultValues() {
        this.cells.forEach((cell) => {
            cell.isChecked = false;
        });
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyArray("Cells", this.cells);
        jObject.addPropertyString("Name", this.name);
        return jObject;
    }
    createCell() {
        return new StiRadioButtonCellItem("", false);
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Cells":
                    this.cells = [];
                    for (let cellJson of property.value.value) {
                        let cell = new StiRadioButtonCellItem();
                        cell.loadFromJsonObject(cellJson);
                        this.cells.push(cell);
                    }
                    break;
                case "Name":
                    this.name = property.value;
                    break;
            }
        }
    }
}

class StiTextBoxCellItem {
    constructor(name, text) {
        this.name = name;
        this.text = text;
    }
    saveToJsonObject(options) {
        let jObject = new StiJson();
        jObject.addPropertyString("Name", this.name);
        jObject.addPropertyString("Text", this.text);
        return jObject;
    }
    get value() {
        return this.text ? this.text : "";
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "Name":
                    this.name = property.value;
                    break;
                case "Text":
                    this.text = property.value;
                    break;
            }
        }
    }
}

class StiTextBoxColumnItem extends StiColumnItem {
    constructor() {
        super(...arguments);
        this.type = "TextBoxColumn";
        this.cells = [];
    }
    get value() {
        let result = [];
        this.cells.forEach((c) => result.push(c.text));
        return result;
    }
    setDefaultValues() {
        this.cells.forEach((cell) => {
            cell.text = "";
        });
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyArray("Cells", this.cells);
        return jObject;
    }
    createCell() {
        return new StiTextBoxCellItem("", "");
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Cells":
                    this.cells = [];
                    for (let cellJson of property.value.value) {
                        let cell = new StiTextBoxCellItem();
                        cell.loadFromJsonObject(cellJson);
                        this.cells.push(cell);
                    }
                    break;
            }
        }
    }
}

class StiRowLabel {
    get eFont() {
        return this.table.font;
    }
    set eFont(value) {
        this.table.font = value;
    }
    get eColor() {
        return this.table.rowHeadersColor;
    }
    set eColor(value) {
        this.table.rowHeadersColor = value;
    }
    get eBackgroundColor() {
        return this.table.rowHeadersBackground;
    }
    set eBackgroundColor(value) {
        this.table.rowHeadersBackground = value;
    }
    get expression() {
        return this.value;
    }
    haveBackgoundColor() {
        return true;
    }
    get eContentAlignment() {
        return this.table.rowLabelsHorizontalAlignment;
    }
    set eContentAlignment(value) {
        this.table.rowLabelsHorizontalAlignment = value;
    }
    haveContentAlignment() {
        return true;
    }
    haveVerticalAlignment() {
        return false;
    }
    getDefaultEditableContent() {
        return this;
    }
    htmlStyle() {
        return this.table ? `${this.eFont.htmlStyle()};color: inherit` : "";
    }
    set value(value) {
        this._value = value;
        this.table.nativeRowLabels[this.index] = value;
    }
    get value() {
        return this._value;
    }
    set eValue(value) {
        this.value = value;
    }
    get eValue() {
        return this.value;
    }
    constructor(value, table, index) {
        this.table = table;
        this.index = index;
        this._value = value;
    }
}

class StiTotalsFieldItem extends StiFormObject {
    setDefaultValues() {
        this.value = 0;
    }
    get value() {
        return this._value !== undefined ? this._value : this.expression;
    }
    set value(value) {
        this._value = value;
    }
    get decimalDigits() {
        return this._decimalDigits;
    }
    set decimalDigits(value) {
        if (value <= 0) {
            this._decimalDigits = 0;
        }
        else {
            this._decimalDigits = value;
        }
    }
    get eValue() {
        return this.header;
    }
    set eValue(value) {
        this.header = value;
    }
    get eFont() {
        return this.eParent.font;
    }
    set eFont(value) {
        this.eParent.font = value;
    }
    get eColor() {
        return this.headerColor;
    }
    set eColor(value) {
        this.headerColor = value;
    }
    constructor(header, expression, form) {
        super();
        this._decimalDigits = 2;
        this.prefix = "";
        this.suffix = "";
        this.thousandSeparator = StiThousandSeparator.None;
        this.name = "";
        this.headerAlignment = StiHorizontalAlignment.Right;
        this.headerColor = Color.black();
        this.valueAlignment = StiHorizontalAlignment.Right;
        this.header = header;
        this.expression = expression;
        if (form) {
            this.thousandSeparator = form.settings.thousandSeparator;
            this.decimalDigits = form.settings.decimalDigits;
        }
    }
    haveBackgoundColor() {
        return false;
    }
    get eContentAlignment() {
        return this.headerAlignment;
    }
    set eContentAlignment(value) {
        this.headerAlignment = value;
    }
    haveContentAlignment() {
        return true;
    }
    haveVerticalAlignment() {
        return false;
    }
    htmlStyle() {
        return this.eParent ? `${this.eFont.htmlStyle()};color:${this.eColor.toHtmlColor()}` : "";
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyString("Header", this.header);
        jObject.addPropertyString("Name", this.name);
        jObject.addPropertyEnum("HeaderAlignment", StiHorizontalAlignment, this.headerAlignment);
        jObject.addPropertyEnum("ValueAlignment", StiHorizontalAlignment, this.valueAlignment);
        jObject.addPropertyColor("HeaderColor", this.headerColor);
        jObject.addPropertyString("Expression", this.expression);
        jObject.addPropertyString("Prefix", this.prefix);
        jObject.addPropertyString("Suffix", this.suffix);
        jObject.addPropertyNumber("DecimalDigits", this.decimalDigits);
        jObject.addPropertyEnum("ThousandSeparator", StiThousandSeparator, this.thousandSeparator);
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Header":
                    this.header = property.value;
                    break;
                case "HeaderAlignment":
                    this.headerAlignment = Enum.parse(StiHorizontalAlignment, property.value);
                    break;
                case "ValueAlignment":
                    this.valueAlignment = Enum.parse(StiHorizontalAlignment, property.value);
                    break;
                case "HeaderColor":
                    this.headerColor = new Color();
                    this.headerColor.deserializeFromString(property.value);
                    break;
                case "Expression":
                    this.expression = property.value;
                    break;
                case "ThousandSeparator":
                    this.thousandSeparator = Enum.parse(StiThousandSeparator, property.value);
                    break;
                case "DecimalDigits":
                    this.decimalDigits = property.value;
                    break;
                case "Prefix":
                    this.prefix = property.value;
                    break;
                case "Suffix":
                    this.suffix = property.value;
                    break;
                case "Name":
                    this.name = property.value;
                    break;
            }
        }
    }
}

class StiTotalsRowHeaderEditableContent {
    constructor(table) {
        this.table = table;
    }
    get eValue() {
        return this.table.totalsRowHeader;
    }
    set eValue(value) {
        this.table.totalsRowHeader = value;
    }
    get eFont() {
        return this.table.font;
    }
    set eFont(value) {
        this.table.font = value;
    }
    get eColor() {
        return this.table.totalsRowHeaderColor;
    }
    set eColor(value) {
        this.table.totalsRowHeaderColor = value;
    }
    haveBackgoundColor() {
        return false;
    }
    get eContentAlignment() {
        return this.table.totalsRowHeaderHorizontalAlignment;
    }
    set eContentAlignment(value) {
        this.table.totalsRowHeaderHorizontalAlignment = value;
    }
    haveContentAlignment() {
        return true;
    }
    get eVerticalAlignment() {
        return this.table.totalsRowHeaderVerticalAlignment;
    }
    set eVerticalAlignment(value) {
        this.table.totalsRowHeaderVerticalAlignment = value;
    }
    haveVerticalAlignment() {
        return true;
    }
    htmlStyle() {
        return `${this.eFont.htmlStyle()};color:${this.eColor.toHtmlColor()}`;
    }
}

class StiTableElement extends StiFormElement {
    get showRowLabels() {
        return this._showRowLabels;
    }
    set showRowLabels(value) {
        let previousValue = this._showRowLabels;
        if (previousValue != value) {
            this._showRowLabels = value;
            this.fitTable();
        }
    }
    get showHeaderEditor() {
        return this._showHeaderEditor;
    }
    set showHeaderEditor(value) {
        this._showHeaderEditor = value;
        if (value == true) {
            this._showColumnsEditor = false;
            this._showRowsEditor = false;
            this._showTotalsEditor = false;
        }
    }
    set name(value) {
        let oldName = this.name;
        super.name = value;
        this.nameChanged(oldName);
    }
    get name() {
        return super.name;
    }
    get totalsValuesWidth() {
        return this._totalsValuesWidth;
    }
    set totalsValuesWidth(value) {
        if (value > 0) {
            this._totalsValuesWidth = value;
        }
        else {
            this._totalsValuesWidth = 0;
        }
    }
    get totalsHeadersWidth() {
        return this._totalsHeadersWidth;
    }
    set totalsHeadersWidth(value) {
        if (value > 0) {
            this._totalsHeadersWidth = value;
        }
        else {
            this._totalsHeadersWidth = 0;
        }
    }
    get showColumnsEditor() {
        return this._showColumnsEditor;
    }
    set showColumnsEditor(value) {
        this._showColumnsEditor = value;
        if (value == true) {
            this._showHeaderEditor = false;
            this._showRowsEditor = false;
            this._showTotalsEditor = false;
        }
    }
    get showRowsEditor() {
        return this._showRowsEditor;
    }
    set showRowsEditor(value) {
        this._showRowsEditor = value;
        if (value == true) {
            this._showHeaderEditor = false;
            this._showColumnsEditor = false;
            this._showTotalsEditor = false;
        }
    }
    get showTotalsEditor() {
        return this._showTotalsEditor;
    }
    set showTotalsEditor(value) {
        this._showTotalsEditor = value;
        if (value == true) {
            this._showHeaderEditor = false;
            this._showColumnsEditor = false;
            this._showRowsEditor = false;
        }
    }
    getDefaultEditableContent() {
        let textItem = new StiInputTextItem("", this.font);
        textItem.element = this;
        return textItem;
    }
    constructor(form) {
        super();
        this.type = "TableElement";
        this.description = new StiTextItem();
        this.font = new Font("Segoe UI", 10);
        this.border = new StiBorder(StiPen.dimGraySolid(), true, true, true, true);
        this.gridLines = new StiInnerBorder(StiPen.dimGraySolid(), true, true);
        this.backgroundColor = Color.transparent();
        this.alternateRowColors = false;
        this.evenRowsStyle = Color.fromArgb(0xff, 0xf9, 0xf9, 0xf9);
        this.evenRowsTextColor = Color.black();
        this.oddRowsStyle = Color.fromArgb(0xff, 0xf3, 0xf3, 0xf3);
        this.oddRowsTextColor = Color.black();
        this.tableHeaderText = "";
        this.tableHeaderAlignment = StiHorizontalAlignment.Left;
        this.tableHeaderColor = Color.black();
        this.tableHeaderHeight = 0;
        this.tableHeaderBackgroundColor = Color.transparent();
        this.rowLabelsWidth = 100;
        this._showRowLabels = false;
        this.dynamicRows = false;
        this.useWordWrap = false;
        this.rowLabelsContentEditable = [];
        this.rowLabelsHorizontalAlignment = StiHorizontalAlignment.Left;
        this.rowHeadersBackground = Color.transparent();
        this.rowHeadersColor = Color.black();
        this.rowHeadersBorder = new StiBorder(StiPen.dimGraySolid(), true, true, true, true);
        this.columnHeadersBorder = new StiBorder(StiPen.dimGraySolid(), true, true, true, true);
        this._columns = [];
        this.useTotals = true;
        this.totalsRowHeader = StiLocalizationService.get("PropertyMain", "Totals");
        this.totalsRowHeaderHorizontalAlignment = StiHorizontalAlignment.Left;
        this.totalsRowHeaderVerticalAlignment = StiVerticalAlignment.Top;
        this.totalsRowHeaderColor = Color.black();
        this._totalsValuesWidth = 100;
        this._totalsHeadersWidth = 100;
        this.totalsFields = [];
        this.showBorderEditor = false;
        this.showGridLinesEditor = false;
        this._showHeaderEditor = true;
        this._showColumnsEditor = false;
        this._showRowsEditor = false;
        this._showTotalsEditor = false;
        this.stopFit = false;
        this.showColumnsBorderEditor = true;
        this.showRowsBorderEditor = false;
        this.minColumnWidth = 40;
        this.totalsRowHeaderEditableContent = new StiTotalsRowHeaderEditableContent(this);
        this.form = form;
        this.geometry = new StiRectangleGeometry(320, 245);
        this.label = new StiLabelItem(this, StiLocalizationService.get("Components", "StiTable"));
        this.columns = [];
        this.rowLabels = ["", "", ""];
        this.columns.push(this.createColumn("textbox"));
        /*this.columns.push(new StiComboBoxColumnItem(StiLocalizationService.get("PropertyMain", "Second")));
        this.columns.push(new StiRadioButtonColumnItem(StiLocalizationService.get("PropertyMain", "Third")));
        this.columns.push(new StiTextBoxColumnItem(StiLocalizationService.get("PropertyMain", "Fourth")));
        this.columns.push(new StiNumberBoxColumnItem(StiLocalizationService.get("PropertyMain", "Fifth")));
        this.columns.push(new StiLabelColumnItem(StiLocalizationService.get("PropertyMain", "Labels")));
        this.rowLabels = [];
        this.rowLabels.push(StiLocalizationService.get("PropertyMain", "First"));
        this.rowLabels.push(StiLocalizationService.get("PropertyMain", "Second"));
        this.rowLabels.push(StiLocalizationService.get("PropertyMain", "Third"));
        this.totalsFields.push(new StiTotalsFieldItem(StiLocalizationService.get("PropertyMain", "First"), "{Cell(5,1)}", this.form));
        this.totalsFields.push(
          new StiTotalsFieldItem(StiLocalizationService.get("PropertyMain", "Maximum"), "{Max(Col(5))}", this.form)
        );
        this.totalsFields.push(
          new StiTotalsFieldItem(StiLocalizationService.get("PropertyMain", "Summary"), "{Sum(Col(5))}", this.form)
        );
        this.totalsFields.push(
          new StiTotalsFieldItem(StiLocalizationService.get("PropertyMain", "Count"), "{Count(Col(5))}", this.form)
        );
        this.columns.forEach((column) => {
          if (column.type == "CheckBoxColumn" && column instanceof StiCheckBoxColumnItem) {
            this.rowLabels.forEach((row) => {
              column.cells.push(new StiCheckBoxCellItem("", false));
            });
          } else if (column.type == "ComboBoxColumn" && column instanceof StiComboBoxColumnItem) {
            column.comboBoxOptions.push("yes");
            column.comboBoxOptions.push("no");
            this.rowLabels.forEach((row) => {
              column.cells.push(new StiComboBoxCellItem("", 0));
            });
          } else if (column.type == "RadioButtonColumn" && column instanceof StiRadioButtonColumnItem) {
            this.rowLabels.forEach((row) => {
              column.cells.push(new StiRadioButtonCellItem("", false));
            });
          } else if (column.type == "TextBoxColumn" && column instanceof StiTextBoxColumnItem) {
            this.rowLabels.forEach((row) => {
              column.cells.push(new StiTextBoxCellItem("", ""));
            });
          } else if (column.type == "NumberBoxColumn" && column instanceof StiNumberBoxColumnItem) {
            this.rowLabels.forEach((row) => {
              column.cells.push(new StiNumberBoxCellItem("", 0));
            });
          } else if (column.type == "LabelColumn" && column instanceof StiLabelColumnItem) {
            this.rowLabels.forEach((row) => {
              column.cells.push("");
            });
          }
        });*/
    }
    createColumn(type, label, parentItem) {
        type = type.toLocaleLowerCase();
        label = label ?? "";
        let columnItem;
        if (type.startsWith("checkbox")) {
            columnItem = new StiCheckBoxColumnItem(label, this.form);
        }
        else if (type.startsWith("combobox")) {
            columnItem = new StiComboBoxColumnItem(label, this.form);
        }
        else if (type.startsWith("numberbox")) {
            columnItem = new StiNumberBoxColumnItem(label, this.form);
        }
        else if (type.startsWith("radiobutton")) {
            columnItem = new StiRadioButtonColumnItem(label, this.form);
        }
        else if (type.startsWith("textbox")) {
            columnItem = new StiTextBoxColumnItem(label, this.form);
        }
        else if (type.startsWith("label")) {
            columnItem = new StiLabelColumnItem(label, this.form);
        }
        if (parentItem) {
            columnItem.copyFrom(parentItem);
        }
        return columnItem;
    }
    setTabIndex(value) {
        this.tabIndex = value;
        return value + (this.columns?.length * this._rowLabels?.length ?? 0);
    }
    get maxTableWidth() {
        return (this.width -
            this.padding.left -
            this.padding.right -
            (this.label.alignment != StiLabelAlignment.Top && this.label.value.length > 0 ? this.label.width : 0));
    }
    set rowLabels(value) {
        this.nativeRowLabels = value;
        let this_ = this;
        this._rowLabels = new Proxy(value, {
            deleteProperty: function (target, property) {
                setTimeout(() => {
                    this_.updateRowLabelsContentEditable();
                }, 0);
                return true;
            },
            set: function (target, property, value, receiver) {
                target[property] = value;
                this_.updateRowLabelsContentEditable();
                return true;
            },
        });
        this.updateRowLabelsContentEditable();
    }
    get rowLabels() {
        return this._rowLabels;
    }
    setDefaultValues() {
        this.columns.forEach((column) => {
            column.setDefaultValues();
        });
        this.totalsFields.forEach((total) => {
            total.setDefaultValues();
        });
    }
    set columns(value) {
        let this_ = this;
        this._columns = new Proxy(value, {
            deleteProperty: function (target, property) {
                setTimeout(() => {
                    this_.fitTable();
                }, 0);
                return true;
            },
            set: function (target, property, value, receiver) {
                target[property] = value;
                let column = value;
                if (column instanceof StiColumnItem && !column.width) {
                    column.width = this_.maxTableWidth / (this_.columns.length + (this_.showRowLabels ? 1 : 0));
                }
                if (value.cells && value.cells.length < this_.rowLabels.length) {
                    for (let i = value.cells.length; i < this_.rowLabels.length; i++)
                        value.cells.push(column.createCell());
                }
                if (!target.stopFit) {
                    this_.fitTable();
                }
                return true;
            },
        });
        this_.fitTable();
    }
    fitTable() {
        if (this.stopFit) {
            return;
        }
        let currentWidth = this.showRowLabels ? this.rowLabelsWidth : 0;
        this.columns.forEach((c) => (currentWidth += c.width));
        let pc = this.maxTableWidth / currentWidth;
        if (currentWidth != 0 && currentWidth && pc) {
            if (this.showRowLabels) {
                this.rowLabelsWidth *= pc;
            }
            this.columns.forEach((c) => (c.width *= pc));
        }
        pc = this.maxTableWidth / (this.totalsHeadersWidth + this.totalsValuesWidth);
        if (pc < 1) {
            this.totalsHeadersWidth *= pc;
            this.totalsValuesWidth *= pc;
        }
    }
    deleteLastRow() {
        this.rowLabels.splice(this.rowLabels.length - 1, 1);
    }
    deleteLastColumn() {
        this.columns.splice(this.columns.length - 1, 1);
    }
    addColumnLikeLast() {
        let newColumnWidth = (this.maxTableWidth - this.rowLabelsWidth) / (this.columns.length + 1);
        let maxChangeableWidth = 0;
        if (this.columns.length > 0) {
            this.columns.forEach((column) => {
                if (column.width > this.minColumnWidth) {
                    maxChangeableWidth += column.width - this.minColumnWidth;
                }
            });
        }
        else {
            maxChangeableWidth = this.maxTableWidth - this.rowLabelsWidth;
        }
        if (newColumnWidth <= maxChangeableWidth) {
            if (this.columns.length > 0) {
                let lastColumn = this.columns[this.columns.length - 1];
                this.columns.push(this.createColumn(lastColumn.type, "", lastColumn));
            }
            else {
                this.columns.push(new StiNumberBoxColumnItem("", this.form));
            }
        }
    }
    addRow() {
        this.rowLabels.push("");
        this.columns.forEach((column) => column.cells.push(column.createCell()));
    }
    setProperty(propName, value, oldValue) {
        super.setProperty(propName, value, oldValue);
        if (propName == "thousandSeparator") {
            this.columns.forEach((column) => {
                if ((column instanceof StiNumberBoxColumnItem || column instanceof StiLabelColumnItem) &&
                    (oldValue === null || column.thousandSeparator == oldValue)) {
                    column.thousandSeparator = value;
                }
            });
            this.totalsFields.forEach((field) => {
                if (oldValue === null || oldValue == field.thousandSeparator) {
                    field.thousandSeparator = value;
                }
            });
        }
        else if (propName == "decimalDigits") {
            this.columns.forEach((column) => {
                if ((column instanceof StiNumberBoxColumnItem || column instanceof StiLabelColumnItem) &&
                    (oldValue === null || column.decimalDigits == oldValue)) {
                    column.decimalDigits = value;
                }
            });
            this.totalsFields.forEach((field) => {
                if (oldValue === null || oldValue == field.decimalDigits) {
                    field.decimalDigits = value;
                }
            });
        }
    }
    getUsedFonts(usedFonts) {
        super.getUsedFonts(usedFonts);
        usedFonts.add(this.font.family, this.arrayOfStylesToString(this.font.style), this.font.size);
        usedFonts.add(this.description.font.family, this.arrayOfStylesToString(this.description.font.style), this.description.font.size);
    }
    propertyChanged(propName) {
        this.fitTable();
    }
    get columns() {
        return this._columns;
    }
    get eValue() {
        return this.tableHeaderText;
    }
    set eValue(value) {
        this.tableHeaderText = value;
    }
    get eFont() {
        return this.font;
    }
    set eFont(value) {
        this.font = value;
    }
    get eColor() {
        return this.tableHeaderColor;
    }
    set eColor(value) {
        this.tableHeaderColor = value;
    }
    get eBackgroundColor() {
        return this.tableHeaderBackgroundColor;
    }
    set eBackgroundColor(value) {
        this.tableHeaderBackgroundColor = value;
    }
    haveBackgoundColor() {
        return true;
    }
    get eContentAlignment() {
        return this.tableHeaderAlignment;
    }
    set eContentAlignment(value) {
        this.tableHeaderAlignment = value;
    }
    haveContentAlignment() {
        return true;
    }
    haveVerticalAlignment() {
        return false;
    }
    htmlStyle() {
        return `${this.eFont.htmlStyle()};color:${this.eColor.toHtmlColor()};`;
    }
    updateRowLabelsContentEditable() {
        this.rowLabelsContentEditable = [];
        this.rowLabels.forEach((l, index) => this.rowLabelsContentEditable.push(new StiRowLabel(l, this, index)));
    }
    set width(value) {
        let needToFit = this.geometry.width != value;
        this.geometry.width = value;
        if (needToFit) {
            this.fitTable();
        }
    }
    get width() {
        return this.geometry.width;
    }
    nameChanged(oldName) {
        this.columns.filter(c => c instanceof StiLabelColumnItem).forEach((column) => {
            column.expression = column.expression ? column.expression.replace(new RegExp(oldName, "g"), this.name) : column.expression;
        });
        this.totalsFields.forEach((total) => {
            total.expression = total.expression ? total.expression.replace(new RegExp(oldName, "g"), this.name) : total.expression;
        });
    }
    saveToJsonObject(options) {
        this.tableHeaderHeight = this.element?.nativeElement?.offsetHeight ?? this.tableHeaderHeight;
        this.columns?.forEach((column) => {
            if (column["cells"] && column["cells"].length != this.rowLabels.length) {
                column["cells"].splice(this.rowLabels.length, column["cells"].length);
            }
        });
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Label", this.label.saveToJsonObject(options));
        jObject.addPropertyJObject("Description", this.description.saveToJsonObject(options));
        jObject.addPropertyJObject("Font", this.font.saveToJsonObject(options));
        jObject.addPropertyJObject("Border", this.border.saveToJsonObject(options));
        jObject.addPropertyJObject("GridLines", this.gridLines.saveToJsonObject(options));
        jObject.addPropertyColor("BackgroundColor", this.backgroundColor);
        jObject.addPropertyBool("AlternateRowColors", this.alternateRowColors);
        jObject.addPropertyColor("EvenRowsStyle", this.evenRowsStyle);
        jObject.addPropertyColor("EvenRowsTextColor", this.evenRowsTextColor);
        jObject.addPropertyColor("OddRowsStyle", this.oddRowsStyle);
        jObject.addPropertyColor("OddRowsTextColor", this.oddRowsTextColor);
        jObject.addPropertyNumber("TableHeaderHeight", this.tableHeaderHeight);
        jObject.addPropertyString("TableHeaderText", this.tableHeaderText);
        jObject.addPropertyEnum("TableHeaderAlignment", StiHorizontalAlignment, this.tableHeaderAlignment);
        jObject.addPropertyColor("TableHeaderColor", this.tableHeaderColor);
        jObject.addPropertyColor("TableHeaderBackgroundColor", this.tableHeaderBackgroundColor);
        jObject.addPropertyBool("ShowRowLabels", this.showRowLabels);
        jObject.addPropertyArray("RowLabels", this.rowLabels);
        jObject.addPropertyEnum("RowLabelsHorizontalAlignment", StiHorizontalAlignment, this.rowLabelsHorizontalAlignment);
        jObject.addPropertyColor("RowHeadersBackground", this.rowHeadersBackground);
        jObject.addPropertyColor("RowHeadersColor", this.rowHeadersColor);
        jObject.addPropertyJObject("RowHeadersBorder", this.rowHeadersBorder.saveToJsonObject(options));
        jObject.addPropertyJObject("ColumnHeadersBorder", this.columnHeadersBorder.saveToJsonObject(options));
        jObject.addPropertyArray("Columns", this.columns);
        jObject.addPropertyBool("UseTotals", this.useTotals);
        // jObject.addPropertyBool("DynamicRows", this.dynamicRows);
        jObject.addPropertyBool("UseWordWrap", this.useWordWrap);
        jObject.addPropertyString("TotalsRowHeader", this.totalsRowHeader);
        jObject.addPropertyNumber("RowLabelsWidth", this.rowLabelsWidth);
        jObject.addPropertyEnum("TotalsRowHeaderHorizontalAlignment", StiHorizontalAlignment, this.totalsRowHeaderHorizontalAlignment);
        jObject.addPropertyEnum("TotalsRowHeaderVerticalAlignment", StiVerticalAlignment, this.totalsRowHeaderVerticalAlignment);
        jObject.addPropertyColor("TotalsRowHeaderColor", this.totalsRowHeaderColor);
        jObject.addPropertyNumber("TotalsValuesWidth", this.totalsValuesWidth);
        jObject.addPropertyNumber("TotalsHeadersWidth", this.totalsHeadersWidth);
        jObject.addPropertyArray("TotalsFields", this.totalsFields);
        return jObject;
    }
    loadFromJsonObject(json) {
        this.stopFit = true;
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Label":
                    this.label = new StiLabelItem(this);
                    this.label.loadFromJsonObject(property.value);
                    break;
                case "Description":
                    this.description = new StiTextItem();
                    this.description.loadFromJsonObject(property.value);
                    break;
                case "Font":
                    this.font = new Font();
                    this.font.loadFromJsonObject(property.value);
                    break;
                case "Border":
                    this.border = new StiBorder();
                    this.border.loadFromJsonObject(property.value);
                    break;
                case "GridLines":
                    this.gridLines = new StiInnerBorder();
                    this.gridLines.loadFromJsonObject(property.value);
                    break;
                case "BackgroundColor":
                    this.backgroundColor = new Color();
                    this.backgroundColor.deserializeFromString(property.value);
                    break;
                case "AlternateRowColors":
                    this.alternateRowColors = property.value;
                    break;
                case "EvenRowsStyle":
                    this.evenRowsStyle = new Color();
                    this.evenRowsStyle.deserializeFromString(property.value);
                    break;
                case "EvenRowsTextColor":
                    this.evenRowsTextColor = new Color();
                    this.evenRowsTextColor.deserializeFromString(property.value);
                    break;
                case "OddRowsStyle":
                    this.oddRowsStyle = new Color();
                    this.oddRowsStyle.deserializeFromString(property.value);
                    break;
                case "OddRowsTextColor":
                    this.oddRowsTextColor = new Color();
                    this.oddRowsTextColor.deserializeFromString(property.value);
                    break;
                case "TableHeaderText":
                    this.tableHeaderText = property.value;
                    break;
                case "TableHeaderAlignment":
                    this.tableHeaderAlignment = Enum.parse(StiHorizontalAlignment, property.value);
                    break;
                case "TableHeaderColor":
                    this.tableHeaderColor = new Color();
                    this.tableHeaderColor.deserializeFromString(property.value);
                    break;
                case "TableHeaderBackgroundColor":
                    this.tableHeaderBackgroundColor = new Color();
                    this.tableHeaderBackgroundColor.deserializeFromString(property.value);
                    break;
                case "ShowRowLabels":
                    this.showRowLabels = property.value;
                    break;
                /* case "DynamicRows":
                  this.dynamicRows = property.value;
                  break; */
                case "RowLabels":
                    this.rowLabels = [];
                    property.value.properties().forEach((p) => this.rowLabels.push(p.value));
                    break;
                case "RowLabelsHorizontalAlignment":
                    this.rowLabelsHorizontalAlignment = Enum.parse(StiHorizontalAlignment, property.value);
                    break;
                case "RowLabelsWidth":
                    this.rowLabelsWidth = property.value;
                    break;
                case "RowHeadersBackground":
                    this.rowHeadersBackground = new Color();
                    this.rowHeadersBackground.deserializeFromString(property.value);
                    break;
                case "RowHeadersColor":
                    this.rowHeadersColor = new Color();
                    this.rowHeadersColor.deserializeFromString(property.value);
                    break;
                case "RowHeadersBorder":
                    this.rowHeadersBorder = new StiBorder();
                    this.rowHeadersBorder.loadFromJsonObject(property.value);
                    break;
                case "ColumnHeadersBorder":
                    this.columnHeadersBorder = new StiBorder();
                    this.columnHeadersBorder.loadFromJsonObject(property.value);
                    break;
                case "Columns":
                case "ColumnCollection":
                    this.columns = [];
                    for (let colJson of property.value.value) {
                        let type = colJson.properties().find((p) => p.name == "Type").value;
                        let column = this.createColumn(type);
                        column.eParent = this;
                        column.loadFromJsonObject(colJson);
                        this.columns.push(column);
                    }
                    break;
                case "UseTotals":
                    this.useTotals = property.value;
                    break;
                case "UseWordWrap":
                    this.useWordWrap = property.value;
                    break;
                case "TotalsRowHeader":
                    this.totalsRowHeader = property.value;
                    break;
                case "TotalsRowHeaderHorizontalAlignment":
                    this.totalsRowHeaderHorizontalAlignment = Enum.parse(StiHorizontalAlignment, property.value);
                    break;
                case "TotalsRowHeaderVerticalAlignment":
                    this.totalsRowHeaderVerticalAlignment = Enum.parse(StiVerticalAlignment, property.value);
                    break;
                case "TotalsRowHeaderColor":
                    this.totalsRowHeaderColor = new Color();
                    this.totalsRowHeaderColor.deserializeFromString(property.value);
                    break;
                case "TotalsValuesWidth":
                    this.totalsValuesWidth = property.value;
                    break;
                case "TotalsHeadersWidth":
                    this.totalsHeadersWidth = property.value;
                    break;
                case "TotalsFields":
                    this.totalsFields = [];
                    for (let totalJson of property.value.value) {
                        let total = new StiTotalsFieldItem("", "", this.form);
                        total.loadFromJsonObject(totalJson);
                        this.totalsFields.push(total);
                    }
                    break;
            }
        }
        this.stopFit = false;
        this.fitTable();
    }
}

class StiTextBoxElement extends StiFormElement {
    constructor() {
        super();
        this._linesCount = 1;
        this._maximum = 255;
        this.type = "Text_BoxElement";
        this.tooltip = "";
        this.required = false;
        this.description = new StiTextItem();
        this.font = new Font("Segoe UI", 10);
        this.text = "";
        this.backgroundColor = Color.white();
        this.textColor = Color.black();
        this.borderColor = Color.lightGray();
        this.contentAlignment = StiHorizontalAlignment.Left;
        this.isMultiline = false;
        this.password = "";
        this.isPassword = false;
        this.useRange = false;
        this.minimum = 0;
        this.rangeFormat = StiTextRangeFormat.Characters;
        this.borderWeight = StiLineWeight.Thin;
        this.mask = "";
        this.geometry = new StiRectangleGeometry(150, 40);
        this.label = new StiLabelItem(this, StiLocalizationService.get("Dialogs", "StiTextBoxControl"));
    }
    setDefaultValues() {
        this.value = "";
    }
    setTabIndex(value) {
        this.tabIndex = value++;
        return value;
    }
    getDefaultEditableContent() {
        let textItem = new StiInputTextItem(this.text, this.font, this.textColor, this.backgroundColor, this.contentAlignment);
        textItem.element = this;
        return textItem;
    }
    get maximum() {
        return this._maximum;
    }
    set maximum(value) {
        this._maximum = Math.max(1, value);
    }
    get linesCount() {
        return this._linesCount;
    }
    set linesCount(value) {
        if (value <= 1) {
            this._linesCount = 1;
        }
        else if (value >= 10) {
            this._linesCount = 10;
        }
        else {
            this._linesCount = value;
        }
    }
    get value() {
        return this.text;
    }
    set value(value) {
        this.text = value;
    }
    get eValue() {
        return this.value;
    }
    set eValue(value) {
        this.value = value;
    }
    get eFont() {
        return this.font;
    }
    set eFont(value) {
        this.font = value;
    }
    get eColor() {
        return this.textColor;
    }
    set eColor(value) {
        this.textColor = value;
    }
    get eBackgroundColor() {
        return this.backgroundColor;
    }
    set eBackgroundColor(value) {
        this.backgroundColor = value;
    }
    get eContentAlignment() {
        return this.contentAlignment;
    }
    set eContentAlignment(value) {
        this.contentAlignment = value;
    }
    haveContentAlignment() {
        return true;
    }
    haveVerticalAlignment() {
        return false;
    }
    getUsedFonts(usedFonts) {
        super.getUsedFonts(usedFonts);
        usedFonts.add(this.font.family, this.arrayOfStylesToString(this.font.style), this.font.size);
        usedFonts.add(this.description.font.family, this.arrayOfStylesToString(this.description.font.style), this.description.font.size);
    }
    haveBackgoundColor() {
        return true;
    }
    htmlStyle() {
        return `${this.font.htmlStyle()};color:${this.eColor.toHtmlColor()};text-align:${Enum.getName(StiHorizontalAlignment, this.contentAlignment)}`;
    }
    saveToJsonObject(options) {
        if (this.element?.nativeElement) {
            this.heightForExport = this.element.nativeElement.offsetHeight;
        }
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Label", this.label.saveToJsonObject(options));
        jObject.addPropertyJObject("Description", this.description.saveToJsonObject(options));
        jObject.addPropertyJObject("Font", this.font.saveToJsonObject(options));
        jObject.addPropertyString("Text", this.text);
        jObject.addPropertyString("Mask", this.mask);
        jObject.addPropertyColor("BackgroundColor", this.backgroundColor);
        jObject.addPropertyColor("TextColor", this.textColor);
        jObject.addPropertyEnum("ContentAlignment", StiHorizontalAlignment, this.contentAlignment);
        jObject.addPropertyString("Tooltip", this.tooltip);
        jObject.addPropertyBool("Required", this.required);
        jObject.addPropertyBool("IsPassword", this.isPassword);
        jObject.addPropertyBool("IsMultiline", this.isMultiline);
        jObject.addPropertyNumber("LinesCount", this.linesCount);
        jObject.addPropertyBool("UseRange", this.useRange);
        jObject.addPropertyNumber("Minimum", this.minimum);
        jObject.addPropertyNumber("Maximum", this.maximum);
        jObject.addPropertyEnum("RangeFormat", StiTextRangeFormat, this.rangeFormat);
        jObject.addPropertyColor("BorderColor", this.borderColor);
        jObject.addPropertyEnum("BorderWeight", StiLineWeight, this.borderWeight);
        if (this.element?.nativeElement) {
            jObject.addPropertyNumber("HeightForExport", this.heightForExport);
        }
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "ContentAlignment":
                    this.contentAlignment = Enum.parse(StiHorizontalAlignment, property.value);
                    break;
                case "BackgroundColor":
                    this.backgroundColor = new Color();
                    this.backgroundColor.deserializeFromString(property.value);
                    break;
                case "TextColor":
                    this.textColor = new Color();
                    this.textColor.deserializeFromString(property.value);
                    break;
                case "Text":
                    this.text = property.value;
                    break;
                case "Mask":
                    this.mask = property.value;
                    break;
                case "Label":
                    this.label = new StiLabelItem(this);
                    this.label.loadFromJsonObject(property.value);
                    break;
                case "Font":
                    this.font = new Font();
                    this.font.loadFromJsonObject(property.value);
                    break;
                case "Description":
                    this.description = new StiTextItem();
                    this.description.loadFromJsonObject(property.value);
                    break;
                case "Tooltip":
                    this.tooltip = property.value;
                    break;
                case "Required":
                    this.required = property.value;
                    break;
                case "IsPassword":
                    this.isPassword = property.value;
                    break;
                case "IsMultiline":
                    this.isMultiline = property.value;
                    break;
                case "LinesCount":
                    this.linesCount = property.value;
                    break;
                case "UseRange":
                    this.useRange = property.value;
                    break;
                case "Minimum":
                    this.minimum = property.value;
                    break;
                case "Maximum":
                    this.maximum = property.value;
                    break;
                case "RangeFormat":
                    this.rangeFormat = Enum.parse(StiTextRangeFormat, property.value);
                    break;
                case "BorderColor":
                    this.borderColor = new Color();
                    this.borderColor.deserializeFromString(property.value);
                    break;
                case "BorderWeight":
                    this.borderWeight = Enum.parse(StiLineWeight, property.value);
                    break;
            }
        }
    }
}

class StiTextElement extends StiFormElement {
    constructor() {
        super();
        this.type = "TextElement";
        this.htmlTextString = "";
        this.textColor = Color.black();
        this.textHorizontalAlignment = StiTextHorAlignment.Left;
        this.border = new StiBorder(StiPen.dimGraySolid(), false, false, false, false);
        this.showBorderEditor = true;
        this.geometry = new StiRectangleGeometry(100, 35);
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyString("HtmlTextString", this.htmlTextString);
        jObject.addPropertyEnum("TextHorizontalAlignment", StiTextHorAlignment, this.textHorizontalAlignment);
        jObject.addPropertyJObject("Border", this.border.saveToJsonObject(options));
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "HtmlTextString":
                    this.htmlTextString = property.value;
                    break;
                case "TextHorizontalAlignment":
                    this.textHorizontalAlignment = Enum.parse(StiTextHorAlignment, property.value);
                    break;
                case "Border":
                    this.border = new StiBorder();
                    this.border.loadFromJsonObject(property.value);
                    break;
            }
        }
        this.isAdded = true;
    }
    htmlStyle() {
        return `color:${this.textColor.toHtmlColor()};text-align:${Enum.getName(StiHorizontalAlignment, this.textHorizontalAlignment)}`;
    }
}

class StiPanelElement extends StiFormElement {
    constructor(form) {
        super();
        this.type = "PanelElement";
        this.description = new StiTextItem();
        this.Width = 0; //TODO
        this.Height = 0; //TODO
        this.backgroundColor = Color.transparent();
        this.border = new StiBorder(StiPen.dimGraySolid(), true, true, true, true);
        this.showBorderEditor = true;
        this.elements = new Array();
        this.form = form;
        this.geometry = new StiRectangleGeometry(150, 120);
        this.label = new StiLabelItem(this, "");
        this.padding = new StiPadding(0, 0, 0, 0, this);
        this.label.alignment = StiLabelAlignment.Top;
        this.geometry.minWidth = 150;
        this.geometry.minHeight = 90;
    }
    canUpdateProperty(propName) {
        return !(propName.indexOf("padding") >= 0 || propName == "label.alignment");
    }
    get contentAreaWidth() {
        if (this.label.alignment != StiLabelAlignment.Top) {
            return this.width - (this.label.value.length > 0 ? this.label.width : 0) - this.padding.right - this.padding.left;
        }
        else {
            return this.width - this.padding.right - this.padding.left;
        }
    }
    get contentAreaHeight() {
        if (this.label.alignment != StiLabelAlignment.Top) {
            return this.height - this.padding.top - this.padding.bottom;
        }
        else {
            if (this.element?.nativeElement) {
                if (this.element.nativeElement.offsetHeight > 0) {
                    return this.element.nativeElement.offsetHeight + this.padding.bottom;
                }
            }
            else {
                return this.height - this.padding.top - this.padding.bottom - 35;
            }
        }
    }
    getColumnWidth(columnsCount) {
        return Number((this.contentAreaWidth / columnsCount).toFixed(2));
    }
    getUsedFonts(usedFonts) {
        super.getUsedFonts(usedFonts);
        usedFonts.add(this.description.font.family, this.arrayOfStylesToString(this.description.font.style), this.description.font.size);
    }
    get allElements() {
        let elements = [];
        this.getAllElements(elements);
        return elements;
    }
    getAllElements(elements) {
        this.elements.forEach((element) => {
            if (element instanceof StiPanelElement) {
                element.getAllElements(elements);
            }
            elements.push(element);
        });
    }
    saveToJsonObject(options) {
        if (this.element?.nativeElement) {
            if (this.label.alignment != StiLabelAlignment.Top) {
                this.Width = this.width - (this.label.value.length > 0 ? this.label.width + this.padding.left : 0);
                this.Height = this.height;
            }
            else {
                this.Width = this.width;
                if (this.element.nativeElement.offsetHeight > 0) {
                    this.Height = this.element.nativeElement.offsetHeight + this.padding.bottom;
                }
            }
        }
        let jObject = super.saveToJsonObject(options);
        jObject.addPropertyJObject("Label", this.label.saveToJsonObject(options));
        jObject.addPropertyJObject("Description", this.description.saveToJsonObject(options));
        jObject.addPropertyNumber("Width", this.Width);
        jObject.addPropertyNumber("Height", this.Height);
        jObject.addPropertyColor("BackgroundColor", this.backgroundColor);
        jObject.addPropertyArray("Elements", this.elements);
        jObject.addPropertyJObject("Border", this.border.saveToJsonObject(options));
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Label":
                    this.label = new StiLabelItem(this);
                    this.label.loadFromJsonObject(property.value);
                    break;
                case "Description":
                    this.description = new StiTextItem();
                    this.description.loadFromJsonObject(property.value);
                    break;
                case "Width":
                    this.Width = property.value;
                    break;
                case "Height":
                    this.Height = property.value;
                    break;
                case "BackgroundColor":
                    this.backgroundColor = new Color();
                    this.backgroundColor.deserializeFromString(property.value);
                    break;
                case "Elements":
                    this.elements = this.deserializeCollection(property.value);
                    break;
                case "Border":
                    this.border = new StiBorder();
                    this.border.loadFromJsonObject(property.value);
                    break;
            }
        }
    }
    createElementClass(type) {
        type = type.toLowerCase();
        if (type == "textelement" || type == "textelement") {
            return new StiTextElement();
        }
        else if (type == "text_boxelement" || type == "textboxelement") {
            return new StiTextBoxElement();
        }
        else if (type == "tableelement" || type == "tableelement") {
            return new StiTableElement(this.form);
        }
        else if (type == "single_selectionelement" || type == "singleselectionelement") {
            return new StiSingleSelectionElement();
        }
        else if (type == "signatureelement" || type == "signatureelement") {
            return new StiSignatureElement();
        }
        else if (type == "pdfsignatureelement" || type == "pdfsignatureelement") {
            return new StiPDFSignatureElement();
        }
        else if (type == "panelelement" || type == "panelelement") {
            return new StiPanelElement(this.form);
        }
        else if (type == "number_boxelement" || type == "numberboxelement") {
            return new StiNumberBoxElement();
        }
        else if (type == "multiple_selectionelement" || type == "multipleselectionelement") {
            return new StiMultipleSelectionElement();
        }
        else if (type == "list_boxelement" || type == "listboxelement") {
            return new StiListBoxElement();
        }
        else if (type == "lineelement" || type == "lineelement") {
            return new StiLineElement();
        }
        else if (type == "labelelement" || type == "labelelement") {
            return new StiLabelElement();
        }
        else if (type == "imageelement" || type == "imageelement") {
            return new StiImageElement();
        }
        else if (type == "datetime_boxelement" || type == "datetimeboxelement") {
            return new StiDateTimeBoxElement(this.form);
        }
        else if (type == "combo_boxelement" || type == "comboboxelement") {
            return new StiComboBoxElement();
        }
        else if (type == "check_boxelement" || type == "checkboxelement") {
            return new StiCheckBoxElement();
        }
        else if (type == "buttonelement" || type == "buttonelement") {
            return new StiButtonElement();
        }
        else if (type == "barcodeelement" || type == "barcodeelement") {
            return new StiBarcodeElement();
        }
        else if (type == "addresselement" || type == "addresselement") {
            return new StiAddressElement();
        }
    }
}

class StiFormPageElement extends StiFormObject {
    static { this.PAGE_ELEMENTS = [
        StiBarcodeElement,
        StiButtonElement,
        StiCheckBoxElement,
        StiComboBoxElement,
        StiDateTimeBoxElement,
        StiImageElement,
        StiLabelElement,
        StiLineElement,
        StiListBoxElement,
        StiMultipleSelectionElement,
        StiSignatureElement,
        StiPDFSignatureElement,
        StiSingleSelectionElement,
        StiTableElement,
        StiTextBoxElement,
        StiTextElement,
        StiNumberBoxElement,
        StiPanelElement,
        StiAddressElement,
    ]; }
    get width() {
        return this.paperKind.width;
    }
    get height() {
        return this.paperKind.height;
    }
    set width(value) {
        this.paperKind.width = Number(value);
    }
    set height(value) {
        this.paperKind.height = Number(value);
    }
    get contentAreaWidth() {
        let padding = this.padding;
        return this.width - padding.left - padding.right;
    }
    get contentAreaHeight() {
        let padding = this.padding;
        return this.height - padding.top - padding.bottom;
    }
    get name() {
        return this._name;
    }
    set name(value) {
        let oldValue = this._name;
        if (oldValue != value) {
            this._name = value;
        }
    }
    get allElements() {
        let elements = [];
        this.elements.forEach((element) => {
            if (element instanceof StiPanelElement) {
                element.getAllElements(elements);
            }
            elements.push(element);
        });
        return elements;
    }
    getColumnWidth(columnsCount) {
        return Number((this.contentAreaWidth / columnsCount).toFixed(2));
    }
    saveToJsonObject(options) {
        let jObject = super.saveToJsonObject(options);
        jObject.removeProperty(StiFormObject.TYPE_PROPERTY_NAME);
        jObject.addPropertyJObject("Margins", this.padding.saveToJsonObject(options));
        jObject.addPropertyJObject("PaperKind", this.paperKind.saveToJsonObject(options));
        jObject.addPropertyColor("BackgroundColor", this.backgroundColor);
        jObject.addPropertyBool("Visible", this.visible);
        if (!(options && options["notSerializeImages"])) {
            jObject.addPropertyString("BackgroundImage", this.backgroundImage?.substring(this.backgroundImage.indexOf(",") + 1));
        }
        jObject.addPropertyArray("Elements", this.elements);
        jObject.addPropertyStringNullOrEmpty("Name", this.name);
        return jObject;
    }
    loadFromJsonObject(json) {
        super.loadFromJsonObject(json);
        for (let property of json.properties()) {
            switch (property.name) {
                case "Visible":
                    this.visible = property.value;
                    break;
                case "Margins":
                    this.padding.loadFromJsonObject(property.value);
                    break;
                case "PaperKind":
                    this.paperKind.loadFromJsonObject(property.value);
                    break;
                case "BackgroundColor":
                    this.backgroundColor.deserializeFromString(property.value);
                    this.backgroundColor.a = 255;
                    break;
                case "BackgroundImage":
                    if (property.value) {
                        this.backgroundImage = "data:image/png;base64," + property.value;
                    }
                    break;
                case "Elements":
                    this.elements = this.deserializeCollection(property.value);
                    break;
                case "Name":
                    this.name = property.value;
                    break;
            }
        }
    }
    constructor(form) {
        super();
        this.type = "StiPageElement";
        this.elements = new Array();
        this.visible = true;
        this.padding = new StiPadding(39, 39, 39, 39);
        this.paperKind = StiPagePaperKind.fromStandardPaperKind(PaperKind.A4);
        this.backgroundColor = Color.white();
        this.form = form;
    }
    createElementClass(type) {
        type = type.toLowerCase();
        if (type == "textelement" || type == "textelement") {
            return new StiTextElement();
        }
        else if (type == "text_boxelement" || type == "textboxelement") {
            return new StiTextBoxElement();
        }
        else if (type == "tableelement" || type == "tableelement") {
            return new StiTableElement(this.form);
        }
        else if (type == "single_selectionelement" || type == "singleselectionelement") {
            return new StiSingleSelectionElement();
        }
        else if (type == "signatureelement" || type == "signatureelement") {
            return new StiSignatureElement();
        }
        else if (type == "pdfsignatureelement" || type == "pdfsignatureelement") {
            return new StiPDFSignatureElement();
        }
        else if (type == "panelelement" || type == "panelelement") {
            return new StiPanelElement(this.form);
        }
        else if (type == "number_boxelement" || type == "numberboxelement") {
            return new StiNumberBoxElement();
        }
        else if (type == "multiple_selectionelement" || type == "multipleselectionelement") {
            return new StiMultipleSelectionElement();
        }
        else if (type == "list_boxelement" || type == "listboxelement") {
            return new StiListBoxElement();
        }
        else if (type == "lineelement" || type == "lineelement") {
            return new StiLineElement();
        }
        else if (type == "labelelement" || type == "labelelement") {
            return new StiLabelElement();
        }
        else if (type == "imageelement" || type == "imageelement") {
            return new StiImageElement();
        }
        else if (type == "datetime_boxelement" || type == "datetimeboxelement") {
            return new StiDateTimeBoxElement(this.form);
        }
        else if (type == "combo_boxelement" || type == "comboboxelement") {
            return new StiComboBoxElement();
        }
        else if (type == "check_boxelement" || type == "checkboxelement") {
            return new StiCheckBoxElement();
        }
        else if (type == "buttonelement" || type == "buttonelement") {
            return new StiButtonElement();
        }
        else if (type == "barcodeelement" || type == "barcodeelement") {
            return new StiBarcodeElement();
        }
        else if (type == "addresselement" || type == "addresselement") {
            return new StiAddressElement();
        }
    }
}

class StiAdditionalField {
    constructor() { }
    saveToJsonObject(options) {
        let json = new StiJson();
        json.addPropertyString("Key", this.key);
        json.addPropertyString("Value", this.value);
        return json;
    }
    loadFromJsonObject(json) {
        for (let property of json.properties()) {
            switch (property.name) {
                case "Key":
                    this.key = property.value;
                    break;
                case "Value":
                    this.value = property.value;
                    break;
            }
        }
    }
}

class StiModelService {
    static { this.PAGE_CLASS = "sti-page"; }
    static { this.PANEL_CLASS = "sti-panel"; }
    static { this.THEMES = ["Light", "Dark"]; }
    toggleTieredMenu(element) {
        let elementRect = this.getPositionRelativeToForm(element);
        let menuWidth = 104;
        let menuHeight = 165;
        this.tieredMenuY =
            window.innerHeight - elementRect.bottom >= menuHeight ? elementRect.bottom : elementRect.top - menuHeight;
        this.tieredMenuX =
            window.innerWidth - elementRect.left > menuWidth ? elementRect.left : elementRect.right - menuWidth;
        this.showTieredMenu = true;
    }
    get showTrialBar() {
        return this._showTrialBar;
    }
    set showTrialBar(value) {
        let lastState = this._showTrialBar;
        if (value != lastState) {
            this._showTrialBar = value;
        }
    }
    get showTrialModalWindow() {
        return this._showTrialModalWindow;
    }
    set showTrialModalWindow(value) {
        let lastState = this._showTrialModalWindow;
        if (value != lastState) {
            this._showTrialModalWindow = value;
        }
    }
    get showTrialTitle() {
        return this._showTrialTitle;
    }
    set showTrialTitle(value) {
        let lastState = this._showTrialTitle;
        if (value != lastState) {
            this._showTrialTitle = value;
        }
    }
    get canCloseTrialWindow() {
        return this._canCloseTrialWindow;
    }
    set canCloseTrialWindow(value) {
        let lastState = this._canCloseTrialWindow;
        if (value != lastState) {
            this._canCloseTrialWindow = value;
        }
    }
    set ribbon(value) {
        if ((value == "Insert" && !this.showInsertTab) || (this.viewerMode && value != "Preview"))
            return;
        if (value != this._ribbon) {
            let oldRibbon = this._ribbon;
            this._ribbon = value;
            this.interfaceEvent.next({ name: "setRibbon", data: { ribbon: value, oldRibbon: oldRibbon } });
        }
    }
    get ribbon() {
        return this._ribbon;
    }
    get previewMode() {
        return this._ribbon == "Preview";
    }
    get pdfPreviewMode() {
        return this._ribbon == "PDFPreview";
    }
    get fileMenuMode() {
        return this._ribbon == "File";
    }
    canDelete() {
        return (window.getSelection().toString().length == 0 &&
            document.activeElement.tagName.toLocaleLowerCase() == "body" &&
            !this.draggingElement &&
            !this.showSignatureEditor);
    }
    get showSaveToPdfButton() {
        return this.settings?.showSaveToPdfButton ?? true;
    }
    get showEditButton() {
        return this.settings?.showEditButton ?? false;
    }
    set embeddedMode(value) {
        this._embeddedMode = value;
    }
    get embeddedMode() {
        return this._embeddedMode || this.properties?.embeddedMode === true;
    }
    get cursor() {
        return this._cursor;
    }
    get zoom() {
        return this._zoom;
    }
    set requestUrl(value) {
        this._requestUrl = value;
        this.isWebView = value == "WebView";
    }
    get requestUrl() {
        return this._requestUrl;
    }
    set zoom(value) {
        if (value <= 0.1) {
            this._zoom = 0.1;
        }
        else if (value >= 4) {
            this._zoom = 4;
        }
        else {
            this._zoom = value;
        }
    }
    set cursor(value) {
        if (value == "default" && this.selectedComponent?.hover) {
            this._cursor = "move";
        }
        else {
            this._cursor = value;
        }
    }
    formattingDate(dateFormat) {
        let result = dateFormat
            .replace(/M/g, "k")
            .replace(/m/g, "r")
            .replace(/tt/g, "a")
            .replace(/k/g, "m")
            .replace(/r/g, "M");
        return result;
    }
    setZoomFromString(zoomString) {
        if (typeof zoomString != "string") {
            return;
        }
        if (zoomString.includes("%")) {
            let zoom = Number(zoomString.slice(0, zoomString.indexOf("%"))) / 100;
            if (zoom <= 0.1) {
                this.zoom = 0.1;
            }
            else if (zoom >= 4) {
                this.zoom = 4;
            }
            else {
                this.zoom = zoom;
            }
        }
        else {
            switch (zoomString.toLowerCase()) {
                case "pagewidth":
                    this.formEvents.next({ name: "SetZoomByPageWidth" });
                    break;
                case "onepage":
                    this.formEvents.next({ name: "SetZoomByOnePage" });
                    break;
                default:
                    this.formEvents.next({ name: "SetDefaultZoom" });
                    break;
            }
        }
    }
    getPositionRelativeToForm(element) {
        let elementRect = element?.getBoundingClientRect();
        let formRect = this.rootFormElement?.getBoundingClientRect();
        if (formRect) {
            return new DOMRect(elementRect?.x - formRect?.x, elementRect?.y - formRect?.y, elementRect?.width, elementRect?.height);
        }
        else {
            return elementRect;
        }
    }
    getBooleanSetting(settingName) {
        return this.settings && this.isNotEmpty(this.settings[settingName]) && this.isBoolean(this.settings[settingName])
            ? this.settings[settingName]
            : true;
    }
    isBoolean(value) {
        return typeof value === "boolean";
    }
    isNotEmpty(value) {
        return value?.toString()?.length > 0;
    }
    saveLastFormState() {
        this.form.reportVersion = this.buildVersion;
        this.form.reportChanged = StiStaticHelperService.dateToJsonDate(new Date());
        this.lastSavedFormState = this.form.saveToReportJsonObject().serialize();
    }
    toCamelCase(obj) {
        if (Array.isArray(obj)) {
            return obj.map((v) => this.toCamelCase(v));
        }
        else if (obj != null && obj.constructor === Object) {
            return Object.keys(obj).reduce((result, key) => ({
                ...result,
                [camelCase(key)]: this.toCamelCase(obj[key]),
            }), {});
        }
        return obj;
    }
    showColumnPreview(index, type) {
        if (!type &&
            this.selectedComponent?.element instanceof StiTableElement &&
            !this.selectedComponent?.element.showColumnsEditor) {
            this.selectedComponent.element.showColumnsEditor = true;
            this.needToRefresh.next(true);
        }
        else if (type == "totals" &&
            this.selectedComponent?.element instanceof StiTableElement &&
            !this.selectedComponent?.element.showTotalsEditor) {
            this.selectedComponent.element.showTotalsEditor = true;
            this.needToRefresh.next(true);
        }
        setTimeout(() => {
            if (this.currentContentEditableItemIndex != index || this.previousSelectedComponent != this.selectedComponent)
                this.currentContentEditableItem.next(index);
            this.currentContentEditableItemIndex = index;
        });
    }
    showError(message, sendedFromButton = false, buttonElement) {
        if (message instanceof ArrayBuffer) {
            var enc = new TextDecoder("utf-8");
            message = enc.decode(message);
        }
        else if (message instanceof Event) {
            message = message.type;
        }
        else if (message?.text) {
            message = message.text;
        }
        if (buttonElement) {
            this.currentUsedButtonElement = buttonElement;
        }
        this.sendedFromButton = sendedFromButton;
        this.errorWindowMessage = message;
        if (this.errorWindowMessage != "abort") {
            this.showErrorWindow = true;
        }
    }
    getImage(fileName) {
        return this.imagesArray && this.imagesArray[fileName] ? this.imagesArray[fileName] : "";
    }
    removeUnusedCells(element) {
        element.columns.forEach((column) => {
            if (column["cells"].length != element.rowLabels.length) {
                column["cells"].splice(element.rowLabels.length, column["cells"].length - 1);
            }
        });
    }
    startPdfExport(form) {
        if (form) {
            this.setFormFromString(JSON.stringify(form));
        }
        this.startPdfExportEvent.next(true);
    }
    setFormFromString(str, loadSavedSetings = false) {
        let form = new StiForm();
        form.loadFormJsonString(str);
        if (loadSavedSetings) {
            this.loadSavedSettings();
        }
        this.form = form;
    }
    get form() {
        return this._form;
    }
    set form(form) {
        this.updateForm(form);
        this.checkOnUniqueNames();
        form.formEvents.next({ name: "SetForm" });
        this.firstFormState = this.form.saveToReportJsonObject().serialize();
        if (this.viewerMode && this.isMobile()) {
            setTimeout(() => {
                this.isMobileViewer.next(true);
            });
        }
    }
    arrayOfStylesToString(array) {
        if (!array)
            return;
        let styles = [];
        if (array.length > 0) {
            array.forEach((item) => {
                if (item != "Underline") {
                    styles.push(item);
                }
            });
        }
        return styles.length > 0 ? styles.join(" ").toLocaleLowerCase() : "";
    }
    checkOnUniqueNames() {
        this.form.allElements.forEach((element) => {
            let currentName = element.name;
            let uniqueElements = this.form.allElements.filter((elem) => elem.name == currentName);
            if (uniqueElements.length > 1) {
                this.setUniqueName(element);
            }
        });
    }
    setUniqueName(element) {
        let regex = /\d+$/;
        let currentName = element.name ?? element.type.replace("_", "").replace("Element", "");
        let index = 0;
        let currentPosition = element.name?.match(regex) ? element.name?.match(regex)[0] : null;
        if (currentPosition) {
            currentName = currentName.slice(0, currentName.length - currentPosition.length);
        }
        while (this.form.allElements.find((element) => element.name == `${currentName + (index != 0 ? index + 1 : "")}`)) {
            index++;
        }
        element.name = currentName + (index != 0 ? index + 1 : "");
    }
    checkNumberRange(element) {
        if (element.rangeFormat == StiNumberRangeFormat.Digits) {
            let maximumValueString = "";
            for (let index = element.maximum; index > 0; index--) {
                maximumValueString += "9";
            }
            let maximumValue = Number(maximumValueString);
            let minimumValue = -Number(maximumValueString);
            if (element.value > maximumValue) {
                element.value = maximumValue;
            }
            else if (element.value < minimumValue) {
                element.value = minimumValue;
            }
        }
        else {
            if (element.value > element.maximum) {
                element.value = Number(element.maximum);
            }
            else if (element.value < element.minimum) {
                element.value = Number(element.minimum);
            }
        }
    }
    showTrialLog() {
        if (this.showTrialBar || this.showTrialTitle || this.showTrialModalWindow) {
            console.warn("You are using a trial version of the Stimulsoft PDF Forms!");
        }
    }
    loadSavedSettings() {
        if (localStorage.getItem("StiFormSettings") &&
            (this.isWebView || this.isCloudMode || this.properties?.cloudPlanIdent)) {
            this.form?.settings?.loadFormJsonString(localStorage.getItem("StiFormSettings"));
        }
    }
    saveSettings() {
        localStorage.removeItem("StiFormSettings");
        localStorage.setItem("StiFormSettings", this.form.settings.saveToJsonObject({}).serialize());
    }
    isMobile() {
        const toMatch = [/Android/i, /webOS/i, /iPhone/i, /iPad/i, /iPod/i, /BlackBerry/i, /Windows Phone/i];
        return toMatch.some((toMatchItem) => {
            return navigator.userAgent.match(toMatchItem);
        });
    }
    getBrowserType() {
        let userAgent = navigator.userAgent;
        let browserName;
        if (userAgent.match(/chrome|chromium|crios/i)) {
            browserName = "chrome";
        }
        else if (userAgent.match(/firefox|fxios/i)) {
            browserName = "firefox";
        }
        else if (userAgent.match(/safari/i)) {
            browserName = "safari";
        }
        else if (userAgent.match(/opr\//i)) {
            browserName = "opera";
        }
        else if (userAgent.match(/edg/i)) {
            browserName = "edge";
        }
        else {
            browserName = "No browser detection";
        }
        return browserName;
    }
    getScaleWithTranslate() {
        return `translate(${this.zoom <= 1 ? 0 : ((this.zoom - 1) / 2) * 100}%) scale(${this.zoom})`;
    }
    getScale() {
        return `scale(${this.zoom})`;
    }
    updateForm(form) {
        this._form = form;
        this.selectedComponent = null;
        this.lastUsedPage = null;
        form.formEvents.subscribe((e) => this.formEvents.next(e));
        if (form.pages?.length > 0) {
            this.previousPadding = form.pages[0].padding.clone();
            this.previousContentAreaWidth = form.pages[0].contentAreaWidth;
            setTimeout(() => {
                this.needToRefresh.next(true);
            }, 0);
        }
        form.formEvents.next({ name: "UpdateForm" });
    }
    set elementToUpdate(value) {
        let oldValue = this._elementToUpdate;
        this._elementToUpdate = value;
        if (oldValue != value) {
            this.formEvents.next({ name: "ElementToUpdateChanged", value: value });
        }
    }
    get elementToUpdate() {
        return this._elementToUpdate;
    }
    get selectedComponent() {
        return this._selectedComponent;
    }
    set selectedComponent(value) {
        let oldValue = this._selectedComponent;
        this._selectedPage = null;
        this._selectedComponent = value;
        this.needToRefresh.next(true);
        if (oldValue != value) {
            this.formEvents.next({ name: "SelectedComponentChanged", value: value });
        }
    }
    get selectedPage() {
        return this._selectedPage;
    }
    set selectedPage(value) {
        let oldValue = this._selectedPage;
        this._selectedComponent = null;
        this._selectedPage = value;
        this.needToRefresh.next(true);
        if (oldValue != value) {
            this.formEvents.next({ name: "SelectedPageChanged", value: value });
        }
    }
    get lastUsedPage() {
        return this._lastUsedPage ?? this.selectedPage ?? this.form?.pages[0];
    }
    set lastUsedPage(value) {
        this._lastUsedPage = value;
    }
    getSelectedComponentPage() {
        return this.getElementPage(this._selectedComponent?.element);
    }
    getElementPage(element) {
        return this.form?.pages.find((p) => p.elements.find((e) => e == element) != null);
    }
    getElementPageForScroll(element) {
        return this.form?.pages.find((p) => p.elements.find((e) => e == element) != null
            ? p.elements.find((e) => e == element)
            : this.getElementPanel(element));
    }
    overToolbar(x, y) {
        let elementsDiv = document.elementsFromPoint(x, y).find((elem) => elem?.classList.contains("elements"));
        return elementsDiv ? true : false;
    }
    getElementPanel(element) {
        let result;
        this.form.pages.forEach((page) => {
            page.allElements.forEach((panel) => {
                if (panel instanceof StiPanelElement && panel.elements.indexOf(element) >= 0) {
                    result = panel;
                }
            });
        });
        return result;
    }
    formatNumber(value, format, decimalDigits, unitAlignment, unit) {
        let formatedValue = this.formatNumberWithThousandSeparator(value, format, decimalDigits);
        switch (unitAlignment) {
            case StiUnitAlignment.PrefixInside:
                return `${unit}${formatedValue}`;
            case StiUnitAlignment.PrefixInsideSpace:
                return `${unit} ${formatedValue}`;
            case StiUnitAlignment.SuffixInside:
                return `${formatedValue}${unit}`;
            case StiUnitAlignment.SuffixInsideSpace:
                return `${formatedValue} ${unit}`;
        }
        return formatedValue;
    }
    getFormattedValue(element, inValue) {
        let value = inValue;
        try {
            if (typeof value === "number" && !isNaN(value)) {
                value = this.formatNumberWithThousandSeparator(parseFloat(value.toFixed(element.decimalDigits)), element.thousandSeparator, element.decimalDigits);
            }
        }
        catch {
            value = "";
        }
        return value;
    }
    formatNumberWithThousandSeparator(value, format, decimalDigits) {
        let isNegative = false;
        if (value == undefined) {
            return "";
        }
        let result;
        if (decimalDigits > 0) {
            result = value.toFixed(decimalDigits);
        }
        else {
            result = value.toString();
        }
        if (result.indexOf("-") != -1) {
            isNegative = true;
        }
        if (isNegative) {
            result = result.slice(1, result.length);
        }
        if (format == StiThousandSeparator.None) {
            return (isNegative ? "-" : "") + result;
        }
        else if (format == StiThousandSeparator.NoneComma) {
            return (isNegative ? "-" : "") + result.replace(".", ",");
        }
        else if (format == StiThousandSeparator.Comma) {
            var chars = (decimalDigits > 0 ? result.slice(0, indexOf(result, ".")) : result).split("").reverse();
            var withCommas = [];
            for (var i = 1; i <= chars.length; i++) {
                withCommas.push(chars[i - 1]);
                if (i % 3 == 0 && i != chars.length) {
                    withCommas.push(",");
                }
            }
            result =
                decimalDigits > 0
                    ? withCommas.reverse().join("") + result.slice(indexOf(result, "."), result.length)
                    : withCommas.reverse().join("");
            return (isNegative ? "-" : "") + result;
        }
        else if (format == StiThousandSeparator.Dot) {
            var chars = (decimalDigits > 0 ? result.slice(0, indexOf(result, ".")) : result).split("").reverse();
            var withDotts = [];
            for (var i = 1; i <= chars.length; i++) {
                withDotts.push(chars[i - 1]);
                if (i % 3 == 0 && i != chars.length) {
                    withDotts.push(".");
                }
            }
            result =
                decimalDigits > 0
                    ? withDotts.reverse().join("") + "," + result.slice(indexOf(result, ".") + 1, result.length)
                    : withDotts.reverse().join("");
            return (isNegative ? "-" : "") + result;
        }
        else if (format == StiThousandSeparator.Apostrophe) {
            var chars = (decimalDigits > 0 ? result.slice(0, indexOf(result, ".")) : result).split("").reverse();
            var withSpaces = [];
            for (var i = 1; i <= chars.length; i++) {
                withSpaces.push(chars[i - 1]);
                if (i % 3 == 0 && i != chars.length) {
                    withSpaces.push("`");
                }
            }
            result =
                decimalDigits > 0
                    ? withSpaces.reverse().join("") + "." + result.slice(indexOf(result, ".") + 1, result.length)
                    : withSpaces.reverse().join("");
            return (isNegative ? "-" : "") + result;
        }
    }
    getWindowScaling() {
        return window.devicePixelRatio * 100;
    }
    getScaling() {
        if (this.getWindowScaling() < 125) {
            return "";
        }
        else if (125 <= this.getWindowScaling() && this.getWindowScaling() < 150) {
            return "_x1_25";
        }
        else if (150 <= this.getWindowScaling() && this.getWindowScaling() < 175) {
            return "_x1_5";
        }
        else if (175 <= this.getWindowScaling() && this.getWindowScaling() < 200) {
            return "_x1_75";
        }
        else if (200 <= this.getWindowScaling() && this.getWindowScaling() < 300) {
            return "_x2";
        }
        else if (300 <= this.getWindowScaling() && this.getWindowScaling() < 400) {
            return "_x3";
        }
        else if (this.getWindowScaling() > 400) {
            return "_x4";
        }
    }
    getPageFromPoint(x, y) {
        let pageDiv;
        for (let elem of document.elementsFromPoint(x, y)) {
            if (elem?.classList.contains(StiModelService.PAGE_CLASS)) {
                pageDiv = elem;
                break;
            }
        }
        if (pageDiv) {
            for (let page of this.form.pages) {
                if (page.element?.nativeElement == pageDiv) {
                    pageDiv = page;
                    break;
                }
            }
        }
        // let pageDiv = document.elementsFromPoint(x, y).find((elem) => elem?.classList.contains(StiModelService.PAGE_CLASS));
        return pageDiv ? pageDiv : null;
    }
    getPanelFromPoint(x, y, excludeId) {
        let page = this.getPageFromPoint(x, y);
        let panelDivs = document
            .elementsFromPoint(x, y)
            .filter((elem) => elem?.classList.contains(StiModelService.PANEL_CLASS) && elem.id != excludeId);
        return panelDivs && page
            ? page.allElements.find((e) => panelDivs.find((p) => e.guid == p.id))
            : null;
    }
    getMouseOverPagePosition(event) {
        let page = this.getPageFromPoint(event.clientX, event.clientY);
        if (page) {
            let rect = this.getPositionRelativeToForm(page.element.nativeElement);
            return {
                x: event.clientX - (rect.left + page.padding.left * this.zoom),
                y: event.clientY - (rect.top + page.padding.top * this.zoom),
            };
        }
        return null;
    }
    getMouseOverPanelPosition(event, excludeId) {
        let panel = this.getPanelFromPoint(event.clientX, event.clientY, excludeId);
        if (panel) {
            let rect = this.getPositionRelativeToForm(panel.element.nativeElement);
            return { x: event.clientX - rect.left, y: event.clientY - rect.top };
        }
        return null;
    }
    loadAttachedFile() {
        let input = document.createElement("input");
        input.type = "file";
        let this_ = this;
        input.onchange = (_) => {
            let file = Array.from(input.files)[0];
            var reader = new FileReader();
            reader.readAsDataURL(file);
            reader.onload = function () {
                this_.form.attachedFiles.push(reader.result);
                this_.interfaceEvent.next({ name: "FileAttached", data: reader.result });
            };
        };
        input.click();
    }
    downloadFiles(data, file_name) {
        let file = new Blob([data]);
        let a = document.createElement("a"), url = URL.createObjectURL(file);
        a.href = url;
        a.download = file_name;
        document.body.appendChild(a);
        a.click();
        setTimeout(function () {
            document.body.removeChild(a);
            window.URL.revokeObjectURL(url);
        }, 0);
    }
    constructor() {
        this._showTrialBar = false;
        this._showTrialModalWindow = false;
        this._showTrialTitle = false;
        this._canCloseTrialWindow = true;
        this._zoom = 1;
        this._cursor = "default";
        this._ribbon = "Home";
        this.interfaceEvent = new Subject();
        this.isMobileViewer = new Subject();
        this.needToRefresh = new Subject();
        this.needToUpdateHelper = new Subject();
        this.startPdfExportEvent = new Subject();
        this.needToRefreshInnerProperties = new Subject();
        this.currentContentEditableItem = new Subject();
        this.retryButtonRequest = new Subject();
        this.fontFamilies = [];
        this.assemblyInfo = [];
        this.formTreeInnerItemsStates = [];
        this.userName = "";
        this.currentPropertyGridMode = "Properties";
        this.showFormElementsList = false;
        this.sortFormElementsList = false;
        this.showComponentsTab = true;
        this.showInsertTab = true;
        this.hideActiveDropdown = new Subject();
        this.showSignatureEditor = false;
        this.showDraggableModalWindow = false;
        this.showFormTreeWarningWindow = false;
        this.hideActiveAutocompleteList = new Subject();
        this.formTreeWarningMessage = "";
        this.needToSelectedComponent = new Subject();
        this.showButtonMessageWindow = false;
        this.showTieredMenu = false;
        this.showTrialTimerWindow = false;
        this.isInitialized = false;
        this.showContextMenu = false;
        this.showHelpWindow = false;
        this.showSaveDialog = false;
        this.showErrorWindow = false;
        this.basePlanIsTrial = false;
        this.viewerMode = false;
        this.isCloudMode = false;
        this.disableCloseButton = false;
        this.showCornerRadius = true;
        this.showAboutWindow = false;
        this.showGroupPreview = false;
        this.showToolboxSetup = false;
        this.showModalWindow = false;
        this.showProgressAfterUpdatePage = false;
        this.canDrag = true;
        this.tieredMenuX = 0;
        this.tieredMenuY = 0;
        this.currentExpressionInfo = 0; //0-none,1-label column,2-totals,3-label component.
        this.buildVersion = "";
        this.buildDate = "";
        this.errorWindowMessage = "";
        this.propertyGridWidth = 395;
        this.currentTablePropertyHeader = new Subject();
        this.currentTableHeader = "Main";
        this.formEvents = new Subject();
        this.saveDialogFromNew = false;
        this.saveDialogFromOpen = false;
        this.sendedFromButton = false;
        this.loadingFromCloud = false;
        this.showColorDialog = false;
        this.showMoreColorDialog = false;
        this.userIsAuthorized = false;
        this.userWasChecked = false;
        this.showSaveDialogFromCloud = false;
        this.hasEmptyReuiredFields = false;
        this.showExpressionEditor = false;
        this.showProgress = false;
        this.isWebView = false;
        this.currentSelectedFileOption = "Open";
        this._embeddedMode = false;
        this.embeddedEvent = function (data) { };
        this.fileName = "Form.mrt";
        this.enteredUrls = [];
        let savedData = {};
        this.interfaceEvent.subscribe(e => {
            switch (e.name) {
                case "setRibbon":
                    if (!this.viewerMode) {
                        if (e.data.ribbon == "Preview") {
                            savedData = { form: this.form, selectedGuid: this.selectedComponent?.element.guid ?? this.selectedPage?.guid };
                            let form = new StiForm();
                            form.loadFormJsonString(this.form.saveToJsonObject().serialize());
                            this._form = form;
                            this.formEvents.next({ name: "ValueChanged" });
                        }
                        else if (e.data.oldRibbon == "Preview") {
                            let form = new StiForm();
                            form.loadFormJsonString(savedData["form"].saveToJsonObject().serialize());
                            let selectedElement = form.getElementByGuid(savedData["selectedGuid"]);
                            if (selectedElement) {
                                if (!(selectedElement instanceof StiFormPageElement)) {
                                    selectedElement.needToSelectComponent = true;
                                }
                                else {
                                    this.selectedPage = selectedElement;
                                }
                            }
                            this._form = form;
                            this.formEvents.next({ name: "ValueChanged" });
                        }
                    }
                    break;
            }
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiModelService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiModelService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiModelService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [] });

class StiNameService {
    constructor(model) {
        this.model = model;
    }
    getElementName(component, prefix) {
        return StiNameService.getElementName2(component, this.model.form, prefix);
    }
    checkElementName(element) {
        let prefix = element.name;
        while (prefix && prefix.length > 0 && !isNaN(parseFloat(prefix[prefix.length - 1]))) {
            prefix = prefix.substring(0, prefix.length - 1);
        }
        return this.getElementName(element, prefix);
    }
    static getElementName2(component, form, prefix) {
        let index = prefix ? "" : 1;
        prefix = prefix && prefix.length > 0 ? prefix : component instanceof StiFormPageElement ? "Page" : component.type.replace("_", "").replace("Element", "");
        while (form.getElementByName(prefix + index) != null) {
            index = index == "" ? 2 : index + 1;
        }
        return prefix + index;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiNameService, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiNameService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiNameService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }] });

class StiForm {
    get guid() {
        return this._guid;
    }
    get settings() {
        return this._settings;
    }
    set settings(value) {
        this._settings = value;
    }
    addField(name, value) {
        let field = new StiAdditionalField();
        field.key = name;
        field.value = value;
        this._additionalFormFields.push(field);
    }
    clearAdditionalFields() {
        this._additionalFormFields = [];
    }
    get additionalFormFields() {
        return this._additionalFormFields;
    }
    get allElements() {
        let elements = [];
        this.pages.forEach((page) => {
            elements.push(page);
            elements.push(page.allElements);
        });
        elements = elements.reduce((a, b) => a.concat(b), []);
        return elements;
    }
    get formName() {
        return this._formName;
    }
    set formName(value) {
        this._formName = value;
    }
    get reportVersion() {
        return this._reportVersion;
    }
    set reportVersion(value) {
        this._reportVersion = value;
    }
    get reportName() {
        return this._reportName;
    }
    set reportName(value) {
        this._reportName = value;
    }
    get reportGuid() {
        return this._reportGuid;
    }
    set reportGuid(value) {
        this._reportGuid = value;
    }
    get reportAlias() {
        return this._reportAlias;
    }
    set reportAlias(value) {
        this._reportAlias = value;
    }
    get reportCreated() {
        return this._reportCreated;
    }
    set reportCreated(value) {
        this._reportCreated = value;
    }
    get reportChanged() {
        return this._reportChanged;
    }
    set reportChanged(value) {
        this._reportChanged = value;
    }
    get reportImage() {
        return this._reportImage;
    }
    set reportImage(value) {
        this._reportImage = value;
    }
    get versionKey() {
        return this._versionKey;
    }
    set versionKey(value) {
        this._versionKey = value;
    }
    get userId() {
        return this._userId;
    }
    set userId(value) {
        this._userId = value;
    }
    constructor() {
        this.pages = [];
        this.attachedFiles = [];
        this.formEvents = new Subject();
        this._reportVersion = "";
        this._reportName = "";
        this._reportGuid = "";
        this._reportAlias = "";
        this._reportCreated = "";
        this._reportChanged = "";
        this._reportImage = "";
        this._versionKey = "";
        this._userId = "";
        this._formName = "Form";
        this._guid = Guid.newGuid().toString();
        this._settings = new StiFormSettings(this);
        this._additionalFormFields = new Array();
        let page = new StiFormPageElement(this);
        page.name = "Page";
        this.pages.push(page);
        this.reportCreated = StiStaticHelperService.dateToJsonDate(new Date());
    }
    createTestValues() {
        let jObject = new StiJson();
        jObject.addPropertyString("TextBox", "Hello");
        jObject.addPropertyNumberNotNull("NumberBox", 1);
        jObject.addPropertyBool("Table.Cell-0-0", false);
        jObject.addPropertyBool("Table.Cell-0-1", true);
        return jObject;
    }
    setFormValues(json) {
        let element;
        for (let property of json.properties()) {
            element = { name: property.name, value: property.value };
            this.fillElement(element);
        }
    }
    fillElement(element) {
        let elem;
        let name;
        let isTable = false;
        if (element.name.indexOf(".") != -1) {
            name = element.name.slice(0, element.name.indexOf("."));
            isTable = true;
        }
        else {
            name = element.name;
        }
        this.pages.forEach((page) => {
            elem = page.allElements.find((elem) => elem.name == name);
        });
        if (elem) {
            if (isTable) {
                let cell = element.name.slice(element.name.indexOf(".") + 1, element.name.length);
                this.setTableValue(elem, cell, element.value);
            }
            else {
                this.setValue(elem, element.value);
            }
        }
    }
    setValue(element, value) {
        if (element instanceof StiTextBoxElement) {
            element.text = value;
        }
        else if (element instanceof StiNumberBoxElement) {
            element.value = value;
        }
        else if (element instanceof StiComboBoxElement) {
            element.selectedOption = value;
        }
        else if (element instanceof StiListBoxElement) {
            element.selectedOptions = value;
        }
        else if (element instanceof StiSingleSelectionElement) {
            element.selectedOption = value;
        }
        else if (element instanceof StiMultipleSelectionElement) {
            element.selectedOptions = value;
        }
        else if (element instanceof StiCheckBoxElement) {
            element.isChecked = value;
        } /* else if (element instanceof StiSignatureElement) {
          return { name: element.name ?? element.guid, value: element.contentImage };
        }  */
        else if (element instanceof StiDateTimeBoxElement) {
            element.dateValue = value;
        }
        else if (element instanceof StiImageElement) {
            element.image = value;
        }
        else if (element instanceof StiBarcodeElement) {
            element.img = value;
        }
        else if (element instanceof StiLabelElement) {
            element.text.value = value;
        }
    }
    setTableValue(element, cellPath, value) {
        let column = cellPath.split("-")[1];
        let cell = cellPath.split("-")[2];
        let tableColumn = element.columns[column];
        if (tableColumn instanceof StiTextBoxColumnItem) {
            tableColumn.cells[cell].text = value;
        }
        else if (tableColumn instanceof StiNumberBoxColumnItem) {
            tableColumn.cells[cell].value = value;
        }
        else if (tableColumn instanceof StiComboBoxColumnItem) {
            tableColumn.cells[cell].selectedIndex = value;
        }
        else if (tableColumn instanceof StiCheckBoxColumnItem) {
            tableColumn.cells[cell].isChecked = value;
        }
        else if (tableColumn instanceof StiLabelColumnItem) {
            tableColumn.cells[cell] = value;
        }
        else if (tableColumn instanceof StiRadioButtonColumnItem) {
            tableColumn.cells[cell].isChecked = value;
        }
    }
    getElementByName(elementName) {
        let finded;
        this.pages.forEach((page) => {
            if (!finded) {
                finded = page.allElements.find((e) => e.name == elementName);
            }
        });
        return finded;
    }
    getElementByGuid(guid) {
        let finded;
        this.pages.forEach((page) => {
            if (!finded) {
                finded = page.allElements.find((e) => e.guid == guid);
            }
            if (page.guid == guid) {
                finded = page;
            }
        });
        return finded;
    }
    saveToJsonObject(options = {}) {
        let rootJsonObject = new StiJson("", null, false, options);
        rootJsonObject.addPropertyArray("Pages", this.pages);
        rootJsonObject.addPropertyJObject("Settings", this.settings.saveToJsonObject(options));
        rootJsonObject.addPropertyString("Guid", this.guid);
        rootJsonObject.addPropertyString("FormName", this.formName);
        rootJsonObject.addPropertyString("VersionKey", this.versionKey);
        rootJsonObject.addPropertyString("UserId", this.userId);
        rootJsonObject.addPropertyArray("AdditionalFields", this.additionalFormFields);
        return rootJsonObject;
    }
    saveToReportJsonObject(options = {}) {
        let formJson = this.saveToJsonObject(options);
        let root = new StiJson();
        let pages = new StiJson();
        let formContainer = new StiJson();
        formContainer.addPropertyString("Ident", "StiFormContainer");
        formContainer.addPropertyJObject("Content", formJson);
        pages.addPropertyJObject("0", formContainer);
        root.addPropertyString("ReportVersion", this.reportVersion);
        root.addPropertyString("ReportGuid", this.reportGuid);
        root.addPropertyString("ReportName", this.reportName);
        root.addPropertyString("ReportAlias", this.reportAlias);
        root.addPropertyString("ReportCreated", this.reportCreated);
        root.addPropertyString("ReportChanged", this.reportChanged);
        root.addPropertyString("ReportImage", this.reportImage);
        root.addPropertyJObject("Pages", pages);
        return root;
    }
    loadFormJsonString(text) {
        let jObject = new StiJson();
        jObject.deserialize(text);
        this.loadFromJson(jObject);
    }
    loadFromJson(jObject) {
        var key;
        for (let property of jObject.properties()) {
            if (property.name == "ReportVersion") {
                this.reportVersion = property.value;
            }
            else if (property.name == "ReportGuid") {
                this.reportGuid = property.value;
            }
            else if (property.name == "ReportName") {
                this.reportName = property.value;
            }
            else if (property.name == "ReportAlias") {
                this.reportAlias = property.value;
            }
            else if (property.name == "ReportCreated") {
                this.reportCreated = property.value;
            }
            else if (property.name == "ReportChanged") {
                this.reportChanged = property.value;
            }
            else if (property.name == "ReportImage") {
                this.reportImage = property.value;
            }
            else if (property.name == "Script" && property.value && property.value.length < 40) {
                key = property.value;
            }
        }
        try {
            let formContainer = jObject
                .properties()
                .find((p) => p.name == "Pages")
                .properties()[0]
                .properties();
            if (formContainer.find((p) => p.name == "Ident").value == "StiFormContainer") {
                jObject = formContainer.find((p) => p.name == "Content").value;
            }
        }
        catch { }
        for (let property of jObject.properties()) {
            if (property.name == "Pages") {
                this.pages = this.deserializePages(property.value);
            }
            else if (property.name == "Settings" || property.name == "FormSettings") {
                this._settings = new StiFormSettings(this);
                this._settings.loadFromJsonObject(property.value);
            }
            else if (property.name == "Guid") {
                this._guid = property.value;
            }
            else if (property.name == "FormName") {
                this._formName = property.value;
            }
            else if (property.name == "VersionKey") {
                this._versionKey = property.value;
            }
            else if (property.name == "UserId") {
                this._userId = property.value;
            }
            else if (property.name == "AdditionalFields") {
                this._additionalFormFields = this.deserializeFields(property.value);
            }
        }
        if (key && key.length > 0) {
            this._versionKey = key;
        }
        this.checkElementsName();
    }
    deserializePages(jObject) {
        let result = [];
        for (let property of jObject.properties()) {
            let page = new StiFormPageElement(this);
            page.loadFromJsonObject(property.value);
            result.push(page);
        }
        return result;
    }
    deserializeFields(jObject) {
        let result = [];
        for (let property of jObject.properties()) {
            let field = new StiAdditionalField();
            field.loadFromJsonObject(property.value);
            result.push(field);
        }
        return result;
    }
    updateCultureDependecies() {
        this.pages.forEach((page) => {
            page.allElements.forEach((element) => {
                if (element.type == "DateTime_BoxElement") {
                    element.updateDateValueString();
                }
            });
        });
    }
    updateToViewerMode() {
        this.pages.forEach((page) => {
            page.allElements.forEach((element) => {
                if (element["updateToViewerMode"]) {
                    element.updateToViewerMode();
                }
            });
        });
    }
    checkElementsName() {
        this.allElements.forEach(e => {
            if (e.name == null || e.name.length == 0) {
                e.name = StiNameService.getElementName2(e, this);
            }
        });
    }
}

class StimulsoftFormsService {
    constructor() {
        this.serviceEvents = new Subject();
        this.serviceEventsCallbacks = new Subject();
    }
    /**
     * Post custom data to controller
     * @param data to send to controller
     * @param func callback function
     * @param options to send to controller
     */
    postData(data, func, options) {
        this.serviceEvents.next({ action: "postData", data: data, func: func, options: options });
    }
    /**
     * Add Element to Form
     * @param elementType
     * Text
     * TextBox
     * Table
     * SingleSelection
     * Signature
     * Panel
     * NumberBox
     * MultipleSelection
     * ListBox
     * Line
     * Label
     * Image
     * DateTimeBox
     * CheckBox
     * ComboBox
     * Button
     * BarCode
     * Address
     */
    addElementToForm(elementType) {
        if (!(this.createElement(elementType) instanceof StiFormPageElement) &&
            !(this.createElement(elementType) instanceof StiForm)) {
            this.serviceEvents.next({
                action: "addElementToForm",
                element: this.createElement(elementType),
            });
        }
    }
    /**
     * Show form tab
     * @param tabName
     * Home
     * Insert
     * Preview
     * PdfPreview
     */
    showTab(tabName) {
        switch (tabName.toLowerCase()) {
            case "home":
                this.serviceEvents.next({ action: "showTab", tabName: "Home" });
                break;
            case "insert":
                this.serviceEvents.next({ action: "showTab", tabName: "Insert" });
                break;
            case "preview":
                this.serviceEvents.next({ action: "showTab", tabName: "Preview" });
                break;
            case "pdfpreview":
                this.serviceEvents.next({ action: "showTab", tabName: "PDFPreview" });
                break;
            default:
                this.serviceEvents.next({ action: "showTab", tabName: "Home" });
                break;
        }
    }
    // Showing form file menu
    showFileMenu() {
        this.serviceEvents.next({ action: "showFileMenu" });
    }
    // Showing form save menu
    showSaveMenu() {
        this.serviceEvents.next({ action: "showSaveMenu" });
    }
    // Download pdf file of current form
    exportToPdf(readOnly = false, pdfACompliance = false) {
        this.serviceEvents.next({ action: "exportToPdf", readOnly: readOnly, pdfACompliance: pdfACompliance });
    }
    // Return pdf bytes of current form
    getPdfBytes(readOnly = false, pdfACompliance = false) {
        this.serviceEvents.next({ action: "getPdfBytes", readOnly: readOnly, pdfACompliance: pdfACompliance });
        return this.serviceEventsCallbacks
            .pipe(first())
            .toPromise()
            .then((data) => {
            if (data.action == "pdfBytesCallback") {
                return data.value;
            }
        });
    }
    /**
     * Set form zoom
     * @param zoom
     * PageWidth
     * OnePage
     * from 10%
     * to 400%
     */
    setZoom(zoom) {
        this.serviceEvents.next({ action: "setZoom", zoom: zoom });
    }
    /**
     * Create form element
     * @param elementType
     * Text
     * TextBox
     * Table
     * SingleSelection
     * Signature
     * Panel
     * NumberBox
     * MultipleSelection
     * ListBox
     * Line
     * Label
     * Image
     * DateTimeBox
     * CheckBox
     * ComboBox
     * Button
     * BarCode
     * Address
     * Page
     * Form
     * @returns Element object
     */
    createElement(elementType) {
        return new (this.getElementClass(elementType))();
    }
    /**
     * Get class of form element
     * @param type
     * Text
     * TextBox
     * Table
     * SingleSelection
     * Signature
     * Panel
     * NumberBox
     * MultipleSelection
     * ListBox
     * Line
     * Label
     * Image
     * DateTimeBox
     * CheckBox
     * ComboBox
     * Button
     * BarCode
     * Address
     * Page
     * Form
     * @returns element Class
     */
    getElementClass(type) {
        if (type == "TextElement" || type == "Text") {
            return StiTextElement;
        }
        else if (type == "Text_BoxElement" || type == "TextBox") {
            return StiTextBoxElement;
        }
        else if (type == "TableElement" || type == "Table") {
            return StiTableElement;
        }
        else if (type == "Single_SelectionElement" || type == "SingleSelection") {
            return StiSingleSelectionElement;
        }
        else if (type == "SignatureElement" || type == "Signature") {
            return StiSignatureElement;
        }
        else if (type == "PanelElement" || type == "Panel") {
            return StiPanelElement;
        }
        else if (type == "Number_BoxElement" || type == "NumberBox") {
            return StiNumberBoxElement;
        }
        else if (type == "Multiple_SelectionElement" || type == "MultipleSelection") {
            return StiMultipleSelectionElement;
        }
        else if (type == "List_BoxElement" || type == "ListBox") {
            return StiListBoxElement;
        }
        else if (type == "LineElement" || type == "Line") {
            return StiLineElement;
        }
        else if (type == "LabelElement" || type == "Label") {
            return StiLabelElement;
        }
        else if (type == "ImageElement" || type == "Image") {
            return StiImageElement;
        }
        else if (type == "DateTime_BoxElement" || type == "DateTimeBox") {
            return StiDateTimeBoxElement;
        }
        else if (type == "Combo_BoxElement" || type == "ComboBox") {
            return StiComboBoxElement;
        }
        else if (type == "Check_BoxElement" || type == "CheckBox") {
            return StiCheckBoxElement;
        }
        else if (type == "ButtonElement" || type == "Button") {
            return StiButtonElement;
        }
        else if (type == "BarCodeElement" || type == "BarCode") {
            return StiBarcodeElement;
        }
        else if (type == "AddressElement" || type == "Address") {
            return StiAddressElement;
        }
        else if (type == "Page") {
            return StiFormPageElement;
        }
        else if (type == "Form") {
            return StiForm;
        }
        // return this.pageElement.getElementTypes()[type] ?? StiPanelElement;
    }
    base64Encode(input) {
        if (input == null)
            return "";
        // Decode from UTF-8 text
        if (typeof unescape != "undefined") {
            input = unescape(encodeURIComponent(input));
        }
        else {
            input = input.replace(/\r\n/g, "\n");
            var utftext = "";
            for (var n = 0; n < input.length; n++) {
                var c = input.charCodeAt(n);
                if (c < 128) {
                    utftext += String.fromCharCode(c);
                }
                else if (c > 127 && c < 2048) {
                    utftext += String.fromCharCode((c >> 6) | 192);
                    utftext += String.fromCharCode((c & 63) | 128);
                }
                else {
                    utftext += String.fromCharCode((c >> 12) | 224);
                    utftext += String.fromCharCode(((c >> 6) & 63) | 128);
                    utftext += String.fromCharCode((c & 63) | 128);
                }
            }
            input = utftext;
        }
        // Encode to Base64 string
        if (typeof window.btoa != "undefined")
            return window.btoa(input);
        var output = "";
        var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
        var i = 0;
        while (i < input.length) {
            chr1 = input.charCodeAt(i++);
            chr2 = input.charCodeAt(i++);
            chr3 = input.charCodeAt(i++);
            enc1 = chr1 >> 2;
            enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
            enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
            enc4 = chr3 & 63;
            if (isNaN(chr2))
                enc3 = enc4 = 64;
            else if (isNaN(chr3))
                enc4 = 64;
            output =
                output +
                    this._keyStr.charAt(enc1) +
                    this._keyStr.charAt(enc2) +
                    this._keyStr.charAt(enc3) +
                    this._keyStr.charAt(enc4);
        }
        return output;
    }
    base64Decode(input) {
        if (input == null)
            return "";
        var output = "";
        // Decode from Base64 string
        if (typeof window.atob != "undefined") {
            output = window.atob(input);
        }
        else {
            var chr1, chr2, chr3;
            var enc1, enc2, enc3, enc4;
            var i = 0;
            input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");
            while (i < input.length) {
                enc1 = this._keyStr.indexOf(input.charAt(i++));
                enc2 = this._keyStr.indexOf(input.charAt(i++));
                enc3 = this._keyStr.indexOf(input.charAt(i++));
                enc4 = this._keyStr.indexOf(input.charAt(i++));
                chr1 = (enc1 << 2) | (enc2 >> 4);
                chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
                chr3 = ((enc3 & 3) << 6) | enc4;
                output = output + String.fromCharCode(chr1);
                if (enc3 != 64) {
                    output = output + String.fromCharCode(chr2);
                }
                if (enc4 != 64) {
                    output = output + String.fromCharCode(chr3);
                }
            }
        }
        // Encode to UTF-8 string
        if (typeof escape != "undefined")
            return decodeURIComponent(escape(output));
        var string = "";
        var i = 0;
        var c = 0;
        var c1 = 0;
        var c2 = 0;
        var c3 = 0;
        while (i < output.length) {
            c = output.charCodeAt(i);
            if (c < 128) {
                string += String.fromCharCode(c);
                i++;
            }
            else if (c > 191 && c < 224) {
                c2 = output.charCodeAt(i + 1);
                string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
                i += 2;
            }
            else {
                c2 = output.charCodeAt(i + 1);
                c3 = output.charCodeAt(i + 2);
                string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
                i += 3;
            }
        }
        return string;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StimulsoftFormsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StimulsoftFormsService, providedIn: "root" }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StimulsoftFormsService, decorators: [{
            type: Injectable,
            args: [{
                    providedIn: "root",
                }]
        }], ctorParameters: () => [] });

class StiRectangleGeometryLayout {
    constructor(model, nameService) {
        this.model = model;
        this.nameService = nameService;
    }
    insertElement(newElement, contentAreaWidth = 0) {
        // let fixedGeometry = this.fixForInsert(newElement.geometry);
        let parentElement = this.model.getElementPage(newElement) ?? this.model.getElementPanel(newElement);
        let otherElements = Array.from(parentElement.elements);
        otherElements.splice(otherElements.indexOf(newElement), 1);
        if (newElement) {
            let fixedGeometry = newElement.geometry;
            this.insertFixed(fixedGeometry, newElement, otherElements, contentAreaWidth);
        }
    }
    isHigherThan(left, right) {
        return left.bottom <= right.y;
    }
    isHigherThan2(left, right) {
        return left.bottom - left.height / 2 <= right.y;
    }
    removeElement(elementToRemove, otherElements) {
        let elementsAbove = [];
        let elementsBelow = [];
        for (let element of otherElements) {
            if (this.isHigherThan(element.geometry, elementToRemove.geometry)) {
                elementsAbove.push(element);
            }
            else {
                elementsBelow.push(element);
            }
        }
        this.snapBelowsToAboves(elementsBelow, elementsAbove);
    }
    changeElementGeometry(elementToChange, otherElements, contentAreaWidth = 0) {
        let fixedGeometry = elementToChange.geometry;
        this.insertFixed(fixedGeometry, elementToChange, otherElements, contentAreaWidth);
    }
    fitWidth(fixedGeometry, otherElements, contentAreaWidth) {
        if (contentAreaWidth > 0) {
            let right = contentAreaWidth;
            let rect = new StiRectangleGeometry(fixedGeometry.width - fixedGeometry.minWidth, fixedGeometry.height / 2);
            rect.x = fixedGeometry.x + fixedGeometry.minWidth;
            rect.y = fixedGeometry.y;
            otherElements.forEach((element) => {
                if (element.geometry.intersectWith(rect)) {
                    right = Math.min(right, element.geometry.x);
                }
            });
            let newWidth = fixedGeometry.width - (fixedGeometry.right - right);
            if (newWidth + StiRectangleGeometry.DELTA > fixedGeometry.minWidth &&
                newWidth <= fixedGeometry.width + StiRectangleGeometry.DELTA) {
                fixedGeometry.width = newWidth;
            }
        }
    }
    insertFixed(fixedGeometry, elementToInsert, otherElements, contentAreaWidth) {
        let elementsAbove = [];
        let elementsBelow = [];
        for (let element of otherElements) {
            if (this.isHigherThan2(element.geometry, fixedGeometry)) {
                elementsAbove.push(element);
            }
            else {
                elementsBelow.push(element);
            }
        }
        this.fitWidth(fixedGeometry, otherElements, contentAreaWidth);
        let snappedNewGeometry = this.snapOneToAboves(fixedGeometry, elementsAbove, true);
        elementToInsert.geometry = snappedNewGeometry;
        elementsAbove.push(elementToInsert);
        this.moveDown(elementsBelow, 2 * snappedNewGeometry.height);
        this.snapBelowsToAboves(elementsBelow, elementsAbove);
        this.fitWidth(snappedNewGeometry, otherElements, contentAreaWidth);
    }
    snapOneToAboves(geometry, elementsAboveToSnap, canShrink = false) {
        let elementsExcatlyAbove = elementsAboveToSnap.filter((element) => element.geometry.xProjectionIntersectsWith(geometry));
        if (elementsExcatlyAbove.length > 0) {
            let max = elementsExcatlyAbove.reduce((acc, curr) => (acc.geometry.bottom > curr.geometry.bottom ? acc : curr));
            return geometry.withY(max.geometry.bottom);
        }
        else
            return geometry.withY(0);
    }
    moveDown(elementsToMoveDown, distance) {
        for (let element of elementsToMoveDown) {
            element.geometry = element.geometry.withY(element.geometry.y + distance);
        }
    }
    snapBelowsToAboves(belows, aboves) {
        belows.sort(function (left, right) {
            let difference = left.geometry.y - right.geometry.y;
            if (difference < StiRectangleGeometry.DELTA) {
                return -1;
            }
            else if (difference > StiRectangleGeometry.DELTA) {
                return 1;
            }
            else {
                return 0;
            }
        });
        for (let element of belows) {
            let snappedFromBelow = this.snapOneToAboves(element.geometry, aboves);
            element.geometry = snappedFromBelow;
            aboves.push(element);
        }
    }
    getFreeToBottomResizeArea(currentResizeElement, otherElements) {
        let currentContainer = this.model.getElementPage(currentResizeElement) ?? this.model.getElementPanel(currentResizeElement);
        let geometry = currentResizeElement.geometry;
        let bottomElements = otherElements?.filter((element) => element.y >= geometry.bottom);
        let elementsExcatlyBelow = bottomElements?.filter((element) => element.geometry.xProjectionIntersectsWith(geometry));
        let bottomPoints = elementsExcatlyBelow?.map((element) => {
            return element.geometry.bottom;
        });
        let topPoints = elementsExcatlyBelow?.map((element) => {
            return element.geometry.y;
        });
        let maxBottomPoint = Math.max(...bottomPoints);
        let minTopPoint = Math.min(...topPoints);
        let bottomElementsHeight = maxBottomPoint - minTopPoint;
        return (currentContainer.contentAreaHeight -
            geometry.bottom -
            (elementsExcatlyBelow.length > 0 ? bottomElementsHeight : 0));
    }
    checkOutputs(usedPage) {
        let outputElements = [];
        let summaryHeight = 0;
        usedPage?.elements.forEach((element) => {
            if (element.geometry.bottom > usedPage.contentAreaHeight) {
                outputElements.push(element);
            }
        });
        if (outputElements.length > 0) {
            outputElements.forEach((element) => {
                summaryHeight += element.height;
                usedPage.elements.splice(usedPage.elements.indexOf(element), 1);
                this.removeElement(element, usedPage.elements);
            });
            if (this.model.form.pages[this.model.form.pages.indexOf(usedPage) + 1]) {
                let nextPage = this.model.form.pages[this.model.form.pages.indexOf(usedPage) + 1];
                if (nextPage.contentAreaHeight - Math.max(...nextPage.elements.map((element) => element.geometry.bottom)) >
                    summaryHeight) {
                    let currentBottomPoint = 0;
                    outputElements.forEach((element, index) => {
                        nextPage.elements.splice(index, 0, element);
                        element.y = currentBottomPoint;
                        this.insertElement(element);
                        currentBottomPoint += element.height;
                    });
                }
                else {
                    let page1 = new StiFormPageElement(this.model.form);
                    page1.name = this.nameService.getElementName(page1);
                    this.model.form.pages.splice(this.model.form.pages.indexOf(nextPage), 0, page1);
                    let currentBottomPoint = 0;
                    outputElements.forEach((element, index) => {
                        page1.elements.splice(index, 0, element);
                        element.y = currentBottomPoint;
                        this.insertElement(element);
                        currentBottomPoint += element.height;
                    });
                }
            }
            else {
                let page1 = new StiFormPageElement(this.model.form);
                page1.name = this.nameService.getElementName(page1);
                this.model.form.pages.push(page1);
                let currentBottomPoint = 0;
                outputElements.forEach((element, index) => {
                    page1.elements.splice(index, 0, element);
                    element.y = currentBottomPoint;
                    this.insertElement(element);
                    currentBottomPoint += element.geometry.bottom;
                });
            }
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiRectangleGeometryLayout, deps: [{ token: StiModelService }, { token: StiNameService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiRectangleGeometryLayout }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiRectangleGeometryLayout, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiNameService }] });

class StiEditableContentService {
    constructor(model) {
        this.model = model;
        this.activeControl = false;
    }
    getIntEditableContent() {
        return this._editableContent;
    }
    get editableContent() {
        return this._editableContent || this.model.selectedComponent?.element?.getDefaultEditableContent();
    }
    set editableContent(value) {
        this._editableContent = value;
    }
    startEdit(editableElementRef = null) {
        editableElementRef = editableElementRef ?? this.editableElementRef;
        if (editableElementRef) {
            let caretOffset = this.getCaretOffset(editableElementRef.nativeElement ?? editableElementRef);
            this.activeControl = true;
            setTimeout(() => {
                this.activeControl = false;
                let el = editableElementRef.nativeElement ?? editableElementRef;
                el.focus();
                if (el.tagName.toLowerCase() != "label" && el?.innerText?.length > 0) {
                    this.setCaret(el, caretOffset);
                }
            }, 0);
        }
    }
    getCaretOffset(element) {
        let caretOffset = 0;
        let doc = element.ownerDocument || element.document;
        let win = doc.defaultView || doc.parentWindow;
        let sel;
        if (typeof win.getSelection != "undefined") {
            sel = win.getSelection();
            if (sel.rangeCount > 0) {
                let range = win.getSelection().getRangeAt(0);
                let preCaretRange = range.cloneRange();
                preCaretRange.selectNodeContents(element);
                preCaretRange.setEnd(range.endContainer, range.endOffset);
                caretOffset = preCaretRange.toString().length;
            }
        }
        else if ((sel = doc.selection) && sel.type != "Control") {
            let textRange = sel.createRange();
            let preCaretTextRange = doc.body.createTextRange();
            preCaretTextRange.moveToElementText(element);
            preCaretTextRange.setEndPoint("EndToEnd", textRange);
            caretOffset = preCaretTextRange.text.length;
        }
        return caretOffset;
    }
    setCaret(el, caretOffset) {
        var range = document.createRange();
        var sel = window.getSelection();
        range.setStart(el.childNodes[0], caretOffset);
        range.collapse(true);
        sel.removeAllRanges();
        sel.addRange(range);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiEditableContentService, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiEditableContentService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiEditableContentService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }] });

class StiUserService {
    constructor(model) {
        this.model = model;
        this.showLocalizationPreview = false;
        this.showUserInfo = false;
        this.buildDate = new Date(2022, 8, 27);
        this.trialMessage = "";
    }
    get currentUser() {
        return this._currentUser;
    }
    set currentUser(value) {
        if (value) {
            if (value == "empty") {
                this._currentUser = null;
            }
            else {
                let user = this.model.toCamelCase(value);
                this._currentUser = user;
                if (user?.created && !this.model.isWebView && (!this.licenseProducts || this.licenseProducts.length == 0)) {
                    this.buildDate = StiJson.jsonDateFormatToDate(user.created).date;
                }
                if (this.model.properties) {
                    this.model.properties.developerRole = user.developerRole;
                }
            }
            this.checkLicense();
        }
    }
    getBackground(user) {
        let key = user?.userKey ? user?.userKey : user?.key ?? "key";
        var r = 0;
        var g = 0;
        var b = 0;
        for (var i = 0; i < key.length / 3; i += 3) {
            r += key.charCodeAt(i);
            g += key.charCodeAt(i + 1);
            b += key.charCodeAt(i + 2);
        }
        r = (r % 100) + 100;
        g = (g % 100) + 100;
        b = (b % 100) + 100;
        return `rgb(${r},${g}, ${b})`;
    }
    checkLicense() {
        this.model.userWasChecked = true;
        if (this.licenseProducts?.length > 0 || this.currentUser) {
            let expirationDate = 0;
            if (this.licenseProducts?.length > 0) {
                this.licenseProducts.forEach((product) => {
                    if (product.ident == "Ultimate" ||
                        product.ident == "FormsWeb" ||
                        product.ident == 1 ||
                        product.ident == 26 ||
                        product.ident == "BICloud" ||
                        product.ident == 18 ||
                        product.ident == "BIDesigner" ||
                        product.ident == 12) {
                        expirationDate = Math.max(expirationDate, new Date(product.expirationDate).getTime());
                    }
                });
            }
            if (this.currentUser) {
                this.model.userIsAuthorized = true;
            }
            if (expirationDate != 0 && expirationDate > this.buildDate.getTime()) {
                this.model.showTrialBar = this.currentUser?.developerRole == "Owner";
                this.model.showTrialModalWindow = false;
                this.model.showTrialTitle = this.currentUser?.developerRole == "Owner";
                this.model.userIsAuthorized = true;
            }
            else {
                this.showTrial();
            }
        }
        else {
            this.showTrial();
        }
    }
    resetTrial() {
        this.model.showTrialBar = true;
        this.model.showTrialTitle = true;
        this.model.canCloseTrialWindow = true;
        this.model.disableCloseButton = false;
        this.model.showTrialModalWindow = false;
    }
    showTrial() {
        let currentDate = new Date();
        let trDays = Math.floor((currentDate.getTime() - this.buildDate.getTime()) / 1000 / 60 / 60 / 24);
        this.trialMessage = StiLocalizationService.get("Notices", "YouUsingTrialVersion");
        this.resetTrial();
        if (trDays > 30) {
            this.model.disableCloseButton = true;
        }
        if (!this.model.buildDate) {
            return;
        }
        if (trDays > 45) {
            this.model.showTrialTitle = true;
            setTimeout(() => {
                if (this.currentUser) {
                    this.model.showTrialModalWindow = true;
                }
            }, 3000);
        }
        if (trDays > 60) {
            if (this.currentUser) {
                this.model.canCloseTrialWindow = false;
            }
            this.trialMessage = StiLocalizationService.get("Notices", "YourTrialHasExpired");
            setTimeout(() => {
                if (this.currentUser) {
                    this.model.showTrialModalWindow = true;
                }
            }, 3000);
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiUserService, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiUserService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiUserService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }] });

class SignatureService {
    checkLoading() {
        if (this.completedLoadingImages === this.currentActiveLoadingImages) {
            this.completedLoading.next(true);
            this.completedLoadingImages = 0;
            this.currentActiveLoadingImages = 0;
        }
        else {
            setTimeout(() => {
                this.checkLoading();
            });
        }
    }
    getVerticalPosition(verticalAlignment) {
        switch (verticalAlignment) {
            case StiVerticalAlignment.Top:
                return "top";
            case StiVerticalAlignment.Bottom:
                return "bottom";
            case StiVerticalAlignment.Center:
                return "center";
        }
    }
    getHorizontalPosition(horizontalAlignment) {
        switch (horizontalAlignment) {
            case StiHorizontalAlignment.Left:
                return "left";
            case StiHorizontalAlignment.Right:
                return "right";
            case StiHorizontalAlignment.Center:
                return "center";
        }
    }
    getClass(item) {
        if (item == "Text") {
            return StiTextItem;
        }
        else if (item == "Image") {
            return StiImageEditorResult;
        }
    }
    setTemplate(template) {
        if (template.type == "Image") {
            this.currentEditableImage = template.image;
            this.currentEditableText = template.text;
            this.currentCanvasContent = template.drawedImage;
            this.selectedMode = "Draw";
        }
        else {
            this.currentPreviewFont = template.specialFont;
            this.currentEditableFullName = template.fullName;
            this.currentEditableInitials = template.initials;
            this.selectedMode = "Type";
        }
        this.showSavedTemplates = false;
    }
    getTemplateImage(template) {
        return "url(" + template?.image?.loadedImage + ")";
    }
    getTemplateDrawedImage(template) {
        return "url(" + template?.image?.drawedImage + ")";
    }
    deleteTemplate(index) {
        this.savedTemplates.splice(index, 1);
    }
    getTemplateHorizontalAlignment(template) {
        if (template.image.horizontalAlignment == StiHorizontalAlignment.Center) {
            return "center";
        }
        else if (template.image.horizontalAlignment == StiHorizontalAlignment.Left) {
            return "start";
        }
        else {
            return "end";
        }
    }
    getTemplateBackgroundSize(template, container) {
        if (!template?.image?.loadedImage) {
            return;
        }
        if (template?.image?.aspectRatio) {
            return "contain";
        }
        if (template?.image?.stretch) {
            return `${container.offsetWidth}px ${container.offsetHeight}px`;
        }
        else {
            return `${template?.image?.naturalWidth}px ${template?.image?.naturalHeight}px`;
        }
    }
    getTemplateBackgroundPosition(template) {
        if (!template?.image?.aspectRatio && !template?.image?.stretch) {
            if (template?.image?.verticalAlignment == StiVerticalAlignment.Center) {
                return "center center";
            }
            else if (template?.image?.verticalAlignment == StiVerticalAlignment.Top) {
                return "top center";
            }
            else {
                return "bottom center";
            }
        }
        else {
            return "center";
        }
    }
    cloneProperty(property, propertyClass) {
        let result = new propertyClass();
        let jObject = new StiJson();
        jObject.deserialize(property.saveToJsonObject({}).serialize());
        result.loadFromJsonObject(jObject);
        return result;
    }
    get editorComponentX() {
        return this._editorComponentX;
    }
    set editorComponentX(value) {
        value <= 0 ? (this._editorComponentX = 0) : (this._editorComponentX = value);
    }
    get editorComponentY() {
        return this._editorComponentY;
    }
    set editorComponentY(value) {
        value <= 0 ? (this._editorComponentY = 0) : (this._editorComponentY = value);
    }
    get y() {
        if (this.isSignature) {
            let container = document.getElementById(this.model.selectedComponent?.element.guid);
            let geom = this.model.getPositionRelativeToForm(container);
            return geom.y;
        }
        else {
            return 0;
        }
    }
    get x() {
        if (this.isSignature) {
            let container = document.getElementById(this.model.selectedComponent?.element.guid);
            let geom = this.model.getPositionRelativeToForm(container);
            return geom.x + geom.width + 5;
        }
        else {
            return 0;
        }
    }
    changeDrawingMode() {
        this.textMode = false;
        this.drawingMode = !this.drawingMode;
    }
    changeTextMode() {
        this.drawingMode = false;
        this.textMode = !this.textMode;
    }
    clear() {
        this.clearButtonClick.next(true);
    }
    onFileSelected() {
        let input = document.createElement("input");
        input.type = "file";
        input.accept = ".png, .jpg, .jpeg";
        let this_ = this;
        input.onchange = (_) => {
            this_.clear();
            let file = Array.from(input.files)[0];
            var reader = new FileReader();
            reader.readAsDataURL(file);
            reader.onload = function (e) {
                this_.loadedImage.next(e.target.result);
            };
        };
        input.click();
    }
    get isSignature() {
        return this.model.selectedComponent?.element instanceof StiSignatureElement ? true : false;
    }
    constructor(model) {
        this.model = model;
        this._editorComponentX = 0;
        this._editorComponentY = 0;
        this.textMode = false;
        this.selectedMode = "Draw";
        this.previewFonts = ["Teddy Bear", "MADE Likes Script", "Denistina"];
        this.currentPreviewFont = "Teddy Bear";
        this.drawingMode = false;
        this.showFontsPreview = false;
        this.loadedImage = new Subject();
        this.clearButtonClick = new Subject();
        this.updateSignature = new Subject();
        this.getInsertedInformation = new Subject();
        this.currentEditableText = new StiTextItem();
        this.editorComponentHeight = 350;
        this.editorComponentWidth = 365;
        this.fontsPreviewX = 0;
        this.fontsPreviewY = 0;
        this.templatesPreviewX = 0;
        this.templatesPreviewY = 0;
        this.showSavedTemplates = false;
        this.savedTemplates = [];
        this.currentActiveLoadingImages = 0;
        this.completedLoadingImages = 0;
        this.completedLoading = new Subject();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SignatureService, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SignatureService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SignatureService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }] });

class StiDropdownService {
    constructor() {
        this.currentOptionList = [];
        this.showDropdownList = false;
        this.valueChanged = new Subject();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDropdownService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDropdownService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDropdownService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [] });

class StiMouseService {
    constructor(model, editableSevice, userService, signatureService, dropdownService) {
        this.model = model;
        this.editableSevice = editableSevice;
        this.userService = userService;
        this.signatureService = signatureService;
        this.dropdownService = dropdownService;
        this.documetMouseDown = new Subject();
        this.documetMouseMove = new Subject();
        this.documetMouseUp = new Subject();
        this.captureMouseUp = new Subject();
        this.captureMouseDown = new Subject();
        this.documentTouchStart = new Subject();
        this.documentTouchMove = new Subject();
        this.documentTouchEnd = new Subject();
        this.leftButtonDown = false;
        this.rightButtonDown = false;
        document.addEventListener("mouseup", (event) => {
            this.documetMouseUp.next(event);
        });
        document.addEventListener("touchstart", (event) => {
            this.documentTouchStart.next(event);
        }, { passive: false });
        document.addEventListener("touchmove", (event) => {
            this.documentTouchMove.next(event);
        }, { passive: false });
        document.addEventListener("touchend", (event) => {
            this.documentTouchEnd.next(event);
        }, { passive: false });
        document.addEventListener("mouseup", (event) => {
            let form = document.querySelector("stimulsoft-forms");
            if (form) {
                form?.classList.contains("unselectable") ? form?.classList.remove("unselectable") : "";
            }
            let elements = document.elementsFromPoint(event.clientX, event.clientY);
            if (!elements.find((elem) => elem?.classList.contains("parent-group-container"))) {
                this.model.showGroupPreview = false;
            }
            if (!elements.find((elem) => elem?.classList.contains("form-elements-list-item")) &&
                !elements.find((elem) => elem?.classList.contains("form-elements-dropdown"))) {
                this.model.showFormElementsList = false;
            }
            if (!elements.find((elem) => elem?.classList.contains("localization"))) {
                this.userService.showLocalizationPreview = false;
            }
            if (!elements.find((elem) => elem?.classList.contains("user-info"))) {
                this.userService.showUserInfo = false;
            }
            if (!elements.find((elem) => elem?.classList.contains("sti-dropdown-list"))) {
                this.dropdownService.showDropdownList = false;
            }
            if (!elements.find((elem) => elem?.classList.contains("tiered-menu-container"))) {
                this.model.showTieredMenu = false;
            }
            if (!elements.find((elem) => elem?.classList.contains("sti-dropdown-editor")) &&
                !elements.find((elem) => elem?.classList.contains("sti-dropdown-items"))) {
                this.model.hideActiveDropdown.next(true);
            }
            if (event.button == 0) {
                this.leftButtonDown = false;
            }
            if (!elements.find((elem) => elem?.classList.contains("autoComplete-list-container")) &&
                !elements.find((elem) => elem?.classList.contains("autoComplete-select-button"))) {
                this.model.hideActiveAutocompleteList.next(true);
            }
            if (!elements.find((elem) => elem?.classList.contains("home")) &&
                !elements.find((elem) => elem?.classList.contains("sti-dropdown-list"))) {
                let iframes = document.getElementsByTagName("iframe");
                if (iframes.length > 0) {
                    for (let index = 0; index < iframes.length; index++) {
                        const element = iframes[index].contentDocument || iframes[index].contentWindow.document;
                        if (element.getSelection().toString().length > 0) {
                            element.getSelection().removeAllRanges();
                        }
                    }
                }
            }
            this.model.lastFormState = null;
            this.captureMouseUp.next(event);
        }, true);
        /* document.addEventListener(
          "mousemove",
          (event) => {
            this.captureMouseUp.next(event);
          },
          true
        ); */
        document.addEventListener("mousemove", (event) => {
            this.documetMouseMove.next(event);
        });
        window.addEventListener("mousedown", (event) => {
            this.documetMouseDown.next(event);
        });
        window.addEventListener("mousedown", (event) => {
            if (this.editableSevice.usedElement &&
                this.model.selectedComponent &&
                this.model.selectedComponent.element != this.editableSevice.usedElement) {
                this.editableSevice.editableContent = null;
                this.editableSevice.usedElement = null;
            }
            if (event.button == 0) {
                this.leftButtonDown = true;
            }
            let elements = document.elementsFromPoint(event.clientX, event.clientY);
            if (this.model.showColorDialog && !this.model.showMoreColorDialog) {
                if (!elements.find((elem) => elem?.classList.contains("color-dialog"))) {
                    this.model.showColorDialog = false;
                }
            }
            if (this.model.showContextMenu) {
                let underContextMenu = false;
                for (let elem of document.elementsFromPoint(event.clientX, event.clientY)) {
                    if (elem?.classList.contains("context-menu")) {
                        underContextMenu = true;
                        break;
                    }
                }
                if (!underContextMenu) {
                    this.model.showContextMenu = false;
                }
            }
            if (this.signatureService.drawingMode) {
                let underCanvas = false;
                for (let elem of document.elementsFromPoint(event.clientX, event.clientY)) {
                    if (elem?.classList.contains("canvas")) {
                        underCanvas = true;
                        break;
                    }
                }
                if (!underCanvas) {
                    setTimeout(() => {
                        this.signatureService.drawingMode = false;
                    });
                }
            }
            if (this.signatureService.showFontsPreview) {
                if (!elements.find((elem) => elem?.classList.contains("fonts-preview-container"))) {
                    this.signatureService.showFontsPreview = false;
                }
            }
            if (this.signatureService.showSavedTemplates) {
                if (!elements.find((elem) => elem?.classList.contains("saved-templates-container")) &&
                    !elements.find((elem) => elem?.classList.contains("show-button"))) {
                    this.signatureService.showSavedTemplates = false;
                }
            }
            this.captureMouseDown.next(event);
        }, true);
    }
    getDocumentMouseUp() {
        return this.documetMouseUp.asObservable();
    }
    getDocumentMouseMove() {
        return this.documetMouseMove.asObservable();
    }
    getDocumentMouseDown() {
        return this.documetMouseDown.asObservable();
    }
    getCaptureMouseUp() {
        return this.captureMouseUp.asObservable();
    }
    getCaptureMouseDown() {
        return this.captureMouseDown.asObservable();
    }
    getDocumentTouchStart() {
        return this.documentTouchStart.asObservable();
    }
    getDocumentTouchMove() {
        return this.documentTouchMove.asObservable();
    }
    getDocumentTouchEnd() {
        return this.documentTouchEnd.asObservable();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiMouseService, deps: [{ token: StiModelService }, { token: StiEditableContentService }, { token: StiUserService }, { token: SignatureService }, { token: StiDropdownService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiMouseService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiMouseService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiEditableContentService }, { type: StiUserService }, { type: SignatureService }, { type: StiDropdownService }] });

class StiHelperService {
    getProperty(element, prop) {
        let props = prop.split(".");
        return prop.indexOf(".") == -1
            ? element[prop]
            : this.getProperty(element[props[0]], props.splice(1, props.length).join("."));
    }
    setProperty(element, prop, value) {
        let props = prop.split(".");
        if (prop.indexOf(".") == -1) {
            element[prop] = value;
        }
        else {
            element[props[0]][props[1]] = value;
        }
    }
    constructor(model, render, loc, zone) {
        this.model = model;
        this.render = render;
        this.loc = loc;
        this.zone = zone;
        this._fonts = [];
        this._numberTypes = [];
        this._rangeFormats = [];
        this._signatureTypes = [];
        this._dateTimeTypes = [];
        this._buttonTypes = [];
        this._columnTypes = [];
        this._buttonSendTypes = [];
        this._thousandSeparators = [];
        this._barcodeTypes = [];
        this._dateTimeValues = [];
        this._themes = [];
        this._borderWeights = [];
        this._unitAlignment = [];
        this._minUnitAlignment = [];
        this._labelFormat = [];
        this._penStyles = [];
        this._algorithmExpressions = [];
        this._dateTimeFormats = [];
        this._dateFormats = [];
        this._timeFormats = [];
        this._cultures = [];
        this._signatureEditorModes = [];
        this._signatureSpecialFonts = [];
        this._fontSizes = [5, 6, 7, 8, 9, 10, 11, 12, 14, 15, 16, 18, 20, 22, 24, 26, 28, 36, 44, 58, 72];
        this._richTextFontSizes = [];
        this._errorCorrectionLevel = ["Level1", "Level2", "Level3", "Level4"];
        this._fileMenuItems = [];
        this._dataMatrixSize = [
            "Automatic",
            "v1",
            "v2",
            "v3",
            "v4",
            "v5",
            "v6",
            "v7",
            "v8",
            "v9",
            "v10",
            "v11",
            "v12",
            "v13",
            "v14",
            "v15",
            "v16",
            "v17",
            "v18",
            "v19",
            "v20",
            "v21",
            "v22",
            "v23",
            "v24",
            "v25",
            "v26",
            "v27",
            "v28",
            "v29",
            "v30",
            "v31",
            "v32",
            "v33",
            "v34",
            "v35",
            "v36",
            "v37",
            "v38",
            "v39",
            "v40",
        ];
        this._bodyShapeType = [
            "Square",
            "RoundedSquare",
            "Dot",
            "Circle",
            "Diamond",
            "Star",
            "ZebraHorizontal",
            "ZebraVertical",
            "ZebraCross1",
            "ZebraCross2",
            "Circular",
            "DockedDiamonds",
        ];
        this._eyeFrameShapeType = ["Square", "Dots", "Circle", "Round", "Round1", "Round3"];
        this._eyeBallShapeType = [
            "Square",
            "Dots",
            "Circle",
            "Round",
            "Round1",
            "Round3",
            "Star",
            "ZebraHorizontal",
            "ZebraVertical",
        ];
        this._brushIdent = ["Empty", "Solid", "Gradient", "Glare", "Glass", "Hatch", "Default", "Style"];
        this._bodyBrush = ["Empty", "Solid", "Hatch", "Gradient", "Glare", "Glass"];
        this.hatchStyle = [
            { name: "Horizontal", value: 0 },
            { name: "Vertical", value: 1 },
            { name: "ForwardDiagonal", value: 2 },
            { name: "BackwardDiagonal", value: 3 },
            { name: "Cross", value: 4 },
            { name: "DiagonalCross", value: 5 },
            { name: "Percent05", value: 6 },
            { name: "Percent10", value: 7 },
            { name: "Percent20", value: 8 },
            { name: "Percent25", value: 9 },
            { name: "Percent30", value: 10 },
            { name: "Percent40", value: 11 },
            { name: "Percent50", value: 12 },
            { name: "Percent60", value: 13 },
            { name: "Percent70", value: 14 },
            { name: "Percent75", value: 0xf },
            { name: "Percent80", value: 0x10 },
            { name: "Percent90", value: 17 },
            { name: "LightDownwardDiagonal", value: 18 },
            { name: "LightUpwardDiagonal", value: 19 },
            { name: "DarkDownwardDiagonal", value: 20 },
            { name: "DarkUpwardDiagonal", value: 21 },
            { name: "WideDownwardDiagonal", value: 22 },
            { name: "WideUpwardDiagonal", value: 23 },
            { name: "LightVertical", value: 24 },
            { name: "LightHorizontal", value: 25 },
            { name: "NarrowVertical", value: 26 },
            { name: "NarrowHorizontal", value: 27 },
            { name: "DarkVertical", value: 28 },
            { name: "DarkHorizontal", value: 29 },
            { name: "DashedDownwardDiagonal", value: 30 },
            { name: "DashedUpwardDiagonal", value: 0x1f },
            { name: "DashedHorizontal", value: 0x20 },
            { name: "DashedVertical", value: 33 },
            { name: "SmallConfetti", value: 34 },
            { name: "LargeConfetti", value: 35 },
            { name: "ZigZag", value: 36 },
            { name: "Wave", value: 37 },
            { name: "DiagonalBrick", value: 38 },
            { name: "HorizontalBrick", value: 39 },
            { name: "Weave", value: 40 },
            { name: "Plaid", value: 41 },
            { name: "Divot", value: 42 },
            { name: "DottedGrid", value: 43 },
            { name: "DottedDiamond", value: 44 },
            { name: "Shingle", value: 45 },
            { name: "Trellis", value: 46 },
            { name: "Sphere", value: 47 },
            { name: "SmallGrid", value: 48 },
            { name: "SmallCheckerBoard", value: 49 },
            { name: "LargeCheckerBoard", value: 50 },
            { name: "OutlinedDiamond", value: 51 },
            { name: "SolidDiamond", value: 52 },
            { name: "LargeGrid", value: 4 },
            { name: "Min", value: 0 },
            { name: "Max", value: 4 },
        ];
        this.justifyOptions = [
            {
                image: "images.Properties.AlignLeft.png",
                value: 1,
                name: "Left",
            },
            {
                image: "images.Properties.AlignCenter.png",
                value: 2,
                name: "Center",
            },
            {
                image: "images.Properties.AlignRight.png",
                value: 3,
                name: "Right",
            },
        ];
        this.labelAlignment = [
            {
                image: "images.Properties.Left.png",
                value: 1,
                name: "Left",
            },
            {
                image: "images.Properties.Right.png",
                value: 2,
                name: "Right",
            },
            {
                image: "images.Properties.Top.png",
                value: 3,
                name: "Top",
            },
        ];
        this.verticalAlignment = [
            {
                image: "images.Properties.AlignTop.png",
                value: 1,
                name: "Top",
            },
            {
                image: "images.Properties.AlignMiddle.png",
                value: 2,
                name: "Center",
            },
            {
                image: "images.Properties.AlignBottom.png",
                value: 3,
                name: "Bottom",
            },
        ];
        this.styleOptions = [
            {
                name: "B",
                value: "Bold",
                image: "images.Properties.FontStyleBold.png",
            },
            {
                name: "I",
                value: "Italic",
                image: "images.Properties.FontStyleItalic.png",
            },
            {
                name: "U",
                value: "Underline",
                image: "images.Properties.FontStyleUnderline.png",
            },
        ];
        this.countries = [
            { name: "Afghanistan", code: "AF" },
            { name: "Åland Islands", code: "AX" },
            { name: "Albania", code: "AL" },
            { name: "Algeria", code: "DZ" },
            { name: "American Samoa", code: "AS" },
            { name: "AndorrA", code: "AD" },
            { name: "Angola", code: "AO" },
            { name: "Anguilla", code: "AI" },
            { name: "Antarctica", code: "AQ" },
            { name: "Antigua and Barbuda", code: "AG" },
            { name: "Argentina", code: "AR" },
            { name: "Armenia", code: "AM" },
            { name: "Aruba", code: "AW" },
            { name: "Australia", code: "AU" },
            { name: "Austria", code: "AT" },
            { name: "Azerbaijan", code: "AZ" },
            { name: "Bahamas", code: "BS" },
            { name: "Bahrain", code: "BH" },
            { name: "Bangladesh", code: "BD" },
            { name: "Barbados", code: "BB" },
            { name: "Belarus", code: "BY" },
            { name: "Belgium", code: "BE" },
            { name: "Belize", code: "BZ" },
            { name: "Benin", code: "BJ" },
            { name: "Bermuda", code: "BM" },
            { name: "Bhutan", code: "BT" },
            { name: "Bolivia", code: "BO" },
            { name: "Bosnia and Herzegovina", code: "BA" },
            { name: "Botswana", code: "BW" },
            { name: "Bouvet Island", code: "BV" },
            { name: "Brazil", code: "BR" },
            { name: "British Indian Ocean Territory", code: "IO" },
            { name: "Brunei Darussalam", code: "BN" },
            { name: "Bulgaria", code: "BG" },
            { name: "Burkina Faso", code: "BF" },
            { name: "Burundi", code: "BI" },
            { name: "Cambodia", code: "KH" },
            { name: "Cameroon", code: "CM" },
            { name: "Canada", code: "CA" },
            { name: "Cape Verde", code: "CV" },
            { name: "Cayman Islands", code: "KY" },
            { name: "Central African Republic", code: "CF" },
            { name: "Chad", code: "TD" },
            { name: "Chile", code: "CL" },
            { name: "China", code: "CN" },
            { name: "Christmas Island", code: "CX" },
            { name: "Cocos (Keeling) Islands", code: "CC" },
            { name: "Colombia", code: "CO" },
            { name: "Comoros", code: "KM" },
            { name: "Congo", code: "CG" },
            { name: "Congo, The Democratic Republic of the", code: "CD" },
            { name: "Cook Islands", code: "CK" },
            { name: "Costa Rica", code: "CR" },
            { name: "Cote D'Ivoire", code: "CI" },
            { name: "Croatia", code: "HR" },
            { name: "Cuba", code: "CU" },
            { name: "Cyprus", code: "CY" },
            { name: "Czech Republic", code: "CZ" },
            { name: "Denmark", code: "DK" },
            { name: "Djibouti", code: "DJ" },
            { name: "Dominica", code: "DM" },
            { name: "Dominican Republic", code: "DO" },
            { name: "Ecuador", code: "EC" },
            { name: "Egypt", code: "EG" },
            { name: "El Salvador", code: "SV" },
            { name: "Equatorial Guinea", code: "GQ" },
            { name: "Eritrea", code: "ER" },
            { name: "Estonia", code: "EE" },
            { name: "Ethiopia", code: "ET" },
            { name: "Falkland Islands (Malvinas)", code: "FK" },
            { name: "Faroe Islands", code: "FO" },
            { name: "Fiji", code: "FJ" },
            { name: "Finland", code: "FI" },
            { name: "France", code: "FR" },
            { name: "French Guiana", code: "GF" },
            { name: "French Polynesia", code: "PF" },
            { name: "French Southern Territories", code: "TF" },
            { name: "Gabon", code: "GA" },
            { name: "Gambia", code: "GM" },
            { name: "Georgia", code: "GE" },
            { name: "Germany", code: "DE" },
            { name: "Ghana", code: "GH" },
            { name: "Gibraltar", code: "GI" },
            { name: "Greece", code: "GR" },
            { name: "Greenland", code: "GL" },
            { name: "Grenada", code: "GD" },
            { name: "Guadeloupe", code: "GP" },
            { name: "Guam", code: "GU" },
            { name: "Guatemala", code: "GT" },
            { name: "Guernsey", code: "GG" },
            { name: "Guinea", code: "GN" },
            { name: "Guinea-Bissau", code: "GW" },
            { name: "Guyana", code: "GY" },
            { name: "Haiti", code: "HT" },
            { name: "Heard Island and Mcdonald Islands", code: "HM" },
            { name: "Holy See (Vatican City State)", code: "VA" },
            { name: "Honduras", code: "HN" },
            { name: "Hong Kong", code: "HK" },
            { name: "Hungary", code: "HU" },
            { name: "Iceland", code: "IS" },
            { name: "India", code: "IN" },
            { name: "Indonesia", code: "ID" },
            { name: "Iran, Islamic Republic Of", code: "IR" },
            { name: "Iraq", code: "IQ" },
            { name: "Ireland", code: "IE" },
            { name: "Isle of Man", code: "IM" },
            { name: "Israel", code: "IL" },
            { name: "Italy", code: "IT" },
            { name: "Jamaica", code: "JM" },
            { name: "Japan", code: "JP" },
            { name: "Jersey", code: "JE" },
            { name: "Jordan", code: "JO" },
            { name: "Kazakhstan", code: "KZ" },
            { name: "Kenya", code: "KE" },
            { name: "Kiribati", code: "KI" },
            { name: "Korea, Democratic People'S Republic of", code: "KP" },
            { name: "Korea, Republic of", code: "KR" },
            { name: "Kuwait", code: "KW" },
            { name: "Kyrgyzstan", code: "KG" },
            { name: "Lao People'S Democratic Republic", code: "LA" },
            { name: "Latvia", code: "LV" },
            { name: "Lebanon", code: "LB" },
            { name: "Lesotho", code: "LS" },
            { name: "Liberia", code: "LR" },
            { name: "Libyan Arab Jamahiriya", code: "LY" },
            { name: "Liechtenstein", code: "LI" },
            { name: "Lithuania", code: "LT" },
            { name: "Luxembourg", code: "LU" },
            { name: "Macao", code: "MO" },
            { name: "Macedonia, The Former Yugoslav Republic of", code: "MK" },
            { name: "Madagascar", code: "MG" },
            { name: "Malawi", code: "MW" },
            { name: "Malaysia", code: "MY" },
            { name: "Maldives", code: "MV" },
            { name: "Mali", code: "ML" },
            { name: "Malta", code: "MT" },
            { name: "Marshall Islands", code: "MH" },
            { name: "Martinique", code: "MQ" },
            { name: "Mauritania", code: "MR" },
            { name: "Mauritius", code: "MU" },
            { name: "Mayotte", code: "YT" },
            { name: "Mexico", code: "MX" },
            { name: "Micronesia, Federated States of", code: "FM" },
            { name: "Moldova, Republic of", code: "MD" },
            { name: "Monaco", code: "MC" },
            { name: "Mongolia", code: "MN" },
            { name: "Montserrat", code: "MS" },
            { name: "Morocco", code: "MA" },
            { name: "Mozambique", code: "MZ" },
            { name: "Myanmar", code: "MM" },
            { name: "Namibia", code: "NA" },
            { name: "Nauru", code: "NR" },
            { name: "Nepal", code: "NP" },
            { name: "Netherlands", code: "NL" },
            { name: "Netherlands Antilles", code: "AN" },
            { name: "New Caledonia", code: "NC" },
            { name: "New Zealand", code: "NZ" },
            { name: "Nicaragua", code: "NI" },
            { name: "Niger", code: "NE" },
            { name: "Nigeria", code: "NG" },
            { name: "Niue", code: "NU" },
            { name: "Norfolk Island", code: "NF" },
            { name: "Northern Mariana Islands", code: "MP" },
            { name: "Norway", code: "NO" },
            { name: "Oman", code: "OM" },
            { name: "Pakistan", code: "PK" },
            { name: "Palau", code: "PW" },
            { name: "Palestinian Territory, Occupied", code: "PS" },
            { name: "Panama", code: "PA" },
            { name: "Papua New Guinea", code: "PG" },
            { name: "Paraguay", code: "PY" },
            { name: "Peru", code: "PE" },
            { name: "Philippines", code: "PH" },
            { name: "Pitcairn", code: "PN" },
            { name: "Poland", code: "PL" },
            { name: "Portugal", code: "PT" },
            { name: "Puerto Rico", code: "PR" },
            { name: "Qatar", code: "QA" },
            { name: "Reunion", code: "RE" },
            { name: "Romania", code: "RO" },
            { name: "Russian Federation", code: "RU" },
            { name: "RWANDA", code: "RW" },
            { name: "Saint Helena", code: "SH" },
            { name: "Saint Kitts and Nevis", code: "KN" },
            { name: "Saint Lucia", code: "LC" },
            { name: "Saint Pierre and Miquelon", code: "PM" },
            { name: "Saint Vincent and the Grenadines", code: "VC" },
            { name: "Samoa", code: "WS" },
            { name: "San Marino", code: "SM" },
            { name: "Sao Tome and Principe", code: "ST" },
            { name: "Saudi Arabia", code: "SA" },
            { name: "Senegal", code: "SN" },
            { name: "Serbia and Montenegro", code: "CS" },
            { name: "Seychelles", code: "SC" },
            { name: "Sierra Leone", code: "SL" },
            { name: "Singapore", code: "SG" },
            { name: "Slovakia", code: "SK" },
            { name: "Slovenia", code: "SI" },
            { name: "Solomon Islands", code: "SB" },
            { name: "Somalia", code: "SO" },
            { name: "South Africa", code: "ZA" },
            { name: "South Georgia and the South Sandwich Islands", code: "GS" },
            { name: "Spain", code: "ES" },
            { name: "Sri Lanka", code: "LK" },
            { name: "Sudan", code: "SD" },
            { name: "Suriname", code: "SR" },
            { name: "Svalbard and Jan Mayen", code: "SJ" },
            { name: "Swaziland", code: "SZ" },
            { name: "Sweden", code: "SE" },
            { name: "Switzerland", code: "CH" },
            { name: "Syrian Arab Republic", code: "SY" },
            { name: "Taiwan, Province of China", code: "TW" },
            { name: "Tajikistan", code: "TJ" },
            { name: "Tanzania, United Republic of", code: "TZ" },
            { name: "Thailand", code: "TH" },
            { name: "Timor-Leste", code: "TL" },
            { name: "Togo", code: "TG" },
            { name: "Tokelau", code: "TK" },
            { name: "Tonga", code: "TO" },
            { name: "Trinidad and Tobago", code: "TT" },
            { name: "Tunisia", code: "TN" },
            { name: "Turkey", code: "TR" },
            { name: "Turkmenistan", code: "TM" },
            { name: "Turks and Caicos Islands", code: "TC" },
            { name: "Tuvalu", code: "TV" },
            { name: "Uganda", code: "UG" },
            { name: "Ukraine", code: "UA" },
            { name: "United Arab Emirates", code: "AE" },
            { name: "United Kingdom", code: "GB" },
            { name: "United States", code: "US" },
            { name: "United States Minor Outlying Islands", code: "UM" },
            { name: "Uruguay", code: "UY" },
            { name: "Uzbekistan", code: "UZ" },
            { name: "Vanuatu", code: "VU" },
            { name: "Venezuela", code: "VE" },
            { name: "Viet Nam", code: "VN" },
            { name: "Virgin Islands, British", code: "VG" },
            { name: "Virgin Islands, U.S.", code: "VI" },
            { name: "Wallis and Futuna", code: "WF" },
            { name: "Western Sahara", code: "EH" },
            { name: "Yemen", code: "YE" },
            { name: "Zambia", code: "ZM" },
            { name: "Zimbabwe", code: "ZW" },
        ];
        this.currencyInfo = [
            {
                englishName: "Afghan Afghani (\u060B)",
                nativeName: "\u0627\u0641\u063A\u0627\u0646\u06CC \u0627\u0641\u063A\u0627\u0646\u0633\u062A\u0627\u0646",
                code: "AFN",
                symbol: "\u060B",
            },
            {
                englishName: "Albanian Lek (Lek\u00EB)",
                nativeName: "Leku shqiptar",
                code: "ALL",
                symbol: "Lek\u00EB",
            },
            {
                englishName: "Algerian Dinar (\u062F.\u062C.\u200F)",
                nativeName: "\u062F\u064A\u0646\u0627\u0631 \u062C\u0632\u0627\u0626\u0631\u064A",
                code: "DZD",
                symbol: "\u062F.\u062C.\u200F",
            },
            {
                englishName: "Angolan Kwanza (Kz)",
                nativeName: "Kwanza ya Ang\u00F3la",
                code: "AOA",
                symbol: "Kz",
            },
            {
                englishName: "Argentine Peso ($)",
                nativeName: "peso argentino",
                code: "ARS",
                symbol: "$",
            },
            {
                englishName: "Armenian Dram (\u058F)",
                nativeName: "\u0570\u0561\u0575\u056F\u0561\u056F\u0561\u0576 \u0564\u0580\u0561\u0574",
                code: "AMD",
                symbol: "\u058F",
            },
            {
                englishName: "Aruban Florin (Afl.)",
                nativeName: "Arubaanse gulden",
                code: "AWG",
                symbol: "Afl.",
            },
            {
                englishName: "Australian Dollar ($)",
                nativeName: "Australian Dollar",
                code: "AUD",
                symbol: "$",
            },
            {
                englishName: "Azerbaijani Manat (\u20BC)",
                nativeName: "AZN",
                code: "AZN",
                symbol: "\u20BC",
            },
            {
                englishName: "Bahamian Dollar ($)",
                nativeName: "Bahamian Dollar",
                code: "BSD",
                symbol: "$",
            },
            {
                englishName: "Bahraini Dinar (\u062F.\u0628.\u200F)",
                nativeName: "\u062F\u064A\u0646\u0627\u0631 \u0628\u062D\u0631\u064A\u0646\u064A",
                code: "BHD",
                symbol: "\u062F.\u0628.\u200F",
            },
            {
                englishName: "Bangladeshi Taka (\u09F3)",
                nativeName: "\u09AC\u09BE\u0982\u09B2\u09BE\u09A6\u09C7\u09B6\u09C0 \u099F\u09BE\u0995\u09BE",
                code: "BDT",
                symbol: "\u09F3",
            },
            {
                englishName: "Barbadian Dollar ($)",
                nativeName: "Barbadian Dollar",
                code: "BBD",
                symbol: "$",
            },
            {
                englishName: "Belarusian Ruble (Br)",
                nativeName: "\u0431\u0435\u043B\u0430\u0440\u0443\u0441\u043A\u0456 \u0440\u0443\u0431\u0435\u043B\u044C",
                code: "BYN",
                symbol: "Br",
            },
            {
                englishName: "Belize Dollar ($)",
                nativeName: "Belize Dollar",
                code: "BZD",
                symbol: "$",
            },
            {
                englishName: "Bermudan Dollar ($)",
                nativeName: "Bermudan Dollar",
                code: "BMD",
                symbol: "$",
            },
            {
                englishName: "Bhutanese Ngultrum (Nu.)",
                nativeName: "\u0F51\u0F44\u0F74\u0F63\u0F0B\u0F40\u0FB2\u0F58",
                code: "BTN",
                symbol: "Nu.",
            },
            {
                englishName: "Bolivian Boliviano (Bs)",
                nativeName: "boliviano",
                code: "BOB",
                symbol: "Bs",
            },
            {
                englishName: "Bosnia-Herzegovina Convertible Mark (\u041A\u041C)",
                nativeName: "\u041A\u043E\u043D\u0432\u0435\u0440\u0442\u0438\u0431\u0438\u043B\u043D\u0430 \u043C\u0430\u0440\u043A\u0430",
                code: "BAM",
                symbol: "\u041A\u041C",
            },
            {
                englishName: "Botswanan Pula (P)",
                nativeName: "Botswanan Pula",
                code: "BWP",
                symbol: "P",
            },
            {
                englishName: "Brazilian Real (R$)",
                nativeName: "real brasile\u00F1o",
                code: "BRL",
                symbol: "R$",
            },
            {
                englishName: "British Pound (\u00A3)",
                nativeName: "Punt Prydain",
                code: "GBP",
                symbol: "\u00A3",
            },
            {
                englishName: "Brunei Dollar ($)",
                nativeName: "Dolar Brunei",
                code: "BND",
                symbol: "$",
            },
            {
                englishName: "Bulgarian Lev (\u043B\u0432.)",
                nativeName: "\u0411\u044A\u043B\u0433\u0430\u0440\u0441\u043A\u0438 \u043B\u0435\u0432",
                code: "BGN",
                symbol: "\u043B\u0432.",
            },
            {
                englishName: "Burundian Franc (FBu)",
                nativeName: "Burundian Franc",
                code: "BIF",
                symbol: "FBu",
            },
            {
                englishName: "Cambodian Riel (\u17DB)",
                nativeName: "\u179A\u17C0\u179B\u200B\u1780\u1798\u17D2\u1796\u17BB\u1787\u17B6",
                code: "KHR",
                symbol: "\u17DB",
            },
            {
                englishName: "Canadian Dollar ($)",
                nativeName: "Canadian Dollar",
                code: "CAD",
                symbol: "$",
            },
            {
                englishName: "Cape Verdean Escudo (\u200B)",
                nativeName: "Skudu Kabuverdianu",
                code: "CVE",
                symbol: "\u200B",
            },
            {
                englishName: "Cayman Islands Dollar ($)",
                nativeName: "Cayman Islands Dollar",
                code: "KYD",
                symbol: "$",
            },
            {
                englishName: "Central African CFA Franc (FCFA)",
                nativeName: "CFA F\u00E0l\u00E2\u014B BEAC",
                code: "XAF",
                symbol: "FCFA",
            },
            {
                englishName: "CFP Franc (FCFP)",
                nativeName: "franc CFP",
                code: "XPF",
                symbol: "FCFP",
            },
            {
                englishName: "Chilean Peso (CLP)",
                nativeName: "CLP",
                code: "CLP",
                symbol: "CLP",
            },
            {
                englishName: "Chinese Yuan (\u00A5)",
                nativeName: "\u0F61\u0F74\u0F0B\u0F68\u0F53\u0F0B",
                code: "CNY",
                symbol: "\u00A5",
            },
            {
                englishName: "Colombian Peso ($)",
                nativeName: "peso colombiano",
                code: "COP",
                symbol: "$",
            },
            {
                englishName: "Comorian Franc (CF)",
                nativeName: "\u0641\u0631\u0646\u0643 \u062C\u0632\u0631 \u0627\u0644\u0642\u0645\u0631",
                code: "KMF",
                symbol: "CF",
            },
            {
                englishName: "Congolese Franc (FC)",
                nativeName: "franc congolais",
                code: "CDF",
                symbol: "FC",
            },
            {
                englishName: "Costa Rican Col\u00F3n (\u20A1)",
                nativeName: "col\u00F3n costarricense",
                code: "CRC",
                symbol: "\u20A1",
            },
            {
                englishName: "Croatian Kuna (HRK)",
                nativeName: "hrvatska kuna",
                code: "HRK",
                symbol: "HRK",
            },
            {
                englishName: "Cuban Peso ($)",
                nativeName: "peso cubano",
                code: "CUP",
                symbol: "$",
            },
            {
                englishName: "Czech Koruna (K\u010D)",
                nativeName: "\u010Desk\u00E1 koruna",
                code: "CZK",
                symbol: "K\u010D",
            },
            {
                englishName: "Danish Krone (kr.)",
                nativeName: "dansk krone",
                code: "DKK",
                symbol: "kr.",
            },
            {
                englishName: "Djiboutian Franc (Fdj)",
                nativeName: "DJF",
                code: "DJF",
                symbol: "Fdj",
            },
            {
                englishName: "Dominican Peso (RD$)",
                nativeName: "peso dominicano",
                code: "DOP",
                symbol: "RD$",
            },
            {
                englishName: "East Caribbean Dollar ($)",
                nativeName: "East Caribbean Dollar",
                code: "XCD",
                symbol: "$",
            },
            {
                englishName: "Egyptian Pound (\u062C.\u0645.\u200F)",
                nativeName: "\u062C\u0646\u064A\u0647 \u0645\u0635\u0631\u064A",
                code: "EGP",
                symbol: "\u062C.\u0645.\u200F",
            },
            {
                englishName: "Eritrean Nakfa (Nfk)",
                nativeName: "ERN",
                code: "ERN",
                symbol: "Nfk",
            },
            {
                englishName: "Ethiopian Birr (Br)",
                nativeName: "ETB",
                code: "ETB",
                symbol: "Br",
            },
            {
                englishName: "Euro (\u20AC)",
                nativeName: "euro",
                code: "EUR",
                symbol: "\u20AC",
            },
            {
                englishName: "Falkland Islands Pound (\u00A3)",
                nativeName: "Falkland Islands Pound",
                code: "FKP",
                symbol: "\u00A3",
            },
            {
                englishName: "Fijian Dollar ($)",
                nativeName: "Fijian Dollar",
                code: "FJD",
                symbol: "$",
            },
            {
                englishName: "Gambian Dalasi (D)",
                nativeName: "Gambian Dalasi",
                code: "GMD",
                symbol: "D",
            },
            {
                englishName: "Georgian Lari (\u20BE)",
                nativeName: "\u10E5\u10D0\u10E0\u10D7\u10E3\u10DA\u10D8 \u10DA\u10D0\u10E0\u10D8",
                code: "GEL",
                symbol: "\u20BE",
            },
            {
                englishName: "Ghanaian Cedi (GH\u20B5)",
                nativeName: "Ghana Sidi",
                code: "GHS",
                symbol: "GH\u20B5",
            },
            {
                englishName: "Gibraltar Pound (\u00A3)",
                nativeName: "Gibraltar Pound",
                code: "GIP",
                symbol: "\u00A3",
            },
            {
                englishName: "Guatemalan Quetzal (Q)",
                nativeName: "quetzal",
                code: "GTQ",
                symbol: "Q",
            },
            {
                englishName: "Guinean Franc (FG)",
                nativeName: "GNF",
                code: "GNF",
                symbol: "FG",
            },
            {
                englishName: "Guyanaese Dollar ($)",
                nativeName: "Guyanaese Dollar",
                code: "GYD",
                symbol: "$",
            },
            {
                englishName: "Haitian Gourde (G)",
                nativeName: "gourde ha\u00EFtienne",
                code: "HTG",
                symbol: "G",
            },
            {
                englishName: "Honduran Lempira (L)",
                nativeName: "lempira hondure\u00F1o",
                code: "HNL",
                symbol: "L",
            },
            {
                englishName: "Hong Kong Dollar (HK$)",
                nativeName: "Hong Kong Dollar",
                code: "HKD",
                symbol: "HK$",
            },
            {
                englishName: "Hungarian Forint (Ft)",
                nativeName: "magyar forint",
                code: "HUF",
                symbol: "Ft",
            },
            {
                englishName: "Icelandic Kr\u00F3na (ISK)",
                nativeName: "\u00EDslensk kr\u00F3na",
                code: "ISK",
                symbol: "ISK",
            },
            {
                englishName: "Indian Rupee (\u20B9)",
                nativeName: "\u09AD\u09BE\u09F0\u09A4\u09C0\u09AF\u09BC \u09F0\u09C1\u09AA\u09C0",
                code: "INR",
                symbol: "\u20B9",
            },
            {
                englishName: "Indonesian Rupiah (Rp)",
                nativeName: "Rupiah Indonesia",
                code: "IDR",
                symbol: "Rp",
            },
            {
                englishName: "Iranian Rial (IRR)",
                nativeName: "IRR",
                code: "IRR",
                symbol: "IRR",
            },
            {
                englishName: "Iraqi Dinar (\u062F.\u0639.\u200F)",
                nativeName: "\u062F\u064A\u0646\u0627\u0631 \u0639\u0631\u0627\u0642\u064A",
                code: "IQD",
                symbol: "\u062F.\u0639.\u200F",
            },
            {
                englishName: "Israeli New Shekel (\u20AA)",
                nativeName: "\u0634\u064A\u0643\u0644 \u0625\u0633\u0631\u0627\u0626\u064A\u0644\u064A \u062C\u062F\u064A\u062F",
                code: "ILS",
                symbol: "\u20AA",
            },
            {
                englishName: "Jamaican Dollar ($)",
                nativeName: "Jamaican Dollar",
                code: "JMD",
                symbol: "$",
            },
            {
                englishName: "Japanese Yen (\uFFE5)",
                nativeName: "\u65E5\u672C\u5186",
                code: "JPY",
                symbol: "\uFFE5",
            },
            {
                englishName: "Jordanian Dinar (\u062F.\u0623.\u200F)",
                nativeName: "\u062F\u064A\u0646\u0627\u0631 \u0623\u0631\u062F\u0646\u064A",
                code: "JOD",
                symbol: "\u062F.\u0623.\u200F",
            },
            {
                englishName: "Kazakhstani Tenge (\u20B8)",
                nativeName: "\u049A\u0430\u0437\u0430\u049B\u0441\u0442\u0430\u043D \u0442\u0435\u04A3\u0433\u0435\u0441\u0456",
                code: "KZT",
                symbol: "\u20B8",
            },
            {
                englishName: "Kenyan Shilling (Ksh)",
                nativeName: "Shilingi ya Kenya",
                code: "KES",
                symbol: "Ksh",
            },
            {
                englishName: "Kuwaiti Dinar (\u062F.\u0643.\u200F)",
                nativeName: "\u062F\u064A\u0646\u0627\u0631 \u0643\u0648\u064A\u062A\u064A",
                code: "KWD",
                symbol: "\u062F.\u0643.\u200F",
            },
            {
                englishName: "Kyrgystani Som (\u0441\u043E\u043C)",
                nativeName: "\u041A\u044B\u0440\u0433\u044B\u0437\u0441\u0442\u0430\u043D \u0441\u043E\u043C\u0443",
                code: "KGS",
                symbol: "\u0441\u043E\u043C",
            },
            {
                englishName: "Laotian Kip (\u20AD)",
                nativeName: "\u0EA5\u0EB2\u0EA7 \u0E81\u0EB5\u0E9A",
                code: "LAK",
                symbol: "\u20AD",
            },
            {
                englishName: "Lebanese Pound (\u0644.\u0644.\u200F)",
                nativeName: "\u062C\u0646\u064A\u0647 \u0644\u0628\u0646\u0627\u0646\u064A",
                code: "LBP",
                symbol: "\u0644.\u0644.\u200F",
            },
            {
                englishName: "Liberian Dollar ($)",
                nativeName: "Liberian Dollar",
                code: "LRD",
                symbol: "$",
            },
            {
                englishName: "Libyan Dinar (\u062F.\u0644.\u200F)",
                nativeName: "\u062F\u064A\u0646\u0627\u0631 \u0644\u064A\u0628\u064A",
                code: "LYD",
                symbol: "\u062F.\u0644.\u200F",
            },
            {
                englishName: "Macanese Pataca (MOP$)",
                nativeName: "Macanese Pataca",
                code: "MOP",
                symbol: "MOP$",
            },
            {
                englishName: "Macedonian Denar (\u0434\u0435\u043D)",
                nativeName: "\u041C\u0430\u043A\u0435\u0434\u043E\u043D\u0441\u043A\u0438 \u0434\u0435\u043D\u0430\u0440",
                code: "MKD",
                symbol: "\u0434\u0435\u043D",
            },
            {
                englishName: "Malagasy Ariary (Ar)",
                nativeName: "Malagasy Ariary",
                code: "MGA",
                symbol: "Ar",
            },
            {
                englishName: "Malawian Kwacha (MK)",
                nativeName: "Malawian Kwacha",
                code: "MWK",
                symbol: "MK",
            },
            {
                englishName: "Malaysian Ringgit (RM)",
                nativeName: "Malaysian Ringgit",
                code: "MYR",
                symbol: "RM",
            },
            {
                englishName: "Maldivian Rufiyaa (\u0783.)",
                nativeName: "MVR",
                code: "MVR",
                symbol: "\u0783.",
            },
            {
                englishName: "Mauritanian Ouguiya (\u0623.\u0645.)",
                nativeName: "\u0623\u0648\u0642\u064A\u0629 \u0645\u0648\u0631\u064A\u062A\u0627\u0646\u064A\u0629",
                code: "MRU",
                symbol: "\u0623.\u0645.",
            },
            {
                englishName: "Mauritian Rupee (Rs)",
                nativeName: "Mauritian Rupee",
                code: "MUR",
                symbol: "Rs",
            },
            {
                englishName: "Mexican Peso ($)",
                nativeName: "peso mexicano",
                code: "MXN",
                symbol: "$",
            },
            {
                englishName: "Moldovan Leu (L)",
                nativeName: "leu moldovenesc",
                code: "MDL",
                symbol: "L",
            },
            {
                englishName: "Mongolian Tugrik (\u20AE)",
                nativeName: "\u0442\u04E9\u0433\u0440\u04E9\u0433",
                code: "MNT",
                symbol: "\u20AE",
            },
            {
                englishName: "Moroccan Dirham (\u062F.\u0645.\u200F)",
                nativeName: "\u062F\u0631\u0647\u0645 \u0645\u063A\u0631\u0628\u064A",
                code: "MAD",
                symbol: "\u062F.\u0645.\u200F",
            },
            {
                englishName: "Mozambican Metical (MTn)",
                nativeName: "MZN",
                code: "MZN",
                symbol: "MTn",
            },
            {
                englishName: "Myanmar Kyat (K)",
                nativeName: "\u1019\u103C\u1014\u103A\u1019\u102C \u1000\u103B\u1015\u103A",
                code: "MMK",
                symbol: "K",
            },
            {
                englishName: "Namibian Dollar ($)",
                nativeName: "Namibiese dollar",
                code: "NAD",
                symbol: "$",
            },
            {
                englishName: "Nepalese Rupee (\u0928\u0947\u0930\u0942)",
                nativeName: "\u0928\u0947\u092A\u093E\u0932\u0940 \u0930\u0942\u092A\u0948\u092F\u093E\u0901",
                code: "NPR",
                symbol: "\u0928\u0947\u0930\u0942",
            },
            {
                englishName: "Netherlands Antillean Guilder (NAf.)",
                nativeName: "Netherlands Antillean Guilder",
                code: "ANG",
                symbol: "NAf.",
            },
            {
                englishName: "New Taiwan Dollar ($)",
                nativeName: "\u65B0\u53F0\u5E63",
                code: "TWD",
                symbol: "$",
            },
            {
                englishName: "New Zealand Dollar ($)",
                nativeName: "New Zealand Dollar",
                code: "NZD",
                symbol: "$",
            },
            {
                englishName: "Nicaraguan C\u00F3rdoba (C$)",
                nativeName: "c\u00F3rdoba nicarag\u00FCense",
                code: "NIO",
                symbol: "C$",
            },
            {
                englishName: "Nigerian Naira (\u20A6)",
                nativeName: "Nigerian Naira",
                code: "NGN",
                symbol: "\u20A6",
            },
            {
                englishName: "North Korean Won (KPW)",
                nativeName: "\uC870\uC120 \uBBFC\uC8FC\uC8FC\uC758 \uC778\uBBFC \uACF5\uD654\uAD6D \uC6D0",
                code: "KPW",
                symbol: "KPW",
            },
            {
                englishName: "Norwegian Krone (kr)",
                nativeName: "norske kroner",
                code: "NOK",
                symbol: "kr",
            },
            {
                englishName: "Omani Rial (\u0631.\u0639.\u200F)",
                nativeName: "\u0631\u064A\u0627\u0644 \u0639\u0645\u0627\u0646\u064A",
                code: "OMR",
                symbol: "\u0631.\u0639.\u200F",
            },
            {
                englishName: "Pakistani Rupee (Rs)",
                nativeName: "Pakistani Rupee",
                code: "PKR",
                symbol: "Rs",
            },
            {
                englishName: "Panamanian Balboa (B/.)",
                nativeName: "balboa paname\u00F1o",
                code: "PAB",
                symbol: "B/.",
            },
            {
                englishName: "Papua New Guinean Kina (K)",
                nativeName: "Papua New Guinean Kina",
                code: "PGK",
                symbol: "K",
            },
            {
                englishName: "Paraguayan Guarani (Gs.)",
                nativeName: "guaran\u00ED paraguayo",
                code: "PYG",
                symbol: "Gs.",
            },
            {
                englishName: "Peruvian Sol (S/)",
                nativeName: "sol peruano",
                code: "PEN",
                symbol: "S/",
            },
            {
                englishName: "Philippine Piso (\u20B1)",
                nativeName: "PHP",
                code: "PHP",
                symbol: "\u20B1",
            },
            {
                englishName: "Polish Zloty (z\u0142)",
                nativeName: "z\u0142oty polski",
                code: "PLN",
                symbol: "z\u0142",
            },
            {
                englishName: "Qatari Rial (\u0631.\u0642.\u200F)",
                nativeName: "\u0631\u064A\u0627\u0644 \u0642\u0637\u0631\u064A",
                code: "QAR",
                symbol: "\u0631.\u0642.\u200F",
            },
            {
                englishName: "Romanian Leu (RON)",
                nativeName: "leu rom\u00E2nesc",
                code: "RON",
                symbol: "RON",
            },
            {
                englishName: "Russian Ruble (RUB)",
                nativeName: "RUB",
                code: "RUB",
                symbol: "RUB",
            },
            {
                englishName: "Rwandan Franc (RF)",
                nativeName: "Rwandan Franc",
                code: "RWF",
                symbol: "RF",
            },
            {
                englishName: "Samoan Tala (WS$)",
                nativeName: "Samoan Tala",
                code: "WST",
                symbol: "WS$",
            },
            {
                englishName: "S\u00E3o Tom\u00E9 \u0026 Pr\u00EDncipe Dobra (Db)",
                nativeName: "dobra de S\u00E3o Tom\u00E9 e Pr\u00EDncipe",
                code: "STN",
                symbol: "Db",
            },
            {
                englishName: "Saudi Riyal (\u0631.\u0633.\u200F)",
                nativeName: "\u0631\u064A\u0627\u0644 \u0633\u0639\u0648\u062F\u064A",
                code: "SAR",
                symbol: "\u0631.\u0633.\u200F",
            },
            {
                englishName: "Serbian Dinar (RSD)",
                nativeName: "\u0421\u0440\u043F\u0441\u043A\u0438 \u0434\u0438\u043D\u0430\u0440",
                code: "RSD",
                symbol: "RSD",
            },
            {
                englishName: "Seychellois Rupee (SR)",
                nativeName: "Seychellois Rupee",
                code: "SCR",
                symbol: "SR",
            },
            {
                englishName: "Sierra Leonean Leone (Le)",
                nativeName: "Sierra Leonean Leone",
                code: "SLL",
                symbol: "Le",
            },
            {
                englishName: "Singapore Dollar ($)",
                nativeName: "Singapore Dollar",
                code: "SGD",
                symbol: "$",
            },
            {
                englishName: "Solomon Islands Dollar ($)",
                nativeName: "Solomon Islands Dollar",
                code: "SBD",
                symbol: "$",
            },
            {
                englishName: "Somali Shilling (S)",
                nativeName: "\u0634\u0644\u0646 \u0635\u0648\u0645\u0627\u0644\u064A",
                code: "SOS",
                symbol: "S",
            },
            {
                englishName: "South African Rand (R)",
                nativeName: "Suid-Afrikaanse rand",
                code: "ZAR",
                symbol: "R",
            },
            {
                englishName: "South Korean Won (\u20A9)",
                nativeName: "\uB300\uD55C\uBBFC\uAD6D \uC6D0",
                code: "KRW",
                symbol: "\u20A9",
            },
            {
                englishName: "South Sudanese Pound (\u00A3)",
                nativeName: "\u062C\u0646\u064A\u0647 \u062C\u0646\u0648\u0628 \u0627\u0644\u0633\u0648\u062F\u0627\u0646",
                code: "SSP",
                symbol: "\u00A3",
            },
            {
                englishName: "Sri Lankan Rupee (\u0DBB\u0DD4.)",
                nativeName: "\u0DC1\u0DCA\u200D\u0DBB\u0DD3 \u0DBD\u0D82\u0D9A\u0DCF \u0DBB\u0DD4\u0DB4\u0DD2\u0DBA\u0DBD",
                code: "LKR",
                symbol: "\u0DBB\u0DD4.",
            },
            {
                englishName: "St. Helena Pound (\u00A3)",
                nativeName: "St. Helena Pound",
                code: "SHP",
                symbol: "\u00A3",
            },
            {
                englishName: "Sudanese Pound (\u062C.\u0633.)",
                nativeName: "\u062C\u0646\u064A\u0647 \u0633\u0648\u062F\u0627\u0646\u064A",
                code: "SDG",
                symbol: "\u062C.\u0633.",
            },
            {
                englishName: "Surinamese Dollar ($)",
                nativeName: "Surinaamse dollar",
                code: "SRD",
                symbol: "$",
            },
            {
                englishName: "Swazi Lilangeni (E)",
                nativeName: "Swazi Lilangeni",
                code: "SZL",
                symbol: "E",
            },
            {
                englishName: "Swedish Krona (kr)",
                nativeName: "Swedish Krona",
                code: "SEK",
                symbol: "kr",
            },
            {
                englishName: "Swiss Franc (CHF)",
                nativeName: "Schweizer Franken",
                code: "CHF",
                symbol: "CHF",
            },
            {
                englishName: "Syrian Pound (\u0644.\u0633.\u200F)",
                nativeName: "\u0644\u064A\u0631\u0629 \u0633\u0648\u0631\u064A\u0629",
                code: "SYP",
                symbol: "\u0644.\u0633.\u200F",
            },
            {
                englishName: "Tajikistani Somoni (\u0441\u043E\u043C.)",
                nativeName: "\u0421\u043E\u043C\u043E\u043D\u04E3",
                code: "TJS",
                symbol: "\u0441\u043E\u043C.",
            },
            {
                englishName: "Tanzanian Shilling (TSh)",
                nativeName: "shilingi ya Tandhania",
                code: "TZS",
                symbol: "TSh",
            },
            {
                englishName: "Thai Baht (\u0E3F)",
                nativeName: "\u0E1A\u0E32\u0E17",
                code: "THB",
                symbol: "\u0E3F",
            },
            {
                englishName: "Tongan Pa\u02BBanga (T$)",
                nativeName: "Tongan Pa\u02BBanga",
                code: "TOP",
                symbol: "T$",
            },
            {
                englishName: "Trinidad \u0026 Tobago Dollar ($)",
                nativeName: "Trinidad \u0026 Tobago Dollar",
                code: "TTD",
                symbol: "$",
            },
            {
                englishName: "Tunisian Dinar (\u062F.\u062A.\u200F)",
                nativeName: "\u062F\u064A\u0646\u0627\u0631 \u062A\u0648\u0646\u0633\u064A",
                code: "TND",
                symbol: "\u062F.\u062A.\u200F",
            },
            {
                englishName: "Turkish Lira (\u20BA)",
                nativeName: "T\u00FCrk Liras\u0131",
                code: "TRY",
                symbol: "\u20BA",
            },
            {
                englishName: "Turkmenistani Manat (TMT)",
                nativeName: "T\u00FCrkmen manady",
                code: "TMT",
                symbol: "TMT",
            },
            {
                englishName: "Ugandan Shilling (USh)",
                nativeName: "Eshiringi ya Uganda",
                code: "UGX",
                symbol: "USh",
            },
            {
                englishName: "Ukrainian Hryvnia (\u20B4)",
                nativeName: "\u0443\u043A\u0440\u0430\u0438\u043D\u0441\u043A\u0430\u044F \u0433\u0440\u0438\u0432\u043D\u0430",
                code: "UAH",
                symbol: "\u20B4",
            },
            {
                englishName: "United Arab Emirates Dirham (\u062F.\u0625.\u200F)",
                nativeName: "\u062F\u0631\u0647\u0645 \u0625\u0645\u0627\u0631\u0627\u062A\u064A",
                code: "AED",
                symbol: "\u062F.\u0625.\u200F",
            },
            {
                englishName: "Uruguayan Peso ($)",
                nativeName: "peso uruguayo",
                code: "UYU",
                symbol: "$",
            },
            {
                englishName: "US Dollar ($)",
                nativeName: "US \u13A0\u13D5\u13B3",
                code: "USD",
                symbol: "$",
            },
            {
                englishName: "Uzbekistani Som (\u0441\u045E\u043C)",
                nativeName: "\u040E\u0437\u0431\u0435\u043A\u0438\u0441\u0442\u043E\u043D \u0441\u045E\u043C",
                code: "UZS",
                symbol: "\u0441\u045E\u043C",
            },
            {
                englishName: "Vanuatu Vatu (VT)",
                nativeName: "Vanuatu Vatu",
                code: "VUV",
                symbol: "VT",
            },
            {
                englishName: "Venezuelan Bol\u00EDvar (Bs.S)",
                nativeName: "bol\u00EDvar soberano",
                code: "VES",
                symbol: "Bs.S",
            },
            {
                englishName: "Vietnamese Dong (\u20AB)",
                nativeName: "\u0110\u1ED3ng Vi\u1EC7t Nam",
                code: "VND",
                symbol: "\u20AB",
            },
            {
                englishName: "West African CFA Franc (CFA)",
                nativeName: "sefa Fra\u014B (BCEAO)",
                code: "XOF",
                symbol: "CFA",
            },
            {
                englishName: "Yemeni Rial (\u0631.\u064A.\u200F)",
                nativeName: "\u0631\u064A\u0627\u0644 \u064A\u0645\u0646\u064A",
                code: "YER",
                symbol: "\u0631.\u064A.\u200F",
            },
            {
                englishName: "Zambian Kwacha (K)",
                nativeName: "ZMW",
                code: "ZMW",
                symbol: "K",
            },
        ];
        this.elementTypes = {
            AddressElement: "Address",
            Text_BoxElement: "StiTextBoxControl",
            TextElement: "StiText",
            TableElement: "StiTable",
            Single_SelectionElement: "StiSingleSelection",
            SignatureElement: "StiElectronicSignature",
            PDFSignatureElement: "StiPdfDigitalSignature",
            PanelElement: "StiPanel",
            Number_BoxElement: "StiNumberBox",
            Multiple_SelectionElement: "StiMultipleSelection",
            List_BoxElement: "StiListBox",
            LabelElement: "StiLabelControl",
            ImageElement: "StiImage",
            LineElement: "Line",
            DateTime_BoxElement: "StiDateTimePickerControl",
            Combo_BoxElement: "StiComboBox",
            Check_BoxElement: "StiCheckBox",
            ButtonElement: "StiButton",
            BarCodeElement: "StiBarCode",
            StiPageElement: "StiPage",
        };
        this.elementCategories = {
            AddressElement: "Report",
            Text_BoxElement: "Dialogs",
            LineElement: "Chart",
            DateTime_BoxElement: "Dialogs",
            LabelElement: "Dialogs",
        };
        StiLocalizationService.needToRefresh.subscribe(() => {
            this.updateHelper();
        });
    }
    get richTextFontSizes() {
        if (this._richTextFontSizes.length === 0) {
            this._richTextFontSizes.push({ name: "8", value: 1 });
            this._richTextFontSizes.push({ name: "10", value: 2 });
            this._richTextFontSizes.push({ name: "12", value: 3 });
            this._richTextFontSizes.push({ name: "14", value: 4 });
            this._richTextFontSizes.push({ name: "18", value: 5 });
            this._richTextFontSizes.push({ name: "24", value: 6 });
            this._richTextFontSizes.push({ name: "36", value: 7 });
        }
        return this._richTextFontSizes;
    }
    get fontSizes() {
        return this._fontSizes;
    }
    getLocalizationKey(type) {
        return this.elementTypes[type];
    }
    getLocalizationCategory(type) {
        return this.elementCategories[type] ? this.elementCategories[type] : "Components";
    }
    get errorCorrectionLevel() {
        return this._errorCorrectionLevel;
    }
    get bodyShapeType() {
        return this._bodyShapeType;
    }
    get eyeFrameShapeType() {
        return this._eyeFrameShapeType;
    }
    get eyeBallShapeType() {
        return this._eyeBallShapeType;
    }
    get brushIdent() {
        return this._brushIdent;
    }
    get bodyBrush() {
        return this._bodyBrush;
    }
    get dataMatrixSize() {
        return this._dataMatrixSize;
    }
    get numberTypes() {
        if (this._numberTypes.length === 0) {
            this._numberTypes.push({
                name: StiLocalizationService.get("FormFormatEditor", "Number"),
                value: "Decimal",
            });
            this._numberTypes.push({
                name: StiLocalizationService.get("FormFormatEditor", "Currency"),
                value: "Currency",
            });
        }
        return this._numberTypes;
    }
    get rangeFormats() {
        if (this._rangeFormats.length === 0) {
            this._rangeFormats.push({
                name: StiLocalizationService.get("PropertyEnum", "Digits"),
                value: "Digits",
            });
            this._rangeFormats.push({
                name: StiLocalizationService.get("PropertyEnum", "Values"),
                value: "Values",
            });
        }
        return this._rangeFormats;
    }
    get signatureTypes() {
        if (this._signatureTypes.length === 0) {
            this._signatureTypes.push({
                name: StiLocalizationService.get("Components", "StiElectronicSignature"),
                value: "Signature",
            });
            this._signatureTypes.push({
                name: StiLocalizationService.get("Components", "StiPdfDigitalSignature"),
                value: "DigitalSignature",
            });
        }
        return this._signatureTypes;
    }
    get columnTypes() {
        if (this._columnTypes.length === 0) {
            this._columnTypes.push({ name: StiLocalizationService.get("Components", "StiCheckBox"), value: "CheckBox" });
            this._columnTypes.push({ name: StiLocalizationService.get("Components", "StiComboBox"), value: "ComboBox" });
            this._columnTypes.push({ name: StiLocalizationService.get("Dialogs", "StiLabelControl"), value: "Label" });
            this._columnTypes.push({
                name: StiLocalizationService.get("Components", "StiSingleSelection"),
                value: "RadioButton",
            });
            this._columnTypes.push({ name: StiLocalizationService.get("Dialogs", "StiTextBoxControl"), value: "TextBox" });
            this._columnTypes.push({ name: StiLocalizationService.get("Components", "StiNumberBox"), value: "NumberBox" });
        }
        return this._columnTypes;
    }
    get buttonTypes() {
        if (this._buttonTypes.length === 0) {
            this._buttonTypes.push({
                name: StiLocalizationService.get("Gui", "monthcalendar_clearbutton"),
                value: "ClearForm",
            });
            this._buttonTypes.push({
                name: StiLocalizationService.get("A_WebViewer", "ButtonSend"),
                value: "SendForm",
            });
            this._buttonTypes.push({
                name: StiLocalizationService.get("Buttons", "Attach"),
                value: "AttachFiles",
            });
        }
        return this._buttonTypes;
    }
    get algorithmExpressions() {
        if (this._algorithmExpressions.length === 0) {
            this._algorithmExpressions.push({ name: "Constant", value: "Constant" });
            this._algorithmExpressions.push({ name: "Number cell value", value: "NumberCellValue" });
            this._algorithmExpressions.push({ name: "Number column max", value: "NumberColumnMax" });
            this._algorithmExpressions.push({ name: "Number column sum", value: "NumberColumnSum" });
        }
        return this._algorithmExpressions;
    }
    get buttonSendTypes() {
        if (this._buttonSendTypes.length === 0) {
            this._buttonSendTypes.push({
                name: StiLocalizationService.get("PropertyEnum", "StiButtonSendTypeFDF"),
                value: "FDF",
            });
            this._buttonSendTypes.push({
                name: StiLocalizationService.get("PropertyEnum", "StiButtonSendTypeHTML"),
                value: "HTML",
            });
            this._buttonSendTypes.push({
                name: StiLocalizationService.get("PropertyEnum", "StiButtonSendTypeXFDF"),
                value: "XFDF",
            });
            this._buttonSendTypes.push({
                name: StiLocalizationService.get("PropertyEnum", "StiButtonSendTypePDF"),
                value: "PDF",
            });
        }
        return this._buttonSendTypes;
    }
    get barcodeTypes() {
        if (this._barcodeTypes.length === 0) {
            Enum.getValues(StiBarcodeType).forEach((t) => {
                let name = Enum.getName(StiBarcodeType, t);
                this._barcodeTypes.push({ name: name, value: name });
            });
        }
        return this._barcodeTypes;
    }
    get dateTimeTypes() {
        if (this._dateTimeTypes.length === 0) {
            this._dateTimeTypes.push({
                name: StiLocalizationService.get("PropertyEnum", "StiDateTimeTypeDateAndTime"),
                value: "DateTime",
            });
            this._dateTimeTypes.push({ name: StiLocalizationService.get("FormFormatEditor", "Date"), value: "Date" });
            this._dateTimeTypes.push({ name: StiLocalizationService.get("FormFormatEditor", "Time"), value: "Time" });
        }
        return this._dateTimeTypes;
    }
    get penStyles() {
        if (this._penStyles.length === 0) {
            this._penStyles.push({ name: StiLocalizationService.get("PropertyEnum", "StiPenStyleSolid"), value: "Solid" });
            this._penStyles.push({ name: StiLocalizationService.get("PropertyEnum", "StiPenStyleDash"), value: "Dash" });
            this._penStyles.push({ name: StiLocalizationService.get("PropertyEnum", "StiPenStyleDot"), value: "Dot" });
        }
        return this._penStyles;
    }
    get dateTimeFormats() {
        if (this._dateTimeFormats.length === 0) {
            this._dateTimeFormats.push({ name: "m/d/yy h:MM tt", value: "m/d/yy h:MM tt" });
            this._dateTimeFormats.push({ name: "m/d/yyyy h:MM tt", value: "m/d/yyyy h:MM tt" });
            this._dateTimeFormats.push({ name: "m/d/yy HH:MM", value: "m/d/yy HH:MM" });
            this._dateTimeFormats.push({ name: "m/d/yyyy HH:MM", value: "m/d/yyyy HH:MM" });
            this._dateTimeFormats.push({ name: "m/d", value: "m/d" });
            this._dateTimeFormats.push({ name: "m/d/yy", value: "m/d/yy" });
            this._dateTimeFormats.push({ name: "m/d/yyyy", value: "m/d/yyyy" });
            this._dateTimeFormats.push({ name: "mm/dd/yy", value: "mm/dd/yy" });
            this._dateTimeFormats.push({ name: "mm/dd/yyyy", value: "mm/dd/yyyy" });
            this._dateTimeFormats.push({ name: "mm/yy", value: "mm/yy" });
            this._dateTimeFormats.push({ name: "mm/yyyy", value: "mm/yyyy" });
            this._dateTimeFormats.push({ name: "mmm-yy", value: "mmm-yy" });
            this._dateTimeFormats.push({ name: "mmm-yyyy", value: "mmm-yyyy" });
            this._dateTimeFormats.push({ name: "mmmm-yy", value: "mmmm-yy" });
            this._dateTimeFormats.push({ name: "mmmm-yyyy", value: "mmmm-yyyy" });
            this._dateTimeFormats.push({ name: "mmm d, yyyy", value: "mmm d, yyyy" });
            this._dateTimeFormats.push({ name: "mmmm d, yyyy", value: "mmmm d, yyyy" });
            this._dateTimeFormats.push({ name: "dd.mm.yyyy HH:MM", value: "dd.mm.yyyy HH:MM" });
            this._dateTimeFormats.push({ name: "d-mmm", value: "d-mmm" });
            this._dateTimeFormats.push({ name: "d-mmm-yy", value: "d-mmm-yy" });
            this._dateTimeFormats.push({ name: "d-mmm-yyyy", value: "d-mmm-yyyy" });
            this._dateTimeFormats.push({ name: "dd-mmm-yy", value: "dd-mmm-yy" });
            this._dateTimeFormats.push({ name: "dd-mmm-yyyy", value: "dd-mmm-yyyy" });
            this._dateTimeFormats.push({ name: "dd.mm.yyyy", value: "dd.mm.yyyy" });
            this._dateTimeFormats.push({ name: "yy-mm-dd", value: "yy-mm-dd" });
            this._dateTimeFormats.push({ name: "yyyy-mm-dd", value: "yyyy-mm-dd" });
            this._dateTimeFormats.push({ name: "HH:MM", value: "HH:MM" });
            this._dateTimeFormats.push({ name: "h:MM tt", value: "h:MM tt" });
            this._dateTimeFormats.push({ name: "HH:MM:ss", value: "HH:MM:ss" });
            this._dateTimeFormats.push({ name: "h:MM:ss tt", value: "h:MM:ss tt" });
        }
        return this._dateTimeFormats;
    }
    get dateFormats() {
        if (this._dateFormats.length === 0) {
            this._dateFormats.push({ name: "m/d", value: "m/d" });
            this._dateFormats.push({ name: "m/d/yy", value: "m/d/yy" });
            this._dateFormats.push({ name: "m/d/yyyy", value: "m/d/yyyy" });
            this._dateFormats.push({ name: "mm/dd/yy", value: "mm/dd/yy" });
            this._dateFormats.push({ name: "mm/dd/yyyy", value: "mm/dd/yyyy" });
            this._dateFormats.push({ name: "mm/yy", value: "mm/yy" });
            this._dateFormats.push({ name: "mm/yyyy", value: "mm/yyyy" });
            this._dateFormats.push({ name: "mmm-yy", value: "mmm-yy" });
            this._dateFormats.push({ name: "mmm-yyyy", value: "mmm-yyyy" });
            this._dateFormats.push({ name: "mmmm-yy", value: "mmmm-yy" });
            this._dateFormats.push({ name: "mmmm-yyyy", value: "mmmm-yyyy" });
            this._dateFormats.push({ name: "mmm d, yyyy", value: "mmm d, yyyy" });
            this._dateFormats.push({ name: "mmmm d, yyyy", value: "mmmm d, yyyy" });
            this._dateFormats.push({ name: "d-mmm", value: "d-mmm" });
            this._dateFormats.push({ name: "d-mmm-yy", value: "d-mmm-yy" });
            this._dateFormats.push({ name: "d-mmm-yyyy", value: "d-mmm-yyyy" });
            this._dateFormats.push({ name: "dd-mmm-yy", value: "dd-mmm-yy" });
            this._dateFormats.push({ name: "dd-mmm-yyyy", value: "dd-mmm-yyyy" });
            this._dateFormats.push({ name: "dd.mm.yyyy", value: "dd.mm.yyyy" });
            this._dateFormats.push({ name: "yy-mm-dd", value: "yy-mm-dd" });
            this._dateFormats.push({ name: "yyyy-mm-dd", value: "yyyy-mm-dd" });
        }
        return this._dateFormats;
    }
    get timeFormats() {
        if (this._timeFormats.length === 0) {
            this._timeFormats.push({ name: "HH:MM", value: "HH:MM" });
            this._timeFormats.push({ name: "h:MM tt", value: "h:MM tt" });
            this._timeFormats.push({ name: "HH:MM:ss", value: "HH:MM:ss" });
            this._timeFormats.push({ name: "h:MM:ss tt", value: "h:MM:ss tt" });
        }
        return this._timeFormats;
    }
    get signatureEditorModes() {
        if (this._signatureEditorModes.length === 0) {
            this._signatureEditorModes.push({
                name: StiLocalizationService.get("PropertyEnum", "StiSignatureTypeType"),
                value: "Type",
            });
            this._signatureEditorModes.push({
                name: StiLocalizationService.get("PropertyEnum", "StiSignatureTypeDraw"),
                value: "Draw",
            });
        }
        return this._signatureEditorModes;
    }
    get signatureSpecialFonts() {
        if (this._signatureSpecialFonts.length === 0) {
            this._signatureSpecialFonts.push({
                name: `${StiLocalizationService.get("PropertyMain", "Style")}${1}`,
                value: "Teddy Bear",
            });
            this._signatureSpecialFonts.push({
                name: `${StiLocalizationService.get("PropertyMain", "Style")}${2}`,
                value: "MADE Likes Script",
            });
            this._signatureSpecialFonts.push({
                name: `${StiLocalizationService.get("PropertyMain", "Style")}${3}`,
                value: "Denistina",
            });
        }
        return this._signatureSpecialFonts;
    }
    get dateTimeValues() {
        if (this._dateTimeValues.length === 0) {
            this._dateTimeValues.push({
                name: StiLocalizationService.get("Gui", "colorpickerdialog_currentcolorlabel"),
                value: "Current",
            });
            this._dateTimeValues.push({
                name: StiLocalizationService.get("PropertyEnum", "DateTimePickerFormatCustom"),
                value: "Custom",
            });
        }
        return this._dateTimeValues;
    }
    get themes() {
        if (this._themes.length === 0) {
            this._themes.push({ name: "Light" });
            this._themes.push({ name: "Dark" });
        }
        return this._themes;
    }
    get borderWeights() {
        if (this._borderWeights.length === 0) {
            this._borderWeights.push({
                name: StiLocalizationService.get("PropertyEnum", "StiLineWeightThin"),
                value: "Thin",
            });
            this._borderWeights.push({
                name: StiLocalizationService.get("PropertyEnum", "StiLineWeightNormal"),
                value: "Normal",
            });
            this._borderWeights.push({
                name: StiLocalizationService.get("PropertyEnum", "StiLineWeightThick"),
                value: "Thick",
            });
        }
        return this._borderWeights;
    }
    get unitAlignment() {
        if (this._unitAlignment.length === 0) {
            this._unitAlignment.push({
                name: StiLocalizationService.get("PropertyEnum", "StiUnitAlignmentPrefix"),
                value: 1,
            });
            this._unitAlignment.push({
                name: StiLocalizationService.get("PropertyEnum", "StiUnitAlignmentSuffix"),
                value: 2,
            });
            this._unitAlignment.push({
                name: StiLocalizationService.get("PropertyEnum", "StiUnitAlignmentPrefixInside"),
                value: 3,
            });
            this._unitAlignment.push({
                name: StiLocalizationService.get("PropertyEnum", "StiUnitAlignmentPrefixInsideWithSpace"),
                value: 4,
            });
            this._unitAlignment.push({
                name: StiLocalizationService.get("PropertyEnum", "StiUnitAlignmentSuffixInside"),
                value: 5,
            });
            this._unitAlignment.push({
                name: StiLocalizationService.get("PropertyEnum", "StiUnitAlignmentSuffixInsideWithSpace"),
                value: 6,
            });
        }
        return this._unitAlignment;
    }
    get minUnitAlignment() {
        if (this._minUnitAlignment.length === 0) {
            this._minUnitAlignment.push({
                name: StiLocalizationService.get("PropertyEnum", "StiUnitAlignmentPrefix"),
                value: 1,
            });
            this._minUnitAlignment.push({
                name: StiLocalizationService.get("PropertyEnum", "StiUnitAlignmentSuffix"),
                value: 2,
            });
        }
        return this._minUnitAlignment;
    }
    get labelFormat() {
        if (this._labelFormat.length === 0) {
            this._labelFormat.push({ name: "Symbol", value: 1 });
            this._labelFormat.push({ name: "Code", value: 2 });
        }
        return this._labelFormat;
    }
    get thousandSeparators() {
        if (this._thousandSeparators.length === 0) {
            this._thousandSeparators.push({ name: "1234567.89", value: "None" });
            this._thousandSeparators.push({ name: "1234567,89", value: "NoneComma" });
            this._thousandSeparators.push({ name: "1,234,567.89", value: "Comma" });
            this._thousandSeparators.push({ name: "1.234.567,89", value: "Dot" });
            this._thousandSeparators.push({ name: "1`234`567.89", value: "Apostrophe" });
        }
        return this._thousandSeparators;
    }
    updateHelper() {
        this._minUnitAlignment = [];
        this._unitAlignment = [];
        this._borderWeights = [];
        this._dateTimeValues = [];
        this._penStyles = [];
        this._dateTimeTypes = [];
        this._buttonSendTypes = [];
        this._buttonTypes = [];
        this._signatureTypes = [];
        this._numberTypes = [];
    }
    deleteSelectedComponent() {
        let fromPanel = true;
        if (this.model.selectedComponent) {
            let container = this.model.getElementPage(this.model.selectedComponent.element) ??
                this.model.getElementPanel(this.model.selectedComponent.element);
            container.elements.splice(container.elements.indexOf(this.model.selectedComponent.element), 1);
            this.render.removeElement(this.model.selectedComponent.element, container.elements);
            this.model.selectedComponent = null;
            this.model.formEvents.next({ name: "ComponentDeleted" });
            this.model.cursor = "default";
        }
    }
    getElementClass(type) {
        if (type == "TextElement" || type == "Text") {
            return StiTextElement;
        }
        else if (type == "Text_BoxElement" || type == "TextBox") {
            return StiTextBoxElement;
        }
        else if (type == "TableElement" || type == "Table") {
            return StiTableElement;
        }
        else if (type == "Single_SelectionElement" || type == "SingleSelection") {
            return StiSingleSelectionElement;
        }
        else if (type == "SignatureElement" || type == "Signature") {
            return StiSignatureElement;
        }
        else if (type == "PDFSignatureElement" || type == "PDFSignature") {
            return StiPDFSignatureElement;
        }
        else if (type == "PanelElement" || type == "Panel") {
            return StiPanelElement;
        }
        else if (type == "Number_BoxElement" || type == "NumberBox") {
            return StiNumberBoxElement;
        }
        else if (type == "Multiple_SelectionElement" || type == "MultipleSelection") {
            return StiMultipleSelectionElement;
        }
        else if (type == "List_BoxElement" || type == "ListBox") {
            return StiListBoxElement;
        }
        else if (type == "LineElement" || type == "Line") {
            return StiLineElement;
        }
        else if (type == "LabelElement" || type == "Label") {
            return StiLabelElement;
        }
        else if (type == "ImageElement" || type == "Image") {
            return StiImageElement;
        }
        else if (type == "DateTime_BoxElement" || type == "DateTimeBox") {
            return StiDateTimeBoxElement;
        }
        else if (type == "Combo_BoxElement" || type == "ComboBox") {
            return StiComboBoxElement;
        }
        else if (type == "Check_BoxElement" || type == "CheckBox") {
            return StiCheckBoxElement;
        }
        else if (type == "ButtonElement" || type == "Button") {
            return StiButtonElement;
        }
        else if (type == "BarCodeElement" || type == "BarCode") {
            return StiBarcodeElement;
        }
        else if (type == "AddressElement" || type == "Address") {
            return StiAddressElement;
        }
        else if (type == "Page") {
            return StiFormPageElement;
        }
        else if (type == "Form") {
            return StiForm;
        }
        // return this.pageElement.getElementTypes()[type] ?? StiPanelElement;
    }
    clone(element) {
        let clazz = this.getElementClass(element.type);
        let result = new clazz();
        let jObject = new StiJson();
        jObject.deserialize(element.saveToJsonObject({}).serialize());
        result.loadFromJsonObject(jObject);
        result.guid = Guid.newGuid().toString();
        if ("displayValue" in element) {
            result["displayValue"] = element["displayValue"];
        }
        if ("form" in element) {
            result["form"] = element["form"];
        }
        return result;
    }
    clonePage(page) {
        let result = new StiFormPageElement(page.form);
        let jObject = new StiJson();
        jObject.deserialize(page.saveToJsonObject({}).serialize());
        result.loadFromJsonObject(jObject);
        result.guid = Guid.newGuid().toString();
        result.form = page.form;
        return result;
    }
    get fileMenuItems() {
        if (this._fileMenuItems.length == 0) {
            this._fileMenuItems = [
                // { caption: StiLocalizationService.get("PropertyMain", "Info"), image: "assets/Images/Other/FileMenu/Home.png" },
                {
                    caption: StiLocalizationService.get("MainMenu", "menuFileNew").replace("&amp", "").replace(";", ""),
                    image: "images.Other.FileMenu.Report.png",
                    name: "New",
                },
                {
                    caption: StiLocalizationService.get("MainMenu", "menuFileOpen")
                        .replace("&amp", "")
                        .replace(";", "")
                        .replace("...", ""),
                    image: "images.Other.FileMenu.Folder.png",
                    name: "Open",
                },
                { name: "Divider" },
                {
                    caption: StiLocalizationService.get("MainMenu", "menuFileSave").replace("&amp", "").replace(";", ""),
                    name: "Save",
                },
                { caption: StiLocalizationService.get("MainMenu", "menuFileSaveAs").replace("...", ""), name: "SaveAs" },
                /*  { caption: StiLocalizationService.get("PropertyMain", "Share") },
                { caption: StiLocalizationService.get("PropertyMain", "Help") },
                { caption: StiLocalizationService.get("PropertyMain", "Close") }, */
                { name: "Divider" },
                /*  { caption: StiLocalizationService.get("PropertyMain", "Account") },
                { caption: StiLocalizationService.get("PropertyMain", "Options") }, */
                {
                    caption: StiLocalizationService.get("MainMenu", "menuHelpAboutProgramm")
                        .replace("&amp", "")
                        .replace(";", "")
                        .replace("...", ""),
                    name: "About",
                },
            ];
        }
        return this._fileMenuItems;
    }
    getAddTotalMenuItems() {
        let table = this.model.selectedComponent?.element;
        let this_ = this;
        if (!this.addTotalMenuItems && table?.columns?.length > 0) {
            this.addTotalMenuItems = [];
            let commands = [
                { name: this.loc.getP("Summary"), type: "Sum" },
                { name: this.loc.getP("Minimum"), type: "Min" },
                { name: this.loc.getP("Maximum"), type: "Max" },
                { name: this.loc.getP("Count"), type: "Count" },
            ];
            commands.forEach((command) => {
                let items = [];
                table.columns.forEach((column, index) => {
                    if (column instanceof StiNumberBoxColumnItem || column instanceof StiLabelColumnItem) {
                        items.push({
                            label: column.label?.length > 0 ? column.label : `${this.loc.get2("PropertyMain", "Column")} ${index + 1}`,
                            command: () => {
                                this_.zone.run(() => {
                                    table.totalsFields.push(new StiTotalsFieldItem(command.type, `{${command.type}(Col(${index + 1}))}`, this.model.form));
                                    this.model.showColumnPreview(table.totalsFields.length - 1, "totals");
                                });
                            },
                        });
                    }
                });
                if (items.length > 0) {
                    this.addTotalMenuItems.push({ label: command.name, items: items });
                }
            });
            let items = [];
            table.columns.forEach((column, index) => {
                let rowItems = [];
                table.rowLabels.forEach((rowLabel, rowIndex) => {
                    rowItems.push({
                        label: `Row ${rowIndex + 1}`,
                        command: () => {
                            this_.zone.run(() => {
                                table.totalsFields.push(new StiTotalsFieldItem("Cell", `{Cell(${index + 1}, ${rowIndex + 1})}`, this.model.form));
                                this.model.showColumnPreview(table.totalsFields.length - 1, "totals");
                            });
                        },
                    });
                });
                items.push({
                    label: column.label?.length > 0 ? column.label : `${this.loc.get2("PropertyMain", "Column")} ${index + 1}`,
                    items: rowItems,
                });
            });
            this.addTotalMenuItems.push({ label: this.loc.get2("PropertyCategory", "CellCategory"), items: items });
            this.addTotalMenuItems.push({
                label: this.loc.get2("Report", "StiEmptyBrush"),
                command: () => {
                    this_.zone.run(() => {
                        table.totalsFields.push(new StiTotalsFieldItem("", "", this.model.form));
                        this.model.showColumnPreview(table.totalsFields.length - 1, "totals");
                    });
                }
            });
        }
        return this.addTotalMenuItems;
    }
    base64Encode(input) {
        if (input == null)
            return "";
        // Decode from UTF-8 text
        if (typeof unescape != "undefined") {
            input = unescape(encodeURIComponent(input));
        }
        else {
            input = input.replace(/\r\n/g, "\n");
            var utftext = "";
            for (var n = 0; n < input.length; n++) {
                var c = input.charCodeAt(n);
                if (c < 128) {
                    utftext += String.fromCharCode(c);
                }
                else if (c > 127 && c < 2048) {
                    utftext += String.fromCharCode((c >> 6) | 192);
                    utftext += String.fromCharCode((c & 63) | 128);
                }
                else {
                    utftext += String.fromCharCode((c >> 12) | 224);
                    utftext += String.fromCharCode(((c >> 6) & 63) | 128);
                    utftext += String.fromCharCode((c & 63) | 128);
                }
            }
            input = utftext;
        }
        // Encode to Base64 string
        if (typeof window.btoa != "undefined")
            return window.btoa(input);
        var output = "";
        var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
        var i = 0;
        while (i < input.length) {
            chr1 = input.charCodeAt(i++);
            chr2 = input.charCodeAt(i++);
            chr3 = input.charCodeAt(i++);
            enc1 = chr1 >> 2;
            enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
            enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
            enc4 = chr3 & 63;
            if (isNaN(chr2))
                enc3 = enc4 = 64;
            else if (isNaN(chr3))
                enc4 = 64;
            output =
                output +
                    this._keyStr.charAt(enc1) +
                    this._keyStr.charAt(enc2) +
                    this._keyStr.charAt(enc3) +
                    this._keyStr.charAt(enc4);
        }
        return output;
    }
    base64Decode(input) {
        if (input == null)
            return "";
        var output = "";
        // Decode from Base64 string
        if (typeof window.atob != "undefined") {
            output = window.atob(input);
        }
        else {
            var chr1, chr2, chr3;
            var enc1, enc2, enc3, enc4;
            var i = 0;
            input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");
            while (i < input.length) {
                enc1 = this._keyStr.indexOf(input.charAt(i++));
                enc2 = this._keyStr.indexOf(input.charAt(i++));
                enc3 = this._keyStr.indexOf(input.charAt(i++));
                enc4 = this._keyStr.indexOf(input.charAt(i++));
                chr1 = (enc1 << 2) | (enc2 >> 4);
                chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
                chr3 = ((enc3 & 3) << 6) | enc4;
                output = output + String.fromCharCode(chr1);
                if (enc3 != 64) {
                    output = output + String.fromCharCode(chr2);
                }
                if (enc4 != 64) {
                    output = output + String.fromCharCode(chr3);
                }
            }
        }
        // Encode to UTF-8 string
        if (typeof escape != "undefined")
            return decodeURIComponent(escape(output));
        var string = "";
        var i = 0;
        var c = 0;
        var c1 = 0;
        var c2 = 0;
        var c3 = 0;
        while (i < output.length) {
            c = output.charCodeAt(i);
            if (c < 128) {
                string += String.fromCharCode(c);
                i++;
            }
            else if (c > 191 && c < 224) {
                c2 = output.charCodeAt(i + 1);
                string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
                i += 2;
            }
            else {
                c2 = output.charCodeAt(i + 1);
                c3 = output.charCodeAt(i + 2);
                string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
                i += 3;
            }
        }
        return string;
    }
    get cultures() {
        if (this._cultures.length == 0)
            this._cultures = [
                {
                    "name": " ",
                    "value": ""
                },
                {
                    "name": "Afar (Djibouti)  (aa-DJ)",
                    "value": "aa-DJ"
                },
                {
                    "name": "Afar (Eritrea)  (aa-ER)",
                    "value": "aa-ER"
                },
                {
                    "name": "Afar (Ethiopia)  (aa-ET)",
                    "value": "aa-ET"
                },
                {
                    "name": "Afrikaans (Namibia)  (af-NA)",
                    "value": "af-NA"
                },
                {
                    "name": "Afrikaans (South Africa)  (af-ZA)",
                    "value": "af-ZA"
                },
                {
                    "name": "Aghem (Cameroon)  (agq-CM)",
                    "value": "agq-CM"
                },
                {
                    "name": "Akan (Ghana)  (ak-GH)",
                    "value": "ak-GH"
                },
                {
                    "name": "Albanian (Albania)  (sq-AL)",
                    "value": "sq-AL"
                },
                {
                    "name": "Albanian (Kosovo)  (sq-XK)",
                    "value": "sq-XK"
                },
                {
                    "name": "Albanian (North Macedonia)  (sq-MK)",
                    "value": "sq-MK"
                },
                {
                    "name": "Alsatian (France)  (gsw-FR)",
                    "value": "gsw-FR"
                },
                {
                    "name": "Alsatian (Liechtenstein)  (gsw-LI)",
                    "value": "gsw-LI"
                },
                {
                    "name": "Alsatian (Switzerland)  (gsw-CH)",
                    "value": "gsw-CH"
                },
                {
                    "name": "Amharic (Ethiopia)  (am-ET)",
                    "value": "am-ET"
                },
                {
                    "name": "Arabic (Algeria)  (ar-DZ)",
                    "value": "ar-DZ"
                },
                {
                    "name": "Arabic (Bahrain)  (ar-BH)",
                    "value": "ar-BH"
                },
                {
                    "name": "Arabic (Chad)  (ar-TD)",
                    "value": "ar-TD"
                },
                {
                    "name": "Arabic (Comoros)  (ar-KM)",
                    "value": "ar-KM"
                },
                {
                    "name": "Arabic (Djibouti)  (ar-DJ)",
                    "value": "ar-DJ"
                },
                {
                    "name": "Arabic (Egypt)  (ar-EG)",
                    "value": "ar-EG"
                },
                {
                    "name": "Arabic (Eritrea)  (ar-ER)",
                    "value": "ar-ER"
                },
                {
                    "name": "Arabic (Iraq)  (ar-IQ)",
                    "value": "ar-IQ"
                },
                {
                    "name": "Arabic (Israel)  (ar-IL)",
                    "value": "ar-IL"
                },
                {
                    "name": "Arabic (Jordan)  (ar-JO)",
                    "value": "ar-JO"
                },
                {
                    "name": "Arabic (Kuwait)  (ar-KW)",
                    "value": "ar-KW"
                },
                {
                    "name": "Arabic (Lebanon)  (ar-LB)",
                    "value": "ar-LB"
                },
                {
                    "name": "Arabic (Libya)  (ar-LY)",
                    "value": "ar-LY"
                },
                {
                    "name": "Arabic (Mauritania)  (ar-MR)",
                    "value": "ar-MR"
                },
                {
                    "name": "Arabic (Morocco)  (ar-MA)",
                    "value": "ar-MA"
                },
                {
                    "name": "Arabic (Oman)  (ar-OM)",
                    "value": "ar-OM"
                },
                {
                    "name": "Arabic (Palestinian Authority)  (ar-PS)",
                    "value": "ar-PS"
                },
                {
                    "name": "Arabic (Qatar)  (ar-QA)",
                    "value": "ar-QA"
                },
                {
                    "name": "Arabic (Saudi Arabia)  (ar-SA)",
                    "value": "ar-SA"
                },
                {
                    "name": "Arabic (Somalia)  (ar-SO)",
                    "value": "ar-SO"
                },
                {
                    "name": "Arabic (South Sudan)  (ar-SS)",
                    "value": "ar-SS"
                },
                {
                    "name": "Arabic (Sudan)  (ar-SD)",
                    "value": "ar-SD"
                },
                {
                    "name": "Arabic (Syria)  (ar-SY)",
                    "value": "ar-SY"
                },
                {
                    "name": "Arabic (Tunisia)  (ar-TN)",
                    "value": "ar-TN"
                },
                {
                    "name": "Arabic (U.A.E.)  (ar-AE)",
                    "value": "ar-AE"
                },
                {
                    "name": "Arabic (World)  (ar-001)",
                    "value": "ar-001"
                },
                {
                    "name": "Arabic (Yemen)  (ar-YE)",
                    "value": "ar-YE"
                },
                {
                    "name": "Armenian (Armenia)  (hy-AM)",
                    "value": "hy-AM"
                },
                {
                    "name": "Assamese (India)  (as-IN)",
                    "value": "as-IN"
                },
                {
                    "name": "Asturian (Spain)  (ast-ES)",
                    "value": "ast-ES"
                },
                {
                    "name": "Asu (Tanzania)  (asa-TZ)",
                    "value": "asa-TZ"
                },
                {
                    "name": "Azerbaijani (Cyrillic, Azerbaijan)  (az-Cyrl-AZ)",
                    "value": "az-Cyrl-AZ"
                },
                {
                    "name": "Azerbaijani (Latin, Azerbaijan)  (az-Latn-AZ)",
                    "value": "az-Latn-AZ"
                },
                {
                    "name": "Bafia (Cameroon)  (ksf-CM)",
                    "value": "ksf-CM"
                },
                {
                    "name": "Bambara (Latin, Mali)  (bm-Latn-ML)",
                    "value": "bm-Latn-ML"
                },
                {
                    "name": "Bangla (Bangladesh)  (bn-BD)",
                    "value": "bn-BD"
                },
                {
                    "name": "Bangla (India)  (bn-IN)",
                    "value": "bn-IN"
                },
                {
                    "name": "Basaa (Cameroon)  (bas-CM)",
                    "value": "bas-CM"
                },
                {
                    "name": "Bashkir (Russia)  (ba-RU)",
                    "value": "ba-RU"
                },
                {
                    "name": "Basque (Basque)  (eu-ES)",
                    "value": "eu-ES"
                },
                {
                    "name": "Belarusian (Belarus)  (be-BY)",
                    "value": "be-BY"
                },
                {
                    "name": "Bemba (Zambia)  (bem-ZM)",
                    "value": "bem-ZM"
                },
                {
                    "name": "Bena (Tanzania)  (bez-TZ)",
                    "value": "bez-TZ"
                },
                {
                    "name": "Blin (Eritrea)  (byn-ER)",
                    "value": "byn-ER"
                },
                {
                    "name": "Bodo (India)  (brx-IN)",
                    "value": "brx-IN"
                },
                {
                    "name": "Bosnian (Cyrillic, Bosnia and Herzegovina)  (bs-Cyrl-BA)",
                    "value": "bs-Cyrl-BA"
                },
                {
                    "name": "Bosnian (Latin, Bosnia and Herzegovina)  (bs-Latn-BA)",
                    "value": "bs-Latn-BA"
                },
                {
                    "name": "Breton (France)  (br-FR)",
                    "value": "br-FR"
                },
                {
                    "name": "Bulgarian (Bulgaria)  (bg-BG)",
                    "value": "bg-BG"
                },
                {
                    "name": "Burmese (Myanmar)  (my-MM)",
                    "value": "my-MM"
                },
                {
                    "name": "Catalan (Andorra)  (ca-AD)",
                    "value": "ca-AD"
                },
                {
                    "name": "Catalan (Catalan)  (ca-ES)",
                    "value": "ca-ES"
                },
                {
                    "name": "Catalan (France)  (ca-FR)",
                    "value": "ca-FR"
                },
                {
                    "name": "Catalan (Italy)  (ca-IT)",
                    "value": "ca-IT"
                },
                {
                    "name": "Cebuano (Latin, Philippines)  (ceb-Latn-PH)",
                    "value": "ceb-Latn-PH"
                },
                {
                    "name": "Central Atlas Tamazight (Arabic, Morocco)  (tzm-Arab-MA)",
                    "value": "tzm-Arab-MA"
                },
                {
                    "name": "Central Atlas Tamazight (Latin, Morocco)  (tzm-Latn-MA)",
                    "value": "tzm-Latn-MA"
                },
                {
                    "name": "Central Atlas Tamazight (Tifinagh, Morocco)  (tzm-Tfng-MA)",
                    "value": "tzm-Tfng-MA"
                },
                {
                    "name": "Central Kurdish (Iraq)  (ku-Arab-IQ)",
                    "value": "ku-Arab-IQ"
                },
                {
                    "name": "Chakma (Chakma, Bangladesh)  (ccp-Cakm-BD)",
                    "value": "ccp-Cakm-BD"
                },
                {
                    "name": "Chakma (Chakma, India)  (ccp-Cakm-IN)",
                    "value": "ccp-Cakm-IN"
                },
                {
                    "name": "Chechen (Russia)  (ce-RU)",
                    "value": "ce-RU"
                },
                {
                    "name": "Cherokee (Cherokee)  (chr-Cher-US)",
                    "value": "chr-Cher-US"
                },
                {
                    "name": "Chiga (Uganda)  (cgg-UG)",
                    "value": "cgg-UG"
                },
                {
                    "name": "Chinese (Simplified Han, Hong Kong SAR)  (zh-Hans-HK)",
                    "value": "zh-Hans-HK"
                },
                {
                    "name": "Chinese (Simplified Han, Macao SAR)  (zh-Hans-MO)",
                    "value": "zh-Hans-MO"
                },
                {
                    "name": "Chinese (Simplified, PRC)  (zh-CN)",
                    "value": "zh-CN"
                },
                {
                    "name": "Chinese (Simplified, Singapore)  (zh-SG)",
                    "value": "zh-SG"
                },
                {
                    "name": "Chinese (Traditional, Hong Kong S.A.R.)  (zh-HK)",
                    "value": "zh-HK"
                },
                {
                    "name": "Chinese (Traditional, Macao S.A.R.)  (zh-MO)",
                    "value": "zh-MO"
                },
                {
                    "name": "Chinese (Traditional, Taiwan)  (zh-TW)",
                    "value": "zh-TW"
                },
                {
                    "name": "Church Slavic (Russia)  (cu-RU)",
                    "value": "cu-RU"
                },
                {
                    "name": "Cornish (United Kingdom)  (kw-GB)",
                    "value": "kw-GB"
                },
                {
                    "name": "Corsican (France)  (co-FR)",
                    "value": "co-FR"
                },
                {
                    "name": "Croatian (Croatia)  (hr-HR)",
                    "value": "hr-HR"
                },
                {
                    "name": "Croatian (Latin, Bosnia and Herzegovina)  (hr-BA)",
                    "value": "hr-BA"
                },
                {
                    "name": "Czech (Czech Republic)  (cs-CZ)",
                    "value": "cs-CZ"
                },
                {
                    "name": "Danish (Denmark)  (da-DK)",
                    "value": "da-DK"
                },
                {
                    "name": "Danish (Greenland)  (da-GL)",
                    "value": "da-GL"
                },
                {
                    "name": "Dari (Afghanistan)  (prs-AF)",
                    "value": "prs-AF"
                },
                {
                    "name": "Divehi (Maldives)  (dv-MV)",
                    "value": "dv-MV"
                },
                {
                    "name": "Duala (Cameroon)  (dua-CM)",
                    "value": "dua-CM"
                },
                {
                    "name": "Dutch (Aruba)  (nl-AW)",
                    "value": "nl-AW"
                },
                {
                    "name": "Dutch (Belgium)  (nl-BE)",
                    "value": "nl-BE"
                },
                {
                    "name": "Dutch (Bonaire, Sint Eustatius and Saba)  (nl-BQ)",
                    "value": "nl-BQ"
                },
                {
                    "name": "Dutch (Curaçao)  (nl-CW)",
                    "value": "nl-CW"
                },
                {
                    "name": "Dutch (Netherlands)  (nl-NL)",
                    "value": "nl-NL"
                },
                {
                    "name": "Dutch (Sint Maarten)  (nl-SX)",
                    "value": "nl-SX"
                },
                {
                    "name": "Dutch (Suriname)  (nl-SR)",
                    "value": "nl-SR"
                },
                {
                    "name": "Dzongkha (Bhutan)  (dz-BT)",
                    "value": "dz-BT"
                },
                {
                    "name": "Edo (Nigeria)  (bin-NG)",
                    "value": "bin-NG"
                },
                {
                    "name": "Embu (Kenya)  (ebu-KE)",
                    "value": "ebu-KE"
                },
                {
                    "name": "English (American Samoa)  (en-AS)",
                    "value": "en-AS"
                },
                {
                    "name": "English (Anguilla)  (en-AI)",
                    "value": "en-AI"
                },
                {
                    "name": "English (Antigua and Barbuda)  (en-AG)",
                    "value": "en-AG"
                },
                {
                    "name": "English (Australia)  (en-AU)",
                    "value": "en-AU"
                },
                {
                    "name": "English (Austria)  (en-AT)",
                    "value": "en-AT"
                },
                {
                    "name": "English (Bahamas)  (en-BS)",
                    "value": "en-BS"
                },
                {
                    "name": "English (Barbados)  (en-BB)",
                    "value": "en-BB"
                },
                {
                    "name": "English (Belgium)  (en-BE)",
                    "value": "en-BE"
                },
                {
                    "name": "English (Belize)  (en-BZ)",
                    "value": "en-BZ"
                },
                {
                    "name": "English (Bermuda)  (en-BM)",
                    "value": "en-BM"
                },
                {
                    "name": "English (Botswana)  (en-BW)",
                    "value": "en-BW"
                },
                {
                    "name": "English (British Indian Ocean Territory)  (en-IO)",
                    "value": "en-IO"
                },
                {
                    "name": "English (British Virgin Islands)  (en-VG)",
                    "value": "en-VG"
                },
                {
                    "name": "English (Burundi)  (en-BI)",
                    "value": "en-BI"
                },
                {
                    "name": "English (Cameroon)  (en-CM)",
                    "value": "en-CM"
                },
                {
                    "name": "English (Canada)  (en-CA)",
                    "value": "en-CA"
                },
                {
                    "name": "English (Caribbean)  (en-029)",
                    "value": "en-029"
                },
                {
                    "name": "English (Cayman Islands)  (en-KY)",
                    "value": "en-KY"
                },
                {
                    "name": "English (Christmas Island)  (en-CX)",
                    "value": "en-CX"
                },
                {
                    "name": "English (Cocos [Keeling] Islands)  (en-CC)",
                    "value": "en-CC"
                },
                {
                    "name": "English (Cook Islands)  (en-CK)",
                    "value": "en-CK"
                },
                {
                    "name": "English (Cyprus)  (en-CY)",
                    "value": "en-CY"
                },
                {
                    "name": "English (Denmark)  (en-DK)",
                    "value": "en-DK"
                },
                {
                    "name": "English (Dominica)  (en-DM)",
                    "value": "en-DM"
                },
                {
                    "name": "English (Eritrea)  (en-ER)",
                    "value": "en-ER"
                },
                {
                    "name": "English (Europe)  (en-150)",
                    "value": "en-150"
                },
                {
                    "name": "English (Falkland Islands)  (en-FK)",
                    "value": "en-FK"
                },
                {
                    "name": "English (Fiji)  (en-FJ)",
                    "value": "en-FJ"
                },
                {
                    "name": "English (Finland)  (en-FI)",
                    "value": "en-FI"
                },
                {
                    "name": "English (Gambia)  (en-GM)",
                    "value": "en-GM"
                },
                {
                    "name": "English (Germany)  (en-DE)",
                    "value": "en-DE"
                },
                {
                    "name": "English (Ghana)  (en-GH)",
                    "value": "en-GH"
                },
                {
                    "name": "English (Gibraltar)  (en-GI)",
                    "value": "en-GI"
                },
                {
                    "name": "English (Grenada)  (en-GD)",
                    "value": "en-GD"
                },
                {
                    "name": "English (Guam)  (en-GU)",
                    "value": "en-GU"
                },
                {
                    "name": "English (Guernsey)  (en-GG)",
                    "value": "en-GG"
                },
                {
                    "name": "English (Guyana)  (en-GY)",
                    "value": "en-GY"
                },
                {
                    "name": "English (Hong Kong SAR)  (en-HK)",
                    "value": "en-HK"
                },
                {
                    "name": "English (India)  (en-IN)",
                    "value": "en-IN"
                },
                {
                    "name": "English (Indonesia)  (en-ID)",
                    "value": "en-ID"
                },
                {
                    "name": "English (Ireland)  (en-IE)",
                    "value": "en-IE"
                },
                {
                    "name": "English (Isle of Man)  (en-IM)",
                    "value": "en-IM"
                },
                {
                    "name": "English (Israel)  (en-IL)",
                    "value": "en-IL"
                },
                {
                    "name": "English (Jamaica)  (en-JM)",
                    "value": "en-JM"
                },
                {
                    "name": "English (Jersey)  (en-JE)",
                    "value": "en-JE"
                },
                {
                    "name": "English (Kenya)  (en-KE)",
                    "value": "en-KE"
                },
                {
                    "name": "English (Kiribati)  (en-KI)",
                    "value": "en-KI"
                },
                {
                    "name": "English (Lesotho)  (en-LS)",
                    "value": "en-LS"
                },
                {
                    "name": "English (Liberia)  (en-LR)",
                    "value": "en-LR"
                },
                {
                    "name": "English (Macao SAR)  (en-MO)",
                    "value": "en-MO"
                },
                {
                    "name": "English (Madagascar)  (en-MG)",
                    "value": "en-MG"
                },
                {
                    "name": "English (Malawi)  (en-MW)",
                    "value": "en-MW"
                },
                {
                    "name": "English (Malaysia)  (en-MY)",
                    "value": "en-MY"
                },
                {
                    "name": "English (Malta)  (en-MT)",
                    "value": "en-MT"
                },
                {
                    "name": "English (Marshall Islands)  (en-MH)",
                    "value": "en-MH"
                },
                {
                    "name": "English (Mauritius)  (en-MU)",
                    "value": "en-MU"
                },
                {
                    "name": "English (Micronesia)  (en-FM)",
                    "value": "en-FM"
                },
                {
                    "name": "English (Montserrat)  (en-MS)",
                    "value": "en-MS"
                },
                {
                    "name": "English (Namibia)  (en-NA)",
                    "value": "en-NA"
                },
                {
                    "name": "English (Nauru)  (en-NR)",
                    "value": "en-NR"
                },
                {
                    "name": "English (Netherlands)  (en-NL)",
                    "value": "en-NL"
                },
                {
                    "name": "English (New Zealand)  (en-NZ)",
                    "value": "en-NZ"
                },
                {
                    "name": "English (Nigeria)  (en-NG)",
                    "value": "en-NG"
                },
                {
                    "name": "English (Niue)  (en-NU)",
                    "value": "en-NU"
                },
                {
                    "name": "English (Norfolk Island)  (en-NF)",
                    "value": "en-NF"
                },
                {
                    "name": "English (Northern Mariana Islands)  (en-MP)",
                    "value": "en-MP"
                },
                {
                    "name": "English (Pakistan)  (en-PK)",
                    "value": "en-PK"
                },
                {
                    "name": "English (Palau)  (en-PW)",
                    "value": "en-PW"
                },
                {
                    "name": "English (Papua New Guinea)  (en-PG)",
                    "value": "en-PG"
                },
                {
                    "name": "English (Pitcairn Islands)  (en-PN)",
                    "value": "en-PN"
                },
                {
                    "name": "English (Puerto Rico)  (en-PR)",
                    "value": "en-PR"
                },
                {
                    "name": "English (Republic of the Philippines)  (en-PH)",
                    "value": "en-PH"
                },
                {
                    "name": "English (Rwanda)  (en-RW)",
                    "value": "en-RW"
                },
                {
                    "name": "English (Saint Kitts and Nevis)  (en-KN)",
                    "value": "en-KN"
                },
                {
                    "name": "English (Saint Lucia)  (en-LC)",
                    "value": "en-LC"
                },
                {
                    "name": "English (Saint Vincent and the Grenadines)  (en-VC)",
                    "value": "en-VC"
                },
                {
                    "name": "English (Samoa)  (en-WS)",
                    "value": "en-WS"
                },
                {
                    "name": "English (Seychelles)  (en-SC)",
                    "value": "en-SC"
                },
                {
                    "name": "English (Sierra Leone)  (en-SL)",
                    "value": "en-SL"
                },
                {
                    "name": "English (Singapore)  (en-SG)",
                    "value": "en-SG"
                },
                {
                    "name": "English (Sint Maarten)  (en-SX)",
                    "value": "en-SX"
                },
                {
                    "name": "English (Slovenia)  (en-SI)",
                    "value": "en-SI"
                },
                {
                    "name": "English (Solomon Islands)  (en-SB)",
                    "value": "en-SB"
                },
                {
                    "name": "English (South Africa)  (en-ZA)",
                    "value": "en-ZA"
                },
                {
                    "name": "English (South Sudan)  (en-SS)",
                    "value": "en-SS"
                },
                {
                    "name": "English (St Helena, Ascension, Tristan da Cunha)  (en-SH)",
                    "value": "en-SH"
                },
                {
                    "name": "English (Sudan)  (en-SD)",
                    "value": "en-SD"
                },
                {
                    "name": "English (Swaziland)  (en-SZ)",
                    "value": "en-SZ"
                },
                {
                    "name": "English (Sweden)  (en-SE)",
                    "value": "en-SE"
                },
                {
                    "name": "English (Switzerland)  (en-CH)",
                    "value": "en-CH"
                },
                {
                    "name": "English (Tanzania)  (en-TZ)",
                    "value": "en-TZ"
                },
                {
                    "name": "English (Tokelau)  (en-TK)",
                    "value": "en-TK"
                },
                {
                    "name": "English (Tonga)  (en-TO)",
                    "value": "en-TO"
                },
                {
                    "name": "English (Trinidad and Tobago)  (en-TT)",
                    "value": "en-TT"
                },
                {
                    "name": "English (Turks and Caicos Islands)  (en-TC)",
                    "value": "en-TC"
                },
                {
                    "name": "English (Tuvalu)  (en-TV)",
                    "value": "en-TV"
                },
                {
                    "name": "English (Uganda)  (en-UG)",
                    "value": "en-UG"
                },
                {
                    "name": "English (United Arab Emirates)  (en-AE)",
                    "value": "en-AE"
                },
                {
                    "name": "English (United Kingdom)  (en-GB)",
                    "value": "en-GB"
                },
                {
                    "name": "English (United States)  (en-US)",
                    "value": "en-US"
                },
                {
                    "name": "English (US Minor Outlying Islands)  (en-UM)",
                    "value": "en-UM"
                },
                {
                    "name": "English (US Virgin Islands)  (en-VI)",
                    "value": "en-VI"
                },
                {
                    "name": "English (Vanuatu)  (en-VU)",
                    "value": "en-VU"
                },
                {
                    "name": "English (World)  (en-001)",
                    "value": "en-001"
                },
                {
                    "name": "English (Zambia)  (en-ZM)",
                    "value": "en-ZM"
                },
                {
                    "name": "English (Zimbabwe)  (en-ZW)",
                    "value": "en-ZW"
                },
                {
                    "name": "Esperanto (World)  (eo-001)",
                    "value": "eo-001"
                },
                {
                    "name": "Estonian (Estonia)  (et-EE)",
                    "value": "et-EE"
                },
                {
                    "name": "Ewe (Ghana)  (ee-GH)",
                    "value": "ee-GH"
                },
                {
                    "name": "Ewe (Togo)  (ee-TG)",
                    "value": "ee-TG"
                },
                {
                    "name": "Ewondo (Cameroon)  (ewo-CM)",
                    "value": "ewo-CM"
                },
                {
                    "name": "Faroese (Denmark)  (fo-DK)",
                    "value": "fo-DK"
                },
                {
                    "name": "Faroese (Faroe Islands)  (fo-FO)",
                    "value": "fo-FO"
                },
                {
                    "name": "Filipino (Philippines)  (fil-PH)",
                    "value": "fil-PH"
                },
                {
                    "name": "Finnish (Finland)  (fi-FI)",
                    "value": "fi-FI"
                },
                {
                    "name": "French (Algeria)  (fr-DZ)",
                    "value": "fr-DZ"
                },
                {
                    "name": "French (Belgium)  (fr-BE)",
                    "value": "fr-BE"
                },
                {
                    "name": "French (Benin)  (fr-BJ)",
                    "value": "fr-BJ"
                },
                {
                    "name": "French (Burkina Faso)  (fr-BF)",
                    "value": "fr-BF"
                },
                {
                    "name": "French (Burundi)  (fr-BI)",
                    "value": "fr-BI"
                },
                {
                    "name": "French (Cameroon)  (fr-CM)",
                    "value": "fr-CM"
                },
                {
                    "name": "French (Canada)  (fr-CA)",
                    "value": "fr-CA"
                },
                {
                    "name": "French (Caribbean)  (fr-029)",
                    "value": "fr-029"
                },
                {
                    "name": "French (Central African Republic)  (fr-CF)",
                    "value": "fr-CF"
                },
                {
                    "name": "French (Chad)  (fr-TD)",
                    "value": "fr-TD"
                },
                {
                    "name": "French (Comoros)  (fr-KM)",
                    "value": "fr-KM"
                },
                {
                    "name": "French (Congo DRC)  (fr-CD)",
                    "value": "fr-CD"
                },
                {
                    "name": "French (Congo)  (fr-CG)",
                    "value": "fr-CG"
                },
                {
                    "name": "French (Côte d’Ivoire)  (fr-CI)",
                    "value": "fr-CI"
                },
                {
                    "name": "French (Djibouti)  (fr-DJ)",
                    "value": "fr-DJ"
                },
                {
                    "name": "French (Equatorial Guinea)  (fr-GQ)",
                    "value": "fr-GQ"
                },
                {
                    "name": "French (France)  (fr-FR)",
                    "value": "fr-FR"
                },
                {
                    "name": "French (French Guiana)  (fr-GF)",
                    "value": "fr-GF"
                },
                {
                    "name": "French (French Polynesia)  (fr-PF)",
                    "value": "fr-PF"
                },
                {
                    "name": "French (Gabon)  (fr-GA)",
                    "value": "fr-GA"
                },
                {
                    "name": "French (Guadeloupe)  (fr-GP)",
                    "value": "fr-GP"
                },
                {
                    "name": "French (Guinea)  (fr-GN)",
                    "value": "fr-GN"
                },
                {
                    "name": "French (Haiti)  (fr-HT)",
                    "value": "fr-HT"
                },
                {
                    "name": "French (Luxembourg)  (fr-LU)",
                    "value": "fr-LU"
                },
                {
                    "name": "French (Madagascar)  (fr-MG)",
                    "value": "fr-MG"
                },
                {
                    "name": "French (Mali)  (fr-ML)",
                    "value": "fr-ML"
                },
                {
                    "name": "French (Martinique)  (fr-MQ)",
                    "value": "fr-MQ"
                },
                {
                    "name": "French (Mauritania)  (fr-MR)",
                    "value": "fr-MR"
                },
                {
                    "name": "French (Mauritius)  (fr-MU)",
                    "value": "fr-MU"
                },
                {
                    "name": "French (Mayotte)  (fr-YT)",
                    "value": "fr-YT"
                },
                {
                    "name": "French (Monaco)  (fr-MC)",
                    "value": "fr-MC"
                },
                {
                    "name": "French (Morocco)  (fr-MA)",
                    "value": "fr-MA"
                },
                {
                    "name": "French (New Caledonia)  (fr-NC)",
                    "value": "fr-NC"
                },
                {
                    "name": "French (Niger)  (fr-NE)",
                    "value": "fr-NE"
                },
                {
                    "name": "French (Reunion)  (fr-RE)",
                    "value": "fr-RE"
                },
                {
                    "name": "French (Rwanda)  (fr-RW)",
                    "value": "fr-RW"
                },
                {
                    "name": "French (Saint Barthélemy)  (fr-BL)",
                    "value": "fr-BL"
                },
                {
                    "name": "French (Saint Martin)  (fr-MF)",
                    "value": "fr-MF"
                },
                {
                    "name": "French (Saint Pierre and Miquelon)  (fr-PM)",
                    "value": "fr-PM"
                },
                {
                    "name": "French (Senegal)  (fr-SN)",
                    "value": "fr-SN"
                },
                {
                    "name": "French (Seychelles)  (fr-SC)",
                    "value": "fr-SC"
                },
                {
                    "name": "French (Switzerland)  (fr-CH)",
                    "value": "fr-CH"
                },
                {
                    "name": "French (Syria)  (fr-SY)",
                    "value": "fr-SY"
                },
                {
                    "name": "French (Togo)  (fr-TG)",
                    "value": "fr-TG"
                },
                {
                    "name": "French (Tunisia)  (fr-TN)",
                    "value": "fr-TN"
                },
                {
                    "name": "French (Vanuatu)  (fr-VU)",
                    "value": "fr-VU"
                },
                {
                    "name": "French (Wallis and Futuna)  (fr-WF)",
                    "value": "fr-WF"
                },
                {
                    "name": "Frisian (Netherlands)  (fy-NL)",
                    "value": "fy-NL"
                },
                {
                    "name": "Friulian (Italy)  (fur-IT)",
                    "value": "fur-IT"
                },
                {
                    "name": "Fulah (Latin, Burkina Faso)  (ff-Latn-BF)",
                    "value": "ff-Latn-BF"
                },
                {
                    "name": "Fulah (Latin, Cameroon)  (ff-Latn-CM)",
                    "value": "ff-Latn-CM"
                },
                {
                    "name": "Fulah (Latin, Gambia)  (ff-Latn-GM)",
                    "value": "ff-Latn-GM"
                },
                {
                    "name": "Fulah (Latin, Ghana)  (ff-Latn-GH)",
                    "value": "ff-Latn-GH"
                },
                {
                    "name": "Fulah (Latin, Guinea)  (ff-Latn-GN)",
                    "value": "ff-Latn-GN"
                },
                {
                    "name": "Fulah (Latin, Guinea-Bissau)  (ff-Latn-GW)",
                    "value": "ff-Latn-GW"
                },
                {
                    "name": "Fulah (Latin, Liberia)  (ff-Latn-LR)",
                    "value": "ff-Latn-LR"
                },
                {
                    "name": "Fulah (Latin, Mauritania)  (ff-Latn-MR)",
                    "value": "ff-Latn-MR"
                },
                {
                    "name": "Fulah (Latin, Niger)  (ff-Latn-NE)",
                    "value": "ff-Latn-NE"
                },
                {
                    "name": "Fulah (Latin, Nigeria)  (ff-Latn-NG)",
                    "value": "ff-Latn-NG"
                },
                {
                    "name": "Fulah (Latin, Senegal)  (ff-Latn-SN)",
                    "value": "ff-Latn-SN"
                },
                {
                    "name": "Fulah (Latin, Sierra Leone)  (ff-Latn-SL)",
                    "value": "ff-Latn-SL"
                },
                {
                    "name": "Galician (Galician)  (gl-ES)",
                    "value": "gl-ES"
                },
                {
                    "name": "Ganda (Uganda)  (lg-UG)",
                    "value": "lg-UG"
                },
                {
                    "name": "Georgian (Georgia)  (ka-GE)",
                    "value": "ka-GE"
                },
                {
                    "name": "German (Austria)  (de-AT)",
                    "value": "de-AT"
                },
                {
                    "name": "German (Belgium)  (de-BE)",
                    "value": "de-BE"
                },
                {
                    "name": "German (Germany)  (de-DE)",
                    "value": "de-DE"
                },
                {
                    "name": "German (Italy)  (de-IT)",
                    "value": "de-IT"
                },
                {
                    "name": "German (Liechtenstein)  (de-LI)",
                    "value": "de-LI"
                },
                {
                    "name": "German (Luxembourg)  (de-LU)",
                    "value": "de-LU"
                },
                {
                    "name": "German (Switzerland)  (de-CH)",
                    "value": "de-CH"
                },
                {
                    "name": "Greek (Cyprus)  (el-CY)",
                    "value": "el-CY"
                },
                {
                    "name": "Greek (Greece)  (el-GR)",
                    "value": "el-GR"
                },
                {
                    "name": "Greenlandic (Greenland)  (kl-GL)",
                    "value": "kl-GL"
                },
                {
                    "name": "Guarani (Paraguay)  (gn-PY)",
                    "value": "gn-PY"
                },
                {
                    "name": "Gujarati (India)  (gu-IN)",
                    "value": "gu-IN"
                },
                {
                    "name": "Gusii (Kenya)  (guz-KE)",
                    "value": "guz-KE"
                },
                {
                    "name": "Hausa (Latin, Ghana)  (ha-Latn-GH)",
                    "value": "ha-Latn-GH"
                },
                {
                    "name": "Hausa (Latin, Niger)  (ha-Latn-NE)",
                    "value": "ha-Latn-NE"
                },
                {
                    "name": "Hausa (Latin, Nigeria)  (ha-Latn-NG)",
                    "value": "ha-Latn-NG"
                },
                {
                    "name": "Hawaiian (United States)  (haw-US)",
                    "value": "haw-US"
                },
                {
                    "name": "Hebrew (Israel)  (he-IL)",
                    "value": "he-IL"
                },
                {
                    "name": "Hindi (India)  (hi-IN)",
                    "value": "hi-IN"
                },
                {
                    "name": "Hungarian (Hungary)  (hu-HU)",
                    "value": "hu-HU"
                },
                {
                    "name": "Ibibio (Nigeria)  (ibb-NG)",
                    "value": "ibb-NG"
                },
                {
                    "name": "Icelandic (Iceland)  (is-IS)",
                    "value": "is-IS"
                },
                {
                    "name": "Igbo (Nigeria)  (ig-NG)",
                    "value": "ig-NG"
                },
                {
                    "name": "Indonesian (Indonesia)  (id-ID)",
                    "value": "id-ID"
                },
                {
                    "name": "Interlingua (World)  (ia-001)",
                    "value": "ia-001"
                },
                {
                    "name": "Inuktitut (Latin, Canada)  (iu-Latn-CA)",
                    "value": "iu-Latn-CA"
                },
                {
                    "name": "Inuktitut (Syllabics, Canada)  (iu-Cans-CA)",
                    "value": "iu-Cans-CA"
                },
                {
                    "name": "Irish (Ireland)  (ga-IE)",
                    "value": "ga-IE"
                },
                {
                    "name": "isiXhosa (South Africa)  (xh-ZA)",
                    "value": "xh-ZA"
                },
                {
                    "name": "isiZulu (South Africa)  (zu-ZA)",
                    "value": "zu-ZA"
                },
                {
                    "name": "Italian (Italy)  (it-IT)",
                    "value": "it-IT"
                },
                {
                    "name": "Italian (San Marino)  (it-SM)",
                    "value": "it-SM"
                },
                {
                    "name": "Italian (Switzerland)  (it-CH)",
                    "value": "it-CH"
                },
                {
                    "name": "Italian (Vatican City)  (it-VA)",
                    "value": "it-VA"
                },
                {
                    "name": "Japanese (Japan)  (ja-JP)",
                    "value": "ja-JP"
                },
                {
                    "name": "Javanese (Indonesia)  (jv-Latn-ID)",
                    "value": "jv-Latn-ID"
                },
                {
                    "name": "Javanese (Javanese, Indonesia)  (jv-Java-ID)",
                    "value": "jv-Java-ID"
                },
                {
                    "name": "Jola-Fonyi (Senegal)  (dyo-SN)",
                    "value": "dyo-SN"
                },
                {
                    "name": "Kabuverdianu (Cabo Verde)  (kea-CV)",
                    "value": "kea-CV"
                },
                {
                    "name": "Kabyle (Algeria)  (kab-DZ)",
                    "value": "kab-DZ"
                },
                {
                    "name": "Kako (Cameroon)  (kkj-CM)",
                    "value": "kkj-CM"
                },
                {
                    "name": "Kalenjin (Kenya)  (kln-KE)",
                    "value": "kln-KE"
                },
                {
                    "name": "Kamba (Kenya)  (kam-KE)",
                    "value": "kam-KE"
                },
                {
                    "name": "Kannada (India)  (kn-IN)",
                    "value": "kn-IN"
                },
                {
                    "name": "Kanuri (Nigeria)  (kr-Latn-NG)",
                    "value": "kr-Latn-NG"
                },
                {
                    "name": "Kashmiri (Devanagari, India)  (ks-Deva-IN)",
                    "value": "ks-Deva-IN"
                },
                {
                    "name": "Kashmiri (Perso-Arabic)  (ks-Arab-IN)",
                    "value": "ks-Arab-IN"
                },
                {
                    "name": "Kazakh (Kazakhstan)  (kk-KZ)",
                    "value": "kk-KZ"
                },
                {
                    "name": "Khmer (Cambodia)  (km-KH)",
                    "value": "km-KH"
                },
                {
                    "name": "K'iche' (Guatemala)  (quc-Latn-GT)",
                    "value": "quc-Latn-GT"
                },
                {
                    "name": "Kikuyu (Kenya)  (ki-KE)",
                    "value": "ki-KE"
                },
                {
                    "name": "Kinyarwanda (Rwanda)  (rw-RW)",
                    "value": "rw-RW"
                },
                {
                    "name": "Kiswahili (Congo DRC)  (sw-CD)",
                    "value": "sw-CD"
                },
                {
                    "name": "Kiswahili (Kenya)  (sw-KE)",
                    "value": "sw-KE"
                },
                {
                    "name": "Kiswahili (Tanzania)  (sw-TZ)",
                    "value": "sw-TZ"
                },
                {
                    "name": "Kiswahili (Uganda)  (sw-UG)",
                    "value": "sw-UG"
                },
                {
                    "name": "Konkani (India)  (kok-IN)",
                    "value": "kok-IN"
                },
                {
                    "name": "Korean (Korea)  (ko-KR)",
                    "value": "ko-KR"
                },
                {
                    "name": "Korean (North Korea)  (ko-KP)",
                    "value": "ko-KP"
                },
                {
                    "name": "Koyra Chiini (Mali)  (khq-ML)",
                    "value": "khq-ML"
                },
                {
                    "name": "Koyraboro Senni (Mali)  (ses-ML)",
                    "value": "ses-ML"
                },
                {
                    "name": "Kurdish (Perso-Arabic, Iran)  (ku-Arab-IR)",
                    "value": "ku-Arab-IR"
                },
                {
                    "name": "Kwasio (Cameroon)  (nmg-CM)",
                    "value": "nmg-CM"
                },
                {
                    "name": "Kyrgyz (Kyrgyzstan)  (ky-KG)",
                    "value": "ky-KG"
                },
                {
                    "name": "Lakota (United States)  (lkt-US)",
                    "value": "lkt-US"
                },
                {
                    "name": "Langi (Tanzania)  (lag-TZ)",
                    "value": "lag-TZ"
                },
                {
                    "name": "Lao (Lao P.D.R.)  (lo-LA)",
                    "value": "lo-LA"
                },
                {
                    "name": "Latin (World)  (la-001)",
                    "value": "la-001"
                },
                {
                    "name": "Latvian (Latvia)  (lv-LV)",
                    "value": "lv-LV"
                },
                {
                    "name": "Lingala (Angola)  (ln-AO)",
                    "value": "ln-AO"
                },
                {
                    "name": "Lingala (Central African Republic)  (ln-CF)",
                    "value": "ln-CF"
                },
                {
                    "name": "Lingala (Congo DRC)  (ln-CD)",
                    "value": "ln-CD"
                },
                {
                    "name": "Lingala (Congo)  (ln-CG)",
                    "value": "ln-CG"
                },
                {
                    "name": "Lithuanian (Lithuania)  (lt-LT)",
                    "value": "lt-LT"
                },
                {
                    "name": "Low German (Germany)  (nds-DE)",
                    "value": "nds-DE"
                },
                {
                    "name": "Low German (Netherlands)  (nds-NL)",
                    "value": "nds-NL"
                },
                {
                    "name": "Lower Sorbian (Germany)  (dsb-DE)",
                    "value": "dsb-DE"
                },
                {
                    "name": "Luba-Katanga (Congo DRC)  (lu-CD)",
                    "value": "lu-CD"
                },
                {
                    "name": "Luo (Kenya)  (luo-KE)",
                    "value": "luo-KE"
                },
                {
                    "name": "Luxembourgish (Luxembourg)  (lb-LU)",
                    "value": "lb-LU"
                },
                {
                    "name": "Luyia (Kenya)  (luy-KE)",
                    "value": "luy-KE"
                },
                {
                    "name": "Macedonian (North Macedonia)  (mk-MK)",
                    "value": "mk-MK"
                },
                {
                    "name": "Machame (Tanzania)  (jmc-TZ)",
                    "value": "jmc-TZ"
                },
                {
                    "name": "Makhuwa-Meetto (Mozambique)  (mgh-MZ)",
                    "value": "mgh-MZ"
                },
                {
                    "name": "Makonde (Tanzania)  (kde-TZ)",
                    "value": "kde-TZ"
                },
                {
                    "name": "Malagasy (Madagascar)  (mg-MG)",
                    "value": "mg-MG"
                },
                {
                    "name": "Malay (Brunei Darussalam)  (ms-BN)",
                    "value": "ms-BN"
                },
                {
                    "name": "Malay (Latin, Singapore)  (ms-SG)",
                    "value": "ms-SG"
                },
                {
                    "name": "Malay (Malaysia)  (ms-MY)",
                    "value": "ms-MY"
                },
                {
                    "name": "Malayalam (India)  (ml-IN)",
                    "value": "ml-IN"
                },
                {
                    "name": "Maltese (Malta)  (mt-MT)",
                    "value": "mt-MT"
                },
                {
                    "name": "Manipuri (India)  (mni-IN)",
                    "value": "mni-IN"
                },
                {
                    "name": "Manx (Isle of Man)  (gv-IM)",
                    "value": "gv-IM"
                },
                {
                    "name": "Maori (New Zealand)  (mi-NZ)",
                    "value": "mi-NZ"
                },
                {
                    "name": "Mapudungun (Chile)  (arn-CL)",
                    "value": "arn-CL"
                },
                {
                    "name": "Marathi (India)  (mr-IN)",
                    "value": "mr-IN"
                },
                {
                    "name": "Masai (Kenya)  (mas-KE)",
                    "value": "mas-KE"
                },
                {
                    "name": "Masai (Tanzania)  (mas-TZ)",
                    "value": "mas-TZ"
                },
                {
                    "name": "Mazanderani (Iran)  (mzn-IR)",
                    "value": "mzn-IR"
                },
                {
                    "name": "Meru (Kenya)  (mer-KE)",
                    "value": "mer-KE"
                },
                {
                    "name": "Meta' (Cameroon)  (mgo-CM)",
                    "value": "mgo-CM"
                },
                {
                    "name": "Mohawk (Mohawk)  (moh-CA)",
                    "value": "moh-CA"
                },
                {
                    "name": "Mongolian (Cyrillic, Mongolia)  (mn-MN)",
                    "value": "mn-MN"
                },
                {
                    "name": "Mongolian (Traditional Mongolian, Mongolia)  (mn-Mong-MN)",
                    "value": "mn-Mong-MN"
                },
                {
                    "name": "Mongolian (Traditional Mongolian, PRC)  (mn-Mong-CN)",
                    "value": "mn-Mong-CN"
                },
                {
                    "name": "Morisyen (Mauritius)  (mfe-MU)",
                    "value": "mfe-MU"
                },
                {
                    "name": "Mundang (Cameroon)  (mua-CM)",
                    "value": "mua-CM"
                },
                {
                    "name": "Nama (Namibia)  (naq-NA)",
                    "value": "naq-NA"
                },
                {
                    "name": "Nepali (India)  (ne-IN)",
                    "value": "ne-IN"
                },
                {
                    "name": "Nepali (Nepal)  (ne-NP)",
                    "value": "ne-NP"
                },
                {
                    "name": "Ngiemboon (Cameroon)  (nnh-CM)",
                    "value": "nnh-CM"
                },
                {
                    "name": "Ngomba (Cameroon)  (jgo-CM)",
                    "value": "jgo-CM"
                },
                {
                    "name": "N'ko (Guinea)  (nqo-GN)",
                    "value": "nqo-GN"
                },
                {
                    "name": "North Ndebele (Zimbabwe)  (nd-ZW)",
                    "value": "nd-ZW"
                },
                {
                    "name": "Northern Luri (Iran)  (lrc-IR)",
                    "value": "lrc-IR"
                },
                {
                    "name": "Northern Luri (Iraq)  (lrc-IQ)",
                    "value": "lrc-IQ"
                },
                {
                    "name": "Norwegian, Bokmål (Norway)  (nb-NO)",
                    "value": "nb-NO"
                },
                {
                    "name": "Norwegian, Bokmål (Svalbard and Jan Mayen)  (nb-SJ)",
                    "value": "nb-SJ"
                },
                {
                    "name": "Norwegian, Nynorsk (Norway)  (nn-NO)",
                    "value": "nn-NO"
                },
                {
                    "name": "Nuer (South Sudan)  (nus-SS)",
                    "value": "nus-SS"
                },
                {
                    "name": "Nyankole (Uganda)  (nyn-UG)",
                    "value": "nyn-UG"
                },
                {
                    "name": "Occitan (France)  (oc-FR)",
                    "value": "oc-FR"
                },
                {
                    "name": "Odia (India)  (or-IN)",
                    "value": "or-IN"
                },
                {
                    "name": "Oromo (Ethiopia)  (om-ET)",
                    "value": "om-ET"
                },
                {
                    "name": "Oromo (Kenya)  (om-KE)",
                    "value": "om-KE"
                },
                {
                    "name": "Ossetian (Cyrillic, Georgia)  (os-GE)",
                    "value": "os-GE"
                },
                {
                    "name": "Ossetian (Cyrillic, Russia)  (os-RU)",
                    "value": "os-RU"
                },
                {
                    "name": "Papiamento (Caribbean)  (pap-029)",
                    "value": "pap-029"
                },
                {
                    "name": "Pashto (Afghanistan)  (ps-AF)",
                    "value": "ps-AF"
                },
                {
                    "name": "Pashto (Pakistan)  (ps-PK)",
                    "value": "ps-PK"
                },
                {
                    "name": "Persian (Iran)  (fa-IR)",
                    "value": "fa-IR"
                },
                {
                    "name": "Polish (Poland)  (pl-PL)",
                    "value": "pl-PL"
                },
                {
                    "name": "Portuguese (Angola)  (pt-AO)",
                    "value": "pt-AO"
                },
                {
                    "name": "Portuguese (Brazil)  (pt-BR)",
                    "value": "pt-BR"
                },
                {
                    "name": "Portuguese (Cabo Verde)  (pt-CV)",
                    "value": "pt-CV"
                },
                {
                    "name": "Portuguese (Equatorial Guinea)  (pt-GQ)",
                    "value": "pt-GQ"
                },
                {
                    "name": "Portuguese (Guinea-Bissau)  (pt-GW)",
                    "value": "pt-GW"
                },
                {
                    "name": "Portuguese (Luxembourg)  (pt-LU)",
                    "value": "pt-LU"
                },
                {
                    "name": "Portuguese (Macao SAR)  (pt-MO)",
                    "value": "pt-MO"
                },
                {
                    "name": "Portuguese (Mozambique)  (pt-MZ)",
                    "value": "pt-MZ"
                },
                {
                    "name": "Portuguese (Portugal)  (pt-PT)",
                    "value": "pt-PT"
                },
                {
                    "name": "Portuguese (São Tomé and Príncipe)  (pt-ST)",
                    "value": "pt-ST"
                },
                {
                    "name": "Portuguese (Switzerland)  (pt-CH)",
                    "value": "pt-CH"
                },
                {
                    "name": "Portuguese (Timor-Leste)  (pt-TL)",
                    "value": "pt-TL"
                },
                {
                    "name": "Prussian (World)  (prg-001)",
                    "value": "prg-001"
                },
                {
                    "name": "Punjabi (India)  (pa-IN)",
                    "value": "pa-IN"
                },
                {
                    "name": "Punjabi (Islamic Republic of Pakistan)  (pa-Arab-PK)",
                    "value": "pa-Arab-PK"
                },
                {
                    "name": "Quechua (Bolivia)  (quz-BO)",
                    "value": "quz-BO"
                },
                {
                    "name": "Quechua (Ecuador)  (quz-EC)",
                    "value": "quz-EC"
                },
                {
                    "name": "Quechua (Peru)  (quz-PE)",
                    "value": "quz-PE"
                },
                {
                    "name": "Ripuarian (Germany)  (ksh-DE)",
                    "value": "ksh-DE"
                },
                {
                    "name": "Romanian (Moldova)  (ro-MD)",
                    "value": "ro-MD"
                },
                {
                    "name": "Romanian (Romania)  (ro-RO)",
                    "value": "ro-RO"
                },
                {
                    "name": "Romansh (Switzerland)  (rm-CH)",
                    "value": "rm-CH"
                },
                {
                    "name": "Rombo (Tanzania)  (rof-TZ)",
                    "value": "rof-TZ"
                },
                {
                    "name": "Rundi (Burundi)  (rn-BI)",
                    "value": "rn-BI"
                },
                {
                    "name": "Russian (Belarus)  (ru-BY)",
                    "value": "ru-BY"
                },
                {
                    "name": "Russian (Kazakhstan)  (ru-KZ)",
                    "value": "ru-KZ"
                },
                {
                    "name": "Russian (Kyrgyzstan)  (ru-KG)",
                    "value": "ru-KG"
                },
                {
                    "name": "Russian (Moldova)  (ru-MD)",
                    "value": "ru-MD"
                },
                {
                    "name": "Russian (Russia)  (ru-RU)",
                    "value": "ru-RU"
                },
                {
                    "name": "Russian (Ukraine)  (ru-UA)",
                    "value": "ru-UA"
                },
                {
                    "name": "Rwa (Tanzania)  (rwk-TZ)",
                    "value": "rwk-TZ"
                },
                {
                    "name": "Saho (Eritrea)  (ssy-ER)",
                    "value": "ssy-ER"
                },
                {
                    "name": "Sakha (Russia)  (sah-RU)",
                    "value": "sah-RU"
                },
                {
                    "name": "Samburu (Kenya)  (saq-KE)",
                    "value": "saq-KE"
                },
                {
                    "name": "Sami, Inari (Finland)  (smn-FI)",
                    "value": "smn-FI"
                },
                {
                    "name": "Sami, Lule (Norway)  (smj-NO)",
                    "value": "smj-NO"
                },
                {
                    "name": "Sami, Lule (Sweden)  (smj-SE)",
                    "value": "smj-SE"
                },
                {
                    "name": "Sami, Northern (Finland)  (se-FI)",
                    "value": "se-FI"
                },
                {
                    "name": "Sami, Northern (Norway)  (se-NO)",
                    "value": "se-NO"
                },
                {
                    "name": "Sami, Northern (Sweden)  (se-SE)",
                    "value": "se-SE"
                },
                {
                    "name": "Sami, Skolt (Finland)  (sms-FI)",
                    "value": "sms-FI"
                },
                {
                    "name": "Sami, Southern (Norway)  (sma-NO)",
                    "value": "sma-NO"
                },
                {
                    "name": "Sami, Southern (Sweden)  (sma-SE)",
                    "value": "sma-SE"
                },
                {
                    "name": "Sango (Central African Republic)  (sg-CF)",
                    "value": "sg-CF"
                },
                {
                    "name": "Sangu (Tanzania)  (sbp-TZ)",
                    "value": "sbp-TZ"
                },
                {
                    "name": "Sanskrit (India)  (sa-IN)",
                    "value": "sa-IN"
                },
                {
                    "name": "Scottish Gaelic (United Kingdom)  (gd-GB)",
                    "value": "gd-GB"
                },
                {
                    "name": "Sena (Mozambique)  (seh-MZ)",
                    "value": "seh-MZ"
                },
                {
                    "name": "Serbian (Cyrillic, Bosnia and Herzegovina)  (sr-Cyrl-BA)",
                    "value": "sr-Cyrl-BA"
                },
                {
                    "name": "Serbian (Cyrillic, Kosovo)  (sr-Cyrl-XK)",
                    "value": "sr-Cyrl-XK"
                },
                {
                    "name": "Serbian (Cyrillic, Montenegro)  (sr-Cyrl-ME)",
                    "value": "sr-Cyrl-ME"
                },
                {
                    "name": "Serbian (Cyrillic, Serbia)  (sr-Cyrl-RS)",
                    "value": "sr-Cyrl-RS"
                },
                {
                    "name": "Serbian (Latin, Bosnia and Herzegovina)  (sr-Latn-BA)",
                    "value": "sr-Latn-BA"
                },
                {
                    "name": "Serbian (Latin, Kosovo)  (sr-Latn-XK)",
                    "value": "sr-Latn-XK"
                },
                {
                    "name": "Serbian (Latin, Montenegro)  (sr-Latn-ME)",
                    "value": "sr-Latn-ME"
                },
                {
                    "name": "Serbian (Latin, Serbia)  (sr-Latn-RS)",
                    "value": "sr-Latn-RS"
                },
                {
                    "name": "Sesotho (Lesotho)  (st-LS)",
                    "value": "st-LS"
                },
                {
                    "name": "Sesotho sa Leboa (South Africa)  (nso-ZA)",
                    "value": "nso-ZA"
                },
                {
                    "name": "Setswana (Botswana)  (tn-BW)",
                    "value": "tn-BW"
                },
                {
                    "name": "Setswana (South Africa)  (tn-ZA)",
                    "value": "tn-ZA"
                },
                {
                    "name": "Shambala (Tanzania)  (ksb-TZ)",
                    "value": "ksb-TZ"
                },
                {
                    "name": "Shona (Latin, Zimbabwe)  (sn-Latn-ZW)",
                    "value": "sn-Latn-ZW"
                },
                {
                    "name": "Sindhi (Devanagari, India)  (sd-Deva-IN)",
                    "value": "sd-Deva-IN"
                },
                {
                    "name": "Sindhi (Islamic Republic of Pakistan)  (sd-Arab-PK)",
                    "value": "sd-Arab-PK"
                },
                {
                    "name": "Sinhala (Sri Lanka)  (si-LK)",
                    "value": "si-LK"
                },
                {
                    "name": "Slovak (Slovakia)  (sk-SK)",
                    "value": "sk-SK"
                },
                {
                    "name": "Slovenian (Slovenia)  (sl-SI)",
                    "value": "sl-SI"
                },
                {
                    "name": "Soga (Uganda)  (xog-UG)",
                    "value": "xog-UG"
                },
                {
                    "name": "Somali (Djibouti)  (so-DJ)",
                    "value": "so-DJ"
                },
                {
                    "name": "Somali (Ethiopia)  (so-ET)",
                    "value": "so-ET"
                },
                {
                    "name": "Somali (Kenya)  (so-KE)",
                    "value": "so-KE"
                },
                {
                    "name": "Somali (Somalia)  (so-SO)",
                    "value": "so-SO"
                },
                {
                    "name": "South Ndebele (South Africa)  (nr-ZA)",
                    "value": "nr-ZA"
                },
                {
                    "name": "Southern Sotho (South Africa)  (st-ZA)",
                    "value": "st-ZA"
                },
                {
                    "name": "Spanish (Argentina)  (es-AR)",
                    "value": "es-AR"
                },
                {
                    "name": "Spanish (Belize)  (es-BZ)",
                    "value": "es-BZ"
                },
                {
                    "name": "Spanish (Bolivarian Republic of Venezuela)  (es-VE)",
                    "value": "es-VE"
                },
                {
                    "name": "Spanish (Bolivia)  (es-BO)",
                    "value": "es-BO"
                },
                {
                    "name": "Spanish (Brazil)  (es-BR)",
                    "value": "es-BR"
                },
                {
                    "name": "Spanish (Chile)  (es-CL)",
                    "value": "es-CL"
                },
                {
                    "name": "Spanish (Colombia)  (es-CO)",
                    "value": "es-CO"
                },
                {
                    "name": "Spanish (Costa Rica)  (es-CR)",
                    "value": "es-CR"
                },
                {
                    "name": "Spanish (Cuba)  (es-CU)",
                    "value": "es-CU"
                },
                {
                    "name": "Spanish (Dominican Republic)  (es-DO)",
                    "value": "es-DO"
                },
                {
                    "name": "Spanish (Ecuador)  (es-EC)",
                    "value": "es-EC"
                },
                {
                    "name": "Spanish (El Salvador)  (es-SV)",
                    "value": "es-SV"
                },
                {
                    "name": "Spanish (Equatorial Guinea)  (es-GQ)",
                    "value": "es-GQ"
                },
                {
                    "name": "Spanish (Guatemala)  (es-GT)",
                    "value": "es-GT"
                },
                {
                    "name": "Spanish (Honduras)  (es-HN)",
                    "value": "es-HN"
                },
                {
                    "name": "Spanish (Latin America)  (es-419)",
                    "value": "es-419"
                },
                {
                    "name": "Spanish (Mexico)  (es-MX)",
                    "value": "es-MX"
                },
                {
                    "name": "Spanish (Nicaragua)  (es-NI)",
                    "value": "es-NI"
                },
                {
                    "name": "Spanish (Panama)  (es-PA)",
                    "value": "es-PA"
                },
                {
                    "name": "Spanish (Paraguay)  (es-PY)",
                    "value": "es-PY"
                },
                {
                    "name": "Spanish (Peru)  (es-PE)",
                    "value": "es-PE"
                },
                {
                    "name": "Spanish (Philippines)  (es-PH)",
                    "value": "es-PH"
                },
                {
                    "name": "Spanish (Puerto Rico)  (es-PR)",
                    "value": "es-PR"
                },
                {
                    "name": "Spanish (Spain)  (es-ES)",
                    "value": "es-ES"
                },
                {
                    "name": "Spanish (United States)  (es-US)",
                    "value": "es-US"
                },
                {
                    "name": "Spanish (Uruguay)  (es-UY)",
                    "value": "es-UY"
                },
                {
                    "name": "Standard Moroccan Tamazight (Tifinagh, Morocco)  (zgh-Tfng-MA)",
                    "value": "zgh-Tfng-MA"
                },
                {
                    "name": "Swati (South Africa)  (ss-ZA)",
                    "value": "ss-ZA"
                },
                {
                    "name": "Swati (Swaziland)  (ss-SZ)",
                    "value": "ss-SZ"
                },
                {
                    "name": "Swedish (Åland Islands)  (sv-AX)",
                    "value": "sv-AX"
                },
                {
                    "name": "Swedish (Finland)  (sv-FI)",
                    "value": "sv-FI"
                },
                {
                    "name": "Swedish (Sweden)  (sv-SE)",
                    "value": "sv-SE"
                },
                {
                    "name": "Syriac (Syria)  (syr-SY)",
                    "value": "syr-SY"
                },
                {
                    "name": "Tachelhit (Latin, Morocco)  (shi-Latn-MA)",
                    "value": "shi-Latn-MA"
                },
                {
                    "name": "Tachelhit (Tifinagh, Morocco)  (shi-Tfng-MA)",
                    "value": "shi-Tfng-MA"
                },
                {
                    "name": "Taita (Kenya)  (dav-KE)",
                    "value": "dav-KE"
                },
                {
                    "name": "Tajik (Cyrillic, Tajikistan)  (tg-Cyrl-TJ)",
                    "value": "tg-Cyrl-TJ"
                },
                {
                    "name": "Tamazight (Latin, Algeria)  (tzm-Latn-DZ)",
                    "value": "tzm-Latn-DZ"
                },
                {
                    "name": "Tamil (India)  (ta-IN)",
                    "value": "ta-IN"
                },
                {
                    "name": "Tamil (Malaysia)  (ta-MY)",
                    "value": "ta-MY"
                },
                {
                    "name": "Tamil (Singapore)  (ta-SG)",
                    "value": "ta-SG"
                },
                {
                    "name": "Tamil (Sri Lanka)  (ta-LK)",
                    "value": "ta-LK"
                },
                {
                    "name": "Tasawaq (Niger)  (twq-NE)",
                    "value": "twq-NE"
                },
                {
                    "name": "Tatar (Russia)  (tt-RU)",
                    "value": "tt-RU"
                },
                {
                    "name": "Telugu (India)  (te-IN)",
                    "value": "te-IN"
                },
                {
                    "name": "Teso (Kenya)  (teo-KE)",
                    "value": "teo-KE"
                },
                {
                    "name": "Teso (Uganda)  (teo-UG)",
                    "value": "teo-UG"
                },
                {
                    "name": "Thai (Thailand)  (th-TH)",
                    "value": "th-TH"
                },
                {
                    "name": "Tibetan (India)  (bo-IN)",
                    "value": "bo-IN"
                },
                {
                    "name": "Tibetan (PRC)  (bo-CN)",
                    "value": "bo-CN"
                },
                {
                    "name": "Tigre (Eritrea)  (tig-ER)",
                    "value": "tig-ER"
                },
                {
                    "name": "Tigrinya (Eritrea)  (ti-ER)",
                    "value": "ti-ER"
                },
                {
                    "name": "Tigrinya (Ethiopia)  (ti-ET)",
                    "value": "ti-ET"
                },
                {
                    "name": "Tongan (Tonga)  (to-TO)",
                    "value": "to-TO"
                },
                {
                    "name": "Tsonga (South Africa)  (ts-ZA)",
                    "value": "ts-ZA"
                },
                {
                    "name": "Turkish (Cyprus)  (tr-CY)",
                    "value": "tr-CY"
                },
                {
                    "name": "Turkish (Turkey)  (tr-TR)",
                    "value": "tr-TR"
                },
                {
                    "name": "Turkmen (Turkmenistan)  (tk-TM)",
                    "value": "tk-TM"
                },
                {
                    "name": "Ukrainian (Ukraine)  (uk-UA)",
                    "value": "uk-UA"
                },
                {
                    "name": "Upper Sorbian (Germany)  (hsb-DE)",
                    "value": "hsb-DE"
                },
                {
                    "name": "Urdu (India)  (ur-IN)",
                    "value": "ur-IN"
                },
                {
                    "name": "Urdu (Islamic Republic of Pakistan)  (ur-PK)",
                    "value": "ur-PK"
                },
                {
                    "name": "Uyghur (PRC)  (ug-CN)",
                    "value": "ug-CN"
                },
                {
                    "name": "Uzbek (Cyrillic, Uzbekistan)  (uz-Cyrl-UZ)",
                    "value": "uz-Cyrl-UZ"
                },
                {
                    "name": "Uzbek (Latin, Uzbekistan)  (uz-Latn-UZ)",
                    "value": "uz-Latn-UZ"
                },
                {
                    "name": "Uzbek (Perso-Arabic, Afghanistan)  (uz-Arab-AF)",
                    "value": "uz-Arab-AF"
                },
                {
                    "name": "Vai (Latin, Liberia)  (vai-Latn-LR)",
                    "value": "vai-Latn-LR"
                },
                {
                    "name": "Vai (Vai, Liberia)  (vai-Vaii-LR)",
                    "value": "vai-Vaii-LR"
                },
                {
                    "name": "Valencian (Spain)  (ca-ES-valencia)",
                    "value": "ca-ES-valencia"
                },
                {
                    "name": "Venda (South Africa)  (ve-ZA)",
                    "value": "ve-ZA"
                },
                {
                    "name": "Vietnamese (Vietnam)  (vi-VN)",
                    "value": "vi-VN"
                },
                {
                    "name": "Volapük (World)  (vo-001)",
                    "value": "vo-001"
                },
                {
                    "name": "Vunjo (Tanzania)  (vun-TZ)",
                    "value": "vun-TZ"
                },
                {
                    "name": "Walser (Switzerland)  (wae-CH)",
                    "value": "wae-CH"
                },
                {
                    "name": "Welsh (United Kingdom)  (cy-GB)",
                    "value": "cy-GB"
                },
                {
                    "name": "Wolaytta (Ethiopia)  (wal-ET)",
                    "value": "wal-ET"
                },
                {
                    "name": "Wolof (Senegal)  (wo-SN)",
                    "value": "wo-SN"
                },
                {
                    "name": "Yangben (Cameroon)  (yav-CM)",
                    "value": "yav-CM"
                },
                {
                    "name": "Yi (PRC)  (ii-CN)",
                    "value": "ii-CN"
                },
                {
                    "name": "Yiddish (World)  (yi-001)",
                    "value": "yi-001"
                },
                {
                    "name": "Yoruba (Benin)  (yo-BJ)",
                    "value": "yo-BJ"
                },
                {
                    "name": "Yoruba (Nigeria)  (yo-NG)",
                    "value": "yo-NG"
                },
                {
                    "name": "Zarma (Niger)  (dje-NE)",
                    "value": "dje-NE"
                }
            ];
        return this._cultures;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiHelperService, deps: [{ token: StiModelService }, { token: StiRectangleGeometryLayout }, { token: StiLocalizationService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiHelperService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiHelperService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiRectangleGeometryLayout }, { type: StiLocalizationService }, { type: i0.NgZone }] });

class StiHttpClientService {
    constructor(httpClient, model, helper, loc) {
        this.httpClient = httpClient;
        this.model = model;
        this.helper = helper;
        this.loc = loc;
    }
    post(url, data, responseType = "json", options) {
        if (this.model.isWebView) {
            return this.postWebView(data, options);
        }
        else if (this.model.embeddedMode && data?.action == "InterfaceEvent") {
            this.model.embeddedEvent(data);
            return new Observable((observer) => {
                observer.next({});
            });
        }
        else {
            return this.postHttp(url, data, responseType, options);
        }
    }
    loadLocalization(cultureName) {
        this.loc.currentLocalization = this.loc.localizationList.find((item) => item.cultureName == cultureName);
        this.post(this.model.requestUrl, { action: "GetLocalization", localization: cultureName }).subscribe((data) => {
            StiLocalizationService.setLocalization(data.localization);
            this.model.needToRefresh.next(true);
            this.helper.updateHelper();
        });
    }
    postWebView(data, options) {
        let webView = window.chrome.webview.hostObjects.sync.webView;
        let model = this.model;
        model.showProgress = options && options.showProgress === false ? false : true;
        let observer = new Observable((observer) => {
            setTimeout(() => {
                let result = webView.Action(this.getData(data));
                let jsonResult = JSON.parse(result);
                let jsonData = jsonResult.data;
                if (jsonResult.contentType == "application/pdf") {
                    jsonData = atob(jsonData);
                    var len = jsonData.length;
                    var bytes = new Uint8Array(len);
                    for (var i = 0; i < len; i++) {
                        bytes[i] = jsonData.charCodeAt(i);
                    }
                    jsonData = bytes.buffer;
                }
                model.showProgress = false;
                observer.next(jsonData);
            }, 0);
        });
        return observer;
    }
    postHttp(url, data, responseType = "json", options) {
        const reqTimeout = 1000 * 1000;
        const model = this.model;
        model.showProgress = options && options.showProgress === false ? false : true;
        if (responseType === "json") {
            return this.httpClient.post(url, this.getFormData(data)).pipe(
            // retry(3),
            timeout(reqTimeout), catchError((error) => {
                //model.httpError = error;
                model.showProgress = false;
                model.showError(error.error);
                return throwError("Something bad happened; please try again later.");
            }));
        }
        else {
            return this.httpClient.post(url, this.getFormData(data), { responseType: "arraybuffer" }).pipe(
            // retry(3),
            timeout(reqTimeout), catchError((error) => {
                //model.httpError = error;
                model.showProgress = false;
                model.showError(error.error);
                return throwError("Something bad happened; please try again later.");
            }));
        }
    }
    getData(data) {
        if (this.model.properties) {
            data["properties"] = this.model.properties;
        }
        return JSON.stringify(data);
    }
    getFormData(data) {
        const formData = new FormData();
        if (this.model.properties) {
            data["properties"] = this.model.properties;
        }
        formData.append("data", JSON.stringify(data));
        return formData;
    }
    postForm(url, data, doc, postOnlyData = false) {
        if (!doc) {
            doc = document;
        }
        const form = doc.createElement("FORM");
        form.setAttribute("method", "POST");
        form.setAttribute("action", url);
        const params = data;
        Object.keys(params).forEach((key) => {
            const paramsField = doc.createElement("INPUT");
            paramsField.setAttribute("type", "hidden");
            paramsField.setAttribute("name", key);
            paramsField.setAttribute("value", params[key]);
            form.appendChild(paramsField);
        });
        doc.body.appendChild(form);
        form.submit();
        doc.body.removeChild(form);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiHttpClientService, deps: [{ token: i1.HttpClient }, { token: StiModelService }, { token: StiHelperService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiHttpClientService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiHttpClientService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: StiModelService }, { type: StiHelperService }, { type: StiLocalizationService }] });

class StiUndoService {
    static { this.UNDO_SIZE = 30; }
    constructor(model) {
        this.model = model;
        this.undos = [];
        this.redos = [];
        model.formEvents.subscribe((e) => {
            if (e.name == "FormChanged") {
                this.addToUndo();
            }
            else if (e.name == "SetForm") {
                this.undos = [];
                this.addToUndo();
            }
        });
    }
    undoRedo(from, to) {
        to.push(from.splice(from.length - 1, 1)[0]);
        if (to.length > StiUndoService.UNDO_SIZE) {
            to.splice(0, 1);
        }
        let fromObj = this.undos[this.undos.length - 1];
        let form = new StiForm();
        form.loadFormJsonString(fromObj.form);
        this.model.selectedComponent = null;
        if (fromObj.guid) {
            form.pages.forEach((p) => {
                if (p.guid == fromObj.guid) {
                    this.model.selectedPage = p;
                }
            });
            form.pages.forEach((p) => p.allElements.forEach((e) => {
                if (e.guid == fromObj.guid) {
                    e.needToSelectComponent = true;
                }
            }));
        }
        this.model.updateForm(form);
        this.model.showTrialLog();
    }
    addToUndo() {
        this.model.showTrialLog();
        let formStr = this.model.form.saveToJsonObject().serialize();
        this.undos.push({
            form: formStr,
            guid: this.model.selectedComponent?.element.guid ?? this.model.selectedPage?.guid,
            num: this.undos.length,
        });
        if (this.undos.length > StiUndoService.UNDO_SIZE) {
            this.undos.splice(0, 1);
        }
        this.redos = [];
    }
    undo() {
        if (this.undos.length > 0) {
            this.undoRedo(this.undos, this.redos);
        }
    }
    redo() {
        if (this.redos.length > 0) {
            this.undoRedo(this.redos, this.undos);
        }
    }
    markCurrentFormAsUnmodified() {
        this.undos.forEach((u) => (u.unmodified = false));
        this.redos.forEach((u) => (u.unmodified = false));
        this.undos[this.undos.length - 1].unmodified = true;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiUndoService, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiUndoService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiUndoService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }] });

class StiBarcodeService {
    constructor(model, mouseService, httpService, undoService) {
        this.model = model;
        this.mouseService = mouseService;
        this.httpService = httpService;
        this.undoService = undoService;
        this.timerSarted = false;
        this.initialized = false;
        this.previewWidth = 192;
        this.showBarcodePreview = false;
        this.barcodeStyles = [
            {
                value: 1,
                innerHtml: `
        <rect
          x="0"
          y="0"
          width="165.3543"
          height="165.3543"
          fill="red"
          style="fill:rgba(255,255,255,0);"
          shape-rendering="crispEdges"
        />
        <polygon
          points="13.23,13.23 59.53,13.23 59.53,59.53 13.23,59.53 13.23,19.78 19.84,19.78 19.84,52.91 52.91,52.91 52.91,19.84 13.23,19.84 "
          style="fill:rgba(0,0,0,1);"
        />
        <polygon
          points="13.23,105.83 59.53,105.83 59.53,152.13 13.23,152.13 13.23,112.37 19.84,112.37 19.84,145.51 52.91,145.51 52.91,112.44 13.23,112.44 "
          style="fill:rgba(0,0,0,1);"
        />
        <polygon
          points="105.83,13.23 152.13,13.23 152.13,59.53 105.83,59.53 105.83,19.78 112.44,19.78 112.44,52.91 145.51,52.91 145.51,19.84 105.83,19.84 "
          style="fill:rgba(0,0,0,1);"
        />
        <polygon points="26.46,26.46 46.3,26.46 46.3,46.3 26.46,46.3 " style="fill:rgba(0,0,0,1);" />
        <polygon points="26.46,119.06 46.3,119.06 46.3,138.9 26.46,138.9 " style="fill:rgba(0,0,0,1);" />
        <polygon points="119.06,26.46 138.9,26.46 138.9,46.3 119.06,46.3 " style="fill:rgba(0,0,0,1);" />
        <polygon points="79.37,13.23 86.05,13.23 85.98,19.91 79.37,19.91 " style="fill:rgba(0,0,0,1);" />
        <polygon points="85.92,13.23 92.66,13.23 92.53,19.84 85.92,19.84 " style="fill:rgba(0,0,0,1);" />
        <polygon points="92.53,13.23 99.21,13.23 99.15,19.91 92.53,19.91 " style="fill:rgba(0,0,0,1);" />
        <polygon points="66.14,19.84 72.82,19.84 72.76,26.46 66.14,26.46 " style="fill:rgba(0,0,0,1);" />
        <polygon points="72.69,19.84 79.44,19.84 79.3,26.46 72.69,26.46 " style="fill:rgba(0,0,0,1);" />
        <polygon points="79.3,19.78 85.98,19.78 85.92,26.52 79.3,26.52 " style="fill:rgba(0,0,0,1);" />
        <polygon points="92.6,19.78 99.21,19.78 99.21,26.52 92.6,26.52 " style="fill:rgba(0,0,0,1);" />
        <polygon points="79.37,26.39 86.05,26.39 85.98,33.07 79.37,33.07 " style="fill:rgba(0,0,0,1);" />
        <polygon points="85.92,26.46 92.66,26.46 92.53,33.07 85.92,33.07 " style="fill:rgba(0,0,0,1);" />
        <polygon points="92.53,26.39 99.21,26.39 99.15,33.14 92.53,33.14 " style="fill:rgba(0,0,0,1);" />
        <polygon points="66.14,33.07 72.82,33.07 72.76,39.69 66.14,39.69 " style="fill:rgba(0,0,0,1);" />
        <polygon points="72.69,33.07 79.37,33.07 79.3,39.75 72.69,39.75 " style="fill:rgba(0,0,0,1);" />
        <polygon points="92.6,33 99.21,33 99.21,39.75 92.6,39.75 " style="fill:rgba(0,0,0,1);" />
        <polygon points="72.76,39.62 79.37,39.62 79.37,46.3 72.76,46.3 " style="fill:rgba(0,0,0,1);" />
        <polygon points="92.6,39.62 99.21,39.62 99.21,46.3 92.6,46.3 " style="fill:rgba(0,0,0,1);" />
        <polygon points="66.14,46.3 72.76,46.3 72.76,52.98 66.14,52.98 " style="fill:rgba(0,0,0,1);" />
        <polygon points="85.98,46.3 92.6,46.3 92.6,52.91 85.98,52.91 " style="fill:rgba(0,0,0,1);" />
        <polygon points="66.14,52.85 72.76,52.85 72.76,59.53 66.14,59.53 " style="fill:rgba(0,0,0,1);" />
        <polygon points="79.37,52.91 85.98,52.91 85.98,59.53 79.37,59.53 " style="fill:rgba(0,0,0,1);" />
        <polygon points="92.6,52.91 99.21,52.91 99.21,59.53 92.6,59.53 " style="fill:rgba(0,0,0,1);" />
        <polygon points="72.76,59.53 79.37,59.53 79.37,66.14 72.76,66.14 " style="fill:rgba(0,0,0,1);" />
        <polygon points="13.23,66.14 19.91,66.14 19.84,72.82 13.23,72.82 " style="fill:rgba(0,0,0,1);" />
        <polygon points="19.78,66.14 26.52,66.14 26.39,72.82 19.78,72.82 " style="fill:rgba(0,0,0,1);" />
        <polygon points="26.39,66.14 33.14,66.14 33,72.82 26.39,72.82 " style="fill:rgba(0,0,0,1);" />
        <polygon points="33,66.14 39.75,66.14 39.62,72.76 33,72.76 " style="fill:rgba(0,0,0,1);" />
        <polygon points="39.62,66.14 46.3,66.14 46.23,72.76 39.62,72.76 " style="fill:rgba(0,0,0,1);" />
        <polygon points="52.91,66.14 59.59,66.14 59.53,72.76 52.91,72.76 " style="fill:rgba(0,0,0,1);" />
        <polygon points="59.46,66.14 66.21,66.14 66.08,72.82 59.46,72.82 " style="fill:rgba(0,0,0,1);" />
        <polygon points="66.08,66.14 72.76,66.14 72.69,72.76 66.08,72.76 " style="fill:rgba(0,0,0,1);" />
        <polygon points="85.98,66.14 92.6,66.14 92.6,72.82 85.98,72.82 " style="fill:rgba(0,0,0,1);" />
        <polygon points="99.21,66.14 105.83,66.14 105.83,72.82 99.21,72.82 " style="fill:rgba(0,0,0,1);" />
        <polygon points="112.44,66.14 119.06,66.14 119.06,72.76 112.44,72.76 " style="fill:rgba(0,0,0,1);" />
        <polygon points="125.67,66.14 132.28,66.14 132.28,72.82 125.67,72.82 " style="fill:rgba(0,0,0,1);" />
        <polygon points="138.9,66.14 145.51,66.14 145.51,72.82 138.9,72.82 " style="fill:rgba(0,0,0,1);" />
        <polygon points="13.23,72.69 19.91,72.69 19.84,79.37 13.23,79.37 " style="fill:rgba(0,0,0,1);" />
        <polygon points="19.78,72.69 26.52,72.69 26.39,79.37 19.78,79.37 " style="fill:rgba(0,0,0,1);" />
        <polygon points="26.39,72.69 33.07,72.69 33,79.44 26.39,79.44 " style="fill:rgba(0,0,0,1);" />
        <polygon points="46.3,72.76 52.91,72.76 52.91,79.44 46.3,79.44 " style="fill:rgba(0,0,0,1);" />
        <polygon points="59.53,72.69 66.14,72.69 66.14,79.37 59.53,79.37 " style="fill:rgba(0,0,0,1);" />
        <polygon points="72.76,72.76 79.37,72.76 79.37,79.44 72.76,79.44 " style="fill:rgba(0,0,0,1);" />
        <polygon points="85.98,72.69 92.66,72.69 92.6,79.37 85.98,79.37 " style="fill:rgba(0,0,0,1);" />
        <polygon points="92.53,72.76 99.28,72.76 99.15,79.44 92.53,79.44 " style="fill:rgba(0,0,0,1);" />
        <polygon points="99.15,72.69 105.89,72.69 105.76,79.37 99.15,79.37 " style="fill:rgba(0,0,0,1);" />
        <polygon points="105.76,72.76 112.44,72.76 112.37,79.44 105.76,79.44 " style="fill:rgba(0,0,0,1);" />
        <polygon points="125.67,72.69 132.35,72.69 132.28,79.44 125.67,79.44 " style="fill:rgba(0,0,0,1);" />
        <polygon points="132.22,72.76 138.96,72.76 138.83,79.37 132.22,79.37 " style="fill:rgba(0,0,0,1);" />
        <polygon points="138.83,72.69 145.58,72.69 145.45,79.37 138.83,79.37 " style="fill:rgba(0,0,0,1);" />
        <polygon points="145.45,72.76 152.13,72.76 152.06,79.44 145.45,79.44 " style="fill:rgba(0,0,0,1);" />
        <polygon points="26.46,79.3 33.07,79.3 33.07,85.98 26.46,85.98 " style="fill:rgba(0,0,0,1);" />
        <polygon points="39.69,79.37 46.37,79.37 46.3,85.98 39.69,85.98 " style="fill:rgba(0,0,0,1);" />
        <polygon points="46.23,79.3 52.98,79.3 52.85,85.98 46.23,85.98 " style="fill:rgba(0,0,0,1);" />
        <polygon points="52.85,79.37 59.53,79.37 59.46,85.98 52.85,85.98 " style="fill:rgba(0,0,0,1);" />
        <polygon points="66.14,79.37 72.82,79.37 72.76,85.98 66.14,85.98 " style="fill:rgba(0,0,0,1);" />
        <polygon points="72.69,79.3 79.37,79.3 79.3,85.98 72.69,85.98 " style="fill:rgba(0,0,0,1);" />
        <polygon points="92.6,79.3 99.21,79.3 99.21,86.05 92.6,86.05 " style="fill:rgba(0,0,0,1);" />
        <polygon points="105.83,79.3 112.51,79.3 112.44,86.05 105.83,86.05 " style="fill:rgba(0,0,0,1);" />
        <polygon points="112.37,79.37 119.06,79.37 118.99,85.98 112.37,85.98 " style="fill:rgba(0,0,0,1);" />
        <polygon points="125.67,79.3 132.28,79.3 132.28,85.98 125.67,85.98 " style="fill:rgba(0,0,0,1);" />
        <polygon points="145.51,79.3 152.13,79.3 152.13,86.05 145.51,86.05 " style="fill:rgba(0,0,0,1);" />
        <polygon points="13.23,85.98 19.84,85.98 19.84,92.6 13.23,92.6 " style="fill:rgba(0,0,0,1);" />
        <polygon points="33.07,85.98 39.69,85.98 39.69,92.66 33.07,92.66 " style="fill:rgba(0,0,0,1);" />
        <polygon points="85.98,85.98 92.66,85.98 92.6,92.6 85.98,92.6 " style="fill:rgba(0,0,0,1);" />
        <polygon points="92.53,85.92 99.28,85.92 99.15,92.66 92.53,92.66 " style="fill:rgba(0,0,0,1);" />
        <polygon points="99.15,85.98 105.89,85.98 105.76,92.6 99.15,92.6 " style="fill:rgba(0,0,0,1);" />
        <polygon points="105.76,85.92 112.44,85.92 112.37,92.6 105.76,92.6 " style="fill:rgba(0,0,0,1);" />
        <polygon points="132.28,85.98 138.96,85.98 138.9,92.6 132.28,92.6 " style="fill:rgba(0,0,0,1);" />
        <polygon points="138.83,85.98 145.58,85.98 145.45,92.66 138.83,92.66 " style="fill:rgba(0,0,0,1);" />
        <polygon points="145.45,85.92 152.13,85.92 152.06,92.6 145.45,92.6 " style="fill:rgba(0,0,0,1);" />
        <polygon points="19.84,92.6 26.46,92.6 26.46,99.21 19.84,99.21 " style="fill:rgba(0,0,0,1);" />
        <polygon points="33.07,92.53 39.75,92.53 39.69,99.21 33.07,99.21 " style="fill:rgba(0,0,0,1);" />
        <polygon points="39.62,92.6 46.3,92.6 46.23,99.21 39.62,99.21 " style="fill:rgba(0,0,0,1);" />
        <polygon points="52.91,92.6 59.53,92.6 59.53,99.21 52.91,99.21 " style="fill:rgba(0,0,0,1);" />
        <polygon points="66.14,92.6 72.82,92.6 72.76,99.28 66.14,99.28 " style="fill:rgba(0,0,0,1);" />
        <polygon points="72.69,92.6 79.37,92.6 79.3,99.21 72.69,99.21 " style="fill:rgba(0,0,0,1);" />
        <polygon points="92.6,92.53 99.21,92.53 99.21,99.28 92.6,99.28 " style="fill:rgba(0,0,0,1);" />
        <polygon points="112.44,92.6 119.06,92.6 119.06,99.28 112.44,99.28 " style="fill:rgba(0,0,0,1);" />
        <polygon points="138.9,92.53 145.51,92.53 145.51,99.21 138.9,99.21 " style="fill:rgba(0,0,0,1);" />
        <polygon points="66.14,99.15 72.76,99.15 72.76,105.89 66.14,105.89 " style="fill:rgba(0,0,0,1);" />
        <polygon points="79.37,99.21 85.98,99.21 85.98,105.83 79.37,105.83 " style="fill:rgba(0,0,0,1);" />
        <polygon points="92.6,99.15 99.21,99.15 99.21,105.83 92.6,105.83 " style="fill:rgba(0,0,0,1);" />
        <polygon points="112.44,99.15 119.06,99.15 119.06,105.83 112.44,105.83 " style="fill:rgba(0,0,0,1);" />
        <polygon points="132.28,99.21 138.9,99.21 138.9,105.83 132.28,105.83 " style="fill:rgba(0,0,0,1);" />
        <polygon points="66.14,105.76 72.76,105.76 72.76,112.44 66.14,112.44 " style="fill:rgba(0,0,0,1);" />
        <polygon points="85.98,105.83 92.6,105.83 92.6,112.44 85.98,112.44 " style="fill:rgba(0,0,0,1);" />
        <polygon points="99.21,105.83 105.83,105.83 105.83,112.44 99.21,112.44 " style="fill:rgba(0,0,0,1);" />
        <polygon points="119.06,105.83 125.74,105.83 125.67,112.51 119.06,112.51 " style="fill:rgba(0,0,0,1);" />
        <polygon points="125.6,105.83 132.28,105.83 132.22,112.44 125.6,112.44 " style="fill:rgba(0,0,0,1);" />
        <polygon points="138.9,105.83 145.58,105.83 145.51,112.44 138.9,112.44 " style="fill:rgba(0,0,0,1);" />
        <polygon points="145.45,105.83 152.13,105.83 152.06,112.51 145.45,112.51 " style="fill:rgba(0,0,0,1);" />
        <polygon points="72.76,112.44 79.44,112.44 79.37,119.12 72.76,119.12 " style="fill:rgba(0,0,0,1);" />
        <polygon points="79.3,112.44 85.98,112.44 85.92,119.12 79.3,119.12 " style="fill:rgba(0,0,0,1);" />
        <polygon points="112.44,112.44 119.12,112.44 119.06,119.06 112.44,119.06 " style="fill:rgba(0,0,0,1);" />
        <polygon points="118.99,112.37 125.67,112.37 125.6,119.12 118.99,119.12 " style="fill:rgba(0,0,0,1);" />
        <polygon points="132.28,112.44 138.9,112.44 138.9,119.12 132.28,119.12 " style="fill:rgba(0,0,0,1);" />
        <polygon points="145.51,112.37 152.13,112.37 152.13,119.06 145.51,119.06 " style="fill:rgba(0,0,0,1);" />
        <polygon points="66.14,119.06 72.82,119.06 72.76,125.74 66.14,125.74 " style="fill:rgba(0,0,0,1);" />
        <polygon points="72.69,118.99 79.44,118.99 79.3,125.74 72.69,125.74 " style="fill:rgba(0,0,0,1);" />
        <polygon points="79.3,118.99 86.05,118.99 85.92,125.67 79.3,125.67 " style="fill:rgba(0,0,0,1);" />
        <polygon points="85.92,119.06 92.6,119.06 92.53,125.74 85.92,125.74 " style="fill:rgba(0,0,0,1);" />
        <polygon points="99.21,119.06 105.83,119.06 105.83,125.74 99.21,125.74 " style="fill:rgba(0,0,0,1);" />
        <polygon points="119.06,118.99 125.74,118.99 125.67,125.67 119.06,125.67 " style="fill:rgba(0,0,0,1);" />
        <polygon points="125.6,119.06 132.35,119.06 132.22,125.74 125.6,125.74 " style="fill:rgba(0,0,0,1);" />
        <polygon points="132.22,118.99 138.9,118.99 138.83,125.74 132.22,125.74 " style="fill:rgba(0,0,0,1);" />
        <polygon points="66.14,125.6 72.82,125.6 72.76,132.35 66.14,132.35 " style="fill:rgba(0,0,0,1);" />
        <polygon points="72.69,125.6 79.37,125.6 79.3,132.35 72.69,132.35 " style="fill:rgba(0,0,0,1);" />
        <polygon points="85.98,125.6 92.66,125.6 92.6,132.28 85.98,132.28 " style="fill:rgba(0,0,0,1);" />
        <polygon points="92.53,125.67 99.28,125.67 99.15,132.35 92.53,132.35 " style="fill:rgba(0,0,0,1);" />
        <polygon points="99.15,125.6 105.89,125.6 105.76,132.28 99.15,132.28 " style="fill:rgba(0,0,0,1);" />
        <polygon points="105.76,125.67 112.51,125.67 112.37,132.35 105.76,132.35 " style="fill:rgba(0,0,0,1);" />
        <polygon points="112.37,125.67 119.06,125.67 118.99,132.35 112.37,132.35 " style="fill:rgba(0,0,0,1);" />
        <polygon points="125.67,125.6 132.35,125.6 132.28,132.35 125.67,132.35 " style="fill:rgba(0,0,0,1);" />
        <polygon points="132.22,125.6 138.9,125.6 138.83,132.35 132.22,132.35 " style="fill:rgba(0,0,0,1);" />
        <polygon points="66.14,132.22 72.82,132.22 72.76,138.96 66.14,138.96 " style="fill:rgba(0,0,0,1);" />
        <polygon points="72.69,132.22 79.37,132.22 79.3,138.9 72.69,138.9 " style="fill:rgba(0,0,0,1);" />
        <polygon points="92.6,132.22 99.21,132.22 99.21,138.96 92.6,138.96 " style="fill:rgba(0,0,0,1);" />
        <polygon points="105.83,132.22 112.51,132.22 112.44,138.96 105.83,138.96 " style="fill:rgba(0,0,0,1);" />
        <polygon points="112.37,132.22 119.06,132.22 118.99,138.96 112.37,138.96 " style="fill:rgba(0,0,0,1);" />
        <polygon points="125.67,132.22 132.35,132.22 132.28,138.9 125.67,138.9 " style="fill:rgba(0,0,0,1);" />
        <polygon points="132.22,132.22 138.9,132.22 138.83,138.96 132.22,138.96 " style="fill:rgba(0,0,0,1);" />
        <polygon points="66.14,138.83 72.76,138.83 72.76,145.58 66.14,145.58 " style="fill:rgba(0,0,0,1);" />
        <polygon points="79.37,138.9 86.05,138.9 85.98,145.58 79.37,145.58 " style="fill:rgba(0,0,0,1);" />
        <polygon points="85.92,138.9 92.66,138.9 92.53,145.51 85.92,145.51 " style="fill:rgba(0,0,0,1);" />
        <polygon points="92.53,138.83 99.28,138.83 99.15,145.58 92.53,145.58 " style="fill:rgba(0,0,0,1);" />
        <polygon points="99.15,138.9 105.89,138.9 105.76,145.51 99.15,145.51 " style="fill:rgba(0,0,0,1);" />
        <polygon points="105.76,138.83 112.51,138.83 112.37,145.51 105.76,145.51 " style="fill:rgba(0,0,0,1);" />
        <polygon points="112.37,138.83 119.12,138.83 118.99,145.58 112.37,145.58 " style="fill:rgba(0,0,0,1);" />
        <polygon points="118.99,138.9 125.67,138.9 125.6,145.51 118.99,145.51 " style="fill:rgba(0,0,0,1);" />
        <polygon points="132.28,138.83 138.96,138.83 138.9,145.58 132.28,145.58 " style="fill:rgba(0,0,0,1);" />
        <polygon points="138.83,138.9 145.51,138.9 145.45,145.51 138.83,145.51 " style="fill:rgba(0,0,0,1);" />
        <polygon points="66.14,145.45 72.82,145.45 72.76,152.13 66.14,152.13 " style="fill:rgba(0,0,0,1);" />
        <polygon points="72.69,145.51 79.44,145.51 79.3,152.13 72.69,152.13 " style="fill:rgba(0,0,0,1);" />
        <polygon points="79.3,145.45 85.98,145.45 85.92,152.13 79.3,152.13 " style="fill:rgba(0,0,0,1);" />
        <polygon points="92.6,145.45 99.21,145.45 99.21,152.13 92.6,152.13 " style="fill:rgba(0,0,0,1);" />
        <polygon points="112.44,145.45 119.06,145.45 119.06,152.13 112.44,152.13 " style="fill:rgba(0,0,0,1);" />
        <polygon points="132.28,145.45 138.9,145.45 138.9,152.13 132.28,152.13 " style="fill:rgba(0,0,0,1);" />
        `,
            },
            {
                value: 2,
                innerHtml: `<rect
      x="0"
      y="0"
      width="165.3543"
      height="165.3543"
      fill="red"
      style="fill:rgba(255,255,255,0);"
      shape-rendering="crispEdges"
    />
    <pattern
      id="glassc90e5498faaa405c98d9f9ff330814e1"
      x="13.22835"
      y="13.22835"
      width="138.8976"
      height="138.8976"
      patternUnits="userSpaceOnUse"
    >
      <rect x="0" y="0" width="138.8976" height="138.8976" style="fill:rgb(68,152,176);fill-opacity:1;" />
      <rect x="0" y="0" width="138.8976" height="69.44881" style="fill:rgb(80,164,188);fill-opacity:1;" />
    </pattern>
    <polygon
      points="13.23,29.76 13.55,26.54 14.49,23.44 16.02,20.58 18.07,18.07 20.58,16.02 23.44,14.49 26.54,13.55 29.76,13.23 59.53,13.23 59.53,59.53 13.23,59.53 13.23,29.76 19.84,29.76 19.84,52.91 52.91,52.91 52.91,19.84 29.76,19.84 27.2,20.18 24.8,21.17 22.75,22.75 21.17,24.8 20.18,27.2 19.84,29.76 "
      style="fill:url(#glassc90e5498faaa405c98d9f9ff330814e1);"
    />
    <polygon
      points="13.23,122.36 13.23,105.83 59.53,105.83 59.53,152.13 29.76,152.13 26.54,151.81 23.44,150.87 20.58,149.34 18.07,147.28 16.02,144.78 14.49,141.92 13.55,138.82 13.23,135.59 13.23,122.36 19.84,122.36 19.84,135.59 20.18,138.16 21.17,140.55 22.75,142.61 24.8,144.18 27.2,145.17 29.76,145.51 52.91,145.51 52.91,112.44 19.84,112.44 19.84,122.36 "
      style="fill:url(#glassc90e5498faaa405c98d9f9ff330814e1);"
    />
    <polygon
      points="105.83,29.76 105.83,13.23 135.59,13.23 138.82,13.55 141.92,14.49 144.78,16.02 147.28,18.07 149.34,20.58 150.87,23.44 151.81,26.54 152.13,29.76 152.13,59.53 105.83,59.53 105.83,29.76 112.44,29.76 112.44,52.91 145.51,52.91 145.51,29.76 145.17,27.2 144.18,24.8 142.61,22.75 140.55,21.17 138.16,20.18 135.59,19.84 112.44,19.84 112.44,29.76 "
      style="fill:url(#glassc90e5498faaa405c98d9f9ff330814e1);"
    />
    <linearGradient
      id="gradient9942a6e9fa9d459eb5f1f9ab88391ebf"
      gradientUnits="userSpaceOnUse"
      x1="16.1676322453161"
      y1="44.2778655522009"
      x2="149.18668446611"
      y2="121.076451159225"
    >
      <stop offset="0%" stop-color="#039898" />
      <stop offset="100%" stop-color="#2C6E9A" />
    </linearGradient>
    <polygon
      points="26.46,31.09 26.61,29.89 27.08,28.77 27.81,27.81 28.77,27.08 29.89,26.61 31.09,26.46 46.3,26.46 46.3,46.3 26.46,46.3 "
      style="fill:url(#gradient9942a6e9fa9d459eb5f1f9ab88391ebf);"
    />
    <polygon
      points="26.46,119.06 46.3,119.06 46.3,138.9 31.09,138.9 29.89,138.74 28.77,138.28 27.81,137.54 27.08,136.58 26.61,135.47 26.46,134.27 "
      style="fill:url(#gradient9942a6e9fa9d459eb5f1f9ab88391ebf);"
    />
    <polygon
      points="119.06,26.46 134.27,26.46 135.47,26.61 136.58,27.08 137.54,27.81 138.28,28.77 138.74,29.89 138.9,31.09 138.9,46.3 119.06,46.3 "
      style="fill:url(#gradient9942a6e9fa9d459eb5f1f9ab88391ebf);"
    />
    <polygon points="79.37,16.54 82.68,13.23 85.98,16.54 82.68,19.84 " style="fill:rgba(96,75,117,1);" />
    <polygon points="85.98,16.54 89.29,13.23 92.6,16.54 89.29,19.84 " style="fill:rgba(96,75,117,1);" />
    <polygon points="92.6,16.54 95.91,13.23 99.21,16.54 95.91,19.84 " style="fill:rgba(96,75,117,1);" />
    <polygon points="66.14,23.15 69.45,19.84 72.76,23.15 69.45,26.46 " style="fill:rgba(96,75,117,1);" />
    <polygon points="72.76,23.15 76.06,19.84 79.37,23.15 76.06,26.46 " style="fill:rgba(96,75,117,1);" />
    <polygon points="79.37,23.15 82.68,19.84 85.98,23.15 82.68,26.46 " style="fill:rgba(96,75,117,1);" />
    <polygon points="92.6,23.15 95.91,19.84 99.21,23.15 95.91,26.46 " style="fill:rgba(96,75,117,1);" />
    <polygon points="79.37,29.76 82.68,26.46 85.98,29.76 82.68,33.07 " style="fill:rgba(96,75,117,1);" />
    <polygon points="85.98,29.76 89.29,26.46 92.6,29.76 89.29,33.07 " style="fill:rgba(96,75,117,1);" />
    <polygon points="92.6,29.76 95.91,26.46 99.21,29.76 95.91,33.07 " style="fill:rgba(96,75,117,1);" />
    <polygon points="66.14,36.38 69.45,33.07 72.76,36.38 69.45,39.69 " style="fill:rgba(96,75,117,1);" />
    <polygon points="72.76,36.38 76.06,33.07 79.37,36.38 76.06,39.69 " style="fill:rgba(96,75,117,1);" />
    <polygon points="92.6,36.38 95.91,33.07 99.21,36.38 95.91,39.69 " style="fill:rgba(96,75,117,1);" />
    <polygon points="72.76,42.99 76.06,39.69 79.37,42.99 76.06,46.3 " style="fill:rgba(96,75,117,1);" />
    <polygon points="92.6,42.99 95.91,39.69 99.21,42.99 95.91,46.3 " style="fill:rgba(96,75,117,1);" />
    <polygon points="66.14,49.61 69.45,46.3 72.76,49.61 69.45,52.91 " style="fill:rgba(96,75,117,1);" />
    <polygon points="85.98,49.61 89.29,46.3 92.6,49.61 89.29,52.91 " style="fill:rgba(96,75,117,1);" />
    <polygon points="66.14,56.22 69.45,52.91 72.76,56.22 69.45,59.53 " style="fill:rgba(96,75,117,1);" />
    <polygon points="79.37,56.22 82.68,52.91 85.98,56.22 82.68,59.53 " style="fill:rgba(96,75,117,1);" />
    <polygon points="92.6,56.22 95.91,52.91 99.21,56.22 95.91,59.53 " style="fill:rgba(96,75,117,1);" />
    <polygon points="72.76,62.83 76.06,59.53 79.37,62.83 76.06,66.14 " style="fill:rgba(96,75,117,1);" />
    <polygon points="13.23,69.45 16.54,66.14 19.84,69.45 16.54,72.76 " style="fill:rgba(96,75,117,1);" />
    <polygon points="19.84,69.45 23.15,66.14 26.46,69.45 23.15,72.76 " style="fill:rgba(96,75,117,1);" />
    <polygon points="26.46,69.45 29.76,66.14 33.07,69.45 29.76,72.76 " style="fill:rgba(96,75,117,1);" />
    <polygon points="33.07,69.45 36.38,66.14 39.69,69.45 36.38,72.76 " style="fill:rgba(96,75,117,1);" />
    <polygon points="39.69,69.45 42.99,66.14 46.3,69.45 42.99,72.76 " style="fill:rgba(96,75,117,1);" />
    <polygon points="52.91,69.45 56.22,66.14 59.53,69.45 56.22,72.76 " style="fill:rgba(96,75,117,1);" />
    <polygon points="59.53,69.45 62.83,66.14 66.14,69.45 62.83,72.76 " style="fill:rgba(96,75,117,1);" />
    <polygon points="66.14,69.45 69.45,66.14 72.76,69.45 69.45,72.76 " style="fill:rgba(96,75,117,1);" />
    <polygon points="85.98,69.45 89.29,66.14 92.6,69.45 89.29,72.76 " style="fill:rgba(96,75,117,1);" />
    <polygon points="99.21,69.45 102.52,66.14 105.83,69.45 102.52,72.76 " style="fill:rgba(96,75,117,1);" />
    <polygon points="112.44,69.45 115.75,66.14 119.06,69.45 115.75,72.76 " style="fill:rgba(96,75,117,1);" />
    <polygon points="125.67,69.45 128.98,66.14 132.28,69.45 128.98,72.76 " style="fill:rgba(96,75,117,1);" />
    <polygon points="138.9,69.45 142.2,66.14 145.51,69.45 142.2,72.76 " style="fill:rgba(96,75,117,1);" />
    <polygon points="13.23,76.06 16.54,72.76 19.84,76.06 16.54,79.37 " style="fill:rgba(96,75,117,1);" />
    <polygon points="19.84,76.06 23.15,72.76 26.46,76.06 23.15,79.37 " style="fill:rgba(96,75,117,1);" />
    <polygon points="26.46,76.06 29.76,72.76 33.07,76.06 29.76,79.37 " style="fill:rgba(96,75,117,1);" />
    <polygon points="46.3,76.06 49.61,72.76 52.91,76.06 49.61,79.37 " style="fill:rgba(96,75,117,1);" />
    <polygon points="59.53,76.06 62.83,72.76 66.14,76.06 62.83,79.37 " style="fill:rgba(96,75,117,1);" />
    <polygon points="72.76,76.06 76.06,72.76 79.37,76.06 76.06,79.37 " style="fill:rgba(96,75,117,1);" />
    <polygon points="85.98,76.06 89.29,72.76 92.6,76.06 89.29,79.37 " style="fill:rgba(96,75,117,1);" />
    <polygon points="92.6,76.06 95.91,72.76 99.21,76.06 95.91,79.37 " style="fill:rgba(96,75,117,1);" />
    <polygon points="99.21,76.06 102.52,72.76 105.83,76.06 102.52,79.37 " style="fill:rgba(96,75,117,1);" />
    <polygon points="105.83,76.06 109.13,72.76 112.44,76.06 109.13,79.37 " style="fill:rgba(96,75,117,1);" />
    <polygon points="125.67,76.06 128.98,72.76 132.28,76.06 128.98,79.37 " style="fill:rgba(96,75,117,1);" />
    <polygon points="132.28,76.06 135.59,72.76 138.9,76.06 135.59,79.37 " style="fill:rgba(96,75,117,1);" />
    <polygon points="138.9,76.06 142.2,72.76 145.51,76.06 142.2,79.37 " style="fill:rgba(96,75,117,1);" />
    <polygon points="145.51,76.06 148.82,72.76 152.13,76.06 148.82,79.37 " style="fill:rgba(96,75,117,1);" />
    <polygon points="26.46,82.68 29.76,79.37 33.07,82.68 29.76,85.98 " style="fill:rgba(96,75,117,1);" />
    <polygon points="39.69,82.68 42.99,79.37 46.3,82.68 42.99,85.98 " style="fill:rgba(96,75,117,1);" />
    <polygon points="46.3,82.68 49.61,79.37 52.91,82.68 49.61,85.98 " style="fill:rgba(96,75,117,1);" />
    <polygon points="52.91,82.68 56.22,79.37 59.53,82.68 56.22,85.98 " style="fill:rgba(96,75,117,1);" />
    <polygon points="66.14,82.68 69.45,79.37 72.76,82.68 69.45,85.98 " style="fill:rgba(96,75,117,1);" />
    <polygon points="72.76,82.68 76.06,79.37 79.37,82.68 76.06,85.98 " style="fill:rgba(96,75,117,1);" />
    <polygon points="92.6,82.68 95.91,79.37 99.21,82.68 95.91,85.98 " style="fill:rgba(96,75,117,1);" />
    <polygon points="105.83,82.68 109.13,79.37 112.44,82.68 109.13,85.98 " style="fill:rgba(96,75,117,1);" />
    <polygon points="112.44,82.68 115.75,79.37 119.06,82.68 115.75,85.98 " style="fill:rgba(96,75,117,1);" />
    <polygon points="125.67,82.68 128.98,79.37 132.28,82.68 128.98,85.98 " style="fill:rgba(96,75,117,1);" />
    <polygon points="145.51,82.68 148.82,79.37 152.13,82.68 148.82,85.98 " style="fill:rgba(96,75,117,1);" />
    <polygon points="13.23,89.29 16.54,85.98 19.84,89.29 16.54,92.6 " style="fill:rgba(96,75,117,1);" />
    <polygon points="33.07,89.29 36.38,85.98 39.69,89.29 36.38,92.6 " style="fill:rgba(96,75,117,1);" />
    <polygon points="85.98,89.29 89.29,85.98 92.6,89.29 89.29,92.6 " style="fill:rgba(96,75,117,1);" />
    <polygon points="92.6,89.29 95.91,85.98 99.21,89.29 95.91,92.6 " style="fill:rgba(96,75,117,1);" />
    <polygon points="99.21,89.29 102.52,85.98 105.83,89.29 102.52,92.6 " style="fill:rgba(96,75,117,1);" />
    <polygon points="105.83,89.29 109.13,85.98 112.44,89.29 109.13,92.6 " style="fill:rgba(96,75,117,1);" />
    <polygon points="132.28,89.29 135.59,85.98 138.9,89.29 135.59,92.6 " style="fill:rgba(96,75,117,1);" />
    <polygon points="138.9,89.29 142.2,85.98 145.51,89.29 142.2,92.6 " style="fill:rgba(96,75,117,1);" />
    <polygon points="145.51,89.29 148.82,85.98 152.13,89.29 148.82,92.6 " style="fill:rgba(96,75,117,1);" />
    <polygon points="19.84,95.91 23.15,92.6 26.46,95.91 23.15,99.21 " style="fill:rgba(96,75,117,1);" />
    <polygon points="33.07,95.91 36.38,92.6 39.69,95.91 36.38,99.21 " style="fill:rgba(96,75,117,1);" />
    <polygon points="39.69,95.91 42.99,92.6 46.3,95.91 42.99,99.21 " style="fill:rgba(96,75,117,1);" />
    <polygon points="52.91,95.91 56.22,92.6 59.53,95.91 56.22,99.21 " style="fill:rgba(96,75,117,1);" />
    <polygon points="66.14,95.91 69.45,92.6 72.76,95.91 69.45,99.21 " style="fill:rgba(96,75,117,1);" />
    <polygon points="72.76,95.91 76.06,92.6 79.37,95.91 76.06,99.21 " style="fill:rgba(96,75,117,1);" />
    <polygon points="92.6,95.91 95.91,92.6 99.21,95.91 95.91,99.21 " style="fill:rgba(96,75,117,1);" />
    <polygon points="112.44,95.91 115.75,92.6 119.06,95.91 115.75,99.21 " style="fill:rgba(96,75,117,1);" />
    <polygon points="138.9,95.91 142.2,92.6 145.51,95.91 142.2,99.21 " style="fill:rgba(96,75,117,1);" />
    <polygon points="66.14,102.52 69.45,99.21 72.76,102.52 69.45,105.83 " style="fill:rgba(96,75,117,1);" />
    <polygon points="79.37,102.52 82.68,99.21 85.98,102.52 82.68,105.83 " style="fill:rgba(96,75,117,1);" />
    <polygon points="92.6,102.52 95.91,99.21 99.21,102.52 95.91,105.83 " style="fill:rgba(96,75,117,1);" />
    <polygon points="112.44,102.52 115.75,99.21 119.06,102.52 115.75,105.83 " style="fill:rgba(96,75,117,1);" />
    <polygon points="132.28,102.52 135.59,99.21 138.9,102.52 135.59,105.83 " style="fill:rgba(96,75,117,1);" />
    <polygon points="66.14,109.13 69.45,105.83 72.76,109.13 69.45,112.44 " style="fill:rgba(96,75,117,1);" />
    <polygon points="85.98,109.13 89.29,105.83 92.6,109.13 89.29,112.44 " style="fill:rgba(96,75,117,1);" />
    <polygon points="99.21,109.13 102.52,105.83 105.83,109.13 102.52,112.44 " style="fill:rgba(96,75,117,1);" />
    <polygon points="119.06,109.13 122.36,105.83 125.67,109.13 122.36,112.44 " style="fill:rgba(96,75,117,1);" />
    <polygon points="125.67,109.13 128.98,105.83 132.28,109.13 128.98,112.44 " style="fill:rgba(96,75,117,1);" />
    <polygon points="138.9,109.13 142.2,105.83 145.51,109.13 142.2,112.44 " style="fill:rgba(96,75,117,1);" />
    <polygon points="145.51,109.13 148.82,105.83 152.13,109.13 148.82,112.44 " style="fill:rgba(96,75,117,1);" />
    <polygon points="72.76,115.75 76.06,112.44 79.37,115.75 76.06,119.06 " style="fill:rgba(96,75,117,1);" />
    <polygon points="79.37,115.75 82.68,112.44 85.98,115.75 82.68,119.06 " style="fill:rgba(96,75,117,1);" />
    <polygon points="112.44,115.75 115.75,112.44 119.06,115.75 115.75,119.06 " style="fill:rgba(96,75,117,1);" />
    <polygon points="119.06,115.75 122.36,112.44 125.67,115.75 122.36,119.06 " style="fill:rgba(96,75,117,1);" />
    <polygon points="132.28,115.75 135.59,112.44 138.9,115.75 135.59,119.06 " style="fill:rgba(96,75,117,1);" />
    <polygon points="145.51,115.75 148.82,112.44 152.13,115.75 148.82,119.06 " style="fill:rgba(96,75,117,1);" />
    <polygon points="66.14,122.36 69.45,119.06 72.76,122.36 69.45,125.67 " style="fill:rgba(96,75,117,1);" />
    <polygon points="72.76,122.36 76.06,119.06 79.37,122.36 76.06,125.67 " style="fill:rgba(96,75,117,1);" />
    <polygon points="79.37,122.36 82.68,119.06 85.98,122.36 82.68,125.67 " style="fill:rgba(96,75,117,1);" />
    <polygon points="85.98,122.36 89.29,119.06 92.6,122.36 89.29,125.67 " style="fill:rgba(96,75,117,1);" />
    <polygon points="99.21,122.36 102.52,119.06 105.83,122.36 102.52,125.67 " style="fill:rgba(96,75,117,1);" />
    <polygon points="119.06,122.36 122.36,119.06 125.67,122.36 122.36,125.67 " style="fill:rgba(96,75,117,1);" />
    <polygon points="125.67,122.36 128.98,119.06 132.28,122.36 128.98,125.67 " style="fill:rgba(96,75,117,1);" />
    <polygon points="132.28,122.36 135.59,119.06 138.9,122.36 135.59,125.67 " style="fill:rgba(96,75,117,1);" />
    <polygon points="66.14,128.98 69.45,125.67 72.76,128.98 69.45,132.28 " style="fill:rgba(96,75,117,1);" />
    <polygon points="72.76,128.98 76.06,125.67 79.37,128.98 76.06,132.28 " style="fill:rgba(96,75,117,1);" />
    <polygon points="85.98,128.98 89.29,125.67 92.6,128.98 89.29,132.28 " style="fill:rgba(96,75,117,1);" />
    <polygon points="92.6,128.98 95.91,125.67 99.21,128.98 95.91,132.28 " style="fill:rgba(96,75,117,1);" />
    <polygon points="99.21,128.98 102.52,125.67 105.83,128.98 102.52,132.28 " style="fill:rgba(96,75,117,1);" />
    <polygon points="105.83,128.98 109.13,125.67 112.44,128.98 109.13,132.28 " style="fill:rgba(96,75,117,1);" />
    <polygon points="112.44,128.98 115.75,125.67 119.06,128.98 115.75,132.28 " style="fill:rgba(96,75,117,1);" />
    <polygon points="125.67,128.98 128.98,125.67 132.28,128.98 128.98,132.28 " style="fill:rgba(96,75,117,1);" />
    <polygon points="132.28,128.98 135.59,125.67 138.9,128.98 135.59,132.28 " style="fill:rgba(96,75,117,1);" />
    <polygon points="66.14,135.59 69.45,132.28 72.76,135.59 69.45,138.9 " style="fill:rgba(96,75,117,1);" />
    <polygon points="72.76,135.59 76.06,132.28 79.37,135.59 76.06,138.9 " style="fill:rgba(96,75,117,1);" />
    <polygon points="92.6,135.59 95.91,132.28 99.21,135.59 95.91,138.9 " style="fill:rgba(96,75,117,1);" />
    <polygon points="105.83,135.59 109.13,132.28 112.44,135.59 109.13,138.9 " style="fill:rgba(96,75,117,1);" />
    <polygon points="112.44,135.59 115.75,132.28 119.06,135.59 115.75,138.9 " style="fill:rgba(96,75,117,1);" />
    <polygon points="125.67,135.59 128.98,132.28 132.28,135.59 128.98,138.9 " style="fill:rgba(96,75,117,1);" />
    <polygon points="132.28,135.59 135.59,132.28 138.9,135.59 135.59,138.9 " style="fill:rgba(96,75,117,1);" />
    <polygon points="66.14,142.2 69.45,138.9 72.76,142.2 69.45,145.51 " style="fill:rgba(96,75,117,1);" />
    <polygon points="79.37,142.2 82.68,138.9 85.98,142.2 82.68,145.51 " style="fill:rgba(96,75,117,1);" />
    <polygon points="85.98,142.2 89.29,138.9 92.6,142.2 89.29,145.51 " style="fill:rgba(96,75,117,1);" />
    <polygon points="92.6,142.2 95.91,138.9 99.21,142.2 95.91,145.51 " style="fill:rgba(96,75,117,1);" />
    <polygon points="99.21,142.2 102.52,138.9 105.83,142.2 102.52,145.51 " style="fill:rgba(96,75,117,1);" />
    <polygon points="105.83,142.2 109.13,138.9 112.44,142.2 109.13,145.51 " style="fill:rgba(96,75,117,1);" />
    <polygon points="112.44,142.2 115.75,138.9 119.06,142.2 115.75,145.51 " style="fill:rgba(96,75,117,1);" />
    <polygon points="119.06,142.2 122.36,138.9 125.67,142.2 122.36,145.51 " style="fill:rgba(96,75,117,1);" />
    <polygon points="132.28,142.2 135.59,138.9 138.9,142.2 135.59,145.51 " style="fill:rgba(96,75,117,1);" />
    <polygon points="138.9,142.2 142.2,138.9 145.51,142.2 142.2,145.51 " style="fill:rgba(96,75,117,1);" />
    <polygon points="66.14,148.82 69.45,145.51 72.76,148.82 69.45,152.13 " style="fill:rgba(96,75,117,1);" />
    <polygon points="72.76,148.82 76.06,145.51 79.37,148.82 76.06,152.13 " style="fill:rgba(96,75,117,1);" />
    <polygon points="79.37,148.82 82.68,145.51 85.98,148.82 82.68,152.13 " style="fill:rgba(96,75,117,1);" />
    <polygon points="92.6,148.82 95.91,145.51 99.21,148.82 95.91,152.13 " style="fill:rgba(96,75,117,1);" />
    <polygon points="112.44,148.82 115.75,145.51 119.06,148.82 115.75,152.13 " style="fill:rgba(96,75,117,1);" />
    <polygon points="132.28,148.82 135.59,145.51 138.9,148.82 135.59,152.13 " style="fill:rgba(96,75,117,1);" />
      `,
            },
            {
                value: 3,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(255,255,255,0);"
            shape-rendering="crispEdges"
          />
          <pattern
            id="glass24c3381e8d144e708cc01571cde7c032"
            x="13.22835"
            y="13.22835"
            width="138.8976"
            height="138.8976"
            patternUnits="userSpaceOnUse"
          >
            <rect x="0" y="0" width="138.8976" height="138.8976" style="fill:rgb(57,94,133);fill-opacity:1;" />
            <rect x="0" y="0" width="138.8976" height="69.44881" style="fill:rgb(69,106,145);fill-opacity:1;" />
          </pattern>
          <polygon
            points="59.53,36.38 59.08,40.89 57.77,45.24 55.63,49.24 52.75,52.75 49.24,55.63 45.24,57.77 40.89,59.08 36.38,59.53 31.86,59.08 27.52,57.77 23.52,55.63 20.01,52.75 17.13,49.24 14.99,45.24 13.67,40.89 13.23,36.38 13.67,31.86 14.99,27.52 17.13,23.52 20.01,20.01 23.52,17.13 27.52,14.99 31.86,13.67 36.38,13.23 40.89,13.67 45.24,14.99 49.24,17.13 52.75,20.01 55.63,23.52 57.77,27.52 59.08,31.86 59.53,36.38 52.91,36.38 52.6,33.15 51.65,30.05 50.13,27.19 48.07,24.69 45.56,22.63 42.71,21.1 39.6,20.16 36.38,19.84 33.15,20.16 30.05,21.1 27.19,22.63 24.69,24.69 22.63,27.19 21.1,30.05 20.16,33.15 19.84,36.38 20.16,39.6 21.1,42.71 22.63,45.56 24.69,48.07 27.19,50.13 30.05,51.65 33.15,52.6 36.38,52.91 39.6,52.6 42.71,51.65 45.56,50.13 48.07,48.07 50.13,45.56 51.65,42.71 52.6,39.6 52.91,36.38 "
            style="fill:url(#glass24c3381e8d144e708cc01571cde7c032);"
          />
          <polygon
            points="59.53,128.98 59.08,133.49 57.77,137.84 55.63,141.84 52.75,145.35 49.24,148.22 45.24,150.36 40.89,151.68 36.38,152.13 31.86,151.68 27.52,150.36 23.52,148.22 20.01,145.35 17.13,141.84 14.99,137.84 13.67,133.49 13.23,128.98 13.67,124.46 14.99,120.12 17.13,116.12 20.01,112.61 23.52,109.73 27.52,107.59 31.86,106.27 36.38,105.83 40.89,106.27 45.24,107.59 49.24,109.73 52.75,112.61 55.63,116.12 57.77,120.12 59.08,124.46 59.53,128.98 52.91,128.98 52.6,125.75 51.65,122.65 50.13,119.79 48.07,117.28 45.56,115.23 42.71,113.7 39.6,112.76 36.38,112.44 33.15,112.76 30.05,113.7 27.19,115.23 24.69,117.28 22.63,119.79 21.1,122.65 20.16,125.75 19.84,128.98 20.16,132.2 21.1,135.3 22.63,138.16 24.69,140.67 27.19,142.73 30.05,144.25 33.15,145.19 36.38,145.51 39.6,145.19 42.71,144.25 45.56,142.73 48.07,140.67 50.13,138.16 51.65,135.3 52.6,132.2 52.91,128.98 "
            style="fill:url(#glass24c3381e8d144e708cc01571cde7c032);"
          />
          <polygon
            points="152.13,36.38 151.68,40.89 150.36,45.24 148.22,49.24 145.35,52.75 141.84,55.63 137.84,57.77 133.49,59.08 128.98,59.53 124.46,59.08 120.12,57.77 116.12,55.63 112.61,52.75 109.73,49.24 107.59,45.24 106.27,40.89 105.83,36.38 106.27,31.86 107.59,27.52 109.73,23.52 112.61,20.01 116.12,17.13 120.12,14.99 124.46,13.67 128.98,13.23 133.49,13.67 137.84,14.99 141.84,17.13 145.35,20.01 148.22,23.52 150.36,27.52 151.68,31.86 152.13,36.38 145.51,36.38 145.19,33.15 144.25,30.05 142.73,27.19 140.67,24.69 138.16,22.63 135.3,21.1 132.2,20.16 128.98,19.84 125.75,20.16 122.65,21.1 119.79,22.63 117.28,24.69 115.23,27.19 113.7,30.05 112.76,33.15 112.44,36.38 112.76,39.6 113.7,42.71 115.23,45.56 117.28,48.07 119.79,50.13 122.65,51.65 125.75,52.6 128.98,52.91 132.2,52.6 135.3,51.65 138.16,50.13 140.67,48.07 142.73,45.56 144.25,42.71 145.19,39.6 145.51,36.38 "
            style="fill:url(#glass24c3381e8d144e708cc01571cde7c032);"
          />
          <linearGradient
            id="gradientace97d5e2e9b44daa7466b1acf42cbdc"
            gradientUnits="userSpaceOnUse"
            x1="22.0024585616932"
            y1="77.3688099608975"
            x2="143.351858149733"
            y2="87.9855067505283"
          >
            <stop offset="0%" stop-color="#647335" />
            <stop offset="50%" stop-color="#89496A" />
            <stop offset="100%" stop-color="#647335" />
          </linearGradient>
          <polygon
            points="46.3,36.38 46.11,38.31 45.54,40.17 44.63,41.89 43.39,43.39 41.89,44.63 40.17,45.54 38.31,46.11 36.38,46.3 34.44,46.11 32.58,45.54 30.87,44.63 29.36,43.39 28.13,41.89 27.21,40.17 26.65,38.31 26.46,36.38 26.65,34.44 27.21,32.58 28.13,30.87 29.36,29.36 30.87,28.13 32.58,27.21 34.44,26.65 36.38,26.46 38.31,26.65 40.17,27.21 41.89,28.13 43.39,29.36 44.63,30.87 45.54,32.58 46.11,34.44 46.3,36.38 "
            style="fill:url(#gradientace97d5e2e9b44daa7466b1acf42cbdc);"
          />
          <polygon
            points="46.3,128.98 46.11,130.91 45.54,132.77 44.63,134.49 43.39,135.99 41.89,137.23 40.17,138.14 38.31,138.71 36.38,138.9 34.44,138.71 32.58,138.14 30.87,137.23 29.36,135.99 28.13,134.49 27.21,132.77 26.65,130.91 26.46,128.98 26.65,127.04 27.21,125.18 28.13,123.46 29.36,121.96 30.87,120.73 32.58,119.81 34.44,119.25 36.38,119.06 38.31,119.25 40.17,119.81 41.89,120.73 43.39,121.96 44.63,123.46 45.54,125.18 46.11,127.04 46.3,128.98 "
            style="fill:url(#gradientace97d5e2e9b44daa7466b1acf42cbdc);"
          />
          <polygon
            points="138.9,36.38 138.71,38.31 138.14,40.17 137.23,41.89 135.99,43.39 134.49,44.63 132.77,45.54 130.91,46.11 128.98,46.3 127.04,46.11 125.18,45.54 123.46,44.63 121.96,43.39 120.73,41.89 119.81,40.17 119.25,38.31 119.06,36.38 119.25,34.44 119.81,32.58 120.73,30.87 121.96,29.36 123.46,28.13 125.18,27.21 127.04,26.65 128.98,26.46 130.91,26.65 132.77,27.21 134.49,28.13 135.99,29.36 137.23,30.87 138.14,32.58 138.71,34.44 138.9,36.38 "
            style="fill:url(#gradientace97d5e2e9b44daa7466b1acf42cbdc);"
          />
          <polygon
            points="85.98,16.54 85.73,17.8 85.02,18.87 83.94,19.59 82.68,19.84 81.41,19.59 80.34,18.87 79.62,17.8 79.37,16.54 79.62,15.27 80.34,14.2 81.41,13.48 82.68,13.23 83.94,13.48 85.02,14.2 85.73,15.27 85.98,16.54 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="92.6,16.54 92.35,17.8 91.63,18.87 90.56,19.59 89.29,19.84 88.03,19.59 86.95,18.87 86.24,17.8 85.98,16.54 86.24,15.27 86.95,14.2 88.03,13.48 89.29,13.23 90.56,13.48 91.63,14.2 92.35,15.27 92.6,16.54 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="99.21,16.54 98.96,17.8 98.24,18.87 97.17,19.59 95.91,19.84 94.64,19.59 93.57,18.87 92.85,17.8 92.6,16.54 92.85,15.27 93.57,14.2 94.64,13.48 95.91,13.23 97.17,13.48 98.24,14.2 98.96,15.27 99.21,16.54 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="72.76,23.15 72.5,24.42 71.79,25.49 70.71,26.2 69.45,26.46 68.18,26.2 67.11,25.49 66.39,24.42 66.14,23.15 66.39,21.88 67.11,20.81 68.18,20.09 69.45,19.84 70.71,20.09 71.79,20.81 72.5,21.88 72.76,23.15 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="79.37,23.15 79.12,24.42 78.4,25.49 77.33,26.2 76.06,26.46 74.8,26.2 73.72,25.49 73.01,24.42 72.76,23.15 73.01,21.88 73.72,20.81 74.8,20.09 76.06,19.84 77.33,20.09 78.4,20.81 79.12,21.88 79.37,23.15 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="85.98,23.15 85.73,24.42 85.02,25.49 83.94,26.2 82.68,26.46 81.41,26.2 80.34,25.49 79.62,24.42 79.37,23.15 79.62,21.88 80.34,20.81 81.41,20.09 82.68,19.84 83.94,20.09 85.02,20.81 85.73,21.88 85.98,23.15 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="99.21,23.15 98.96,24.42 98.24,25.49 97.17,26.2 95.91,26.46 94.64,26.2 93.57,25.49 92.85,24.42 92.6,23.15 92.85,21.88 93.57,20.81 94.64,20.09 95.91,19.84 97.17,20.09 98.24,20.81 98.96,21.88 99.21,23.15 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="85.98,29.76 85.73,31.03 85.02,32.1 83.94,32.82 82.68,33.07 81.41,32.82 80.34,32.1 79.62,31.03 79.37,29.76 79.62,28.5 80.34,27.43 81.41,26.71 82.68,26.46 83.94,26.71 85.02,27.43 85.73,28.5 85.98,29.76 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="92.6,29.76 92.35,31.03 91.63,32.1 90.56,32.82 89.29,33.07 88.03,32.82 86.95,32.1 86.24,31.03 85.98,29.76 86.24,28.5 86.95,27.43 88.03,26.71 89.29,26.46 90.56,26.71 91.63,27.43 92.35,28.5 92.6,29.76 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="99.21,29.76 98.96,31.03 98.24,32.1 97.17,32.82 95.91,33.07 94.64,32.82 93.57,32.1 92.85,31.03 92.6,29.76 92.85,28.5 93.57,27.43 94.64,26.71 95.91,26.46 97.17,26.71 98.24,27.43 98.96,28.5 99.21,29.76 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="72.76,36.38 72.5,37.64 71.79,38.72 70.71,39.43 69.45,39.69 68.18,39.43 67.11,38.72 66.39,37.64 66.14,36.38 66.39,35.11 67.11,34.04 68.18,33.32 69.45,33.07 70.71,33.32 71.79,34.04 72.5,35.11 72.76,36.38 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="79.37,36.38 79.12,37.64 78.4,38.72 77.33,39.43 76.06,39.69 74.8,39.43 73.72,38.72 73.01,37.64 72.76,36.38 73.01,35.11 73.72,34.04 74.8,33.32 76.06,33.07 77.33,33.32 78.4,34.04 79.12,35.11 79.37,36.38 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="99.21,36.38 98.96,37.64 98.24,38.72 97.17,39.43 95.91,39.69 94.64,39.43 93.57,38.72 92.85,37.64 92.6,36.38 92.85,35.11 93.57,34.04 94.64,33.32 95.91,33.07 97.17,33.32 98.24,34.04 98.96,35.11 99.21,36.38 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="79.37,42.99 79.12,44.26 78.4,45.33 77.33,46.05 76.06,46.3 74.8,46.05 73.72,45.33 73.01,44.26 72.76,42.99 73.01,41.73 73.72,40.65 74.8,39.94 76.06,39.69 77.33,39.94 78.4,40.65 79.12,41.73 79.37,42.99 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="99.21,42.99 98.96,44.26 98.24,45.33 97.17,46.05 95.91,46.3 94.64,46.05 93.57,45.33 92.85,44.26 92.6,42.99 92.85,41.73 93.57,40.65 94.64,39.94 95.91,39.69 97.17,39.94 98.24,40.65 98.96,41.73 99.21,42.99 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="72.76,49.61 72.5,50.87 71.79,51.94 70.71,52.66 69.45,52.91 68.18,52.66 67.11,51.94 66.39,50.87 66.14,49.61 66.39,48.34 67.11,47.27 68.18,46.55 69.45,46.3 70.71,46.55 71.79,47.27 72.5,48.34 72.76,49.61 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="92.6,49.61 92.35,50.87 91.63,51.94 90.56,52.66 89.29,52.91 88.03,52.66 86.95,51.94 86.24,50.87 85.98,49.61 86.24,48.34 86.95,47.27 88.03,46.55 89.29,46.3 90.56,46.55 91.63,47.27 92.35,48.34 92.6,49.61 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="72.76,56.22 72.5,57.49 71.79,58.56 70.71,59.28 69.45,59.53 68.18,59.28 67.11,58.56 66.39,57.49 66.14,56.22 66.39,54.95 67.11,53.88 68.18,53.17 69.45,52.91 70.71,53.17 71.79,53.88 72.5,54.95 72.76,56.22 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="85.98,56.22 85.73,57.49 85.02,58.56 83.94,59.28 82.68,59.53 81.41,59.28 80.34,58.56 79.62,57.49 79.37,56.22 79.62,54.95 80.34,53.88 81.41,53.17 82.68,52.91 83.94,53.17 85.02,53.88 85.73,54.95 85.98,56.22 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="99.21,56.22 98.96,57.49 98.24,58.56 97.17,59.28 95.91,59.53 94.64,59.28 93.57,58.56 92.85,57.49 92.6,56.22 92.85,54.95 93.57,53.88 94.64,53.17 95.91,52.91 97.17,53.17 98.24,53.88 98.96,54.95 99.21,56.22 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="79.37,62.83 79.12,64.1 78.4,65.17 77.33,65.89 76.06,66.14 74.8,65.89 73.72,65.17 73.01,64.1 72.76,62.83 73.01,61.57 73.72,60.5 74.8,59.78 76.06,59.53 77.33,59.78 78.4,60.5 79.12,61.57 79.37,62.83 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="19.84,69.45 19.59,70.71 18.87,71.79 17.8,72.5 16.54,72.76 15.27,72.5 14.2,71.79 13.48,70.71 13.23,69.45 13.48,68.18 14.2,67.11 15.27,66.39 16.54,66.14 17.8,66.39 18.87,67.11 19.59,68.18 19.84,69.45 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="26.46,69.45 26.2,70.71 25.49,71.79 24.42,72.5 23.15,72.76 21.88,72.5 20.81,71.79 20.09,70.71 19.84,69.45 20.09,68.18 20.81,67.11 21.88,66.39 23.15,66.14 24.42,66.39 25.49,67.11 26.2,68.18 26.46,69.45 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="33.07,69.45 32.82,70.71 32.1,71.79 31.03,72.5 29.76,72.76 28.5,72.5 27.43,71.79 26.71,70.71 26.46,69.45 26.71,68.18 27.43,67.11 28.5,66.39 29.76,66.14 31.03,66.39 32.1,67.11 32.82,68.18 33.07,69.45 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="39.69,69.45 39.43,70.71 38.72,71.79 37.64,72.5 36.38,72.76 35.11,72.5 34.04,71.79 33.32,70.71 33.07,69.45 33.32,68.18 34.04,67.11 35.11,66.39 36.38,66.14 37.64,66.39 38.72,67.11 39.43,68.18 39.69,69.45 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="46.3,69.45 46.05,70.71 45.33,71.79 44.26,72.5 42.99,72.76 41.73,72.5 40.65,71.79 39.94,70.71 39.69,69.45 39.94,68.18 40.65,67.11 41.73,66.39 42.99,66.14 44.26,66.39 45.33,67.11 46.05,68.18 46.3,69.45 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="59.53,69.45 59.28,70.71 58.56,71.79 57.49,72.5 56.22,72.76 54.95,72.5 53.88,71.79 53.17,70.71 52.91,69.45 53.17,68.18 53.88,67.11 54.95,66.39 56.22,66.14 57.49,66.39 58.56,67.11 59.28,68.18 59.53,69.45 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="66.14,69.45 65.89,70.71 65.17,71.79 64.1,72.5 62.83,72.76 61.57,72.5 60.5,71.79 59.78,70.71 59.53,69.45 59.78,68.18 60.5,67.11 61.57,66.39 62.83,66.14 64.1,66.39 65.17,67.11 65.89,68.18 66.14,69.45 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="72.76,69.45 72.5,70.71 71.79,71.79 70.71,72.5 69.45,72.76 68.18,72.5 67.11,71.79 66.39,70.71 66.14,69.45 66.39,68.18 67.11,67.11 68.18,66.39 69.45,66.14 70.71,66.39 71.79,67.11 72.5,68.18 72.76,69.45 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="92.6,69.45 92.35,70.71 91.63,71.79 90.56,72.5 89.29,72.76 88.03,72.5 86.95,71.79 86.24,70.71 85.98,69.45 86.24,68.18 86.95,67.11 88.03,66.39 89.29,66.14 90.56,66.39 91.63,67.11 92.35,68.18 92.6,69.45 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="105.83,69.45 105.58,70.71 104.86,71.79 103.79,72.5 102.52,72.76 101.25,72.5 100.18,71.79 99.46,70.71 99.21,69.45 99.46,68.18 100.18,67.11 101.25,66.39 102.52,66.14 103.79,66.39 104.86,67.11 105.58,68.18 105.83,69.45 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="119.06,69.45 118.8,70.71 118.09,71.79 117.01,72.5 115.75,72.76 114.48,72.5 113.41,71.79 112.69,70.71 112.44,69.45 112.69,68.18 113.41,67.11 114.48,66.39 115.75,66.14 117.01,66.39 118.09,67.11 118.8,68.18 119.06,69.45 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="132.28,69.45 132.03,70.71 131.31,71.79 130.24,72.5 128.98,72.76 127.71,72.5 126.64,71.79 125.92,70.71 125.67,69.45 125.92,68.18 126.64,67.11 127.71,66.39 128.98,66.14 130.24,66.39 131.31,67.11 132.03,68.18 132.28,69.45 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="145.51,69.45 145.26,70.71 144.54,71.79 143.47,72.5 142.2,72.76 140.94,72.5 139.87,71.79 139.15,70.71 138.9,69.45 139.15,68.18 139.87,67.11 140.94,66.39 142.2,66.14 143.47,66.39 144.54,67.11 145.26,68.18 145.51,69.45 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="19.84,76.06 19.59,77.33 18.87,78.4 17.8,79.12 16.54,79.37 15.27,79.12 14.2,78.4 13.48,77.33 13.23,76.06 13.48,74.8 14.2,73.72 15.27,73.01 16.54,72.76 17.8,73.01 18.87,73.72 19.59,74.8 19.84,76.06 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="26.46,76.06 26.2,77.33 25.49,78.4 24.42,79.12 23.15,79.37 21.88,79.12 20.81,78.4 20.09,77.33 19.84,76.06 20.09,74.8 20.81,73.72 21.88,73.01 23.15,72.76 24.42,73.01 25.49,73.72 26.2,74.8 26.46,76.06 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="33.07,76.06 32.82,77.33 32.1,78.4 31.03,79.12 29.76,79.37 28.5,79.12 27.43,78.4 26.71,77.33 26.46,76.06 26.71,74.8 27.43,73.72 28.5,73.01 29.76,72.76 31.03,73.01 32.1,73.72 32.82,74.8 33.07,76.06 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="52.91,76.06 52.66,77.33 51.94,78.4 50.87,79.12 49.61,79.37 48.34,79.12 47.27,78.4 46.55,77.33 46.3,76.06 46.55,74.8 47.27,73.72 48.34,73.01 49.61,72.76 50.87,73.01 51.94,73.72 52.66,74.8 52.91,76.06 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="66.14,76.06 65.89,77.33 65.17,78.4 64.1,79.12 62.83,79.37 61.57,79.12 60.5,78.4 59.78,77.33 59.53,76.06 59.78,74.8 60.5,73.72 61.57,73.01 62.83,72.76 64.1,73.01 65.17,73.72 65.89,74.8 66.14,76.06 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="79.37,76.06 79.12,77.33 78.4,78.4 77.33,79.12 76.06,79.37 74.8,79.12 73.72,78.4 73.01,77.33 72.76,76.06 73.01,74.8 73.72,73.72 74.8,73.01 76.06,72.76 77.33,73.01 78.4,73.72 79.12,74.8 79.37,76.06 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="92.6,76.06 92.35,77.33 91.63,78.4 90.56,79.12 89.29,79.37 88.03,79.12 86.95,78.4 86.24,77.33 85.98,76.06 86.24,74.8 86.95,73.72 88.03,73.01 89.29,72.76 90.56,73.01 91.63,73.72 92.35,74.8 92.6,76.06 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="99.21,76.06 98.96,77.33 98.24,78.4 97.17,79.12 95.91,79.37 94.64,79.12 93.57,78.4 92.85,77.33 92.6,76.06 92.85,74.8 93.57,73.72 94.64,73.01 95.91,72.76 97.17,73.01 98.24,73.72 98.96,74.8 99.21,76.06 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="105.83,76.06 105.58,77.33 104.86,78.4 103.79,79.12 102.52,79.37 101.25,79.12 100.18,78.4 99.46,77.33 99.21,76.06 99.46,74.8 100.18,73.72 101.25,73.01 102.52,72.76 103.79,73.01 104.86,73.72 105.58,74.8 105.83,76.06 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="112.44,76.06 112.19,77.33 111.47,78.4 110.4,79.12 109.13,79.37 107.87,79.12 106.8,78.4 106.08,77.33 105.83,76.06 106.08,74.8 106.8,73.72 107.87,73.01 109.13,72.76 110.4,73.01 111.47,73.72 112.19,74.8 112.44,76.06 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="132.28,76.06 132.03,77.33 131.31,78.4 130.24,79.12 128.98,79.37 127.71,79.12 126.64,78.4 125.92,77.33 125.67,76.06 125.92,74.8 126.64,73.72 127.71,73.01 128.98,72.76 130.24,73.01 131.31,73.72 132.03,74.8 132.28,76.06 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="138.9,76.06 138.65,77.33 137.93,78.4 136.86,79.12 135.59,79.37 134.32,79.12 133.25,78.4 132.54,77.33 132.28,76.06 132.54,74.8 133.25,73.72 134.32,73.01 135.59,72.76 136.86,73.01 137.93,73.72 138.65,74.8 138.9,76.06 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="145.51,76.06 145.26,77.33 144.54,78.4 143.47,79.12 142.2,79.37 140.94,79.12 139.87,78.4 139.15,77.33 138.9,76.06 139.15,74.8 139.87,73.72 140.94,73.01 142.2,72.76 143.47,73.01 144.54,73.72 145.26,74.8 145.51,76.06 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="152.13,76.06 151.87,77.33 151.16,78.4 150.08,79.12 148.82,79.37 147.55,79.12 146.48,78.4 145.76,77.33 145.51,76.06 145.76,74.8 146.48,73.72 147.55,73.01 148.82,72.76 150.08,73.01 151.16,73.72 151.87,74.8 152.13,76.06 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="33.07,82.68 32.82,83.94 32.1,85.02 31.03,85.73 29.76,85.98 28.5,85.73 27.43,85.02 26.71,83.94 26.46,82.68 26.71,81.41 27.43,80.34 28.5,79.62 29.76,79.37 31.03,79.62 32.1,80.34 32.82,81.41 33.07,82.68 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="46.3,82.68 46.05,83.94 45.33,85.02 44.26,85.73 42.99,85.98 41.73,85.73 40.65,85.02 39.94,83.94 39.69,82.68 39.94,81.41 40.65,80.34 41.73,79.62 42.99,79.37 44.26,79.62 45.33,80.34 46.05,81.41 46.3,82.68 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="52.91,82.68 52.66,83.94 51.94,85.02 50.87,85.73 49.61,85.98 48.34,85.73 47.27,85.02 46.55,83.94 46.3,82.68 46.55,81.41 47.27,80.34 48.34,79.62 49.61,79.37 50.87,79.62 51.94,80.34 52.66,81.41 52.91,82.68 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="59.53,82.68 59.28,83.94 58.56,85.02 57.49,85.73 56.22,85.98 54.95,85.73 53.88,85.02 53.17,83.94 52.91,82.68 53.17,81.41 53.88,80.34 54.95,79.62 56.22,79.37 57.49,79.62 58.56,80.34 59.28,81.41 59.53,82.68 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="72.76,82.68 72.5,83.94 71.79,85.02 70.71,85.73 69.45,85.98 68.18,85.73 67.11,85.02 66.39,83.94 66.14,82.68 66.39,81.41 67.11,80.34 68.18,79.62 69.45,79.37 70.71,79.62 71.79,80.34 72.5,81.41 72.76,82.68 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="79.37,82.68 79.12,83.94 78.4,85.02 77.33,85.73 76.06,85.98 74.8,85.73 73.72,85.02 73.01,83.94 72.76,82.68 73.01,81.41 73.72,80.34 74.8,79.62 76.06,79.37 77.33,79.62 78.4,80.34 79.12,81.41 79.37,82.68 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="99.21,82.68 98.96,83.94 98.24,85.02 97.17,85.73 95.91,85.98 94.64,85.73 93.57,85.02 92.85,83.94 92.6,82.68 92.85,81.41 93.57,80.34 94.64,79.62 95.91,79.37 97.17,79.62 98.24,80.34 98.96,81.41 99.21,82.68 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="112.44,82.68 112.19,83.94 111.47,85.02 110.4,85.73 109.13,85.98 107.87,85.73 106.8,85.02 106.08,83.94 105.83,82.68 106.08,81.41 106.8,80.34 107.87,79.62 109.13,79.37 110.4,79.62 111.47,80.34 112.19,81.41 112.44,82.68 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="119.06,82.68 118.8,83.94 118.09,85.02 117.01,85.73 115.75,85.98 114.48,85.73 113.41,85.02 112.69,83.94 112.44,82.68 112.69,81.41 113.41,80.34 114.48,79.62 115.75,79.37 117.01,79.62 118.09,80.34 118.8,81.41 119.06,82.68 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="132.28,82.68 132.03,83.94 131.31,85.02 130.24,85.73 128.98,85.98 127.71,85.73 126.64,85.02 125.92,83.94 125.67,82.68 125.92,81.41 126.64,80.34 127.71,79.62 128.98,79.37 130.24,79.62 131.31,80.34 132.03,81.41 132.28,82.68 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="152.13,82.68 151.87,83.94 151.16,85.02 150.08,85.73 148.82,85.98 147.55,85.73 146.48,85.02 145.76,83.94 145.51,82.68 145.76,81.41 146.48,80.34 147.55,79.62 148.82,79.37 150.08,79.62 151.16,80.34 151.87,81.41 152.13,82.68 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="19.84,89.29 19.59,90.56 18.87,91.63 17.8,92.35 16.54,92.6 15.27,92.35 14.2,91.63 13.48,90.56 13.23,89.29 13.48,88.03 14.2,86.95 15.27,86.24 16.54,85.98 17.8,86.24 18.87,86.95 19.59,88.03 19.84,89.29 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="39.69,89.29 39.43,90.56 38.72,91.63 37.64,92.35 36.38,92.6 35.11,92.35 34.04,91.63 33.32,90.56 33.07,89.29 33.32,88.03 34.04,86.95 35.11,86.24 36.38,85.98 37.64,86.24 38.72,86.95 39.43,88.03 39.69,89.29 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="92.6,89.29 92.35,90.56 91.63,91.63 90.56,92.35 89.29,92.6 88.03,92.35 86.95,91.63 86.24,90.56 85.98,89.29 86.24,88.03 86.95,86.95 88.03,86.24 89.29,85.98 90.56,86.24 91.63,86.95 92.35,88.03 92.6,89.29 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="99.21,89.29 98.96,90.56 98.24,91.63 97.17,92.35 95.91,92.6 94.64,92.35 93.57,91.63 92.85,90.56 92.6,89.29 92.85,88.03 93.57,86.95 94.64,86.24 95.91,85.98 97.17,86.24 98.24,86.95 98.96,88.03 99.21,89.29 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="105.83,89.29 105.58,90.56 104.86,91.63 103.79,92.35 102.52,92.6 101.25,92.35 100.18,91.63 99.46,90.56 99.21,89.29 99.46,88.03 100.18,86.95 101.25,86.24 102.52,85.98 103.79,86.24 104.86,86.95 105.58,88.03 105.83,89.29 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="112.44,89.29 112.19,90.56 111.47,91.63 110.4,92.35 109.13,92.6 107.87,92.35 106.8,91.63 106.08,90.56 105.83,89.29 106.08,88.03 106.8,86.95 107.87,86.24 109.13,85.98 110.4,86.24 111.47,86.95 112.19,88.03 112.44,89.29 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="138.9,89.29 138.65,90.56 137.93,91.63 136.86,92.35 135.59,92.6 134.32,92.35 133.25,91.63 132.54,90.56 132.28,89.29 132.54,88.03 133.25,86.95 134.32,86.24 135.59,85.98 136.86,86.24 137.93,86.95 138.65,88.03 138.9,89.29 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="145.51,89.29 145.26,90.56 144.54,91.63 143.47,92.35 142.2,92.6 140.94,92.35 139.87,91.63 139.15,90.56 138.9,89.29 139.15,88.03 139.87,86.95 140.94,86.24 142.2,85.98 143.47,86.24 144.54,86.95 145.26,88.03 145.51,89.29 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="152.13,89.29 151.87,90.56 151.16,91.63 150.08,92.35 148.82,92.6 147.55,92.35 146.48,91.63 145.76,90.56 145.51,89.29 145.76,88.03 146.48,86.95 147.55,86.24 148.82,85.98 150.08,86.24 151.16,86.95 151.87,88.03 152.13,89.29 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="26.46,95.91 26.2,97.17 25.49,98.24 24.42,98.96 23.15,99.21 21.88,98.96 20.81,98.24 20.09,97.17 19.84,95.91 20.09,94.64 20.81,93.57 21.88,92.85 23.15,92.6 24.42,92.85 25.49,93.57 26.2,94.64 26.46,95.91 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="39.69,95.91 39.43,97.17 38.72,98.24 37.64,98.96 36.38,99.21 35.11,98.96 34.04,98.24 33.32,97.17 33.07,95.91 33.32,94.64 34.04,93.57 35.11,92.85 36.38,92.6 37.64,92.85 38.72,93.57 39.43,94.64 39.69,95.91 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="46.3,95.91 46.05,97.17 45.33,98.24 44.26,98.96 42.99,99.21 41.73,98.96 40.65,98.24 39.94,97.17 39.69,95.91 39.94,94.64 40.65,93.57 41.73,92.85 42.99,92.6 44.26,92.85 45.33,93.57 46.05,94.64 46.3,95.91 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="59.53,95.91 59.28,97.17 58.56,98.24 57.49,98.96 56.22,99.21 54.95,98.96 53.88,98.24 53.17,97.17 52.91,95.91 53.17,94.64 53.88,93.57 54.95,92.85 56.22,92.6 57.49,92.85 58.56,93.57 59.28,94.64 59.53,95.91 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="72.76,95.91 72.5,97.17 71.79,98.24 70.71,98.96 69.45,99.21 68.18,98.96 67.11,98.24 66.39,97.17 66.14,95.91 66.39,94.64 67.11,93.57 68.18,92.85 69.45,92.6 70.71,92.85 71.79,93.57 72.5,94.64 72.76,95.91 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="79.37,95.91 79.12,97.17 78.4,98.24 77.33,98.96 76.06,99.21 74.8,98.96 73.72,98.24 73.01,97.17 72.76,95.91 73.01,94.64 73.72,93.57 74.8,92.85 76.06,92.6 77.33,92.85 78.4,93.57 79.12,94.64 79.37,95.91 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="99.21,95.91 98.96,97.17 98.24,98.24 97.17,98.96 95.91,99.21 94.64,98.96 93.57,98.24 92.85,97.17 92.6,95.91 92.85,94.64 93.57,93.57 94.64,92.85 95.91,92.6 97.17,92.85 98.24,93.57 98.96,94.64 99.21,95.91 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="119.06,95.91 118.8,97.17 118.09,98.24 117.01,98.96 115.75,99.21 114.48,98.96 113.41,98.24 112.69,97.17 112.44,95.91 112.69,94.64 113.41,93.57 114.48,92.85 115.75,92.6 117.01,92.85 118.09,93.57 118.8,94.64 119.06,95.91 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="145.51,95.91 145.26,97.17 144.54,98.24 143.47,98.96 142.2,99.21 140.94,98.96 139.87,98.24 139.15,97.17 138.9,95.91 139.15,94.64 139.87,93.57 140.94,92.85 142.2,92.6 143.47,92.85 144.54,93.57 145.26,94.64 145.51,95.91 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="72.76,102.52 72.5,103.79 71.79,104.86 70.71,105.58 69.45,105.83 68.18,105.58 67.11,104.86 66.39,103.79 66.14,102.52 66.39,101.25 67.11,100.18 68.18,99.46 69.45,99.21 70.71,99.46 71.79,100.18 72.5,101.25 72.76,102.52 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="85.98,102.52 85.73,103.79 85.02,104.86 83.94,105.58 82.68,105.83 81.41,105.58 80.34,104.86 79.62,103.79 79.37,102.52 79.62,101.25 80.34,100.18 81.41,99.46 82.68,99.21 83.94,99.46 85.02,100.18 85.73,101.25 85.98,102.52 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="99.21,102.52 98.96,103.79 98.24,104.86 97.17,105.58 95.91,105.83 94.64,105.58 93.57,104.86 92.85,103.79 92.6,102.52 92.85,101.25 93.57,100.18 94.64,99.46 95.91,99.21 97.17,99.46 98.24,100.18 98.96,101.25 99.21,102.52 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="119.06,102.52 118.8,103.79 118.09,104.86 117.01,105.58 115.75,105.83 114.48,105.58 113.41,104.86 112.69,103.79 112.44,102.52 112.69,101.25 113.41,100.18 114.48,99.46 115.75,99.21 117.01,99.46 118.09,100.18 118.8,101.25 119.06,102.52 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="138.9,102.52 138.65,103.79 137.93,104.86 136.86,105.58 135.59,105.83 134.32,105.58 133.25,104.86 132.54,103.79 132.28,102.52 132.54,101.25 133.25,100.18 134.32,99.46 135.59,99.21 136.86,99.46 137.93,100.18 138.65,101.25 138.9,102.52 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="72.76,109.13 72.5,110.4 71.79,111.47 70.71,112.19 69.45,112.44 68.18,112.19 67.11,111.47 66.39,110.4 66.14,109.13 66.39,107.87 67.11,106.8 68.18,106.08 69.45,105.83 70.71,106.08 71.79,106.8 72.5,107.87 72.76,109.13 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="92.6,109.13 92.35,110.4 91.63,111.47 90.56,112.19 89.29,112.44 88.03,112.19 86.95,111.47 86.24,110.4 85.98,109.13 86.24,107.87 86.95,106.8 88.03,106.08 89.29,105.83 90.56,106.08 91.63,106.8 92.35,107.87 92.6,109.13 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="105.83,109.13 105.58,110.4 104.86,111.47 103.79,112.19 102.52,112.44 101.25,112.19 100.18,111.47 99.46,110.4 99.21,109.13 99.46,107.87 100.18,106.8 101.25,106.08 102.52,105.83 103.79,106.08 104.86,106.8 105.58,107.87 105.83,109.13 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="125.67,109.13 125.42,110.4 124.7,111.47 123.63,112.19 122.36,112.44 121.1,112.19 120.02,111.47 119.31,110.4 119.06,109.13 119.31,107.87 120.02,106.8 121.1,106.08 122.36,105.83 123.63,106.08 124.7,106.8 125.42,107.87 125.67,109.13 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="132.28,109.13 132.03,110.4 131.31,111.47 130.24,112.19 128.98,112.44 127.71,112.19 126.64,111.47 125.92,110.4 125.67,109.13 125.92,107.87 126.64,106.8 127.71,106.08 128.98,105.83 130.24,106.08 131.31,106.8 132.03,107.87 132.28,109.13 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="145.51,109.13 145.26,110.4 144.54,111.47 143.47,112.19 142.2,112.44 140.94,112.19 139.87,111.47 139.15,110.4 138.9,109.13 139.15,107.87 139.87,106.8 140.94,106.08 142.2,105.83 143.47,106.08 144.54,106.8 145.26,107.87 145.51,109.13 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="152.13,109.13 151.87,110.4 151.16,111.47 150.08,112.19 148.82,112.44 147.55,112.19 146.48,111.47 145.76,110.4 145.51,109.13 145.76,107.87 146.48,106.8 147.55,106.08 148.82,105.83 150.08,106.08 151.16,106.8 151.87,107.87 152.13,109.13 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="79.37,115.75 79.12,117.01 78.4,118.09 77.33,118.8 76.06,119.06 74.8,118.8 73.72,118.09 73.01,117.01 72.76,115.75 73.01,114.48 73.72,113.41 74.8,112.69 76.06,112.44 77.33,112.69 78.4,113.41 79.12,114.48 79.37,115.75 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="85.98,115.75 85.73,117.01 85.02,118.09 83.94,118.8 82.68,119.06 81.41,118.8 80.34,118.09 79.62,117.01 79.37,115.75 79.62,114.48 80.34,113.41 81.41,112.69 82.68,112.44 83.94,112.69 85.02,113.41 85.73,114.48 85.98,115.75 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="119.06,115.75 118.8,117.01 118.09,118.09 117.01,118.8 115.75,119.06 114.48,118.8 113.41,118.09 112.69,117.01 112.44,115.75 112.69,114.48 113.41,113.41 114.48,112.69 115.75,112.44 117.01,112.69 118.09,113.41 118.8,114.48 119.06,115.75 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="125.67,115.75 125.42,117.01 124.7,118.09 123.63,118.8 122.36,119.06 121.1,118.8 120.02,118.09 119.31,117.01 119.06,115.75 119.31,114.48 120.02,113.41 121.1,112.69 122.36,112.44 123.63,112.69 124.7,113.41 125.42,114.48 125.67,115.75 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="138.9,115.75 138.65,117.01 137.93,118.09 136.86,118.8 135.59,119.06 134.32,118.8 133.25,118.09 132.54,117.01 132.28,115.75 132.54,114.48 133.25,113.41 134.32,112.69 135.59,112.44 136.86,112.69 137.93,113.41 138.65,114.48 138.9,115.75 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="152.13,115.75 151.87,117.01 151.16,118.09 150.08,118.8 148.82,119.06 147.55,118.8 146.48,118.09 145.76,117.01 145.51,115.75 145.76,114.48 146.48,113.41 147.55,112.69 148.82,112.44 150.08,112.69 151.16,113.41 151.87,114.48 152.13,115.75 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="72.76,122.36 72.5,123.63 71.79,124.7 70.71,125.42 69.45,125.67 68.18,125.42 67.11,124.7 66.39,123.63 66.14,122.36 66.39,121.1 67.11,120.02 68.18,119.31 69.45,119.06 70.71,119.31 71.79,120.02 72.5,121.1 72.76,122.36 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="79.37,122.36 79.12,123.63 78.4,124.7 77.33,125.42 76.06,125.67 74.8,125.42 73.72,124.7 73.01,123.63 72.76,122.36 73.01,121.1 73.72,120.02 74.8,119.31 76.06,119.06 77.33,119.31 78.4,120.02 79.12,121.1 79.37,122.36 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="85.98,122.36 85.73,123.63 85.02,124.7 83.94,125.42 82.68,125.67 81.41,125.42 80.34,124.7 79.62,123.63 79.37,122.36 79.62,121.1 80.34,120.02 81.41,119.31 82.68,119.06 83.94,119.31 85.02,120.02 85.73,121.1 85.98,122.36 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="92.6,122.36 92.35,123.63 91.63,124.7 90.56,125.42 89.29,125.67 88.03,125.42 86.95,124.7 86.24,123.63 85.98,122.36 86.24,121.1 86.95,120.02 88.03,119.31 89.29,119.06 90.56,119.31 91.63,120.02 92.35,121.1 92.6,122.36 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="105.83,122.36 105.58,123.63 104.86,124.7 103.79,125.42 102.52,125.67 101.25,125.42 100.18,124.7 99.46,123.63 99.21,122.36 99.46,121.1 100.18,120.02 101.25,119.31 102.52,119.06 103.79,119.31 104.86,120.02 105.58,121.1 105.83,122.36 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="125.67,122.36 125.42,123.63 124.7,124.7 123.63,125.42 122.36,125.67 121.1,125.42 120.02,124.7 119.31,123.63 119.06,122.36 119.31,121.1 120.02,120.02 121.1,119.31 122.36,119.06 123.63,119.31 124.7,120.02 125.42,121.1 125.67,122.36 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="132.28,122.36 132.03,123.63 131.31,124.7 130.24,125.42 128.98,125.67 127.71,125.42 126.64,124.7 125.92,123.63 125.67,122.36 125.92,121.1 126.64,120.02 127.71,119.31 128.98,119.06 130.24,119.31 131.31,120.02 132.03,121.1 132.28,122.36 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="138.9,122.36 138.65,123.63 137.93,124.7 136.86,125.42 135.59,125.67 134.32,125.42 133.25,124.7 132.54,123.63 132.28,122.36 132.54,121.1 133.25,120.02 134.32,119.31 135.59,119.06 136.86,119.31 137.93,120.02 138.65,121.1 138.9,122.36 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="72.76,128.98 72.5,130.24 71.79,131.31 70.71,132.03 69.45,132.28 68.18,132.03 67.11,131.31 66.39,130.24 66.14,128.98 66.39,127.71 67.11,126.64 68.18,125.92 69.45,125.67 70.71,125.92 71.79,126.64 72.5,127.71 72.76,128.98 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="79.37,128.98 79.12,130.24 78.4,131.31 77.33,132.03 76.06,132.28 74.8,132.03 73.72,131.31 73.01,130.24 72.76,128.98 73.01,127.71 73.72,126.64 74.8,125.92 76.06,125.67 77.33,125.92 78.4,126.64 79.12,127.71 79.37,128.98 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="92.6,128.98 92.35,130.24 91.63,131.31 90.56,132.03 89.29,132.28 88.03,132.03 86.95,131.31 86.24,130.24 85.98,128.98 86.24,127.71 86.95,126.64 88.03,125.92 89.29,125.67 90.56,125.92 91.63,126.64 92.35,127.71 92.6,128.98 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="99.21,128.98 98.96,130.24 98.24,131.31 97.17,132.03 95.91,132.28 94.64,132.03 93.57,131.31 92.85,130.24 92.6,128.98 92.85,127.71 93.57,126.64 94.64,125.92 95.91,125.67 97.17,125.92 98.24,126.64 98.96,127.71 99.21,128.98 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="105.83,128.98 105.58,130.24 104.86,131.31 103.79,132.03 102.52,132.28 101.25,132.03 100.18,131.31 99.46,130.24 99.21,128.98 99.46,127.71 100.18,126.64 101.25,125.92 102.52,125.67 103.79,125.92 104.86,126.64 105.58,127.71 105.83,128.98 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="112.44,128.98 112.19,130.24 111.47,131.31 110.4,132.03 109.13,132.28 107.87,132.03 106.8,131.31 106.08,130.24 105.83,128.98 106.08,127.71 106.8,126.64 107.87,125.92 109.13,125.67 110.4,125.92 111.47,126.64 112.19,127.71 112.44,128.98 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="119.06,128.98 118.8,130.24 118.09,131.31 117.01,132.03 115.75,132.28 114.48,132.03 113.41,131.31 112.69,130.24 112.44,128.98 112.69,127.71 113.41,126.64 114.48,125.92 115.75,125.67 117.01,125.92 118.09,126.64 118.8,127.71 119.06,128.98 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="132.28,128.98 132.03,130.24 131.31,131.31 130.24,132.03 128.98,132.28 127.71,132.03 126.64,131.31 125.92,130.24 125.67,128.98 125.92,127.71 126.64,126.64 127.71,125.92 128.98,125.67 130.24,125.92 131.31,126.64 132.03,127.71 132.28,128.98 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="138.9,128.98 138.65,130.24 137.93,131.31 136.86,132.03 135.59,132.28 134.32,132.03 133.25,131.31 132.54,130.24 132.28,128.98 132.54,127.71 133.25,126.64 134.32,125.92 135.59,125.67 136.86,125.92 137.93,126.64 138.65,127.71 138.9,128.98 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="72.76,135.59 72.5,136.86 71.79,137.93 70.71,138.65 69.45,138.9 68.18,138.65 67.11,137.93 66.39,136.86 66.14,135.59 66.39,134.32 67.11,133.25 68.18,132.54 69.45,132.28 70.71,132.54 71.79,133.25 72.5,134.32 72.76,135.59 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="79.37,135.59 79.12,136.86 78.4,137.93 77.33,138.65 76.06,138.9 74.8,138.65 73.72,137.93 73.01,136.86 72.76,135.59 73.01,134.32 73.72,133.25 74.8,132.54 76.06,132.28 77.33,132.54 78.4,133.25 79.12,134.32 79.37,135.59 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="99.21,135.59 98.96,136.86 98.24,137.93 97.17,138.65 95.91,138.9 94.64,138.65 93.57,137.93 92.85,136.86 92.6,135.59 92.85,134.32 93.57,133.25 94.64,132.54 95.91,132.28 97.17,132.54 98.24,133.25 98.96,134.32 99.21,135.59 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="112.44,135.59 112.19,136.86 111.47,137.93 110.4,138.65 109.13,138.9 107.87,138.65 106.8,137.93 106.08,136.86 105.83,135.59 106.08,134.32 106.8,133.25 107.87,132.54 109.13,132.28 110.4,132.54 111.47,133.25 112.19,134.32 112.44,135.59 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="119.06,135.59 118.8,136.86 118.09,137.93 117.01,138.65 115.75,138.9 114.48,138.65 113.41,137.93 112.69,136.86 112.44,135.59 112.69,134.32 113.41,133.25 114.48,132.54 115.75,132.28 117.01,132.54 118.09,133.25 118.8,134.32 119.06,135.59 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="132.28,135.59 132.03,136.86 131.31,137.93 130.24,138.65 128.98,138.9 127.71,138.65 126.64,137.93 125.92,136.86 125.67,135.59 125.92,134.32 126.64,133.25 127.71,132.54 128.98,132.28 130.24,132.54 131.31,133.25 132.03,134.32 132.28,135.59 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="138.9,135.59 138.65,136.86 137.93,137.93 136.86,138.65 135.59,138.9 134.32,138.65 133.25,137.93 132.54,136.86 132.28,135.59 132.54,134.32 133.25,133.25 134.32,132.54 135.59,132.28 136.86,132.54 137.93,133.25 138.65,134.32 138.9,135.59 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="72.76,142.2 72.5,143.47 71.79,144.54 70.71,145.26 69.45,145.51 68.18,145.26 67.11,144.54 66.39,143.47 66.14,142.2 66.39,140.94 67.11,139.87 68.18,139.15 69.45,138.9 70.71,139.15 71.79,139.87 72.5,140.94 72.76,142.2 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="85.98,142.2 85.73,143.47 85.02,144.54 83.94,145.26 82.68,145.51 81.41,145.26 80.34,144.54 79.62,143.47 79.37,142.2 79.62,140.94 80.34,139.87 81.41,139.15 82.68,138.9 83.94,139.15 85.02,139.87 85.73,140.94 85.98,142.2 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="92.6,142.2 92.35,143.47 91.63,144.54 90.56,145.26 89.29,145.51 88.03,145.26 86.95,144.54 86.24,143.47 85.98,142.2 86.24,140.94 86.95,139.87 88.03,139.15 89.29,138.9 90.56,139.15 91.63,139.87 92.35,140.94 92.6,142.2 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="99.21,142.2 98.96,143.47 98.24,144.54 97.17,145.26 95.91,145.51 94.64,145.26 93.57,144.54 92.85,143.47 92.6,142.2 92.85,140.94 93.57,139.87 94.64,139.15 95.91,138.9 97.17,139.15 98.24,139.87 98.96,140.94 99.21,142.2 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="105.83,142.2 105.58,143.47 104.86,144.54 103.79,145.26 102.52,145.51 101.25,145.26 100.18,144.54 99.46,143.47 99.21,142.2 99.46,140.94 100.18,139.87 101.25,139.15 102.52,138.9 103.79,139.15 104.86,139.87 105.58,140.94 105.83,142.2 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="112.44,142.2 112.19,143.47 111.47,144.54 110.4,145.26 109.13,145.51 107.87,145.26 106.8,144.54 106.08,143.47 105.83,142.2 106.08,140.94 106.8,139.87 107.87,139.15 109.13,138.9 110.4,139.15 111.47,139.87 112.19,140.94 112.44,142.2 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="119.06,142.2 118.8,143.47 118.09,144.54 117.01,145.26 115.75,145.51 114.48,145.26 113.41,144.54 112.69,143.47 112.44,142.2 112.69,140.94 113.41,139.87 114.48,139.15 115.75,138.9 117.01,139.15 118.09,139.87 118.8,140.94 119.06,142.2 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="125.67,142.2 125.42,143.47 124.7,144.54 123.63,145.26 122.36,145.51 121.1,145.26 120.02,144.54 119.31,143.47 119.06,142.2 119.31,140.94 120.02,139.87 121.1,139.15 122.36,138.9 123.63,139.15 124.7,139.87 125.42,140.94 125.67,142.2 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="138.9,142.2 138.65,143.47 137.93,144.54 136.86,145.26 135.59,145.51 134.32,145.26 133.25,144.54 132.54,143.47 132.28,142.2 132.54,140.94 133.25,139.87 134.32,139.15 135.59,138.9 136.86,139.15 137.93,139.87 138.65,140.94 138.9,142.2 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="145.51,142.2 145.26,143.47 144.54,144.54 143.47,145.26 142.2,145.51 140.94,145.26 139.87,144.54 139.15,143.47 138.9,142.2 139.15,140.94 139.87,139.87 140.94,139.15 142.2,138.9 143.47,139.15 144.54,139.87 145.26,140.94 145.51,142.2 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="72.76,148.82 72.5,150.08 71.79,151.16 70.71,151.87 69.45,152.13 68.18,151.87 67.11,151.16 66.39,150.08 66.14,148.82 66.39,147.55 67.11,146.48 68.18,145.76 69.45,145.51 70.71,145.76 71.79,146.48 72.5,147.55 72.76,148.82 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="79.37,148.82 79.12,150.08 78.4,151.16 77.33,151.87 76.06,152.13 74.8,151.87 73.72,151.16 73.01,150.08 72.76,148.82 73.01,147.55 73.72,146.48 74.8,145.76 76.06,145.51 77.33,145.76 78.4,146.48 79.12,147.55 79.37,148.82 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="85.98,148.82 85.73,150.08 85.02,151.16 83.94,151.87 82.68,152.13 81.41,151.87 80.34,151.16 79.62,150.08 79.37,148.82 79.62,147.55 80.34,146.48 81.41,145.76 82.68,145.51 83.94,145.76 85.02,146.48 85.73,147.55 85.98,148.82 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="99.21,148.82 98.96,150.08 98.24,151.16 97.17,151.87 95.91,152.13 94.64,151.87 93.57,151.16 92.85,150.08 92.6,148.82 92.85,147.55 93.57,146.48 94.64,145.76 95.91,145.51 97.17,145.76 98.24,146.48 98.96,147.55 99.21,148.82 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="119.06,148.82 118.8,150.08 118.09,151.16 117.01,151.87 115.75,152.13 114.48,151.87 113.41,151.16 112.69,150.08 112.44,148.82 112.69,147.55 113.41,146.48 114.48,145.76 115.75,145.51 117.01,145.76 118.09,146.48 118.8,147.55 119.06,148.82 "
            style="fill:rgba(85,85,85,1);"
          />
          <polygon
            points="138.9,148.82 138.65,150.08 137.93,151.16 136.86,151.87 135.59,152.13 134.32,151.87 133.25,151.16 132.54,150.08 132.28,148.82 132.54,147.55 133.25,146.48 134.32,145.76 135.59,145.51 136.86,145.76 137.93,146.48 138.65,147.55 138.9,148.82 "
            style="fill:rgba(85,85,85,1);"
          />
    `,
            },
            {
                value: 4,
                innerHtml: `
      <rect
          x="0"
          y="0"
          width="165.3543"
          height="165.3543"
          fill="red"
          style="fill:rgba(255,255,255,0);"
          shape-rendering="crispEdges"
        />
        <linearGradient
          id="gradientb8ccf5af139d4745a4e57cbdbf3495fb"
          gradientUnits="userSpaceOnUse"
          x1="0.518330705864074"
          y1="35.242737901909"
          x2="164.835989820259"
          y2="130.111582624214"
        >
          <stop offset="0%" stop-color="#5A01B3" />
          <stop offset="100%" stop-color="#3B4990" />
        </linearGradient>
        <polygon
          points="13.23,29.76 13.55,26.54 14.49,23.44 16.02,20.58 18.07,18.07 20.58,16.02 23.44,14.49 26.54,13.55 29.76,13.23 42.99,13.23 46.22,13.55 49.32,14.49 52.18,16.02 54.68,18.07 56.74,20.58 58.27,23.44 59.21,26.54 59.53,29.76 59.53,42.99 59.21,46.22 58.27,49.32 56.74,52.18 54.68,54.68 52.18,56.74 49.32,58.27 46.22,59.21 42.99,59.53 29.76,59.53 26.54,59.21 23.44,58.27 20.58,56.74 18.07,54.68 16.02,52.18 14.49,49.32 13.55,46.22 13.23,42.99 13.23,29.76 19.84,29.76 19.84,42.99 20.18,45.56 21.17,47.95 22.75,50.01 24.8,51.58 27.2,52.58 29.76,52.91 42.99,52.91 45.56,52.58 47.95,51.58 50.01,50.01 51.58,47.95 52.58,45.56 52.91,42.99 52.91,29.76 52.58,27.2 51.58,24.8 50.01,22.75 47.95,21.17 45.56,20.18 42.99,19.84 29.76,19.84 27.2,20.18 24.8,21.17 22.75,22.75 21.17,24.8 20.18,27.2 19.84,29.76 "
          style="fill:url(#gradientb8ccf5af139d4745a4e57cbdbf3495fb);"
        />
        <polygon
          points="13.23,122.36 13.55,119.14 14.49,116.03 16.02,113.18 18.07,110.67 20.58,108.61 23.44,107.09 26.54,106.14 29.76,105.83 42.99,105.83 46.22,106.14 49.32,107.09 52.18,108.61 54.68,110.67 56.74,113.18 58.27,116.03 59.21,119.14 59.53,122.36 59.53,135.59 59.21,138.82 58.27,141.92 56.74,144.78 54.68,147.28 52.18,149.34 49.32,150.87 46.22,151.81 42.99,152.13 29.76,152.13 26.54,151.81 23.44,150.87 20.58,149.34 18.07,147.28 16.02,144.78 14.49,141.92 13.55,138.82 13.23,135.59 13.23,122.36 19.84,122.36 19.84,135.59 20.18,138.16 21.17,140.55 22.75,142.61 24.8,144.18 27.2,145.17 29.76,145.51 42.99,145.51 45.56,145.17 47.95,144.18 50.01,142.61 51.58,140.55 52.58,138.16 52.91,135.59 52.91,122.36 52.58,119.79 51.58,117.4 50.01,115.35 47.95,113.77 45.56,112.78 42.99,112.44 29.76,112.44 27.2,112.78 24.8,113.77 22.75,115.35 21.17,117.4 20.18,119.79 19.84,122.36 "
          style="fill:url(#gradientb8ccf5af139d4745a4e57cbdbf3495fb);"
        />
        <polygon
          points="105.83,29.76 106.14,26.54 107.09,23.44 108.61,20.58 110.67,18.07 113.18,16.02 116.03,14.49 119.14,13.55 122.36,13.23 135.59,13.23 138.82,13.55 141.92,14.49 144.78,16.02 147.28,18.07 149.34,20.58 150.87,23.44 151.81,26.54 152.13,29.76 152.13,42.99 151.81,46.22 150.87,49.32 149.34,52.18 147.28,54.68 144.78,56.74 141.92,58.27 138.82,59.21 135.59,59.53 122.36,59.53 119.14,59.21 116.03,58.27 113.18,56.74 110.67,54.68 108.61,52.18 107.09,49.32 106.14,46.22 105.83,42.99 105.83,29.76 112.44,29.76 112.44,42.99 112.78,45.56 113.77,47.95 115.35,50.01 117.4,51.58 119.79,52.58 122.36,52.91 135.59,52.91 138.16,52.58 140.55,51.58 142.61,50.01 144.18,47.95 145.17,45.56 145.51,42.99 145.51,29.76 145.17,27.2 144.18,24.8 142.61,22.75 140.55,21.17 138.16,20.18 135.59,19.84 122.36,19.84 119.79,20.18 117.4,21.17 115.35,22.75 113.77,24.8 112.78,27.2 112.44,29.76 "
          style="fill:url(#gradientb8ccf5af139d4745a4e57cbdbf3495fb);"
        />
        <pattern
          id="hatchd1532579170549379ffa1843e72867ab"
          x="0"
          y="0"
          width="8"
          height="8"
          patternUnits="userSpaceOnUse"
        >
          <rect x="0" y="0" width="8" height="8" fill="#695289" />
          <rect x="4" y="0" width="1" height="1" fill="#783948" />
          <rect x="5" y="0" width="1" height="1" fill="#783948" />
          <rect x="6" y="0" width="1" height="1" fill="#783948" />
          <rect x="7" y="0" width="1" height="1" fill="#783948" />
          <rect x="4" y="1" width="1" height="1" fill="#783948" />
          <rect x="5" y="1" width="1" height="1" fill="#783948" />
          <rect x="6" y="1" width="1" height="1" fill="#783948" />
          <rect x="7" y="1" width="1" height="1" fill="#783948" />
          <rect x="4" y="2" width="1" height="1" fill="#783948" />
          <rect x="5" y="2" width="1" height="1" fill="#783948" />
          <rect x="6" y="2" width="1" height="1" fill="#783948" />
          <rect x="7" y="2" width="1" height="1" fill="#783948" />
          <rect x="4" y="3" width="1" height="1" fill="#783948" />
          <rect x="5" y="3" width="1" height="1" fill="#783948" />
          <rect x="6" y="3" width="1" height="1" fill="#783948" />
          <rect x="7" y="3" width="1" height="1" fill="#783948" />
          <rect x="0" y="4" width="1" height="1" fill="#783948" />
          <rect x="1" y="4" width="1" height="1" fill="#783948" />
          <rect x="2" y="4" width="1" height="1" fill="#783948" />
          <rect x="3" y="4" width="1" height="1" fill="#783948" />
          <rect x="0" y="5" width="1" height="1" fill="#783948" />
          <rect x="1" y="5" width="1" height="1" fill="#783948" />
          <rect x="2" y="5" width="1" height="1" fill="#783948" />
          <rect x="3" y="5" width="1" height="1" fill="#783948" />
          <rect x="0" y="6" width="1" height="1" fill="#783948" />
          <rect x="1" y="6" width="1" height="1" fill="#783948" />
          <rect x="2" y="6" width="1" height="1" fill="#783948" />
          <rect x="3" y="6" width="1" height="1" fill="#783948" />
          <rect x="0" y="7" width="1" height="1" fill="#783948" />
          <rect x="1" y="7" width="1" height="1" fill="#783948" />
          <rect x="2" y="7" width="1" height="1" fill="#783948" />
          <rect x="3" y="7" width="1" height="1" fill="#783948" />
        </pattern>
        <polygon
          points="26.46,31.09 26.61,29.89 27.08,28.77 27.81,27.81 28.77,27.08 29.89,26.61 31.09,26.46 41.67,26.46 42.87,26.61 43.98,27.08 44.94,27.81 45.68,28.77 46.14,29.89 46.3,31.09 46.3,41.67 46.14,42.87 45.68,43.98 44.94,44.94 43.98,45.68 42.87,46.14 41.67,46.3 31.09,46.3 29.89,46.14 28.77,45.68 27.81,44.94 27.08,43.98 26.61,42.87 26.46,41.67 "
          style="fill:url(#hatchd1532579170549379ffa1843e72867ab);"
        />
        <polygon
          points="26.46,123.69 26.61,122.49 27.08,121.37 27.81,120.41 28.77,119.68 29.89,119.21 31.09,119.06 41.67,119.06 42.87,119.21 43.98,119.68 44.94,120.41 45.68,121.37 46.14,122.49 46.3,123.69 46.3,134.27 46.14,135.47 45.68,136.58 44.94,137.54 43.98,138.28 42.87,138.74 41.67,138.9 31.09,138.9 29.89,138.74 28.77,138.28 27.81,137.54 27.08,136.58 26.61,135.47 26.46,134.27 "
          style="fill:url(#hatchd1532579170549379ffa1843e72867ab);"
        />
        <polygon
          points="119.06,31.09 119.21,29.89 119.68,28.77 120.41,27.81 121.37,27.08 122.49,26.61 123.69,26.46 134.27,26.46 135.47,26.61 136.58,27.08 137.54,27.81 138.28,28.77 138.74,29.89 138.9,31.09 138.9,41.67 138.74,42.87 138.28,43.98 137.54,44.94 136.58,45.68 135.47,46.14 134.27,46.3 123.69,46.3 122.49,46.14 121.37,45.68 120.41,44.94 119.68,43.98 119.21,42.87 119.06,41.67 "
          style="fill:url(#hatchd1532579170549379ffa1843e72867ab);"
        />
        <linearGradient
          id="gradient05b39589f89a4da0bb06028c8be76a2c"
          gradientUnits="userSpaceOnUse"
          x1="5.85921475478483"
          y1="73.2451025543645"
          x2="159.495105771338"
          y2="92.1092179717585"
        >
          <stop offset="0%" stop-color="#742E2C" />
          <stop offset="90%" stop-color="#214D84" />
          <stop offset="100%" stop-color="#742E2C" />
        </linearGradient>
        <polygon
          points="79.37,15.54 79.55,14.66 80.05,13.91 80.8,13.4 81.69,13.23 86.05,13.23 86.05,19.91 79.37,19.91 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="85.92,16.54 85.92,13.23 92.66,13.23 92.66,19.84 85.92,19.84 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="92.53,13.23 96.9,13.23 97.78,13.4 98.53,13.91 99.04,14.66 99.21,15.54 99.21,19.91 92.53,19.91 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="66.14,22.16 66.32,21.27 66.82,20.52 67.57,20.02 68.46,19.84 72.82,19.84 72.82,26.46 68.46,26.46 67.57,26.28 66.82,25.78 66.32,25.03 66.14,24.14 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="72.69,23.15 72.69,19.84 79.44,19.84 79.44,26.46 72.69,26.46 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="79.3,23.15 79.3,19.78 85.98,19.78 85.98,26.52 79.3,26.52 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="92.6,23.15 92.6,19.78 99.21,19.78 99.21,26.52 92.6,26.52 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="79.37,26.39 86.05,26.39 86.05,33.07 81.69,33.07 80.8,32.89 80.05,32.39 79.55,31.64 79.37,30.76 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="85.92,29.76 85.92,26.46 92.66,26.46 92.66,33.07 85.92,33.07 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="92.53,29.76 92.53,26.39 99.21,26.39 99.21,33.14 92.53,33.14 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="66.14,35.39 66.32,34.5 66.82,33.75 67.57,33.25 68.46,33.07 72.82,33.07 72.82,39.69 68.46,39.69 67.57,39.51 66.82,39.01 66.32,38.26 66.14,37.37 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="72.69,33.07 77.06,33.07 77.94,33.25 78.69,33.75 79.19,34.5 79.37,35.39 79.37,39.75 72.69,39.75 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="92.6,36.38 92.6,33 99.21,33 99.21,39.75 92.6,39.75 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="72.76,39.62 79.37,39.62 79.37,43.98 79.19,44.87 78.69,45.62 77.94,46.12 77.06,46.3 75.07,46.3 74.18,46.12 73.43,45.62 72.93,44.87 72.76,43.98 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="92.6,39.62 99.21,39.62 99.21,43.98 99.04,44.87 98.53,45.62 97.78,46.12 96.9,46.3 94.91,46.3 94.03,46.12 93.28,45.62 92.77,44.87 92.6,43.98 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="66.14,48.61 66.32,47.73 66.82,46.98 67.57,46.48 68.46,46.3 70.44,46.3 71.33,46.48 72.08,46.98 72.58,47.73 72.76,48.61 72.76,52.98 66.14,52.98 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="85.98,48.61 86.16,47.73 86.66,46.98 87.41,46.48 88.3,46.3 90.28,46.3 91.17,46.48 91.92,46.98 92.42,47.73 92.6,48.61 92.6,50.6 92.42,51.48 91.92,52.24 91.17,52.74 90.28,52.91 88.3,52.91 87.41,52.74 86.66,52.24 86.16,51.48 85.98,50.6 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="66.14,52.85 72.76,52.85 72.76,57.21 72.58,58.1 72.08,58.85 71.33,59.35 70.44,59.53 68.46,59.53 67.57,59.35 66.82,58.85 66.32,58.1 66.14,57.21 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="79.37,55.23 79.55,54.34 80.05,53.59 80.8,53.09 81.69,52.91 83.67,52.91 84.56,53.09 85.31,53.59 85.81,54.34 85.98,55.23 85.98,57.21 85.81,58.1 85.31,58.85 84.56,59.35 83.67,59.53 81.69,59.53 80.8,59.35 80.05,58.85 79.55,58.1 79.37,57.21 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="92.6,55.23 92.77,54.34 93.28,53.59 94.03,53.09 94.91,52.91 96.9,52.91 97.78,53.09 98.53,53.59 99.04,54.34 99.21,55.23 99.21,57.21 99.04,58.1 98.53,58.85 97.78,59.35 96.9,59.53 94.91,59.53 94.03,59.35 93.28,58.85 92.77,58.1 92.6,57.21 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="72.76,61.84 72.93,60.96 73.43,60.21 74.18,59.7 75.07,59.53 77.06,59.53 77.94,59.7 78.69,60.21 79.19,60.96 79.37,61.84 79.37,63.83 79.19,64.71 78.69,65.46 77.94,65.97 77.06,66.14 75.07,66.14 74.18,65.97 73.43,65.46 72.93,64.71 72.76,63.83 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="13.23,68.46 13.4,67.57 13.91,66.82 14.66,66.32 15.54,66.14 19.91,66.14 19.91,72.82 13.23,72.82 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="19.78,69.45 19.78,66.14 26.52,66.14 26.52,72.82 19.78,72.82 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="26.39,69.45 26.39,66.14 33.14,66.14 33.14,72.82 26.39,72.82 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="33,69.45 33,66.14 39.75,66.14 39.75,72.76 33,72.76 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="39.62,66.14 43.98,66.14 44.87,66.32 45.62,66.82 46.12,67.57 46.3,68.46 46.3,70.44 46.12,71.33 45.62,72.08 44.87,72.58 43.98,72.76 39.62,72.76 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="52.91,68.46 53.09,67.57 53.59,66.82 54.34,66.32 55.23,66.14 59.59,66.14 59.59,72.76 55.23,72.76 54.34,72.58 53.59,72.08 53.09,71.33 52.91,70.44 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="59.46,69.45 59.46,66.14 66.21,66.14 66.21,72.82 59.46,72.82 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="66.08,66.14 70.44,66.14 71.33,66.32 72.08,66.82 72.58,67.57 72.76,68.46 72.76,70.44 72.58,71.33 72.08,72.08 71.33,72.58 70.44,72.76 66.08,72.76 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="85.98,68.46 86.16,67.57 86.66,66.82 87.41,66.32 88.3,66.14 90.28,66.14 91.17,66.32 91.92,66.82 92.42,67.57 92.6,68.46 92.6,72.82 85.98,72.82 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="99.21,68.46 99.39,67.57 99.89,66.82 100.64,66.32 101.53,66.14 103.51,66.14 104.4,66.32 105.15,66.82 105.65,67.57 105.83,68.46 105.83,72.82 99.21,72.82 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="112.44,68.46 112.62,67.57 113.12,66.82 113.87,66.32 114.76,66.14 116.74,66.14 117.63,66.32 118.38,66.82 118.88,67.57 119.06,68.46 119.06,70.44 118.88,71.33 118.38,72.08 117.63,72.58 116.74,72.76 114.76,72.76 113.87,72.58 113.12,72.08 112.62,71.33 112.44,70.44 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="125.67,68.46 125.85,67.57 126.35,66.82 127.1,66.32 127.98,66.14 129.97,66.14 130.85,66.32 131.61,66.82 132.11,67.57 132.28,68.46 132.28,72.82 125.67,72.82 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="138.9,68.46 139.07,67.57 139.58,66.82 140.33,66.32 141.21,66.14 143.2,66.14 144.08,66.32 144.83,66.82 145.34,67.57 145.51,68.46 145.51,72.82 138.9,72.82 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="13.23,72.69 19.91,72.69 19.91,79.37 15.54,79.37 14.66,79.19 13.91,78.69 13.4,77.94 13.23,77.06 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="19.78,76.06 19.78,72.69 26.52,72.69 26.52,79.37 19.78,79.37 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="26.39,76.06 26.39,72.69 33.07,72.69 33.07,79.44 26.39,79.44 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="46.3,75.07 46.48,74.18 46.98,73.43 47.73,72.93 48.61,72.76 50.6,72.76 51.48,72.93 52.24,73.43 52.74,74.18 52.91,75.07 52.91,79.44 46.3,79.44 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="59.53,72.69 66.14,72.69 66.14,77.06 65.97,77.94 65.46,78.69 64.71,79.19 63.83,79.37 61.84,79.37 60.96,79.19 60.21,78.69 59.7,77.94 59.53,77.06 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="72.76,75.07 72.93,74.18 73.43,73.43 74.18,72.93 75.07,72.76 77.06,72.76 77.94,72.93 78.69,73.43 79.19,74.18 79.37,75.07 79.37,79.44 72.76,79.44 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="85.98,72.69 92.66,72.69 92.66,79.37 88.3,79.37 87.41,79.19 86.66,78.69 86.16,77.94 85.98,77.06 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="92.53,76.06 92.53,72.76 99.28,72.76 99.28,79.44 92.53,79.44 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="99.15,76.06 99.15,72.69 105.89,72.69 105.89,79.37 99.15,79.37 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="105.76,72.76 110.13,72.76 111.01,72.93 111.76,73.43 112.26,74.18 112.44,75.07 112.44,79.44 105.76,79.44 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="125.67,76.06 125.67,72.69 132.35,72.69 132.35,79.44 125.67,79.44 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="132.22,76.06 132.22,72.76 138.96,72.76 138.96,79.37 132.22,79.37 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="138.83,76.06 138.83,72.69 145.58,72.69 145.58,79.37 138.83,79.37 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="145.45,72.76 149.81,72.76 150.7,72.93 151.45,73.43 151.95,74.18 152.13,75.07 152.13,79.44 145.45,79.44 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="26.46,79.3 33.07,79.3 33.07,83.67 32.89,84.56 32.39,85.31 31.64,85.81 30.76,85.98 28.77,85.98 27.89,85.81 27.13,85.31 26.63,84.56 26.46,83.67 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="39.69,81.69 39.86,80.8 40.36,80.05 41.11,79.55 42,79.37 46.37,79.37 46.37,85.98 42,85.98 41.11,85.81 40.36,85.31 39.86,84.56 39.69,83.67 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="46.23,82.68 46.23,79.3 52.98,79.3 52.98,85.98 46.23,85.98 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="52.85,79.37 57.21,79.37 58.1,79.55 58.85,80.05 59.35,80.8 59.53,81.69 59.53,83.67 59.35,84.56 58.85,85.31 58.1,85.81 57.21,85.98 52.85,85.98 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="66.14,81.69 66.32,80.8 66.82,80.05 67.57,79.55 68.46,79.37 72.82,79.37 72.82,85.98 68.46,85.98 67.57,85.81 66.82,85.31 66.32,84.56 66.14,83.67 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="72.69,79.3 79.37,79.3 79.37,83.67 79.19,84.56 78.69,85.31 77.94,85.81 77.06,85.98 72.69,85.98 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="92.6,82.68 92.6,79.3 99.21,79.3 99.21,86.05 92.6,86.05 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="105.83,82.68 105.83,79.3 112.51,79.3 112.51,86.05 105.83,86.05 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="112.37,79.37 116.74,79.37 117.63,79.55 118.38,80.05 118.88,80.8 119.06,81.69 119.06,83.67 118.88,84.56 118.38,85.31 117.63,85.81 116.74,85.98 112.37,85.98 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="125.67,79.3 132.28,79.3 132.28,83.67 132.11,84.56 131.61,85.31 130.85,85.81 129.97,85.98 127.98,85.98 127.1,85.81 126.35,85.31 125.85,84.56 125.67,83.67 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="145.51,82.68 145.51,79.3 152.13,79.3 152.13,86.05 145.51,86.05 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="13.23,88.3 13.4,87.41 13.91,86.66 14.66,86.16 15.54,85.98 17.53,85.98 18.41,86.16 19.16,86.66 19.67,87.41 19.84,88.3 19.84,90.28 19.67,91.17 19.16,91.92 18.41,92.42 17.53,92.6 15.54,92.6 14.66,92.42 13.91,91.92 13.4,91.17 13.23,90.28 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="33.07,88.3 33.25,87.41 33.75,86.66 34.5,86.16 35.39,85.98 37.37,85.98 38.26,86.16 39.01,86.66 39.51,87.41 39.69,88.3 39.69,92.66 33.07,92.66 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="85.98,88.3 86.16,87.41 86.66,86.66 87.41,86.16 88.3,85.98 92.66,85.98 92.66,92.6 88.3,92.6 87.41,92.42 86.66,91.92 86.16,91.17 85.98,90.28 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="92.53,89.29 92.53,85.92 99.28,85.92 99.28,92.66 92.53,92.66 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="99.15,89.29 99.15,85.98 105.89,85.98 105.89,92.6 99.15,92.6 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="105.76,85.92 112.44,85.92 112.44,90.28 112.26,91.17 111.76,91.92 111.01,92.42 110.13,92.6 105.76,92.6 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="132.28,88.3 132.46,87.41 132.96,86.66 133.71,86.16 134.6,85.98 138.96,85.98 138.96,92.6 134.6,92.6 133.71,92.42 132.96,91.92 132.46,91.17 132.28,90.28 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="138.83,89.29 138.83,85.98 145.58,85.98 145.58,92.66 138.83,92.66 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="145.45,85.92 152.13,85.92 152.13,90.28 151.95,91.17 151.45,91.92 150.7,92.42 149.81,92.6 145.45,92.6 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="19.84,94.91 20.02,94.03 20.52,93.28 21.27,92.77 22.16,92.6 24.14,92.6 25.03,92.77 25.78,93.28 26.28,94.03 26.46,94.91 26.46,96.9 26.28,97.78 25.78,98.53 25.03,99.04 24.14,99.21 22.16,99.21 21.27,99.04 20.52,98.53 20.02,97.78 19.84,96.9 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="33.07,92.53 39.75,92.53 39.75,99.21 35.39,99.21 34.5,99.04 33.75,98.53 33.25,97.78 33.07,96.9 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="39.62,92.6 43.98,92.6 44.87,92.77 45.62,93.28 46.12,94.03 46.3,94.91 46.3,96.9 46.12,97.78 45.62,98.53 44.87,99.04 43.98,99.21 39.62,99.21 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="52.91,94.91 53.09,94.03 53.59,93.28 54.34,92.77 55.23,92.6 57.21,92.6 58.1,92.77 58.85,93.28 59.35,94.03 59.53,94.91 59.53,96.9 59.35,97.78 58.85,98.53 58.1,99.04 57.21,99.21 55.23,99.21 54.34,99.04 53.59,98.53 53.09,97.78 52.91,96.9 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="66.14,94.91 66.32,94.03 66.82,93.28 67.57,92.77 68.46,92.6 72.82,92.6 72.82,99.28 66.14,99.28 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="72.69,92.6 77.06,92.6 77.94,92.77 78.69,93.28 79.19,94.03 79.37,94.91 79.37,96.9 79.19,97.78 78.69,98.53 77.94,99.04 77.06,99.21 72.69,99.21 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="92.6,95.91 92.6,92.53 99.21,92.53 99.21,99.28 92.6,99.28 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="112.44,94.91 112.62,94.03 113.12,93.28 113.87,92.77 114.76,92.6 116.74,92.6 117.63,92.77 118.38,93.28 118.88,94.03 119.06,94.91 119.06,99.28 112.44,99.28 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="138.9,92.53 145.51,92.53 145.51,96.9 145.34,97.78 144.83,98.53 144.08,99.04 143.2,99.21 141.21,99.21 140.33,99.04 139.58,98.53 139.07,97.78 138.9,96.9 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="66.14,102.52 66.14,99.15 72.76,99.15 72.76,105.89 66.14,105.89 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="79.37,101.53 79.55,100.64 80.05,99.89 80.8,99.39 81.69,99.21 83.67,99.21 84.56,99.39 85.31,99.89 85.81,100.64 85.98,101.53 85.98,103.51 85.81,104.4 85.31,105.15 84.56,105.65 83.67,105.83 81.69,105.83 80.8,105.65 80.05,105.15 79.55,104.4 79.37,103.51 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="92.6,99.15 99.21,99.15 99.21,103.51 99.04,104.4 98.53,105.15 97.78,105.65 96.9,105.83 94.91,105.83 94.03,105.65 93.28,105.15 92.77,104.4 92.6,103.51 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="112.44,99.15 119.06,99.15 119.06,103.51 118.88,104.4 118.38,105.15 117.63,105.65 116.74,105.83 114.76,105.83 113.87,105.65 113.12,105.15 112.62,104.4 112.44,103.51 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="132.28,101.53 132.46,100.64 132.96,99.89 133.71,99.39 134.6,99.21 136.58,99.21 137.47,99.39 138.22,99.89 138.72,100.64 138.9,101.53 138.9,103.51 138.72,104.4 138.22,105.15 137.47,105.65 136.58,105.83 134.6,105.83 133.71,105.65 132.96,105.15 132.46,104.4 132.28,103.51 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="66.14,105.76 72.76,105.76 72.76,110.13 72.58,111.01 72.08,111.76 71.33,112.26 70.44,112.44 68.46,112.44 67.57,112.26 66.82,111.76 66.32,111.01 66.14,110.13 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="85.98,108.14 86.16,107.26 86.66,106.5 87.41,106 88.3,105.83 90.28,105.83 91.17,106 91.92,106.5 92.42,107.26 92.6,108.14 92.6,110.13 92.42,111.01 91.92,111.76 91.17,112.26 90.28,112.44 88.3,112.44 87.41,112.26 86.66,111.76 86.16,111.01 85.98,110.13 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="99.21,108.14 99.39,107.26 99.89,106.5 100.64,106 101.53,105.83 103.51,105.83 104.4,106 105.15,106.5 105.65,107.26 105.83,108.14 105.83,110.13 105.65,111.01 105.15,111.76 104.4,112.26 103.51,112.44 101.53,112.44 100.64,112.26 99.89,111.76 99.39,111.01 99.21,110.13 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="119.06,108.14 119.23,107.26 119.73,106.5 120.48,106 121.37,105.83 125.74,105.83 125.74,112.51 119.06,112.51 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="125.6,105.83 129.97,105.83 130.85,106 131.61,106.5 132.11,107.26 132.28,108.14 132.28,110.13 132.11,111.01 131.61,111.76 130.85,112.26 129.97,112.44 125.6,112.44 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="138.9,108.14 139.07,107.26 139.58,106.5 140.33,106 141.21,105.83 145.58,105.83 145.58,112.44 141.21,112.44 140.33,112.26 139.58,111.76 139.07,111.01 138.9,110.13 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="145.45,105.83 149.81,105.83 150.7,106 151.45,106.5 151.95,107.26 152.13,108.14 152.13,112.51 145.45,112.51 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="72.76,114.76 72.93,113.87 73.43,113.12 74.18,112.62 75.07,112.44 79.44,112.44 79.44,119.12 72.76,119.12 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="79.3,112.44 83.67,112.44 84.56,112.62 85.31,113.12 85.81,113.87 85.98,114.76 85.98,119.12 79.3,119.12 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="112.44,114.76 112.62,113.87 113.12,113.12 113.87,112.62 114.76,112.44 119.12,112.44 119.12,119.06 114.76,119.06 113.87,118.88 113.12,118.38 112.62,117.63 112.44,116.74 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="118.99,115.75 118.99,112.37 125.67,112.37 125.67,119.12 118.99,119.12 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="132.28,114.76 132.46,113.87 132.96,113.12 133.71,112.62 134.6,112.44 136.58,112.44 137.47,112.62 138.22,113.12 138.72,113.87 138.9,114.76 138.9,119.12 132.28,119.12 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="145.51,112.37 152.13,112.37 152.13,116.74 151.95,117.63 151.45,118.38 150.7,118.88 149.81,119.06 147.83,119.06 146.94,118.88 146.19,118.38 145.69,117.63 145.51,116.74 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="66.14,121.37 66.32,120.48 66.82,119.73 67.57,119.23 68.46,119.06 72.82,119.06 72.82,125.74 66.14,125.74 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="72.69,122.36 72.69,118.99 79.44,118.99 79.44,125.74 72.69,125.74 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="79.3,122.36 79.3,118.99 86.05,118.99 86.05,125.67 79.3,125.67 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="85.92,119.06 90.28,119.06 91.17,119.23 91.92,119.73 92.42,120.48 92.6,121.37 92.6,125.74 85.92,125.74 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="99.21,121.37 99.39,120.48 99.89,119.73 100.64,119.23 101.53,119.06 103.51,119.06 104.4,119.23 105.15,119.73 105.65,120.48 105.83,121.37 105.83,125.74 99.21,125.74 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="119.06,118.99 125.74,118.99 125.74,125.67 121.37,125.67 120.48,125.49 119.73,124.99 119.23,124.24 119.06,123.35 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="125.6,122.36 125.6,119.06 132.35,119.06 132.35,125.74 125.6,125.74 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="132.22,122.36 132.22,118.99 138.9,118.99 138.9,125.74 132.22,125.74 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="66.14,128.98 66.14,125.6 72.82,125.6 72.82,132.35 66.14,132.35 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="72.69,128.98 72.69,125.6 79.37,125.6 79.37,132.35 72.69,132.35 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="85.98,125.6 92.66,125.6 92.66,132.28 88.3,132.28 87.41,132.11 86.66,131.61 86.16,130.85 85.98,129.97 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="92.53,128.98 92.53,125.67 99.28,125.67 99.28,132.35 92.53,132.35 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="99.15,128.98 99.15,125.6 105.89,125.6 105.89,132.28 99.15,132.28 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="105.76,128.98 105.76,125.67 112.51,125.67 112.51,132.35 105.76,132.35 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="112.37,125.67 116.74,125.67 117.63,125.85 118.38,126.35 118.88,127.1 119.06,127.98 119.06,132.35 112.37,132.35 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="125.67,128.98 125.67,125.6 132.35,125.6 132.35,132.35 125.67,132.35 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="132.22,128.98 132.22,125.6 138.9,125.6 138.9,132.35 132.22,132.35 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="66.14,135.59 66.14,132.22 72.82,132.22 72.82,138.96 66.14,138.96 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="72.69,132.22 79.37,132.22 79.37,136.58 79.19,137.47 78.69,138.22 77.94,138.72 77.06,138.9 72.69,138.9 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="92.6,135.59 92.6,132.22 99.21,132.22 99.21,138.96 92.6,138.96 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="105.83,135.59 105.83,132.22 112.51,132.22 112.51,138.96 105.83,138.96 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="112.37,135.59 112.37,132.22 119.06,132.22 119.06,138.96 112.37,138.96 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="125.67,132.22 132.35,132.22 132.35,138.9 127.98,138.9 127.1,138.72 126.35,138.22 125.85,137.47 125.67,136.58 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="132.22,135.59 132.22,132.22 138.9,132.22 138.9,138.96 132.22,138.96 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="66.14,142.2 66.14,138.83 72.76,138.83 72.76,145.58 66.14,145.58 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="79.37,141.21 79.55,140.33 80.05,139.58 80.8,139.07 81.69,138.9 86.05,138.9 86.05,145.58 79.37,145.58 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="85.92,142.2 85.92,138.9 92.66,138.9 92.66,145.51 85.92,145.51 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="92.53,142.2 92.53,138.83 99.28,138.83 99.28,145.58 92.53,145.58 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="99.15,142.2 99.15,138.9 105.89,138.9 105.89,145.51 99.15,145.51 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="105.76,142.2 105.76,138.83 112.51,138.83 112.51,145.51 105.76,145.51 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="112.37,142.2 112.37,138.83 119.12,138.83 119.12,145.58 112.37,145.58 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="118.99,138.9 123.35,138.9 124.24,139.07 124.99,139.58 125.49,140.33 125.67,141.21 125.67,143.2 125.49,144.08 124.99,144.83 124.24,145.34 123.35,145.51 118.99,145.51 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="132.28,142.2 132.28,138.83 138.96,138.83 138.96,145.58 132.28,145.58 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="138.83,138.9 143.2,138.9 144.08,139.07 144.83,139.58 145.34,140.33 145.51,141.21 145.51,143.2 145.34,144.08 144.83,144.83 144.08,145.34 143.2,145.51 138.83,145.51 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="66.14,145.45 72.82,145.45 72.82,152.13 68.46,152.13 67.57,151.95 66.82,151.45 66.32,150.7 66.14,149.81 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="72.69,148.82 72.69,145.51 79.44,145.51 79.44,152.13 72.69,152.13 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="79.3,145.45 85.98,145.45 85.98,149.81 85.81,150.7 85.31,151.45 84.56,151.95 83.67,152.13 79.3,152.13 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="92.6,145.45 99.21,145.45 99.21,149.81 99.04,150.7 98.53,151.45 97.78,151.95 96.9,152.13 94.91,152.13 94.03,151.95 93.28,151.45 92.77,150.7 92.6,149.81 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="112.44,145.45 119.06,145.45 119.06,149.81 118.88,150.7 118.38,151.45 117.63,151.95 116.74,152.13 114.76,152.13 113.87,151.95 113.12,151.45 112.62,150.7 112.44,149.81 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
        <polygon
          points="132.28,145.45 138.9,145.45 138.9,149.81 138.72,150.7 138.22,151.45 137.47,151.95 136.58,152.13 134.6,152.13 133.71,151.95 132.96,151.45 132.46,150.7 132.28,149.81 "
          style="fill:url(#gradient05b39589f89a4da0bb06028c8be76a2c);"
        />
      `,
            },
            {
                value: 5,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(255,255,255,0);"
            shape-rendering="crispEdges"
          />
          <linearGradient
            id="gradientf0e64991fd9b47eea35449bc92624707"
            gradientUnits="userSpaceOnUse"
            x1="13.2283458709717"
            y1="82.6771602630615"
            x2="152.125974655151"
            y2="82.6771602630615"
          >
            <stop offset="0%" stop-color="#BF00B2" />
            <stop offset="100%" stop-color="#C10040" />
          </linearGradient>
          <polygon
            points="13.23,29.76 13.55,26.54 14.49,23.44 16.02,20.58 18.07,18.07 20.58,16.02 23.44,14.49 26.54,13.55 29.76,13.23 59.53,13.23 59.53,59.53 13.23,59.53 13.23,29.76 19.84,29.76 19.84,52.91 52.91,52.91 52.91,19.84 29.76,19.84 27.2,20.18 24.8,21.17 22.75,22.75 21.17,24.8 20.18,27.2 19.84,29.76 "
            style="fill:url(#gradientf0e64991fd9b47eea35449bc92624707);"
          />
          <polygon
            points="13.23,122.36 13.23,105.83 59.53,105.83 59.53,152.13 29.76,152.13 26.54,151.81 23.44,150.87 20.58,149.34 18.07,147.28 16.02,144.78 14.49,141.92 13.55,138.82 13.23,135.59 13.23,122.36 19.84,122.36 19.84,135.59 20.18,138.16 21.17,140.55 22.75,142.61 24.8,144.18 27.2,145.17 29.76,145.51 52.91,145.51 52.91,112.44 19.84,112.44 19.84,122.36 "
            style="fill:url(#gradientf0e64991fd9b47eea35449bc92624707);"
          />
          <polygon
            points="105.83,29.76 105.83,13.23 135.59,13.23 138.82,13.55 141.92,14.49 144.78,16.02 147.28,18.07 149.34,20.58 150.87,23.44 151.81,26.54 152.13,29.76 152.13,59.53 105.83,59.53 105.83,29.76 112.44,29.76 112.44,52.91 145.51,52.91 145.51,29.76 145.17,27.2 144.18,24.8 142.61,22.75 140.55,21.17 138.16,20.18 135.59,19.84 112.44,19.84 112.44,29.76 "
            style="fill:url(#gradientf0e64991fd9b47eea35449bc92624707);"
          />
          <polygon
            points="46.3,36.38 46.11,38.31 45.54,40.17 44.63,41.89 43.39,43.39 41.89,44.63 40.17,45.54 38.31,46.11 36.38,46.3 34.44,46.11 32.58,45.54 30.87,44.63 29.36,43.39 28.13,41.89 27.21,40.17 26.65,38.31 26.46,36.38 26.65,34.44 27.21,32.58 28.13,30.87 29.36,29.36 30.87,28.13 32.58,27.21 34.44,26.65 36.38,26.46 38.31,26.65 40.17,27.21 41.89,28.13 43.39,29.36 44.63,30.87 45.54,32.58 46.11,34.44 46.3,36.38 "
            style="fill:rgba(12,172,172,1);"
          />
          <polygon
            points="46.3,128.98 46.11,130.91 45.54,132.77 44.63,134.49 43.39,135.99 41.89,137.23 40.17,138.14 38.31,138.71 36.38,138.9 34.44,138.71 32.58,138.14 30.87,137.23 29.36,135.99 28.13,134.49 27.21,132.77 26.65,130.91 26.46,128.98 26.65,127.04 27.21,125.18 28.13,123.46 29.36,121.96 30.87,120.73 32.58,119.81 34.44,119.25 36.38,119.06 38.31,119.25 40.17,119.81 41.89,120.73 43.39,121.96 44.63,123.46 45.54,125.18 46.11,127.04 46.3,128.98 "
            style="fill:rgba(12,172,172,1);"
          />
          <polygon
            points="138.9,36.38 138.71,38.31 138.14,40.17 137.23,41.89 135.99,43.39 134.49,44.63 132.77,45.54 130.91,46.11 128.98,46.3 127.04,46.11 125.18,45.54 123.46,44.63 121.96,43.39 120.73,41.89 119.81,40.17 119.25,38.31 119.06,36.38 119.25,34.44 119.81,32.58 120.73,30.87 121.96,29.36 123.46,28.13 125.18,27.21 127.04,26.65 128.98,26.46 130.91,26.65 132.77,27.21 134.49,28.13 135.99,29.36 137.23,30.87 138.14,32.58 138.71,34.44 138.9,36.38 "
            style="fill:rgba(12,172,172,1);"
          />
          <linearGradient
            id="gradientb004c9109356453aa8a2d004f73d3db2"
            gradientUnits="userSpaceOnUse"
            x1="10.4830545936657"
            y1="78.893629314992"
            x2="154.871269747155"
            y2="86.4606950258283"
          >
            <stop offset="0%" stop-color="#B80508" />
            <stop offset="50%" stop-color="#307585" />
            <stop offset="100%" stop-color="#B80508" />
          </linearGradient>
          <polygon
            points="16.54,72.09 15.52,71.89 14.66,71.32 14.09,70.46 13.89,69.45 14.09,68.44 14.66,67.58 15.52,67 16.54,66.8 42.99,66.8 44,67 44.86,67.58 45.44,68.44 45.64,69.45 45.44,70.46 44.86,71.32 44,71.89 42.99,72.09 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="56.22,72.09 55.21,71.89 54.35,71.32 53.78,70.46 53.57,69.45 53.78,68.44 54.35,67.58 55.21,67 56.22,66.8 69.45,66.8 70.46,67 71.32,67.58 71.89,68.44 72.09,69.45 71.89,70.46 71.32,71.32 70.46,71.89 69.45,72.09 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="102.52,72.09 101.51,71.89 100.65,71.32 100.08,70.46 99.87,69.45 100.08,68.44 100.65,67.58 101.51,67 102.52,66.8 102.52,66.8 103.53,67 104.39,67.58 104.96,68.44 105.17,69.45 104.96,70.46 104.39,71.32 103.53,71.89 102.52,72.09 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="115.75,72.09 114.74,71.89 113.88,71.32 113.3,70.46 113.1,69.45 113.3,68.44 113.88,67.58 114.74,67 115.75,66.8 115.75,66.8 116.76,67 117.62,67.58 118.19,68.44 118.39,69.45 118.19,70.46 117.62,71.32 116.76,71.89 115.75,72.09 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="128.98,72.09 127.96,71.89 127.11,71.32 126.53,70.46 126.33,69.45 126.53,68.44 127.11,67.58 127.96,67 128.98,66.8 128.98,66.8 129.99,67 130.85,67.58 131.42,68.44 131.62,69.45 131.42,70.46 130.85,71.32 129.99,71.89 128.98,72.09 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="142.2,72.09 141.19,71.89 140.33,71.32 139.76,70.46 139.56,69.45 139.76,68.44 140.33,67.58 141.19,67 142.2,66.8 142.2,66.8 143.22,67 144.08,67.58 144.65,68.44 144.85,69.45 144.65,70.46 144.08,71.32 143.22,71.89 142.2,72.09 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="16.54,78.71 15.52,78.51 14.66,77.93 14.09,77.08 13.89,76.06 14.09,75.05 14.66,74.19 15.52,73.62 16.54,73.42 29.76,73.42 30.78,73.62 31.63,74.19 32.21,75.05 32.41,76.06 32.21,77.08 31.63,77.93 30.78,78.51 29.76,78.71 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="49.61,78.71 48.59,78.51 47.74,77.93 47.16,77.08 46.96,76.06 47.16,75.05 47.74,74.19 48.59,73.62 49.61,73.42 49.61,73.42 50.62,73.62 51.48,74.19 52.05,75.05 52.25,76.06 52.05,77.08 51.48,77.93 50.62,78.51 49.61,78.71 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="62.83,78.71 61.82,78.51 60.96,77.93 60.39,77.08 60.19,76.06 60.39,75.05 60.96,74.19 61.82,73.62 62.83,73.42 62.83,73.42 63.85,73.62 64.71,74.19 65.28,75.05 65.48,76.06 65.28,77.08 64.71,77.93 63.85,78.51 62.83,78.71 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="76.06,78.71 75.05,78.51 74.19,77.93 73.62,77.08 73.42,76.06 73.62,75.05 74.19,74.19 75.05,73.62 76.06,73.42 76.06,73.42 77.08,73.62 77.93,74.19 78.51,75.05 78.71,76.06 78.51,77.08 77.93,77.93 77.08,78.51 76.06,78.71 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="89.29,78.71 88.28,78.51 87.42,77.93 86.85,77.08 86.65,76.06 86.85,75.05 87.42,74.19 88.28,73.62 89.29,73.42 109.13,73.42 110.15,73.62 111,74.19 111.58,75.05 111.78,76.06 111.58,77.08 111,77.93 110.15,78.51 109.13,78.71 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="128.98,78.71 127.96,78.51 127.11,77.93 126.53,77.08 126.33,76.06 126.53,75.05 127.11,74.19 127.96,73.62 128.98,73.42 148.82,73.42 149.83,73.62 150.69,74.19 151.26,75.05 151.46,76.06 151.26,77.08 150.69,77.93 149.83,78.51 148.82,78.71 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="29.76,85.32 28.75,85.12 27.89,84.55 27.32,83.69 27.12,82.68 27.32,81.66 27.89,80.81 28.75,80.23 29.76,80.03 29.76,80.03 30.78,80.23 31.63,80.81 32.21,81.66 32.41,82.68 32.21,83.69 31.63,84.55 30.78,85.12 29.76,85.32 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="42.99,85.32 41.98,85.12 41.12,84.55 40.55,83.69 40.35,82.68 40.55,81.66 41.12,80.81 41.98,80.23 42.99,80.03 56.22,80.03 57.23,80.23 58.09,80.81 58.66,81.66 58.87,82.68 58.66,83.69 58.09,84.55 57.23,85.12 56.22,85.32 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="69.45,85.32 68.44,85.12 67.58,84.55 67,83.69 66.8,82.68 67,81.66 67.58,80.81 68.44,80.23 69.45,80.03 76.06,80.03 77.08,80.23 77.93,80.81 78.51,81.66 78.71,82.68 78.51,83.69 77.93,84.55 77.08,85.12 76.06,85.32 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="95.91,85.32 94.89,85.12 94.03,84.55 93.46,83.69 93.26,82.68 93.46,81.66 94.03,80.81 94.89,80.23 95.91,80.03 95.91,80.03 96.92,80.23 97.78,80.81 98.35,81.66 98.55,82.68 98.35,83.69 97.78,84.55 96.92,85.12 95.91,85.32 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="109.13,85.32 108.12,85.12 107.26,84.55 106.69,83.69 106.49,82.68 106.69,81.66 107.26,80.81 108.12,80.23 109.13,80.03 115.75,80.03 116.76,80.23 117.62,80.81 118.19,81.66 118.39,82.68 118.19,83.69 117.62,84.55 116.76,85.12 115.75,85.32 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="128.98,85.32 127.96,85.12 127.11,84.55 126.53,83.69 126.33,82.68 126.53,81.66 127.11,80.81 127.96,80.23 128.98,80.03 128.98,80.03 129.99,80.23 130.85,80.81 131.42,81.66 131.62,82.68 131.42,83.69 130.85,84.55 129.99,85.12 128.98,85.32 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="148.82,85.32 147.81,85.12 146.95,84.55 146.37,83.69 146.17,82.68 146.37,81.66 146.95,80.81 147.81,80.23 148.82,80.03 148.82,80.03 149.83,80.23 150.69,80.81 151.26,81.66 151.46,82.68 151.26,83.69 150.69,84.55 149.83,85.12 148.82,85.32 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="16.54,91.94 15.52,91.74 14.66,91.16 14.09,90.3 13.89,89.29 14.09,88.28 14.66,87.42 15.52,86.85 16.54,86.65 16.54,86.65 17.55,86.85 18.41,87.42 18.98,88.28 19.18,89.29 18.98,90.3 18.41,91.16 17.55,91.74 16.54,91.94 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="36.38,91.94 35.37,91.74 34.51,91.16 33.93,90.3 33.73,89.29 33.93,88.28 34.51,87.42 35.37,86.85 36.38,86.65 36.38,86.65 37.39,86.85 38.25,87.42 38.82,88.28 39.02,89.29 38.82,90.3 38.25,91.16 37.39,91.74 36.38,91.94 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="89.29,91.94 88.28,91.74 87.42,91.16 86.85,90.3 86.65,89.29 86.85,88.28 87.42,87.42 88.28,86.85 89.29,86.65 109.13,86.65 110.15,86.85 111,87.42 111.58,88.28 111.78,89.29 111.58,90.3 111,91.16 110.15,91.74 109.13,91.94 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="135.59,91.94 134.58,91.74 133.72,91.16 133.15,90.3 132.94,89.29 133.15,88.28 133.72,87.42 134.58,86.85 135.59,86.65 148.82,86.65 149.83,86.85 150.69,87.42 151.26,88.28 151.46,89.29 151.26,90.3 150.69,91.16 149.83,91.74 148.82,91.94 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="23.15,98.55 22.14,98.35 21.28,97.78 20.71,96.92 20.5,95.91 20.71,94.89 21.28,94.03 22.14,93.46 23.15,93.26 23.15,93.26 24.16,93.46 25.02,94.03 25.59,94.89 25.8,95.91 25.59,96.92 25.02,97.78 24.16,98.35 23.15,98.55 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="36.38,98.55 35.37,98.35 34.51,97.78 33.93,96.92 33.73,95.91 33.93,94.89 34.51,94.03 35.37,93.46 36.38,93.26 42.99,93.26 44,93.46 44.86,94.03 45.44,94.89 45.64,95.91 45.44,96.92 44.86,97.78 44,98.35 42.99,98.55 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="56.22,98.55 55.21,98.35 54.35,97.78 53.78,96.92 53.57,95.91 53.78,94.89 54.35,94.03 55.21,93.46 56.22,93.26 56.22,93.26 57.23,93.46 58.09,94.03 58.66,94.89 58.87,95.91 58.66,96.92 58.09,97.78 57.23,98.35 56.22,98.55 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="69.45,98.55 68.44,98.35 67.58,97.78 67,96.92 66.8,95.91 67,94.89 67.58,94.03 68.44,93.46 69.45,93.26 69.45,93.26 70.46,93.46 71.32,94.03 71.89,94.89 72.09,95.91 71.89,96.92 71.32,97.78 70.46,98.35 69.45,98.55 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="95.91,98.55 94.89,98.35 94.03,97.78 93.46,96.92 93.26,95.91 93.46,94.89 94.03,94.03 94.89,93.46 95.91,93.26 95.91,93.26 96.92,93.46 97.78,94.03 98.35,94.89 98.55,95.91 98.35,96.92 97.78,97.78 96.92,98.35 95.91,98.55 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="115.75,98.55 114.74,98.35 113.88,97.78 113.3,96.92 113.1,95.91 113.3,94.89 113.88,94.03 114.74,93.46 115.75,93.26 115.75,93.26 116.76,93.46 117.62,94.03 118.19,94.89 118.39,95.91 118.19,96.92 117.62,97.78 116.76,98.35 115.75,98.55 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="142.2,98.55 141.19,98.35 140.33,97.78 139.76,96.92 139.56,95.91 139.76,94.89 140.33,94.03 141.19,93.46 142.2,93.26 142.2,93.26 143.22,93.46 144.08,94.03 144.65,94.89 144.85,95.91 144.65,96.92 144.08,97.78 143.22,98.35 142.2,98.55 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="115.75,105.17 114.74,104.96 113.88,104.39 113.3,103.53 113.1,102.52 113.3,101.51 113.88,100.65 114.74,100.08 115.75,99.87 115.75,99.87 116.76,100.08 117.62,100.65 118.19,101.51 118.39,102.52 118.19,103.53 117.62,104.39 116.76,104.96 115.75,105.17 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="135.59,105.17 134.58,104.96 133.72,104.39 133.15,103.53 132.94,102.52 133.15,101.51 133.72,100.65 134.58,100.08 135.59,99.87 135.59,99.87 136.6,100.08 137.46,100.65 138.03,101.51 138.24,102.52 138.03,103.53 137.46,104.39 136.6,104.96 135.59,105.17 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="122.36,111.78 121.35,111.58 120.49,111 119.92,110.15 119.72,109.13 119.92,108.12 120.49,107.26 121.35,106.69 122.36,106.49 128.98,106.49 129.99,106.69 130.85,107.26 131.42,108.12 131.62,109.13 131.42,110.15 130.85,111 129.99,111.58 128.98,111.78 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="142.2,111.78 141.19,111.58 140.33,111 139.76,110.15 139.56,109.13 139.76,108.12 140.33,107.26 141.19,106.69 142.2,106.49 148.82,106.49 149.83,106.69 150.69,107.26 151.26,108.12 151.46,109.13 151.26,110.15 150.69,111 149.83,111.58 148.82,111.78 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="115.75,118.39 114.74,118.19 113.88,117.62 113.3,116.76 113.1,115.75 113.3,114.74 113.88,113.88 114.74,113.3 115.75,113.1 122.36,113.1 123.37,113.3 124.23,113.88 124.81,114.74 125.01,115.75 124.81,116.76 124.23,117.62 123.37,118.19 122.36,118.39 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="135.59,118.39 134.58,118.19 133.72,117.62 133.15,116.76 132.94,115.75 133.15,114.74 133.72,113.88 134.58,113.3 135.59,113.1 135.59,113.1 136.6,113.3 137.46,113.88 138.03,114.74 138.24,115.75 138.03,116.76 137.46,117.62 136.6,118.19 135.59,118.39 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="148.82,118.39 147.81,118.19 146.95,117.62 146.37,116.76 146.17,115.75 146.37,114.74 146.95,113.88 147.81,113.3 148.82,113.1 148.82,113.1 149.83,113.3 150.69,113.88 151.26,114.74 151.46,115.75 151.26,116.76 150.69,117.62 149.83,118.19 148.82,118.39 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="122.36,125.01 121.35,124.81 120.49,124.23 119.92,123.37 119.72,122.36 119.92,121.35 120.49,120.49 121.35,119.92 122.36,119.72 135.59,119.72 136.6,119.92 137.46,120.49 138.03,121.35 138.24,122.36 138.03,123.37 137.46,124.23 136.6,124.81 135.59,125.01 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="128.98,131.62 127.96,131.42 127.11,130.85 126.53,129.99 126.33,128.98 126.53,127.96 127.11,127.11 127.96,126.53 128.98,126.33 135.59,126.33 136.6,126.53 137.46,127.11 138.03,127.96 138.24,128.98 138.03,129.99 137.46,130.85 136.6,131.42 135.59,131.62 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="135.59,138.24 134.58,138.03 133.72,137.46 133.15,136.6 132.94,135.59 133.15,134.58 133.72,133.72 134.58,133.15 135.59,132.94 135.59,132.94 136.6,133.15 137.46,133.72 138.03,134.58 138.24,135.59 138.03,136.6 137.46,137.46 136.6,138.03 135.59,138.24 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="142.2,144.85 141.19,144.65 140.33,144.08 139.76,143.22 139.56,142.2 139.76,141.19 140.33,140.33 141.19,139.76 142.2,139.56 142.2,139.56 143.22,139.76 144.08,140.33 144.65,141.19 144.85,142.2 144.65,143.22 144.08,144.08 143.22,144.65 142.2,144.85 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="66.8,23.15 67,22.14 67.58,21.28 68.44,20.71 69.45,20.5 70.46,20.71 71.32,21.28 71.89,22.14 72.09,23.15 72.09,23.15 71.89,24.16 71.32,25.02 70.46,25.59 69.45,25.8 68.44,25.59 67.58,25.02 67,24.16 66.8,23.15 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="66.8,36.38 67,35.37 67.58,34.51 68.44,33.93 69.45,33.73 70.46,33.93 71.32,34.51 71.89,35.37 72.09,36.38 72.09,36.38 71.89,37.39 71.32,38.25 70.46,38.82 69.45,39.02 68.44,38.82 67.58,38.25 67,37.39 66.8,36.38 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="66.8,49.61 67,48.59 67.58,47.74 68.44,47.16 69.45,46.96 70.46,47.16 71.32,47.74 71.89,48.59 72.09,49.61 72.09,56.22 71.89,57.23 71.32,58.09 70.46,58.66 69.45,58.87 68.44,58.66 67.58,58.09 67,57.23 66.8,56.22 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="66.8,95.91 67,94.89 67.58,94.03 68.44,93.46 69.45,93.26 70.46,93.46 71.32,94.03 71.89,94.89 72.09,95.91 72.09,109.13 71.89,110.15 71.32,111 70.46,111.58 69.45,111.78 68.44,111.58 67.58,111 67,110.15 66.8,109.13 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="66.8,122.36 67,121.35 67.58,120.49 68.44,119.92 69.45,119.72 70.46,119.92 71.32,120.49 71.89,121.35 72.09,122.36 72.09,148.82 71.89,149.83 71.32,150.69 70.46,151.26 69.45,151.46 68.44,151.26 67.58,150.69 67,149.83 66.8,148.82 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="73.42,23.15 73.62,22.14 74.19,21.28 75.05,20.71 76.06,20.5 77.08,20.71 77.93,21.28 78.51,22.14 78.71,23.15 78.71,23.15 78.51,24.16 77.93,25.02 77.08,25.59 76.06,25.8 75.05,25.59 74.19,25.02 73.62,24.16 73.42,23.15 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="73.42,36.38 73.62,35.37 74.19,34.51 75.05,33.93 76.06,33.73 77.08,33.93 77.93,34.51 78.51,35.37 78.71,36.38 78.71,42.99 78.51,44 77.93,44.86 77.08,45.44 76.06,45.64 75.05,45.44 74.19,44.86 73.62,44 73.42,42.99 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="73.42,62.83 73.62,61.82 74.19,60.96 75.05,60.39 76.06,60.19 77.08,60.39 77.93,60.96 78.51,61.82 78.71,62.83 78.71,62.83 78.51,63.85 77.93,64.71 77.08,65.28 76.06,65.48 75.05,65.28 74.19,64.71 73.62,63.85 73.42,62.83 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="73.42,95.91 73.62,94.89 74.19,94.03 75.05,93.46 76.06,93.26 77.08,93.46 77.93,94.03 78.51,94.89 78.71,95.91 78.71,95.91 78.51,96.92 77.93,97.78 77.08,98.35 76.06,98.55 75.05,98.35 74.19,97.78 73.62,96.92 73.42,95.91 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="73.42,115.75 73.62,114.74 74.19,113.88 75.05,113.3 76.06,113.1 77.08,113.3 77.93,113.88 78.51,114.74 78.71,115.75 78.71,135.59 78.51,136.6 77.93,137.46 77.08,138.03 76.06,138.24 75.05,138.03 74.19,137.46 73.62,136.6 73.42,135.59 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="73.42,148.82 73.62,147.81 74.19,146.95 75.05,146.37 76.06,146.17 77.08,146.37 77.93,146.95 78.51,147.81 78.71,148.82 78.71,148.82 78.51,149.83 77.93,150.69 77.08,151.26 76.06,151.46 75.05,151.26 74.19,150.69 73.62,149.83 73.42,148.82 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="80.03,16.54 80.23,15.52 80.81,14.66 81.66,14.09 82.68,13.89 83.69,14.09 84.55,14.66 85.12,15.52 85.32,16.54 85.32,29.76 85.12,30.78 84.55,31.63 83.69,32.21 82.68,32.41 81.66,32.21 80.81,31.63 80.23,30.78 80.03,29.76 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="80.03,56.22 80.23,55.21 80.81,54.35 81.66,53.78 82.68,53.57 83.69,53.78 84.55,54.35 85.12,55.21 85.32,56.22 85.32,56.22 85.12,57.23 84.55,58.09 83.69,58.66 82.68,58.87 81.66,58.66 80.81,58.09 80.23,57.23 80.03,56.22 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="80.03,102.52 80.23,101.51 80.81,100.65 81.66,100.08 82.68,99.87 83.69,100.08 84.55,100.65 85.12,101.51 85.32,102.52 85.32,102.52 85.12,103.53 84.55,104.39 83.69,104.96 82.68,105.17 81.66,104.96 80.81,104.39 80.23,103.53 80.03,102.52 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="80.03,115.75 80.23,114.74 80.81,113.88 81.66,113.3 82.68,113.1 83.69,113.3 84.55,113.88 85.12,114.74 85.32,115.75 85.32,122.36 85.12,123.37 84.55,124.23 83.69,124.81 82.68,125.01 81.66,124.81 80.81,124.23 80.23,123.37 80.03,122.36 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="80.03,142.2 80.23,141.19 80.81,140.33 81.66,139.76 82.68,139.56 83.69,139.76 84.55,140.33 85.12,141.19 85.32,142.2 85.32,148.82 85.12,149.83 84.55,150.69 83.69,151.26 82.68,151.46 81.66,151.26 80.81,150.69 80.23,149.83 80.03,148.82 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="86.65,16.54 86.85,15.52 87.42,14.66 88.28,14.09 89.29,13.89 90.3,14.09 91.16,14.66 91.74,15.52 91.94,16.54 91.94,16.54 91.74,17.55 91.16,18.41 90.3,18.98 89.29,19.18 88.28,18.98 87.42,18.41 86.85,17.55 86.65,16.54 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="86.65,29.76 86.85,28.75 87.42,27.89 88.28,27.32 89.29,27.12 90.3,27.32 91.16,27.89 91.74,28.75 91.94,29.76 91.94,29.76 91.74,30.78 91.16,31.63 90.3,32.21 89.29,32.41 88.28,32.21 87.42,31.63 86.85,30.78 86.65,29.76 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="86.65,49.61 86.85,48.59 87.42,47.74 88.28,47.16 89.29,46.96 90.3,47.16 91.16,47.74 91.74,48.59 91.94,49.61 91.94,49.61 91.74,50.62 91.16,51.48 90.3,52.05 89.29,52.25 88.28,52.05 87.42,51.48 86.85,50.62 86.65,49.61 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="86.65,69.45 86.85,68.44 87.42,67.58 88.28,67 89.29,66.8 90.3,67 91.16,67.58 91.74,68.44 91.94,69.45 91.94,69.45 91.74,70.46 91.16,71.32 90.3,71.89 89.29,72.09 88.28,71.89 87.42,71.32 86.85,70.46 86.65,69.45 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="86.65,89.29 86.85,88.28 87.42,87.42 88.28,86.85 89.29,86.65 90.3,86.85 91.16,87.42 91.74,88.28 91.94,89.29 91.94,89.29 91.74,90.3 91.16,91.16 90.3,91.74 89.29,91.94 88.28,91.74 87.42,91.16 86.85,90.3 86.65,89.29 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="86.65,109.13 86.85,108.12 87.42,107.26 88.28,106.69 89.29,106.49 90.3,106.69 91.16,107.26 91.74,108.12 91.94,109.13 91.94,109.13 91.74,110.15 91.16,111 90.3,111.58 89.29,111.78 88.28,111.58 87.42,111 86.85,110.15 86.65,109.13 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="86.65,122.36 86.85,121.35 87.42,120.49 88.28,119.92 89.29,119.72 90.3,119.92 91.16,120.49 91.74,121.35 91.94,122.36 91.94,128.98 91.74,129.99 91.16,130.85 90.3,131.42 89.29,131.62 88.28,131.42 87.42,130.85 86.85,129.99 86.65,128.98 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="86.65,142.2 86.85,141.19 87.42,140.33 88.28,139.76 89.29,139.56 90.3,139.76 91.16,140.33 91.74,141.19 91.94,142.2 91.94,142.2 91.74,143.22 91.16,144.08 90.3,144.65 89.29,144.85 88.28,144.65 87.42,144.08 86.85,143.22 86.65,142.2 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="93.26,16.54 93.46,15.52 94.03,14.66 94.89,14.09 95.91,13.89 96.92,14.09 97.78,14.66 98.35,15.52 98.55,16.54 98.55,42.99 98.35,44 97.78,44.86 96.92,45.44 95.91,45.64 94.89,45.44 94.03,44.86 93.46,44 93.26,42.99 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="93.26,56.22 93.46,55.21 94.03,54.35 94.89,53.78 95.91,53.57 96.92,53.78 97.78,54.35 98.35,55.21 98.55,56.22 98.55,56.22 98.35,57.23 97.78,58.09 96.92,58.66 95.91,58.87 94.89,58.66 94.03,58.09 93.46,57.23 93.26,56.22 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="93.26,95.91 93.46,94.89 94.03,94.03 94.89,93.46 95.91,93.26 96.92,93.46 97.78,94.03 98.35,94.89 98.55,95.91 98.55,102.52 98.35,103.53 97.78,104.39 96.92,104.96 95.91,105.17 94.89,104.96 94.03,104.39 93.46,103.53 93.26,102.52 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="93.26,128.98 93.46,127.96 94.03,127.11 94.89,126.53 95.91,126.33 96.92,126.53 97.78,127.11 98.35,127.96 98.55,128.98 98.55,148.82 98.35,149.83 97.78,150.69 96.92,151.26 95.91,151.46 94.89,151.26 94.03,150.69 93.46,149.83 93.26,148.82 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="99.87,109.13 100.08,108.12 100.65,107.26 101.51,106.69 102.52,106.49 103.53,106.69 104.39,107.26 104.96,108.12 105.17,109.13 105.17,109.13 104.96,110.15 104.39,111 103.53,111.58 102.52,111.78 101.51,111.58 100.65,111 100.08,110.15 99.87,109.13 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="99.87,122.36 100.08,121.35 100.65,120.49 101.51,119.92 102.52,119.72 103.53,119.92 104.39,120.49 104.96,121.35 105.17,122.36 105.17,128.98 104.96,129.99 104.39,130.85 103.53,131.42 102.52,131.62 101.51,131.42 100.65,130.85 100.08,129.99 99.87,128.98 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="99.87,142.2 100.08,141.19 100.65,140.33 101.51,139.76 102.52,139.56 103.53,139.76 104.39,140.33 104.96,141.19 105.17,142.2 105.17,142.2 104.96,143.22 104.39,144.08 103.53,144.65 102.52,144.85 101.51,144.65 100.65,144.08 100.08,143.22 99.87,142.2 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="106.49,128.98 106.69,127.96 107.26,127.11 108.12,126.53 109.13,126.33 110.15,126.53 111,127.11 111.58,127.96 111.78,128.98 111.78,142.2 111.58,143.22 111,144.08 110.15,144.65 109.13,144.85 108.12,144.65 107.26,144.08 106.69,143.22 106.49,142.2 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="113.1,115.75 113.3,114.74 113.88,113.88 114.74,113.3 115.75,113.1 116.76,113.3 117.62,113.88 118.19,114.74 118.39,115.75 118.39,115.75 118.19,116.76 117.62,117.62 116.76,118.19 115.75,118.39 114.74,118.19 113.88,117.62 113.3,116.76 113.1,115.75 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="113.1,128.98 113.3,127.96 113.88,127.11 114.74,126.53 115.75,126.33 116.76,126.53 117.62,127.11 118.19,127.96 118.39,128.98 118.39,148.82 118.19,149.83 117.62,150.69 116.76,151.26 115.75,151.46 114.74,151.26 113.88,150.69 113.3,149.83 113.1,148.82 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="119.72,122.36 119.92,121.35 120.49,120.49 121.35,119.92 122.36,119.72 123.37,119.92 124.23,120.49 124.81,121.35 125.01,122.36 125.01,122.36 124.81,123.37 124.23,124.23 123.37,124.81 122.36,125.01 121.35,124.81 120.49,124.23 119.92,123.37 119.72,122.36 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="119.72,142.2 119.92,141.19 120.49,140.33 121.35,139.76 122.36,139.56 123.37,139.76 124.23,140.33 124.81,141.19 125.01,142.2 125.01,142.2 124.81,143.22 124.23,144.08 123.37,144.65 122.36,144.85 121.35,144.65 120.49,144.08 119.92,143.22 119.72,142.2 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="126.33,128.98 126.53,127.96 127.11,127.11 127.96,126.53 128.98,126.33 129.99,126.53 130.85,127.11 131.42,127.96 131.62,128.98 131.62,135.59 131.42,136.6 130.85,137.46 129.99,138.03 128.98,138.24 127.96,138.03 127.11,137.46 126.53,136.6 126.33,135.59 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="132.94,135.59 133.15,134.58 133.72,133.72 134.58,133.15 135.59,132.94 136.6,133.15 137.46,133.72 138.03,134.58 138.24,135.59 138.24,148.82 138.03,149.83 137.46,150.69 136.6,151.26 135.59,151.46 134.58,151.26 133.72,150.69 133.15,149.83 132.94,148.82 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
          <polygon
            points="139.56,142.2 139.76,141.19 140.33,140.33 141.19,139.76 142.2,139.56 143.22,139.76 144.08,140.33 144.65,141.19 144.85,142.2 144.85,142.2 144.65,143.22 144.08,144.08 143.22,144.65 142.2,144.85 141.19,144.65 140.33,144.08 139.76,143.22 139.56,142.2 "
            style="fill:url(#gradientb004c9109356453aa8a2d004f73d3db2);"
          />
      `,
            },
            {
                value: 6,
                innerHtml: `
      <rect
          x="0"
          y="0"
          width="165.3543"
          height="165.3543"
          fill="red"
          style="fill:rgba(255,255,255,0);"
          shape-rendering="crispEdges"
        />
        <linearGradient
          id="gradient0a63a848c18243f2af2c33edde29962a"
          gradientUnits="userSpaceOnUse"
          x1="4.19744738555816"
          y1="70.2471948621279"
          x2="161.156873140565"
          y2="95.1071256639952"
        >
          <stop offset="0%" stop-color="#B301A6" />
          <stop offset="80%" stop-color="#31351C" />
          <stop offset="100%" stop-color="#B301A6" />
        </linearGradient>
        <polygon
          points="19.84,16.54 19.59,17.8 18.87,18.87 17.8,19.59 16.54,19.84 15.27,19.59 14.2,18.87 13.48,17.8 13.23,16.54 13.48,15.27 14.2,14.2 15.27,13.48 16.54,13.23 17.8,13.48 18.87,14.2 19.59,15.27 19.84,16.54 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="19.84,56.22 19.59,57.49 18.87,58.56 17.8,59.28 16.54,59.53 15.27,59.28 14.2,58.56 13.48,57.49 13.23,56.22 13.48,54.95 14.2,53.88 15.27,53.17 16.54,52.91 17.8,53.17 18.87,53.88 19.59,54.95 19.84,56.22 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="26.46,16.54 26.2,17.8 25.49,18.87 24.42,19.59 23.15,19.84 21.88,19.59 20.81,18.87 20.09,17.8 19.84,16.54 20.09,15.27 20.81,14.2 21.88,13.48 23.15,13.23 24.42,13.48 25.49,14.2 26.2,15.27 26.46,16.54 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="26.46,56.22 26.2,57.49 25.49,58.56 24.42,59.28 23.15,59.53 21.88,59.28 20.81,58.56 20.09,57.49 19.84,56.22 20.09,54.95 20.81,53.88 21.88,53.17 23.15,52.91 24.42,53.17 25.49,53.88 26.2,54.95 26.46,56.22 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="33.07,16.54 32.82,17.8 32.1,18.87 31.03,19.59 29.76,19.84 28.5,19.59 27.43,18.87 26.71,17.8 26.46,16.54 26.71,15.27 27.43,14.2 28.5,13.48 29.76,13.23 31.03,13.48 32.1,14.2 32.82,15.27 33.07,16.54 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="33.07,56.22 32.82,57.49 32.1,58.56 31.03,59.28 29.76,59.53 28.5,59.28 27.43,58.56 26.71,57.49 26.46,56.22 26.71,54.95 27.43,53.88 28.5,53.17 29.76,52.91 31.03,53.17 32.1,53.88 32.82,54.95 33.07,56.22 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="39.69,16.54 39.43,17.8 38.72,18.87 37.64,19.59 36.38,19.84 35.11,19.59 34.04,18.87 33.32,17.8 33.07,16.54 33.32,15.27 34.04,14.2 35.11,13.48 36.38,13.23 37.64,13.48 38.72,14.2 39.43,15.27 39.69,16.54 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="39.69,56.22 39.43,57.49 38.72,58.56 37.64,59.28 36.38,59.53 35.11,59.28 34.04,58.56 33.32,57.49 33.07,56.22 33.32,54.95 34.04,53.88 35.11,53.17 36.38,52.91 37.64,53.17 38.72,53.88 39.43,54.95 39.69,56.22 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="46.3,16.54 46.05,17.8 45.33,18.87 44.26,19.59 42.99,19.84 41.73,19.59 40.65,18.87 39.94,17.8 39.69,16.54 39.94,15.27 40.65,14.2 41.73,13.48 42.99,13.23 44.26,13.48 45.33,14.2 46.05,15.27 46.3,16.54 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="46.3,56.22 46.05,57.49 45.33,58.56 44.26,59.28 42.99,59.53 41.73,59.28 40.65,58.56 39.94,57.49 39.69,56.22 39.94,54.95 40.65,53.88 41.73,53.17 42.99,52.91 44.26,53.17 45.33,53.88 46.05,54.95 46.3,56.22 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="52.91,16.54 52.66,17.8 51.94,18.87 50.87,19.59 49.61,19.84 48.34,19.59 47.27,18.87 46.55,17.8 46.3,16.54 46.55,15.27 47.27,14.2 48.34,13.48 49.61,13.23 50.87,13.48 51.94,14.2 52.66,15.27 52.91,16.54 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="52.91,56.22 52.66,57.49 51.94,58.56 50.87,59.28 49.61,59.53 48.34,59.28 47.27,58.56 46.55,57.49 46.3,56.22 46.55,54.95 47.27,53.88 48.34,53.17 49.61,52.91 50.87,53.17 51.94,53.88 52.66,54.95 52.91,56.22 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="59.53,16.54 59.28,17.8 58.56,18.87 57.49,19.59 56.22,19.84 54.95,19.59 53.88,18.87 53.17,17.8 52.91,16.54 53.17,15.27 53.88,14.2 54.95,13.48 56.22,13.23 57.49,13.48 58.56,14.2 59.28,15.27 59.53,16.54 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="59.53,56.22 59.28,57.49 58.56,58.56 57.49,59.28 56.22,59.53 54.95,59.28 53.88,58.56 53.17,57.49 52.91,56.22 53.17,54.95 53.88,53.88 54.95,53.17 56.22,52.91 57.49,53.17 58.56,53.88 59.28,54.95 59.53,56.22 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="19.84,23.15 19.59,24.42 18.87,25.49 17.8,26.2 16.54,26.46 15.27,26.2 14.2,25.49 13.48,24.42 13.23,23.15 13.48,21.88 14.2,20.81 15.27,20.09 16.54,19.84 17.8,20.09 18.87,20.81 19.59,21.88 19.84,23.15 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="59.53,23.15 59.28,24.42 58.56,25.49 57.49,26.2 56.22,26.46 54.95,26.2 53.88,25.49 53.17,24.42 52.91,23.15 53.17,21.88 53.88,20.81 54.95,20.09 56.22,19.84 57.49,20.09 58.56,20.81 59.28,21.88 59.53,23.15 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="19.84,29.76 19.59,31.03 18.87,32.1 17.8,32.82 16.54,33.07 15.27,32.82 14.2,32.1 13.48,31.03 13.23,29.76 13.48,28.5 14.2,27.43 15.27,26.71 16.54,26.46 17.8,26.71 18.87,27.43 19.59,28.5 19.84,29.76 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="59.53,29.76 59.28,31.03 58.56,32.1 57.49,32.82 56.22,33.07 54.95,32.82 53.88,32.1 53.17,31.03 52.91,29.76 53.17,28.5 53.88,27.43 54.95,26.71 56.22,26.46 57.49,26.71 58.56,27.43 59.28,28.5 59.53,29.76 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="19.84,36.38 19.59,37.64 18.87,38.72 17.8,39.43 16.54,39.69 15.27,39.43 14.2,38.72 13.48,37.64 13.23,36.38 13.48,35.11 14.2,34.04 15.27,33.32 16.54,33.07 17.8,33.32 18.87,34.04 19.59,35.11 19.84,36.38 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="59.53,36.38 59.28,37.64 58.56,38.72 57.49,39.43 56.22,39.69 54.95,39.43 53.88,38.72 53.17,37.64 52.91,36.38 53.17,35.11 53.88,34.04 54.95,33.32 56.22,33.07 57.49,33.32 58.56,34.04 59.28,35.11 59.53,36.38 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="19.84,42.99 19.59,44.26 18.87,45.33 17.8,46.05 16.54,46.3 15.27,46.05 14.2,45.33 13.48,44.26 13.23,42.99 13.48,41.73 14.2,40.65 15.27,39.94 16.54,39.69 17.8,39.94 18.87,40.65 19.59,41.73 19.84,42.99 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="59.53,42.99 59.28,44.26 58.56,45.33 57.49,46.05 56.22,46.3 54.95,46.05 53.88,45.33 53.17,44.26 52.91,42.99 53.17,41.73 53.88,40.65 54.95,39.94 56.22,39.69 57.49,39.94 58.56,40.65 59.28,41.73 59.53,42.99 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="19.84,49.61 19.59,50.87 18.87,51.94 17.8,52.66 16.54,52.91 15.27,52.66 14.2,51.94 13.48,50.87 13.23,49.61 13.48,48.34 14.2,47.27 15.27,46.55 16.54,46.3 17.8,46.55 18.87,47.27 19.59,48.34 19.84,49.61 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="59.53,49.61 59.28,50.87 58.56,51.94 57.49,52.66 56.22,52.91 54.95,52.66 53.88,51.94 53.17,50.87 52.91,49.61 53.17,48.34 53.88,47.27 54.95,46.55 56.22,46.3 57.49,46.55 58.56,47.27 59.28,48.34 59.53,49.61 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="19.84,109.13 19.59,110.4 18.87,111.47 17.8,112.19 16.54,112.44 15.27,112.19 14.2,111.47 13.48,110.4 13.23,109.13 13.48,107.87 14.2,106.8 15.27,106.08 16.54,105.83 17.8,106.08 18.87,106.8 19.59,107.87 19.84,109.13 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="19.84,148.82 19.59,150.08 18.87,151.16 17.8,151.87 16.54,152.13 15.27,151.87 14.2,151.16 13.48,150.08 13.23,148.82 13.48,147.55 14.2,146.48 15.27,145.76 16.54,145.51 17.8,145.76 18.87,146.48 19.59,147.55 19.84,148.82 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="26.46,109.13 26.2,110.4 25.49,111.47 24.42,112.19 23.15,112.44 21.88,112.19 20.81,111.47 20.09,110.4 19.84,109.13 20.09,107.87 20.81,106.8 21.88,106.08 23.15,105.83 24.42,106.08 25.49,106.8 26.2,107.87 26.46,109.13 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="26.46,148.82 26.2,150.08 25.49,151.16 24.42,151.87 23.15,152.13 21.88,151.87 20.81,151.16 20.09,150.08 19.84,148.82 20.09,147.55 20.81,146.48 21.88,145.76 23.15,145.51 24.42,145.76 25.49,146.48 26.2,147.55 26.46,148.82 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="33.07,109.13 32.82,110.4 32.1,111.47 31.03,112.19 29.76,112.44 28.5,112.19 27.43,111.47 26.71,110.4 26.46,109.13 26.71,107.87 27.43,106.8 28.5,106.08 29.76,105.83 31.03,106.08 32.1,106.8 32.82,107.87 33.07,109.13 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="33.07,148.82 32.82,150.08 32.1,151.16 31.03,151.87 29.76,152.13 28.5,151.87 27.43,151.16 26.71,150.08 26.46,148.82 26.71,147.55 27.43,146.48 28.5,145.76 29.76,145.51 31.03,145.76 32.1,146.48 32.82,147.55 33.07,148.82 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="39.69,109.13 39.43,110.4 38.72,111.47 37.64,112.19 36.38,112.44 35.11,112.19 34.04,111.47 33.32,110.4 33.07,109.13 33.32,107.87 34.04,106.8 35.11,106.08 36.38,105.83 37.64,106.08 38.72,106.8 39.43,107.87 39.69,109.13 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="39.69,148.82 39.43,150.08 38.72,151.16 37.64,151.87 36.38,152.13 35.11,151.87 34.04,151.16 33.32,150.08 33.07,148.82 33.32,147.55 34.04,146.48 35.11,145.76 36.38,145.51 37.64,145.76 38.72,146.48 39.43,147.55 39.69,148.82 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="46.3,109.13 46.05,110.4 45.33,111.47 44.26,112.19 42.99,112.44 41.73,112.19 40.65,111.47 39.94,110.4 39.69,109.13 39.94,107.87 40.65,106.8 41.73,106.08 42.99,105.83 44.26,106.08 45.33,106.8 46.05,107.87 46.3,109.13 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="46.3,148.82 46.05,150.08 45.33,151.16 44.26,151.87 42.99,152.13 41.73,151.87 40.65,151.16 39.94,150.08 39.69,148.82 39.94,147.55 40.65,146.48 41.73,145.76 42.99,145.51 44.26,145.76 45.33,146.48 46.05,147.55 46.3,148.82 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="52.91,109.13 52.66,110.4 51.94,111.47 50.87,112.19 49.61,112.44 48.34,112.19 47.27,111.47 46.55,110.4 46.3,109.13 46.55,107.87 47.27,106.8 48.34,106.08 49.61,105.83 50.87,106.08 51.94,106.8 52.66,107.87 52.91,109.13 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="52.91,148.82 52.66,150.08 51.94,151.16 50.87,151.87 49.61,152.13 48.34,151.87 47.27,151.16 46.55,150.08 46.3,148.82 46.55,147.55 47.27,146.48 48.34,145.76 49.61,145.51 50.87,145.76 51.94,146.48 52.66,147.55 52.91,148.82 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="59.53,109.13 59.28,110.4 58.56,111.47 57.49,112.19 56.22,112.44 54.95,112.19 53.88,111.47 53.17,110.4 52.91,109.13 53.17,107.87 53.88,106.8 54.95,106.08 56.22,105.83 57.49,106.08 58.56,106.8 59.28,107.87 59.53,109.13 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="59.53,148.82 59.28,150.08 58.56,151.16 57.49,151.87 56.22,152.13 54.95,151.87 53.88,151.16 53.17,150.08 52.91,148.82 53.17,147.55 53.88,146.48 54.95,145.76 56.22,145.51 57.49,145.76 58.56,146.48 59.28,147.55 59.53,148.82 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="19.84,115.75 19.59,117.01 18.87,118.09 17.8,118.8 16.54,119.06 15.27,118.8 14.2,118.09 13.48,117.01 13.23,115.75 13.48,114.48 14.2,113.41 15.27,112.69 16.54,112.44 17.8,112.69 18.87,113.41 19.59,114.48 19.84,115.75 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="59.53,115.75 59.28,117.01 58.56,118.09 57.49,118.8 56.22,119.06 54.95,118.8 53.88,118.09 53.17,117.01 52.91,115.75 53.17,114.48 53.88,113.41 54.95,112.69 56.22,112.44 57.49,112.69 58.56,113.41 59.28,114.48 59.53,115.75 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="19.84,122.36 19.59,123.63 18.87,124.7 17.8,125.42 16.54,125.67 15.27,125.42 14.2,124.7 13.48,123.63 13.23,122.36 13.48,121.1 14.2,120.02 15.27,119.31 16.54,119.06 17.8,119.31 18.87,120.02 19.59,121.1 19.84,122.36 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="59.53,122.36 59.28,123.63 58.56,124.7 57.49,125.42 56.22,125.67 54.95,125.42 53.88,124.7 53.17,123.63 52.91,122.36 53.17,121.1 53.88,120.02 54.95,119.31 56.22,119.06 57.49,119.31 58.56,120.02 59.28,121.1 59.53,122.36 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="19.84,128.98 19.59,130.24 18.87,131.31 17.8,132.03 16.54,132.28 15.27,132.03 14.2,131.31 13.48,130.24 13.23,128.98 13.48,127.71 14.2,126.64 15.27,125.92 16.54,125.67 17.8,125.92 18.87,126.64 19.59,127.71 19.84,128.98 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="59.53,128.98 59.28,130.24 58.56,131.31 57.49,132.03 56.22,132.28 54.95,132.03 53.88,131.31 53.17,130.24 52.91,128.98 53.17,127.71 53.88,126.64 54.95,125.92 56.22,125.67 57.49,125.92 58.56,126.64 59.28,127.71 59.53,128.98 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="19.84,135.59 19.59,136.86 18.87,137.93 17.8,138.65 16.54,138.9 15.27,138.65 14.2,137.93 13.48,136.86 13.23,135.59 13.48,134.32 14.2,133.25 15.27,132.54 16.54,132.28 17.8,132.54 18.87,133.25 19.59,134.32 19.84,135.59 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="59.53,135.59 59.28,136.86 58.56,137.93 57.49,138.65 56.22,138.9 54.95,138.65 53.88,137.93 53.17,136.86 52.91,135.59 53.17,134.32 53.88,133.25 54.95,132.54 56.22,132.28 57.49,132.54 58.56,133.25 59.28,134.32 59.53,135.59 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="19.84,142.2 19.59,143.47 18.87,144.54 17.8,145.26 16.54,145.51 15.27,145.26 14.2,144.54 13.48,143.47 13.23,142.2 13.48,140.94 14.2,139.87 15.27,139.15 16.54,138.9 17.8,139.15 18.87,139.87 19.59,140.94 19.84,142.2 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="59.53,142.2 59.28,143.47 58.56,144.54 57.49,145.26 56.22,145.51 54.95,145.26 53.88,144.54 53.17,143.47 52.91,142.2 53.17,140.94 53.88,139.87 54.95,139.15 56.22,138.9 57.49,139.15 58.56,139.87 59.28,140.94 59.53,142.2 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="112.44,16.54 112.19,17.8 111.47,18.87 110.4,19.59 109.13,19.84 107.87,19.59 106.8,18.87 106.08,17.8 105.83,16.54 106.08,15.27 106.8,14.2 107.87,13.48 109.13,13.23 110.4,13.48 111.47,14.2 112.19,15.27 112.44,16.54 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="112.44,56.22 112.19,57.49 111.47,58.56 110.4,59.28 109.13,59.53 107.87,59.28 106.8,58.56 106.08,57.49 105.83,56.22 106.08,54.95 106.8,53.88 107.87,53.17 109.13,52.91 110.4,53.17 111.47,53.88 112.19,54.95 112.44,56.22 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="119.06,16.54 118.8,17.8 118.09,18.87 117.01,19.59 115.75,19.84 114.48,19.59 113.41,18.87 112.69,17.8 112.44,16.54 112.69,15.27 113.41,14.2 114.48,13.48 115.75,13.23 117.01,13.48 118.09,14.2 118.8,15.27 119.06,16.54 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="119.06,56.22 118.8,57.49 118.09,58.56 117.01,59.28 115.75,59.53 114.48,59.28 113.41,58.56 112.69,57.49 112.44,56.22 112.69,54.95 113.41,53.88 114.48,53.17 115.75,52.91 117.01,53.17 118.09,53.88 118.8,54.95 119.06,56.22 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="125.67,16.54 125.42,17.8 124.7,18.87 123.63,19.59 122.36,19.84 121.1,19.59 120.02,18.87 119.31,17.8 119.06,16.54 119.31,15.27 120.02,14.2 121.1,13.48 122.36,13.23 123.63,13.48 124.7,14.2 125.42,15.27 125.67,16.54 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="125.67,56.22 125.42,57.49 124.7,58.56 123.63,59.28 122.36,59.53 121.1,59.28 120.02,58.56 119.31,57.49 119.06,56.22 119.31,54.95 120.02,53.88 121.1,53.17 122.36,52.91 123.63,53.17 124.7,53.88 125.42,54.95 125.67,56.22 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="132.28,16.54 132.03,17.8 131.31,18.87 130.24,19.59 128.98,19.84 127.71,19.59 126.64,18.87 125.92,17.8 125.67,16.54 125.92,15.27 126.64,14.2 127.71,13.48 128.98,13.23 130.24,13.48 131.31,14.2 132.03,15.27 132.28,16.54 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="132.28,56.22 132.03,57.49 131.31,58.56 130.24,59.28 128.98,59.53 127.71,59.28 126.64,58.56 125.92,57.49 125.67,56.22 125.92,54.95 126.64,53.88 127.71,53.17 128.98,52.91 130.24,53.17 131.31,53.88 132.03,54.95 132.28,56.22 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="138.9,16.54 138.65,17.8 137.93,18.87 136.86,19.59 135.59,19.84 134.32,19.59 133.25,18.87 132.54,17.8 132.28,16.54 132.54,15.27 133.25,14.2 134.32,13.48 135.59,13.23 136.86,13.48 137.93,14.2 138.65,15.27 138.9,16.54 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="138.9,56.22 138.65,57.49 137.93,58.56 136.86,59.28 135.59,59.53 134.32,59.28 133.25,58.56 132.54,57.49 132.28,56.22 132.54,54.95 133.25,53.88 134.32,53.17 135.59,52.91 136.86,53.17 137.93,53.88 138.65,54.95 138.9,56.22 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="145.51,16.54 145.26,17.8 144.54,18.87 143.47,19.59 142.2,19.84 140.94,19.59 139.87,18.87 139.15,17.8 138.9,16.54 139.15,15.27 139.87,14.2 140.94,13.48 142.2,13.23 143.47,13.48 144.54,14.2 145.26,15.27 145.51,16.54 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="145.51,56.22 145.26,57.49 144.54,58.56 143.47,59.28 142.2,59.53 140.94,59.28 139.87,58.56 139.15,57.49 138.9,56.22 139.15,54.95 139.87,53.88 140.94,53.17 142.2,52.91 143.47,53.17 144.54,53.88 145.26,54.95 145.51,56.22 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="152.13,16.54 151.87,17.8 151.16,18.87 150.08,19.59 148.82,19.84 147.55,19.59 146.48,18.87 145.76,17.8 145.51,16.54 145.76,15.27 146.48,14.2 147.55,13.48 148.82,13.23 150.08,13.48 151.16,14.2 151.87,15.27 152.13,16.54 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="152.13,56.22 151.87,57.49 151.16,58.56 150.08,59.28 148.82,59.53 147.55,59.28 146.48,58.56 145.76,57.49 145.51,56.22 145.76,54.95 146.48,53.88 147.55,53.17 148.82,52.91 150.08,53.17 151.16,53.88 151.87,54.95 152.13,56.22 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="112.44,23.15 112.19,24.42 111.47,25.49 110.4,26.2 109.13,26.46 107.87,26.2 106.8,25.49 106.08,24.42 105.83,23.15 106.08,21.88 106.8,20.81 107.87,20.09 109.13,19.84 110.4,20.09 111.47,20.81 112.19,21.88 112.44,23.15 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="152.13,23.15 151.87,24.42 151.16,25.49 150.08,26.2 148.82,26.46 147.55,26.2 146.48,25.49 145.76,24.42 145.51,23.15 145.76,21.88 146.48,20.81 147.55,20.09 148.82,19.84 150.08,20.09 151.16,20.81 151.87,21.88 152.13,23.15 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="112.44,29.76 112.19,31.03 111.47,32.1 110.4,32.82 109.13,33.07 107.87,32.82 106.8,32.1 106.08,31.03 105.83,29.76 106.08,28.5 106.8,27.43 107.87,26.71 109.13,26.46 110.4,26.71 111.47,27.43 112.19,28.5 112.44,29.76 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="152.13,29.76 151.87,31.03 151.16,32.1 150.08,32.82 148.82,33.07 147.55,32.82 146.48,32.1 145.76,31.03 145.51,29.76 145.76,28.5 146.48,27.43 147.55,26.71 148.82,26.46 150.08,26.71 151.16,27.43 151.87,28.5 152.13,29.76 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="112.44,36.38 112.19,37.64 111.47,38.72 110.4,39.43 109.13,39.69 107.87,39.43 106.8,38.72 106.08,37.64 105.83,36.38 106.08,35.11 106.8,34.04 107.87,33.32 109.13,33.07 110.4,33.32 111.47,34.04 112.19,35.11 112.44,36.38 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="152.13,36.38 151.87,37.64 151.16,38.72 150.08,39.43 148.82,39.69 147.55,39.43 146.48,38.72 145.76,37.64 145.51,36.38 145.76,35.11 146.48,34.04 147.55,33.32 148.82,33.07 150.08,33.32 151.16,34.04 151.87,35.11 152.13,36.38 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="112.44,42.99 112.19,44.26 111.47,45.33 110.4,46.05 109.13,46.3 107.87,46.05 106.8,45.33 106.08,44.26 105.83,42.99 106.08,41.73 106.8,40.65 107.87,39.94 109.13,39.69 110.4,39.94 111.47,40.65 112.19,41.73 112.44,42.99 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="152.13,42.99 151.87,44.26 151.16,45.33 150.08,46.05 148.82,46.3 147.55,46.05 146.48,45.33 145.76,44.26 145.51,42.99 145.76,41.73 146.48,40.65 147.55,39.94 148.82,39.69 150.08,39.94 151.16,40.65 151.87,41.73 152.13,42.99 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="112.44,49.61 112.19,50.87 111.47,51.94 110.4,52.66 109.13,52.91 107.87,52.66 106.8,51.94 106.08,50.87 105.83,49.61 106.08,48.34 106.8,47.27 107.87,46.55 109.13,46.3 110.4,46.55 111.47,47.27 112.19,48.34 112.44,49.61 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="152.13,49.61 151.87,50.87 151.16,51.94 150.08,52.66 148.82,52.91 147.55,52.66 146.48,51.94 145.76,50.87 145.51,49.61 145.76,48.34 146.48,47.27 147.55,46.55 148.82,46.3 150.08,46.55 151.16,47.27 151.87,48.34 152.13,49.61 "
          style="fill:url(#gradient0a63a848c18243f2af2c33edde29962a);"
        />
        <polygon
          points="33.07,29.76 32.82,31.03 32.1,32.1 31.03,32.82 29.76,33.07 28.5,32.82 27.43,32.1 26.71,31.03 26.46,29.76 26.71,28.5 27.43,27.43 28.5,26.71 29.76,26.46 31.03,26.71 32.1,27.43 32.82,28.5 33.07,29.76 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="39.69,29.76 39.43,31.03 38.72,32.1 37.64,32.82 36.38,33.07 35.11,32.82 34.04,32.1 33.32,31.03 33.07,29.76 33.32,28.5 34.04,27.43 35.11,26.71 36.38,26.46 37.64,26.71 38.72,27.43 39.43,28.5 39.69,29.76 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="46.3,29.76 46.05,31.03 45.33,32.1 44.26,32.82 42.99,33.07 41.73,32.82 40.65,32.1 39.94,31.03 39.69,29.76 39.94,28.5 40.65,27.43 41.73,26.71 42.99,26.46 44.26,26.71 45.33,27.43 46.05,28.5 46.3,29.76 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="33.07,36.38 32.82,37.64 32.1,38.72 31.03,39.43 29.76,39.69 28.5,39.43 27.43,38.72 26.71,37.64 26.46,36.38 26.71,35.11 27.43,34.04 28.5,33.32 29.76,33.07 31.03,33.32 32.1,34.04 32.82,35.11 33.07,36.38 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="39.69,36.38 39.43,37.64 38.72,38.72 37.64,39.43 36.38,39.69 35.11,39.43 34.04,38.72 33.32,37.64 33.07,36.38 33.32,35.11 34.04,34.04 35.11,33.32 36.38,33.07 37.64,33.32 38.72,34.04 39.43,35.11 39.69,36.38 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="46.3,36.38 46.05,37.64 45.33,38.72 44.26,39.43 42.99,39.69 41.73,39.43 40.65,38.72 39.94,37.64 39.69,36.38 39.94,35.11 40.65,34.04 41.73,33.32 42.99,33.07 44.26,33.32 45.33,34.04 46.05,35.11 46.3,36.38 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="33.07,42.99 32.82,44.26 32.1,45.33 31.03,46.05 29.76,46.3 28.5,46.05 27.43,45.33 26.71,44.26 26.46,42.99 26.71,41.73 27.43,40.65 28.5,39.94 29.76,39.69 31.03,39.94 32.1,40.65 32.82,41.73 33.07,42.99 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="39.69,42.99 39.43,44.26 38.72,45.33 37.64,46.05 36.38,46.3 35.11,46.05 34.04,45.33 33.32,44.26 33.07,42.99 33.32,41.73 34.04,40.65 35.11,39.94 36.38,39.69 37.64,39.94 38.72,40.65 39.43,41.73 39.69,42.99 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="46.3,42.99 46.05,44.26 45.33,45.33 44.26,46.05 42.99,46.3 41.73,46.05 40.65,45.33 39.94,44.26 39.69,42.99 39.94,41.73 40.65,40.65 41.73,39.94 42.99,39.69 44.26,39.94 45.33,40.65 46.05,41.73 46.3,42.99 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="33.07,122.36 32.82,123.63 32.1,124.7 31.03,125.42 29.76,125.67 28.5,125.42 27.43,124.7 26.71,123.63 26.46,122.36 26.71,121.1 27.43,120.02 28.5,119.31 29.76,119.06 31.03,119.31 32.1,120.02 32.82,121.1 33.07,122.36 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="39.69,122.36 39.43,123.63 38.72,124.7 37.64,125.42 36.38,125.67 35.11,125.42 34.04,124.7 33.32,123.63 33.07,122.36 33.32,121.1 34.04,120.02 35.11,119.31 36.38,119.06 37.64,119.31 38.72,120.02 39.43,121.1 39.69,122.36 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="46.3,122.36 46.05,123.63 45.33,124.7 44.26,125.42 42.99,125.67 41.73,125.42 40.65,124.7 39.94,123.63 39.69,122.36 39.94,121.1 40.65,120.02 41.73,119.31 42.99,119.06 44.26,119.31 45.33,120.02 46.05,121.1 46.3,122.36 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="33.07,128.98 32.82,130.24 32.1,131.31 31.03,132.03 29.76,132.28 28.5,132.03 27.43,131.31 26.71,130.24 26.46,128.98 26.71,127.71 27.43,126.64 28.5,125.92 29.76,125.67 31.03,125.92 32.1,126.64 32.82,127.71 33.07,128.98 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="39.69,128.98 39.43,130.24 38.72,131.31 37.64,132.03 36.38,132.28 35.11,132.03 34.04,131.31 33.32,130.24 33.07,128.98 33.32,127.71 34.04,126.64 35.11,125.92 36.38,125.67 37.64,125.92 38.72,126.64 39.43,127.71 39.69,128.98 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="46.3,128.98 46.05,130.24 45.33,131.31 44.26,132.03 42.99,132.28 41.73,132.03 40.65,131.31 39.94,130.24 39.69,128.98 39.94,127.71 40.65,126.64 41.73,125.92 42.99,125.67 44.26,125.92 45.33,126.64 46.05,127.71 46.3,128.98 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="33.07,135.59 32.82,136.86 32.1,137.93 31.03,138.65 29.76,138.9 28.5,138.65 27.43,137.93 26.71,136.86 26.46,135.59 26.71,134.32 27.43,133.25 28.5,132.54 29.76,132.28 31.03,132.54 32.1,133.25 32.82,134.32 33.07,135.59 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="39.69,135.59 39.43,136.86 38.72,137.93 37.64,138.65 36.38,138.9 35.11,138.65 34.04,137.93 33.32,136.86 33.07,135.59 33.32,134.32 34.04,133.25 35.11,132.54 36.38,132.28 37.64,132.54 38.72,133.25 39.43,134.32 39.69,135.59 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="46.3,135.59 46.05,136.86 45.33,137.93 44.26,138.65 42.99,138.9 41.73,138.65 40.65,137.93 39.94,136.86 39.69,135.59 39.94,134.32 40.65,133.25 41.73,132.54 42.99,132.28 44.26,132.54 45.33,133.25 46.05,134.32 46.3,135.59 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="125.67,29.76 125.42,31.03 124.7,32.1 123.63,32.82 122.36,33.07 121.1,32.82 120.02,32.1 119.31,31.03 119.06,29.76 119.31,28.5 120.02,27.43 121.1,26.71 122.36,26.46 123.63,26.71 124.7,27.43 125.42,28.5 125.67,29.76 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="132.28,29.76 132.03,31.03 131.31,32.1 130.24,32.82 128.98,33.07 127.71,32.82 126.64,32.1 125.92,31.03 125.67,29.76 125.92,28.5 126.64,27.43 127.71,26.71 128.98,26.46 130.24,26.71 131.31,27.43 132.03,28.5 132.28,29.76 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="138.9,29.76 138.65,31.03 137.93,32.1 136.86,32.82 135.59,33.07 134.32,32.82 133.25,32.1 132.54,31.03 132.28,29.76 132.54,28.5 133.25,27.43 134.32,26.71 135.59,26.46 136.86,26.71 137.93,27.43 138.65,28.5 138.9,29.76 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="125.67,36.38 125.42,37.64 124.7,38.72 123.63,39.43 122.36,39.69 121.1,39.43 120.02,38.72 119.31,37.64 119.06,36.38 119.31,35.11 120.02,34.04 121.1,33.32 122.36,33.07 123.63,33.32 124.7,34.04 125.42,35.11 125.67,36.38 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="132.28,36.38 132.03,37.64 131.31,38.72 130.24,39.43 128.98,39.69 127.71,39.43 126.64,38.72 125.92,37.64 125.67,36.38 125.92,35.11 126.64,34.04 127.71,33.32 128.98,33.07 130.24,33.32 131.31,34.04 132.03,35.11 132.28,36.38 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="138.9,36.38 138.65,37.64 137.93,38.72 136.86,39.43 135.59,39.69 134.32,39.43 133.25,38.72 132.54,37.64 132.28,36.38 132.54,35.11 133.25,34.04 134.32,33.32 135.59,33.07 136.86,33.32 137.93,34.04 138.65,35.11 138.9,36.38 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="125.67,42.99 125.42,44.26 124.7,45.33 123.63,46.05 122.36,46.3 121.1,46.05 120.02,45.33 119.31,44.26 119.06,42.99 119.31,41.73 120.02,40.65 121.1,39.94 122.36,39.69 123.63,39.94 124.7,40.65 125.42,41.73 125.67,42.99 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="132.28,42.99 132.03,44.26 131.31,45.33 130.24,46.05 128.98,46.3 127.71,46.05 126.64,45.33 125.92,44.26 125.67,42.99 125.92,41.73 126.64,40.65 127.71,39.94 128.98,39.69 130.24,39.94 131.31,40.65 132.03,41.73 132.28,42.99 "
          style="fill:rgba(36,82,143,1);"
        />
        <polygon
          points="138.9,42.99 138.65,44.26 137.93,45.33 136.86,46.05 135.59,46.3 134.32,46.05 133.25,45.33 132.54,44.26 132.28,42.99 132.54,41.73 133.25,40.65 134.32,39.94 135.59,39.69 136.86,39.94 137.93,40.65 138.65,41.73 138.9,42.99 "
          style="fill:rgba(36,82,143,1);"
        />
        <linearGradient
          id="gradient656a9574a16d49d783c4af7996609d4f"
          gradientUnits="userSpaceOnUse"
          x1="11.1772292562222"
          y1="78.9300121785742"
          x2="154.177100806644"
          y2="86.424317884292"
        >
          <stop offset="0%" stop-color="#493963" />
          <stop offset="50%" stop-color="#017B2E" />
          <stop offset="100%" stop-color="#493963" />
        </linearGradient>
        <polygon
          points="84.66,16.54 84.4,17.53 83.67,18.25 82.68,18.52 81.69,18.25 80.96,17.53 80.69,16.54 80.96,15.54 81.69,14.82 82.68,14.55 83.67,14.82 84.4,15.54 84.66,16.54 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="91.28,16.54 91.01,17.53 90.28,18.25 89.29,18.52 88.3,18.25 87.57,17.53 87.31,16.54 87.57,15.54 88.3,14.82 89.29,14.55 90.28,14.82 91.01,15.54 91.28,16.54 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="97.89,16.54 97.62,17.53 96.9,18.25 95.91,18.52 94.91,18.25 94.19,17.53 93.92,16.54 94.19,15.54 94.91,14.82 95.91,14.55 96.9,14.82 97.62,15.54 97.89,16.54 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="71.43,23.15 71.17,24.14 70.44,24.87 69.45,25.13 68.46,24.87 67.73,24.14 67.46,23.15 67.73,22.16 68.46,21.43 69.45,21.17 70.44,21.43 71.17,22.16 71.43,23.15 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="78.05,23.15 77.78,24.14 77.06,24.87 76.06,25.13 75.07,24.87 74.34,24.14 74.08,23.15 74.34,22.16 75.07,21.43 76.06,21.17 77.06,21.43 77.78,22.16 78.05,23.15 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="84.66,23.15 84.4,24.14 83.67,24.87 82.68,25.13 81.69,24.87 80.96,24.14 80.69,23.15 80.96,22.16 81.69,21.43 82.68,21.17 83.67,21.43 84.4,22.16 84.66,23.15 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="97.89,23.15 97.62,24.14 96.9,24.87 95.91,25.13 94.91,24.87 94.19,24.14 93.92,23.15 94.19,22.16 94.91,21.43 95.91,21.17 96.9,21.43 97.62,22.16 97.89,23.15 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="84.66,29.76 84.4,30.76 83.67,31.48 82.68,31.75 81.69,31.48 80.96,30.76 80.69,29.76 80.96,28.77 81.69,28.05 82.68,27.78 83.67,28.05 84.4,28.77 84.66,29.76 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="91.28,29.76 91.01,30.76 90.28,31.48 89.29,31.75 88.3,31.48 87.57,30.76 87.31,29.76 87.57,28.77 88.3,28.05 89.29,27.78 90.28,28.05 91.01,28.77 91.28,29.76 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="97.89,29.76 97.62,30.76 96.9,31.48 95.91,31.75 94.91,31.48 94.19,30.76 93.92,29.76 94.19,28.77 94.91,28.05 95.91,27.78 96.9,28.05 97.62,28.77 97.89,29.76 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="71.43,36.38 71.17,37.37 70.44,38.1 69.45,38.36 68.46,38.1 67.73,37.37 67.46,36.38 67.73,35.39 68.46,34.66 69.45,34.39 70.44,34.66 71.17,35.39 71.43,36.38 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="78.05,36.38 77.78,37.37 77.06,38.1 76.06,38.36 75.07,38.1 74.34,37.37 74.08,36.38 74.34,35.39 75.07,34.66 76.06,34.39 77.06,34.66 77.78,35.39 78.05,36.38 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="97.89,36.38 97.62,37.37 96.9,38.1 95.91,38.36 94.91,38.1 94.19,37.37 93.92,36.38 94.19,35.39 94.91,34.66 95.91,34.39 96.9,34.66 97.62,35.39 97.89,36.38 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="78.05,42.99 77.78,43.98 77.06,44.71 76.06,44.98 75.07,44.71 74.34,43.98 74.08,42.99 74.34,42 75.07,41.27 76.06,41.01 77.06,41.27 77.78,42 78.05,42.99 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="97.89,42.99 97.62,43.98 96.9,44.71 95.91,44.98 94.91,44.71 94.19,43.98 93.92,42.99 94.19,42 94.91,41.27 95.91,41.01 96.9,41.27 97.62,42 97.89,42.99 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="71.43,49.61 71.17,50.6 70.44,51.32 69.45,51.59 68.46,51.32 67.73,50.6 67.46,49.61 67.73,48.61 68.46,47.89 69.45,47.62 70.44,47.89 71.17,48.61 71.43,49.61 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="91.28,49.61 91.01,50.6 90.28,51.32 89.29,51.59 88.3,51.32 87.57,50.6 87.31,49.61 87.57,48.61 88.3,47.89 89.29,47.62 90.28,47.89 91.01,48.61 91.28,49.61 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="71.43,56.22 71.17,57.21 70.44,57.94 69.45,58.2 68.46,57.94 67.73,57.21 67.46,56.22 67.73,55.23 68.46,54.5 69.45,54.24 70.44,54.5 71.17,55.23 71.43,56.22 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="84.66,56.22 84.4,57.21 83.67,57.94 82.68,58.2 81.69,57.94 80.96,57.21 80.69,56.22 80.96,55.23 81.69,54.5 82.68,54.24 83.67,54.5 84.4,55.23 84.66,56.22 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="97.89,56.22 97.62,57.21 96.9,57.94 95.91,58.2 94.91,57.94 94.19,57.21 93.92,56.22 94.19,55.23 94.91,54.5 95.91,54.24 96.9,54.5 97.62,55.23 97.89,56.22 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="78.05,62.83 77.78,63.83 77.06,64.55 76.06,64.82 75.07,64.55 74.34,63.83 74.08,62.83 74.34,61.84 75.07,61.12 76.06,60.85 77.06,61.12 77.78,61.84 78.05,62.83 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="18.52,69.45 18.25,70.44 17.53,71.17 16.54,71.43 15.54,71.17 14.82,70.44 14.55,69.45 14.82,68.46 15.54,67.73 16.54,67.46 17.53,67.73 18.25,68.46 18.52,69.45 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="25.13,69.45 24.87,70.44 24.14,71.17 23.15,71.43 22.16,71.17 21.43,70.44 21.17,69.45 21.43,68.46 22.16,67.73 23.15,67.46 24.14,67.73 24.87,68.46 25.13,69.45 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="31.75,69.45 31.48,70.44 30.76,71.17 29.76,71.43 28.77,71.17 28.05,70.44 27.78,69.45 28.05,68.46 28.77,67.73 29.76,67.46 30.76,67.73 31.48,68.46 31.75,69.45 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="38.36,69.45 38.1,70.44 37.37,71.17 36.38,71.43 35.39,71.17 34.66,70.44 34.39,69.45 34.66,68.46 35.39,67.73 36.38,67.46 37.37,67.73 38.1,68.46 38.36,69.45 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="44.98,69.45 44.71,70.44 43.98,71.17 42.99,71.43 42,71.17 41.27,70.44 41.01,69.45 41.27,68.46 42,67.73 42.99,67.46 43.98,67.73 44.71,68.46 44.98,69.45 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="58.2,69.45 57.94,70.44 57.21,71.17 56.22,71.43 55.23,71.17 54.5,70.44 54.24,69.45 54.5,68.46 55.23,67.73 56.22,67.46 57.21,67.73 57.94,68.46 58.2,69.45 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="64.82,69.45 64.55,70.44 63.83,71.17 62.83,71.43 61.84,71.17 61.12,70.44 60.85,69.45 61.12,68.46 61.84,67.73 62.83,67.46 63.83,67.73 64.55,68.46 64.82,69.45 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="71.43,69.45 71.17,70.44 70.44,71.17 69.45,71.43 68.46,71.17 67.73,70.44 67.46,69.45 67.73,68.46 68.46,67.73 69.45,67.46 70.44,67.73 71.17,68.46 71.43,69.45 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="91.28,69.45 91.01,70.44 90.28,71.17 89.29,71.43 88.3,71.17 87.57,70.44 87.31,69.45 87.57,68.46 88.3,67.73 89.29,67.46 90.28,67.73 91.01,68.46 91.28,69.45 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="104.5,69.45 104.24,70.44 103.51,71.17 102.52,71.43 101.53,71.17 100.8,70.44 100.54,69.45 100.8,68.46 101.53,67.73 102.52,67.46 103.51,67.73 104.24,68.46 104.5,69.45 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="117.73,69.45 117.47,70.44 116.74,71.17 115.75,71.43 114.76,71.17 114.03,70.44 113.76,69.45 114.03,68.46 114.76,67.73 115.75,67.46 116.74,67.73 117.47,68.46 117.73,69.45 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="130.96,69.45 130.69,70.44 129.97,71.17 128.98,71.43 127.98,71.17 127.26,70.44 126.99,69.45 127.26,68.46 127.98,67.73 128.98,67.46 129.97,67.73 130.69,68.46 130.96,69.45 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="144.19,69.45 143.92,70.44 143.2,71.17 142.2,71.43 141.21,71.17 140.49,70.44 140.22,69.45 140.49,68.46 141.21,67.73 142.2,67.46 143.2,67.73 143.92,68.46 144.19,69.45 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="18.52,76.06 18.25,77.06 17.53,77.78 16.54,78.05 15.54,77.78 14.82,77.06 14.55,76.06 14.82,75.07 15.54,74.34 16.54,74.08 17.53,74.34 18.25,75.07 18.52,76.06 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="25.13,76.06 24.87,77.06 24.14,77.78 23.15,78.05 22.16,77.78 21.43,77.06 21.17,76.06 21.43,75.07 22.16,74.34 23.15,74.08 24.14,74.34 24.87,75.07 25.13,76.06 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="31.75,76.06 31.48,77.06 30.76,77.78 29.76,78.05 28.77,77.78 28.05,77.06 27.78,76.06 28.05,75.07 28.77,74.34 29.76,74.08 30.76,74.34 31.48,75.07 31.75,76.06 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="51.59,76.06 51.32,77.06 50.6,77.78 49.61,78.05 48.61,77.78 47.89,77.06 47.62,76.06 47.89,75.07 48.61,74.34 49.61,74.08 50.6,74.34 51.32,75.07 51.59,76.06 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="64.82,76.06 64.55,77.06 63.83,77.78 62.83,78.05 61.84,77.78 61.12,77.06 60.85,76.06 61.12,75.07 61.84,74.34 62.83,74.08 63.83,74.34 64.55,75.07 64.82,76.06 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="78.05,76.06 77.78,77.06 77.06,77.78 76.06,78.05 75.07,77.78 74.34,77.06 74.08,76.06 74.34,75.07 75.07,74.34 76.06,74.08 77.06,74.34 77.78,75.07 78.05,76.06 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="91.28,76.06 91.01,77.06 90.28,77.78 89.29,78.05 88.3,77.78 87.57,77.06 87.31,76.06 87.57,75.07 88.3,74.34 89.29,74.08 90.28,74.34 91.01,75.07 91.28,76.06 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="97.89,76.06 97.62,77.06 96.9,77.78 95.91,78.05 94.91,77.78 94.19,77.06 93.92,76.06 94.19,75.07 94.91,74.34 95.91,74.08 96.9,74.34 97.62,75.07 97.89,76.06 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="104.5,76.06 104.24,77.06 103.51,77.78 102.52,78.05 101.53,77.78 100.8,77.06 100.54,76.06 100.8,75.07 101.53,74.34 102.52,74.08 103.51,74.34 104.24,75.07 104.5,76.06 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="111.12,76.06 110.85,77.06 110.13,77.78 109.13,78.05 108.14,77.78 107.42,77.06 107.15,76.06 107.42,75.07 108.14,74.34 109.13,74.08 110.13,74.34 110.85,75.07 111.12,76.06 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="130.96,76.06 130.69,77.06 129.97,77.78 128.98,78.05 127.98,77.78 127.26,77.06 126.99,76.06 127.26,75.07 127.98,74.34 128.98,74.08 129.97,74.34 130.69,75.07 130.96,76.06 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="137.57,76.06 137.31,77.06 136.58,77.78 135.59,78.05 134.6,77.78 133.87,77.06 133.61,76.06 133.87,75.07 134.6,74.34 135.59,74.08 136.58,74.34 137.31,75.07 137.57,76.06 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="144.19,76.06 143.92,77.06 143.2,77.78 142.2,78.05 141.21,77.78 140.49,77.06 140.22,76.06 140.49,75.07 141.21,74.34 142.2,74.08 143.2,74.34 143.92,75.07 144.19,76.06 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="150.8,76.06 150.54,77.06 149.81,77.78 148.82,78.05 147.83,77.78 147.1,77.06 146.83,76.06 147.1,75.07 147.83,74.34 148.82,74.08 149.81,74.34 150.54,75.07 150.8,76.06 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="31.75,82.68 31.48,83.67 30.76,84.4 29.76,84.66 28.77,84.4 28.05,83.67 27.78,82.68 28.05,81.69 28.77,80.96 29.76,80.69 30.76,80.96 31.48,81.69 31.75,82.68 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="44.98,82.68 44.71,83.67 43.98,84.4 42.99,84.66 42,84.4 41.27,83.67 41.01,82.68 41.27,81.69 42,80.96 42.99,80.69 43.98,80.96 44.71,81.69 44.98,82.68 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="51.59,82.68 51.32,83.67 50.6,84.4 49.61,84.66 48.61,84.4 47.89,83.67 47.62,82.68 47.89,81.69 48.61,80.96 49.61,80.69 50.6,80.96 51.32,81.69 51.59,82.68 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="58.2,82.68 57.94,83.67 57.21,84.4 56.22,84.66 55.23,84.4 54.5,83.67 54.24,82.68 54.5,81.69 55.23,80.96 56.22,80.69 57.21,80.96 57.94,81.69 58.2,82.68 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="71.43,82.68 71.17,83.67 70.44,84.4 69.45,84.66 68.46,84.4 67.73,83.67 67.46,82.68 67.73,81.69 68.46,80.96 69.45,80.69 70.44,80.96 71.17,81.69 71.43,82.68 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="78.05,82.68 77.78,83.67 77.06,84.4 76.06,84.66 75.07,84.4 74.34,83.67 74.08,82.68 74.34,81.69 75.07,80.96 76.06,80.69 77.06,80.96 77.78,81.69 78.05,82.68 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="97.89,82.68 97.62,83.67 96.9,84.4 95.91,84.66 94.91,84.4 94.19,83.67 93.92,82.68 94.19,81.69 94.91,80.96 95.91,80.69 96.9,80.96 97.62,81.69 97.89,82.68 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="111.12,82.68 110.85,83.67 110.13,84.4 109.13,84.66 108.14,84.4 107.42,83.67 107.15,82.68 107.42,81.69 108.14,80.96 109.13,80.69 110.13,80.96 110.85,81.69 111.12,82.68 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="117.73,82.68 117.47,83.67 116.74,84.4 115.75,84.66 114.76,84.4 114.03,83.67 113.76,82.68 114.03,81.69 114.76,80.96 115.75,80.69 116.74,80.96 117.47,81.69 117.73,82.68 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="130.96,82.68 130.69,83.67 129.97,84.4 128.98,84.66 127.98,84.4 127.26,83.67 126.99,82.68 127.26,81.69 127.98,80.96 128.98,80.69 129.97,80.96 130.69,81.69 130.96,82.68 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="150.8,82.68 150.54,83.67 149.81,84.4 148.82,84.66 147.83,84.4 147.1,83.67 146.83,82.68 147.1,81.69 147.83,80.96 148.82,80.69 149.81,80.96 150.54,81.69 150.8,82.68 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="18.52,89.29 18.25,90.28 17.53,91.01 16.54,91.28 15.54,91.01 14.82,90.28 14.55,89.29 14.82,88.3 15.54,87.57 16.54,87.31 17.53,87.57 18.25,88.3 18.52,89.29 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="38.36,89.29 38.1,90.28 37.37,91.01 36.38,91.28 35.39,91.01 34.66,90.28 34.39,89.29 34.66,88.3 35.39,87.57 36.38,87.31 37.37,87.57 38.1,88.3 38.36,89.29 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="91.28,89.29 91.01,90.28 90.28,91.01 89.29,91.28 88.3,91.01 87.57,90.28 87.31,89.29 87.57,88.3 88.3,87.57 89.29,87.31 90.28,87.57 91.01,88.3 91.28,89.29 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="97.89,89.29 97.62,90.28 96.9,91.01 95.91,91.28 94.91,91.01 94.19,90.28 93.92,89.29 94.19,88.3 94.91,87.57 95.91,87.31 96.9,87.57 97.62,88.3 97.89,89.29 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="104.5,89.29 104.24,90.28 103.51,91.01 102.52,91.28 101.53,91.01 100.8,90.28 100.54,89.29 100.8,88.3 101.53,87.57 102.52,87.31 103.51,87.57 104.24,88.3 104.5,89.29 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="111.12,89.29 110.85,90.28 110.13,91.01 109.13,91.28 108.14,91.01 107.42,90.28 107.15,89.29 107.42,88.3 108.14,87.57 109.13,87.31 110.13,87.57 110.85,88.3 111.12,89.29 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="137.57,89.29 137.31,90.28 136.58,91.01 135.59,91.28 134.6,91.01 133.87,90.28 133.61,89.29 133.87,88.3 134.6,87.57 135.59,87.31 136.58,87.57 137.31,88.3 137.57,89.29 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="144.19,89.29 143.92,90.28 143.2,91.01 142.2,91.28 141.21,91.01 140.49,90.28 140.22,89.29 140.49,88.3 141.21,87.57 142.2,87.31 143.2,87.57 143.92,88.3 144.19,89.29 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="150.8,89.29 150.54,90.28 149.81,91.01 148.82,91.28 147.83,91.01 147.1,90.28 146.83,89.29 147.1,88.3 147.83,87.57 148.82,87.31 149.81,87.57 150.54,88.3 150.8,89.29 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="25.13,95.91 24.87,96.9 24.14,97.62 23.15,97.89 22.16,97.62 21.43,96.9 21.17,95.91 21.43,94.91 22.16,94.19 23.15,93.92 24.14,94.19 24.87,94.91 25.13,95.91 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="38.36,95.91 38.1,96.9 37.37,97.62 36.38,97.89 35.39,97.62 34.66,96.9 34.39,95.91 34.66,94.91 35.39,94.19 36.38,93.92 37.37,94.19 38.1,94.91 38.36,95.91 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="44.98,95.91 44.71,96.9 43.98,97.62 42.99,97.89 42,97.62 41.27,96.9 41.01,95.91 41.27,94.91 42,94.19 42.99,93.92 43.98,94.19 44.71,94.91 44.98,95.91 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="58.2,95.91 57.94,96.9 57.21,97.62 56.22,97.89 55.23,97.62 54.5,96.9 54.24,95.91 54.5,94.91 55.23,94.19 56.22,93.92 57.21,94.19 57.94,94.91 58.2,95.91 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="71.43,95.91 71.17,96.9 70.44,97.62 69.45,97.89 68.46,97.62 67.73,96.9 67.46,95.91 67.73,94.91 68.46,94.19 69.45,93.92 70.44,94.19 71.17,94.91 71.43,95.91 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="78.05,95.91 77.78,96.9 77.06,97.62 76.06,97.89 75.07,97.62 74.34,96.9 74.08,95.91 74.34,94.91 75.07,94.19 76.06,93.92 77.06,94.19 77.78,94.91 78.05,95.91 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="97.89,95.91 97.62,96.9 96.9,97.62 95.91,97.89 94.91,97.62 94.19,96.9 93.92,95.91 94.19,94.91 94.91,94.19 95.91,93.92 96.9,94.19 97.62,94.91 97.89,95.91 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="117.73,95.91 117.47,96.9 116.74,97.62 115.75,97.89 114.76,97.62 114.03,96.9 113.76,95.91 114.03,94.91 114.76,94.19 115.75,93.92 116.74,94.19 117.47,94.91 117.73,95.91 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="144.19,95.91 143.92,96.9 143.2,97.62 142.2,97.89 141.21,97.62 140.49,96.9 140.22,95.91 140.49,94.91 141.21,94.19 142.2,93.92 143.2,94.19 143.92,94.91 144.19,95.91 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="71.43,102.52 71.17,103.51 70.44,104.24 69.45,104.5 68.46,104.24 67.73,103.51 67.46,102.52 67.73,101.53 68.46,100.8 69.45,100.54 70.44,100.8 71.17,101.53 71.43,102.52 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="84.66,102.52 84.4,103.51 83.67,104.24 82.68,104.5 81.69,104.24 80.96,103.51 80.69,102.52 80.96,101.53 81.69,100.8 82.68,100.54 83.67,100.8 84.4,101.53 84.66,102.52 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="97.89,102.52 97.62,103.51 96.9,104.24 95.91,104.5 94.91,104.24 94.19,103.51 93.92,102.52 94.19,101.53 94.91,100.8 95.91,100.54 96.9,100.8 97.62,101.53 97.89,102.52 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="117.73,102.52 117.47,103.51 116.74,104.24 115.75,104.5 114.76,104.24 114.03,103.51 113.76,102.52 114.03,101.53 114.76,100.8 115.75,100.54 116.74,100.8 117.47,101.53 117.73,102.52 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="137.57,102.52 137.31,103.51 136.58,104.24 135.59,104.5 134.6,104.24 133.87,103.51 133.61,102.52 133.87,101.53 134.6,100.8 135.59,100.54 136.58,100.8 137.31,101.53 137.57,102.52 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="71.43,109.13 71.17,110.13 70.44,110.85 69.45,111.12 68.46,110.85 67.73,110.13 67.46,109.13 67.73,108.14 68.46,107.42 69.45,107.15 70.44,107.42 71.17,108.14 71.43,109.13 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="91.28,109.13 91.01,110.13 90.28,110.85 89.29,111.12 88.3,110.85 87.57,110.13 87.31,109.13 87.57,108.14 88.3,107.42 89.29,107.15 90.28,107.42 91.01,108.14 91.28,109.13 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="104.5,109.13 104.24,110.13 103.51,110.85 102.52,111.12 101.53,110.85 100.8,110.13 100.54,109.13 100.8,108.14 101.53,107.42 102.52,107.15 103.51,107.42 104.24,108.14 104.5,109.13 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="124.35,109.13 124.08,110.13 123.35,110.85 122.36,111.12 121.37,110.85 120.64,110.13 120.38,109.13 120.64,108.14 121.37,107.42 122.36,107.15 123.35,107.42 124.08,108.14 124.35,109.13 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="130.96,109.13 130.69,110.13 129.97,110.85 128.98,111.12 127.98,110.85 127.26,110.13 126.99,109.13 127.26,108.14 127.98,107.42 128.98,107.15 129.97,107.42 130.69,108.14 130.96,109.13 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="144.19,109.13 143.92,110.13 143.2,110.85 142.2,111.12 141.21,110.85 140.49,110.13 140.22,109.13 140.49,108.14 141.21,107.42 142.2,107.15 143.2,107.42 143.92,108.14 144.19,109.13 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="150.8,109.13 150.54,110.13 149.81,110.85 148.82,111.12 147.83,110.85 147.1,110.13 146.83,109.13 147.1,108.14 147.83,107.42 148.82,107.15 149.81,107.42 150.54,108.14 150.8,109.13 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="78.05,115.75 77.78,116.74 77.06,117.47 76.06,117.73 75.07,117.47 74.34,116.74 74.08,115.75 74.34,114.76 75.07,114.03 76.06,113.76 77.06,114.03 77.78,114.76 78.05,115.75 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="84.66,115.75 84.4,116.74 83.67,117.47 82.68,117.73 81.69,117.47 80.96,116.74 80.69,115.75 80.96,114.76 81.69,114.03 82.68,113.76 83.67,114.03 84.4,114.76 84.66,115.75 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="117.73,115.75 117.47,116.74 116.74,117.47 115.75,117.73 114.76,117.47 114.03,116.74 113.76,115.75 114.03,114.76 114.76,114.03 115.75,113.76 116.74,114.03 117.47,114.76 117.73,115.75 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="124.35,115.75 124.08,116.74 123.35,117.47 122.36,117.73 121.37,117.47 120.64,116.74 120.38,115.75 120.64,114.76 121.37,114.03 122.36,113.76 123.35,114.03 124.08,114.76 124.35,115.75 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="137.57,115.75 137.31,116.74 136.58,117.47 135.59,117.73 134.6,117.47 133.87,116.74 133.61,115.75 133.87,114.76 134.6,114.03 135.59,113.76 136.58,114.03 137.31,114.76 137.57,115.75 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="150.8,115.75 150.54,116.74 149.81,117.47 148.82,117.73 147.83,117.47 147.1,116.74 146.83,115.75 147.1,114.76 147.83,114.03 148.82,113.76 149.81,114.03 150.54,114.76 150.8,115.75 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="71.43,122.36 71.17,123.35 70.44,124.08 69.45,124.35 68.46,124.08 67.73,123.35 67.46,122.36 67.73,121.37 68.46,120.64 69.45,120.38 70.44,120.64 71.17,121.37 71.43,122.36 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="78.05,122.36 77.78,123.35 77.06,124.08 76.06,124.35 75.07,124.08 74.34,123.35 74.08,122.36 74.34,121.37 75.07,120.64 76.06,120.38 77.06,120.64 77.78,121.37 78.05,122.36 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="84.66,122.36 84.4,123.35 83.67,124.08 82.68,124.35 81.69,124.08 80.96,123.35 80.69,122.36 80.96,121.37 81.69,120.64 82.68,120.38 83.67,120.64 84.4,121.37 84.66,122.36 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="91.28,122.36 91.01,123.35 90.28,124.08 89.29,124.35 88.3,124.08 87.57,123.35 87.31,122.36 87.57,121.37 88.3,120.64 89.29,120.38 90.28,120.64 91.01,121.37 91.28,122.36 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="104.5,122.36 104.24,123.35 103.51,124.08 102.52,124.35 101.53,124.08 100.8,123.35 100.54,122.36 100.8,121.37 101.53,120.64 102.52,120.38 103.51,120.64 104.24,121.37 104.5,122.36 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="124.35,122.36 124.08,123.35 123.35,124.08 122.36,124.35 121.37,124.08 120.64,123.35 120.38,122.36 120.64,121.37 121.37,120.64 122.36,120.38 123.35,120.64 124.08,121.37 124.35,122.36 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="130.96,122.36 130.69,123.35 129.97,124.08 128.98,124.35 127.98,124.08 127.26,123.35 126.99,122.36 127.26,121.37 127.98,120.64 128.98,120.38 129.97,120.64 130.69,121.37 130.96,122.36 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="137.57,122.36 137.31,123.35 136.58,124.08 135.59,124.35 134.6,124.08 133.87,123.35 133.61,122.36 133.87,121.37 134.6,120.64 135.59,120.38 136.58,120.64 137.31,121.37 137.57,122.36 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="71.43,128.98 71.17,129.97 70.44,130.69 69.45,130.96 68.46,130.69 67.73,129.97 67.46,128.98 67.73,127.98 68.46,127.26 69.45,126.99 70.44,127.26 71.17,127.98 71.43,128.98 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="78.05,128.98 77.78,129.97 77.06,130.69 76.06,130.96 75.07,130.69 74.34,129.97 74.08,128.98 74.34,127.98 75.07,127.26 76.06,126.99 77.06,127.26 77.78,127.98 78.05,128.98 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="91.28,128.98 91.01,129.97 90.28,130.69 89.29,130.96 88.3,130.69 87.57,129.97 87.31,128.98 87.57,127.98 88.3,127.26 89.29,126.99 90.28,127.26 91.01,127.98 91.28,128.98 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="97.89,128.98 97.62,129.97 96.9,130.69 95.91,130.96 94.91,130.69 94.19,129.97 93.92,128.98 94.19,127.98 94.91,127.26 95.91,126.99 96.9,127.26 97.62,127.98 97.89,128.98 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="104.5,128.98 104.24,129.97 103.51,130.69 102.52,130.96 101.53,130.69 100.8,129.97 100.54,128.98 100.8,127.98 101.53,127.26 102.52,126.99 103.51,127.26 104.24,127.98 104.5,128.98 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="111.12,128.98 110.85,129.97 110.13,130.69 109.13,130.96 108.14,130.69 107.42,129.97 107.15,128.98 107.42,127.98 108.14,127.26 109.13,126.99 110.13,127.26 110.85,127.98 111.12,128.98 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="117.73,128.98 117.47,129.97 116.74,130.69 115.75,130.96 114.76,130.69 114.03,129.97 113.76,128.98 114.03,127.98 114.76,127.26 115.75,126.99 116.74,127.26 117.47,127.98 117.73,128.98 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="130.96,128.98 130.69,129.97 129.97,130.69 128.98,130.96 127.98,130.69 127.26,129.97 126.99,128.98 127.26,127.98 127.98,127.26 128.98,126.99 129.97,127.26 130.69,127.98 130.96,128.98 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="137.57,128.98 137.31,129.97 136.58,130.69 135.59,130.96 134.6,130.69 133.87,129.97 133.61,128.98 133.87,127.98 134.6,127.26 135.59,126.99 136.58,127.26 137.31,127.98 137.57,128.98 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="71.43,135.59 71.17,136.58 70.44,137.31 69.45,137.57 68.46,137.31 67.73,136.58 67.46,135.59 67.73,134.6 68.46,133.87 69.45,133.61 70.44,133.87 71.17,134.6 71.43,135.59 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="78.05,135.59 77.78,136.58 77.06,137.31 76.06,137.57 75.07,137.31 74.34,136.58 74.08,135.59 74.34,134.6 75.07,133.87 76.06,133.61 77.06,133.87 77.78,134.6 78.05,135.59 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="97.89,135.59 97.62,136.58 96.9,137.31 95.91,137.57 94.91,137.31 94.19,136.58 93.92,135.59 94.19,134.6 94.91,133.87 95.91,133.61 96.9,133.87 97.62,134.6 97.89,135.59 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="111.12,135.59 110.85,136.58 110.13,137.31 109.13,137.57 108.14,137.31 107.42,136.58 107.15,135.59 107.42,134.6 108.14,133.87 109.13,133.61 110.13,133.87 110.85,134.6 111.12,135.59 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="117.73,135.59 117.47,136.58 116.74,137.31 115.75,137.57 114.76,137.31 114.03,136.58 113.76,135.59 114.03,134.6 114.76,133.87 115.75,133.61 116.74,133.87 117.47,134.6 117.73,135.59 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="130.96,135.59 130.69,136.58 129.97,137.31 128.98,137.57 127.98,137.31 127.26,136.58 126.99,135.59 127.26,134.6 127.98,133.87 128.98,133.61 129.97,133.87 130.69,134.6 130.96,135.59 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="137.57,135.59 137.31,136.58 136.58,137.31 135.59,137.57 134.6,137.31 133.87,136.58 133.61,135.59 133.87,134.6 134.6,133.87 135.59,133.61 136.58,133.87 137.31,134.6 137.57,135.59 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="71.43,142.2 71.17,143.2 70.44,143.92 69.45,144.19 68.46,143.92 67.73,143.2 67.46,142.2 67.73,141.21 68.46,140.49 69.45,140.22 70.44,140.49 71.17,141.21 71.43,142.2 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="84.66,142.2 84.4,143.2 83.67,143.92 82.68,144.19 81.69,143.92 80.96,143.2 80.69,142.2 80.96,141.21 81.69,140.49 82.68,140.22 83.67,140.49 84.4,141.21 84.66,142.2 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="91.28,142.2 91.01,143.2 90.28,143.92 89.29,144.19 88.3,143.92 87.57,143.2 87.31,142.2 87.57,141.21 88.3,140.49 89.29,140.22 90.28,140.49 91.01,141.21 91.28,142.2 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="97.89,142.2 97.62,143.2 96.9,143.92 95.91,144.19 94.91,143.92 94.19,143.2 93.92,142.2 94.19,141.21 94.91,140.49 95.91,140.22 96.9,140.49 97.62,141.21 97.89,142.2 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="104.5,142.2 104.24,143.2 103.51,143.92 102.52,144.19 101.53,143.92 100.8,143.2 100.54,142.2 100.8,141.21 101.53,140.49 102.52,140.22 103.51,140.49 104.24,141.21 104.5,142.2 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="111.12,142.2 110.85,143.2 110.13,143.92 109.13,144.19 108.14,143.92 107.42,143.2 107.15,142.2 107.42,141.21 108.14,140.49 109.13,140.22 110.13,140.49 110.85,141.21 111.12,142.2 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="117.73,142.2 117.47,143.2 116.74,143.92 115.75,144.19 114.76,143.92 114.03,143.2 113.76,142.2 114.03,141.21 114.76,140.49 115.75,140.22 116.74,140.49 117.47,141.21 117.73,142.2 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="124.35,142.2 124.08,143.2 123.35,143.92 122.36,144.19 121.37,143.92 120.64,143.2 120.38,142.2 120.64,141.21 121.37,140.49 122.36,140.22 123.35,140.49 124.08,141.21 124.35,142.2 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="137.57,142.2 137.31,143.2 136.58,143.92 135.59,144.19 134.6,143.92 133.87,143.2 133.61,142.2 133.87,141.21 134.6,140.49 135.59,140.22 136.58,140.49 137.31,141.21 137.57,142.2 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="144.19,142.2 143.92,143.2 143.2,143.92 142.2,144.19 141.21,143.92 140.49,143.2 140.22,142.2 140.49,141.21 141.21,140.49 142.2,140.22 143.2,140.49 143.92,141.21 144.19,142.2 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="71.43,148.82 71.17,149.81 70.44,150.54 69.45,150.8 68.46,150.54 67.73,149.81 67.46,148.82 67.73,147.83 68.46,147.1 69.45,146.83 70.44,147.1 71.17,147.83 71.43,148.82 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="78.05,148.82 77.78,149.81 77.06,150.54 76.06,150.8 75.07,150.54 74.34,149.81 74.08,148.82 74.34,147.83 75.07,147.1 76.06,146.83 77.06,147.1 77.78,147.83 78.05,148.82 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="84.66,148.82 84.4,149.81 83.67,150.54 82.68,150.8 81.69,150.54 80.96,149.81 80.69,148.82 80.96,147.83 81.69,147.1 82.68,146.83 83.67,147.1 84.4,147.83 84.66,148.82 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="97.89,148.82 97.62,149.81 96.9,150.54 95.91,150.8 94.91,150.54 94.19,149.81 93.92,148.82 94.19,147.83 94.91,147.1 95.91,146.83 96.9,147.1 97.62,147.83 97.89,148.82 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="117.73,148.82 117.47,149.81 116.74,150.54 115.75,150.8 114.76,150.54 114.03,149.81 113.76,148.82 114.03,147.83 114.76,147.1 115.75,146.83 116.74,147.1 117.47,147.83 117.73,148.82 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
        <polygon
          points="137.57,148.82 137.31,149.81 136.58,150.54 135.59,150.8 134.6,150.54 133.87,149.81 133.61,148.82 133.87,147.83 134.6,147.1 135.59,146.83 136.58,147.1 137.31,147.83 137.57,148.82 "
          style="fill:url(#gradient656a9574a16d49d783c4af7996609d4f);"
        />
      `,
            },
            {
                value: 7,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(37,86,99,1);"
            shape-rendering="crispEdges"
          />
          <linearGradient
            id="gradienta8c6daa64ea24dda9c31f0ef25b23fe5"
            gradientUnits="userSpaceOnUse"
            x1="8.73357798631972"
            y1="77.5065212907663"
            x2="156.620742539803"
            y2="87.8477992353567"
          >
            <stop offset="0%" stop-color="#B2A1C7" />
            <stop offset="50%" stop-color="#FDEADA" />
            <stop offset="100%" stop-color="#B2A1C7" />
          </linearGradient>
          <polygon
            points="13.23,13.23 59.53,13.23 59.53,59.53 13.23,59.53 13.23,19.78 19.84,19.78 19.84,52.91 52.91,52.91 52.91,19.84 13.23,19.84 "
            style="fill:url(#gradienta8c6daa64ea24dda9c31f0ef25b23fe5);"
          />
          <polygon
            points="13.23,105.83 59.53,105.83 59.53,152.13 13.23,152.13 13.23,112.37 19.84,112.37 19.84,145.51 52.91,145.51 52.91,112.44 13.23,112.44 "
            style="fill:url(#gradienta8c6daa64ea24dda9c31f0ef25b23fe5);"
          />
          <polygon
            points="105.83,13.23 152.13,13.23 152.13,59.53 105.83,59.53 105.83,19.78 112.44,19.78 112.44,52.91 145.51,52.91 145.51,19.84 105.83,19.84 "
            style="fill:url(#gradienta8c6daa64ea24dda9c31f0ef25b23fe5);"
          />
          <linearGradient
            id="gradientd6ceeefdc3cb4485b1f267ba2bd1ca96"
            gradientUnits="userSpaceOnUse"
            x1="22.8180702621143"
            y1="78.4914031594818"
            x2="142.536246449311"
            y2="86.862913551944"
          >
            <stop offset="0%" stop-color="#F2F2F2" />
            <stop offset="100%" stop-color="#FF9393" />
          </linearGradient>
          <polygon
            points="26.46,26.46 46.3,26.46 46.3,46.3 26.46,46.3 "
            style="fill:url(#gradientd6ceeefdc3cb4485b1f267ba2bd1ca96);"
          />
          <polygon
            points="26.46,119.06 46.3,119.06 46.3,138.9 26.46,138.9 "
            style="fill:url(#gradientd6ceeefdc3cb4485b1f267ba2bd1ca96);"
          />
          <polygon
            points="119.06,26.46 138.9,26.46 138.9,46.3 119.06,46.3 "
            style="fill:url(#gradientd6ceeefdc3cb4485b1f267ba2bd1ca96);"
          />
          <pattern
            id="hatcha1e4da6171284e5aac40bec16ac41092"
            x="0"
            y="0"
            width="8"
            height="8"
            patternUnits="userSpaceOnUse"
          >
            <rect x="0" y="0" width="8" height="8" fill="#E5B9B7" />
            <rect x="0" y="0" width="1" height="1" fill="#DBEEF3" />
            <rect x="1" y="0" width="1" height="1" fill="#DBEEF3" />
            <rect x="2" y="0" width="1" height="1" fill="#DBEEF3" />
            <rect x="3" y="0" width="1" height="1" fill="#DBEEF3" />
            <rect x="4" y="4" width="1" height="1" fill="#DBEEF3" />
            <rect x="5" y="4" width="1" height="1" fill="#DBEEF3" />
            <rect x="6" y="4" width="1" height="1" fill="#DBEEF3" />
            <rect x="7" y="4" width="1" height="1" fill="#DBEEF3" />
          </pattern>
          <polygon
            points="79.37,13.23 86.05,13.23 85.98,19.91 79.37,19.91 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="85.92,13.23 92.66,13.23 92.53,19.84 85.92,19.84 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="92.53,13.23 99.21,13.23 99.15,19.91 92.53,19.91 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="66.14,19.84 72.82,19.84 72.76,26.46 66.14,26.46 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="72.69,19.84 79.44,19.84 79.3,26.46 72.69,26.46 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="79.3,19.78 85.98,19.78 85.92,26.52 79.3,26.52 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="92.6,19.78 99.21,19.78 99.21,26.52 92.6,26.52 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="79.37,26.39 86.05,26.39 85.98,33.07 79.37,33.07 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="85.92,26.46 92.66,26.46 92.53,33.07 85.92,33.07 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="92.53,26.39 99.21,26.39 99.15,33.14 92.53,33.14 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="66.14,33.07 72.82,33.07 72.76,39.69 66.14,39.69 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="72.69,33.07 79.37,33.07 79.3,39.75 72.69,39.75 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="92.6,33 99.21,33 99.21,39.75 92.6,39.75 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="72.76,39.62 79.37,39.62 79.37,46.3 72.76,46.3 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="92.6,39.62 99.21,39.62 99.21,46.3 92.6,46.3 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="66.14,46.3 72.76,46.3 72.76,52.98 66.14,52.98 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="85.98,46.3 92.6,46.3 92.6,52.91 85.98,52.91 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="66.14,52.85 72.76,52.85 72.76,59.53 66.14,59.53 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="79.37,52.91 85.98,52.91 85.98,59.53 79.37,59.53 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="92.6,52.91 99.21,52.91 99.21,59.53 92.6,59.53 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="72.76,59.53 79.37,59.53 79.37,66.14 72.76,66.14 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="13.23,66.14 19.91,66.14 19.84,72.82 13.23,72.82 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="19.78,66.14 26.52,66.14 26.39,72.82 19.78,72.82 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="26.39,66.14 33.14,66.14 33,72.82 26.39,72.82 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="33,66.14 39.75,66.14 39.62,72.76 33,72.76 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="39.62,66.14 46.3,66.14 46.23,72.76 39.62,72.76 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="52.91,66.14 59.59,66.14 59.53,72.76 52.91,72.76 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="59.46,66.14 66.21,66.14 66.08,72.82 59.46,72.82 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="66.08,66.14 72.76,66.14 72.69,72.76 66.08,72.76 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="85.98,66.14 92.6,66.14 92.6,72.82 85.98,72.82 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="99.21,66.14 105.83,66.14 105.83,72.82 99.21,72.82 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="112.44,66.14 119.06,66.14 119.06,72.76 112.44,72.76 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="125.67,66.14 132.28,66.14 132.28,72.82 125.67,72.82 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="138.9,66.14 145.51,66.14 145.51,72.82 138.9,72.82 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="13.23,72.69 19.91,72.69 19.84,79.37 13.23,79.37 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="19.78,72.69 26.52,72.69 26.39,79.37 19.78,79.37 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="26.39,72.69 33.07,72.69 33,79.44 26.39,79.44 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="46.3,72.76 52.91,72.76 52.91,79.44 46.3,79.44 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="59.53,72.69 66.14,72.69 66.14,79.37 59.53,79.37 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="72.76,72.76 79.37,72.76 79.37,79.44 72.76,79.44 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="85.98,72.69 92.66,72.69 92.6,79.37 85.98,79.37 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="92.53,72.76 99.28,72.76 99.15,79.44 92.53,79.44 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="99.15,72.69 105.89,72.69 105.76,79.37 99.15,79.37 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="105.76,72.76 112.44,72.76 112.37,79.44 105.76,79.44 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="125.67,72.69 132.35,72.69 132.28,79.44 125.67,79.44 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="132.22,72.76 138.96,72.76 138.83,79.37 132.22,79.37 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="138.83,72.69 145.58,72.69 145.45,79.37 138.83,79.37 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="145.45,72.76 152.13,72.76 152.06,79.44 145.45,79.44 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="26.46,79.3 33.07,79.3 33.07,85.98 26.46,85.98 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="39.69,79.37 46.37,79.37 46.3,85.98 39.69,85.98 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="46.23,79.3 52.98,79.3 52.85,85.98 46.23,85.98 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="52.85,79.37 59.53,79.37 59.46,85.98 52.85,85.98 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="66.14,79.37 72.82,79.37 72.76,85.98 66.14,85.98 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="72.69,79.3 79.37,79.3 79.3,85.98 72.69,85.98 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="92.6,79.3 99.21,79.3 99.21,86.05 92.6,86.05 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="105.83,79.3 112.51,79.3 112.44,86.05 105.83,86.05 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="112.37,79.37 119.06,79.37 118.99,85.98 112.37,85.98 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="125.67,79.3 132.28,79.3 132.28,85.98 125.67,85.98 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="145.51,79.3 152.13,79.3 152.13,86.05 145.51,86.05 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="13.23,85.98 19.84,85.98 19.84,92.6 13.23,92.6 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="33.07,85.98 39.69,85.98 39.69,92.66 33.07,92.66 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="85.98,85.98 92.66,85.98 92.6,92.6 85.98,92.6 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="92.53,85.92 99.28,85.92 99.15,92.66 92.53,92.66 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="99.15,85.98 105.89,85.98 105.76,92.6 99.15,92.6 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="105.76,85.92 112.44,85.92 112.37,92.6 105.76,92.6 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="132.28,85.98 138.96,85.98 138.9,92.6 132.28,92.6 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="138.83,85.98 145.58,85.98 145.45,92.66 138.83,92.66 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="145.45,85.92 152.13,85.92 152.06,92.6 145.45,92.6 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="19.84,92.6 26.46,92.6 26.46,99.21 19.84,99.21 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="33.07,92.53 39.75,92.53 39.69,99.21 33.07,99.21 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="39.62,92.6 46.3,92.6 46.23,99.21 39.62,99.21 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="52.91,92.6 59.53,92.6 59.53,99.21 52.91,99.21 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="66.14,92.6 72.82,92.6 72.76,99.28 66.14,99.28 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="72.69,92.6 79.37,92.6 79.3,99.21 72.69,99.21 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="92.6,92.53 99.21,92.53 99.21,99.28 92.6,99.28 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="112.44,92.6 119.06,92.6 119.06,99.28 112.44,99.28 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="138.9,92.53 145.51,92.53 145.51,99.21 138.9,99.21 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="66.14,99.15 72.76,99.15 72.76,105.89 66.14,105.89 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="79.37,99.21 85.98,99.21 85.98,105.83 79.37,105.83 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="92.6,99.15 99.21,99.15 99.21,105.83 92.6,105.83 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="112.44,99.15 119.06,99.15 119.06,105.83 112.44,105.83 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="132.28,99.21 138.9,99.21 138.9,105.83 132.28,105.83 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="66.14,105.76 72.76,105.76 72.76,112.44 66.14,112.44 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="85.98,105.83 92.6,105.83 92.6,112.44 85.98,112.44 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="99.21,105.83 105.83,105.83 105.83,112.44 99.21,112.44 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="119.06,105.83 125.74,105.83 125.67,112.51 119.06,112.51 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="125.6,105.83 132.28,105.83 132.22,112.44 125.6,112.44 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="138.9,105.83 145.58,105.83 145.51,112.44 138.9,112.44 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="145.45,105.83 152.13,105.83 152.06,112.51 145.45,112.51 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="72.76,112.44 79.44,112.44 79.37,119.12 72.76,119.12 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="79.3,112.44 85.98,112.44 85.92,119.12 79.3,119.12 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="112.44,112.44 119.12,112.44 119.06,119.06 112.44,119.06 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="118.99,112.37 125.67,112.37 125.6,119.12 118.99,119.12 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="132.28,112.44 138.9,112.44 138.9,119.12 132.28,119.12 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="145.51,112.37 152.13,112.37 152.13,119.06 145.51,119.06 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="66.14,119.06 72.82,119.06 72.76,125.74 66.14,125.74 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="72.69,118.99 79.44,118.99 79.3,125.74 72.69,125.74 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="79.3,118.99 86.05,118.99 85.92,125.67 79.3,125.67 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="85.92,119.06 92.6,119.06 92.53,125.74 85.92,125.74 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="99.21,119.06 105.83,119.06 105.83,125.74 99.21,125.74 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="119.06,118.99 125.74,118.99 125.67,125.67 119.06,125.67 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="125.6,119.06 132.35,119.06 132.22,125.74 125.6,125.74 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="132.22,118.99 138.9,118.99 138.83,125.74 132.22,125.74 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="66.14,125.6 72.82,125.6 72.76,132.35 66.14,132.35 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="72.69,125.6 79.37,125.6 79.3,132.35 72.69,132.35 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="85.98,125.6 92.66,125.6 92.6,132.28 85.98,132.28 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="92.53,125.67 99.28,125.67 99.15,132.35 92.53,132.35 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="99.15,125.6 105.89,125.6 105.76,132.28 99.15,132.28 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="105.76,125.67 112.51,125.67 112.37,132.35 105.76,132.35 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="112.37,125.67 119.06,125.67 118.99,132.35 112.37,132.35 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="125.67,125.6 132.35,125.6 132.28,132.35 125.67,132.35 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="132.22,125.6 138.9,125.6 138.83,132.35 132.22,132.35 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="66.14,132.22 72.82,132.22 72.76,138.96 66.14,138.96 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="72.69,132.22 79.37,132.22 79.3,138.9 72.69,138.9 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="92.6,132.22 99.21,132.22 99.21,138.96 92.6,138.96 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="105.83,132.22 112.51,132.22 112.44,138.96 105.83,138.96 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="112.37,132.22 119.06,132.22 118.99,138.96 112.37,138.96 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="125.67,132.22 132.35,132.22 132.28,138.9 125.67,138.9 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="132.22,132.22 138.9,132.22 138.83,138.96 132.22,138.96 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="66.14,138.83 72.76,138.83 72.76,145.58 66.14,145.58 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="79.37,138.9 86.05,138.9 85.98,145.58 79.37,145.58 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="85.92,138.9 92.66,138.9 92.53,145.51 85.92,145.51 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="92.53,138.83 99.28,138.83 99.15,145.58 92.53,145.58 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="99.15,138.9 105.89,138.9 105.76,145.51 99.15,145.51 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="105.76,138.83 112.51,138.83 112.37,145.51 105.76,145.51 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="112.37,138.83 119.12,138.83 118.99,145.58 112.37,145.58 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="118.99,138.9 125.67,138.9 125.6,145.51 118.99,145.51 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="132.28,138.83 138.96,138.83 138.9,145.58 132.28,145.58 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="138.83,138.9 145.51,138.9 145.45,145.51 138.83,145.51 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="66.14,145.45 72.82,145.45 72.76,152.13 66.14,152.13 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="72.69,145.51 79.44,145.51 79.3,152.13 72.69,152.13 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="79.3,145.45 85.98,145.45 85.92,152.13 79.3,152.13 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="92.6,145.45 99.21,145.45 99.21,152.13 92.6,152.13 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="112.44,145.45 119.06,145.45 119.06,152.13 112.44,152.13 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
          <polygon
            points="132.28,145.45 138.9,145.45 138.9,152.13 132.28,152.13 "
            style="fill:url(#hatcha1e4da6171284e5aac40bec16ac41092);"
          />
      `,
            },
            {
                value: 8,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(87,118,157,1);"
            shape-rendering="crispEdges"
          />
          <linearGradient
            id="gradient8de752c176384710a7bf6eb6127ff1b9"
            gradientUnits="userSpaceOnUse"
            x1="7.72605761144101"
            y1="76.1197884622769"
            x2="157.628262914682"
            y2="89.2345320638461"
          >
            <stop offset="0%" stop-color="#DBEEF3" />
            <stop offset="100%" stop-color="#CBB8A8" />
          </linearGradient>
          <polygon
            points="13.23,13.23 59.53,13.23 59.53,59.53 13.23,59.53 13.23,19.78 19.84,19.78 19.84,52.91 52.91,52.91 52.91,19.84 13.23,19.84 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="13.23,105.83 59.53,105.83 59.53,152.13 13.23,152.13 13.23,112.37 19.84,112.37 19.84,145.51 52.91,145.51 52.91,112.44 13.23,112.44 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="105.83,13.23 152.13,13.23 152.13,59.53 105.83,59.53 105.83,19.78 112.44,19.78 112.44,52.91 145.51,52.91 145.51,19.84 105.83,19.84 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="26.46,26.46 46.3,26.46 46.3,46.3 26.46,46.3 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="26.46,119.06 46.3,119.06 46.3,138.9 26.46,138.9 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="119.06,26.46 138.9,26.46 138.9,46.3 119.06,46.3 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="84.66,16.54 84.4,17.53 83.67,18.25 82.68,18.52 81.69,18.25 80.96,17.53 80.69,16.54 80.96,15.54 81.69,14.82 82.68,14.55 83.67,14.82 84.4,15.54 84.66,16.54 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="91.28,16.54 91.01,17.53 90.28,18.25 89.29,18.52 88.3,18.25 87.57,17.53 87.31,16.54 87.57,15.54 88.3,14.82 89.29,14.55 90.28,14.82 91.01,15.54 91.28,16.54 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="97.89,16.54 97.62,17.53 96.9,18.25 95.91,18.52 94.91,18.25 94.19,17.53 93.92,16.54 94.19,15.54 94.91,14.82 95.91,14.55 96.9,14.82 97.62,15.54 97.89,16.54 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="71.43,23.15 71.17,24.14 70.44,24.87 69.45,25.13 68.46,24.87 67.73,24.14 67.46,23.15 67.73,22.16 68.46,21.43 69.45,21.17 70.44,21.43 71.17,22.16 71.43,23.15 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="78.05,23.15 77.78,24.14 77.06,24.87 76.06,25.13 75.07,24.87 74.34,24.14 74.08,23.15 74.34,22.16 75.07,21.43 76.06,21.17 77.06,21.43 77.78,22.16 78.05,23.15 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="84.66,23.15 84.4,24.14 83.67,24.87 82.68,25.13 81.69,24.87 80.96,24.14 80.69,23.15 80.96,22.16 81.69,21.43 82.68,21.17 83.67,21.43 84.4,22.16 84.66,23.15 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="97.89,23.15 97.62,24.14 96.9,24.87 95.91,25.13 94.91,24.87 94.19,24.14 93.92,23.15 94.19,22.16 94.91,21.43 95.91,21.17 96.9,21.43 97.62,22.16 97.89,23.15 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="84.66,29.76 84.4,30.76 83.67,31.48 82.68,31.75 81.69,31.48 80.96,30.76 80.69,29.76 80.96,28.77 81.69,28.05 82.68,27.78 83.67,28.05 84.4,28.77 84.66,29.76 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="91.28,29.76 91.01,30.76 90.28,31.48 89.29,31.75 88.3,31.48 87.57,30.76 87.31,29.76 87.57,28.77 88.3,28.05 89.29,27.78 90.28,28.05 91.01,28.77 91.28,29.76 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="97.89,29.76 97.62,30.76 96.9,31.48 95.91,31.75 94.91,31.48 94.19,30.76 93.92,29.76 94.19,28.77 94.91,28.05 95.91,27.78 96.9,28.05 97.62,28.77 97.89,29.76 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="71.43,36.38 71.17,37.37 70.44,38.1 69.45,38.36 68.46,38.1 67.73,37.37 67.46,36.38 67.73,35.39 68.46,34.66 69.45,34.39 70.44,34.66 71.17,35.39 71.43,36.38 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="78.05,36.38 77.78,37.37 77.06,38.1 76.06,38.36 75.07,38.1 74.34,37.37 74.08,36.38 74.34,35.39 75.07,34.66 76.06,34.39 77.06,34.66 77.78,35.39 78.05,36.38 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="97.89,36.38 97.62,37.37 96.9,38.1 95.91,38.36 94.91,38.1 94.19,37.37 93.92,36.38 94.19,35.39 94.91,34.66 95.91,34.39 96.9,34.66 97.62,35.39 97.89,36.38 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="78.05,42.99 77.78,43.98 77.06,44.71 76.06,44.98 75.07,44.71 74.34,43.98 74.08,42.99 74.34,42 75.07,41.27 76.06,41.01 77.06,41.27 77.78,42 78.05,42.99 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="97.89,42.99 97.62,43.98 96.9,44.71 95.91,44.98 94.91,44.71 94.19,43.98 93.92,42.99 94.19,42 94.91,41.27 95.91,41.01 96.9,41.27 97.62,42 97.89,42.99 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="71.43,49.61 71.17,50.6 70.44,51.32 69.45,51.59 68.46,51.32 67.73,50.6 67.46,49.61 67.73,48.61 68.46,47.89 69.45,47.62 70.44,47.89 71.17,48.61 71.43,49.61 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="91.28,49.61 91.01,50.6 90.28,51.32 89.29,51.59 88.3,51.32 87.57,50.6 87.31,49.61 87.57,48.61 88.3,47.89 89.29,47.62 90.28,47.89 91.01,48.61 91.28,49.61 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="71.43,56.22 71.17,57.21 70.44,57.94 69.45,58.2 68.46,57.94 67.73,57.21 67.46,56.22 67.73,55.23 68.46,54.5 69.45,54.24 70.44,54.5 71.17,55.23 71.43,56.22 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="84.66,56.22 84.4,57.21 83.67,57.94 82.68,58.2 81.69,57.94 80.96,57.21 80.69,56.22 80.96,55.23 81.69,54.5 82.68,54.24 83.67,54.5 84.4,55.23 84.66,56.22 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="97.89,56.22 97.62,57.21 96.9,57.94 95.91,58.2 94.91,57.94 94.19,57.21 93.92,56.22 94.19,55.23 94.91,54.5 95.91,54.24 96.9,54.5 97.62,55.23 97.89,56.22 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="78.05,62.83 77.78,63.83 77.06,64.55 76.06,64.82 75.07,64.55 74.34,63.83 74.08,62.83 74.34,61.84 75.07,61.12 76.06,60.85 77.06,61.12 77.78,61.84 78.05,62.83 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="18.52,69.45 18.25,70.44 17.53,71.17 16.54,71.43 15.54,71.17 14.82,70.44 14.55,69.45 14.82,68.46 15.54,67.73 16.54,67.46 17.53,67.73 18.25,68.46 18.52,69.45 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="25.13,69.45 24.87,70.44 24.14,71.17 23.15,71.43 22.16,71.17 21.43,70.44 21.17,69.45 21.43,68.46 22.16,67.73 23.15,67.46 24.14,67.73 24.87,68.46 25.13,69.45 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="31.75,69.45 31.48,70.44 30.76,71.17 29.76,71.43 28.77,71.17 28.05,70.44 27.78,69.45 28.05,68.46 28.77,67.73 29.76,67.46 30.76,67.73 31.48,68.46 31.75,69.45 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="38.36,69.45 38.1,70.44 37.37,71.17 36.38,71.43 35.39,71.17 34.66,70.44 34.39,69.45 34.66,68.46 35.39,67.73 36.38,67.46 37.37,67.73 38.1,68.46 38.36,69.45 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="44.98,69.45 44.71,70.44 43.98,71.17 42.99,71.43 42,71.17 41.27,70.44 41.01,69.45 41.27,68.46 42,67.73 42.99,67.46 43.98,67.73 44.71,68.46 44.98,69.45 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="58.2,69.45 57.94,70.44 57.21,71.17 56.22,71.43 55.23,71.17 54.5,70.44 54.24,69.45 54.5,68.46 55.23,67.73 56.22,67.46 57.21,67.73 57.94,68.46 58.2,69.45 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="64.82,69.45 64.55,70.44 63.83,71.17 62.83,71.43 61.84,71.17 61.12,70.44 60.85,69.45 61.12,68.46 61.84,67.73 62.83,67.46 63.83,67.73 64.55,68.46 64.82,69.45 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="71.43,69.45 71.17,70.44 70.44,71.17 69.45,71.43 68.46,71.17 67.73,70.44 67.46,69.45 67.73,68.46 68.46,67.73 69.45,67.46 70.44,67.73 71.17,68.46 71.43,69.45 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="91.28,69.45 91.01,70.44 90.28,71.17 89.29,71.43 88.3,71.17 87.57,70.44 87.31,69.45 87.57,68.46 88.3,67.73 89.29,67.46 90.28,67.73 91.01,68.46 91.28,69.45 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="104.5,69.45 104.24,70.44 103.51,71.17 102.52,71.43 101.53,71.17 100.8,70.44 100.54,69.45 100.8,68.46 101.53,67.73 102.52,67.46 103.51,67.73 104.24,68.46 104.5,69.45 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="117.73,69.45 117.47,70.44 116.74,71.17 115.75,71.43 114.76,71.17 114.03,70.44 113.76,69.45 114.03,68.46 114.76,67.73 115.75,67.46 116.74,67.73 117.47,68.46 117.73,69.45 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="130.96,69.45 130.69,70.44 129.97,71.17 128.98,71.43 127.98,71.17 127.26,70.44 126.99,69.45 127.26,68.46 127.98,67.73 128.98,67.46 129.97,67.73 130.69,68.46 130.96,69.45 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="144.19,69.45 143.92,70.44 143.2,71.17 142.2,71.43 141.21,71.17 140.49,70.44 140.22,69.45 140.49,68.46 141.21,67.73 142.2,67.46 143.2,67.73 143.92,68.46 144.19,69.45 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="18.52,76.06 18.25,77.06 17.53,77.78 16.54,78.05 15.54,77.78 14.82,77.06 14.55,76.06 14.82,75.07 15.54,74.34 16.54,74.08 17.53,74.34 18.25,75.07 18.52,76.06 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="25.13,76.06 24.87,77.06 24.14,77.78 23.15,78.05 22.16,77.78 21.43,77.06 21.17,76.06 21.43,75.07 22.16,74.34 23.15,74.08 24.14,74.34 24.87,75.07 25.13,76.06 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="31.75,76.06 31.48,77.06 30.76,77.78 29.76,78.05 28.77,77.78 28.05,77.06 27.78,76.06 28.05,75.07 28.77,74.34 29.76,74.08 30.76,74.34 31.48,75.07 31.75,76.06 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="51.59,76.06 51.32,77.06 50.6,77.78 49.61,78.05 48.61,77.78 47.89,77.06 47.62,76.06 47.89,75.07 48.61,74.34 49.61,74.08 50.6,74.34 51.32,75.07 51.59,76.06 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="64.82,76.06 64.55,77.06 63.83,77.78 62.83,78.05 61.84,77.78 61.12,77.06 60.85,76.06 61.12,75.07 61.84,74.34 62.83,74.08 63.83,74.34 64.55,75.07 64.82,76.06 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="78.05,76.06 77.78,77.06 77.06,77.78 76.06,78.05 75.07,77.78 74.34,77.06 74.08,76.06 74.34,75.07 75.07,74.34 76.06,74.08 77.06,74.34 77.78,75.07 78.05,76.06 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="91.28,76.06 91.01,77.06 90.28,77.78 89.29,78.05 88.3,77.78 87.57,77.06 87.31,76.06 87.57,75.07 88.3,74.34 89.29,74.08 90.28,74.34 91.01,75.07 91.28,76.06 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="97.89,76.06 97.62,77.06 96.9,77.78 95.91,78.05 94.91,77.78 94.19,77.06 93.92,76.06 94.19,75.07 94.91,74.34 95.91,74.08 96.9,74.34 97.62,75.07 97.89,76.06 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="104.5,76.06 104.24,77.06 103.51,77.78 102.52,78.05 101.53,77.78 100.8,77.06 100.54,76.06 100.8,75.07 101.53,74.34 102.52,74.08 103.51,74.34 104.24,75.07 104.5,76.06 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="111.12,76.06 110.85,77.06 110.13,77.78 109.13,78.05 108.14,77.78 107.42,77.06 107.15,76.06 107.42,75.07 108.14,74.34 109.13,74.08 110.13,74.34 110.85,75.07 111.12,76.06 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="130.96,76.06 130.69,77.06 129.97,77.78 128.98,78.05 127.98,77.78 127.26,77.06 126.99,76.06 127.26,75.07 127.98,74.34 128.98,74.08 129.97,74.34 130.69,75.07 130.96,76.06 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="137.57,76.06 137.31,77.06 136.58,77.78 135.59,78.05 134.6,77.78 133.87,77.06 133.61,76.06 133.87,75.07 134.6,74.34 135.59,74.08 136.58,74.34 137.31,75.07 137.57,76.06 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="144.19,76.06 143.92,77.06 143.2,77.78 142.2,78.05 141.21,77.78 140.49,77.06 140.22,76.06 140.49,75.07 141.21,74.34 142.2,74.08 143.2,74.34 143.92,75.07 144.19,76.06 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="150.8,76.06 150.54,77.06 149.81,77.78 148.82,78.05 147.83,77.78 147.1,77.06 146.83,76.06 147.1,75.07 147.83,74.34 148.82,74.08 149.81,74.34 150.54,75.07 150.8,76.06 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="31.75,82.68 31.48,83.67 30.76,84.4 29.76,84.66 28.77,84.4 28.05,83.67 27.78,82.68 28.05,81.69 28.77,80.96 29.76,80.69 30.76,80.96 31.48,81.69 31.75,82.68 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="44.98,82.68 44.71,83.67 43.98,84.4 42.99,84.66 42,84.4 41.27,83.67 41.01,82.68 41.27,81.69 42,80.96 42.99,80.69 43.98,80.96 44.71,81.69 44.98,82.68 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="51.59,82.68 51.32,83.67 50.6,84.4 49.61,84.66 48.61,84.4 47.89,83.67 47.62,82.68 47.89,81.69 48.61,80.96 49.61,80.69 50.6,80.96 51.32,81.69 51.59,82.68 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="58.2,82.68 57.94,83.67 57.21,84.4 56.22,84.66 55.23,84.4 54.5,83.67 54.24,82.68 54.5,81.69 55.23,80.96 56.22,80.69 57.21,80.96 57.94,81.69 58.2,82.68 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="71.43,82.68 71.17,83.67 70.44,84.4 69.45,84.66 68.46,84.4 67.73,83.67 67.46,82.68 67.73,81.69 68.46,80.96 69.45,80.69 70.44,80.96 71.17,81.69 71.43,82.68 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="78.05,82.68 77.78,83.67 77.06,84.4 76.06,84.66 75.07,84.4 74.34,83.67 74.08,82.68 74.34,81.69 75.07,80.96 76.06,80.69 77.06,80.96 77.78,81.69 78.05,82.68 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="97.89,82.68 97.62,83.67 96.9,84.4 95.91,84.66 94.91,84.4 94.19,83.67 93.92,82.68 94.19,81.69 94.91,80.96 95.91,80.69 96.9,80.96 97.62,81.69 97.89,82.68 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="111.12,82.68 110.85,83.67 110.13,84.4 109.13,84.66 108.14,84.4 107.42,83.67 107.15,82.68 107.42,81.69 108.14,80.96 109.13,80.69 110.13,80.96 110.85,81.69 111.12,82.68 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="117.73,82.68 117.47,83.67 116.74,84.4 115.75,84.66 114.76,84.4 114.03,83.67 113.76,82.68 114.03,81.69 114.76,80.96 115.75,80.69 116.74,80.96 117.47,81.69 117.73,82.68 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="130.96,82.68 130.69,83.67 129.97,84.4 128.98,84.66 127.98,84.4 127.26,83.67 126.99,82.68 127.26,81.69 127.98,80.96 128.98,80.69 129.97,80.96 130.69,81.69 130.96,82.68 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="150.8,82.68 150.54,83.67 149.81,84.4 148.82,84.66 147.83,84.4 147.1,83.67 146.83,82.68 147.1,81.69 147.83,80.96 148.82,80.69 149.81,80.96 150.54,81.69 150.8,82.68 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="18.52,89.29 18.25,90.28 17.53,91.01 16.54,91.28 15.54,91.01 14.82,90.28 14.55,89.29 14.82,88.3 15.54,87.57 16.54,87.31 17.53,87.57 18.25,88.3 18.52,89.29 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="38.36,89.29 38.1,90.28 37.37,91.01 36.38,91.28 35.39,91.01 34.66,90.28 34.39,89.29 34.66,88.3 35.39,87.57 36.38,87.31 37.37,87.57 38.1,88.3 38.36,89.29 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="91.28,89.29 91.01,90.28 90.28,91.01 89.29,91.28 88.3,91.01 87.57,90.28 87.31,89.29 87.57,88.3 88.3,87.57 89.29,87.31 90.28,87.57 91.01,88.3 91.28,89.29 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="97.89,89.29 97.62,90.28 96.9,91.01 95.91,91.28 94.91,91.01 94.19,90.28 93.92,89.29 94.19,88.3 94.91,87.57 95.91,87.31 96.9,87.57 97.62,88.3 97.89,89.29 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="104.5,89.29 104.24,90.28 103.51,91.01 102.52,91.28 101.53,91.01 100.8,90.28 100.54,89.29 100.8,88.3 101.53,87.57 102.52,87.31 103.51,87.57 104.24,88.3 104.5,89.29 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="111.12,89.29 110.85,90.28 110.13,91.01 109.13,91.28 108.14,91.01 107.42,90.28 107.15,89.29 107.42,88.3 108.14,87.57 109.13,87.31 110.13,87.57 110.85,88.3 111.12,89.29 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="137.57,89.29 137.31,90.28 136.58,91.01 135.59,91.28 134.6,91.01 133.87,90.28 133.61,89.29 133.87,88.3 134.6,87.57 135.59,87.31 136.58,87.57 137.31,88.3 137.57,89.29 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="144.19,89.29 143.92,90.28 143.2,91.01 142.2,91.28 141.21,91.01 140.49,90.28 140.22,89.29 140.49,88.3 141.21,87.57 142.2,87.31 143.2,87.57 143.92,88.3 144.19,89.29 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="150.8,89.29 150.54,90.28 149.81,91.01 148.82,91.28 147.83,91.01 147.1,90.28 146.83,89.29 147.1,88.3 147.83,87.57 148.82,87.31 149.81,87.57 150.54,88.3 150.8,89.29 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="25.13,95.91 24.87,96.9 24.14,97.62 23.15,97.89 22.16,97.62 21.43,96.9 21.17,95.91 21.43,94.91 22.16,94.19 23.15,93.92 24.14,94.19 24.87,94.91 25.13,95.91 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="38.36,95.91 38.1,96.9 37.37,97.62 36.38,97.89 35.39,97.62 34.66,96.9 34.39,95.91 34.66,94.91 35.39,94.19 36.38,93.92 37.37,94.19 38.1,94.91 38.36,95.91 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="44.98,95.91 44.71,96.9 43.98,97.62 42.99,97.89 42,97.62 41.27,96.9 41.01,95.91 41.27,94.91 42,94.19 42.99,93.92 43.98,94.19 44.71,94.91 44.98,95.91 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="58.2,95.91 57.94,96.9 57.21,97.62 56.22,97.89 55.23,97.62 54.5,96.9 54.24,95.91 54.5,94.91 55.23,94.19 56.22,93.92 57.21,94.19 57.94,94.91 58.2,95.91 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="71.43,95.91 71.17,96.9 70.44,97.62 69.45,97.89 68.46,97.62 67.73,96.9 67.46,95.91 67.73,94.91 68.46,94.19 69.45,93.92 70.44,94.19 71.17,94.91 71.43,95.91 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="78.05,95.91 77.78,96.9 77.06,97.62 76.06,97.89 75.07,97.62 74.34,96.9 74.08,95.91 74.34,94.91 75.07,94.19 76.06,93.92 77.06,94.19 77.78,94.91 78.05,95.91 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="97.89,95.91 97.62,96.9 96.9,97.62 95.91,97.89 94.91,97.62 94.19,96.9 93.92,95.91 94.19,94.91 94.91,94.19 95.91,93.92 96.9,94.19 97.62,94.91 97.89,95.91 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="117.73,95.91 117.47,96.9 116.74,97.62 115.75,97.89 114.76,97.62 114.03,96.9 113.76,95.91 114.03,94.91 114.76,94.19 115.75,93.92 116.74,94.19 117.47,94.91 117.73,95.91 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="144.19,95.91 143.92,96.9 143.2,97.62 142.2,97.89 141.21,97.62 140.49,96.9 140.22,95.91 140.49,94.91 141.21,94.19 142.2,93.92 143.2,94.19 143.92,94.91 144.19,95.91 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="71.43,102.52 71.17,103.51 70.44,104.24 69.45,104.5 68.46,104.24 67.73,103.51 67.46,102.52 67.73,101.53 68.46,100.8 69.45,100.54 70.44,100.8 71.17,101.53 71.43,102.52 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="84.66,102.52 84.4,103.51 83.67,104.24 82.68,104.5 81.69,104.24 80.96,103.51 80.69,102.52 80.96,101.53 81.69,100.8 82.68,100.54 83.67,100.8 84.4,101.53 84.66,102.52 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="97.89,102.52 97.62,103.51 96.9,104.24 95.91,104.5 94.91,104.24 94.19,103.51 93.92,102.52 94.19,101.53 94.91,100.8 95.91,100.54 96.9,100.8 97.62,101.53 97.89,102.52 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="117.73,102.52 117.47,103.51 116.74,104.24 115.75,104.5 114.76,104.24 114.03,103.51 113.76,102.52 114.03,101.53 114.76,100.8 115.75,100.54 116.74,100.8 117.47,101.53 117.73,102.52 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="137.57,102.52 137.31,103.51 136.58,104.24 135.59,104.5 134.6,104.24 133.87,103.51 133.61,102.52 133.87,101.53 134.6,100.8 135.59,100.54 136.58,100.8 137.31,101.53 137.57,102.52 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="71.43,109.13 71.17,110.13 70.44,110.85 69.45,111.12 68.46,110.85 67.73,110.13 67.46,109.13 67.73,108.14 68.46,107.42 69.45,107.15 70.44,107.42 71.17,108.14 71.43,109.13 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="91.28,109.13 91.01,110.13 90.28,110.85 89.29,111.12 88.3,110.85 87.57,110.13 87.31,109.13 87.57,108.14 88.3,107.42 89.29,107.15 90.28,107.42 91.01,108.14 91.28,109.13 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="104.5,109.13 104.24,110.13 103.51,110.85 102.52,111.12 101.53,110.85 100.8,110.13 100.54,109.13 100.8,108.14 101.53,107.42 102.52,107.15 103.51,107.42 104.24,108.14 104.5,109.13 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="124.35,109.13 124.08,110.13 123.35,110.85 122.36,111.12 121.37,110.85 120.64,110.13 120.38,109.13 120.64,108.14 121.37,107.42 122.36,107.15 123.35,107.42 124.08,108.14 124.35,109.13 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="130.96,109.13 130.69,110.13 129.97,110.85 128.98,111.12 127.98,110.85 127.26,110.13 126.99,109.13 127.26,108.14 127.98,107.42 128.98,107.15 129.97,107.42 130.69,108.14 130.96,109.13 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="144.19,109.13 143.92,110.13 143.2,110.85 142.2,111.12 141.21,110.85 140.49,110.13 140.22,109.13 140.49,108.14 141.21,107.42 142.2,107.15 143.2,107.42 143.92,108.14 144.19,109.13 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="150.8,109.13 150.54,110.13 149.81,110.85 148.82,111.12 147.83,110.85 147.1,110.13 146.83,109.13 147.1,108.14 147.83,107.42 148.82,107.15 149.81,107.42 150.54,108.14 150.8,109.13 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="78.05,115.75 77.78,116.74 77.06,117.47 76.06,117.73 75.07,117.47 74.34,116.74 74.08,115.75 74.34,114.76 75.07,114.03 76.06,113.76 77.06,114.03 77.78,114.76 78.05,115.75 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="84.66,115.75 84.4,116.74 83.67,117.47 82.68,117.73 81.69,117.47 80.96,116.74 80.69,115.75 80.96,114.76 81.69,114.03 82.68,113.76 83.67,114.03 84.4,114.76 84.66,115.75 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="117.73,115.75 117.47,116.74 116.74,117.47 115.75,117.73 114.76,117.47 114.03,116.74 113.76,115.75 114.03,114.76 114.76,114.03 115.75,113.76 116.74,114.03 117.47,114.76 117.73,115.75 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="124.35,115.75 124.08,116.74 123.35,117.47 122.36,117.73 121.37,117.47 120.64,116.74 120.38,115.75 120.64,114.76 121.37,114.03 122.36,113.76 123.35,114.03 124.08,114.76 124.35,115.75 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="137.57,115.75 137.31,116.74 136.58,117.47 135.59,117.73 134.6,117.47 133.87,116.74 133.61,115.75 133.87,114.76 134.6,114.03 135.59,113.76 136.58,114.03 137.31,114.76 137.57,115.75 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="150.8,115.75 150.54,116.74 149.81,117.47 148.82,117.73 147.83,117.47 147.1,116.74 146.83,115.75 147.1,114.76 147.83,114.03 148.82,113.76 149.81,114.03 150.54,114.76 150.8,115.75 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="71.43,122.36 71.17,123.35 70.44,124.08 69.45,124.35 68.46,124.08 67.73,123.35 67.46,122.36 67.73,121.37 68.46,120.64 69.45,120.38 70.44,120.64 71.17,121.37 71.43,122.36 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="78.05,122.36 77.78,123.35 77.06,124.08 76.06,124.35 75.07,124.08 74.34,123.35 74.08,122.36 74.34,121.37 75.07,120.64 76.06,120.38 77.06,120.64 77.78,121.37 78.05,122.36 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="84.66,122.36 84.4,123.35 83.67,124.08 82.68,124.35 81.69,124.08 80.96,123.35 80.69,122.36 80.96,121.37 81.69,120.64 82.68,120.38 83.67,120.64 84.4,121.37 84.66,122.36 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="91.28,122.36 91.01,123.35 90.28,124.08 89.29,124.35 88.3,124.08 87.57,123.35 87.31,122.36 87.57,121.37 88.3,120.64 89.29,120.38 90.28,120.64 91.01,121.37 91.28,122.36 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="104.5,122.36 104.24,123.35 103.51,124.08 102.52,124.35 101.53,124.08 100.8,123.35 100.54,122.36 100.8,121.37 101.53,120.64 102.52,120.38 103.51,120.64 104.24,121.37 104.5,122.36 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="124.35,122.36 124.08,123.35 123.35,124.08 122.36,124.35 121.37,124.08 120.64,123.35 120.38,122.36 120.64,121.37 121.37,120.64 122.36,120.38 123.35,120.64 124.08,121.37 124.35,122.36 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="130.96,122.36 130.69,123.35 129.97,124.08 128.98,124.35 127.98,124.08 127.26,123.35 126.99,122.36 127.26,121.37 127.98,120.64 128.98,120.38 129.97,120.64 130.69,121.37 130.96,122.36 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="137.57,122.36 137.31,123.35 136.58,124.08 135.59,124.35 134.6,124.08 133.87,123.35 133.61,122.36 133.87,121.37 134.6,120.64 135.59,120.38 136.58,120.64 137.31,121.37 137.57,122.36 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="71.43,128.98 71.17,129.97 70.44,130.69 69.45,130.96 68.46,130.69 67.73,129.97 67.46,128.98 67.73,127.98 68.46,127.26 69.45,126.99 70.44,127.26 71.17,127.98 71.43,128.98 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="78.05,128.98 77.78,129.97 77.06,130.69 76.06,130.96 75.07,130.69 74.34,129.97 74.08,128.98 74.34,127.98 75.07,127.26 76.06,126.99 77.06,127.26 77.78,127.98 78.05,128.98 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="91.28,128.98 91.01,129.97 90.28,130.69 89.29,130.96 88.3,130.69 87.57,129.97 87.31,128.98 87.57,127.98 88.3,127.26 89.29,126.99 90.28,127.26 91.01,127.98 91.28,128.98 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="97.89,128.98 97.62,129.97 96.9,130.69 95.91,130.96 94.91,130.69 94.19,129.97 93.92,128.98 94.19,127.98 94.91,127.26 95.91,126.99 96.9,127.26 97.62,127.98 97.89,128.98 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="104.5,128.98 104.24,129.97 103.51,130.69 102.52,130.96 101.53,130.69 100.8,129.97 100.54,128.98 100.8,127.98 101.53,127.26 102.52,126.99 103.51,127.26 104.24,127.98 104.5,128.98 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="111.12,128.98 110.85,129.97 110.13,130.69 109.13,130.96 108.14,130.69 107.42,129.97 107.15,128.98 107.42,127.98 108.14,127.26 109.13,126.99 110.13,127.26 110.85,127.98 111.12,128.98 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="117.73,128.98 117.47,129.97 116.74,130.69 115.75,130.96 114.76,130.69 114.03,129.97 113.76,128.98 114.03,127.98 114.76,127.26 115.75,126.99 116.74,127.26 117.47,127.98 117.73,128.98 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="130.96,128.98 130.69,129.97 129.97,130.69 128.98,130.96 127.98,130.69 127.26,129.97 126.99,128.98 127.26,127.98 127.98,127.26 128.98,126.99 129.97,127.26 130.69,127.98 130.96,128.98 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="137.57,128.98 137.31,129.97 136.58,130.69 135.59,130.96 134.6,130.69 133.87,129.97 133.61,128.98 133.87,127.98 134.6,127.26 135.59,126.99 136.58,127.26 137.31,127.98 137.57,128.98 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="71.43,135.59 71.17,136.58 70.44,137.31 69.45,137.57 68.46,137.31 67.73,136.58 67.46,135.59 67.73,134.6 68.46,133.87 69.45,133.61 70.44,133.87 71.17,134.6 71.43,135.59 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="78.05,135.59 77.78,136.58 77.06,137.31 76.06,137.57 75.07,137.31 74.34,136.58 74.08,135.59 74.34,134.6 75.07,133.87 76.06,133.61 77.06,133.87 77.78,134.6 78.05,135.59 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="97.89,135.59 97.62,136.58 96.9,137.31 95.91,137.57 94.91,137.31 94.19,136.58 93.92,135.59 94.19,134.6 94.91,133.87 95.91,133.61 96.9,133.87 97.62,134.6 97.89,135.59 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="111.12,135.59 110.85,136.58 110.13,137.31 109.13,137.57 108.14,137.31 107.42,136.58 107.15,135.59 107.42,134.6 108.14,133.87 109.13,133.61 110.13,133.87 110.85,134.6 111.12,135.59 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="117.73,135.59 117.47,136.58 116.74,137.31 115.75,137.57 114.76,137.31 114.03,136.58 113.76,135.59 114.03,134.6 114.76,133.87 115.75,133.61 116.74,133.87 117.47,134.6 117.73,135.59 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="130.96,135.59 130.69,136.58 129.97,137.31 128.98,137.57 127.98,137.31 127.26,136.58 126.99,135.59 127.26,134.6 127.98,133.87 128.98,133.61 129.97,133.87 130.69,134.6 130.96,135.59 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="137.57,135.59 137.31,136.58 136.58,137.31 135.59,137.57 134.6,137.31 133.87,136.58 133.61,135.59 133.87,134.6 134.6,133.87 135.59,133.61 136.58,133.87 137.31,134.6 137.57,135.59 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="71.43,142.2 71.17,143.2 70.44,143.92 69.45,144.19 68.46,143.92 67.73,143.2 67.46,142.2 67.73,141.21 68.46,140.49 69.45,140.22 70.44,140.49 71.17,141.21 71.43,142.2 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="84.66,142.2 84.4,143.2 83.67,143.92 82.68,144.19 81.69,143.92 80.96,143.2 80.69,142.2 80.96,141.21 81.69,140.49 82.68,140.22 83.67,140.49 84.4,141.21 84.66,142.2 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="91.28,142.2 91.01,143.2 90.28,143.92 89.29,144.19 88.3,143.92 87.57,143.2 87.31,142.2 87.57,141.21 88.3,140.49 89.29,140.22 90.28,140.49 91.01,141.21 91.28,142.2 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="97.89,142.2 97.62,143.2 96.9,143.92 95.91,144.19 94.91,143.92 94.19,143.2 93.92,142.2 94.19,141.21 94.91,140.49 95.91,140.22 96.9,140.49 97.62,141.21 97.89,142.2 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="104.5,142.2 104.24,143.2 103.51,143.92 102.52,144.19 101.53,143.92 100.8,143.2 100.54,142.2 100.8,141.21 101.53,140.49 102.52,140.22 103.51,140.49 104.24,141.21 104.5,142.2 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="111.12,142.2 110.85,143.2 110.13,143.92 109.13,144.19 108.14,143.92 107.42,143.2 107.15,142.2 107.42,141.21 108.14,140.49 109.13,140.22 110.13,140.49 110.85,141.21 111.12,142.2 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="117.73,142.2 117.47,143.2 116.74,143.92 115.75,144.19 114.76,143.92 114.03,143.2 113.76,142.2 114.03,141.21 114.76,140.49 115.75,140.22 116.74,140.49 117.47,141.21 117.73,142.2 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="124.35,142.2 124.08,143.2 123.35,143.92 122.36,144.19 121.37,143.92 120.64,143.2 120.38,142.2 120.64,141.21 121.37,140.49 122.36,140.22 123.35,140.49 124.08,141.21 124.35,142.2 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="137.57,142.2 137.31,143.2 136.58,143.92 135.59,144.19 134.6,143.92 133.87,143.2 133.61,142.2 133.87,141.21 134.6,140.49 135.59,140.22 136.58,140.49 137.31,141.21 137.57,142.2 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="144.19,142.2 143.92,143.2 143.2,143.92 142.2,144.19 141.21,143.92 140.49,143.2 140.22,142.2 140.49,141.21 141.21,140.49 142.2,140.22 143.2,140.49 143.92,141.21 144.19,142.2 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="71.43,148.82 71.17,149.81 70.44,150.54 69.45,150.8 68.46,150.54 67.73,149.81 67.46,148.82 67.73,147.83 68.46,147.1 69.45,146.83 70.44,147.1 71.17,147.83 71.43,148.82 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="78.05,148.82 77.78,149.81 77.06,150.54 76.06,150.8 75.07,150.54 74.34,149.81 74.08,148.82 74.34,147.83 75.07,147.1 76.06,146.83 77.06,147.1 77.78,147.83 78.05,148.82 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="84.66,148.82 84.4,149.81 83.67,150.54 82.68,150.8 81.69,150.54 80.96,149.81 80.69,148.82 80.96,147.83 81.69,147.1 82.68,146.83 83.67,147.1 84.4,147.83 84.66,148.82 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="97.89,148.82 97.62,149.81 96.9,150.54 95.91,150.8 94.91,150.54 94.19,149.81 93.92,148.82 94.19,147.83 94.91,147.1 95.91,146.83 96.9,147.1 97.62,147.83 97.89,148.82 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="117.73,148.82 117.47,149.81 116.74,150.54 115.75,150.8 114.76,150.54 114.03,149.81 113.76,148.82 114.03,147.83 114.76,147.1 115.75,146.83 116.74,147.1 117.47,147.83 117.73,148.82 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
          <polygon
            points="137.57,148.82 137.31,149.81 136.58,150.54 135.59,150.8 134.6,150.54 133.87,149.81 133.61,148.82 133.87,147.83 134.6,147.1 135.59,146.83 136.58,147.1 137.31,147.83 137.57,148.82 "
            style="fill:url(#gradient8de752c176384710a7bf6eb6127ff1b9);"
          />
      `,
            },
            {
                value: 9,
                innerHtml: `
      <rect
          x="0"
          y="0"
          width="165.3543"
          height="165.3543"
          fill="red"
          style="fill:rgba(144,60,57,1);"
          shape-rendering="crispEdges"
        />
        <linearGradient
          id="gradiente61bf7b05498450e94216666bad1de37"
          gradientUnits="userSpaceOnUse"
          x1="9.78888088478347"
          y1="78.8572474050841"
          x2="155.56543964134"
          y2="86.497073121039"
        >
          <stop offset="0%" stop-color="#DBEEF3" />
          <stop offset="100%" stop-color="#FBD5B5" />
        </linearGradient>
        <polygon
          points="13.23,13.23 59.53,13.23 59.53,59.53 13.23,59.53 13.23,19.78 19.84,19.78 19.84,52.91 52.91,52.91 52.91,19.84 13.23,19.84 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="13.23,105.83 59.53,105.83 59.53,152.13 13.23,152.13 13.23,112.37 19.84,112.37 19.84,145.51 52.91,145.51 52.91,112.44 13.23,112.44 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="105.83,13.23 152.13,13.23 152.13,59.53 105.83,59.53 105.83,19.78 112.44,19.78 112.44,52.91 145.51,52.91 145.51,19.84 105.83,19.84 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="26.46,26.46 46.3,26.46 46.3,46.3 26.46,46.3 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="26.46,119.06 46.3,119.06 46.3,138.9 26.46,138.9 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="119.06,26.46 138.9,26.46 138.9,46.3 119.06,46.3 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="85.98,16.54 85.73,17.8 85.02,18.87 83.94,19.59 82.68,19.84 81.41,19.59 80.34,18.87 79.62,17.8 79.37,16.54 79.62,15.27 80.34,14.2 81.41,13.48 82.68,13.23 83.94,13.48 85.02,14.2 85.73,15.27 85.98,16.54 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="92.6,16.54 92.35,17.8 91.63,18.87 90.56,19.59 89.29,19.84 88.03,19.59 86.95,18.87 86.24,17.8 85.98,16.54 86.24,15.27 86.95,14.2 88.03,13.48 89.29,13.23 90.56,13.48 91.63,14.2 92.35,15.27 92.6,16.54 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="99.21,16.54 98.96,17.8 98.24,18.87 97.17,19.59 95.91,19.84 94.64,19.59 93.57,18.87 92.85,17.8 92.6,16.54 92.85,15.27 93.57,14.2 94.64,13.48 95.91,13.23 97.17,13.48 98.24,14.2 98.96,15.27 99.21,16.54 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="72.76,23.15 72.5,24.42 71.79,25.49 70.71,26.2 69.45,26.46 68.18,26.2 67.11,25.49 66.39,24.42 66.14,23.15 66.39,21.88 67.11,20.81 68.18,20.09 69.45,19.84 70.71,20.09 71.79,20.81 72.5,21.88 72.76,23.15 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="79.37,23.15 79.12,24.42 78.4,25.49 77.33,26.2 76.06,26.46 74.8,26.2 73.72,25.49 73.01,24.42 72.76,23.15 73.01,21.88 73.72,20.81 74.8,20.09 76.06,19.84 77.33,20.09 78.4,20.81 79.12,21.88 79.37,23.15 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="85.98,23.15 85.73,24.42 85.02,25.49 83.94,26.2 82.68,26.46 81.41,26.2 80.34,25.49 79.62,24.42 79.37,23.15 79.62,21.88 80.34,20.81 81.41,20.09 82.68,19.84 83.94,20.09 85.02,20.81 85.73,21.88 85.98,23.15 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="99.21,23.15 98.96,24.42 98.24,25.49 97.17,26.2 95.91,26.46 94.64,26.2 93.57,25.49 92.85,24.42 92.6,23.15 92.85,21.88 93.57,20.81 94.64,20.09 95.91,19.84 97.17,20.09 98.24,20.81 98.96,21.88 99.21,23.15 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="85.98,29.76 85.73,31.03 85.02,32.1 83.94,32.82 82.68,33.07 81.41,32.82 80.34,32.1 79.62,31.03 79.37,29.76 79.62,28.5 80.34,27.43 81.41,26.71 82.68,26.46 83.94,26.71 85.02,27.43 85.73,28.5 85.98,29.76 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="92.6,29.76 92.35,31.03 91.63,32.1 90.56,32.82 89.29,33.07 88.03,32.82 86.95,32.1 86.24,31.03 85.98,29.76 86.24,28.5 86.95,27.43 88.03,26.71 89.29,26.46 90.56,26.71 91.63,27.43 92.35,28.5 92.6,29.76 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="99.21,29.76 98.96,31.03 98.24,32.1 97.17,32.82 95.91,33.07 94.64,32.82 93.57,32.1 92.85,31.03 92.6,29.76 92.85,28.5 93.57,27.43 94.64,26.71 95.91,26.46 97.17,26.71 98.24,27.43 98.96,28.5 99.21,29.76 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="72.76,36.38 72.5,37.64 71.79,38.72 70.71,39.43 69.45,39.69 68.18,39.43 67.11,38.72 66.39,37.64 66.14,36.38 66.39,35.11 67.11,34.04 68.18,33.32 69.45,33.07 70.71,33.32 71.79,34.04 72.5,35.11 72.76,36.38 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="79.37,36.38 79.12,37.64 78.4,38.72 77.33,39.43 76.06,39.69 74.8,39.43 73.72,38.72 73.01,37.64 72.76,36.38 73.01,35.11 73.72,34.04 74.8,33.32 76.06,33.07 77.33,33.32 78.4,34.04 79.12,35.11 79.37,36.38 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="99.21,36.38 98.96,37.64 98.24,38.72 97.17,39.43 95.91,39.69 94.64,39.43 93.57,38.72 92.85,37.64 92.6,36.38 92.85,35.11 93.57,34.04 94.64,33.32 95.91,33.07 97.17,33.32 98.24,34.04 98.96,35.11 99.21,36.38 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="79.37,42.99 79.12,44.26 78.4,45.33 77.33,46.05 76.06,46.3 74.8,46.05 73.72,45.33 73.01,44.26 72.76,42.99 73.01,41.73 73.72,40.65 74.8,39.94 76.06,39.69 77.33,39.94 78.4,40.65 79.12,41.73 79.37,42.99 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="99.21,42.99 98.96,44.26 98.24,45.33 97.17,46.05 95.91,46.3 94.64,46.05 93.57,45.33 92.85,44.26 92.6,42.99 92.85,41.73 93.57,40.65 94.64,39.94 95.91,39.69 97.17,39.94 98.24,40.65 98.96,41.73 99.21,42.99 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="72.76,49.61 72.5,50.87 71.79,51.94 70.71,52.66 69.45,52.91 68.18,52.66 67.11,51.94 66.39,50.87 66.14,49.61 66.39,48.34 67.11,47.27 68.18,46.55 69.45,46.3 70.71,46.55 71.79,47.27 72.5,48.34 72.76,49.61 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="92.6,49.61 92.35,50.87 91.63,51.94 90.56,52.66 89.29,52.91 88.03,52.66 86.95,51.94 86.24,50.87 85.98,49.61 86.24,48.34 86.95,47.27 88.03,46.55 89.29,46.3 90.56,46.55 91.63,47.27 92.35,48.34 92.6,49.61 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="72.76,56.22 72.5,57.49 71.79,58.56 70.71,59.28 69.45,59.53 68.18,59.28 67.11,58.56 66.39,57.49 66.14,56.22 66.39,54.95 67.11,53.88 68.18,53.17 69.45,52.91 70.71,53.17 71.79,53.88 72.5,54.95 72.76,56.22 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="85.98,56.22 85.73,57.49 85.02,58.56 83.94,59.28 82.68,59.53 81.41,59.28 80.34,58.56 79.62,57.49 79.37,56.22 79.62,54.95 80.34,53.88 81.41,53.17 82.68,52.91 83.94,53.17 85.02,53.88 85.73,54.95 85.98,56.22 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="99.21,56.22 98.96,57.49 98.24,58.56 97.17,59.28 95.91,59.53 94.64,59.28 93.57,58.56 92.85,57.49 92.6,56.22 92.85,54.95 93.57,53.88 94.64,53.17 95.91,52.91 97.17,53.17 98.24,53.88 98.96,54.95 99.21,56.22 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="79.37,62.83 79.12,64.1 78.4,65.17 77.33,65.89 76.06,66.14 74.8,65.89 73.72,65.17 73.01,64.1 72.76,62.83 73.01,61.57 73.72,60.5 74.8,59.78 76.06,59.53 77.33,59.78 78.4,60.5 79.12,61.57 79.37,62.83 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="19.84,69.45 19.59,70.71 18.87,71.79 17.8,72.5 16.54,72.76 15.27,72.5 14.2,71.79 13.48,70.71 13.23,69.45 13.48,68.18 14.2,67.11 15.27,66.39 16.54,66.14 17.8,66.39 18.87,67.11 19.59,68.18 19.84,69.45 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="26.46,69.45 26.2,70.71 25.49,71.79 24.42,72.5 23.15,72.76 21.88,72.5 20.81,71.79 20.09,70.71 19.84,69.45 20.09,68.18 20.81,67.11 21.88,66.39 23.15,66.14 24.42,66.39 25.49,67.11 26.2,68.18 26.46,69.45 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="33.07,69.45 32.82,70.71 32.1,71.79 31.03,72.5 29.76,72.76 28.5,72.5 27.43,71.79 26.71,70.71 26.46,69.45 26.71,68.18 27.43,67.11 28.5,66.39 29.76,66.14 31.03,66.39 32.1,67.11 32.82,68.18 33.07,69.45 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="39.69,69.45 39.43,70.71 38.72,71.79 37.64,72.5 36.38,72.76 35.11,72.5 34.04,71.79 33.32,70.71 33.07,69.45 33.32,68.18 34.04,67.11 35.11,66.39 36.38,66.14 37.64,66.39 38.72,67.11 39.43,68.18 39.69,69.45 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="46.3,69.45 46.05,70.71 45.33,71.79 44.26,72.5 42.99,72.76 41.73,72.5 40.65,71.79 39.94,70.71 39.69,69.45 39.94,68.18 40.65,67.11 41.73,66.39 42.99,66.14 44.26,66.39 45.33,67.11 46.05,68.18 46.3,69.45 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="59.53,69.45 59.28,70.71 58.56,71.79 57.49,72.5 56.22,72.76 54.95,72.5 53.88,71.79 53.17,70.71 52.91,69.45 53.17,68.18 53.88,67.11 54.95,66.39 56.22,66.14 57.49,66.39 58.56,67.11 59.28,68.18 59.53,69.45 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="66.14,69.45 65.89,70.71 65.17,71.79 64.1,72.5 62.83,72.76 61.57,72.5 60.5,71.79 59.78,70.71 59.53,69.45 59.78,68.18 60.5,67.11 61.57,66.39 62.83,66.14 64.1,66.39 65.17,67.11 65.89,68.18 66.14,69.45 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="72.76,69.45 72.5,70.71 71.79,71.79 70.71,72.5 69.45,72.76 68.18,72.5 67.11,71.79 66.39,70.71 66.14,69.45 66.39,68.18 67.11,67.11 68.18,66.39 69.45,66.14 70.71,66.39 71.79,67.11 72.5,68.18 72.76,69.45 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="92.6,69.45 92.35,70.71 91.63,71.79 90.56,72.5 89.29,72.76 88.03,72.5 86.95,71.79 86.24,70.71 85.98,69.45 86.24,68.18 86.95,67.11 88.03,66.39 89.29,66.14 90.56,66.39 91.63,67.11 92.35,68.18 92.6,69.45 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="105.83,69.45 105.58,70.71 104.86,71.79 103.79,72.5 102.52,72.76 101.25,72.5 100.18,71.79 99.46,70.71 99.21,69.45 99.46,68.18 100.18,67.11 101.25,66.39 102.52,66.14 103.79,66.39 104.86,67.11 105.58,68.18 105.83,69.45 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="119.06,69.45 118.8,70.71 118.09,71.79 117.01,72.5 115.75,72.76 114.48,72.5 113.41,71.79 112.69,70.71 112.44,69.45 112.69,68.18 113.41,67.11 114.48,66.39 115.75,66.14 117.01,66.39 118.09,67.11 118.8,68.18 119.06,69.45 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="132.28,69.45 132.03,70.71 131.31,71.79 130.24,72.5 128.98,72.76 127.71,72.5 126.64,71.79 125.92,70.71 125.67,69.45 125.92,68.18 126.64,67.11 127.71,66.39 128.98,66.14 130.24,66.39 131.31,67.11 132.03,68.18 132.28,69.45 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="145.51,69.45 145.26,70.71 144.54,71.79 143.47,72.5 142.2,72.76 140.94,72.5 139.87,71.79 139.15,70.71 138.9,69.45 139.15,68.18 139.87,67.11 140.94,66.39 142.2,66.14 143.47,66.39 144.54,67.11 145.26,68.18 145.51,69.45 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="19.84,76.06 19.59,77.33 18.87,78.4 17.8,79.12 16.54,79.37 15.27,79.12 14.2,78.4 13.48,77.33 13.23,76.06 13.48,74.8 14.2,73.72 15.27,73.01 16.54,72.76 17.8,73.01 18.87,73.72 19.59,74.8 19.84,76.06 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="26.46,76.06 26.2,77.33 25.49,78.4 24.42,79.12 23.15,79.37 21.88,79.12 20.81,78.4 20.09,77.33 19.84,76.06 20.09,74.8 20.81,73.72 21.88,73.01 23.15,72.76 24.42,73.01 25.49,73.72 26.2,74.8 26.46,76.06 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="33.07,76.06 32.82,77.33 32.1,78.4 31.03,79.12 29.76,79.37 28.5,79.12 27.43,78.4 26.71,77.33 26.46,76.06 26.71,74.8 27.43,73.72 28.5,73.01 29.76,72.76 31.03,73.01 32.1,73.72 32.82,74.8 33.07,76.06 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="52.91,76.06 52.66,77.33 51.94,78.4 50.87,79.12 49.61,79.37 48.34,79.12 47.27,78.4 46.55,77.33 46.3,76.06 46.55,74.8 47.27,73.72 48.34,73.01 49.61,72.76 50.87,73.01 51.94,73.72 52.66,74.8 52.91,76.06 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="66.14,76.06 65.89,77.33 65.17,78.4 64.1,79.12 62.83,79.37 61.57,79.12 60.5,78.4 59.78,77.33 59.53,76.06 59.78,74.8 60.5,73.72 61.57,73.01 62.83,72.76 64.1,73.01 65.17,73.72 65.89,74.8 66.14,76.06 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="79.37,76.06 79.12,77.33 78.4,78.4 77.33,79.12 76.06,79.37 74.8,79.12 73.72,78.4 73.01,77.33 72.76,76.06 73.01,74.8 73.72,73.72 74.8,73.01 76.06,72.76 77.33,73.01 78.4,73.72 79.12,74.8 79.37,76.06 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="92.6,76.06 92.35,77.33 91.63,78.4 90.56,79.12 89.29,79.37 88.03,79.12 86.95,78.4 86.24,77.33 85.98,76.06 86.24,74.8 86.95,73.72 88.03,73.01 89.29,72.76 90.56,73.01 91.63,73.72 92.35,74.8 92.6,76.06 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="99.21,76.06 98.96,77.33 98.24,78.4 97.17,79.12 95.91,79.37 94.64,79.12 93.57,78.4 92.85,77.33 92.6,76.06 92.85,74.8 93.57,73.72 94.64,73.01 95.91,72.76 97.17,73.01 98.24,73.72 98.96,74.8 99.21,76.06 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="105.83,76.06 105.58,77.33 104.86,78.4 103.79,79.12 102.52,79.37 101.25,79.12 100.18,78.4 99.46,77.33 99.21,76.06 99.46,74.8 100.18,73.72 101.25,73.01 102.52,72.76 103.79,73.01 104.86,73.72 105.58,74.8 105.83,76.06 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="112.44,76.06 112.19,77.33 111.47,78.4 110.4,79.12 109.13,79.37 107.87,79.12 106.8,78.4 106.08,77.33 105.83,76.06 106.08,74.8 106.8,73.72 107.87,73.01 109.13,72.76 110.4,73.01 111.47,73.72 112.19,74.8 112.44,76.06 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="132.28,76.06 132.03,77.33 131.31,78.4 130.24,79.12 128.98,79.37 127.71,79.12 126.64,78.4 125.92,77.33 125.67,76.06 125.92,74.8 126.64,73.72 127.71,73.01 128.98,72.76 130.24,73.01 131.31,73.72 132.03,74.8 132.28,76.06 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="138.9,76.06 138.65,77.33 137.93,78.4 136.86,79.12 135.59,79.37 134.32,79.12 133.25,78.4 132.54,77.33 132.28,76.06 132.54,74.8 133.25,73.72 134.32,73.01 135.59,72.76 136.86,73.01 137.93,73.72 138.65,74.8 138.9,76.06 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="145.51,76.06 145.26,77.33 144.54,78.4 143.47,79.12 142.2,79.37 140.94,79.12 139.87,78.4 139.15,77.33 138.9,76.06 139.15,74.8 139.87,73.72 140.94,73.01 142.2,72.76 143.47,73.01 144.54,73.72 145.26,74.8 145.51,76.06 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="152.13,76.06 151.87,77.33 151.16,78.4 150.08,79.12 148.82,79.37 147.55,79.12 146.48,78.4 145.76,77.33 145.51,76.06 145.76,74.8 146.48,73.72 147.55,73.01 148.82,72.76 150.08,73.01 151.16,73.72 151.87,74.8 152.13,76.06 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="33.07,82.68 32.82,83.94 32.1,85.02 31.03,85.73 29.76,85.98 28.5,85.73 27.43,85.02 26.71,83.94 26.46,82.68 26.71,81.41 27.43,80.34 28.5,79.62 29.76,79.37 31.03,79.62 32.1,80.34 32.82,81.41 33.07,82.68 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="46.3,82.68 46.05,83.94 45.33,85.02 44.26,85.73 42.99,85.98 41.73,85.73 40.65,85.02 39.94,83.94 39.69,82.68 39.94,81.41 40.65,80.34 41.73,79.62 42.99,79.37 44.26,79.62 45.33,80.34 46.05,81.41 46.3,82.68 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="52.91,82.68 52.66,83.94 51.94,85.02 50.87,85.73 49.61,85.98 48.34,85.73 47.27,85.02 46.55,83.94 46.3,82.68 46.55,81.41 47.27,80.34 48.34,79.62 49.61,79.37 50.87,79.62 51.94,80.34 52.66,81.41 52.91,82.68 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="59.53,82.68 59.28,83.94 58.56,85.02 57.49,85.73 56.22,85.98 54.95,85.73 53.88,85.02 53.17,83.94 52.91,82.68 53.17,81.41 53.88,80.34 54.95,79.62 56.22,79.37 57.49,79.62 58.56,80.34 59.28,81.41 59.53,82.68 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="72.76,82.68 72.5,83.94 71.79,85.02 70.71,85.73 69.45,85.98 68.18,85.73 67.11,85.02 66.39,83.94 66.14,82.68 66.39,81.41 67.11,80.34 68.18,79.62 69.45,79.37 70.71,79.62 71.79,80.34 72.5,81.41 72.76,82.68 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="79.37,82.68 79.12,83.94 78.4,85.02 77.33,85.73 76.06,85.98 74.8,85.73 73.72,85.02 73.01,83.94 72.76,82.68 73.01,81.41 73.72,80.34 74.8,79.62 76.06,79.37 77.33,79.62 78.4,80.34 79.12,81.41 79.37,82.68 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="99.21,82.68 98.96,83.94 98.24,85.02 97.17,85.73 95.91,85.98 94.64,85.73 93.57,85.02 92.85,83.94 92.6,82.68 92.85,81.41 93.57,80.34 94.64,79.62 95.91,79.37 97.17,79.62 98.24,80.34 98.96,81.41 99.21,82.68 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="112.44,82.68 112.19,83.94 111.47,85.02 110.4,85.73 109.13,85.98 107.87,85.73 106.8,85.02 106.08,83.94 105.83,82.68 106.08,81.41 106.8,80.34 107.87,79.62 109.13,79.37 110.4,79.62 111.47,80.34 112.19,81.41 112.44,82.68 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="119.06,82.68 118.8,83.94 118.09,85.02 117.01,85.73 115.75,85.98 114.48,85.73 113.41,85.02 112.69,83.94 112.44,82.68 112.69,81.41 113.41,80.34 114.48,79.62 115.75,79.37 117.01,79.62 118.09,80.34 118.8,81.41 119.06,82.68 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="132.28,82.68 132.03,83.94 131.31,85.02 130.24,85.73 128.98,85.98 127.71,85.73 126.64,85.02 125.92,83.94 125.67,82.68 125.92,81.41 126.64,80.34 127.71,79.62 128.98,79.37 130.24,79.62 131.31,80.34 132.03,81.41 132.28,82.68 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="152.13,82.68 151.87,83.94 151.16,85.02 150.08,85.73 148.82,85.98 147.55,85.73 146.48,85.02 145.76,83.94 145.51,82.68 145.76,81.41 146.48,80.34 147.55,79.62 148.82,79.37 150.08,79.62 151.16,80.34 151.87,81.41 152.13,82.68 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="19.84,89.29 19.59,90.56 18.87,91.63 17.8,92.35 16.54,92.6 15.27,92.35 14.2,91.63 13.48,90.56 13.23,89.29 13.48,88.03 14.2,86.95 15.27,86.24 16.54,85.98 17.8,86.24 18.87,86.95 19.59,88.03 19.84,89.29 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="39.69,89.29 39.43,90.56 38.72,91.63 37.64,92.35 36.38,92.6 35.11,92.35 34.04,91.63 33.32,90.56 33.07,89.29 33.32,88.03 34.04,86.95 35.11,86.24 36.38,85.98 37.64,86.24 38.72,86.95 39.43,88.03 39.69,89.29 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="92.6,89.29 92.35,90.56 91.63,91.63 90.56,92.35 89.29,92.6 88.03,92.35 86.95,91.63 86.24,90.56 85.98,89.29 86.24,88.03 86.95,86.95 88.03,86.24 89.29,85.98 90.56,86.24 91.63,86.95 92.35,88.03 92.6,89.29 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="99.21,89.29 98.96,90.56 98.24,91.63 97.17,92.35 95.91,92.6 94.64,92.35 93.57,91.63 92.85,90.56 92.6,89.29 92.85,88.03 93.57,86.95 94.64,86.24 95.91,85.98 97.17,86.24 98.24,86.95 98.96,88.03 99.21,89.29 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="105.83,89.29 105.58,90.56 104.86,91.63 103.79,92.35 102.52,92.6 101.25,92.35 100.18,91.63 99.46,90.56 99.21,89.29 99.46,88.03 100.18,86.95 101.25,86.24 102.52,85.98 103.79,86.24 104.86,86.95 105.58,88.03 105.83,89.29 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="112.44,89.29 112.19,90.56 111.47,91.63 110.4,92.35 109.13,92.6 107.87,92.35 106.8,91.63 106.08,90.56 105.83,89.29 106.08,88.03 106.8,86.95 107.87,86.24 109.13,85.98 110.4,86.24 111.47,86.95 112.19,88.03 112.44,89.29 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="138.9,89.29 138.65,90.56 137.93,91.63 136.86,92.35 135.59,92.6 134.32,92.35 133.25,91.63 132.54,90.56 132.28,89.29 132.54,88.03 133.25,86.95 134.32,86.24 135.59,85.98 136.86,86.24 137.93,86.95 138.65,88.03 138.9,89.29 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="145.51,89.29 145.26,90.56 144.54,91.63 143.47,92.35 142.2,92.6 140.94,92.35 139.87,91.63 139.15,90.56 138.9,89.29 139.15,88.03 139.87,86.95 140.94,86.24 142.2,85.98 143.47,86.24 144.54,86.95 145.26,88.03 145.51,89.29 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="152.13,89.29 151.87,90.56 151.16,91.63 150.08,92.35 148.82,92.6 147.55,92.35 146.48,91.63 145.76,90.56 145.51,89.29 145.76,88.03 146.48,86.95 147.55,86.24 148.82,85.98 150.08,86.24 151.16,86.95 151.87,88.03 152.13,89.29 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="26.46,95.91 26.2,97.17 25.49,98.24 24.42,98.96 23.15,99.21 21.88,98.96 20.81,98.24 20.09,97.17 19.84,95.91 20.09,94.64 20.81,93.57 21.88,92.85 23.15,92.6 24.42,92.85 25.49,93.57 26.2,94.64 26.46,95.91 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="39.69,95.91 39.43,97.17 38.72,98.24 37.64,98.96 36.38,99.21 35.11,98.96 34.04,98.24 33.32,97.17 33.07,95.91 33.32,94.64 34.04,93.57 35.11,92.85 36.38,92.6 37.64,92.85 38.72,93.57 39.43,94.64 39.69,95.91 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="46.3,95.91 46.05,97.17 45.33,98.24 44.26,98.96 42.99,99.21 41.73,98.96 40.65,98.24 39.94,97.17 39.69,95.91 39.94,94.64 40.65,93.57 41.73,92.85 42.99,92.6 44.26,92.85 45.33,93.57 46.05,94.64 46.3,95.91 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="59.53,95.91 59.28,97.17 58.56,98.24 57.49,98.96 56.22,99.21 54.95,98.96 53.88,98.24 53.17,97.17 52.91,95.91 53.17,94.64 53.88,93.57 54.95,92.85 56.22,92.6 57.49,92.85 58.56,93.57 59.28,94.64 59.53,95.91 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="72.76,95.91 72.5,97.17 71.79,98.24 70.71,98.96 69.45,99.21 68.18,98.96 67.11,98.24 66.39,97.17 66.14,95.91 66.39,94.64 67.11,93.57 68.18,92.85 69.45,92.6 70.71,92.85 71.79,93.57 72.5,94.64 72.76,95.91 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="79.37,95.91 79.12,97.17 78.4,98.24 77.33,98.96 76.06,99.21 74.8,98.96 73.72,98.24 73.01,97.17 72.76,95.91 73.01,94.64 73.72,93.57 74.8,92.85 76.06,92.6 77.33,92.85 78.4,93.57 79.12,94.64 79.37,95.91 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="99.21,95.91 98.96,97.17 98.24,98.24 97.17,98.96 95.91,99.21 94.64,98.96 93.57,98.24 92.85,97.17 92.6,95.91 92.85,94.64 93.57,93.57 94.64,92.85 95.91,92.6 97.17,92.85 98.24,93.57 98.96,94.64 99.21,95.91 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="119.06,95.91 118.8,97.17 118.09,98.24 117.01,98.96 115.75,99.21 114.48,98.96 113.41,98.24 112.69,97.17 112.44,95.91 112.69,94.64 113.41,93.57 114.48,92.85 115.75,92.6 117.01,92.85 118.09,93.57 118.8,94.64 119.06,95.91 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="145.51,95.91 145.26,97.17 144.54,98.24 143.47,98.96 142.2,99.21 140.94,98.96 139.87,98.24 139.15,97.17 138.9,95.91 139.15,94.64 139.87,93.57 140.94,92.85 142.2,92.6 143.47,92.85 144.54,93.57 145.26,94.64 145.51,95.91 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="72.76,102.52 72.5,103.79 71.79,104.86 70.71,105.58 69.45,105.83 68.18,105.58 67.11,104.86 66.39,103.79 66.14,102.52 66.39,101.25 67.11,100.18 68.18,99.46 69.45,99.21 70.71,99.46 71.79,100.18 72.5,101.25 72.76,102.52 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="85.98,102.52 85.73,103.79 85.02,104.86 83.94,105.58 82.68,105.83 81.41,105.58 80.34,104.86 79.62,103.79 79.37,102.52 79.62,101.25 80.34,100.18 81.41,99.46 82.68,99.21 83.94,99.46 85.02,100.18 85.73,101.25 85.98,102.52 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="99.21,102.52 98.96,103.79 98.24,104.86 97.17,105.58 95.91,105.83 94.64,105.58 93.57,104.86 92.85,103.79 92.6,102.52 92.85,101.25 93.57,100.18 94.64,99.46 95.91,99.21 97.17,99.46 98.24,100.18 98.96,101.25 99.21,102.52 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="119.06,102.52 118.8,103.79 118.09,104.86 117.01,105.58 115.75,105.83 114.48,105.58 113.41,104.86 112.69,103.79 112.44,102.52 112.69,101.25 113.41,100.18 114.48,99.46 115.75,99.21 117.01,99.46 118.09,100.18 118.8,101.25 119.06,102.52 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="138.9,102.52 138.65,103.79 137.93,104.86 136.86,105.58 135.59,105.83 134.32,105.58 133.25,104.86 132.54,103.79 132.28,102.52 132.54,101.25 133.25,100.18 134.32,99.46 135.59,99.21 136.86,99.46 137.93,100.18 138.65,101.25 138.9,102.52 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="72.76,109.13 72.5,110.4 71.79,111.47 70.71,112.19 69.45,112.44 68.18,112.19 67.11,111.47 66.39,110.4 66.14,109.13 66.39,107.87 67.11,106.8 68.18,106.08 69.45,105.83 70.71,106.08 71.79,106.8 72.5,107.87 72.76,109.13 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="92.6,109.13 92.35,110.4 91.63,111.47 90.56,112.19 89.29,112.44 88.03,112.19 86.95,111.47 86.24,110.4 85.98,109.13 86.24,107.87 86.95,106.8 88.03,106.08 89.29,105.83 90.56,106.08 91.63,106.8 92.35,107.87 92.6,109.13 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="105.83,109.13 105.58,110.4 104.86,111.47 103.79,112.19 102.52,112.44 101.25,112.19 100.18,111.47 99.46,110.4 99.21,109.13 99.46,107.87 100.18,106.8 101.25,106.08 102.52,105.83 103.79,106.08 104.86,106.8 105.58,107.87 105.83,109.13 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="125.67,109.13 125.42,110.4 124.7,111.47 123.63,112.19 122.36,112.44 121.1,112.19 120.02,111.47 119.31,110.4 119.06,109.13 119.31,107.87 120.02,106.8 121.1,106.08 122.36,105.83 123.63,106.08 124.7,106.8 125.42,107.87 125.67,109.13 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="132.28,109.13 132.03,110.4 131.31,111.47 130.24,112.19 128.98,112.44 127.71,112.19 126.64,111.47 125.92,110.4 125.67,109.13 125.92,107.87 126.64,106.8 127.71,106.08 128.98,105.83 130.24,106.08 131.31,106.8 132.03,107.87 132.28,109.13 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="145.51,109.13 145.26,110.4 144.54,111.47 143.47,112.19 142.2,112.44 140.94,112.19 139.87,111.47 139.15,110.4 138.9,109.13 139.15,107.87 139.87,106.8 140.94,106.08 142.2,105.83 143.47,106.08 144.54,106.8 145.26,107.87 145.51,109.13 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="152.13,109.13 151.87,110.4 151.16,111.47 150.08,112.19 148.82,112.44 147.55,112.19 146.48,111.47 145.76,110.4 145.51,109.13 145.76,107.87 146.48,106.8 147.55,106.08 148.82,105.83 150.08,106.08 151.16,106.8 151.87,107.87 152.13,109.13 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="79.37,115.75 79.12,117.01 78.4,118.09 77.33,118.8 76.06,119.06 74.8,118.8 73.72,118.09 73.01,117.01 72.76,115.75 73.01,114.48 73.72,113.41 74.8,112.69 76.06,112.44 77.33,112.69 78.4,113.41 79.12,114.48 79.37,115.75 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="85.98,115.75 85.73,117.01 85.02,118.09 83.94,118.8 82.68,119.06 81.41,118.8 80.34,118.09 79.62,117.01 79.37,115.75 79.62,114.48 80.34,113.41 81.41,112.69 82.68,112.44 83.94,112.69 85.02,113.41 85.73,114.48 85.98,115.75 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="119.06,115.75 118.8,117.01 118.09,118.09 117.01,118.8 115.75,119.06 114.48,118.8 113.41,118.09 112.69,117.01 112.44,115.75 112.69,114.48 113.41,113.41 114.48,112.69 115.75,112.44 117.01,112.69 118.09,113.41 118.8,114.48 119.06,115.75 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="125.67,115.75 125.42,117.01 124.7,118.09 123.63,118.8 122.36,119.06 121.1,118.8 120.02,118.09 119.31,117.01 119.06,115.75 119.31,114.48 120.02,113.41 121.1,112.69 122.36,112.44 123.63,112.69 124.7,113.41 125.42,114.48 125.67,115.75 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="138.9,115.75 138.65,117.01 137.93,118.09 136.86,118.8 135.59,119.06 134.32,118.8 133.25,118.09 132.54,117.01 132.28,115.75 132.54,114.48 133.25,113.41 134.32,112.69 135.59,112.44 136.86,112.69 137.93,113.41 138.65,114.48 138.9,115.75 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="152.13,115.75 151.87,117.01 151.16,118.09 150.08,118.8 148.82,119.06 147.55,118.8 146.48,118.09 145.76,117.01 145.51,115.75 145.76,114.48 146.48,113.41 147.55,112.69 148.82,112.44 150.08,112.69 151.16,113.41 151.87,114.48 152.13,115.75 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="72.76,122.36 72.5,123.63 71.79,124.7 70.71,125.42 69.45,125.67 68.18,125.42 67.11,124.7 66.39,123.63 66.14,122.36 66.39,121.1 67.11,120.02 68.18,119.31 69.45,119.06 70.71,119.31 71.79,120.02 72.5,121.1 72.76,122.36 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="79.37,122.36 79.12,123.63 78.4,124.7 77.33,125.42 76.06,125.67 74.8,125.42 73.72,124.7 73.01,123.63 72.76,122.36 73.01,121.1 73.72,120.02 74.8,119.31 76.06,119.06 77.33,119.31 78.4,120.02 79.12,121.1 79.37,122.36 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="85.98,122.36 85.73,123.63 85.02,124.7 83.94,125.42 82.68,125.67 81.41,125.42 80.34,124.7 79.62,123.63 79.37,122.36 79.62,121.1 80.34,120.02 81.41,119.31 82.68,119.06 83.94,119.31 85.02,120.02 85.73,121.1 85.98,122.36 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="92.6,122.36 92.35,123.63 91.63,124.7 90.56,125.42 89.29,125.67 88.03,125.42 86.95,124.7 86.24,123.63 85.98,122.36 86.24,121.1 86.95,120.02 88.03,119.31 89.29,119.06 90.56,119.31 91.63,120.02 92.35,121.1 92.6,122.36 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="105.83,122.36 105.58,123.63 104.86,124.7 103.79,125.42 102.52,125.67 101.25,125.42 100.18,124.7 99.46,123.63 99.21,122.36 99.46,121.1 100.18,120.02 101.25,119.31 102.52,119.06 103.79,119.31 104.86,120.02 105.58,121.1 105.83,122.36 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="125.67,122.36 125.42,123.63 124.7,124.7 123.63,125.42 122.36,125.67 121.1,125.42 120.02,124.7 119.31,123.63 119.06,122.36 119.31,121.1 120.02,120.02 121.1,119.31 122.36,119.06 123.63,119.31 124.7,120.02 125.42,121.1 125.67,122.36 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="132.28,122.36 132.03,123.63 131.31,124.7 130.24,125.42 128.98,125.67 127.71,125.42 126.64,124.7 125.92,123.63 125.67,122.36 125.92,121.1 126.64,120.02 127.71,119.31 128.98,119.06 130.24,119.31 131.31,120.02 132.03,121.1 132.28,122.36 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="138.9,122.36 138.65,123.63 137.93,124.7 136.86,125.42 135.59,125.67 134.32,125.42 133.25,124.7 132.54,123.63 132.28,122.36 132.54,121.1 133.25,120.02 134.32,119.31 135.59,119.06 136.86,119.31 137.93,120.02 138.65,121.1 138.9,122.36 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="72.76,128.98 72.5,130.24 71.79,131.31 70.71,132.03 69.45,132.28 68.18,132.03 67.11,131.31 66.39,130.24 66.14,128.98 66.39,127.71 67.11,126.64 68.18,125.92 69.45,125.67 70.71,125.92 71.79,126.64 72.5,127.71 72.76,128.98 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="79.37,128.98 79.12,130.24 78.4,131.31 77.33,132.03 76.06,132.28 74.8,132.03 73.72,131.31 73.01,130.24 72.76,128.98 73.01,127.71 73.72,126.64 74.8,125.92 76.06,125.67 77.33,125.92 78.4,126.64 79.12,127.71 79.37,128.98 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="92.6,128.98 92.35,130.24 91.63,131.31 90.56,132.03 89.29,132.28 88.03,132.03 86.95,131.31 86.24,130.24 85.98,128.98 86.24,127.71 86.95,126.64 88.03,125.92 89.29,125.67 90.56,125.92 91.63,126.64 92.35,127.71 92.6,128.98 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="99.21,128.98 98.96,130.24 98.24,131.31 97.17,132.03 95.91,132.28 94.64,132.03 93.57,131.31 92.85,130.24 92.6,128.98 92.85,127.71 93.57,126.64 94.64,125.92 95.91,125.67 97.17,125.92 98.24,126.64 98.96,127.71 99.21,128.98 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="105.83,128.98 105.58,130.24 104.86,131.31 103.79,132.03 102.52,132.28 101.25,132.03 100.18,131.31 99.46,130.24 99.21,128.98 99.46,127.71 100.18,126.64 101.25,125.92 102.52,125.67 103.79,125.92 104.86,126.64 105.58,127.71 105.83,128.98 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="112.44,128.98 112.19,130.24 111.47,131.31 110.4,132.03 109.13,132.28 107.87,132.03 106.8,131.31 106.08,130.24 105.83,128.98 106.08,127.71 106.8,126.64 107.87,125.92 109.13,125.67 110.4,125.92 111.47,126.64 112.19,127.71 112.44,128.98 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="119.06,128.98 118.8,130.24 118.09,131.31 117.01,132.03 115.75,132.28 114.48,132.03 113.41,131.31 112.69,130.24 112.44,128.98 112.69,127.71 113.41,126.64 114.48,125.92 115.75,125.67 117.01,125.92 118.09,126.64 118.8,127.71 119.06,128.98 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="132.28,128.98 132.03,130.24 131.31,131.31 130.24,132.03 128.98,132.28 127.71,132.03 126.64,131.31 125.92,130.24 125.67,128.98 125.92,127.71 126.64,126.64 127.71,125.92 128.98,125.67 130.24,125.92 131.31,126.64 132.03,127.71 132.28,128.98 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="138.9,128.98 138.65,130.24 137.93,131.31 136.86,132.03 135.59,132.28 134.32,132.03 133.25,131.31 132.54,130.24 132.28,128.98 132.54,127.71 133.25,126.64 134.32,125.92 135.59,125.67 136.86,125.92 137.93,126.64 138.65,127.71 138.9,128.98 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="72.76,135.59 72.5,136.86 71.79,137.93 70.71,138.65 69.45,138.9 68.18,138.65 67.11,137.93 66.39,136.86 66.14,135.59 66.39,134.32 67.11,133.25 68.18,132.54 69.45,132.28 70.71,132.54 71.79,133.25 72.5,134.32 72.76,135.59 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="79.37,135.59 79.12,136.86 78.4,137.93 77.33,138.65 76.06,138.9 74.8,138.65 73.72,137.93 73.01,136.86 72.76,135.59 73.01,134.32 73.72,133.25 74.8,132.54 76.06,132.28 77.33,132.54 78.4,133.25 79.12,134.32 79.37,135.59 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="99.21,135.59 98.96,136.86 98.24,137.93 97.17,138.65 95.91,138.9 94.64,138.65 93.57,137.93 92.85,136.86 92.6,135.59 92.85,134.32 93.57,133.25 94.64,132.54 95.91,132.28 97.17,132.54 98.24,133.25 98.96,134.32 99.21,135.59 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="112.44,135.59 112.19,136.86 111.47,137.93 110.4,138.65 109.13,138.9 107.87,138.65 106.8,137.93 106.08,136.86 105.83,135.59 106.08,134.32 106.8,133.25 107.87,132.54 109.13,132.28 110.4,132.54 111.47,133.25 112.19,134.32 112.44,135.59 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="119.06,135.59 118.8,136.86 118.09,137.93 117.01,138.65 115.75,138.9 114.48,138.65 113.41,137.93 112.69,136.86 112.44,135.59 112.69,134.32 113.41,133.25 114.48,132.54 115.75,132.28 117.01,132.54 118.09,133.25 118.8,134.32 119.06,135.59 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="132.28,135.59 132.03,136.86 131.31,137.93 130.24,138.65 128.98,138.9 127.71,138.65 126.64,137.93 125.92,136.86 125.67,135.59 125.92,134.32 126.64,133.25 127.71,132.54 128.98,132.28 130.24,132.54 131.31,133.25 132.03,134.32 132.28,135.59 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="138.9,135.59 138.65,136.86 137.93,137.93 136.86,138.65 135.59,138.9 134.32,138.65 133.25,137.93 132.54,136.86 132.28,135.59 132.54,134.32 133.25,133.25 134.32,132.54 135.59,132.28 136.86,132.54 137.93,133.25 138.65,134.32 138.9,135.59 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="72.76,142.2 72.5,143.47 71.79,144.54 70.71,145.26 69.45,145.51 68.18,145.26 67.11,144.54 66.39,143.47 66.14,142.2 66.39,140.94 67.11,139.87 68.18,139.15 69.45,138.9 70.71,139.15 71.79,139.87 72.5,140.94 72.76,142.2 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="85.98,142.2 85.73,143.47 85.02,144.54 83.94,145.26 82.68,145.51 81.41,145.26 80.34,144.54 79.62,143.47 79.37,142.2 79.62,140.94 80.34,139.87 81.41,139.15 82.68,138.9 83.94,139.15 85.02,139.87 85.73,140.94 85.98,142.2 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="92.6,142.2 92.35,143.47 91.63,144.54 90.56,145.26 89.29,145.51 88.03,145.26 86.95,144.54 86.24,143.47 85.98,142.2 86.24,140.94 86.95,139.87 88.03,139.15 89.29,138.9 90.56,139.15 91.63,139.87 92.35,140.94 92.6,142.2 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="99.21,142.2 98.96,143.47 98.24,144.54 97.17,145.26 95.91,145.51 94.64,145.26 93.57,144.54 92.85,143.47 92.6,142.2 92.85,140.94 93.57,139.87 94.64,139.15 95.91,138.9 97.17,139.15 98.24,139.87 98.96,140.94 99.21,142.2 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="105.83,142.2 105.58,143.47 104.86,144.54 103.79,145.26 102.52,145.51 101.25,145.26 100.18,144.54 99.46,143.47 99.21,142.2 99.46,140.94 100.18,139.87 101.25,139.15 102.52,138.9 103.79,139.15 104.86,139.87 105.58,140.94 105.83,142.2 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="112.44,142.2 112.19,143.47 111.47,144.54 110.4,145.26 109.13,145.51 107.87,145.26 106.8,144.54 106.08,143.47 105.83,142.2 106.08,140.94 106.8,139.87 107.87,139.15 109.13,138.9 110.4,139.15 111.47,139.87 112.19,140.94 112.44,142.2 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="119.06,142.2 118.8,143.47 118.09,144.54 117.01,145.26 115.75,145.51 114.48,145.26 113.41,144.54 112.69,143.47 112.44,142.2 112.69,140.94 113.41,139.87 114.48,139.15 115.75,138.9 117.01,139.15 118.09,139.87 118.8,140.94 119.06,142.2 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="125.67,142.2 125.42,143.47 124.7,144.54 123.63,145.26 122.36,145.51 121.1,145.26 120.02,144.54 119.31,143.47 119.06,142.2 119.31,140.94 120.02,139.87 121.1,139.15 122.36,138.9 123.63,139.15 124.7,139.87 125.42,140.94 125.67,142.2 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="138.9,142.2 138.65,143.47 137.93,144.54 136.86,145.26 135.59,145.51 134.32,145.26 133.25,144.54 132.54,143.47 132.28,142.2 132.54,140.94 133.25,139.87 134.32,139.15 135.59,138.9 136.86,139.15 137.93,139.87 138.65,140.94 138.9,142.2 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="145.51,142.2 145.26,143.47 144.54,144.54 143.47,145.26 142.2,145.51 140.94,145.26 139.87,144.54 139.15,143.47 138.9,142.2 139.15,140.94 139.87,139.87 140.94,139.15 142.2,138.9 143.47,139.15 144.54,139.87 145.26,140.94 145.51,142.2 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="72.76,148.82 72.5,150.08 71.79,151.16 70.71,151.87 69.45,152.13 68.18,151.87 67.11,151.16 66.39,150.08 66.14,148.82 66.39,147.55 67.11,146.48 68.18,145.76 69.45,145.51 70.71,145.76 71.79,146.48 72.5,147.55 72.76,148.82 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="79.37,148.82 79.12,150.08 78.4,151.16 77.33,151.87 76.06,152.13 74.8,151.87 73.72,151.16 73.01,150.08 72.76,148.82 73.01,147.55 73.72,146.48 74.8,145.76 76.06,145.51 77.33,145.76 78.4,146.48 79.12,147.55 79.37,148.82 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="85.98,148.82 85.73,150.08 85.02,151.16 83.94,151.87 82.68,152.13 81.41,151.87 80.34,151.16 79.62,150.08 79.37,148.82 79.62,147.55 80.34,146.48 81.41,145.76 82.68,145.51 83.94,145.76 85.02,146.48 85.73,147.55 85.98,148.82 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="99.21,148.82 98.96,150.08 98.24,151.16 97.17,151.87 95.91,152.13 94.64,151.87 93.57,151.16 92.85,150.08 92.6,148.82 92.85,147.55 93.57,146.48 94.64,145.76 95.91,145.51 97.17,145.76 98.24,146.48 98.96,147.55 99.21,148.82 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="119.06,148.82 118.8,150.08 118.09,151.16 117.01,151.87 115.75,152.13 114.48,151.87 113.41,151.16 112.69,150.08 112.44,148.82 112.69,147.55 113.41,146.48 114.48,145.76 115.75,145.51 117.01,145.76 118.09,146.48 118.8,147.55 119.06,148.82 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
        <polygon
          points="138.9,148.82 138.65,150.08 137.93,151.16 136.86,151.87 135.59,152.13 134.32,151.87 133.25,151.16 132.54,150.08 132.28,148.82 132.54,147.55 133.25,146.48 134.32,145.76 135.59,145.51 136.86,145.76 137.93,146.48 138.65,147.55 138.9,148.82 "
          style="fill:url(#gradiente61bf7b05498450e94216666bad1de37);"
        />
      `,
            },
            {
                value: 10,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(37,86,99,1);"
            shape-rendering="crispEdges"
          />
          <pattern
            id="hatch66b57d3d484547528ac58fe19b915123"
            x="0"
            y="0"
            width="8"
            height="8"
            patternUnits="userSpaceOnUse"
          >
            <rect x="0" y="0" width="8" height="8" fill="#E5B9B7" />
            <rect x="0" y="0" width="1" height="1" fill="#DBEEF3" />
            <rect x="1" y="0" width="1" height="1" fill="#DBEEF3" />
            <rect x="2" y="0" width="1" height="1" fill="#DBEEF3" />
            <rect x="3" y="0" width="1" height="1" fill="#DBEEF3" />
            <rect x="4" y="4" width="1" height="1" fill="#DBEEF3" />
            <rect x="5" y="4" width="1" height="1" fill="#DBEEF3" />
            <rect x="6" y="4" width="1" height="1" fill="#DBEEF3" />
            <rect x="7" y="4" width="1" height="1" fill="#DBEEF3" />
          </pattern>
          <polygon
            points="13.23,13.23 59.53,13.23 59.53,59.53 13.23,59.53 13.23,19.78 19.84,19.78 19.84,52.91 52.91,52.91 52.91,19.84 13.23,19.84 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="13.23,105.83 59.53,105.83 59.53,152.13 13.23,152.13 13.23,112.37 19.84,112.37 19.84,145.51 52.91,145.51 52.91,112.44 13.23,112.44 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="105.83,13.23 152.13,13.23 152.13,59.53 105.83,59.53 105.83,19.78 112.44,19.78 112.44,52.91 145.51,52.91 145.51,19.84 105.83,19.84 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="26.46,26.46 46.3,26.46 46.3,46.3 26.46,46.3 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="26.46,119.06 46.3,119.06 46.3,138.9 26.46,138.9 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="119.06,26.46 138.9,26.46 138.9,46.3 119.06,46.3 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="79.37,13.23 86.05,13.23 85.98,19.91 79.37,19.91 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="85.92,13.23 92.66,13.23 92.53,19.84 85.92,19.84 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="92.53,13.23 99.21,13.23 99.15,19.91 92.53,19.91 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="66.14,19.84 72.82,19.84 72.76,26.46 66.14,26.46 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="72.69,19.84 79.44,19.84 79.3,26.46 72.69,26.46 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="79.3,19.78 85.98,19.78 85.92,26.52 79.3,26.52 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="92.6,19.78 99.21,19.78 99.21,26.52 92.6,26.52 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="79.37,26.39 86.05,26.39 85.98,33.07 79.37,33.07 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="85.92,26.46 92.66,26.46 92.53,33.07 85.92,33.07 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="92.53,26.39 99.21,26.39 99.15,33.14 92.53,33.14 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="66.14,33.07 72.82,33.07 72.76,39.69 66.14,39.69 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="72.69,33.07 79.37,33.07 79.3,39.75 72.69,39.75 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="92.6,33 99.21,33 99.21,39.75 92.6,39.75 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="72.76,39.62 79.37,39.62 79.37,46.3 72.76,46.3 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="92.6,39.62 99.21,39.62 99.21,46.3 92.6,46.3 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="66.14,46.3 72.76,46.3 72.76,52.98 66.14,52.98 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="85.98,46.3 92.6,46.3 92.6,52.91 85.98,52.91 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="66.14,52.85 72.76,52.85 72.76,59.53 66.14,59.53 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="79.37,52.91 85.98,52.91 85.98,59.53 79.37,59.53 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="92.6,52.91 99.21,52.91 99.21,59.53 92.6,59.53 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="72.76,59.53 79.37,59.53 79.37,66.14 72.76,66.14 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="13.23,66.14 19.91,66.14 19.84,72.82 13.23,72.82 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="19.78,66.14 26.52,66.14 26.39,72.82 19.78,72.82 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="26.39,66.14 33.14,66.14 33,72.82 26.39,72.82 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="33,66.14 39.75,66.14 39.62,72.76 33,72.76 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="39.62,66.14 46.3,66.14 46.23,72.76 39.62,72.76 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="52.91,66.14 59.59,66.14 59.53,72.76 52.91,72.76 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="59.46,66.14 66.21,66.14 66.08,72.82 59.46,72.82 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="66.08,66.14 72.76,66.14 72.69,72.76 66.08,72.76 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="85.98,66.14 92.6,66.14 92.6,72.82 85.98,72.82 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="99.21,66.14 105.83,66.14 105.83,72.82 99.21,72.82 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="112.44,66.14 119.06,66.14 119.06,72.76 112.44,72.76 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="125.67,66.14 132.28,66.14 132.28,72.82 125.67,72.82 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="138.9,66.14 145.51,66.14 145.51,72.82 138.9,72.82 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="13.23,72.69 19.91,72.69 19.84,79.37 13.23,79.37 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="19.78,72.69 26.52,72.69 26.39,79.37 19.78,79.37 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="26.39,72.69 33.07,72.69 33,79.44 26.39,79.44 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="46.3,72.76 52.91,72.76 52.91,79.44 46.3,79.44 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="59.53,72.69 66.14,72.69 66.14,79.37 59.53,79.37 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="72.76,72.76 79.37,72.76 79.37,79.44 72.76,79.44 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="85.98,72.69 92.66,72.69 92.6,79.37 85.98,79.37 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="92.53,72.76 99.28,72.76 99.15,79.44 92.53,79.44 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="99.15,72.69 105.89,72.69 105.76,79.37 99.15,79.37 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="105.76,72.76 112.44,72.76 112.37,79.44 105.76,79.44 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="125.67,72.69 132.35,72.69 132.28,79.44 125.67,79.44 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="132.22,72.76 138.96,72.76 138.83,79.37 132.22,79.37 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="138.83,72.69 145.58,72.69 145.45,79.37 138.83,79.37 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="145.45,72.76 152.13,72.76 152.06,79.44 145.45,79.44 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="26.46,79.3 33.07,79.3 33.07,85.98 26.46,85.98 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="39.69,79.37 46.37,79.37 46.3,85.98 39.69,85.98 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="46.23,79.3 52.98,79.3 52.85,85.98 46.23,85.98 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="52.85,79.37 59.53,79.37 59.46,85.98 52.85,85.98 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="66.14,79.37 72.82,79.37 72.76,85.98 66.14,85.98 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="72.69,79.3 79.37,79.3 79.3,85.98 72.69,85.98 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="92.6,79.3 99.21,79.3 99.21,86.05 92.6,86.05 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="105.83,79.3 112.51,79.3 112.44,86.05 105.83,86.05 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="112.37,79.37 119.06,79.37 118.99,85.98 112.37,85.98 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="125.67,79.3 132.28,79.3 132.28,85.98 125.67,85.98 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="145.51,79.3 152.13,79.3 152.13,86.05 145.51,86.05 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="13.23,85.98 19.84,85.98 19.84,92.6 13.23,92.6 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="33.07,85.98 39.69,85.98 39.69,92.66 33.07,92.66 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="85.98,85.98 92.66,85.98 92.6,92.6 85.98,92.6 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="92.53,85.92 99.28,85.92 99.15,92.66 92.53,92.66 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="99.15,85.98 105.89,85.98 105.76,92.6 99.15,92.6 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="105.76,85.92 112.44,85.92 112.37,92.6 105.76,92.6 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="132.28,85.98 138.96,85.98 138.9,92.6 132.28,92.6 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="138.83,85.98 145.58,85.98 145.45,92.66 138.83,92.66 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="145.45,85.92 152.13,85.92 152.06,92.6 145.45,92.6 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="19.84,92.6 26.46,92.6 26.46,99.21 19.84,99.21 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="33.07,92.53 39.75,92.53 39.69,99.21 33.07,99.21 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="39.62,92.6 46.3,92.6 46.23,99.21 39.62,99.21 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="52.91,92.6 59.53,92.6 59.53,99.21 52.91,99.21 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="66.14,92.6 72.82,92.6 72.76,99.28 66.14,99.28 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="72.69,92.6 79.37,92.6 79.3,99.21 72.69,99.21 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="92.6,92.53 99.21,92.53 99.21,99.28 92.6,99.28 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="112.44,92.6 119.06,92.6 119.06,99.28 112.44,99.28 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="138.9,92.53 145.51,92.53 145.51,99.21 138.9,99.21 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="66.14,99.15 72.76,99.15 72.76,105.89 66.14,105.89 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="79.37,99.21 85.98,99.21 85.98,105.83 79.37,105.83 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="92.6,99.15 99.21,99.15 99.21,105.83 92.6,105.83 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="112.44,99.15 119.06,99.15 119.06,105.83 112.44,105.83 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="132.28,99.21 138.9,99.21 138.9,105.83 132.28,105.83 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="66.14,105.76 72.76,105.76 72.76,112.44 66.14,112.44 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="85.98,105.83 92.6,105.83 92.6,112.44 85.98,112.44 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="99.21,105.83 105.83,105.83 105.83,112.44 99.21,112.44 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="119.06,105.83 125.74,105.83 125.67,112.51 119.06,112.51 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="125.6,105.83 132.28,105.83 132.22,112.44 125.6,112.44 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="138.9,105.83 145.58,105.83 145.51,112.44 138.9,112.44 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="145.45,105.83 152.13,105.83 152.06,112.51 145.45,112.51 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="72.76,112.44 79.44,112.44 79.37,119.12 72.76,119.12 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="79.3,112.44 85.98,112.44 85.92,119.12 79.3,119.12 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="112.44,112.44 119.12,112.44 119.06,119.06 112.44,119.06 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="118.99,112.37 125.67,112.37 125.6,119.12 118.99,119.12 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="132.28,112.44 138.9,112.44 138.9,119.12 132.28,119.12 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="145.51,112.37 152.13,112.37 152.13,119.06 145.51,119.06 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="66.14,119.06 72.82,119.06 72.76,125.74 66.14,125.74 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="72.69,118.99 79.44,118.99 79.3,125.74 72.69,125.74 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="79.3,118.99 86.05,118.99 85.92,125.67 79.3,125.67 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="85.92,119.06 92.6,119.06 92.53,125.74 85.92,125.74 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="99.21,119.06 105.83,119.06 105.83,125.74 99.21,125.74 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="119.06,118.99 125.74,118.99 125.67,125.67 119.06,125.67 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="125.6,119.06 132.35,119.06 132.22,125.74 125.6,125.74 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="132.22,118.99 138.9,118.99 138.83,125.74 132.22,125.74 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="66.14,125.6 72.82,125.6 72.76,132.35 66.14,132.35 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="72.69,125.6 79.37,125.6 79.3,132.35 72.69,132.35 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="85.98,125.6 92.66,125.6 92.6,132.28 85.98,132.28 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="92.53,125.67 99.28,125.67 99.15,132.35 92.53,132.35 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="99.15,125.6 105.89,125.6 105.76,132.28 99.15,132.28 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="105.76,125.67 112.51,125.67 112.37,132.35 105.76,132.35 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="112.37,125.67 119.06,125.67 118.99,132.35 112.37,132.35 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="125.67,125.6 132.35,125.6 132.28,132.35 125.67,132.35 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="132.22,125.6 138.9,125.6 138.83,132.35 132.22,132.35 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="66.14,132.22 72.82,132.22 72.76,138.96 66.14,138.96 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="72.69,132.22 79.37,132.22 79.3,138.9 72.69,138.9 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="92.6,132.22 99.21,132.22 99.21,138.96 92.6,138.96 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="105.83,132.22 112.51,132.22 112.44,138.96 105.83,138.96 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="112.37,132.22 119.06,132.22 118.99,138.96 112.37,138.96 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="125.67,132.22 132.35,132.22 132.28,138.9 125.67,138.9 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="132.22,132.22 138.9,132.22 138.83,138.96 132.22,138.96 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="66.14,138.83 72.76,138.83 72.76,145.58 66.14,145.58 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="79.37,138.9 86.05,138.9 85.98,145.58 79.37,145.58 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="85.92,138.9 92.66,138.9 92.53,145.51 85.92,145.51 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="92.53,138.83 99.28,138.83 99.15,145.58 92.53,145.58 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="99.15,138.9 105.89,138.9 105.76,145.51 99.15,145.51 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="105.76,138.83 112.51,138.83 112.37,145.51 105.76,145.51 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="112.37,138.83 119.12,138.83 118.99,145.58 112.37,145.58 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="118.99,138.9 125.67,138.9 125.6,145.51 118.99,145.51 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="132.28,138.83 138.96,138.83 138.9,145.58 132.28,145.58 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="138.83,138.9 145.51,138.9 145.45,145.51 138.83,145.51 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="66.14,145.45 72.82,145.45 72.76,152.13 66.14,152.13 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="72.69,145.51 79.44,145.51 79.3,152.13 72.69,152.13 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="79.3,145.45 85.98,145.45 85.92,152.13 79.3,152.13 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="92.6,145.45 99.21,145.45 99.21,152.13 92.6,152.13 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="112.44,145.45 119.06,145.45 119.06,152.13 112.44,152.13 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
          <polygon
            points="132.28,145.45 138.9,145.45 138.9,152.13 132.28,152.13 "
            style="fill:url(#hatch66b57d3d484547528ac58fe19b915123);"
          />
      `,
            },
            {
                value: 11,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(38,38,38,1);"
            shape-rendering="crispEdges"
          />
          <pattern
            id="glassecd873593fe44878b761241d367e9637"
            x="13.22835"
            y="13.22835"
            width="138.8976"
            height="138.8976"
            patternUnits="userSpaceOnUse"
          >
            <rect x="0" y="0" width="138.8976" height="138.8976" style="fill:rgb(204,193,217);fill-opacity:1;" />
            <rect x="0" y="0" width="138.8976" height="69.44881" style="fill:rgb(210,199,223);fill-opacity:1;" />
          </pattern>
          <polygon
            points="13.23,13.23 59.53,13.23 59.53,59.53 13.23,59.53 13.23,19.78 19.84,19.78 19.84,52.91 52.91,52.91 52.91,19.84 13.23,19.84 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="13.23,105.83 59.53,105.83 59.53,152.13 13.23,152.13 13.23,112.37 19.84,112.37 19.84,145.51 52.91,145.51 52.91,112.44 13.23,112.44 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="105.83,13.23 152.13,13.23 152.13,59.53 105.83,59.53 105.83,19.78 112.44,19.78 112.44,52.91 145.51,52.91 145.51,19.84 105.83,19.84 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="26.46,26.46 46.3,26.46 46.3,46.3 26.46,46.3 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="26.46,119.06 46.3,119.06 46.3,138.9 26.46,138.9 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="119.06,26.46 138.9,26.46 138.9,46.3 119.06,46.3 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="79.37,16.54 82.68,13.23 85.98,16.54 82.68,19.84 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="85.98,16.54 89.29,13.23 92.6,16.54 89.29,19.84 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="92.6,16.54 95.91,13.23 99.21,16.54 95.91,19.84 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="66.14,23.15 69.45,19.84 72.76,23.15 69.45,26.46 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="72.76,23.15 76.06,19.84 79.37,23.15 76.06,26.46 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="79.37,23.15 82.68,19.84 85.98,23.15 82.68,26.46 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="92.6,23.15 95.91,19.84 99.21,23.15 95.91,26.46 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="79.37,29.76 82.68,26.46 85.98,29.76 82.68,33.07 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="85.98,29.76 89.29,26.46 92.6,29.76 89.29,33.07 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="92.6,29.76 95.91,26.46 99.21,29.76 95.91,33.07 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="66.14,36.38 69.45,33.07 72.76,36.38 69.45,39.69 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="72.76,36.38 76.06,33.07 79.37,36.38 76.06,39.69 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="92.6,36.38 95.91,33.07 99.21,36.38 95.91,39.69 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="72.76,42.99 76.06,39.69 79.37,42.99 76.06,46.3 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="92.6,42.99 95.91,39.69 99.21,42.99 95.91,46.3 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="66.14,49.61 69.45,46.3 72.76,49.61 69.45,52.91 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="85.98,49.61 89.29,46.3 92.6,49.61 89.29,52.91 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="66.14,56.22 69.45,52.91 72.76,56.22 69.45,59.53 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="79.37,56.22 82.68,52.91 85.98,56.22 82.68,59.53 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="92.6,56.22 95.91,52.91 99.21,56.22 95.91,59.53 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="72.76,62.83 76.06,59.53 79.37,62.83 76.06,66.14 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="13.23,69.45 16.54,66.14 19.84,69.45 16.54,72.76 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="19.84,69.45 23.15,66.14 26.46,69.45 23.15,72.76 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="26.46,69.45 29.76,66.14 33.07,69.45 29.76,72.76 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="33.07,69.45 36.38,66.14 39.69,69.45 36.38,72.76 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="39.69,69.45 42.99,66.14 46.3,69.45 42.99,72.76 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="52.91,69.45 56.22,66.14 59.53,69.45 56.22,72.76 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="59.53,69.45 62.83,66.14 66.14,69.45 62.83,72.76 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="66.14,69.45 69.45,66.14 72.76,69.45 69.45,72.76 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="85.98,69.45 89.29,66.14 92.6,69.45 89.29,72.76 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="99.21,69.45 102.52,66.14 105.83,69.45 102.52,72.76 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="112.44,69.45 115.75,66.14 119.06,69.45 115.75,72.76 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="125.67,69.45 128.98,66.14 132.28,69.45 128.98,72.76 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="138.9,69.45 142.2,66.14 145.51,69.45 142.2,72.76 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="13.23,76.06 16.54,72.76 19.84,76.06 16.54,79.37 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="19.84,76.06 23.15,72.76 26.46,76.06 23.15,79.37 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="26.46,76.06 29.76,72.76 33.07,76.06 29.76,79.37 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="46.3,76.06 49.61,72.76 52.91,76.06 49.61,79.37 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="59.53,76.06 62.83,72.76 66.14,76.06 62.83,79.37 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="72.76,76.06 76.06,72.76 79.37,76.06 76.06,79.37 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="85.98,76.06 89.29,72.76 92.6,76.06 89.29,79.37 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="92.6,76.06 95.91,72.76 99.21,76.06 95.91,79.37 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="99.21,76.06 102.52,72.76 105.83,76.06 102.52,79.37 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="105.83,76.06 109.13,72.76 112.44,76.06 109.13,79.37 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="125.67,76.06 128.98,72.76 132.28,76.06 128.98,79.37 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="132.28,76.06 135.59,72.76 138.9,76.06 135.59,79.37 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="138.9,76.06 142.2,72.76 145.51,76.06 142.2,79.37 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="145.51,76.06 148.82,72.76 152.13,76.06 148.82,79.37 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="26.46,82.68 29.76,79.37 33.07,82.68 29.76,85.98 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="39.69,82.68 42.99,79.37 46.3,82.68 42.99,85.98 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="46.3,82.68 49.61,79.37 52.91,82.68 49.61,85.98 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="52.91,82.68 56.22,79.37 59.53,82.68 56.22,85.98 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="66.14,82.68 69.45,79.37 72.76,82.68 69.45,85.98 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="72.76,82.68 76.06,79.37 79.37,82.68 76.06,85.98 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="92.6,82.68 95.91,79.37 99.21,82.68 95.91,85.98 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="105.83,82.68 109.13,79.37 112.44,82.68 109.13,85.98 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="112.44,82.68 115.75,79.37 119.06,82.68 115.75,85.98 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="125.67,82.68 128.98,79.37 132.28,82.68 128.98,85.98 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="145.51,82.68 148.82,79.37 152.13,82.68 148.82,85.98 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="13.23,89.29 16.54,85.98 19.84,89.29 16.54,92.6 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="33.07,89.29 36.38,85.98 39.69,89.29 36.38,92.6 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="85.98,89.29 89.29,85.98 92.6,89.29 89.29,92.6 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="92.6,89.29 95.91,85.98 99.21,89.29 95.91,92.6 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="99.21,89.29 102.52,85.98 105.83,89.29 102.52,92.6 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="105.83,89.29 109.13,85.98 112.44,89.29 109.13,92.6 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="132.28,89.29 135.59,85.98 138.9,89.29 135.59,92.6 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="138.9,89.29 142.2,85.98 145.51,89.29 142.2,92.6 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="145.51,89.29 148.82,85.98 152.13,89.29 148.82,92.6 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="19.84,95.91 23.15,92.6 26.46,95.91 23.15,99.21 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="33.07,95.91 36.38,92.6 39.69,95.91 36.38,99.21 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="39.69,95.91 42.99,92.6 46.3,95.91 42.99,99.21 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="52.91,95.91 56.22,92.6 59.53,95.91 56.22,99.21 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="66.14,95.91 69.45,92.6 72.76,95.91 69.45,99.21 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="72.76,95.91 76.06,92.6 79.37,95.91 76.06,99.21 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="92.6,95.91 95.91,92.6 99.21,95.91 95.91,99.21 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="112.44,95.91 115.75,92.6 119.06,95.91 115.75,99.21 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="138.9,95.91 142.2,92.6 145.51,95.91 142.2,99.21 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="66.14,102.52 69.45,99.21 72.76,102.52 69.45,105.83 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="79.37,102.52 82.68,99.21 85.98,102.52 82.68,105.83 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="92.6,102.52 95.91,99.21 99.21,102.52 95.91,105.83 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="112.44,102.52 115.75,99.21 119.06,102.52 115.75,105.83 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="132.28,102.52 135.59,99.21 138.9,102.52 135.59,105.83 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="66.14,109.13 69.45,105.83 72.76,109.13 69.45,112.44 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="85.98,109.13 89.29,105.83 92.6,109.13 89.29,112.44 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="99.21,109.13 102.52,105.83 105.83,109.13 102.52,112.44 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="119.06,109.13 122.36,105.83 125.67,109.13 122.36,112.44 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="125.67,109.13 128.98,105.83 132.28,109.13 128.98,112.44 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="138.9,109.13 142.2,105.83 145.51,109.13 142.2,112.44 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="145.51,109.13 148.82,105.83 152.13,109.13 148.82,112.44 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="72.76,115.75 76.06,112.44 79.37,115.75 76.06,119.06 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="79.37,115.75 82.68,112.44 85.98,115.75 82.68,119.06 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="112.44,115.75 115.75,112.44 119.06,115.75 115.75,119.06 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="119.06,115.75 122.36,112.44 125.67,115.75 122.36,119.06 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="132.28,115.75 135.59,112.44 138.9,115.75 135.59,119.06 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="145.51,115.75 148.82,112.44 152.13,115.75 148.82,119.06 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="66.14,122.36 69.45,119.06 72.76,122.36 69.45,125.67 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="72.76,122.36 76.06,119.06 79.37,122.36 76.06,125.67 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="79.37,122.36 82.68,119.06 85.98,122.36 82.68,125.67 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="85.98,122.36 89.29,119.06 92.6,122.36 89.29,125.67 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="99.21,122.36 102.52,119.06 105.83,122.36 102.52,125.67 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="119.06,122.36 122.36,119.06 125.67,122.36 122.36,125.67 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="125.67,122.36 128.98,119.06 132.28,122.36 128.98,125.67 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="132.28,122.36 135.59,119.06 138.9,122.36 135.59,125.67 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="66.14,128.98 69.45,125.67 72.76,128.98 69.45,132.28 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="72.76,128.98 76.06,125.67 79.37,128.98 76.06,132.28 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="85.98,128.98 89.29,125.67 92.6,128.98 89.29,132.28 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="92.6,128.98 95.91,125.67 99.21,128.98 95.91,132.28 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="99.21,128.98 102.52,125.67 105.83,128.98 102.52,132.28 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="105.83,128.98 109.13,125.67 112.44,128.98 109.13,132.28 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="112.44,128.98 115.75,125.67 119.06,128.98 115.75,132.28 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="125.67,128.98 128.98,125.67 132.28,128.98 128.98,132.28 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="132.28,128.98 135.59,125.67 138.9,128.98 135.59,132.28 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="66.14,135.59 69.45,132.28 72.76,135.59 69.45,138.9 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="72.76,135.59 76.06,132.28 79.37,135.59 76.06,138.9 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="92.6,135.59 95.91,132.28 99.21,135.59 95.91,138.9 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="105.83,135.59 109.13,132.28 112.44,135.59 109.13,138.9 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="112.44,135.59 115.75,132.28 119.06,135.59 115.75,138.9 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="125.67,135.59 128.98,132.28 132.28,135.59 128.98,138.9 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="132.28,135.59 135.59,132.28 138.9,135.59 135.59,138.9 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="66.14,142.2 69.45,138.9 72.76,142.2 69.45,145.51 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="79.37,142.2 82.68,138.9 85.98,142.2 82.68,145.51 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="85.98,142.2 89.29,138.9 92.6,142.2 89.29,145.51 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="92.6,142.2 95.91,138.9 99.21,142.2 95.91,145.51 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="99.21,142.2 102.52,138.9 105.83,142.2 102.52,145.51 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="105.83,142.2 109.13,138.9 112.44,142.2 109.13,145.51 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="112.44,142.2 115.75,138.9 119.06,142.2 115.75,145.51 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="119.06,142.2 122.36,138.9 125.67,142.2 122.36,145.51 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="132.28,142.2 135.59,138.9 138.9,142.2 135.59,145.51 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="138.9,142.2 142.2,138.9 145.51,142.2 142.2,145.51 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="66.14,148.82 69.45,145.51 72.76,148.82 69.45,152.13 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="72.76,148.82 76.06,145.51 79.37,148.82 76.06,152.13 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="79.37,148.82 82.68,145.51 85.98,148.82 82.68,152.13 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="92.6,148.82 95.91,145.51 99.21,148.82 95.91,152.13 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="112.44,148.82 115.75,145.51 119.06,148.82 115.75,152.13 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
          <polygon
            points="132.28,148.82 135.59,145.51 138.9,148.82 135.59,152.13 "
            style="fill:url(#glassecd873593fe44878b761241d367e9637);"
          />
      `,
            },
            {
                value: 12,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(37,86,99,1);"
            shape-rendering="crispEdges"
          />
          <linearGradient
            id="gradient89acb651ebd041c6bd575d3854178b85"
            gradientUnits="userSpaceOnUse"
            x1="8.73357798631972"
            y1="77.5065212907663"
            x2="156.620742539803"
            y2="87.8477992353567"
          >
            <stop offset="0%" stop-color="#FF93FB" />
            <stop offset="100%" stop-color="#92D050" />
          </linearGradient>
          <polygon
            points="19.84,16.54 19.59,17.8 18.87,18.87 17.8,19.59 16.54,19.84 15.27,19.59 14.2,18.87 13.48,17.8 13.23,16.54 13.48,15.27 14.2,14.2 15.27,13.48 16.54,13.23 17.8,13.48 18.87,14.2 19.59,15.27 19.84,16.54 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="19.84,56.22 19.59,57.49 18.87,58.56 17.8,59.28 16.54,59.53 15.27,59.28 14.2,58.56 13.48,57.49 13.23,56.22 13.48,54.95 14.2,53.88 15.27,53.17 16.54,52.91 17.8,53.17 18.87,53.88 19.59,54.95 19.84,56.22 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="26.46,16.54 26.2,17.8 25.49,18.87 24.42,19.59 23.15,19.84 21.88,19.59 20.81,18.87 20.09,17.8 19.84,16.54 20.09,15.27 20.81,14.2 21.88,13.48 23.15,13.23 24.42,13.48 25.49,14.2 26.2,15.27 26.46,16.54 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="26.46,56.22 26.2,57.49 25.49,58.56 24.42,59.28 23.15,59.53 21.88,59.28 20.81,58.56 20.09,57.49 19.84,56.22 20.09,54.95 20.81,53.88 21.88,53.17 23.15,52.91 24.42,53.17 25.49,53.88 26.2,54.95 26.46,56.22 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="33.07,16.54 32.82,17.8 32.1,18.87 31.03,19.59 29.76,19.84 28.5,19.59 27.43,18.87 26.71,17.8 26.46,16.54 26.71,15.27 27.43,14.2 28.5,13.48 29.76,13.23 31.03,13.48 32.1,14.2 32.82,15.27 33.07,16.54 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="33.07,56.22 32.82,57.49 32.1,58.56 31.03,59.28 29.76,59.53 28.5,59.28 27.43,58.56 26.71,57.49 26.46,56.22 26.71,54.95 27.43,53.88 28.5,53.17 29.76,52.91 31.03,53.17 32.1,53.88 32.82,54.95 33.07,56.22 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="39.69,16.54 39.43,17.8 38.72,18.87 37.64,19.59 36.38,19.84 35.11,19.59 34.04,18.87 33.32,17.8 33.07,16.54 33.32,15.27 34.04,14.2 35.11,13.48 36.38,13.23 37.64,13.48 38.72,14.2 39.43,15.27 39.69,16.54 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="39.69,56.22 39.43,57.49 38.72,58.56 37.64,59.28 36.38,59.53 35.11,59.28 34.04,58.56 33.32,57.49 33.07,56.22 33.32,54.95 34.04,53.88 35.11,53.17 36.38,52.91 37.64,53.17 38.72,53.88 39.43,54.95 39.69,56.22 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="46.3,16.54 46.05,17.8 45.33,18.87 44.26,19.59 42.99,19.84 41.73,19.59 40.65,18.87 39.94,17.8 39.69,16.54 39.94,15.27 40.65,14.2 41.73,13.48 42.99,13.23 44.26,13.48 45.33,14.2 46.05,15.27 46.3,16.54 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="46.3,56.22 46.05,57.49 45.33,58.56 44.26,59.28 42.99,59.53 41.73,59.28 40.65,58.56 39.94,57.49 39.69,56.22 39.94,54.95 40.65,53.88 41.73,53.17 42.99,52.91 44.26,53.17 45.33,53.88 46.05,54.95 46.3,56.22 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="52.91,16.54 52.66,17.8 51.94,18.87 50.87,19.59 49.61,19.84 48.34,19.59 47.27,18.87 46.55,17.8 46.3,16.54 46.55,15.27 47.27,14.2 48.34,13.48 49.61,13.23 50.87,13.48 51.94,14.2 52.66,15.27 52.91,16.54 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="52.91,56.22 52.66,57.49 51.94,58.56 50.87,59.28 49.61,59.53 48.34,59.28 47.27,58.56 46.55,57.49 46.3,56.22 46.55,54.95 47.27,53.88 48.34,53.17 49.61,52.91 50.87,53.17 51.94,53.88 52.66,54.95 52.91,56.22 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="59.53,16.54 59.28,17.8 58.56,18.87 57.49,19.59 56.22,19.84 54.95,19.59 53.88,18.87 53.17,17.8 52.91,16.54 53.17,15.27 53.88,14.2 54.95,13.48 56.22,13.23 57.49,13.48 58.56,14.2 59.28,15.27 59.53,16.54 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="59.53,56.22 59.28,57.49 58.56,58.56 57.49,59.28 56.22,59.53 54.95,59.28 53.88,58.56 53.17,57.49 52.91,56.22 53.17,54.95 53.88,53.88 54.95,53.17 56.22,52.91 57.49,53.17 58.56,53.88 59.28,54.95 59.53,56.22 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="19.84,23.15 19.59,24.42 18.87,25.49 17.8,26.2 16.54,26.46 15.27,26.2 14.2,25.49 13.48,24.42 13.23,23.15 13.48,21.88 14.2,20.81 15.27,20.09 16.54,19.84 17.8,20.09 18.87,20.81 19.59,21.88 19.84,23.15 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="59.53,23.15 59.28,24.42 58.56,25.49 57.49,26.2 56.22,26.46 54.95,26.2 53.88,25.49 53.17,24.42 52.91,23.15 53.17,21.88 53.88,20.81 54.95,20.09 56.22,19.84 57.49,20.09 58.56,20.81 59.28,21.88 59.53,23.15 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="19.84,29.76 19.59,31.03 18.87,32.1 17.8,32.82 16.54,33.07 15.27,32.82 14.2,32.1 13.48,31.03 13.23,29.76 13.48,28.5 14.2,27.43 15.27,26.71 16.54,26.46 17.8,26.71 18.87,27.43 19.59,28.5 19.84,29.76 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="59.53,29.76 59.28,31.03 58.56,32.1 57.49,32.82 56.22,33.07 54.95,32.82 53.88,32.1 53.17,31.03 52.91,29.76 53.17,28.5 53.88,27.43 54.95,26.71 56.22,26.46 57.49,26.71 58.56,27.43 59.28,28.5 59.53,29.76 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="19.84,36.38 19.59,37.64 18.87,38.72 17.8,39.43 16.54,39.69 15.27,39.43 14.2,38.72 13.48,37.64 13.23,36.38 13.48,35.11 14.2,34.04 15.27,33.32 16.54,33.07 17.8,33.32 18.87,34.04 19.59,35.11 19.84,36.38 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="59.53,36.38 59.28,37.64 58.56,38.72 57.49,39.43 56.22,39.69 54.95,39.43 53.88,38.72 53.17,37.64 52.91,36.38 53.17,35.11 53.88,34.04 54.95,33.32 56.22,33.07 57.49,33.32 58.56,34.04 59.28,35.11 59.53,36.38 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="19.84,42.99 19.59,44.26 18.87,45.33 17.8,46.05 16.54,46.3 15.27,46.05 14.2,45.33 13.48,44.26 13.23,42.99 13.48,41.73 14.2,40.65 15.27,39.94 16.54,39.69 17.8,39.94 18.87,40.65 19.59,41.73 19.84,42.99 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="59.53,42.99 59.28,44.26 58.56,45.33 57.49,46.05 56.22,46.3 54.95,46.05 53.88,45.33 53.17,44.26 52.91,42.99 53.17,41.73 53.88,40.65 54.95,39.94 56.22,39.69 57.49,39.94 58.56,40.65 59.28,41.73 59.53,42.99 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="19.84,49.61 19.59,50.87 18.87,51.94 17.8,52.66 16.54,52.91 15.27,52.66 14.2,51.94 13.48,50.87 13.23,49.61 13.48,48.34 14.2,47.27 15.27,46.55 16.54,46.3 17.8,46.55 18.87,47.27 19.59,48.34 19.84,49.61 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="59.53,49.61 59.28,50.87 58.56,51.94 57.49,52.66 56.22,52.91 54.95,52.66 53.88,51.94 53.17,50.87 52.91,49.61 53.17,48.34 53.88,47.27 54.95,46.55 56.22,46.3 57.49,46.55 58.56,47.27 59.28,48.34 59.53,49.61 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="19.84,109.13 19.59,110.4 18.87,111.47 17.8,112.19 16.54,112.44 15.27,112.19 14.2,111.47 13.48,110.4 13.23,109.13 13.48,107.87 14.2,106.8 15.27,106.08 16.54,105.83 17.8,106.08 18.87,106.8 19.59,107.87 19.84,109.13 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="19.84,148.82 19.59,150.08 18.87,151.16 17.8,151.87 16.54,152.13 15.27,151.87 14.2,151.16 13.48,150.08 13.23,148.82 13.48,147.55 14.2,146.48 15.27,145.76 16.54,145.51 17.8,145.76 18.87,146.48 19.59,147.55 19.84,148.82 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="26.46,109.13 26.2,110.4 25.49,111.47 24.42,112.19 23.15,112.44 21.88,112.19 20.81,111.47 20.09,110.4 19.84,109.13 20.09,107.87 20.81,106.8 21.88,106.08 23.15,105.83 24.42,106.08 25.49,106.8 26.2,107.87 26.46,109.13 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="26.46,148.82 26.2,150.08 25.49,151.16 24.42,151.87 23.15,152.13 21.88,151.87 20.81,151.16 20.09,150.08 19.84,148.82 20.09,147.55 20.81,146.48 21.88,145.76 23.15,145.51 24.42,145.76 25.49,146.48 26.2,147.55 26.46,148.82 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="33.07,109.13 32.82,110.4 32.1,111.47 31.03,112.19 29.76,112.44 28.5,112.19 27.43,111.47 26.71,110.4 26.46,109.13 26.71,107.87 27.43,106.8 28.5,106.08 29.76,105.83 31.03,106.08 32.1,106.8 32.82,107.87 33.07,109.13 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="33.07,148.82 32.82,150.08 32.1,151.16 31.03,151.87 29.76,152.13 28.5,151.87 27.43,151.16 26.71,150.08 26.46,148.82 26.71,147.55 27.43,146.48 28.5,145.76 29.76,145.51 31.03,145.76 32.1,146.48 32.82,147.55 33.07,148.82 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="39.69,109.13 39.43,110.4 38.72,111.47 37.64,112.19 36.38,112.44 35.11,112.19 34.04,111.47 33.32,110.4 33.07,109.13 33.32,107.87 34.04,106.8 35.11,106.08 36.38,105.83 37.64,106.08 38.72,106.8 39.43,107.87 39.69,109.13 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="39.69,148.82 39.43,150.08 38.72,151.16 37.64,151.87 36.38,152.13 35.11,151.87 34.04,151.16 33.32,150.08 33.07,148.82 33.32,147.55 34.04,146.48 35.11,145.76 36.38,145.51 37.64,145.76 38.72,146.48 39.43,147.55 39.69,148.82 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="46.3,109.13 46.05,110.4 45.33,111.47 44.26,112.19 42.99,112.44 41.73,112.19 40.65,111.47 39.94,110.4 39.69,109.13 39.94,107.87 40.65,106.8 41.73,106.08 42.99,105.83 44.26,106.08 45.33,106.8 46.05,107.87 46.3,109.13 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="46.3,148.82 46.05,150.08 45.33,151.16 44.26,151.87 42.99,152.13 41.73,151.87 40.65,151.16 39.94,150.08 39.69,148.82 39.94,147.55 40.65,146.48 41.73,145.76 42.99,145.51 44.26,145.76 45.33,146.48 46.05,147.55 46.3,148.82 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="52.91,109.13 52.66,110.4 51.94,111.47 50.87,112.19 49.61,112.44 48.34,112.19 47.27,111.47 46.55,110.4 46.3,109.13 46.55,107.87 47.27,106.8 48.34,106.08 49.61,105.83 50.87,106.08 51.94,106.8 52.66,107.87 52.91,109.13 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="52.91,148.82 52.66,150.08 51.94,151.16 50.87,151.87 49.61,152.13 48.34,151.87 47.27,151.16 46.55,150.08 46.3,148.82 46.55,147.55 47.27,146.48 48.34,145.76 49.61,145.51 50.87,145.76 51.94,146.48 52.66,147.55 52.91,148.82 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="59.53,109.13 59.28,110.4 58.56,111.47 57.49,112.19 56.22,112.44 54.95,112.19 53.88,111.47 53.17,110.4 52.91,109.13 53.17,107.87 53.88,106.8 54.95,106.08 56.22,105.83 57.49,106.08 58.56,106.8 59.28,107.87 59.53,109.13 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="59.53,148.82 59.28,150.08 58.56,151.16 57.49,151.87 56.22,152.13 54.95,151.87 53.88,151.16 53.17,150.08 52.91,148.82 53.17,147.55 53.88,146.48 54.95,145.76 56.22,145.51 57.49,145.76 58.56,146.48 59.28,147.55 59.53,148.82 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="19.84,115.75 19.59,117.01 18.87,118.09 17.8,118.8 16.54,119.06 15.27,118.8 14.2,118.09 13.48,117.01 13.23,115.75 13.48,114.48 14.2,113.41 15.27,112.69 16.54,112.44 17.8,112.69 18.87,113.41 19.59,114.48 19.84,115.75 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="59.53,115.75 59.28,117.01 58.56,118.09 57.49,118.8 56.22,119.06 54.95,118.8 53.88,118.09 53.17,117.01 52.91,115.75 53.17,114.48 53.88,113.41 54.95,112.69 56.22,112.44 57.49,112.69 58.56,113.41 59.28,114.48 59.53,115.75 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="19.84,122.36 19.59,123.63 18.87,124.7 17.8,125.42 16.54,125.67 15.27,125.42 14.2,124.7 13.48,123.63 13.23,122.36 13.48,121.1 14.2,120.02 15.27,119.31 16.54,119.06 17.8,119.31 18.87,120.02 19.59,121.1 19.84,122.36 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="59.53,122.36 59.28,123.63 58.56,124.7 57.49,125.42 56.22,125.67 54.95,125.42 53.88,124.7 53.17,123.63 52.91,122.36 53.17,121.1 53.88,120.02 54.95,119.31 56.22,119.06 57.49,119.31 58.56,120.02 59.28,121.1 59.53,122.36 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="19.84,128.98 19.59,130.24 18.87,131.31 17.8,132.03 16.54,132.28 15.27,132.03 14.2,131.31 13.48,130.24 13.23,128.98 13.48,127.71 14.2,126.64 15.27,125.92 16.54,125.67 17.8,125.92 18.87,126.64 19.59,127.71 19.84,128.98 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="59.53,128.98 59.28,130.24 58.56,131.31 57.49,132.03 56.22,132.28 54.95,132.03 53.88,131.31 53.17,130.24 52.91,128.98 53.17,127.71 53.88,126.64 54.95,125.92 56.22,125.67 57.49,125.92 58.56,126.64 59.28,127.71 59.53,128.98 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="19.84,135.59 19.59,136.86 18.87,137.93 17.8,138.65 16.54,138.9 15.27,138.65 14.2,137.93 13.48,136.86 13.23,135.59 13.48,134.32 14.2,133.25 15.27,132.54 16.54,132.28 17.8,132.54 18.87,133.25 19.59,134.32 19.84,135.59 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="59.53,135.59 59.28,136.86 58.56,137.93 57.49,138.65 56.22,138.9 54.95,138.65 53.88,137.93 53.17,136.86 52.91,135.59 53.17,134.32 53.88,133.25 54.95,132.54 56.22,132.28 57.49,132.54 58.56,133.25 59.28,134.32 59.53,135.59 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="19.84,142.2 19.59,143.47 18.87,144.54 17.8,145.26 16.54,145.51 15.27,145.26 14.2,144.54 13.48,143.47 13.23,142.2 13.48,140.94 14.2,139.87 15.27,139.15 16.54,138.9 17.8,139.15 18.87,139.87 19.59,140.94 19.84,142.2 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="59.53,142.2 59.28,143.47 58.56,144.54 57.49,145.26 56.22,145.51 54.95,145.26 53.88,144.54 53.17,143.47 52.91,142.2 53.17,140.94 53.88,139.87 54.95,139.15 56.22,138.9 57.49,139.15 58.56,139.87 59.28,140.94 59.53,142.2 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="112.44,16.54 112.19,17.8 111.47,18.87 110.4,19.59 109.13,19.84 107.87,19.59 106.8,18.87 106.08,17.8 105.83,16.54 106.08,15.27 106.8,14.2 107.87,13.48 109.13,13.23 110.4,13.48 111.47,14.2 112.19,15.27 112.44,16.54 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="112.44,56.22 112.19,57.49 111.47,58.56 110.4,59.28 109.13,59.53 107.87,59.28 106.8,58.56 106.08,57.49 105.83,56.22 106.08,54.95 106.8,53.88 107.87,53.17 109.13,52.91 110.4,53.17 111.47,53.88 112.19,54.95 112.44,56.22 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="119.06,16.54 118.8,17.8 118.09,18.87 117.01,19.59 115.75,19.84 114.48,19.59 113.41,18.87 112.69,17.8 112.44,16.54 112.69,15.27 113.41,14.2 114.48,13.48 115.75,13.23 117.01,13.48 118.09,14.2 118.8,15.27 119.06,16.54 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="119.06,56.22 118.8,57.49 118.09,58.56 117.01,59.28 115.75,59.53 114.48,59.28 113.41,58.56 112.69,57.49 112.44,56.22 112.69,54.95 113.41,53.88 114.48,53.17 115.75,52.91 117.01,53.17 118.09,53.88 118.8,54.95 119.06,56.22 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="125.67,16.54 125.42,17.8 124.7,18.87 123.63,19.59 122.36,19.84 121.1,19.59 120.02,18.87 119.31,17.8 119.06,16.54 119.31,15.27 120.02,14.2 121.1,13.48 122.36,13.23 123.63,13.48 124.7,14.2 125.42,15.27 125.67,16.54 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="125.67,56.22 125.42,57.49 124.7,58.56 123.63,59.28 122.36,59.53 121.1,59.28 120.02,58.56 119.31,57.49 119.06,56.22 119.31,54.95 120.02,53.88 121.1,53.17 122.36,52.91 123.63,53.17 124.7,53.88 125.42,54.95 125.67,56.22 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="132.28,16.54 132.03,17.8 131.31,18.87 130.24,19.59 128.98,19.84 127.71,19.59 126.64,18.87 125.92,17.8 125.67,16.54 125.92,15.27 126.64,14.2 127.71,13.48 128.98,13.23 130.24,13.48 131.31,14.2 132.03,15.27 132.28,16.54 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="132.28,56.22 132.03,57.49 131.31,58.56 130.24,59.28 128.98,59.53 127.71,59.28 126.64,58.56 125.92,57.49 125.67,56.22 125.92,54.95 126.64,53.88 127.71,53.17 128.98,52.91 130.24,53.17 131.31,53.88 132.03,54.95 132.28,56.22 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="138.9,16.54 138.65,17.8 137.93,18.87 136.86,19.59 135.59,19.84 134.32,19.59 133.25,18.87 132.54,17.8 132.28,16.54 132.54,15.27 133.25,14.2 134.32,13.48 135.59,13.23 136.86,13.48 137.93,14.2 138.65,15.27 138.9,16.54 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="138.9,56.22 138.65,57.49 137.93,58.56 136.86,59.28 135.59,59.53 134.32,59.28 133.25,58.56 132.54,57.49 132.28,56.22 132.54,54.95 133.25,53.88 134.32,53.17 135.59,52.91 136.86,53.17 137.93,53.88 138.65,54.95 138.9,56.22 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="145.51,16.54 145.26,17.8 144.54,18.87 143.47,19.59 142.2,19.84 140.94,19.59 139.87,18.87 139.15,17.8 138.9,16.54 139.15,15.27 139.87,14.2 140.94,13.48 142.2,13.23 143.47,13.48 144.54,14.2 145.26,15.27 145.51,16.54 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="145.51,56.22 145.26,57.49 144.54,58.56 143.47,59.28 142.2,59.53 140.94,59.28 139.87,58.56 139.15,57.49 138.9,56.22 139.15,54.95 139.87,53.88 140.94,53.17 142.2,52.91 143.47,53.17 144.54,53.88 145.26,54.95 145.51,56.22 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="152.13,16.54 151.87,17.8 151.16,18.87 150.08,19.59 148.82,19.84 147.55,19.59 146.48,18.87 145.76,17.8 145.51,16.54 145.76,15.27 146.48,14.2 147.55,13.48 148.82,13.23 150.08,13.48 151.16,14.2 151.87,15.27 152.13,16.54 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="152.13,56.22 151.87,57.49 151.16,58.56 150.08,59.28 148.82,59.53 147.55,59.28 146.48,58.56 145.76,57.49 145.51,56.22 145.76,54.95 146.48,53.88 147.55,53.17 148.82,52.91 150.08,53.17 151.16,53.88 151.87,54.95 152.13,56.22 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="112.44,23.15 112.19,24.42 111.47,25.49 110.4,26.2 109.13,26.46 107.87,26.2 106.8,25.49 106.08,24.42 105.83,23.15 106.08,21.88 106.8,20.81 107.87,20.09 109.13,19.84 110.4,20.09 111.47,20.81 112.19,21.88 112.44,23.15 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="152.13,23.15 151.87,24.42 151.16,25.49 150.08,26.2 148.82,26.46 147.55,26.2 146.48,25.49 145.76,24.42 145.51,23.15 145.76,21.88 146.48,20.81 147.55,20.09 148.82,19.84 150.08,20.09 151.16,20.81 151.87,21.88 152.13,23.15 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="112.44,29.76 112.19,31.03 111.47,32.1 110.4,32.82 109.13,33.07 107.87,32.82 106.8,32.1 106.08,31.03 105.83,29.76 106.08,28.5 106.8,27.43 107.87,26.71 109.13,26.46 110.4,26.71 111.47,27.43 112.19,28.5 112.44,29.76 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="152.13,29.76 151.87,31.03 151.16,32.1 150.08,32.82 148.82,33.07 147.55,32.82 146.48,32.1 145.76,31.03 145.51,29.76 145.76,28.5 146.48,27.43 147.55,26.71 148.82,26.46 150.08,26.71 151.16,27.43 151.87,28.5 152.13,29.76 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="112.44,36.38 112.19,37.64 111.47,38.72 110.4,39.43 109.13,39.69 107.87,39.43 106.8,38.72 106.08,37.64 105.83,36.38 106.08,35.11 106.8,34.04 107.87,33.32 109.13,33.07 110.4,33.32 111.47,34.04 112.19,35.11 112.44,36.38 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="152.13,36.38 151.87,37.64 151.16,38.72 150.08,39.43 148.82,39.69 147.55,39.43 146.48,38.72 145.76,37.64 145.51,36.38 145.76,35.11 146.48,34.04 147.55,33.32 148.82,33.07 150.08,33.32 151.16,34.04 151.87,35.11 152.13,36.38 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="112.44,42.99 112.19,44.26 111.47,45.33 110.4,46.05 109.13,46.3 107.87,46.05 106.8,45.33 106.08,44.26 105.83,42.99 106.08,41.73 106.8,40.65 107.87,39.94 109.13,39.69 110.4,39.94 111.47,40.65 112.19,41.73 112.44,42.99 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="152.13,42.99 151.87,44.26 151.16,45.33 150.08,46.05 148.82,46.3 147.55,46.05 146.48,45.33 145.76,44.26 145.51,42.99 145.76,41.73 146.48,40.65 147.55,39.94 148.82,39.69 150.08,39.94 151.16,40.65 151.87,41.73 152.13,42.99 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="112.44,49.61 112.19,50.87 111.47,51.94 110.4,52.66 109.13,52.91 107.87,52.66 106.8,51.94 106.08,50.87 105.83,49.61 106.08,48.34 106.8,47.27 107.87,46.55 109.13,46.3 110.4,46.55 111.47,47.27 112.19,48.34 112.44,49.61 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="152.13,49.61 151.87,50.87 151.16,51.94 150.08,52.66 148.82,52.91 147.55,52.66 146.48,51.94 145.76,50.87 145.51,49.61 145.76,48.34 146.48,47.27 147.55,46.55 148.82,46.3 150.08,46.55 151.16,47.27 151.87,48.34 152.13,49.61 "
            style="fill:url(#gradient89acb651ebd041c6bd575d3854178b85);"
          />
          <polygon
            points="33.07,29.76 32.82,31.03 32.1,32.1 31.03,32.82 29.76,33.07 28.5,32.82 27.43,32.1 26.71,31.03 26.46,29.76 26.71,28.5 27.43,27.43 28.5,26.71 29.76,26.46 31.03,26.71 32.1,27.43 32.82,28.5 33.07,29.76 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="39.69,29.76 39.43,31.03 38.72,32.1 37.64,32.82 36.38,33.07 35.11,32.82 34.04,32.1 33.32,31.03 33.07,29.76 33.32,28.5 34.04,27.43 35.11,26.71 36.38,26.46 37.64,26.71 38.72,27.43 39.43,28.5 39.69,29.76 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="46.3,29.76 46.05,31.03 45.33,32.1 44.26,32.82 42.99,33.07 41.73,32.82 40.65,32.1 39.94,31.03 39.69,29.76 39.94,28.5 40.65,27.43 41.73,26.71 42.99,26.46 44.26,26.71 45.33,27.43 46.05,28.5 46.3,29.76 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="33.07,36.38 32.82,37.64 32.1,38.72 31.03,39.43 29.76,39.69 28.5,39.43 27.43,38.72 26.71,37.64 26.46,36.38 26.71,35.11 27.43,34.04 28.5,33.32 29.76,33.07 31.03,33.32 32.1,34.04 32.82,35.11 33.07,36.38 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="39.69,36.38 39.43,37.64 38.72,38.72 37.64,39.43 36.38,39.69 35.11,39.43 34.04,38.72 33.32,37.64 33.07,36.38 33.32,35.11 34.04,34.04 35.11,33.32 36.38,33.07 37.64,33.32 38.72,34.04 39.43,35.11 39.69,36.38 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="46.3,36.38 46.05,37.64 45.33,38.72 44.26,39.43 42.99,39.69 41.73,39.43 40.65,38.72 39.94,37.64 39.69,36.38 39.94,35.11 40.65,34.04 41.73,33.32 42.99,33.07 44.26,33.32 45.33,34.04 46.05,35.11 46.3,36.38 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="33.07,42.99 32.82,44.26 32.1,45.33 31.03,46.05 29.76,46.3 28.5,46.05 27.43,45.33 26.71,44.26 26.46,42.99 26.71,41.73 27.43,40.65 28.5,39.94 29.76,39.69 31.03,39.94 32.1,40.65 32.82,41.73 33.07,42.99 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="39.69,42.99 39.43,44.26 38.72,45.33 37.64,46.05 36.38,46.3 35.11,46.05 34.04,45.33 33.32,44.26 33.07,42.99 33.32,41.73 34.04,40.65 35.11,39.94 36.38,39.69 37.64,39.94 38.72,40.65 39.43,41.73 39.69,42.99 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="46.3,42.99 46.05,44.26 45.33,45.33 44.26,46.05 42.99,46.3 41.73,46.05 40.65,45.33 39.94,44.26 39.69,42.99 39.94,41.73 40.65,40.65 41.73,39.94 42.99,39.69 44.26,39.94 45.33,40.65 46.05,41.73 46.3,42.99 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="33.07,122.36 32.82,123.63 32.1,124.7 31.03,125.42 29.76,125.67 28.5,125.42 27.43,124.7 26.71,123.63 26.46,122.36 26.71,121.1 27.43,120.02 28.5,119.31 29.76,119.06 31.03,119.31 32.1,120.02 32.82,121.1 33.07,122.36 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="39.69,122.36 39.43,123.63 38.72,124.7 37.64,125.42 36.38,125.67 35.11,125.42 34.04,124.7 33.32,123.63 33.07,122.36 33.32,121.1 34.04,120.02 35.11,119.31 36.38,119.06 37.64,119.31 38.72,120.02 39.43,121.1 39.69,122.36 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="46.3,122.36 46.05,123.63 45.33,124.7 44.26,125.42 42.99,125.67 41.73,125.42 40.65,124.7 39.94,123.63 39.69,122.36 39.94,121.1 40.65,120.02 41.73,119.31 42.99,119.06 44.26,119.31 45.33,120.02 46.05,121.1 46.3,122.36 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="33.07,128.98 32.82,130.24 32.1,131.31 31.03,132.03 29.76,132.28 28.5,132.03 27.43,131.31 26.71,130.24 26.46,128.98 26.71,127.71 27.43,126.64 28.5,125.92 29.76,125.67 31.03,125.92 32.1,126.64 32.82,127.71 33.07,128.98 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="39.69,128.98 39.43,130.24 38.72,131.31 37.64,132.03 36.38,132.28 35.11,132.03 34.04,131.31 33.32,130.24 33.07,128.98 33.32,127.71 34.04,126.64 35.11,125.92 36.38,125.67 37.64,125.92 38.72,126.64 39.43,127.71 39.69,128.98 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="46.3,128.98 46.05,130.24 45.33,131.31 44.26,132.03 42.99,132.28 41.73,132.03 40.65,131.31 39.94,130.24 39.69,128.98 39.94,127.71 40.65,126.64 41.73,125.92 42.99,125.67 44.26,125.92 45.33,126.64 46.05,127.71 46.3,128.98 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="33.07,135.59 32.82,136.86 32.1,137.93 31.03,138.65 29.76,138.9 28.5,138.65 27.43,137.93 26.71,136.86 26.46,135.59 26.71,134.32 27.43,133.25 28.5,132.54 29.76,132.28 31.03,132.54 32.1,133.25 32.82,134.32 33.07,135.59 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="39.69,135.59 39.43,136.86 38.72,137.93 37.64,138.65 36.38,138.9 35.11,138.65 34.04,137.93 33.32,136.86 33.07,135.59 33.32,134.32 34.04,133.25 35.11,132.54 36.38,132.28 37.64,132.54 38.72,133.25 39.43,134.32 39.69,135.59 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="46.3,135.59 46.05,136.86 45.33,137.93 44.26,138.65 42.99,138.9 41.73,138.65 40.65,137.93 39.94,136.86 39.69,135.59 39.94,134.32 40.65,133.25 41.73,132.54 42.99,132.28 44.26,132.54 45.33,133.25 46.05,134.32 46.3,135.59 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="125.67,29.76 125.42,31.03 124.7,32.1 123.63,32.82 122.36,33.07 121.1,32.82 120.02,32.1 119.31,31.03 119.06,29.76 119.31,28.5 120.02,27.43 121.1,26.71 122.36,26.46 123.63,26.71 124.7,27.43 125.42,28.5 125.67,29.76 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="132.28,29.76 132.03,31.03 131.31,32.1 130.24,32.82 128.98,33.07 127.71,32.82 126.64,32.1 125.92,31.03 125.67,29.76 125.92,28.5 126.64,27.43 127.71,26.71 128.98,26.46 130.24,26.71 131.31,27.43 132.03,28.5 132.28,29.76 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="138.9,29.76 138.65,31.03 137.93,32.1 136.86,32.82 135.59,33.07 134.32,32.82 133.25,32.1 132.54,31.03 132.28,29.76 132.54,28.5 133.25,27.43 134.32,26.71 135.59,26.46 136.86,26.71 137.93,27.43 138.65,28.5 138.9,29.76 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="125.67,36.38 125.42,37.64 124.7,38.72 123.63,39.43 122.36,39.69 121.1,39.43 120.02,38.72 119.31,37.64 119.06,36.38 119.31,35.11 120.02,34.04 121.1,33.32 122.36,33.07 123.63,33.32 124.7,34.04 125.42,35.11 125.67,36.38 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="132.28,36.38 132.03,37.64 131.31,38.72 130.24,39.43 128.98,39.69 127.71,39.43 126.64,38.72 125.92,37.64 125.67,36.38 125.92,35.11 126.64,34.04 127.71,33.32 128.98,33.07 130.24,33.32 131.31,34.04 132.03,35.11 132.28,36.38 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="138.9,36.38 138.65,37.64 137.93,38.72 136.86,39.43 135.59,39.69 134.32,39.43 133.25,38.72 132.54,37.64 132.28,36.38 132.54,35.11 133.25,34.04 134.32,33.32 135.59,33.07 136.86,33.32 137.93,34.04 138.65,35.11 138.9,36.38 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="125.67,42.99 125.42,44.26 124.7,45.33 123.63,46.05 122.36,46.3 121.1,46.05 120.02,45.33 119.31,44.26 119.06,42.99 119.31,41.73 120.02,40.65 121.1,39.94 122.36,39.69 123.63,39.94 124.7,40.65 125.42,41.73 125.67,42.99 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="132.28,42.99 132.03,44.26 131.31,45.33 130.24,46.05 128.98,46.3 127.71,46.05 126.64,45.33 125.92,44.26 125.67,42.99 125.92,41.73 126.64,40.65 127.71,39.94 128.98,39.69 130.24,39.94 131.31,40.65 132.03,41.73 132.28,42.99 "
            style="fill:rgba(141,179,226,1);"
          />
          <polygon
            points="138.9,42.99 138.65,44.26 137.93,45.33 136.86,46.05 135.59,46.3 134.32,46.05 133.25,45.33 132.54,44.26 132.28,42.99 132.54,41.73 133.25,40.65 134.32,39.94 135.59,39.69 136.86,39.94 137.93,40.65 138.65,41.73 138.9,42.99 "
            style="fill:rgba(141,179,226,1);"
          />
          <linearGradient
            id="gradient9c2f877df85f404f8d09368927b6f99d"
            gradientUnits="userSpaceOnUse"
            x1="11.1772292562222"
            y1="78.9300121785742"
            x2="154.177100806644"
            y2="86.424317884292"
          >
            <stop offset="0%" stop-color="#B2A1C7" />
            <stop offset="50%" stop-color="#00FF78" />
            <stop offset="100%" stop-color="#B2A1C7" />
          </linearGradient>
          <polygon
            points="84.66,16.54 84.4,17.53 83.67,18.25 82.68,18.52 81.69,18.25 80.96,17.53 80.69,16.54 80.96,15.54 81.69,14.82 82.68,14.55 83.67,14.82 84.4,15.54 84.66,16.54 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="91.28,16.54 91.01,17.53 90.28,18.25 89.29,18.52 88.3,18.25 87.57,17.53 87.31,16.54 87.57,15.54 88.3,14.82 89.29,14.55 90.28,14.82 91.01,15.54 91.28,16.54 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="97.89,16.54 97.62,17.53 96.9,18.25 95.91,18.52 94.91,18.25 94.19,17.53 93.92,16.54 94.19,15.54 94.91,14.82 95.91,14.55 96.9,14.82 97.62,15.54 97.89,16.54 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="71.43,23.15 71.17,24.14 70.44,24.87 69.45,25.13 68.46,24.87 67.73,24.14 67.46,23.15 67.73,22.16 68.46,21.43 69.45,21.17 70.44,21.43 71.17,22.16 71.43,23.15 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="78.05,23.15 77.78,24.14 77.06,24.87 76.06,25.13 75.07,24.87 74.34,24.14 74.08,23.15 74.34,22.16 75.07,21.43 76.06,21.17 77.06,21.43 77.78,22.16 78.05,23.15 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="84.66,23.15 84.4,24.14 83.67,24.87 82.68,25.13 81.69,24.87 80.96,24.14 80.69,23.15 80.96,22.16 81.69,21.43 82.68,21.17 83.67,21.43 84.4,22.16 84.66,23.15 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="97.89,23.15 97.62,24.14 96.9,24.87 95.91,25.13 94.91,24.87 94.19,24.14 93.92,23.15 94.19,22.16 94.91,21.43 95.91,21.17 96.9,21.43 97.62,22.16 97.89,23.15 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="84.66,29.76 84.4,30.76 83.67,31.48 82.68,31.75 81.69,31.48 80.96,30.76 80.69,29.76 80.96,28.77 81.69,28.05 82.68,27.78 83.67,28.05 84.4,28.77 84.66,29.76 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="91.28,29.76 91.01,30.76 90.28,31.48 89.29,31.75 88.3,31.48 87.57,30.76 87.31,29.76 87.57,28.77 88.3,28.05 89.29,27.78 90.28,28.05 91.01,28.77 91.28,29.76 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="97.89,29.76 97.62,30.76 96.9,31.48 95.91,31.75 94.91,31.48 94.19,30.76 93.92,29.76 94.19,28.77 94.91,28.05 95.91,27.78 96.9,28.05 97.62,28.77 97.89,29.76 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="71.43,36.38 71.17,37.37 70.44,38.1 69.45,38.36 68.46,38.1 67.73,37.37 67.46,36.38 67.73,35.39 68.46,34.66 69.45,34.39 70.44,34.66 71.17,35.39 71.43,36.38 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="78.05,36.38 77.78,37.37 77.06,38.1 76.06,38.36 75.07,38.1 74.34,37.37 74.08,36.38 74.34,35.39 75.07,34.66 76.06,34.39 77.06,34.66 77.78,35.39 78.05,36.38 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="97.89,36.38 97.62,37.37 96.9,38.1 95.91,38.36 94.91,38.1 94.19,37.37 93.92,36.38 94.19,35.39 94.91,34.66 95.91,34.39 96.9,34.66 97.62,35.39 97.89,36.38 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="78.05,42.99 77.78,43.98 77.06,44.71 76.06,44.98 75.07,44.71 74.34,43.98 74.08,42.99 74.34,42 75.07,41.27 76.06,41.01 77.06,41.27 77.78,42 78.05,42.99 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="97.89,42.99 97.62,43.98 96.9,44.71 95.91,44.98 94.91,44.71 94.19,43.98 93.92,42.99 94.19,42 94.91,41.27 95.91,41.01 96.9,41.27 97.62,42 97.89,42.99 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="71.43,49.61 71.17,50.6 70.44,51.32 69.45,51.59 68.46,51.32 67.73,50.6 67.46,49.61 67.73,48.61 68.46,47.89 69.45,47.62 70.44,47.89 71.17,48.61 71.43,49.61 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="91.28,49.61 91.01,50.6 90.28,51.32 89.29,51.59 88.3,51.32 87.57,50.6 87.31,49.61 87.57,48.61 88.3,47.89 89.29,47.62 90.28,47.89 91.01,48.61 91.28,49.61 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="71.43,56.22 71.17,57.21 70.44,57.94 69.45,58.2 68.46,57.94 67.73,57.21 67.46,56.22 67.73,55.23 68.46,54.5 69.45,54.24 70.44,54.5 71.17,55.23 71.43,56.22 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="84.66,56.22 84.4,57.21 83.67,57.94 82.68,58.2 81.69,57.94 80.96,57.21 80.69,56.22 80.96,55.23 81.69,54.5 82.68,54.24 83.67,54.5 84.4,55.23 84.66,56.22 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="97.89,56.22 97.62,57.21 96.9,57.94 95.91,58.2 94.91,57.94 94.19,57.21 93.92,56.22 94.19,55.23 94.91,54.5 95.91,54.24 96.9,54.5 97.62,55.23 97.89,56.22 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="78.05,62.83 77.78,63.83 77.06,64.55 76.06,64.82 75.07,64.55 74.34,63.83 74.08,62.83 74.34,61.84 75.07,61.12 76.06,60.85 77.06,61.12 77.78,61.84 78.05,62.83 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="18.52,69.45 18.25,70.44 17.53,71.17 16.54,71.43 15.54,71.17 14.82,70.44 14.55,69.45 14.82,68.46 15.54,67.73 16.54,67.46 17.53,67.73 18.25,68.46 18.52,69.45 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="25.13,69.45 24.87,70.44 24.14,71.17 23.15,71.43 22.16,71.17 21.43,70.44 21.17,69.45 21.43,68.46 22.16,67.73 23.15,67.46 24.14,67.73 24.87,68.46 25.13,69.45 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="31.75,69.45 31.48,70.44 30.76,71.17 29.76,71.43 28.77,71.17 28.05,70.44 27.78,69.45 28.05,68.46 28.77,67.73 29.76,67.46 30.76,67.73 31.48,68.46 31.75,69.45 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="38.36,69.45 38.1,70.44 37.37,71.17 36.38,71.43 35.39,71.17 34.66,70.44 34.39,69.45 34.66,68.46 35.39,67.73 36.38,67.46 37.37,67.73 38.1,68.46 38.36,69.45 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="44.98,69.45 44.71,70.44 43.98,71.17 42.99,71.43 42,71.17 41.27,70.44 41.01,69.45 41.27,68.46 42,67.73 42.99,67.46 43.98,67.73 44.71,68.46 44.98,69.45 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="58.2,69.45 57.94,70.44 57.21,71.17 56.22,71.43 55.23,71.17 54.5,70.44 54.24,69.45 54.5,68.46 55.23,67.73 56.22,67.46 57.21,67.73 57.94,68.46 58.2,69.45 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="64.82,69.45 64.55,70.44 63.83,71.17 62.83,71.43 61.84,71.17 61.12,70.44 60.85,69.45 61.12,68.46 61.84,67.73 62.83,67.46 63.83,67.73 64.55,68.46 64.82,69.45 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="71.43,69.45 71.17,70.44 70.44,71.17 69.45,71.43 68.46,71.17 67.73,70.44 67.46,69.45 67.73,68.46 68.46,67.73 69.45,67.46 70.44,67.73 71.17,68.46 71.43,69.45 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="91.28,69.45 91.01,70.44 90.28,71.17 89.29,71.43 88.3,71.17 87.57,70.44 87.31,69.45 87.57,68.46 88.3,67.73 89.29,67.46 90.28,67.73 91.01,68.46 91.28,69.45 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="104.5,69.45 104.24,70.44 103.51,71.17 102.52,71.43 101.53,71.17 100.8,70.44 100.54,69.45 100.8,68.46 101.53,67.73 102.52,67.46 103.51,67.73 104.24,68.46 104.5,69.45 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="117.73,69.45 117.47,70.44 116.74,71.17 115.75,71.43 114.76,71.17 114.03,70.44 113.76,69.45 114.03,68.46 114.76,67.73 115.75,67.46 116.74,67.73 117.47,68.46 117.73,69.45 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="130.96,69.45 130.69,70.44 129.97,71.17 128.98,71.43 127.98,71.17 127.26,70.44 126.99,69.45 127.26,68.46 127.98,67.73 128.98,67.46 129.97,67.73 130.69,68.46 130.96,69.45 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="144.19,69.45 143.92,70.44 143.2,71.17 142.2,71.43 141.21,71.17 140.49,70.44 140.22,69.45 140.49,68.46 141.21,67.73 142.2,67.46 143.2,67.73 143.92,68.46 144.19,69.45 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="18.52,76.06 18.25,77.06 17.53,77.78 16.54,78.05 15.54,77.78 14.82,77.06 14.55,76.06 14.82,75.07 15.54,74.34 16.54,74.08 17.53,74.34 18.25,75.07 18.52,76.06 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="25.13,76.06 24.87,77.06 24.14,77.78 23.15,78.05 22.16,77.78 21.43,77.06 21.17,76.06 21.43,75.07 22.16,74.34 23.15,74.08 24.14,74.34 24.87,75.07 25.13,76.06 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="31.75,76.06 31.48,77.06 30.76,77.78 29.76,78.05 28.77,77.78 28.05,77.06 27.78,76.06 28.05,75.07 28.77,74.34 29.76,74.08 30.76,74.34 31.48,75.07 31.75,76.06 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="51.59,76.06 51.32,77.06 50.6,77.78 49.61,78.05 48.61,77.78 47.89,77.06 47.62,76.06 47.89,75.07 48.61,74.34 49.61,74.08 50.6,74.34 51.32,75.07 51.59,76.06 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="64.82,76.06 64.55,77.06 63.83,77.78 62.83,78.05 61.84,77.78 61.12,77.06 60.85,76.06 61.12,75.07 61.84,74.34 62.83,74.08 63.83,74.34 64.55,75.07 64.82,76.06 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="78.05,76.06 77.78,77.06 77.06,77.78 76.06,78.05 75.07,77.78 74.34,77.06 74.08,76.06 74.34,75.07 75.07,74.34 76.06,74.08 77.06,74.34 77.78,75.07 78.05,76.06 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="91.28,76.06 91.01,77.06 90.28,77.78 89.29,78.05 88.3,77.78 87.57,77.06 87.31,76.06 87.57,75.07 88.3,74.34 89.29,74.08 90.28,74.34 91.01,75.07 91.28,76.06 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="97.89,76.06 97.62,77.06 96.9,77.78 95.91,78.05 94.91,77.78 94.19,77.06 93.92,76.06 94.19,75.07 94.91,74.34 95.91,74.08 96.9,74.34 97.62,75.07 97.89,76.06 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="104.5,76.06 104.24,77.06 103.51,77.78 102.52,78.05 101.53,77.78 100.8,77.06 100.54,76.06 100.8,75.07 101.53,74.34 102.52,74.08 103.51,74.34 104.24,75.07 104.5,76.06 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="111.12,76.06 110.85,77.06 110.13,77.78 109.13,78.05 108.14,77.78 107.42,77.06 107.15,76.06 107.42,75.07 108.14,74.34 109.13,74.08 110.13,74.34 110.85,75.07 111.12,76.06 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="130.96,76.06 130.69,77.06 129.97,77.78 128.98,78.05 127.98,77.78 127.26,77.06 126.99,76.06 127.26,75.07 127.98,74.34 128.98,74.08 129.97,74.34 130.69,75.07 130.96,76.06 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="137.57,76.06 137.31,77.06 136.58,77.78 135.59,78.05 134.6,77.78 133.87,77.06 133.61,76.06 133.87,75.07 134.6,74.34 135.59,74.08 136.58,74.34 137.31,75.07 137.57,76.06 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="144.19,76.06 143.92,77.06 143.2,77.78 142.2,78.05 141.21,77.78 140.49,77.06 140.22,76.06 140.49,75.07 141.21,74.34 142.2,74.08 143.2,74.34 143.92,75.07 144.19,76.06 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="150.8,76.06 150.54,77.06 149.81,77.78 148.82,78.05 147.83,77.78 147.1,77.06 146.83,76.06 147.1,75.07 147.83,74.34 148.82,74.08 149.81,74.34 150.54,75.07 150.8,76.06 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="31.75,82.68 31.48,83.67 30.76,84.4 29.76,84.66 28.77,84.4 28.05,83.67 27.78,82.68 28.05,81.69 28.77,80.96 29.76,80.69 30.76,80.96 31.48,81.69 31.75,82.68 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="44.98,82.68 44.71,83.67 43.98,84.4 42.99,84.66 42,84.4 41.27,83.67 41.01,82.68 41.27,81.69 42,80.96 42.99,80.69 43.98,80.96 44.71,81.69 44.98,82.68 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="51.59,82.68 51.32,83.67 50.6,84.4 49.61,84.66 48.61,84.4 47.89,83.67 47.62,82.68 47.89,81.69 48.61,80.96 49.61,80.69 50.6,80.96 51.32,81.69 51.59,82.68 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="58.2,82.68 57.94,83.67 57.21,84.4 56.22,84.66 55.23,84.4 54.5,83.67 54.24,82.68 54.5,81.69 55.23,80.96 56.22,80.69 57.21,80.96 57.94,81.69 58.2,82.68 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="71.43,82.68 71.17,83.67 70.44,84.4 69.45,84.66 68.46,84.4 67.73,83.67 67.46,82.68 67.73,81.69 68.46,80.96 69.45,80.69 70.44,80.96 71.17,81.69 71.43,82.68 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="78.05,82.68 77.78,83.67 77.06,84.4 76.06,84.66 75.07,84.4 74.34,83.67 74.08,82.68 74.34,81.69 75.07,80.96 76.06,80.69 77.06,80.96 77.78,81.69 78.05,82.68 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="97.89,82.68 97.62,83.67 96.9,84.4 95.91,84.66 94.91,84.4 94.19,83.67 93.92,82.68 94.19,81.69 94.91,80.96 95.91,80.69 96.9,80.96 97.62,81.69 97.89,82.68 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="111.12,82.68 110.85,83.67 110.13,84.4 109.13,84.66 108.14,84.4 107.42,83.67 107.15,82.68 107.42,81.69 108.14,80.96 109.13,80.69 110.13,80.96 110.85,81.69 111.12,82.68 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="117.73,82.68 117.47,83.67 116.74,84.4 115.75,84.66 114.76,84.4 114.03,83.67 113.76,82.68 114.03,81.69 114.76,80.96 115.75,80.69 116.74,80.96 117.47,81.69 117.73,82.68 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="130.96,82.68 130.69,83.67 129.97,84.4 128.98,84.66 127.98,84.4 127.26,83.67 126.99,82.68 127.26,81.69 127.98,80.96 128.98,80.69 129.97,80.96 130.69,81.69 130.96,82.68 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="150.8,82.68 150.54,83.67 149.81,84.4 148.82,84.66 147.83,84.4 147.1,83.67 146.83,82.68 147.1,81.69 147.83,80.96 148.82,80.69 149.81,80.96 150.54,81.69 150.8,82.68 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="18.52,89.29 18.25,90.28 17.53,91.01 16.54,91.28 15.54,91.01 14.82,90.28 14.55,89.29 14.82,88.3 15.54,87.57 16.54,87.31 17.53,87.57 18.25,88.3 18.52,89.29 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="38.36,89.29 38.1,90.28 37.37,91.01 36.38,91.28 35.39,91.01 34.66,90.28 34.39,89.29 34.66,88.3 35.39,87.57 36.38,87.31 37.37,87.57 38.1,88.3 38.36,89.29 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="91.28,89.29 91.01,90.28 90.28,91.01 89.29,91.28 88.3,91.01 87.57,90.28 87.31,89.29 87.57,88.3 88.3,87.57 89.29,87.31 90.28,87.57 91.01,88.3 91.28,89.29 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="97.89,89.29 97.62,90.28 96.9,91.01 95.91,91.28 94.91,91.01 94.19,90.28 93.92,89.29 94.19,88.3 94.91,87.57 95.91,87.31 96.9,87.57 97.62,88.3 97.89,89.29 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="104.5,89.29 104.24,90.28 103.51,91.01 102.52,91.28 101.53,91.01 100.8,90.28 100.54,89.29 100.8,88.3 101.53,87.57 102.52,87.31 103.51,87.57 104.24,88.3 104.5,89.29 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="111.12,89.29 110.85,90.28 110.13,91.01 109.13,91.28 108.14,91.01 107.42,90.28 107.15,89.29 107.42,88.3 108.14,87.57 109.13,87.31 110.13,87.57 110.85,88.3 111.12,89.29 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="137.57,89.29 137.31,90.28 136.58,91.01 135.59,91.28 134.6,91.01 133.87,90.28 133.61,89.29 133.87,88.3 134.6,87.57 135.59,87.31 136.58,87.57 137.31,88.3 137.57,89.29 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="144.19,89.29 143.92,90.28 143.2,91.01 142.2,91.28 141.21,91.01 140.49,90.28 140.22,89.29 140.49,88.3 141.21,87.57 142.2,87.31 143.2,87.57 143.92,88.3 144.19,89.29 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="150.8,89.29 150.54,90.28 149.81,91.01 148.82,91.28 147.83,91.01 147.1,90.28 146.83,89.29 147.1,88.3 147.83,87.57 148.82,87.31 149.81,87.57 150.54,88.3 150.8,89.29 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="25.13,95.91 24.87,96.9 24.14,97.62 23.15,97.89 22.16,97.62 21.43,96.9 21.17,95.91 21.43,94.91 22.16,94.19 23.15,93.92 24.14,94.19 24.87,94.91 25.13,95.91 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="38.36,95.91 38.1,96.9 37.37,97.62 36.38,97.89 35.39,97.62 34.66,96.9 34.39,95.91 34.66,94.91 35.39,94.19 36.38,93.92 37.37,94.19 38.1,94.91 38.36,95.91 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="44.98,95.91 44.71,96.9 43.98,97.62 42.99,97.89 42,97.62 41.27,96.9 41.01,95.91 41.27,94.91 42,94.19 42.99,93.92 43.98,94.19 44.71,94.91 44.98,95.91 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="58.2,95.91 57.94,96.9 57.21,97.62 56.22,97.89 55.23,97.62 54.5,96.9 54.24,95.91 54.5,94.91 55.23,94.19 56.22,93.92 57.21,94.19 57.94,94.91 58.2,95.91 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="71.43,95.91 71.17,96.9 70.44,97.62 69.45,97.89 68.46,97.62 67.73,96.9 67.46,95.91 67.73,94.91 68.46,94.19 69.45,93.92 70.44,94.19 71.17,94.91 71.43,95.91 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="78.05,95.91 77.78,96.9 77.06,97.62 76.06,97.89 75.07,97.62 74.34,96.9 74.08,95.91 74.34,94.91 75.07,94.19 76.06,93.92 77.06,94.19 77.78,94.91 78.05,95.91 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="97.89,95.91 97.62,96.9 96.9,97.62 95.91,97.89 94.91,97.62 94.19,96.9 93.92,95.91 94.19,94.91 94.91,94.19 95.91,93.92 96.9,94.19 97.62,94.91 97.89,95.91 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="117.73,95.91 117.47,96.9 116.74,97.62 115.75,97.89 114.76,97.62 114.03,96.9 113.76,95.91 114.03,94.91 114.76,94.19 115.75,93.92 116.74,94.19 117.47,94.91 117.73,95.91 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="144.19,95.91 143.92,96.9 143.2,97.62 142.2,97.89 141.21,97.62 140.49,96.9 140.22,95.91 140.49,94.91 141.21,94.19 142.2,93.92 143.2,94.19 143.92,94.91 144.19,95.91 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="71.43,102.52 71.17,103.51 70.44,104.24 69.45,104.5 68.46,104.24 67.73,103.51 67.46,102.52 67.73,101.53 68.46,100.8 69.45,100.54 70.44,100.8 71.17,101.53 71.43,102.52 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="84.66,102.52 84.4,103.51 83.67,104.24 82.68,104.5 81.69,104.24 80.96,103.51 80.69,102.52 80.96,101.53 81.69,100.8 82.68,100.54 83.67,100.8 84.4,101.53 84.66,102.52 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="97.89,102.52 97.62,103.51 96.9,104.24 95.91,104.5 94.91,104.24 94.19,103.51 93.92,102.52 94.19,101.53 94.91,100.8 95.91,100.54 96.9,100.8 97.62,101.53 97.89,102.52 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="117.73,102.52 117.47,103.51 116.74,104.24 115.75,104.5 114.76,104.24 114.03,103.51 113.76,102.52 114.03,101.53 114.76,100.8 115.75,100.54 116.74,100.8 117.47,101.53 117.73,102.52 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="137.57,102.52 137.31,103.51 136.58,104.24 135.59,104.5 134.6,104.24 133.87,103.51 133.61,102.52 133.87,101.53 134.6,100.8 135.59,100.54 136.58,100.8 137.31,101.53 137.57,102.52 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="71.43,109.13 71.17,110.13 70.44,110.85 69.45,111.12 68.46,110.85 67.73,110.13 67.46,109.13 67.73,108.14 68.46,107.42 69.45,107.15 70.44,107.42 71.17,108.14 71.43,109.13 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="91.28,109.13 91.01,110.13 90.28,110.85 89.29,111.12 88.3,110.85 87.57,110.13 87.31,109.13 87.57,108.14 88.3,107.42 89.29,107.15 90.28,107.42 91.01,108.14 91.28,109.13 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="104.5,109.13 104.24,110.13 103.51,110.85 102.52,111.12 101.53,110.85 100.8,110.13 100.54,109.13 100.8,108.14 101.53,107.42 102.52,107.15 103.51,107.42 104.24,108.14 104.5,109.13 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="124.35,109.13 124.08,110.13 123.35,110.85 122.36,111.12 121.37,110.85 120.64,110.13 120.38,109.13 120.64,108.14 121.37,107.42 122.36,107.15 123.35,107.42 124.08,108.14 124.35,109.13 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="130.96,109.13 130.69,110.13 129.97,110.85 128.98,111.12 127.98,110.85 127.26,110.13 126.99,109.13 127.26,108.14 127.98,107.42 128.98,107.15 129.97,107.42 130.69,108.14 130.96,109.13 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="144.19,109.13 143.92,110.13 143.2,110.85 142.2,111.12 141.21,110.85 140.49,110.13 140.22,109.13 140.49,108.14 141.21,107.42 142.2,107.15 143.2,107.42 143.92,108.14 144.19,109.13 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="150.8,109.13 150.54,110.13 149.81,110.85 148.82,111.12 147.83,110.85 147.1,110.13 146.83,109.13 147.1,108.14 147.83,107.42 148.82,107.15 149.81,107.42 150.54,108.14 150.8,109.13 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="78.05,115.75 77.78,116.74 77.06,117.47 76.06,117.73 75.07,117.47 74.34,116.74 74.08,115.75 74.34,114.76 75.07,114.03 76.06,113.76 77.06,114.03 77.78,114.76 78.05,115.75 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="84.66,115.75 84.4,116.74 83.67,117.47 82.68,117.73 81.69,117.47 80.96,116.74 80.69,115.75 80.96,114.76 81.69,114.03 82.68,113.76 83.67,114.03 84.4,114.76 84.66,115.75 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="117.73,115.75 117.47,116.74 116.74,117.47 115.75,117.73 114.76,117.47 114.03,116.74 113.76,115.75 114.03,114.76 114.76,114.03 115.75,113.76 116.74,114.03 117.47,114.76 117.73,115.75 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="124.35,115.75 124.08,116.74 123.35,117.47 122.36,117.73 121.37,117.47 120.64,116.74 120.38,115.75 120.64,114.76 121.37,114.03 122.36,113.76 123.35,114.03 124.08,114.76 124.35,115.75 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="137.57,115.75 137.31,116.74 136.58,117.47 135.59,117.73 134.6,117.47 133.87,116.74 133.61,115.75 133.87,114.76 134.6,114.03 135.59,113.76 136.58,114.03 137.31,114.76 137.57,115.75 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="150.8,115.75 150.54,116.74 149.81,117.47 148.82,117.73 147.83,117.47 147.1,116.74 146.83,115.75 147.1,114.76 147.83,114.03 148.82,113.76 149.81,114.03 150.54,114.76 150.8,115.75 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="71.43,122.36 71.17,123.35 70.44,124.08 69.45,124.35 68.46,124.08 67.73,123.35 67.46,122.36 67.73,121.37 68.46,120.64 69.45,120.38 70.44,120.64 71.17,121.37 71.43,122.36 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="78.05,122.36 77.78,123.35 77.06,124.08 76.06,124.35 75.07,124.08 74.34,123.35 74.08,122.36 74.34,121.37 75.07,120.64 76.06,120.38 77.06,120.64 77.78,121.37 78.05,122.36 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="84.66,122.36 84.4,123.35 83.67,124.08 82.68,124.35 81.69,124.08 80.96,123.35 80.69,122.36 80.96,121.37 81.69,120.64 82.68,120.38 83.67,120.64 84.4,121.37 84.66,122.36 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="91.28,122.36 91.01,123.35 90.28,124.08 89.29,124.35 88.3,124.08 87.57,123.35 87.31,122.36 87.57,121.37 88.3,120.64 89.29,120.38 90.28,120.64 91.01,121.37 91.28,122.36 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="104.5,122.36 104.24,123.35 103.51,124.08 102.52,124.35 101.53,124.08 100.8,123.35 100.54,122.36 100.8,121.37 101.53,120.64 102.52,120.38 103.51,120.64 104.24,121.37 104.5,122.36 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="124.35,122.36 124.08,123.35 123.35,124.08 122.36,124.35 121.37,124.08 120.64,123.35 120.38,122.36 120.64,121.37 121.37,120.64 122.36,120.38 123.35,120.64 124.08,121.37 124.35,122.36 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="130.96,122.36 130.69,123.35 129.97,124.08 128.98,124.35 127.98,124.08 127.26,123.35 126.99,122.36 127.26,121.37 127.98,120.64 128.98,120.38 129.97,120.64 130.69,121.37 130.96,122.36 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="137.57,122.36 137.31,123.35 136.58,124.08 135.59,124.35 134.6,124.08 133.87,123.35 133.61,122.36 133.87,121.37 134.6,120.64 135.59,120.38 136.58,120.64 137.31,121.37 137.57,122.36 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="71.43,128.98 71.17,129.97 70.44,130.69 69.45,130.96 68.46,130.69 67.73,129.97 67.46,128.98 67.73,127.98 68.46,127.26 69.45,126.99 70.44,127.26 71.17,127.98 71.43,128.98 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="78.05,128.98 77.78,129.97 77.06,130.69 76.06,130.96 75.07,130.69 74.34,129.97 74.08,128.98 74.34,127.98 75.07,127.26 76.06,126.99 77.06,127.26 77.78,127.98 78.05,128.98 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="91.28,128.98 91.01,129.97 90.28,130.69 89.29,130.96 88.3,130.69 87.57,129.97 87.31,128.98 87.57,127.98 88.3,127.26 89.29,126.99 90.28,127.26 91.01,127.98 91.28,128.98 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="97.89,128.98 97.62,129.97 96.9,130.69 95.91,130.96 94.91,130.69 94.19,129.97 93.92,128.98 94.19,127.98 94.91,127.26 95.91,126.99 96.9,127.26 97.62,127.98 97.89,128.98 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="104.5,128.98 104.24,129.97 103.51,130.69 102.52,130.96 101.53,130.69 100.8,129.97 100.54,128.98 100.8,127.98 101.53,127.26 102.52,126.99 103.51,127.26 104.24,127.98 104.5,128.98 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="111.12,128.98 110.85,129.97 110.13,130.69 109.13,130.96 108.14,130.69 107.42,129.97 107.15,128.98 107.42,127.98 108.14,127.26 109.13,126.99 110.13,127.26 110.85,127.98 111.12,128.98 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="117.73,128.98 117.47,129.97 116.74,130.69 115.75,130.96 114.76,130.69 114.03,129.97 113.76,128.98 114.03,127.98 114.76,127.26 115.75,126.99 116.74,127.26 117.47,127.98 117.73,128.98 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="130.96,128.98 130.69,129.97 129.97,130.69 128.98,130.96 127.98,130.69 127.26,129.97 126.99,128.98 127.26,127.98 127.98,127.26 128.98,126.99 129.97,127.26 130.69,127.98 130.96,128.98 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="137.57,128.98 137.31,129.97 136.58,130.69 135.59,130.96 134.6,130.69 133.87,129.97 133.61,128.98 133.87,127.98 134.6,127.26 135.59,126.99 136.58,127.26 137.31,127.98 137.57,128.98 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="71.43,135.59 71.17,136.58 70.44,137.31 69.45,137.57 68.46,137.31 67.73,136.58 67.46,135.59 67.73,134.6 68.46,133.87 69.45,133.61 70.44,133.87 71.17,134.6 71.43,135.59 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="78.05,135.59 77.78,136.58 77.06,137.31 76.06,137.57 75.07,137.31 74.34,136.58 74.08,135.59 74.34,134.6 75.07,133.87 76.06,133.61 77.06,133.87 77.78,134.6 78.05,135.59 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="97.89,135.59 97.62,136.58 96.9,137.31 95.91,137.57 94.91,137.31 94.19,136.58 93.92,135.59 94.19,134.6 94.91,133.87 95.91,133.61 96.9,133.87 97.62,134.6 97.89,135.59 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="111.12,135.59 110.85,136.58 110.13,137.31 109.13,137.57 108.14,137.31 107.42,136.58 107.15,135.59 107.42,134.6 108.14,133.87 109.13,133.61 110.13,133.87 110.85,134.6 111.12,135.59 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="117.73,135.59 117.47,136.58 116.74,137.31 115.75,137.57 114.76,137.31 114.03,136.58 113.76,135.59 114.03,134.6 114.76,133.87 115.75,133.61 116.74,133.87 117.47,134.6 117.73,135.59 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="130.96,135.59 130.69,136.58 129.97,137.31 128.98,137.57 127.98,137.31 127.26,136.58 126.99,135.59 127.26,134.6 127.98,133.87 128.98,133.61 129.97,133.87 130.69,134.6 130.96,135.59 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="137.57,135.59 137.31,136.58 136.58,137.31 135.59,137.57 134.6,137.31 133.87,136.58 133.61,135.59 133.87,134.6 134.6,133.87 135.59,133.61 136.58,133.87 137.31,134.6 137.57,135.59 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="71.43,142.2 71.17,143.2 70.44,143.92 69.45,144.19 68.46,143.92 67.73,143.2 67.46,142.2 67.73,141.21 68.46,140.49 69.45,140.22 70.44,140.49 71.17,141.21 71.43,142.2 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="84.66,142.2 84.4,143.2 83.67,143.92 82.68,144.19 81.69,143.92 80.96,143.2 80.69,142.2 80.96,141.21 81.69,140.49 82.68,140.22 83.67,140.49 84.4,141.21 84.66,142.2 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="91.28,142.2 91.01,143.2 90.28,143.92 89.29,144.19 88.3,143.92 87.57,143.2 87.31,142.2 87.57,141.21 88.3,140.49 89.29,140.22 90.28,140.49 91.01,141.21 91.28,142.2 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="97.89,142.2 97.62,143.2 96.9,143.92 95.91,144.19 94.91,143.92 94.19,143.2 93.92,142.2 94.19,141.21 94.91,140.49 95.91,140.22 96.9,140.49 97.62,141.21 97.89,142.2 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="104.5,142.2 104.24,143.2 103.51,143.92 102.52,144.19 101.53,143.92 100.8,143.2 100.54,142.2 100.8,141.21 101.53,140.49 102.52,140.22 103.51,140.49 104.24,141.21 104.5,142.2 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="111.12,142.2 110.85,143.2 110.13,143.92 109.13,144.19 108.14,143.92 107.42,143.2 107.15,142.2 107.42,141.21 108.14,140.49 109.13,140.22 110.13,140.49 110.85,141.21 111.12,142.2 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="117.73,142.2 117.47,143.2 116.74,143.92 115.75,144.19 114.76,143.92 114.03,143.2 113.76,142.2 114.03,141.21 114.76,140.49 115.75,140.22 116.74,140.49 117.47,141.21 117.73,142.2 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="124.35,142.2 124.08,143.2 123.35,143.92 122.36,144.19 121.37,143.92 120.64,143.2 120.38,142.2 120.64,141.21 121.37,140.49 122.36,140.22 123.35,140.49 124.08,141.21 124.35,142.2 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="137.57,142.2 137.31,143.2 136.58,143.92 135.59,144.19 134.6,143.92 133.87,143.2 133.61,142.2 133.87,141.21 134.6,140.49 135.59,140.22 136.58,140.49 137.31,141.21 137.57,142.2 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="144.19,142.2 143.92,143.2 143.2,143.92 142.2,144.19 141.21,143.92 140.49,143.2 140.22,142.2 140.49,141.21 141.21,140.49 142.2,140.22 143.2,140.49 143.92,141.21 144.19,142.2 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="71.43,148.82 71.17,149.81 70.44,150.54 69.45,150.8 68.46,150.54 67.73,149.81 67.46,148.82 67.73,147.83 68.46,147.1 69.45,146.83 70.44,147.1 71.17,147.83 71.43,148.82 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="78.05,148.82 77.78,149.81 77.06,150.54 76.06,150.8 75.07,150.54 74.34,149.81 74.08,148.82 74.34,147.83 75.07,147.1 76.06,146.83 77.06,147.1 77.78,147.83 78.05,148.82 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="84.66,148.82 84.4,149.81 83.67,150.54 82.68,150.8 81.69,150.54 80.96,149.81 80.69,148.82 80.96,147.83 81.69,147.1 82.68,146.83 83.67,147.1 84.4,147.83 84.66,148.82 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="97.89,148.82 97.62,149.81 96.9,150.54 95.91,150.8 94.91,150.54 94.19,149.81 93.92,148.82 94.19,147.83 94.91,147.1 95.91,146.83 96.9,147.1 97.62,147.83 97.89,148.82 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="117.73,148.82 117.47,149.81 116.74,150.54 115.75,150.8 114.76,150.54 114.03,149.81 113.76,148.82 114.03,147.83 114.76,147.1 115.75,146.83 116.74,147.1 117.47,147.83 117.73,148.82 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
          <polygon
            points="137.57,148.82 137.31,149.81 136.58,150.54 135.59,150.8 134.6,150.54 133.87,149.81 133.61,148.82 133.87,147.83 134.6,147.1 135.59,146.83 136.58,147.1 137.31,147.83 137.57,148.82 "
            style="fill:url(#gradient9c2f877df85f404f8d09368927b6f99d);"
          />
      `,
            },
            {
                value: 13,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(255,255,255,0);"
            shape-rendering="crispEdges"
          />
          <polygon
            points="13.23,29.76 13.55,26.54 14.49,23.44 16.02,20.58 18.07,18.07 20.58,16.02 23.44,14.49 26.54,13.55 29.76,13.23 42.99,13.23 46.22,13.55 49.32,14.49 52.18,16.02 54.68,18.07 56.74,20.58 58.27,23.44 59.21,26.54 59.53,29.76 59.53,42.99 59.21,46.22 58.27,49.32 56.74,52.18 54.68,54.68 52.18,56.74 49.32,58.27 46.22,59.21 42.99,59.53 29.76,59.53 26.54,59.21 23.44,58.27 20.58,56.74 18.07,54.68 16.02,52.18 14.49,49.32 13.55,46.22 13.23,42.99 13.23,29.76 19.84,29.76 19.84,42.99 20.18,45.56 21.17,47.95 22.75,50.01 24.8,51.58 27.2,52.58 29.76,52.91 42.99,52.91 45.56,52.58 47.95,51.58 50.01,50.01 51.58,47.95 52.58,45.56 52.91,42.99 52.91,29.76 52.58,27.2 51.58,24.8 50.01,22.75 47.95,21.17 45.56,20.18 42.99,19.84 29.76,19.84 27.2,20.18 24.8,21.17 22.75,22.75 21.17,24.8 20.18,27.2 19.84,29.76 "
            style="fill:rgba(88,66,111,1);"
          />
          <polygon
            points="13.23,122.36 13.55,119.14 14.49,116.03 16.02,113.18 18.07,110.67 20.58,108.61 23.44,107.09 26.54,106.14 29.76,105.83 42.99,105.83 46.22,106.14 49.32,107.09 52.18,108.61 54.68,110.67 56.74,113.18 58.27,116.03 59.21,119.14 59.53,122.36 59.53,135.59 59.21,138.82 58.27,141.92 56.74,144.78 54.68,147.28 52.18,149.34 49.32,150.87 46.22,151.81 42.99,152.13 29.76,152.13 26.54,151.81 23.44,150.87 20.58,149.34 18.07,147.28 16.02,144.78 14.49,141.92 13.55,138.82 13.23,135.59 13.23,122.36 19.84,122.36 19.84,135.59 20.18,138.16 21.17,140.55 22.75,142.61 24.8,144.18 27.2,145.17 29.76,145.51 42.99,145.51 45.56,145.17 47.95,144.18 50.01,142.61 51.58,140.55 52.58,138.16 52.91,135.59 52.91,122.36 52.58,119.79 51.58,117.4 50.01,115.35 47.95,113.77 45.56,112.78 42.99,112.44 29.76,112.44 27.2,112.78 24.8,113.77 22.75,115.35 21.17,117.4 20.18,119.79 19.84,122.36 "
            style="fill:rgba(88,66,111,1);"
          />
          <polygon
            points="105.83,29.76 106.14,26.54 107.09,23.44 108.61,20.58 110.67,18.07 113.18,16.02 116.03,14.49 119.14,13.55 122.36,13.23 135.59,13.23 138.82,13.55 141.92,14.49 144.78,16.02 147.28,18.07 149.34,20.58 150.87,23.44 151.81,26.54 152.13,29.76 152.13,42.99 151.81,46.22 150.87,49.32 149.34,52.18 147.28,54.68 144.78,56.74 141.92,58.27 138.82,59.21 135.59,59.53 122.36,59.53 119.14,59.21 116.03,58.27 113.18,56.74 110.67,54.68 108.61,52.18 107.09,49.32 106.14,46.22 105.83,42.99 105.83,29.76 112.44,29.76 112.44,42.99 112.78,45.56 113.77,47.95 115.35,50.01 117.4,51.58 119.79,52.58 122.36,52.91 135.59,52.91 138.16,52.58 140.55,51.58 142.61,50.01 144.18,47.95 145.17,45.56 145.51,42.99 145.51,29.76 145.17,27.2 144.18,24.8 142.61,22.75 140.55,21.17 138.16,20.18 135.59,19.84 122.36,19.84 119.79,20.18 117.4,21.17 115.35,22.75 113.77,24.8 112.78,27.2 112.44,29.76 "
            style="fill:rgba(88,66,111,1);"
          />
          <polygon
            points="29.43,32.74 28.29,32.51 27.33,31.87 26.68,30.9 26.46,29.76 26.68,28.62 27.33,27.66 28.29,27.01 29.43,26.79 43.32,26.79 44.46,27.01 45.43,27.66 46.07,28.62 46.3,29.76 46.07,30.9 45.43,31.87 44.46,32.51 43.32,32.74 "
            style="fill:rgba(211,135,84,1);"
          />
          <polygon
            points="29.43,39.35 28.29,39.13 27.33,38.48 26.68,37.52 26.46,36.38 26.68,35.24 27.33,34.27 28.29,33.63 29.43,33.4 43.32,33.4 44.46,33.63 45.43,34.27 46.07,35.24 46.3,36.38 46.07,37.52 45.43,38.48 44.46,39.13 43.32,39.35 "
            style="fill:rgba(211,135,84,1);"
          />
          <polygon
            points="29.43,45.97 28.29,45.74 27.33,45.1 26.68,44.13 26.46,42.99 26.68,41.85 27.33,40.89 28.29,40.24 29.43,40.02 43.32,40.02 44.46,40.24 45.43,40.89 46.07,41.85 46.3,42.99 46.07,44.13 45.43,45.1 44.46,45.74 43.32,45.97 "
            style="fill:rgba(211,135,84,1);"
          />
          <polygon
            points="29.43,125.34 28.29,125.11 27.33,124.47 26.68,123.5 26.46,122.36 26.68,121.22 27.33,120.26 28.29,119.61 29.43,119.39 43.32,119.39 44.46,119.61 45.43,120.26 46.07,121.22 46.3,122.36 46.07,123.5 45.43,124.47 44.46,125.11 43.32,125.34 "
            style="fill:rgba(211,135,84,1);"
          />
          <polygon
            points="29.43,131.95 28.29,131.73 27.33,131.08 26.68,130.12 26.46,128.98 26.68,127.84 27.33,126.87 28.29,126.23 29.43,126 43.32,126 44.46,126.23 45.43,126.87 46.07,127.84 46.3,128.98 46.07,130.12 45.43,131.08 44.46,131.73 43.32,131.95 "
            style="fill:rgba(211,135,84,1);"
          />
          <polygon
            points="29.43,138.57 28.29,138.34 27.33,137.7 26.68,136.73 26.46,135.59 26.68,134.45 27.33,133.49 28.29,132.84 29.43,132.61 43.32,132.61 44.46,132.84 45.43,133.49 46.07,134.45 46.3,135.59 46.07,136.73 45.43,137.7 44.46,138.34 43.32,138.57 "
            style="fill:rgba(211,135,84,1);"
          />
          <polygon
            points="122.03,32.74 120.89,32.51 119.93,31.87 119.28,30.9 119.06,29.76 119.28,28.62 119.93,27.66 120.89,27.01 122.03,26.79 135.92,26.79 137.06,27.01 138.03,27.66 138.67,28.62 138.9,29.76 138.67,30.9 138.03,31.87 137.06,32.51 135.92,32.74 "
            style="fill:rgba(211,135,84,1);"
          />
          <polygon
            points="122.03,39.35 120.89,39.13 119.93,38.48 119.28,37.52 119.06,36.38 119.28,35.24 119.93,34.27 120.89,33.63 122.03,33.4 135.92,33.4 137.06,33.63 138.03,34.27 138.67,35.24 138.9,36.38 138.67,37.52 138.03,38.48 137.06,39.13 135.92,39.35 "
            style="fill:rgba(211,135,84,1);"
          />
          <polygon
            points="122.03,45.97 120.89,45.74 119.93,45.1 119.28,44.13 119.06,42.99 119.28,41.85 119.93,40.89 120.89,40.24 122.03,40.02 135.92,40.02 137.06,40.24 138.03,40.89 138.67,41.85 138.9,42.99 138.67,44.13 138.03,45.1 137.06,45.74 135.92,45.97 "
            style="fill:rgba(211,135,84,1);"
          />
          <polygon
            points="13.89,68.79 14.09,67.77 14.66,66.92 15.52,66.34 16.54,66.14 17.55,66.34 18.41,66.92 18.98,67.77 19.18,68.79 19.18,75.4 18.98,76.41 18.41,77.27 17.55,77.85 16.54,78.05 15.52,77.85 14.66,77.27 14.09,76.41 13.89,75.4 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="13.89,88.63 14.09,87.62 14.66,86.76 15.52,86.19 16.54,85.98 17.55,86.19 18.41,86.76 18.98,87.62 19.18,88.63 19.18,88.63 18.98,89.64 18.41,90.5 17.55,91.07 16.54,91.28 15.52,91.07 14.66,90.5 14.09,89.64 13.89,88.63 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="20.5,68.79 20.71,67.77 21.28,66.92 22.14,66.34 23.15,66.14 24.16,66.34 25.02,66.92 25.59,67.77 25.8,68.79 25.8,75.4 25.59,76.41 25.02,77.27 24.16,77.85 23.15,78.05 22.14,77.85 21.28,77.27 20.71,76.41 20.5,75.4 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="20.5,95.24 20.71,94.23 21.28,93.37 22.14,92.8 23.15,92.6 24.16,92.8 25.02,93.37 25.59,94.23 25.8,95.24 25.8,95.24 25.59,96.26 25.02,97.11 24.16,97.69 23.15,97.89 22.14,97.69 21.28,97.11 20.71,96.26 20.5,95.24 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="27.12,68.79 27.32,67.77 27.89,66.92 28.75,66.34 29.76,66.14 30.78,66.34 31.63,66.92 32.21,67.77 32.41,68.79 32.41,82.02 32.21,83.03 31.63,83.89 30.78,84.46 29.76,84.66 28.75,84.46 27.89,83.89 27.32,83.03 27.12,82.02 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="33.73,68.79 33.93,67.77 34.51,66.92 35.37,66.34 36.38,66.14 37.39,66.34 38.25,66.92 38.82,67.77 39.02,68.79 39.02,68.79 38.82,69.8 38.25,70.66 37.39,71.23 36.38,71.43 35.37,71.23 34.51,70.66 33.93,69.8 33.73,68.79 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="33.73,88.63 33.93,87.62 34.51,86.76 35.37,86.19 36.38,85.98 37.39,86.19 38.25,86.76 38.82,87.62 39.02,88.63 39.02,95.24 38.82,96.26 38.25,97.11 37.39,97.69 36.38,97.89 35.37,97.69 34.51,97.11 33.93,96.26 33.73,95.24 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="40.35,68.79 40.55,67.77 41.12,66.92 41.98,66.34 42.99,66.14 44,66.34 44.86,66.92 45.44,67.77 45.64,68.79 45.64,68.79 45.44,69.8 44.86,70.66 44,71.23 42.99,71.43 41.98,71.23 41.12,70.66 40.55,69.8 40.35,68.79 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="40.35,82.02 40.55,81 41.12,80.14 41.98,79.57 42.99,79.37 44,79.57 44.86,80.14 45.44,81 45.64,82.02 45.64,82.02 45.44,83.03 44.86,83.89 44,84.46 42.99,84.66 41.98,84.46 41.12,83.89 40.55,83.03 40.35,82.02 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="40.35,95.24 40.55,94.23 41.12,93.37 41.98,92.8 42.99,92.6 44,92.8 44.86,93.37 45.44,94.23 45.64,95.24 45.64,95.24 45.44,96.26 44.86,97.11 44,97.69 42.99,97.89 41.98,97.69 41.12,97.11 40.55,96.26 40.35,95.24 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="46.96,75.4 47.16,74.39 47.74,73.53 48.59,72.96 49.61,72.76 50.62,72.96 51.48,73.53 52.05,74.39 52.25,75.4 52.25,82.02 52.05,83.03 51.48,83.89 50.62,84.46 49.61,84.66 48.59,84.46 47.74,83.89 47.16,83.03 46.96,82.02 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="53.57,68.79 53.78,67.77 54.35,66.92 55.21,66.34 56.22,66.14 57.23,66.34 58.09,66.92 58.66,67.77 58.87,68.79 58.87,68.79 58.66,69.8 58.09,70.66 57.23,71.23 56.22,71.43 55.21,71.23 54.35,70.66 53.78,69.8 53.57,68.79 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="53.57,82.02 53.78,81 54.35,80.14 55.21,79.57 56.22,79.37 57.23,79.57 58.09,80.14 58.66,81 58.87,82.02 58.87,82.02 58.66,83.03 58.09,83.89 57.23,84.46 56.22,84.66 55.21,84.46 54.35,83.89 53.78,83.03 53.57,82.02 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="53.57,95.24 53.78,94.23 54.35,93.37 55.21,92.8 56.22,92.6 57.23,92.8 58.09,93.37 58.66,94.23 58.87,95.24 58.87,95.24 58.66,96.26 58.09,97.11 57.23,97.69 56.22,97.89 55.21,97.69 54.35,97.11 53.78,96.26 53.57,95.24 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="60.19,68.79 60.39,67.77 60.96,66.92 61.82,66.34 62.83,66.14 63.85,66.34 64.71,66.92 65.28,67.77 65.48,68.79 65.48,75.4 65.28,76.41 64.71,77.27 63.85,77.85 62.83,78.05 61.82,77.85 60.96,77.27 60.39,76.41 60.19,75.4 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="66.8,22.49 67,21.48 67.58,20.62 68.44,20.04 69.45,19.84 70.46,20.04 71.32,20.62 71.89,21.48 72.09,22.49 72.09,22.49 71.89,23.5 71.32,24.36 70.46,24.93 69.45,25.13 68.44,24.93 67.58,24.36 67,23.5 66.8,22.49 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="66.8,35.72 67,34.7 67.58,33.85 68.44,33.27 69.45,33.07 70.46,33.27 71.32,33.85 71.89,34.7 72.09,35.72 72.09,35.72 71.89,36.73 71.32,37.59 70.46,38.16 69.45,38.36 68.44,38.16 67.58,37.59 67,36.73 66.8,35.72 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="66.8,48.94 67,47.93 67.58,47.07 68.44,46.5 69.45,46.3 70.46,46.5 71.32,47.07 71.89,47.93 72.09,48.94 72.09,55.56 71.89,56.57 71.32,57.43 70.46,58 69.45,58.2 68.44,58 67.58,57.43 67,56.57 66.8,55.56 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="66.8,68.79 67,67.77 67.58,66.92 68.44,66.34 69.45,66.14 70.46,66.34 71.32,66.92 71.89,67.77 72.09,68.79 72.09,68.79 71.89,69.8 71.32,70.66 70.46,71.23 69.45,71.43 68.44,71.23 67.58,70.66 67,69.8 66.8,68.79 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="66.8,82.02 67,81 67.58,80.14 68.44,79.57 69.45,79.37 70.46,79.57 71.32,80.14 71.89,81 72.09,82.02 72.09,82.02 71.89,83.03 71.32,83.89 70.46,84.46 69.45,84.66 68.44,84.46 67.58,83.89 67,83.03 66.8,82.02 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="66.8,95.24 67,94.23 67.58,93.37 68.44,92.8 69.45,92.6 70.46,92.8 71.32,93.37 71.89,94.23 72.09,95.24 72.09,108.47 71.89,109.48 71.32,110.34 70.46,110.92 69.45,111.12 68.44,110.92 67.58,110.34 67,109.48 66.8,108.47 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="66.8,121.7 67,120.69 67.58,119.83 68.44,119.26 69.45,119.06 70.46,119.26 71.32,119.83 71.89,120.69 72.09,121.7 72.09,148.16 71.89,149.17 71.32,150.03 70.46,150.6 69.45,150.8 68.44,150.6 67.58,150.03 67,149.17 66.8,148.16 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="73.42,22.49 73.62,21.48 74.19,20.62 75.05,20.04 76.06,19.84 77.08,20.04 77.93,20.62 78.51,21.48 78.71,22.49 78.71,22.49 78.51,23.5 77.93,24.36 77.08,24.93 76.06,25.13 75.05,24.93 74.19,24.36 73.62,23.5 73.42,22.49 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="73.42,35.72 73.62,34.7 74.19,33.85 75.05,33.27 76.06,33.07 77.08,33.27 77.93,33.85 78.51,34.7 78.71,35.72 78.71,42.33 78.51,43.34 77.93,44.2 77.08,44.77 76.06,44.98 75.05,44.77 74.19,44.2 73.62,43.34 73.42,42.33 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="73.42,62.17 73.62,61.16 74.19,60.3 75.05,59.73 76.06,59.53 77.08,59.73 77.93,60.3 78.51,61.16 78.71,62.17 78.71,62.17 78.51,63.19 77.93,64.04 77.08,64.62 76.06,64.82 75.05,64.62 74.19,64.04 73.62,63.19 73.42,62.17 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="73.42,75.4 73.62,74.39 74.19,73.53 75.05,72.96 76.06,72.76 77.08,72.96 77.93,73.53 78.51,74.39 78.71,75.4 78.71,82.02 78.51,83.03 77.93,83.89 77.08,84.46 76.06,84.66 75.05,84.46 74.19,83.89 73.62,83.03 73.42,82.02 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="73.42,95.24 73.62,94.23 74.19,93.37 75.05,92.8 76.06,92.6 77.08,92.8 77.93,93.37 78.51,94.23 78.71,95.24 78.71,95.24 78.51,96.26 77.93,97.11 77.08,97.69 76.06,97.89 75.05,97.69 74.19,97.11 73.62,96.26 73.42,95.24 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="73.42,115.09 73.62,114.07 74.19,113.22 75.05,112.64 76.06,112.44 77.08,112.64 77.93,113.22 78.51,114.07 78.71,115.09 78.71,134.93 78.51,135.94 77.93,136.8 77.08,137.37 76.06,137.57 75.05,137.37 74.19,136.8 73.62,135.94 73.42,134.93 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="73.42,148.16 73.62,147.15 74.19,146.29 75.05,145.71 76.06,145.51 77.08,145.71 77.93,146.29 78.51,147.15 78.71,148.16 78.71,148.16 78.51,149.17 77.93,150.03 77.08,150.6 76.06,150.8 75.05,150.6 74.19,150.03 73.62,149.17 73.42,148.16 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="80.03,15.87 80.23,14.86 80.81,14 81.66,13.43 82.68,13.23 83.69,13.43 84.55,14 85.12,14.86 85.32,15.87 85.32,29.1 85.12,30.11 84.55,30.97 83.69,31.55 82.68,31.75 81.66,31.55 80.81,30.97 80.23,30.11 80.03,29.1 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="80.03,55.56 80.23,54.55 80.81,53.69 81.66,53.11 82.68,52.91 83.69,53.11 84.55,53.69 85.12,54.55 85.32,55.56 85.32,55.56 85.12,56.57 84.55,57.43 83.69,58 82.68,58.2 81.66,58 80.81,57.43 80.23,56.57 80.03,55.56 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="80.03,101.86 80.23,100.85 80.81,99.99 81.66,99.41 82.68,99.21 83.69,99.41 84.55,99.99 85.12,100.85 85.32,101.86 85.32,101.86 85.12,102.87 84.55,103.73 83.69,104.3 82.68,104.5 81.66,104.3 80.81,103.73 80.23,102.87 80.03,101.86 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="80.03,115.09 80.23,114.07 80.81,113.22 81.66,112.64 82.68,112.44 83.69,112.64 84.55,113.22 85.12,114.07 85.32,115.09 85.32,121.7 85.12,122.71 84.55,123.57 83.69,124.15 82.68,124.35 81.66,124.15 80.81,123.57 80.23,122.71 80.03,121.7 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="80.03,141.54 80.23,140.53 80.81,139.67 81.66,139.1 82.68,138.9 83.69,139.1 84.55,139.67 85.12,140.53 85.32,141.54 85.32,148.16 85.12,149.17 84.55,150.03 83.69,150.6 82.68,150.8 81.66,150.6 80.81,150.03 80.23,149.17 80.03,148.16 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="86.65,15.87 86.85,14.86 87.42,14 88.28,13.43 89.29,13.23 90.3,13.43 91.16,14 91.74,14.86 91.94,15.87 91.94,15.87 91.74,16.89 91.16,17.74 90.3,18.32 89.29,18.52 88.28,18.32 87.42,17.74 86.85,16.89 86.65,15.87 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="86.65,29.1 86.85,28.09 87.42,27.23 88.28,26.66 89.29,26.46 90.3,26.66 91.16,27.23 91.74,28.09 91.94,29.1 91.94,29.1 91.74,30.11 91.16,30.97 90.3,31.55 89.29,31.75 88.28,31.55 87.42,30.97 86.85,30.11 86.65,29.1 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="86.65,48.94 86.85,47.93 87.42,47.07 88.28,46.5 89.29,46.3 90.3,46.5 91.16,47.07 91.74,47.93 91.94,48.94 91.94,48.94 91.74,49.96 91.16,50.82 90.3,51.39 89.29,51.59 88.28,51.39 87.42,50.82 86.85,49.96 86.65,48.94 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="86.65,68.79 86.85,67.77 87.42,66.92 88.28,66.34 89.29,66.14 90.3,66.34 91.16,66.92 91.74,67.77 91.94,68.79 91.94,75.4 91.74,76.41 91.16,77.27 90.3,77.85 89.29,78.05 88.28,77.85 87.42,77.27 86.85,76.41 86.65,75.4 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="86.65,88.63 86.85,87.62 87.42,86.76 88.28,86.19 89.29,85.98 90.3,86.19 91.16,86.76 91.74,87.62 91.94,88.63 91.94,88.63 91.74,89.64 91.16,90.5 90.3,91.07 89.29,91.28 88.28,91.07 87.42,90.5 86.85,89.64 86.65,88.63 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="86.65,108.47 86.85,107.46 87.42,106.6 88.28,106.03 89.29,105.83 90.3,106.03 91.16,106.6 91.74,107.46 91.94,108.47 91.94,108.47 91.74,109.48 91.16,110.34 90.3,110.92 89.29,111.12 88.28,110.92 87.42,110.34 86.85,109.48 86.65,108.47 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="86.65,121.7 86.85,120.69 87.42,119.83 88.28,119.26 89.29,119.06 90.3,119.26 91.16,119.83 91.74,120.69 91.94,121.7 91.94,128.31 91.74,129.33 91.16,130.19 90.3,130.76 89.29,130.96 88.28,130.76 87.42,130.19 86.85,129.33 86.65,128.31 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="86.65,141.54 86.85,140.53 87.42,139.67 88.28,139.1 89.29,138.9 90.3,139.1 91.16,139.67 91.74,140.53 91.94,141.54 91.94,141.54 91.74,142.56 91.16,143.41 90.3,143.99 89.29,144.19 88.28,143.99 87.42,143.41 86.85,142.56 86.65,141.54 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="93.26,15.87 93.46,14.86 94.03,14 94.89,13.43 95.91,13.23 96.92,13.43 97.78,14 98.35,14.86 98.55,15.87 98.55,42.33 98.35,43.34 97.78,44.2 96.92,44.77 95.91,44.98 94.89,44.77 94.03,44.2 93.46,43.34 93.26,42.33 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="93.26,55.56 93.46,54.55 94.03,53.69 94.89,53.11 95.91,52.91 96.92,53.11 97.78,53.69 98.35,54.55 98.55,55.56 98.55,55.56 98.35,56.57 97.78,57.43 96.92,58 95.91,58.2 94.89,58 94.03,57.43 93.46,56.57 93.26,55.56 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="93.26,75.4 93.46,74.39 94.03,73.53 94.89,72.96 95.91,72.76 96.92,72.96 97.78,73.53 98.35,74.39 98.55,75.4 98.55,101.86 98.35,102.87 97.78,103.73 96.92,104.3 95.91,104.5 94.89,104.3 94.03,103.73 93.46,102.87 93.26,101.86 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="93.26,128.31 93.46,127.3 94.03,126.44 94.89,125.87 95.91,125.67 96.92,125.87 97.78,126.44 98.35,127.3 98.55,128.31 98.55,148.16 98.35,149.17 97.78,150.03 96.92,150.6 95.91,150.8 94.89,150.6 94.03,150.03 93.46,149.17 93.26,148.16 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="99.87,68.79 100.08,67.77 100.65,66.92 101.51,66.34 102.52,66.14 103.53,66.34 104.39,66.92 104.96,67.77 105.17,68.79 105.17,75.4 104.96,76.41 104.39,77.27 103.53,77.85 102.52,78.05 101.51,77.85 100.65,77.27 100.08,76.41 99.87,75.4 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="99.87,88.63 100.08,87.62 100.65,86.76 101.51,86.19 102.52,85.98 103.53,86.19 104.39,86.76 104.96,87.62 105.17,88.63 105.17,88.63 104.96,89.64 104.39,90.5 103.53,91.07 102.52,91.28 101.51,91.07 100.65,90.5 100.08,89.64 99.87,88.63 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="99.87,108.47 100.08,107.46 100.65,106.6 101.51,106.03 102.52,105.83 103.53,106.03 104.39,106.6 104.96,107.46 105.17,108.47 105.17,108.47 104.96,109.48 104.39,110.34 103.53,110.92 102.52,111.12 101.51,110.92 100.65,110.34 100.08,109.48 99.87,108.47 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="99.87,121.7 100.08,120.69 100.65,119.83 101.51,119.26 102.52,119.06 103.53,119.26 104.39,119.83 104.96,120.69 105.17,121.7 105.17,128.31 104.96,129.33 104.39,130.19 103.53,130.76 102.52,130.96 101.51,130.76 100.65,130.19 100.08,129.33 99.87,128.31 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="99.87,141.54 100.08,140.53 100.65,139.67 101.51,139.1 102.52,138.9 103.53,139.1 104.39,139.67 104.96,140.53 105.17,141.54 105.17,141.54 104.96,142.56 104.39,143.41 103.53,143.99 102.52,144.19 101.51,143.99 100.65,143.41 100.08,142.56 99.87,141.54 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="106.49,75.4 106.69,74.39 107.26,73.53 108.12,72.96 109.13,72.76 110.15,72.96 111,73.53 111.58,74.39 111.78,75.4 111.78,88.63 111.58,89.64 111,90.5 110.15,91.07 109.13,91.28 108.12,91.07 107.26,90.5 106.69,89.64 106.49,88.63 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="106.49,128.31 106.69,127.3 107.26,126.44 108.12,125.87 109.13,125.67 110.15,125.87 111,126.44 111.58,127.3 111.78,128.31 111.78,141.54 111.58,142.56 111,143.41 110.15,143.99 109.13,144.19 108.12,143.99 107.26,143.41 106.69,142.56 106.49,141.54 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="113.1,68.79 113.3,67.77 113.88,66.92 114.74,66.34 115.75,66.14 116.76,66.34 117.62,66.92 118.19,67.77 118.39,68.79 118.39,68.79 118.19,69.8 117.62,70.66 116.76,71.23 115.75,71.43 114.74,71.23 113.88,70.66 113.3,69.8 113.1,68.79 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="113.1,82.02 113.3,81 113.88,80.14 114.74,79.57 115.75,79.37 116.76,79.57 117.62,80.14 118.19,81 118.39,82.02 118.39,82.02 118.19,83.03 117.62,83.89 116.76,84.46 115.75,84.66 114.74,84.46 113.88,83.89 113.3,83.03 113.1,82.02 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="113.1,95.24 113.3,94.23 113.88,93.37 114.74,92.8 115.75,92.6 116.76,92.8 117.62,93.37 118.19,94.23 118.39,95.24 118.39,101.86 118.19,102.87 117.62,103.73 116.76,104.3 115.75,104.5 114.74,104.3 113.88,103.73 113.3,102.87 113.1,101.86 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="113.1,115.09 113.3,114.07 113.88,113.22 114.74,112.64 115.75,112.44 116.76,112.64 117.62,113.22 118.19,114.07 118.39,115.09 118.39,115.09 118.19,116.1 117.62,116.96 116.76,117.53 115.75,117.73 114.74,117.53 113.88,116.96 113.3,116.1 113.1,115.09 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="113.1,128.31 113.3,127.3 113.88,126.44 114.74,125.87 115.75,125.67 116.76,125.87 117.62,126.44 118.19,127.3 118.39,128.31 118.39,148.16 118.19,149.17 117.62,150.03 116.76,150.6 115.75,150.8 114.74,150.6 113.88,150.03 113.3,149.17 113.1,148.16 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="119.72,108.47 119.92,107.46 120.49,106.6 121.35,106.03 122.36,105.83 123.37,106.03 124.23,106.6 124.81,107.46 125.01,108.47 125.01,121.7 124.81,122.71 124.23,123.57 123.37,124.15 122.36,124.35 121.35,124.15 120.49,123.57 119.92,122.71 119.72,121.7 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="119.72,141.54 119.92,140.53 120.49,139.67 121.35,139.1 122.36,138.9 123.37,139.1 124.23,139.67 124.81,140.53 125.01,141.54 125.01,141.54 124.81,142.56 124.23,143.41 123.37,143.99 122.36,144.19 121.35,143.99 120.49,143.41 119.92,142.56 119.72,141.54 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="126.33,68.79 126.53,67.77 127.11,66.92 127.96,66.34 128.98,66.14 129.99,66.34 130.85,66.92 131.42,67.77 131.62,68.79 131.62,82.02 131.42,83.03 130.85,83.89 129.99,84.46 128.98,84.66 127.96,84.46 127.11,83.89 126.53,83.03 126.33,82.02 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="126.33,108.47 126.53,107.46 127.11,106.6 127.96,106.03 128.98,105.83 129.99,106.03 130.85,106.6 131.42,107.46 131.62,108.47 131.62,108.47 131.42,109.48 130.85,110.34 129.99,110.92 128.98,111.12 127.96,110.92 127.11,110.34 126.53,109.48 126.33,108.47 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="126.33,121.7 126.53,120.69 127.11,119.83 127.96,119.26 128.98,119.06 129.99,119.26 130.85,119.83 131.42,120.69 131.62,121.7 131.62,134.93 131.42,135.94 130.85,136.8 129.99,137.37 128.98,137.57 127.96,137.37 127.11,136.8 126.53,135.94 126.33,134.93 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="132.94,75.4 133.15,74.39 133.72,73.53 134.58,72.96 135.59,72.76 136.6,72.96 137.46,73.53 138.03,74.39 138.24,75.4 138.24,75.4 138.03,76.41 137.46,77.27 136.6,77.85 135.59,78.05 134.58,77.85 133.72,77.27 133.15,76.41 132.94,75.4 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="132.94,88.63 133.15,87.62 133.72,86.76 134.58,86.19 135.59,85.98 136.6,86.19 137.46,86.76 138.03,87.62 138.24,88.63 138.24,88.63 138.03,89.64 137.46,90.5 136.6,91.07 135.59,91.28 134.58,91.07 133.72,90.5 133.15,89.64 132.94,88.63 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="132.94,101.86 133.15,100.85 133.72,99.99 134.58,99.41 135.59,99.21 136.6,99.41 137.46,99.99 138.03,100.85 138.24,101.86 138.24,101.86 138.03,102.87 137.46,103.73 136.6,104.3 135.59,104.5 134.58,104.3 133.72,103.73 133.15,102.87 132.94,101.86 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="132.94,115.09 133.15,114.07 133.72,113.22 134.58,112.64 135.59,112.44 136.6,112.64 137.46,113.22 138.03,114.07 138.24,115.09 138.24,148.16 138.03,149.17 137.46,150.03 136.6,150.6 135.59,150.8 134.58,150.6 133.72,150.03 133.15,149.17 132.94,148.16 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="139.56,68.79 139.76,67.77 140.33,66.92 141.19,66.34 142.2,66.14 143.22,66.34 144.08,66.92 144.65,67.77 144.85,68.79 144.85,75.4 144.65,76.41 144.08,77.27 143.22,77.85 142.2,78.05 141.19,77.85 140.33,77.27 139.76,76.41 139.56,75.4 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="139.56,88.63 139.76,87.62 140.33,86.76 141.19,86.19 142.2,85.98 143.22,86.19 144.08,86.76 144.65,87.62 144.85,88.63 144.85,95.24 144.65,96.26 144.08,97.11 143.22,97.69 142.2,97.89 141.19,97.69 140.33,97.11 139.76,96.26 139.56,95.24 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="139.56,108.47 139.76,107.46 140.33,106.6 141.19,106.03 142.2,105.83 143.22,106.03 144.08,106.6 144.65,107.46 144.85,108.47 144.85,108.47 144.65,109.48 144.08,110.34 143.22,110.92 142.2,111.12 141.19,110.92 140.33,110.34 139.76,109.48 139.56,108.47 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="139.56,141.54 139.76,140.53 140.33,139.67 141.19,139.1 142.2,138.9 143.22,139.1 144.08,139.67 144.65,140.53 144.85,141.54 144.85,141.54 144.65,142.56 144.08,143.41 143.22,143.99 142.2,144.19 141.19,143.99 140.33,143.41 139.76,142.56 139.56,141.54 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="146.17,75.4 146.37,74.39 146.95,73.53 147.81,72.96 148.82,72.76 149.83,72.96 150.69,73.53 151.26,74.39 151.46,75.4 151.46,88.63 151.26,89.64 150.69,90.5 149.83,91.07 148.82,91.28 147.81,91.07 146.95,90.5 146.37,89.64 146.17,88.63 "
            style="fill:rgba(28,125,138,1);"
          />
          <polygon
            points="146.17,108.47 146.37,107.46 146.95,106.6 147.81,106.03 148.82,105.83 149.83,106.03 150.69,106.6 151.26,107.46 151.46,108.47 151.46,115.09 151.26,116.1 150.69,116.96 149.83,117.53 148.82,117.73 147.81,117.53 146.95,116.96 146.37,116.1 146.17,115.09 "
            style="fill:rgba(28,125,138,1);"
          />
      `,
            },
            {
                value: 14,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(255,255,255,0);"
            shape-rendering="crispEdges"
          />
          <polygon
            points="13.23,13.23 59.53,13.23 59.53,59.53 13.23,59.53 13.23,19.78 19.84,19.78 19.84,52.91 52.91,52.91 52.91,19.84 13.23,19.84 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="13.23,105.83 59.53,105.83 59.53,152.13 13.23,152.13 13.23,112.37 19.84,112.37 19.84,145.51 52.91,145.51 52.91,112.44 13.23,112.44 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="105.83,13.23 152.13,13.23 152.13,59.53 105.83,59.53 105.83,19.78 112.44,19.78 112.44,52.91 145.51,52.91 145.51,19.84 105.83,19.84 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon points="26.46,26.46 46.3,26.46 46.3,46.3 26.46,46.3 " style="fill:rgba(34,82,94,1);" />
          <polygon points="26.46,119.06 46.3,119.06 46.3,138.9 26.46,138.9 " style="fill:rgba(34,82,94,1);" />
          <polygon points="119.06,26.46 138.9,26.46 138.9,46.3 119.06,46.3 " style="fill:rgba(34,82,94,1);" />
          <polygon
            points="79.37,15.54 79.55,14.66 80.05,13.91 80.8,13.4 81.69,13.23 86.05,13.23 86.05,19.91 79.37,19.91 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="85.92,16.54 85.92,13.23 92.66,13.23 92.66,19.84 85.92,19.84 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="92.53,13.23 96.9,13.23 97.78,13.4 98.53,13.91 99.04,14.66 99.21,15.54 99.21,19.91 92.53,19.91 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="66.14,22.16 66.32,21.27 66.82,20.52 67.57,20.02 68.46,19.84 72.82,19.84 72.82,26.46 68.46,26.46 67.57,26.28 66.82,25.78 66.32,25.03 66.14,24.14 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="72.69,23.15 72.69,19.84 79.44,19.84 79.44,26.46 72.69,26.46 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon points="79.3,23.15 79.3,19.78 85.98,19.78 85.98,26.52 79.3,26.52 " style="fill:rgba(34,82,94,1);" />
          <polygon points="92.6,23.15 92.6,19.78 99.21,19.78 99.21,26.52 92.6,26.52 " style="fill:rgba(34,82,94,1);" />
          <polygon
            points="79.37,26.39 86.05,26.39 86.05,33.07 81.69,33.07 80.8,32.89 80.05,32.39 79.55,31.64 79.37,30.76 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="85.92,29.76 85.92,26.46 92.66,26.46 92.66,33.07 85.92,33.07 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="92.53,29.76 92.53,26.39 99.21,26.39 99.21,33.14 92.53,33.14 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="66.14,35.39 66.32,34.5 66.82,33.75 67.57,33.25 68.46,33.07 72.82,33.07 72.82,39.69 68.46,39.69 67.57,39.51 66.82,39.01 66.32,38.26 66.14,37.37 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="72.69,33.07 77.06,33.07 77.94,33.25 78.69,33.75 79.19,34.5 79.37,35.39 79.37,39.75 72.69,39.75 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon points="92.6,36.38 92.6,33 99.21,33 99.21,39.75 92.6,39.75 " style="fill:rgba(34,82,94,1);" />
          <polygon
            points="72.76,39.62 79.37,39.62 79.37,43.98 79.19,44.87 78.69,45.62 77.94,46.12 77.06,46.3 75.07,46.3 74.18,46.12 73.43,45.62 72.93,44.87 72.76,43.98 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="92.6,39.62 99.21,39.62 99.21,43.98 99.04,44.87 98.53,45.62 97.78,46.12 96.9,46.3 94.91,46.3 94.03,46.12 93.28,45.62 92.77,44.87 92.6,43.98 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="66.14,48.61 66.32,47.73 66.82,46.98 67.57,46.48 68.46,46.3 70.44,46.3 71.33,46.48 72.08,46.98 72.58,47.73 72.76,48.61 72.76,52.98 66.14,52.98 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="85.98,48.61 86.16,47.73 86.66,46.98 87.41,46.48 88.3,46.3 90.28,46.3 91.17,46.48 91.92,46.98 92.42,47.73 92.6,48.61 92.6,50.6 92.42,51.48 91.92,52.24 91.17,52.74 90.28,52.91 88.3,52.91 87.41,52.74 86.66,52.24 86.16,51.48 85.98,50.6 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="66.14,52.85 72.76,52.85 72.76,57.21 72.58,58.1 72.08,58.85 71.33,59.35 70.44,59.53 68.46,59.53 67.57,59.35 66.82,58.85 66.32,58.1 66.14,57.21 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="79.37,55.23 79.55,54.34 80.05,53.59 80.8,53.09 81.69,52.91 83.67,52.91 84.56,53.09 85.31,53.59 85.81,54.34 85.98,55.23 85.98,57.21 85.81,58.1 85.31,58.85 84.56,59.35 83.67,59.53 81.69,59.53 80.8,59.35 80.05,58.85 79.55,58.1 79.37,57.21 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="92.6,55.23 92.77,54.34 93.28,53.59 94.03,53.09 94.91,52.91 96.9,52.91 97.78,53.09 98.53,53.59 99.04,54.34 99.21,55.23 99.21,57.21 99.04,58.1 98.53,58.85 97.78,59.35 96.9,59.53 94.91,59.53 94.03,59.35 93.28,58.85 92.77,58.1 92.6,57.21 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="72.76,61.84 72.93,60.96 73.43,60.21 74.18,59.7 75.07,59.53 77.06,59.53 77.94,59.7 78.69,60.21 79.19,60.96 79.37,61.84 79.37,63.83 79.19,64.71 78.69,65.46 77.94,65.97 77.06,66.14 75.07,66.14 74.18,65.97 73.43,65.46 72.93,64.71 72.76,63.83 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="13.23,68.46 13.4,67.57 13.91,66.82 14.66,66.32 15.54,66.14 19.91,66.14 19.91,72.82 13.23,72.82 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="19.78,69.45 19.78,66.14 26.52,66.14 26.52,72.82 19.78,72.82 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="26.39,69.45 26.39,66.14 33.14,66.14 33.14,72.82 26.39,72.82 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon points="33,69.45 33,66.14 39.75,66.14 39.75,72.76 33,72.76 " style="fill:rgba(34,82,94,1);" />
          <polygon
            points="39.62,66.14 43.98,66.14 44.87,66.32 45.62,66.82 46.12,67.57 46.3,68.46 46.3,70.44 46.12,71.33 45.62,72.08 44.87,72.58 43.98,72.76 39.62,72.76 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="52.91,68.46 53.09,67.57 53.59,66.82 54.34,66.32 55.23,66.14 59.59,66.14 59.59,72.76 55.23,72.76 54.34,72.58 53.59,72.08 53.09,71.33 52.91,70.44 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="59.46,69.45 59.46,66.14 66.21,66.14 66.21,72.82 59.46,72.82 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="66.08,66.14 70.44,66.14 71.33,66.32 72.08,66.82 72.58,67.57 72.76,68.46 72.76,70.44 72.58,71.33 72.08,72.08 71.33,72.58 70.44,72.76 66.08,72.76 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="85.98,68.46 86.16,67.57 86.66,66.82 87.41,66.32 88.3,66.14 90.28,66.14 91.17,66.32 91.92,66.82 92.42,67.57 92.6,68.46 92.6,72.82 85.98,72.82 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="99.21,68.46 99.39,67.57 99.89,66.82 100.64,66.32 101.53,66.14 103.51,66.14 104.4,66.32 105.15,66.82 105.65,67.57 105.83,68.46 105.83,72.82 99.21,72.82 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="112.44,68.46 112.62,67.57 113.12,66.82 113.87,66.32 114.76,66.14 116.74,66.14 117.63,66.32 118.38,66.82 118.88,67.57 119.06,68.46 119.06,70.44 118.88,71.33 118.38,72.08 117.63,72.58 116.74,72.76 114.76,72.76 113.87,72.58 113.12,72.08 112.62,71.33 112.44,70.44 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="125.67,68.46 125.85,67.57 126.35,66.82 127.1,66.32 127.98,66.14 129.97,66.14 130.85,66.32 131.61,66.82 132.11,67.57 132.28,68.46 132.28,72.82 125.67,72.82 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="138.9,68.46 139.07,67.57 139.58,66.82 140.33,66.32 141.21,66.14 143.2,66.14 144.08,66.32 144.83,66.82 145.34,67.57 145.51,68.46 145.51,72.82 138.9,72.82 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="13.23,72.69 19.91,72.69 19.91,79.37 15.54,79.37 14.66,79.19 13.91,78.69 13.4,77.94 13.23,77.06 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="19.78,76.06 19.78,72.69 26.52,72.69 26.52,79.37 19.78,79.37 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="26.39,76.06 26.39,72.69 33.07,72.69 33.07,79.44 26.39,79.44 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="46.3,75.07 46.48,74.18 46.98,73.43 47.73,72.93 48.61,72.76 50.6,72.76 51.48,72.93 52.24,73.43 52.74,74.18 52.91,75.07 52.91,79.44 46.3,79.44 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="59.53,72.69 66.14,72.69 66.14,77.06 65.97,77.94 65.46,78.69 64.71,79.19 63.83,79.37 61.84,79.37 60.96,79.19 60.21,78.69 59.7,77.94 59.53,77.06 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="72.76,75.07 72.93,74.18 73.43,73.43 74.18,72.93 75.07,72.76 77.06,72.76 77.94,72.93 78.69,73.43 79.19,74.18 79.37,75.07 79.37,79.44 72.76,79.44 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="85.98,72.69 92.66,72.69 92.66,79.37 88.3,79.37 87.41,79.19 86.66,78.69 86.16,77.94 85.98,77.06 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="92.53,76.06 92.53,72.76 99.28,72.76 99.28,79.44 92.53,79.44 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="99.15,76.06 99.15,72.69 105.89,72.69 105.89,79.37 99.15,79.37 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="105.76,72.76 110.13,72.76 111.01,72.93 111.76,73.43 112.26,74.18 112.44,75.07 112.44,79.44 105.76,79.44 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="125.67,76.06 125.67,72.69 132.35,72.69 132.35,79.44 125.67,79.44 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="132.22,76.06 132.22,72.76 138.96,72.76 138.96,79.37 132.22,79.37 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="138.83,76.06 138.83,72.69 145.58,72.69 145.58,79.37 138.83,79.37 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="145.45,72.76 149.81,72.76 150.7,72.93 151.45,73.43 151.95,74.18 152.13,75.07 152.13,79.44 145.45,79.44 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="26.46,79.3 33.07,79.3 33.07,83.67 32.89,84.56 32.39,85.31 31.64,85.81 30.76,85.98 28.77,85.98 27.89,85.81 27.13,85.31 26.63,84.56 26.46,83.67 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="39.69,81.69 39.86,80.8 40.36,80.05 41.11,79.55 42,79.37 46.37,79.37 46.37,85.98 42,85.98 41.11,85.81 40.36,85.31 39.86,84.56 39.69,83.67 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon points="46.23,82.68 46.23,79.3 52.98,79.3 52.98,85.98 46.23,85.98 " style="fill:rgba(34,82,94,1);" />
          <polygon
            points="52.85,79.37 57.21,79.37 58.1,79.55 58.85,80.05 59.35,80.8 59.53,81.69 59.53,83.67 59.35,84.56 58.85,85.31 58.1,85.81 57.21,85.98 52.85,85.98 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="66.14,81.69 66.32,80.8 66.82,80.05 67.57,79.55 68.46,79.37 72.82,79.37 72.82,85.98 68.46,85.98 67.57,85.81 66.82,85.31 66.32,84.56 66.14,83.67 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="72.69,79.3 79.37,79.3 79.37,83.67 79.19,84.56 78.69,85.31 77.94,85.81 77.06,85.98 72.69,85.98 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon points="92.6,82.68 92.6,79.3 99.21,79.3 99.21,86.05 92.6,86.05 " style="fill:rgba(34,82,94,1);" />
          <polygon
            points="105.83,82.68 105.83,79.3 112.51,79.3 112.51,86.05 105.83,86.05 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="112.37,79.37 116.74,79.37 117.63,79.55 118.38,80.05 118.88,80.8 119.06,81.69 119.06,83.67 118.88,84.56 118.38,85.31 117.63,85.81 116.74,85.98 112.37,85.98 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="125.67,79.3 132.28,79.3 132.28,83.67 132.11,84.56 131.61,85.31 130.85,85.81 129.97,85.98 127.98,85.98 127.1,85.81 126.35,85.31 125.85,84.56 125.67,83.67 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="145.51,82.68 145.51,79.3 152.13,79.3 152.13,86.05 145.51,86.05 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="13.23,88.3 13.4,87.41 13.91,86.66 14.66,86.16 15.54,85.98 17.53,85.98 18.41,86.16 19.16,86.66 19.67,87.41 19.84,88.3 19.84,90.28 19.67,91.17 19.16,91.92 18.41,92.42 17.53,92.6 15.54,92.6 14.66,92.42 13.91,91.92 13.4,91.17 13.23,90.28 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="33.07,88.3 33.25,87.41 33.75,86.66 34.5,86.16 35.39,85.98 37.37,85.98 38.26,86.16 39.01,86.66 39.51,87.41 39.69,88.3 39.69,92.66 33.07,92.66 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="85.98,88.3 86.16,87.41 86.66,86.66 87.41,86.16 88.3,85.98 92.66,85.98 92.66,92.6 88.3,92.6 87.41,92.42 86.66,91.92 86.16,91.17 85.98,90.28 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="92.53,89.29 92.53,85.92 99.28,85.92 99.28,92.66 92.53,92.66 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="99.15,89.29 99.15,85.98 105.89,85.98 105.89,92.6 99.15,92.6 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="105.76,85.92 112.44,85.92 112.44,90.28 112.26,91.17 111.76,91.92 111.01,92.42 110.13,92.6 105.76,92.6 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="132.28,88.3 132.46,87.41 132.96,86.66 133.71,86.16 134.6,85.98 138.96,85.98 138.96,92.6 134.6,92.6 133.71,92.42 132.96,91.92 132.46,91.17 132.28,90.28 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="138.83,89.29 138.83,85.98 145.58,85.98 145.58,92.66 138.83,92.66 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="145.45,85.92 152.13,85.92 152.13,90.28 151.95,91.17 151.45,91.92 150.7,92.42 149.81,92.6 145.45,92.6 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="19.84,94.91 20.02,94.03 20.52,93.28 21.27,92.77 22.16,92.6 24.14,92.6 25.03,92.77 25.78,93.28 26.28,94.03 26.46,94.91 26.46,96.9 26.28,97.78 25.78,98.53 25.03,99.04 24.14,99.21 22.16,99.21 21.27,99.04 20.52,98.53 20.02,97.78 19.84,96.9 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="33.07,92.53 39.75,92.53 39.75,99.21 35.39,99.21 34.5,99.04 33.75,98.53 33.25,97.78 33.07,96.9 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="39.62,92.6 43.98,92.6 44.87,92.77 45.62,93.28 46.12,94.03 46.3,94.91 46.3,96.9 46.12,97.78 45.62,98.53 44.87,99.04 43.98,99.21 39.62,99.21 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="52.91,94.91 53.09,94.03 53.59,93.28 54.34,92.77 55.23,92.6 57.21,92.6 58.1,92.77 58.85,93.28 59.35,94.03 59.53,94.91 59.53,96.9 59.35,97.78 58.85,98.53 58.1,99.04 57.21,99.21 55.23,99.21 54.34,99.04 53.59,98.53 53.09,97.78 52.91,96.9 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="66.14,94.91 66.32,94.03 66.82,93.28 67.57,92.77 68.46,92.6 72.82,92.6 72.82,99.28 66.14,99.28 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="72.69,92.6 77.06,92.6 77.94,92.77 78.69,93.28 79.19,94.03 79.37,94.91 79.37,96.9 79.19,97.78 78.69,98.53 77.94,99.04 77.06,99.21 72.69,99.21 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon points="92.6,95.91 92.6,92.53 99.21,92.53 99.21,99.28 92.6,99.28 " style="fill:rgba(34,82,94,1);" />
          <polygon
            points="112.44,94.91 112.62,94.03 113.12,93.28 113.87,92.77 114.76,92.6 116.74,92.6 117.63,92.77 118.38,93.28 118.88,94.03 119.06,94.91 119.06,99.28 112.44,99.28 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="138.9,92.53 145.51,92.53 145.51,96.9 145.34,97.78 144.83,98.53 144.08,99.04 143.2,99.21 141.21,99.21 140.33,99.04 139.58,98.53 139.07,97.78 138.9,96.9 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="66.14,102.52 66.14,99.15 72.76,99.15 72.76,105.89 66.14,105.89 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="79.37,101.53 79.55,100.64 80.05,99.89 80.8,99.39 81.69,99.21 83.67,99.21 84.56,99.39 85.31,99.89 85.81,100.64 85.98,101.53 85.98,103.51 85.81,104.4 85.31,105.15 84.56,105.65 83.67,105.83 81.69,105.83 80.8,105.65 80.05,105.15 79.55,104.4 79.37,103.51 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="92.6,99.15 99.21,99.15 99.21,103.51 99.04,104.4 98.53,105.15 97.78,105.65 96.9,105.83 94.91,105.83 94.03,105.65 93.28,105.15 92.77,104.4 92.6,103.51 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="112.44,99.15 119.06,99.15 119.06,103.51 118.88,104.4 118.38,105.15 117.63,105.65 116.74,105.83 114.76,105.83 113.87,105.65 113.12,105.15 112.62,104.4 112.44,103.51 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="132.28,101.53 132.46,100.64 132.96,99.89 133.71,99.39 134.6,99.21 136.58,99.21 137.47,99.39 138.22,99.89 138.72,100.64 138.9,101.53 138.9,103.51 138.72,104.4 138.22,105.15 137.47,105.65 136.58,105.83 134.6,105.83 133.71,105.65 132.96,105.15 132.46,104.4 132.28,103.51 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="66.14,105.76 72.76,105.76 72.76,110.13 72.58,111.01 72.08,111.76 71.33,112.26 70.44,112.44 68.46,112.44 67.57,112.26 66.82,111.76 66.32,111.01 66.14,110.13 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="85.98,108.14 86.16,107.26 86.66,106.5 87.41,106 88.3,105.83 90.28,105.83 91.17,106 91.92,106.5 92.42,107.26 92.6,108.14 92.6,110.13 92.42,111.01 91.92,111.76 91.17,112.26 90.28,112.44 88.3,112.44 87.41,112.26 86.66,111.76 86.16,111.01 85.98,110.13 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="99.21,108.14 99.39,107.26 99.89,106.5 100.64,106 101.53,105.83 103.51,105.83 104.4,106 105.15,106.5 105.65,107.26 105.83,108.14 105.83,110.13 105.65,111.01 105.15,111.76 104.4,112.26 103.51,112.44 101.53,112.44 100.64,112.26 99.89,111.76 99.39,111.01 99.21,110.13 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="119.06,108.14 119.23,107.26 119.73,106.5 120.48,106 121.37,105.83 125.74,105.83 125.74,112.51 119.06,112.51 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="125.6,105.83 129.97,105.83 130.85,106 131.61,106.5 132.11,107.26 132.28,108.14 132.28,110.13 132.11,111.01 131.61,111.76 130.85,112.26 129.97,112.44 125.6,112.44 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="138.9,108.14 139.07,107.26 139.58,106.5 140.33,106 141.21,105.83 145.58,105.83 145.58,112.44 141.21,112.44 140.33,112.26 139.58,111.76 139.07,111.01 138.9,110.13 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="145.45,105.83 149.81,105.83 150.7,106 151.45,106.5 151.95,107.26 152.13,108.14 152.13,112.51 145.45,112.51 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="72.76,114.76 72.93,113.87 73.43,113.12 74.18,112.62 75.07,112.44 79.44,112.44 79.44,119.12 72.76,119.12 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="79.3,112.44 83.67,112.44 84.56,112.62 85.31,113.12 85.81,113.87 85.98,114.76 85.98,119.12 79.3,119.12 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="112.44,114.76 112.62,113.87 113.12,113.12 113.87,112.62 114.76,112.44 119.12,112.44 119.12,119.06 114.76,119.06 113.87,118.88 113.12,118.38 112.62,117.63 112.44,116.74 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="118.99,115.75 118.99,112.37 125.67,112.37 125.67,119.12 118.99,119.12 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="132.28,114.76 132.46,113.87 132.96,113.12 133.71,112.62 134.6,112.44 136.58,112.44 137.47,112.62 138.22,113.12 138.72,113.87 138.9,114.76 138.9,119.12 132.28,119.12 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="145.51,112.37 152.13,112.37 152.13,116.74 151.95,117.63 151.45,118.38 150.7,118.88 149.81,119.06 147.83,119.06 146.94,118.88 146.19,118.38 145.69,117.63 145.51,116.74 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="66.14,121.37 66.32,120.48 66.82,119.73 67.57,119.23 68.46,119.06 72.82,119.06 72.82,125.74 66.14,125.74 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="72.69,122.36 72.69,118.99 79.44,118.99 79.44,125.74 72.69,125.74 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="79.3,122.36 79.3,118.99 86.05,118.99 86.05,125.67 79.3,125.67 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="85.92,119.06 90.28,119.06 91.17,119.23 91.92,119.73 92.42,120.48 92.6,121.37 92.6,125.74 85.92,125.74 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="99.21,121.37 99.39,120.48 99.89,119.73 100.64,119.23 101.53,119.06 103.51,119.06 104.4,119.23 105.15,119.73 105.65,120.48 105.83,121.37 105.83,125.74 99.21,125.74 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="119.06,118.99 125.74,118.99 125.74,125.67 121.37,125.67 120.48,125.49 119.73,124.99 119.23,124.24 119.06,123.35 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="125.6,122.36 125.6,119.06 132.35,119.06 132.35,125.74 125.6,125.74 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="132.22,122.36 132.22,118.99 138.9,118.99 138.9,125.74 132.22,125.74 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="66.14,128.98 66.14,125.6 72.82,125.6 72.82,132.35 66.14,132.35 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="72.69,128.98 72.69,125.6 79.37,125.6 79.37,132.35 72.69,132.35 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="85.98,125.6 92.66,125.6 92.66,132.28 88.3,132.28 87.41,132.11 86.66,131.61 86.16,130.85 85.98,129.97 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="92.53,128.98 92.53,125.67 99.28,125.67 99.28,132.35 92.53,132.35 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="99.15,128.98 99.15,125.6 105.89,125.6 105.89,132.28 99.15,132.28 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="105.76,128.98 105.76,125.67 112.51,125.67 112.51,132.35 105.76,132.35 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="112.37,125.67 116.74,125.67 117.63,125.85 118.38,126.35 118.88,127.1 119.06,127.98 119.06,132.35 112.37,132.35 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="125.67,128.98 125.67,125.6 132.35,125.6 132.35,132.35 125.67,132.35 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="132.22,128.98 132.22,125.6 138.9,125.6 138.9,132.35 132.22,132.35 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="66.14,135.59 66.14,132.22 72.82,132.22 72.82,138.96 66.14,138.96 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="72.69,132.22 79.37,132.22 79.37,136.58 79.19,137.47 78.69,138.22 77.94,138.72 77.06,138.9 72.69,138.9 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="92.6,135.59 92.6,132.22 99.21,132.22 99.21,138.96 92.6,138.96 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="105.83,135.59 105.83,132.22 112.51,132.22 112.51,138.96 105.83,138.96 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="112.37,135.59 112.37,132.22 119.06,132.22 119.06,138.96 112.37,138.96 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="125.67,132.22 132.35,132.22 132.35,138.9 127.98,138.9 127.1,138.72 126.35,138.22 125.85,137.47 125.67,136.58 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="132.22,135.59 132.22,132.22 138.9,132.22 138.9,138.96 132.22,138.96 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="66.14,142.2 66.14,138.83 72.76,138.83 72.76,145.58 66.14,145.58 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="79.37,141.21 79.55,140.33 80.05,139.58 80.8,139.07 81.69,138.9 86.05,138.9 86.05,145.58 79.37,145.58 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="85.92,142.2 85.92,138.9 92.66,138.9 92.66,145.51 85.92,145.51 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="92.53,142.2 92.53,138.83 99.28,138.83 99.28,145.58 92.53,145.58 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="99.15,142.2 99.15,138.9 105.89,138.9 105.89,145.51 99.15,145.51 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="105.76,142.2 105.76,138.83 112.51,138.83 112.51,145.51 105.76,145.51 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="112.37,142.2 112.37,138.83 119.12,138.83 119.12,145.58 112.37,145.58 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="118.99,138.9 123.35,138.9 124.24,139.07 124.99,139.58 125.49,140.33 125.67,141.21 125.67,143.2 125.49,144.08 124.99,144.83 124.24,145.34 123.35,145.51 118.99,145.51 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="132.28,142.2 132.28,138.83 138.96,138.83 138.96,145.58 132.28,145.58 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="138.83,138.9 143.2,138.9 144.08,139.07 144.83,139.58 145.34,140.33 145.51,141.21 145.51,143.2 145.34,144.08 144.83,144.83 144.08,145.34 143.2,145.51 138.83,145.51 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="66.14,145.45 72.82,145.45 72.82,152.13 68.46,152.13 67.57,151.95 66.82,151.45 66.32,150.7 66.14,149.81 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="72.69,148.82 72.69,145.51 79.44,145.51 79.44,152.13 72.69,152.13 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="79.3,145.45 85.98,145.45 85.98,149.81 85.81,150.7 85.31,151.45 84.56,151.95 83.67,152.13 79.3,152.13 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="92.6,145.45 99.21,145.45 99.21,149.81 99.04,150.7 98.53,151.45 97.78,151.95 96.9,152.13 94.91,152.13 94.03,151.95 93.28,151.45 92.77,150.7 92.6,149.81 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="112.44,145.45 119.06,145.45 119.06,149.81 118.88,150.7 118.38,151.45 117.63,151.95 116.74,152.13 114.76,152.13 113.87,151.95 113.12,151.45 112.62,150.7 112.44,149.81 "
            style="fill:rgba(34,82,94,1);"
          />
          <polygon
            points="132.28,145.45 138.9,145.45 138.9,149.81 138.72,150.7 138.22,151.45 137.47,151.95 136.58,152.13 134.6,152.13 133.71,151.95 132.96,151.45 132.46,150.7 132.28,149.81 "
            style="fill:rgba(34,82,94,1);"
          />
      `,
            },
            {
                value: 15,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(255,255,255,0);"
            shape-rendering="crispEdges"
          />
          <linearGradient
            id="gradient8cf8a5340f764af99aaa126963e7fc60"
            gradientUnits="userSpaceOnUse"
            x1="13.2283458709717"
            y1="82.6771602630615"
            x2="152.125974655151"
            y2="82.6771602630615"
          >
            <stop offset="0%" stop-color="#664F80" />
            <stop offset="50%" stop-color="#BD5F20" />
            <stop offset="100%" stop-color="#664F80" />
          </linearGradient>
          <polygon
            points="13.23,13.23 59.53,13.23 59.53,59.53 13.23,59.53 13.23,19.78 19.84,19.78 19.84,52.91 52.91,52.91 52.91,19.84 13.23,19.84 "
            style="fill:url(#gradient8cf8a5340f764af99aaa126963e7fc60);"
          />
          <polygon
            points="13.23,105.83 59.53,105.83 59.53,152.13 13.23,152.13 13.23,112.37 19.84,112.37 19.84,145.51 52.91,145.51 52.91,112.44 13.23,112.44 "
            style="fill:url(#gradient8cf8a5340f764af99aaa126963e7fc60);"
          />
          <polygon
            points="105.83,13.23 152.13,13.23 152.13,59.53 105.83,59.53 105.83,19.78 112.44,19.78 112.44,52.91 145.51,52.91 145.51,19.84 105.83,19.84 "
            style="fill:url(#gradient8cf8a5340f764af99aaa126963e7fc60);"
          />
          <linearGradient
            id="gradienta6cf858c9d1545e2a4924e8cdc53b488"
            gradientUnits="userSpaceOnUse"
            x1="16.1676322453161"
            y1="44.2778655522009"
            x2="149.18668446611"
            y2="121.076451159225"
          >
            <stop offset="0%" stop-color="#BFB7B8" />
            <stop offset="50%" stop-color="#C71D1C" />
            <stop offset="100%" stop-color="#BFB7B8" />
          </linearGradient>
          <polygon
            points="26.46,26.46 46.3,26.46 46.3,46.3 26.46,46.3 "
            style="fill:url(#gradienta6cf858c9d1545e2a4924e8cdc53b488);"
          />
          <polygon
            points="26.46,119.06 46.3,119.06 46.3,138.9 26.46,138.9 "
            style="fill:url(#gradienta6cf858c9d1545e2a4924e8cdc53b488);"
          />
          <polygon
            points="119.06,26.46 138.9,26.46 138.9,46.3 119.06,46.3 "
            style="fill:url(#gradienta6cf858c9d1545e2a4924e8cdc53b488);"
          />
          <pattern
            id="hatchfbccd1d7ad5144ee8da67c1bcd81b9e1"
            x="0"
            y="0"
            width="8"
            height="8"
            patternUnits="userSpaceOnUse"
          >
            <rect x="0" y="0" width="8" height="8" fill="#5B8B96" />
            <rect x="0" y="0" width="1" height="1" fill="#B04743" />
            <rect x="1" y="0" width="1" height="1" fill="#B04743" />
            <rect x="2" y="0" width="1" height="1" fill="#B04743" />
            <rect x="3" y="0" width="1" height="1" fill="#B04743" />
            <rect x="4" y="0" width="1" height="1" fill="#B04743" />
            <rect x="5" y="0" width="1" height="1" fill="#B04743" />
            <rect x="6" y="0" width="1" height="1" fill="#B04743" />
            <rect x="7" y="0" width="1" height="1" fill="#B04743" />
            <rect x="0" y="1" width="1" height="1" fill="#B04743" />
            <rect x="1" y="1" width="1" height="1" fill="#B04743" />
            <rect x="2" y="1" width="1" height="1" fill="#B04743" />
            <rect x="3" y="1" width="1" height="1" fill="#B04743" />
            <rect x="4" y="1" width="1" height="1" fill="#B04743" />
            <rect x="5" y="1" width="1" height="1" fill="#B04743" />
            <rect x="6" y="1" width="1" height="1" fill="#B04743" />
            <rect x="7" y="1" width="1" height="1" fill="#B04743" />
            <rect x="0" y="4" width="1" height="1" fill="#B04743" />
            <rect x="1" y="4" width="1" height="1" fill="#B04743" />
            <rect x="2" y="4" width="1" height="1" fill="#B04743" />
            <rect x="3" y="4" width="1" height="1" fill="#B04743" />
            <rect x="4" y="4" width="1" height="1" fill="#B04743" />
            <rect x="5" y="4" width="1" height="1" fill="#B04743" />
            <rect x="6" y="4" width="1" height="1" fill="#B04743" />
            <rect x="7" y="4" width="1" height="1" fill="#B04743" />
            <rect x="0" y="5" width="1" height="1" fill="#B04743" />
            <rect x="1" y="5" width="1" height="1" fill="#B04743" />
            <rect x="2" y="5" width="1" height="1" fill="#B04743" />
            <rect x="3" y="5" width="1" height="1" fill="#B04743" />
            <rect x="4" y="5" width="1" height="1" fill="#B04743" />
            <rect x="5" y="5" width="1" height="1" fill="#B04743" />
            <rect x="6" y="5" width="1" height="1" fill="#B04743" />
            <rect x="7" y="5" width="1" height="1" fill="#B04743" />
          </pattern>
          <polygon
            points="79.37,13.23 86.05,13.23 85.98,19.91 79.37,19.91 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="85.92,13.23 92.66,13.23 92.53,19.84 85.92,19.84 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="92.53,13.23 99.21,13.23 99.15,19.91 92.53,19.91 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="66.14,19.84 72.82,19.84 72.76,26.46 66.14,26.46 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="72.69,19.84 79.44,19.84 79.3,26.46 72.69,26.46 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="79.3,19.78 85.98,19.78 85.92,26.52 79.3,26.52 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="92.6,19.78 99.21,19.78 99.21,26.52 92.6,26.52 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="79.37,26.39 86.05,26.39 85.98,33.07 79.37,33.07 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="85.92,26.46 92.66,26.46 92.53,33.07 85.92,33.07 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="92.53,26.39 99.21,26.39 99.15,33.14 92.53,33.14 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="66.14,33.07 72.82,33.07 72.76,39.69 66.14,39.69 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="72.69,33.07 79.37,33.07 79.3,39.75 72.69,39.75 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="92.6,33 99.21,33 99.21,39.75 92.6,39.75 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="72.76,39.62 79.37,39.62 79.37,46.3 72.76,46.3 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="92.6,39.62 99.21,39.62 99.21,46.3 92.6,46.3 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="66.14,46.3 72.76,46.3 72.76,52.98 66.14,52.98 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="85.98,46.3 92.6,46.3 92.6,52.91 85.98,52.91 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="66.14,52.85 72.76,52.85 72.76,59.53 66.14,59.53 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="79.37,52.91 85.98,52.91 85.98,59.53 79.37,59.53 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="92.6,52.91 99.21,52.91 99.21,59.53 92.6,59.53 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="72.76,59.53 79.37,59.53 79.37,66.14 72.76,66.14 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="13.23,66.14 19.91,66.14 19.84,72.82 13.23,72.82 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="19.78,66.14 26.52,66.14 26.39,72.82 19.78,72.82 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="26.39,66.14 33.14,66.14 33,72.82 26.39,72.82 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="33,66.14 39.75,66.14 39.62,72.76 33,72.76 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="39.62,66.14 46.3,66.14 46.23,72.76 39.62,72.76 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="52.91,66.14 59.59,66.14 59.53,72.76 52.91,72.76 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="59.46,66.14 66.21,66.14 66.08,72.82 59.46,72.82 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="66.08,66.14 72.76,66.14 72.69,72.76 66.08,72.76 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="85.98,66.14 92.6,66.14 92.6,72.82 85.98,72.82 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="99.21,66.14 105.83,66.14 105.83,72.82 99.21,72.82 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="112.44,66.14 119.06,66.14 119.06,72.76 112.44,72.76 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="125.67,66.14 132.28,66.14 132.28,72.82 125.67,72.82 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="138.9,66.14 145.51,66.14 145.51,72.82 138.9,72.82 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="13.23,72.69 19.91,72.69 19.84,79.37 13.23,79.37 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="19.78,72.69 26.52,72.69 26.39,79.37 19.78,79.37 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="26.39,72.69 33.07,72.69 33,79.44 26.39,79.44 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="46.3,72.76 52.91,72.76 52.91,79.44 46.3,79.44 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="59.53,72.69 66.14,72.69 66.14,79.37 59.53,79.37 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="72.76,72.76 79.37,72.76 79.37,79.44 72.76,79.44 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="85.98,72.69 92.66,72.69 92.6,79.37 85.98,79.37 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="92.53,72.76 99.28,72.76 99.15,79.44 92.53,79.44 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="99.15,72.69 105.89,72.69 105.76,79.37 99.15,79.37 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="105.76,72.76 112.44,72.76 112.37,79.44 105.76,79.44 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="125.67,72.69 132.35,72.69 132.28,79.44 125.67,79.44 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="132.22,72.76 138.96,72.76 138.83,79.37 132.22,79.37 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="138.83,72.69 145.58,72.69 145.45,79.37 138.83,79.37 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="145.45,72.76 152.13,72.76 152.06,79.44 145.45,79.44 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="26.46,79.3 33.07,79.3 33.07,85.98 26.46,85.98 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="39.69,79.37 46.37,79.37 46.3,85.98 39.69,85.98 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="46.23,79.3 52.98,79.3 52.85,85.98 46.23,85.98 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="52.85,79.37 59.53,79.37 59.46,85.98 52.85,85.98 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="66.14,79.37 72.82,79.37 72.76,85.98 66.14,85.98 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="72.69,79.3 79.37,79.3 79.3,85.98 72.69,85.98 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="92.6,79.3 99.21,79.3 99.21,86.05 92.6,86.05 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="105.83,79.3 112.51,79.3 112.44,86.05 105.83,86.05 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="112.37,79.37 119.06,79.37 118.99,85.98 112.37,85.98 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="125.67,79.3 132.28,79.3 132.28,85.98 125.67,85.98 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="145.51,79.3 152.13,79.3 152.13,86.05 145.51,86.05 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="13.23,85.98 19.84,85.98 19.84,92.6 13.23,92.6 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="33.07,85.98 39.69,85.98 39.69,92.66 33.07,92.66 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="85.98,85.98 92.66,85.98 92.6,92.6 85.98,92.6 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="92.53,85.92 99.28,85.92 99.15,92.66 92.53,92.66 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="99.15,85.98 105.89,85.98 105.76,92.6 99.15,92.6 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="105.76,85.92 112.44,85.92 112.37,92.6 105.76,92.6 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="132.28,85.98 138.96,85.98 138.9,92.6 132.28,92.6 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="138.83,85.98 145.58,85.98 145.45,92.66 138.83,92.66 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="145.45,85.92 152.13,85.92 152.06,92.6 145.45,92.6 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="19.84,92.6 26.46,92.6 26.46,99.21 19.84,99.21 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="33.07,92.53 39.75,92.53 39.69,99.21 33.07,99.21 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="39.62,92.6 46.3,92.6 46.23,99.21 39.62,99.21 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="52.91,92.6 59.53,92.6 59.53,99.21 52.91,99.21 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="66.14,92.6 72.82,92.6 72.76,99.28 66.14,99.28 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="72.69,92.6 79.37,92.6 79.3,99.21 72.69,99.21 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="92.6,92.53 99.21,92.53 99.21,99.28 92.6,99.28 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="112.44,92.6 119.06,92.6 119.06,99.28 112.44,99.28 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="138.9,92.53 145.51,92.53 145.51,99.21 138.9,99.21 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="66.14,99.15 72.76,99.15 72.76,105.89 66.14,105.89 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="79.37,99.21 85.98,99.21 85.98,105.83 79.37,105.83 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="92.6,99.15 99.21,99.15 99.21,105.83 92.6,105.83 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="112.44,99.15 119.06,99.15 119.06,105.83 112.44,105.83 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="132.28,99.21 138.9,99.21 138.9,105.83 132.28,105.83 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="66.14,105.76 72.76,105.76 72.76,112.44 66.14,112.44 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="85.98,105.83 92.6,105.83 92.6,112.44 85.98,112.44 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="99.21,105.83 105.83,105.83 105.83,112.44 99.21,112.44 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="119.06,105.83 125.74,105.83 125.67,112.51 119.06,112.51 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="125.6,105.83 132.28,105.83 132.22,112.44 125.6,112.44 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="138.9,105.83 145.58,105.83 145.51,112.44 138.9,112.44 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="145.45,105.83 152.13,105.83 152.06,112.51 145.45,112.51 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="72.76,112.44 79.44,112.44 79.37,119.12 72.76,119.12 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="79.3,112.44 85.98,112.44 85.92,119.12 79.3,119.12 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="112.44,112.44 119.12,112.44 119.06,119.06 112.44,119.06 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="118.99,112.37 125.67,112.37 125.6,119.12 118.99,119.12 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="132.28,112.44 138.9,112.44 138.9,119.12 132.28,119.12 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="145.51,112.37 152.13,112.37 152.13,119.06 145.51,119.06 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="66.14,119.06 72.82,119.06 72.76,125.74 66.14,125.74 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="72.69,118.99 79.44,118.99 79.3,125.74 72.69,125.74 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="79.3,118.99 86.05,118.99 85.92,125.67 79.3,125.67 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="85.92,119.06 92.6,119.06 92.53,125.74 85.92,125.74 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="99.21,119.06 105.83,119.06 105.83,125.74 99.21,125.74 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="119.06,118.99 125.74,118.99 125.67,125.67 119.06,125.67 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="125.6,119.06 132.35,119.06 132.22,125.74 125.6,125.74 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="132.22,118.99 138.9,118.99 138.83,125.74 132.22,125.74 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="66.14,125.6 72.82,125.6 72.76,132.35 66.14,132.35 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="72.69,125.6 79.37,125.6 79.3,132.35 72.69,132.35 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="85.98,125.6 92.66,125.6 92.6,132.28 85.98,132.28 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="92.53,125.67 99.28,125.67 99.15,132.35 92.53,132.35 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="99.15,125.6 105.89,125.6 105.76,132.28 99.15,132.28 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="105.76,125.67 112.51,125.67 112.37,132.35 105.76,132.35 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="112.37,125.67 119.06,125.67 118.99,132.35 112.37,132.35 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="125.67,125.6 132.35,125.6 132.28,132.35 125.67,132.35 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="132.22,125.6 138.9,125.6 138.83,132.35 132.22,132.35 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="66.14,132.22 72.82,132.22 72.76,138.96 66.14,138.96 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="72.69,132.22 79.37,132.22 79.3,138.9 72.69,138.9 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="92.6,132.22 99.21,132.22 99.21,138.96 92.6,138.96 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="105.83,132.22 112.51,132.22 112.44,138.96 105.83,138.96 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="112.37,132.22 119.06,132.22 118.99,138.96 112.37,138.96 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="125.67,132.22 132.35,132.22 132.28,138.9 125.67,138.9 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="132.22,132.22 138.9,132.22 138.83,138.96 132.22,138.96 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="66.14,138.83 72.76,138.83 72.76,145.58 66.14,145.58 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="79.37,138.9 86.05,138.9 85.98,145.58 79.37,145.58 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="85.92,138.9 92.66,138.9 92.53,145.51 85.92,145.51 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="92.53,138.83 99.28,138.83 99.15,145.58 92.53,145.58 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="99.15,138.9 105.89,138.9 105.76,145.51 99.15,145.51 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="105.76,138.83 112.51,138.83 112.37,145.51 105.76,145.51 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="112.37,138.83 119.12,138.83 118.99,145.58 112.37,145.58 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="118.99,138.9 125.67,138.9 125.6,145.51 118.99,145.51 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="132.28,138.83 138.96,138.83 138.9,145.58 132.28,145.58 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="138.83,138.9 145.51,138.9 145.45,145.51 138.83,145.51 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="66.14,145.45 72.82,145.45 72.76,152.13 66.14,152.13 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="72.69,145.51 79.44,145.51 79.3,152.13 72.69,152.13 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="79.3,145.45 85.98,145.45 85.92,152.13 79.3,152.13 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="92.6,145.45 99.21,145.45 99.21,152.13 92.6,152.13 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="112.44,145.45 119.06,145.45 119.06,152.13 112.44,152.13 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
          <polygon
            points="132.28,145.45 138.9,145.45 138.9,152.13 132.28,152.13 "
            style="fill:url(#hatchfbccd1d7ad5144ee8da67c1bcd81b9e1);"
          />
      `,
            },
            {
                value: 16,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(255,255,255,0);"
            shape-rendering="crispEdges"
          />
          <linearGradient
            id="gradient0cf66245bbc14c159cbe9c68d2239764"
            gradientUnits="userSpaceOnUse"
            x1="9.78888088478347"
            y1="78.8572474050841"
            x2="155.56543964134"
            y2="86.497073121039"
          >
            <stop offset="0%" stop-color="#933C35" />
            <stop offset="100%" stop-color="#7A6A42" />
          </linearGradient>
          <polygon
            points="13.23,13.23 59.53,13.23 59.53,59.53 13.23,59.53 13.23,19.78 19.84,19.78 19.84,52.91 52.91,52.91 52.91,19.84 13.23,19.84 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="13.23,105.83 59.53,105.83 59.53,152.13 13.23,152.13 13.23,112.37 19.84,112.37 19.84,145.51 52.91,145.51 52.91,112.44 13.23,112.44 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="105.83,13.23 152.13,13.23 152.13,59.53 105.83,59.53 105.83,19.78 112.44,19.78 112.44,52.91 145.51,52.91 145.51,19.84 105.83,19.84 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="26.46,26.46 46.3,26.46 46.3,46.3 26.46,46.3 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="26.46,119.06 46.3,119.06 46.3,138.9 26.46,138.9 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="119.06,26.46 138.9,26.46 138.9,46.3 119.06,46.3 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="82.68,19.18 81.66,18.98 80.81,18.41 80.23,17.55 80.03,16.54 80.23,15.52 80.81,14.66 81.66,14.09 82.68,13.89 95.91,13.89 96.92,14.09 97.78,14.66 98.35,15.52 98.55,16.54 98.35,17.55 97.78,18.41 96.92,18.98 95.91,19.18 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="69.45,25.8 68.44,25.59 67.58,25.02 67,24.16 66.8,23.15 67,22.14 67.58,21.28 68.44,20.71 69.45,20.5 82.68,20.5 83.69,20.71 84.55,21.28 85.12,22.14 85.32,23.15 85.12,24.16 84.55,25.02 83.69,25.59 82.68,25.8 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="95.91,25.8 94.89,25.59 94.03,25.02 93.46,24.16 93.26,23.15 93.46,22.14 94.03,21.28 94.89,20.71 95.91,20.5 95.91,20.5 96.92,20.71 97.78,21.28 98.35,22.14 98.55,23.15 98.35,24.16 97.78,25.02 96.92,25.59 95.91,25.8 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="82.68,32.41 81.66,32.21 80.81,31.63 80.23,30.78 80.03,29.76 80.23,28.75 80.81,27.89 81.66,27.32 82.68,27.12 95.91,27.12 96.92,27.32 97.78,27.89 98.35,28.75 98.55,29.76 98.35,30.78 97.78,31.63 96.92,32.21 95.91,32.41 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="69.45,39.02 68.44,38.82 67.58,38.25 67,37.39 66.8,36.38 67,35.37 67.58,34.51 68.44,33.93 69.45,33.73 76.06,33.73 77.08,33.93 77.93,34.51 78.51,35.37 78.71,36.38 78.51,37.39 77.93,38.25 77.08,38.82 76.06,39.02 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="95.91,39.02 94.89,38.82 94.03,38.25 93.46,37.39 93.26,36.38 93.46,35.37 94.03,34.51 94.89,33.93 95.91,33.73 95.91,33.73 96.92,33.93 97.78,34.51 98.35,35.37 98.55,36.38 98.35,37.39 97.78,38.25 96.92,38.82 95.91,39.02 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="76.06,45.64 75.05,45.44 74.19,44.86 73.62,44 73.42,42.99 73.62,41.98 74.19,41.12 75.05,40.55 76.06,40.35 76.06,40.35 77.08,40.55 77.93,41.12 78.51,41.98 78.71,42.99 78.51,44 77.93,44.86 77.08,45.44 76.06,45.64 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="95.91,45.64 94.89,45.44 94.03,44.86 93.46,44 93.26,42.99 93.46,41.98 94.03,41.12 94.89,40.55 95.91,40.35 95.91,40.35 96.92,40.55 97.78,41.12 98.35,41.98 98.55,42.99 98.35,44 97.78,44.86 96.92,45.44 95.91,45.64 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="69.45,52.25 68.44,52.05 67.58,51.48 67,50.62 66.8,49.61 67,48.59 67.58,47.74 68.44,47.16 69.45,46.96 69.45,46.96 70.46,47.16 71.32,47.74 71.89,48.59 72.09,49.61 71.89,50.62 71.32,51.48 70.46,52.05 69.45,52.25 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="89.29,52.25 88.28,52.05 87.42,51.48 86.85,50.62 86.65,49.61 86.85,48.59 87.42,47.74 88.28,47.16 89.29,46.96 89.29,46.96 90.3,47.16 91.16,47.74 91.74,48.59 91.94,49.61 91.74,50.62 91.16,51.48 90.3,52.05 89.29,52.25 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="69.45,58.87 68.44,58.66 67.58,58.09 67,57.23 66.8,56.22 67,55.21 67.58,54.35 68.44,53.78 69.45,53.57 69.45,53.57 70.46,53.78 71.32,54.35 71.89,55.21 72.09,56.22 71.89,57.23 71.32,58.09 70.46,58.66 69.45,58.87 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="82.68,58.87 81.66,58.66 80.81,58.09 80.23,57.23 80.03,56.22 80.23,55.21 80.81,54.35 81.66,53.78 82.68,53.57 82.68,53.57 83.69,53.78 84.55,54.35 85.12,55.21 85.32,56.22 85.12,57.23 84.55,58.09 83.69,58.66 82.68,58.87 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="95.91,58.87 94.89,58.66 94.03,58.09 93.46,57.23 93.26,56.22 93.46,55.21 94.03,54.35 94.89,53.78 95.91,53.57 95.91,53.57 96.92,53.78 97.78,54.35 98.35,55.21 98.55,56.22 98.35,57.23 97.78,58.09 96.92,58.66 95.91,58.87 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="76.06,65.48 75.05,65.28 74.19,64.71 73.62,63.85 73.42,62.83 73.62,61.82 74.19,60.96 75.05,60.39 76.06,60.19 76.06,60.19 77.08,60.39 77.93,60.96 78.51,61.82 78.71,62.83 78.51,63.85 77.93,64.71 77.08,65.28 76.06,65.48 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="69.45,72.09 68.44,71.89 67.58,71.32 67,70.46 66.8,69.45 67,68.44 67.58,67.58 68.44,67 69.45,66.8 69.45,66.8 70.46,67 71.32,67.58 71.89,68.44 72.09,69.45 71.89,70.46 71.32,71.32 70.46,71.89 69.45,72.09 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="89.29,72.09 88.28,71.89 87.42,71.32 86.85,70.46 86.65,69.45 86.85,68.44 87.42,67.58 88.28,67 89.29,66.8 89.29,66.8 90.3,67 91.16,67.58 91.74,68.44 91.94,69.45 91.74,70.46 91.16,71.32 90.3,71.89 89.29,72.09 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="76.06,78.71 75.05,78.51 74.19,77.93 73.62,77.08 73.42,76.06 73.62,75.05 74.19,74.19 75.05,73.62 76.06,73.42 76.06,73.42 77.08,73.62 77.93,74.19 78.51,75.05 78.71,76.06 78.51,77.08 77.93,77.93 77.08,78.51 76.06,78.71 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="89.29,78.71 88.28,78.51 87.42,77.93 86.85,77.08 86.65,76.06 86.85,75.05 87.42,74.19 88.28,73.62 89.29,73.42 89.29,73.42 90.3,73.62 91.16,74.19 91.74,75.05 91.94,76.06 91.74,77.08 91.16,77.93 90.3,78.51 89.29,78.71 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="89.29,91.94 88.28,91.74 87.42,91.16 86.85,90.3 86.65,89.29 86.85,88.28 87.42,87.42 88.28,86.85 89.29,86.65 89.29,86.65 90.3,86.85 91.16,87.42 91.74,88.28 91.94,89.29 91.74,90.3 91.16,91.16 90.3,91.74 89.29,91.94 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="69.45,98.55 68.44,98.35 67.58,97.78 67,96.92 66.8,95.91 67,94.89 67.58,94.03 68.44,93.46 69.45,93.26 76.06,93.26 77.08,93.46 77.93,94.03 78.51,94.89 78.71,95.91 78.51,96.92 77.93,97.78 77.08,98.35 76.06,98.55 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="95.91,98.55 94.89,98.35 94.03,97.78 93.46,96.92 93.26,95.91 93.46,94.89 94.03,94.03 94.89,93.46 95.91,93.26 95.91,93.26 96.92,93.46 97.78,94.03 98.35,94.89 98.55,95.91 98.35,96.92 97.78,97.78 96.92,98.35 95.91,98.55 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="69.45,105.17 68.44,104.96 67.58,104.39 67,103.53 66.8,102.52 67,101.51 67.58,100.65 68.44,100.08 69.45,99.87 69.45,99.87 70.46,100.08 71.32,100.65 71.89,101.51 72.09,102.52 71.89,103.53 71.32,104.39 70.46,104.96 69.45,105.17 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="82.68,105.17 81.66,104.96 80.81,104.39 80.23,103.53 80.03,102.52 80.23,101.51 80.81,100.65 81.66,100.08 82.68,99.87 82.68,99.87 83.69,100.08 84.55,100.65 85.12,101.51 85.32,102.52 85.12,103.53 84.55,104.39 83.69,104.96 82.68,105.17 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="95.91,105.17 94.89,104.96 94.03,104.39 93.46,103.53 93.26,102.52 93.46,101.51 94.03,100.65 94.89,100.08 95.91,99.87 95.91,99.87 96.92,100.08 97.78,100.65 98.35,101.51 98.55,102.52 98.35,103.53 97.78,104.39 96.92,104.96 95.91,105.17 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="69.45,111.78 68.44,111.58 67.58,111 67,110.15 66.8,109.13 67,108.12 67.58,107.26 68.44,106.69 69.45,106.49 69.45,106.49 70.46,106.69 71.32,107.26 71.89,108.12 72.09,109.13 71.89,110.15 71.32,111 70.46,111.58 69.45,111.78 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="89.29,111.78 88.28,111.58 87.42,111 86.85,110.15 86.65,109.13 86.85,108.12 87.42,107.26 88.28,106.69 89.29,106.49 89.29,106.49 90.3,106.69 91.16,107.26 91.74,108.12 91.94,109.13 91.74,110.15 91.16,111 90.3,111.58 89.29,111.78 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="102.52,111.78 101.51,111.58 100.65,111 100.08,110.15 99.87,109.13 100.08,108.12 100.65,107.26 101.51,106.69 102.52,106.49 102.52,106.49 103.53,106.69 104.39,107.26 104.96,108.12 105.17,109.13 104.96,110.15 104.39,111 103.53,111.58 102.52,111.78 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="76.06,118.39 75.05,118.19 74.19,117.62 73.62,116.76 73.42,115.75 73.62,114.74 74.19,113.88 75.05,113.3 76.06,113.1 82.68,113.1 83.69,113.3 84.55,113.88 85.12,114.74 85.32,115.75 85.12,116.76 84.55,117.62 83.69,118.19 82.68,118.39 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="115.75,118.39 114.74,118.19 113.88,117.62 113.3,116.76 113.1,115.75 113.3,114.74 113.88,113.88 114.74,113.3 115.75,113.1 115.75,113.1 116.76,113.3 117.62,113.88 118.19,114.74 118.39,115.75 118.19,116.76 117.62,117.62 116.76,118.19 115.75,118.39 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="69.45,125.01 68.44,124.81 67.58,124.23 67,123.37 66.8,122.36 67,121.35 67.58,120.49 68.44,119.92 69.45,119.72 89.29,119.72 90.3,119.92 91.16,120.49 91.74,121.35 91.94,122.36 91.74,123.37 91.16,124.23 90.3,124.81 89.29,125.01 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="102.52,125.01 101.51,124.81 100.65,124.23 100.08,123.37 99.87,122.36 100.08,121.35 100.65,120.49 101.51,119.92 102.52,119.72 102.52,119.72 103.53,119.92 104.39,120.49 104.96,121.35 105.17,122.36 104.96,123.37 104.39,124.23 103.53,124.81 102.52,125.01 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="122.36,125.01 121.35,124.81 120.49,124.23 119.92,123.37 119.72,122.36 119.92,121.35 120.49,120.49 121.35,119.92 122.36,119.72 122.36,119.72 123.37,119.92 124.23,120.49 124.81,121.35 125.01,122.36 124.81,123.37 124.23,124.23 123.37,124.81 122.36,125.01 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="69.45,131.62 68.44,131.42 67.58,130.85 67,129.99 66.8,128.98 67,127.96 67.58,127.11 68.44,126.53 69.45,126.33 76.06,126.33 77.08,126.53 77.93,127.11 78.51,127.96 78.71,128.98 78.51,129.99 77.93,130.85 77.08,131.42 76.06,131.62 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="89.29,131.62 88.28,131.42 87.42,130.85 86.85,129.99 86.65,128.98 86.85,127.96 87.42,127.11 88.28,126.53 89.29,126.33 115.75,126.33 116.76,126.53 117.62,127.11 118.19,127.96 118.39,128.98 118.19,129.99 117.62,130.85 116.76,131.42 115.75,131.62 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="128.98,131.62 127.96,131.42 127.11,130.85 126.53,129.99 126.33,128.98 126.53,127.96 127.11,127.11 127.96,126.53 128.98,126.33 128.98,126.33 129.99,126.53 130.85,127.11 131.42,127.96 131.62,128.98 131.42,129.99 130.85,130.85 129.99,131.42 128.98,131.62 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="69.45,138.24 68.44,138.03 67.58,137.46 67,136.6 66.8,135.59 67,134.58 67.58,133.72 68.44,133.15 69.45,132.94 76.06,132.94 77.08,133.15 77.93,133.72 78.51,134.58 78.71,135.59 78.51,136.6 77.93,137.46 77.08,138.03 76.06,138.24 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="95.91,138.24 94.89,138.03 94.03,137.46 93.46,136.6 93.26,135.59 93.46,134.58 94.03,133.72 94.89,133.15 95.91,132.94 95.91,132.94 96.92,133.15 97.78,133.72 98.35,134.58 98.55,135.59 98.35,136.6 97.78,137.46 96.92,138.03 95.91,138.24 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="109.13,138.24 108.12,138.03 107.26,137.46 106.69,136.6 106.49,135.59 106.69,134.58 107.26,133.72 108.12,133.15 109.13,132.94 115.75,132.94 116.76,133.15 117.62,133.72 118.19,134.58 118.39,135.59 118.19,136.6 117.62,137.46 116.76,138.03 115.75,138.24 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="128.98,138.24 127.96,138.03 127.11,137.46 126.53,136.6 126.33,135.59 126.53,134.58 127.11,133.72 127.96,133.15 128.98,132.94 135.59,132.94 136.6,133.15 137.46,133.72 138.03,134.58 138.24,135.59 138.03,136.6 137.46,137.46 136.6,138.03 135.59,138.24 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="69.45,144.85 68.44,144.65 67.58,144.08 67,143.22 66.8,142.2 67,141.19 67.58,140.33 68.44,139.76 69.45,139.56 69.45,139.56 70.46,139.76 71.32,140.33 71.89,141.19 72.09,142.2 71.89,143.22 71.32,144.08 70.46,144.65 69.45,144.85 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="82.68,144.85 81.66,144.65 80.81,144.08 80.23,143.22 80.03,142.2 80.23,141.19 80.81,140.33 81.66,139.76 82.68,139.56 122.36,139.56 123.37,139.76 124.23,140.33 124.81,141.19 125.01,142.2 124.81,143.22 124.23,144.08 123.37,144.65 122.36,144.85 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="135.59,144.85 134.58,144.65 133.72,144.08 133.15,143.22 132.94,142.2 133.15,141.19 133.72,140.33 134.58,139.76 135.59,139.56 142.2,139.56 143.22,139.76 144.08,140.33 144.65,141.19 144.85,142.2 144.65,143.22 144.08,144.08 143.22,144.65 142.2,144.85 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="69.45,151.46 68.44,151.26 67.58,150.69 67,149.83 66.8,148.82 67,147.81 67.58,146.95 68.44,146.37 69.45,146.17 82.68,146.17 83.69,146.37 84.55,146.95 85.12,147.81 85.32,148.82 85.12,149.83 84.55,150.69 83.69,151.26 82.68,151.46 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="95.91,151.46 94.89,151.26 94.03,150.69 93.46,149.83 93.26,148.82 93.46,147.81 94.03,146.95 94.89,146.37 95.91,146.17 95.91,146.17 96.92,146.37 97.78,146.95 98.35,147.81 98.55,148.82 98.35,149.83 97.78,150.69 96.92,151.26 95.91,151.46 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="115.75,151.46 114.74,151.26 113.88,150.69 113.3,149.83 113.1,148.82 113.3,147.81 113.88,146.95 114.74,146.37 115.75,146.17 115.75,146.17 116.76,146.37 117.62,146.95 118.19,147.81 118.39,148.82 118.19,149.83 117.62,150.69 116.76,151.26 115.75,151.46 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="135.59,151.46 134.58,151.26 133.72,150.69 133.15,149.83 132.94,148.82 133.15,147.81 133.72,146.95 134.58,146.37 135.59,146.17 135.59,146.17 136.6,146.37 137.46,146.95 138.03,147.81 138.24,148.82 138.03,149.83 137.46,150.69 136.6,151.26 135.59,151.46 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="13.89,69.45 14.09,68.44 14.66,67.58 15.52,67 16.54,66.8 17.55,67 18.41,67.58 18.98,68.44 19.18,69.45 19.18,76.06 18.98,77.08 18.41,77.93 17.55,78.51 16.54,78.71 15.52,78.51 14.66,77.93 14.09,77.08 13.89,76.06 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="13.89,89.29 14.09,88.28 14.66,87.42 15.52,86.85 16.54,86.65 17.55,86.85 18.41,87.42 18.98,88.28 19.18,89.29 19.18,89.29 18.98,90.3 18.41,91.16 17.55,91.74 16.54,91.94 15.52,91.74 14.66,91.16 14.09,90.3 13.89,89.29 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="20.5,69.45 20.71,68.44 21.28,67.58 22.14,67 23.15,66.8 24.16,67 25.02,67.58 25.59,68.44 25.8,69.45 25.8,76.06 25.59,77.08 25.02,77.93 24.16,78.51 23.15,78.71 22.14,78.51 21.28,77.93 20.71,77.08 20.5,76.06 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="20.5,95.91 20.71,94.89 21.28,94.03 22.14,93.46 23.15,93.26 24.16,93.46 25.02,94.03 25.59,94.89 25.8,95.91 25.8,95.91 25.59,96.92 25.02,97.78 24.16,98.35 23.15,98.55 22.14,98.35 21.28,97.78 20.71,96.92 20.5,95.91 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="27.12,69.45 27.32,68.44 27.89,67.58 28.75,67 29.76,66.8 30.78,67 31.63,67.58 32.21,68.44 32.41,69.45 32.41,82.68 32.21,83.69 31.63,84.55 30.78,85.12 29.76,85.32 28.75,85.12 27.89,84.55 27.32,83.69 27.12,82.68 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="33.73,69.45 33.93,68.44 34.51,67.58 35.37,67 36.38,66.8 37.39,67 38.25,67.58 38.82,68.44 39.02,69.45 39.02,69.45 38.82,70.46 38.25,71.32 37.39,71.89 36.38,72.09 35.37,71.89 34.51,71.32 33.93,70.46 33.73,69.45 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="33.73,89.29 33.93,88.28 34.51,87.42 35.37,86.85 36.38,86.65 37.39,86.85 38.25,87.42 38.82,88.28 39.02,89.29 39.02,95.91 38.82,96.92 38.25,97.78 37.39,98.35 36.38,98.55 35.37,98.35 34.51,97.78 33.93,96.92 33.73,95.91 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="40.35,69.45 40.55,68.44 41.12,67.58 41.98,67 42.99,66.8 44,67 44.86,67.58 45.44,68.44 45.64,69.45 45.64,69.45 45.44,70.46 44.86,71.32 44,71.89 42.99,72.09 41.98,71.89 41.12,71.32 40.55,70.46 40.35,69.45 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="40.35,82.68 40.55,81.66 41.12,80.81 41.98,80.23 42.99,80.03 44,80.23 44.86,80.81 45.44,81.66 45.64,82.68 45.64,82.68 45.44,83.69 44.86,84.55 44,85.12 42.99,85.32 41.98,85.12 41.12,84.55 40.55,83.69 40.35,82.68 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="40.35,95.91 40.55,94.89 41.12,94.03 41.98,93.46 42.99,93.26 44,93.46 44.86,94.03 45.44,94.89 45.64,95.91 45.64,95.91 45.44,96.92 44.86,97.78 44,98.35 42.99,98.55 41.98,98.35 41.12,97.78 40.55,96.92 40.35,95.91 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="46.96,76.06 47.16,75.05 47.74,74.19 48.59,73.62 49.61,73.42 50.62,73.62 51.48,74.19 52.05,75.05 52.25,76.06 52.25,82.68 52.05,83.69 51.48,84.55 50.62,85.12 49.61,85.32 48.59,85.12 47.74,84.55 47.16,83.69 46.96,82.68 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="53.57,69.45 53.78,68.44 54.35,67.58 55.21,67 56.22,66.8 57.23,67 58.09,67.58 58.66,68.44 58.87,69.45 58.87,69.45 58.66,70.46 58.09,71.32 57.23,71.89 56.22,72.09 55.21,71.89 54.35,71.32 53.78,70.46 53.57,69.45 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="53.57,82.68 53.78,81.66 54.35,80.81 55.21,80.23 56.22,80.03 57.23,80.23 58.09,80.81 58.66,81.66 58.87,82.68 58.87,82.68 58.66,83.69 58.09,84.55 57.23,85.12 56.22,85.32 55.21,85.12 54.35,84.55 53.78,83.69 53.57,82.68 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="53.57,95.91 53.78,94.89 54.35,94.03 55.21,93.46 56.22,93.26 57.23,93.46 58.09,94.03 58.66,94.89 58.87,95.91 58.87,95.91 58.66,96.92 58.09,97.78 57.23,98.35 56.22,98.55 55.21,98.35 54.35,97.78 53.78,96.92 53.57,95.91 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="60.19,69.45 60.39,68.44 60.96,67.58 61.82,67 62.83,66.8 63.85,67 64.71,67.58 65.28,68.44 65.48,69.45 65.48,76.06 65.28,77.08 64.71,77.93 63.85,78.51 62.83,78.71 61.82,78.51 60.96,77.93 60.39,77.08 60.19,76.06 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="66.8,69.45 67,68.44 67.58,67.58 68.44,67 69.45,66.8 70.46,67 71.32,67.58 71.89,68.44 72.09,69.45 72.09,69.45 71.89,70.46 71.32,71.32 70.46,71.89 69.45,72.09 68.44,71.89 67.58,71.32 67,70.46 66.8,69.45 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="66.8,82.68 67,81.66 67.58,80.81 68.44,80.23 69.45,80.03 70.46,80.23 71.32,80.81 71.89,81.66 72.09,82.68 72.09,82.68 71.89,83.69 71.32,84.55 70.46,85.12 69.45,85.32 68.44,85.12 67.58,84.55 67,83.69 66.8,82.68 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="73.42,76.06 73.62,75.05 74.19,74.19 75.05,73.62 76.06,73.42 77.08,73.62 77.93,74.19 78.51,75.05 78.71,76.06 78.71,82.68 78.51,83.69 77.93,84.55 77.08,85.12 76.06,85.32 75.05,85.12 74.19,84.55 73.62,83.69 73.42,82.68 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="86.65,76.06 86.85,75.05 87.42,74.19 88.28,73.62 89.29,73.42 90.3,73.62 91.16,74.19 91.74,75.05 91.94,76.06 91.94,76.06 91.74,77.08 91.16,77.93 90.3,78.51 89.29,78.71 88.28,78.51 87.42,77.93 86.85,77.08 86.65,76.06 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="93.26,76.06 93.46,75.05 94.03,74.19 94.89,73.62 95.91,73.42 96.92,73.62 97.78,74.19 98.35,75.05 98.55,76.06 98.55,89.29 98.35,90.3 97.78,91.16 96.92,91.74 95.91,91.94 94.89,91.74 94.03,91.16 93.46,90.3 93.26,89.29 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="99.87,69.45 100.08,68.44 100.65,67.58 101.51,67 102.52,66.8 103.53,67 104.39,67.58 104.96,68.44 105.17,69.45 105.17,76.06 104.96,77.08 104.39,77.93 103.53,78.51 102.52,78.71 101.51,78.51 100.65,77.93 100.08,77.08 99.87,76.06 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="99.87,89.29 100.08,88.28 100.65,87.42 101.51,86.85 102.52,86.65 103.53,86.85 104.39,87.42 104.96,88.28 105.17,89.29 105.17,89.29 104.96,90.3 104.39,91.16 103.53,91.74 102.52,91.94 101.51,91.74 100.65,91.16 100.08,90.3 99.87,89.29 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="106.49,76.06 106.69,75.05 107.26,74.19 108.12,73.62 109.13,73.42 110.15,73.62 111,74.19 111.58,75.05 111.78,76.06 111.78,89.29 111.58,90.3 111,91.16 110.15,91.74 109.13,91.94 108.12,91.74 107.26,91.16 106.69,90.3 106.49,89.29 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="113.1,69.45 113.3,68.44 113.88,67.58 114.74,67 115.75,66.8 116.76,67 117.62,67.58 118.19,68.44 118.39,69.45 118.39,69.45 118.19,70.46 117.62,71.32 116.76,71.89 115.75,72.09 114.74,71.89 113.88,71.32 113.3,70.46 113.1,69.45 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="113.1,82.68 113.3,81.66 113.88,80.81 114.74,80.23 115.75,80.03 116.76,80.23 117.62,80.81 118.19,81.66 118.39,82.68 118.39,82.68 118.19,83.69 117.62,84.55 116.76,85.12 115.75,85.32 114.74,85.12 113.88,84.55 113.3,83.69 113.1,82.68 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="113.1,95.91 113.3,94.89 113.88,94.03 114.74,93.46 115.75,93.26 116.76,93.46 117.62,94.03 118.19,94.89 118.39,95.91 118.39,102.52 118.19,103.53 117.62,104.39 116.76,104.96 115.75,105.17 114.74,104.96 113.88,104.39 113.3,103.53 113.1,102.52 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="119.72,109.13 119.92,108.12 120.49,107.26 121.35,106.69 122.36,106.49 123.37,106.69 124.23,107.26 124.81,108.12 125.01,109.13 125.01,115.75 124.81,116.76 124.23,117.62 123.37,118.19 122.36,118.39 121.35,118.19 120.49,117.62 119.92,116.76 119.72,115.75 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="126.33,69.45 126.53,68.44 127.11,67.58 127.96,67 128.98,66.8 129.99,67 130.85,67.58 131.42,68.44 131.62,69.45 131.62,82.68 131.42,83.69 130.85,84.55 129.99,85.12 128.98,85.32 127.96,85.12 127.11,84.55 126.53,83.69 126.33,82.68 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="126.33,109.13 126.53,108.12 127.11,107.26 127.96,106.69 128.98,106.49 129.99,106.69 130.85,107.26 131.42,108.12 131.62,109.13 131.62,109.13 131.42,110.15 130.85,111 129.99,111.58 128.98,111.78 127.96,111.58 127.11,111 126.53,110.15 126.33,109.13 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="126.33,122.36 126.53,121.35 127.11,120.49 127.96,119.92 128.98,119.72 129.99,119.92 130.85,120.49 131.42,121.35 131.62,122.36 131.62,122.36 131.42,123.37 130.85,124.23 129.99,124.81 128.98,125.01 127.96,124.81 127.11,124.23 126.53,123.37 126.33,122.36 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="132.94,76.06 133.15,75.05 133.72,74.19 134.58,73.62 135.59,73.42 136.6,73.62 137.46,74.19 138.03,75.05 138.24,76.06 138.24,76.06 138.03,77.08 137.46,77.93 136.6,78.51 135.59,78.71 134.58,78.51 133.72,77.93 133.15,77.08 132.94,76.06 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="132.94,89.29 133.15,88.28 133.72,87.42 134.58,86.85 135.59,86.65 136.6,86.85 137.46,87.42 138.03,88.28 138.24,89.29 138.24,89.29 138.03,90.3 137.46,91.16 136.6,91.74 135.59,91.94 134.58,91.74 133.72,91.16 133.15,90.3 132.94,89.29 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="132.94,102.52 133.15,101.51 133.72,100.65 134.58,100.08 135.59,99.87 136.6,100.08 137.46,100.65 138.03,101.51 138.24,102.52 138.24,102.52 138.03,103.53 137.46,104.39 136.6,104.96 135.59,105.17 134.58,104.96 133.72,104.39 133.15,103.53 132.94,102.52 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="132.94,115.75 133.15,114.74 133.72,113.88 134.58,113.3 135.59,113.1 136.6,113.3 137.46,113.88 138.03,114.74 138.24,115.75 138.24,128.98 138.03,129.99 137.46,130.85 136.6,131.42 135.59,131.62 134.58,131.42 133.72,130.85 133.15,129.99 132.94,128.98 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="139.56,69.45 139.76,68.44 140.33,67.58 141.19,67 142.2,66.8 143.22,67 144.08,67.58 144.65,68.44 144.85,69.45 144.85,76.06 144.65,77.08 144.08,77.93 143.22,78.51 142.2,78.71 141.19,78.51 140.33,77.93 139.76,77.08 139.56,76.06 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="139.56,89.29 139.76,88.28 140.33,87.42 141.19,86.85 142.2,86.65 143.22,86.85 144.08,87.42 144.65,88.28 144.85,89.29 144.85,95.91 144.65,96.92 144.08,97.78 143.22,98.35 142.2,98.55 141.19,98.35 140.33,97.78 139.76,96.92 139.56,95.91 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="139.56,109.13 139.76,108.12 140.33,107.26 141.19,106.69 142.2,106.49 143.22,106.69 144.08,107.26 144.65,108.12 144.85,109.13 144.85,109.13 144.65,110.15 144.08,111 143.22,111.58 142.2,111.78 141.19,111.58 140.33,111 139.76,110.15 139.56,109.13 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="146.17,76.06 146.37,75.05 146.95,74.19 147.81,73.62 148.82,73.42 149.83,73.62 150.69,74.19 151.26,75.05 151.46,76.06 151.46,89.29 151.26,90.3 150.69,91.16 149.83,91.74 148.82,91.94 147.81,91.74 146.95,91.16 146.37,90.3 146.17,89.29 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
          <polygon
            points="146.17,109.13 146.37,108.12 146.95,107.26 147.81,106.69 148.82,106.49 149.83,106.69 150.69,107.26 151.26,108.12 151.46,109.13 151.46,115.75 151.26,116.76 150.69,117.62 149.83,118.19 148.82,118.39 147.81,118.19 146.95,117.62 146.37,116.76 146.17,115.75 "
            style="fill:url(#gradient0cf66245bbc14c159cbe9c68d2239764);"
          />
      `,
            },
            {
                value: 17,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(255,255,255,0);"
            shape-rendering="crispEdges"
          />
          <linearGradient
            id="gradiente980077bb02c4ed680664ae32429818f"
            gradientUnits="userSpaceOnUse"
            x1="7.7260570069796"
            y1="76.1197953713024"
            x2="157.628278777933"
            y2="89.2345404136097"
          >
            <stop offset="0%" stop-color="#CB07CB" />
            <stop offset="100%" stop-color="#129EB1" />
          </linearGradient>
          <polygon
            points="13.23,13.23 59.53,13.23 59.53,59.53 13.23,59.53 13.23,19.78 19.84,19.78 19.84,52.91 52.91,52.91 52.91,19.84 13.23,19.84 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="13.23,105.83 59.53,105.83 59.53,152.13 13.23,152.13 13.23,112.37 19.84,112.37 19.84,145.51 52.91,145.51 52.91,112.44 13.23,112.44 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="105.83,13.23 152.13,13.23 152.13,59.53 105.83,59.53 105.83,19.78 112.44,19.78 112.44,52.91 145.51,52.91 145.51,19.84 105.83,19.84 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="26.46,26.46 46.3,26.46 46.3,46.3 26.46,46.3 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="26.46,119.06 46.3,119.06 46.3,138.9 26.46,138.9 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="119.06,26.46 138.9,26.46 138.9,46.3 119.06,46.3 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="79.37,19.91 79.37,19.84 79.5,18.55 79.87,17.31 80.48,16.17 81.31,15.17 82.31,14.34 83.45,13.73 84.69,13.36 85.98,13.23 86.05,13.23 86.05,19.91 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="85.92,16.54 85.92,13.23 92.66,13.23 92.66,19.84 85.92,19.84 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.53,13.23 92.6,13.23 93.89,13.36 95.13,13.73 96.27,14.34 97.28,15.17 98.1,16.17 98.71,17.31 99.09,18.55 99.21,19.84 99.21,19.91 92.53,19.91 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="72.76,19.84 72.76,26.46 69.45,26.46 68.18,26.2 67.11,25.49 66.39,24.42 66.14,23.15 66.39,21.88 67.11,20.81 68.18,20.09 69.45,19.84 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="72.69,23.15 72.69,19.84 79.44,19.84 79.44,26.46 72.69,26.46 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="79.3,23.15 79.3,19.78 85.98,19.78 85.98,26.52 79.3,26.52 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.6,23.15 92.6,19.78 99.21,19.78 99.21,26.52 92.6,26.52 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="79.37,26.39 86.05,26.39 86.05,33.07 85.98,33.07 84.69,32.94 83.45,32.57 82.31,31.96 81.31,31.13 80.48,30.13 79.87,28.99 79.5,27.75 79.37,26.46 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="85.92,29.76 85.92,26.46 92.66,26.46 92.66,33.07 85.92,33.07 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.53,29.76 92.53,26.39 99.21,26.39 99.21,33.14 92.53,33.14 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="72.76,33.07 72.76,39.69 69.45,39.69 68.18,39.43 67.11,38.72 66.39,37.64 66.14,36.38 66.39,35.11 67.11,34.04 68.18,33.32 69.45,33.07 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="72.69,33.07 72.76,33.07 74.05,33.2 75.29,33.57 76.43,34.19 77.43,35.01 78.26,36.01 78.87,37.15 79.24,38.39 79.37,39.69 79.37,39.75 72.69,39.75 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.6,36.38 92.6,33 99.21,33 99.21,39.75 92.6,39.75 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="72.76,39.62 79.37,39.62 79.37,42.99 79.12,44.26 78.4,45.33 77.33,46.05 76.06,46.3 74.8,46.05 73.72,45.33 73.01,44.26 72.76,42.99 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.6,39.62 99.21,39.62 99.21,42.99 98.96,44.26 98.24,45.33 97.17,46.05 95.91,46.3 94.64,46.05 93.57,45.33 92.85,44.26 92.6,42.99 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="72.76,52.98 66.14,52.98 66.14,49.61 66.39,48.34 67.11,47.27 68.18,46.55 69.45,46.3 70.71,46.55 71.79,47.27 72.5,48.34 72.76,49.61 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.6,49.61 92.35,50.87 91.63,51.94 90.56,52.66 89.29,52.91 88.03,52.66 86.95,51.94 86.24,50.87 85.98,49.61 86.24,48.34 86.95,47.27 88.03,46.55 89.29,46.3 90.56,46.55 91.63,47.27 92.35,48.34 92.6,49.61 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="66.14,52.85 72.76,52.85 72.76,56.22 72.5,57.49 71.79,58.56 70.71,59.28 69.45,59.53 68.18,59.28 67.11,58.56 66.39,57.49 66.14,56.22 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="85.98,56.22 85.73,57.49 85.02,58.56 83.94,59.28 82.68,59.53 81.41,59.28 80.34,58.56 79.62,57.49 79.37,56.22 79.62,54.95 80.34,53.88 81.41,53.17 82.68,52.91 83.94,53.17 85.02,53.88 85.73,54.95 85.98,56.22 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="99.21,56.22 98.96,57.49 98.24,58.56 97.17,59.28 95.91,59.53 94.64,59.28 93.57,58.56 92.85,57.49 92.6,56.22 92.85,54.95 93.57,53.88 94.64,53.17 95.91,52.91 97.17,53.17 98.24,53.88 98.96,54.95 99.21,56.22 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="79.37,62.83 79.12,64.1 78.4,65.17 77.33,65.89 76.06,66.14 74.8,65.89 73.72,65.17 73.01,64.1 72.76,62.83 73.01,61.57 73.72,60.5 74.8,59.78 76.06,59.53 77.33,59.78 78.4,60.5 79.12,61.57 79.37,62.83 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="13.23,72.82 13.23,72.76 13.36,71.47 13.73,70.22 14.34,69.08 15.17,68.08 16.17,67.26 17.31,66.65 18.55,66.27 19.84,66.14 19.91,66.14 19.91,72.82 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="19.78,69.45 19.78,66.14 26.52,66.14 26.52,72.82 19.78,72.82 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="26.39,69.45 26.39,66.14 33.14,66.14 33.14,72.82 26.39,72.82 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="33,69.45 33,66.14 39.75,66.14 39.75,72.76 33,72.76 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="39.62,72.76 39.62,66.14 42.99,66.14 44.26,66.39 45.33,67.11 46.05,68.18 46.3,69.45 46.05,70.71 45.33,71.79 44.26,72.5 42.99,72.76 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="59.53,66.14 59.53,72.76 56.22,72.76 54.95,72.5 53.88,71.79 53.17,70.71 52.91,69.45 53.17,68.18 53.88,67.11 54.95,66.39 56.22,66.14 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="59.46,69.45 59.46,66.14 66.21,66.14 66.21,72.82 59.46,72.82 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="66.08,72.76 66.08,66.14 69.45,66.14 70.71,66.39 71.79,67.11 72.5,68.18 72.76,69.45 72.5,70.71 71.79,71.79 70.71,72.5 69.45,72.76 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.6,72.82 85.98,72.82 85.98,69.45 86.24,68.18 86.95,67.11 88.03,66.39 89.29,66.14 90.56,66.39 91.63,67.11 92.35,68.18 92.6,69.45 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="105.83,72.82 99.21,72.82 99.21,69.45 99.46,68.18 100.18,67.11 101.25,66.39 102.52,66.14 103.79,66.39 104.86,67.11 105.58,68.18 105.83,69.45 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="119.06,69.45 118.8,70.71 118.09,71.79 117.01,72.5 115.75,72.76 114.48,72.5 113.41,71.79 112.69,70.71 112.44,69.45 112.69,68.18 113.41,67.11 114.48,66.39 115.75,66.14 117.01,66.39 118.09,67.11 118.8,68.18 119.06,69.45 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="132.28,72.82 125.67,72.82 125.67,69.45 125.92,68.18 126.64,67.11 127.71,66.39 128.98,66.14 130.24,66.39 131.31,67.11 132.03,68.18 132.28,69.45 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="145.51,72.82 138.9,72.82 138.9,69.45 139.15,68.18 139.87,67.11 140.94,66.39 142.2,66.14 143.47,66.39 144.54,67.11 145.26,68.18 145.51,69.45 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="13.23,72.69 19.91,72.69 19.91,79.37 19.84,79.37 18.55,79.24 17.31,78.87 16.17,78.26 15.17,77.43 14.34,76.43 13.73,75.29 13.36,74.05 13.23,72.76 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="19.78,76.06 19.78,72.69 26.52,72.69 26.52,79.37 19.78,79.37 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="26.39,76.06 26.39,72.69 33.07,72.69 33.07,79.44 26.39,79.44 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="52.91,79.44 46.3,79.44 46.3,76.06 46.55,74.8 47.27,73.72 48.34,73.01 49.61,72.76 50.87,73.01 51.94,73.72 52.66,74.8 52.91,76.06 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="59.53,72.69 66.14,72.69 66.14,76.06 65.89,77.33 65.17,78.4 64.1,79.12 62.83,79.37 61.57,79.12 60.5,78.4 59.78,77.33 59.53,76.06 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="79.37,79.44 72.76,79.44 72.76,76.06 73.01,74.8 73.72,73.72 74.8,73.01 76.06,72.76 77.33,73.01 78.4,73.72 79.12,74.8 79.37,76.06 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="85.98,72.69 92.66,72.69 92.66,79.37 92.6,79.37 91.31,79.24 90.07,78.87 88.92,78.26 87.92,77.43 87.1,76.43 86.49,75.29 86.11,74.05 85.98,72.76 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.53,76.06 92.53,72.76 99.28,72.76 99.28,79.44 92.53,79.44 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="99.15,76.06 99.15,72.69 105.89,72.69 105.89,79.37 99.15,79.37 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="105.76,72.76 105.83,72.76 107.12,72.88 108.36,73.26 109.5,73.87 110.5,74.69 111.33,75.7 111.94,76.84 112.31,78.08 112.44,79.37 112.44,79.44 105.76,79.44 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="125.67,76.06 125.67,72.69 132.35,72.69 132.35,79.44 125.67,79.44 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="132.22,76.06 132.22,72.76 138.96,72.76 138.96,79.37 132.22,79.37 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="138.83,76.06 138.83,72.69 145.58,72.69 145.58,79.37 138.83,79.37 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="145.45,72.76 145.51,72.76 146.8,72.88 148.04,73.26 149.19,73.87 150.19,74.69 151.01,75.7 151.62,76.84 152,78.08 152.13,79.37 152.13,79.44 145.45,79.44 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="26.46,79.3 33.07,79.3 33.07,82.68 32.82,83.94 32.1,85.02 31.03,85.73 29.76,85.98 28.5,85.73 27.43,85.02 26.71,83.94 26.46,82.68 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="46.3,79.37 46.3,85.98 42.99,85.98 41.73,85.73 40.65,85.02 39.94,83.94 39.69,82.68 39.94,81.41 40.65,80.34 41.73,79.62 42.99,79.37 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="46.23,82.68 46.23,79.3 52.98,79.3 52.98,85.98 46.23,85.98 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="52.85,85.98 52.85,79.37 56.22,79.37 57.49,79.62 58.56,80.34 59.28,81.41 59.53,82.68 59.28,83.94 58.56,85.02 57.49,85.73 56.22,85.98 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="72.76,79.37 72.76,85.98 69.45,85.98 68.18,85.73 67.11,85.02 66.39,83.94 66.14,82.68 66.39,81.41 67.11,80.34 68.18,79.62 69.45,79.37 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="72.69,79.3 79.37,79.3 79.37,79.37 79.24,80.66 78.87,81.9 78.26,83.04 77.43,84.05 76.43,84.87 75.29,85.48 74.05,85.86 72.76,85.98 72.69,85.98 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.6,82.68 92.6,79.3 99.21,79.3 99.21,86.05 92.6,86.05 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="105.83,82.68 105.83,79.3 112.51,79.3 112.51,86.05 105.83,86.05 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="112.37,85.98 112.37,79.37 115.75,79.37 117.01,79.62 118.09,80.34 118.8,81.41 119.06,82.68 118.8,83.94 118.09,85.02 117.01,85.73 115.75,85.98 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="125.67,79.3 132.28,79.3 132.28,82.68 132.03,83.94 131.31,85.02 130.24,85.73 128.98,85.98 127.71,85.73 126.64,85.02 125.92,83.94 125.67,82.68 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="145.51,82.68 145.51,79.3 152.13,79.3 152.13,86.05 145.51,86.05 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="19.84,89.29 19.59,90.56 18.87,91.63 17.8,92.35 16.54,92.6 15.27,92.35 14.2,91.63 13.48,90.56 13.23,89.29 13.48,88.03 14.2,86.95 15.27,86.24 16.54,85.98 17.8,86.24 18.87,86.95 19.59,88.03 19.84,89.29 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="39.69,92.66 33.07,92.66 33.07,89.29 33.32,88.03 34.04,86.95 35.11,86.24 36.38,85.98 37.64,86.24 38.72,86.95 39.43,88.03 39.69,89.29 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.6,85.98 92.6,92.6 89.29,92.6 88.03,92.35 86.95,91.63 86.24,90.56 85.98,89.29 86.24,88.03 86.95,86.95 88.03,86.24 89.29,85.98 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.53,89.29 92.53,85.92 99.28,85.92 99.28,92.66 92.53,92.66 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="99.15,89.29 99.15,85.98 105.89,85.98 105.89,92.6 99.15,92.6 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="105.76,85.92 112.44,85.92 112.44,85.98 112.31,87.27 111.94,88.52 111.33,89.66 110.5,90.66 109.5,91.48 108.36,92.09 107.12,92.47 105.83,92.6 105.76,92.6 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="138.9,85.98 138.9,92.6 135.59,92.6 134.32,92.35 133.25,91.63 132.54,90.56 132.28,89.29 132.54,88.03 133.25,86.95 134.32,86.24 135.59,85.98 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="138.83,89.29 138.83,85.98 145.58,85.98 145.58,92.66 138.83,92.66 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="145.45,85.92 152.13,85.92 152.13,85.98 152,87.27 151.62,88.52 151.01,89.66 150.19,90.66 149.19,91.48 148.04,92.09 146.8,92.47 145.51,92.6 145.45,92.6 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="26.46,95.91 26.2,97.17 25.49,98.24 24.42,98.96 23.15,99.21 21.88,98.96 20.81,98.24 20.09,97.17 19.84,95.91 20.09,94.64 20.81,93.57 21.88,92.85 23.15,92.6 24.42,92.85 25.49,93.57 26.2,94.64 26.46,95.91 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="33.07,92.53 39.75,92.53 39.75,99.21 39.69,99.21 38.39,99.09 37.15,98.71 36.01,98.1 35.01,97.28 34.19,96.27 33.57,95.13 33.2,93.89 33.07,92.6 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="39.62,99.21 39.62,92.6 42.99,92.6 44.26,92.85 45.33,93.57 46.05,94.64 46.3,95.91 46.05,97.17 45.33,98.24 44.26,98.96 42.99,99.21 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="59.53,95.91 59.28,97.17 58.56,98.24 57.49,98.96 56.22,99.21 54.95,98.96 53.88,98.24 53.17,97.17 52.91,95.91 53.17,94.64 53.88,93.57 54.95,92.85 56.22,92.6 57.49,92.85 58.56,93.57 59.28,94.64 59.53,95.91 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="66.14,99.28 66.14,99.21 66.27,97.92 66.65,96.68 67.26,95.54 68.08,94.54 69.08,93.71 70.22,93.1 71.47,92.73 72.76,92.6 72.82,92.6 72.82,99.28 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="72.69,99.21 72.69,92.6 76.06,92.6 77.33,92.85 78.4,93.57 79.12,94.64 79.37,95.91 79.12,97.17 78.4,98.24 77.33,98.96 76.06,99.21 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.6,95.91 92.6,92.53 99.21,92.53 99.21,99.28 92.6,99.28 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="119.06,99.28 112.44,99.28 112.44,95.91 112.69,94.64 113.41,93.57 114.48,92.85 115.75,92.6 117.01,92.85 118.09,93.57 118.8,94.64 119.06,95.91 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="138.9,92.53 145.51,92.53 145.51,95.91 145.26,97.17 144.54,98.24 143.47,98.96 142.2,99.21 140.94,98.96 139.87,98.24 139.15,97.17 138.9,95.91 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="66.14,102.52 66.14,99.15 72.76,99.15 72.76,105.89 66.14,105.89 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="85.98,102.52 85.73,103.79 85.02,104.86 83.94,105.58 82.68,105.83 81.41,105.58 80.34,104.86 79.62,103.79 79.37,102.52 79.62,101.25 80.34,100.18 81.41,99.46 82.68,99.21 83.94,99.46 85.02,100.18 85.73,101.25 85.98,102.52 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.6,99.15 99.21,99.15 99.21,102.52 98.96,103.79 98.24,104.86 97.17,105.58 95.91,105.83 94.64,105.58 93.57,104.86 92.85,103.79 92.6,102.52 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="112.44,99.15 119.06,99.15 119.06,102.52 118.8,103.79 118.09,104.86 117.01,105.58 115.75,105.83 114.48,105.58 113.41,104.86 112.69,103.79 112.44,102.52 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="138.9,102.52 138.65,103.79 137.93,104.86 136.86,105.58 135.59,105.83 134.32,105.58 133.25,104.86 132.54,103.79 132.28,102.52 132.54,101.25 133.25,100.18 134.32,99.46 135.59,99.21 136.86,99.46 137.93,100.18 138.65,101.25 138.9,102.52 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="66.14,105.76 72.76,105.76 72.76,109.13 72.5,110.4 71.79,111.47 70.71,112.19 69.45,112.44 68.18,112.19 67.11,111.47 66.39,110.4 66.14,109.13 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.6,109.13 92.35,110.4 91.63,111.47 90.56,112.19 89.29,112.44 88.03,112.19 86.95,111.47 86.24,110.4 85.98,109.13 86.24,107.87 86.95,106.8 88.03,106.08 89.29,105.83 90.56,106.08 91.63,106.8 92.35,107.87 92.6,109.13 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="105.83,109.13 105.58,110.4 104.86,111.47 103.79,112.19 102.52,112.44 101.25,112.19 100.18,111.47 99.46,110.4 99.21,109.13 99.46,107.87 100.18,106.8 101.25,106.08 102.52,105.83 103.79,106.08 104.86,106.8 105.58,107.87 105.83,109.13 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="119.06,112.51 119.06,112.44 119.18,111.15 119.56,109.91 120.17,108.77 120.99,107.76 121.99,106.94 123.14,106.33 124.38,105.95 125.67,105.83 125.74,105.83 125.74,112.51 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="125.6,112.44 125.6,105.83 128.98,105.83 130.24,106.08 131.31,106.8 132.03,107.87 132.28,109.13 132.03,110.4 131.31,111.47 130.24,112.19 128.98,112.44 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="145.51,105.83 145.51,112.44 142.2,112.44 140.94,112.19 139.87,111.47 139.15,110.4 138.9,109.13 139.15,107.87 139.87,106.8 140.94,106.08 142.2,105.83 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="145.45,105.83 145.51,105.83 146.8,105.95 148.04,106.33 149.19,106.94 150.19,107.76 151.01,108.77 151.62,109.91 152,111.15 152.13,112.44 152.13,112.51 145.45,112.51 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="72.76,119.12 72.76,119.06 72.88,117.76 73.26,116.52 73.87,115.38 74.69,114.38 75.7,113.56 76.84,112.94 78.08,112.57 79.37,112.44 79.44,112.44 79.44,119.12 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="79.3,112.44 79.37,112.44 80.66,112.57 81.9,112.94 83.04,113.56 84.05,114.38 84.87,115.38 85.48,116.52 85.86,117.76 85.98,119.06 85.98,119.12 79.3,119.12 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="119.06,112.44 119.06,119.06 115.75,119.06 114.48,118.8 113.41,118.09 112.69,117.01 112.44,115.75 112.69,114.48 113.41,113.41 114.48,112.69 115.75,112.44 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="118.99,115.75 118.99,112.37 125.67,112.37 125.67,119.12 118.99,119.12 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="138.9,119.12 132.28,119.12 132.28,115.75 132.54,114.48 133.25,113.41 134.32,112.69 135.59,112.44 136.86,112.69 137.93,113.41 138.65,114.48 138.9,115.75 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="145.51,112.37 152.13,112.37 152.13,115.75 151.87,117.01 151.16,118.09 150.08,118.8 148.82,119.06 147.55,118.8 146.48,118.09 145.76,117.01 145.51,115.75 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="66.14,125.74 66.14,125.67 66.27,124.38 66.65,123.14 67.26,121.99 68.08,120.99 69.08,120.17 70.22,119.56 71.47,119.18 72.76,119.06 72.82,119.06 72.82,125.74 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="72.69,122.36 72.69,118.99 79.44,118.99 79.44,125.74 72.69,125.74 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="79.3,122.36 79.3,118.99 86.05,118.99 86.05,125.67 79.3,125.67 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="85.92,119.06 85.98,119.06 87.27,119.18 88.52,119.56 89.66,120.17 90.66,120.99 91.48,121.99 92.09,123.14 92.47,124.38 92.6,125.67 92.6,125.74 85.92,125.74 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="105.83,125.74 99.21,125.74 99.21,122.36 99.46,121.1 100.18,120.02 101.25,119.31 102.52,119.06 103.79,119.31 104.86,120.02 105.58,121.1 105.83,122.36 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="119.06,118.99 125.74,118.99 125.74,125.67 125.67,125.67 124.38,125.54 123.14,125.17 121.99,124.55 120.99,123.73 120.17,122.73 119.56,121.59 119.18,120.35 119.06,119.06 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="125.6,122.36 125.6,119.06 132.35,119.06 132.35,125.74 125.6,125.74 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="132.22,122.36 132.22,118.99 138.9,118.99 138.9,125.74 132.22,125.74 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="66.14,128.98 66.14,125.6 72.82,125.6 72.82,132.35 66.14,132.35 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="72.69,128.98 72.69,125.6 79.37,125.6 79.37,132.35 72.69,132.35 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="85.98,125.6 92.66,125.6 92.66,132.28 92.6,132.28 91.31,132.16 90.07,131.78 88.92,131.17 87.92,130.35 87.1,129.34 86.49,128.2 86.11,126.96 85.98,125.67 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.53,128.98 92.53,125.67 99.28,125.67 99.28,132.35 92.53,132.35 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="99.15,128.98 99.15,125.6 105.89,125.6 105.89,132.28 99.15,132.28 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="105.76,128.98 105.76,125.67 112.51,125.67 112.51,132.35 105.76,132.35 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="112.37,125.67 112.44,125.67 113.73,125.8 114.97,126.17 116.12,126.78 117.12,127.61 117.94,128.61 118.55,129.75 118.93,130.99 119.06,132.28 119.06,132.35 112.37,132.35 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="125.67,128.98 125.67,125.6 132.35,125.6 132.35,132.35 125.67,132.35 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="132.22,128.98 132.22,125.6 138.9,125.6 138.9,132.35 132.22,132.35 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="66.14,135.59 66.14,132.22 72.82,132.22 72.82,138.96 66.14,138.96 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="72.69,132.22 79.37,132.22 79.37,132.28 79.24,133.57 78.87,134.81 78.26,135.96 77.43,136.96 76.43,137.78 75.29,138.39 74.05,138.77 72.76,138.9 72.69,138.9 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.6,135.59 92.6,132.22 99.21,132.22 99.21,138.96 92.6,138.96 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="105.83,135.59 105.83,132.22 112.51,132.22 112.51,138.96 105.83,138.96 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="112.37,135.59 112.37,132.22 119.06,132.22 119.06,138.96 112.37,138.96 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="125.67,132.22 132.35,132.22 132.35,138.9 132.28,138.9 130.99,138.77 129.75,138.39 128.61,137.78 127.61,136.96 126.78,135.96 126.17,134.81 125.8,133.57 125.67,132.28 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="132.22,135.59 132.22,132.22 138.9,132.22 138.9,138.96 132.22,138.96 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="66.14,142.2 66.14,138.83 72.76,138.83 72.76,145.58 66.14,145.58 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="79.37,145.58 79.37,145.51 79.5,144.22 79.87,142.98 80.48,141.84 81.31,140.83 82.31,140.01 83.45,139.4 84.69,139.02 85.98,138.9 86.05,138.9 86.05,145.58 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="85.92,142.2 85.92,138.9 92.66,138.9 92.66,145.51 85.92,145.51 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.53,142.2 92.53,138.83 99.28,138.83 99.28,145.58 92.53,145.58 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="99.15,142.2 99.15,138.9 105.89,138.9 105.89,145.51 99.15,145.51 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="105.76,142.2 105.76,138.83 112.51,138.83 112.51,145.51 105.76,145.51 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="112.37,142.2 112.37,138.83 119.12,138.83 119.12,145.58 112.37,145.58 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="118.99,145.51 118.99,138.9 122.36,138.9 123.63,139.15 124.7,139.87 125.42,140.94 125.67,142.2 125.42,143.47 124.7,144.54 123.63,145.26 122.36,145.51 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="132.28,142.2 132.28,138.83 138.96,138.83 138.96,145.58 132.28,145.58 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="138.83,145.51 138.83,138.9 142.2,138.9 143.47,139.15 144.54,139.87 145.26,140.94 145.51,142.2 145.26,143.47 144.54,144.54 143.47,145.26 142.2,145.51 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="66.14,145.45 72.82,145.45 72.82,152.13 72.76,152.13 71.47,152 70.22,151.62 69.08,151.01 68.08,150.19 67.26,149.19 66.65,148.04 66.27,146.8 66.14,145.51 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="72.69,148.82 72.69,145.51 79.44,145.51 79.44,152.13 72.69,152.13 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="79.3,145.45 85.98,145.45 85.98,145.51 85.86,146.8 85.48,148.04 84.87,149.19 84.05,150.19 83.04,151.01 81.9,151.62 80.66,152 79.37,152.13 79.3,152.13 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="92.6,145.45 99.21,145.45 99.21,148.82 98.96,150.08 98.24,151.16 97.17,151.87 95.91,152.13 94.64,151.87 93.57,151.16 92.85,150.08 92.6,148.82 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="112.44,145.45 119.06,145.45 119.06,148.82 118.8,150.08 118.09,151.16 117.01,151.87 115.75,152.13 114.48,151.87 113.41,151.16 112.69,150.08 112.44,148.82 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
          <polygon
            points="132.28,145.45 138.9,145.45 138.9,148.82 138.65,150.08 137.93,151.16 136.86,151.87 135.59,152.13 134.32,151.87 133.25,151.16 132.54,150.08 132.28,148.82 "
            style="fill:url(#gradiente980077bb02c4ed680664ae32429818f);"
          />
      `,
            },
            {
                value: 18,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(255,255,255,0);"
            shape-rendering="crispEdges"
          />
          <linearGradient
            id="gradient7c02ecf658b94d13a18cfb76a0b221ad"
            gradientUnits="userSpaceOnUse"
            x1="5.00216673346307"
            y1="71.7606518369089"
            x2="160.35215379266"
            y2="93.5936686892141"
          >
            <stop offset="0%" stop-color="#833231" />
            <stop offset="100%" stop-color="#2A525C" />
          </linearGradient>
          <polygon
            points="13.23,29.76 13.55,26.54 14.49,23.44 16.02,20.58 18.07,18.07 20.58,16.02 23.44,14.49 26.54,13.55 29.76,13.23 42.99,13.23 46.22,13.55 49.32,14.49 52.18,16.02 54.68,18.07 56.74,20.58 58.27,23.44 59.21,26.54 59.53,29.76 59.53,59.53 29.76,59.53 26.54,59.21 23.44,58.27 20.58,56.74 18.07,54.68 16.02,52.18 14.49,49.32 13.55,46.22 13.23,42.99 13.23,29.76 19.84,29.76 19.84,42.99 20.18,45.56 21.17,47.95 22.75,50.01 24.8,51.58 27.2,52.58 29.76,52.91 52.91,52.91 52.91,29.76 52.58,27.2 51.58,24.8 50.01,22.75 47.95,21.17 45.56,20.18 42.99,19.84 29.76,19.84 27.2,20.18 24.8,21.17 22.75,22.75 21.17,24.8 20.18,27.2 19.84,29.76 "
            style="fill:url(#gradient7c02ecf658b94d13a18cfb76a0b221ad);"
          />
          <polygon
            points="13.23,122.36 13.55,119.14 14.49,116.03 16.02,113.18 18.07,110.67 20.58,108.61 23.44,107.09 26.54,106.14 29.76,105.83 59.53,105.83 59.53,135.59 59.21,138.82 58.27,141.92 56.74,144.78 54.68,147.28 52.18,149.34 49.32,150.87 46.22,151.81 42.99,152.13 29.76,152.13 26.54,151.81 23.44,150.87 20.58,149.34 18.07,147.28 16.02,144.78 14.49,141.92 13.55,138.82 13.23,135.59 13.23,122.36 19.84,122.36 19.84,135.59 20.18,138.16 21.17,140.55 22.75,142.61 24.8,144.18 27.2,145.17 29.76,145.51 42.99,145.51 45.56,145.17 47.95,144.18 50.01,142.61 51.58,140.55 52.58,138.16 52.91,135.59 52.91,112.44 29.76,112.44 27.2,112.78 24.8,113.77 22.75,115.35 21.17,117.4 20.18,119.79 19.84,122.36 "
            style="fill:url(#gradient7c02ecf658b94d13a18cfb76a0b221ad);"
          />
          <polygon
            points="105.83,29.76 106.14,26.54 107.09,23.44 108.61,20.58 110.67,18.07 113.18,16.02 116.03,14.49 119.14,13.55 122.36,13.23 135.59,13.23 138.82,13.55 141.92,14.49 144.78,16.02 147.28,18.07 149.34,20.58 150.87,23.44 151.81,26.54 152.13,29.76 152.13,42.99 151.81,46.22 150.87,49.32 149.34,52.18 147.28,54.68 144.78,56.74 141.92,58.27 138.82,59.21 135.59,59.53 105.83,59.53 105.83,29.76 112.44,29.76 112.44,52.91 135.59,52.91 138.16,52.58 140.55,51.58 142.61,50.01 144.18,47.95 145.17,45.56 145.51,42.99 145.51,29.76 145.17,27.2 144.18,24.8 142.61,22.75 140.55,21.17 138.16,20.18 135.59,19.84 122.36,19.84 119.79,20.18 117.4,21.17 115.35,22.75 113.77,24.8 112.78,27.2 112.44,29.76 "
            style="fill:url(#gradient7c02ecf658b94d13a18cfb76a0b221ad);"
          />
          <pattern
            id="hatch8a2f2b565227486eb71f2fc5a259fae6"
            x="0"
            y="0"
            width="8"
            height="8"
            patternUnits="userSpaceOnUse"
          >
            <rect x="0" y="0" width="8" height="8" fill="#7D2A23" />
            <rect x="0" y="0" width="1" height="1" fill="#514473" />
            <rect x="1" y="0" width="1" height="1" fill="#514473" />
            <rect x="2" y="0" width="1" height="1" fill="#514473" />
            <rect x="3" y="0" width="1" height="1" fill="#514473" />
            <rect x="0" y="1" width="1" height="1" fill="#514473" />
            <rect x="1" y="1" width="1" height="1" fill="#514473" />
            <rect x="2" y="1" width="1" height="1" fill="#514473" />
            <rect x="3" y="1" width="1" height="1" fill="#514473" />
            <rect x="0" y="2" width="1" height="1" fill="#514473" />
            <rect x="1" y="2" width="1" height="1" fill="#514473" />
            <rect x="2" y="2" width="1" height="1" fill="#514473" />
            <rect x="3" y="2" width="1" height="1" fill="#514473" />
            <rect x="0" y="3" width="1" height="1" fill="#514473" />
            <rect x="1" y="3" width="1" height="1" fill="#514473" />
            <rect x="2" y="3" width="1" height="1" fill="#514473" />
            <rect x="3" y="3" width="1" height="1" fill="#514473" />
            <rect x="0" y="4" width="1" height="1" fill="#514473" />
            <rect x="2" y="4" width="1" height="1" fill="#514473" />
            <rect x="4" y="4" width="1" height="1" fill="#514473" />
            <rect x="6" y="4" width="1" height="1" fill="#514473" />
            <rect x="1" y="5" width="1" height="1" fill="#514473" />
            <rect x="3" y="5" width="1" height="1" fill="#514473" />
            <rect x="5" y="5" width="1" height="1" fill="#514473" />
            <rect x="7" y="5" width="1" height="1" fill="#514473" />
            <rect x="0" y="6" width="1" height="1" fill="#514473" />
            <rect x="2" y="6" width="1" height="1" fill="#514473" />
            <rect x="4" y="6" width="1" height="1" fill="#514473" />
            <rect x="6" y="6" width="1" height="1" fill="#514473" />
            <rect x="1" y="7" width="1" height="1" fill="#514473" />
            <rect x="3" y="7" width="1" height="1" fill="#514473" />
            <rect x="5" y="7" width="1" height="1" fill="#514473" />
            <rect x="7" y="7" width="1" height="1" fill="#514473" />
          </pattern>
          <polygon
            points="26.46,31.09 26.61,29.89 27.08,28.77 27.81,27.81 28.77,27.08 29.89,26.61 31.09,26.46 41.67,26.46 42.87,26.61 43.98,27.08 44.94,27.81 45.68,28.77 46.14,29.89 46.3,31.09 46.3,46.3 31.09,46.3 29.89,46.14 28.77,45.68 27.81,44.94 27.08,43.98 26.61,42.87 26.46,41.67 "
            style="fill:url(#hatch8a2f2b565227486eb71f2fc5a259fae6);"
          />
          <polygon
            points="26.46,123.69 26.61,122.49 27.08,121.37 27.81,120.41 28.77,119.68 29.89,119.21 31.09,119.06 46.3,119.06 46.3,134.27 46.14,135.47 45.68,136.58 44.94,137.54 43.98,138.28 42.87,138.74 41.67,138.9 31.09,138.9 29.89,138.74 28.77,138.28 27.81,137.54 27.08,136.58 26.61,135.47 26.46,134.27 "
            style="fill:url(#hatch8a2f2b565227486eb71f2fc5a259fae6);"
          />
          <polygon
            points="119.06,31.09 119.21,29.89 119.68,28.77 120.41,27.81 121.37,27.08 122.49,26.61 123.69,26.46 134.27,26.46 135.47,26.61 136.58,27.08 137.54,27.81 138.28,28.77 138.74,29.89 138.9,31.09 138.9,41.67 138.74,42.87 138.28,43.98 137.54,44.94 136.58,45.68 135.47,46.14 134.27,46.3 119.06,46.3 "
            style="fill:url(#hatch8a2f2b565227486eb71f2fc5a259fae6);"
          />
          <linearGradient
            id="gradient80618ad2d9ad494d91b68c40b4cb4fde"
            gradientUnits="userSpaceOnUse"
            x1="9.79838695230475"
            y1="78.6758608313476"
            x2="155.555933573818"
            y2="86.3146901635255"
          >
            <stop offset="0%" stop-color="#8A3900" />
            <stop offset="100%" stop-color="#89039C" />
          </linearGradient>
          <polygon
            points="79.37,15.84 79.67,15.48 81.42,15.08 82.21,13.29 82.58,13.23 82.88,13.39 83.74,14.98 85.46,15.34 85.98,15.77 85.79,16.2 84.36,17.13 84.86,18.78 84.79,19.35 84.43,19.48 82.58,18.29 81.22,19.45 80.83,19.48 80.56,19.15 80.89,17.16 79.54,16.2 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="85.98,15.84 86.28,15.48 88.03,15.08 88.83,13.29 89.19,13.23 89.49,13.39 90.35,14.98 92.07,15.34 92.6,15.77 92.4,16.2 90.98,17.13 91.47,18.78 91.41,19.35 91.04,19.48 89.19,18.29 87.84,19.45 87.44,19.48 87.17,19.15 87.51,17.16 86.15,16.2 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="92.6,15.84 92.9,15.48 94.65,15.08 95.44,13.29 95.81,13.23 96.1,13.39 96.96,14.98 98.68,15.34 99.21,15.77 99.01,16.2 97.59,17.13 98.09,18.78 98.02,19.35 97.66,19.48 95.81,18.29 94.45,19.45 94.05,19.48 93.79,19.15 94.12,17.16 92.76,16.2 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="66.14,22.46 66.44,22.09 68.19,21.69 68.99,19.91 69.35,19.84 69.65,20.01 70.51,21.6 72.23,21.96 72.76,22.39 72.56,22.82 71.14,23.74 71.63,25.4 71.57,25.96 71.2,26.09 69.35,24.9 67.99,26.06 67.6,26.09 67.33,25.76 67.66,23.78 66.31,22.82 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="72.76,22.46 73.05,22.09 74.81,21.69 75.6,19.91 75.96,19.84 76.26,20.01 77.12,21.6 78.84,21.96 79.37,22.39 79.17,22.82 77.75,23.74 78.25,25.4 78.18,25.96 77.82,26.09 75.96,24.9 74.61,26.06 74.21,26.09 73.95,25.76 74.28,23.78 72.92,22.82 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="79.37,22.46 79.67,22.09 81.42,21.69 82.21,19.91 82.58,19.84 82.88,20.01 83.74,21.6 85.46,21.96 85.98,22.39 85.79,22.82 84.36,23.74 84.86,25.4 84.79,25.96 84.43,26.09 82.58,24.9 81.22,26.06 80.83,26.09 80.56,25.76 80.89,23.78 79.54,22.82 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="92.6,22.46 92.9,22.09 94.65,21.69 95.44,19.91 95.81,19.84 96.1,20.01 96.96,21.6 98.68,21.96 99.21,22.39 99.01,22.82 97.59,23.74 98.09,25.4 98.02,25.96 97.66,26.09 95.81,24.9 94.45,26.06 94.05,26.09 93.79,25.76 94.12,23.78 92.76,22.82 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="79.37,29.07 79.67,28.71 81.42,28.31 82.21,26.52 82.58,26.46 82.88,26.62 83.74,28.21 85.46,28.57 85.98,29 85.79,29.43 84.36,30.36 84.86,32.01 84.79,32.57 84.43,32.71 82.58,31.52 81.22,32.67 80.83,32.71 80.56,32.38 80.89,30.39 79.54,29.43 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="85.98,29.07 86.28,28.71 88.03,28.31 88.83,26.52 89.19,26.46 89.49,26.62 90.35,28.21 92.07,28.57 92.6,29 92.4,29.43 90.98,30.36 91.47,32.01 91.41,32.57 91.04,32.71 89.19,31.52 87.84,32.67 87.44,32.71 87.17,32.38 87.51,30.39 86.15,29.43 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="92.6,29.07 92.9,28.71 94.65,28.31 95.44,26.52 95.81,26.46 96.1,26.62 96.96,28.21 98.68,28.57 99.21,29 99.01,29.43 97.59,30.36 98.09,32.01 98.02,32.57 97.66,32.71 95.81,31.52 94.45,32.67 94.05,32.71 93.79,32.38 94.12,30.39 92.76,29.43 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="66.14,35.68 66.44,35.32 68.19,34.92 68.99,33.14 69.35,33.07 69.65,33.24 70.51,34.82 72.23,35.19 72.76,35.62 72.56,36.05 71.14,36.97 71.63,38.63 71.57,39.19 71.2,39.32 69.35,38.13 67.99,39.29 67.6,39.32 67.33,38.99 67.66,37.01 66.31,36.05 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="72.76,35.68 73.05,35.32 74.81,34.92 75.6,33.14 75.96,33.07 76.26,33.24 77.12,34.82 78.84,35.19 79.37,35.62 79.17,36.05 77.75,36.97 78.25,38.63 78.18,39.19 77.82,39.32 75.96,38.13 74.61,39.29 74.21,39.32 73.95,38.99 74.28,37.01 72.92,36.05 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="92.6,35.68 92.9,35.32 94.65,34.92 95.44,33.14 95.81,33.07 96.1,33.24 96.96,34.82 98.68,35.19 99.21,35.62 99.01,36.05 97.59,36.97 98.09,38.63 98.02,39.19 97.66,39.32 95.81,38.13 94.45,39.29 94.05,39.32 93.79,38.99 94.12,37.01 92.76,36.05 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="72.76,42.3 73.05,41.93 74.81,41.54 75.6,39.75 75.96,39.69 76.26,39.85 77.12,41.44 78.84,41.8 79.37,42.23 79.17,42.66 77.75,43.59 78.25,45.24 78.18,45.8 77.82,45.94 75.96,44.74 74.61,45.9 74.21,45.94 73.95,45.6 74.28,43.62 72.92,42.66 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="92.6,42.3 92.9,41.93 94.65,41.54 95.44,39.75 95.81,39.69 96.1,39.85 96.96,41.44 98.68,41.8 99.21,42.23 99.01,42.66 97.59,43.59 98.09,45.24 98.02,45.8 97.66,45.94 95.81,44.74 94.45,45.9 94.05,45.94 93.79,45.6 94.12,43.62 92.76,42.66 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="66.14,48.91 66.44,48.55 68.19,48.15 68.99,46.37 69.35,46.3 69.65,46.46 70.51,48.05 72.23,48.42 72.76,48.85 72.56,49.28 71.14,50.2 71.63,51.86 71.57,52.42 71.2,52.55 69.35,51.36 67.99,52.52 67.6,52.55 67.33,52.22 67.66,50.23 66.31,49.28 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="85.98,48.91 86.28,48.55 88.03,48.15 88.83,46.37 89.19,46.3 89.49,46.46 90.35,48.05 92.07,48.42 92.6,48.85 92.4,49.28 90.98,50.2 91.47,51.86 91.41,52.42 91.04,52.55 89.19,51.36 87.84,52.52 87.44,52.55 87.17,52.22 87.51,50.23 86.15,49.28 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="66.14,55.53 66.44,55.16 68.19,54.77 68.99,52.98 69.35,52.91 69.65,53.08 70.51,54.67 72.23,55.03 72.76,55.46 72.56,55.89 71.14,56.82 71.63,58.47 71.57,59.03 71.2,59.16 69.35,57.97 67.99,59.13 67.6,59.16 67.33,58.83 67.66,56.85 66.31,55.89 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="79.37,55.53 79.67,55.16 81.42,54.77 82.21,52.98 82.58,52.91 82.88,53.08 83.74,54.67 85.46,55.03 85.98,55.46 85.79,55.89 84.36,56.82 84.86,58.47 84.79,59.03 84.43,59.16 82.58,57.97 81.22,59.13 80.83,59.16 80.56,58.83 80.89,56.85 79.54,55.89 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="92.6,55.53 92.9,55.16 94.65,54.77 95.44,52.98 95.81,52.91 96.1,53.08 96.96,54.67 98.68,55.03 99.21,55.46 99.01,55.89 97.59,56.82 98.09,58.47 98.02,59.03 97.66,59.16 95.81,57.97 94.45,59.13 94.05,59.16 93.79,58.83 94.12,56.85 92.76,55.89 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="72.76,62.14 73.05,61.78 74.81,61.38 75.6,59.59 75.96,59.53 76.26,59.69 77.12,61.28 78.84,61.64 79.37,62.07 79.17,62.5 77.75,63.43 78.25,65.08 78.18,65.65 77.82,65.78 75.96,64.59 74.61,65.74 74.21,65.78 73.95,65.45 74.28,63.46 72.92,62.5 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="13.23,68.75 13.53,68.39 15.28,67.99 16.07,66.21 16.44,66.14 16.73,66.31 17.59,67.89 19.31,68.26 19.84,68.69 19.64,69.12 18.22,70.04 18.72,71.7 18.65,72.26 18.29,72.39 16.44,71.2 15.08,72.36 14.68,72.39 14.42,72.06 14.75,70.08 13.39,69.12 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="19.84,68.75 20.14,68.39 21.89,67.99 22.69,66.21 23.05,66.14 23.35,66.31 24.21,67.89 25.93,68.26 26.46,68.69 26.26,69.12 24.84,70.04 25.33,71.7 25.27,72.26 24.9,72.39 23.05,71.2 21.69,72.36 21.3,72.39 21.03,72.06 21.36,70.08 20.01,69.12 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="26.46,68.75 26.75,68.39 28.51,67.99 29.3,66.21 29.66,66.14 29.96,66.31 30.82,67.89 32.54,68.26 33.07,68.69 32.87,69.12 31.45,70.04 31.95,71.7 31.88,72.26 31.52,72.39 29.66,71.2 28.31,72.36 27.91,72.39 27.65,72.06 27.98,70.08 26.62,69.12 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="33.07,68.75 33.37,68.39 35.12,67.99 35.91,66.21 36.28,66.14 36.58,66.31 37.44,67.89 39.16,68.26 39.69,68.69 39.49,69.12 38.06,70.04 38.56,71.7 38.49,72.26 38.13,72.39 36.28,71.2 34.92,72.36 34.53,72.39 34.26,72.06 34.59,70.08 33.24,69.12 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="39.69,68.75 39.98,68.39 41.74,67.99 42.53,66.21 42.89,66.14 43.19,66.31 44.05,67.89 45.77,68.26 46.3,68.69 46.1,69.12 44.68,70.04 45.17,71.7 45.11,72.26 44.74,72.39 42.89,71.2 41.54,72.36 41.14,72.39 40.88,72.06 41.21,70.08 39.85,69.12 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="52.91,68.75 53.21,68.39 54.96,67.99 55.76,66.21 56.12,66.14 56.42,66.31 57.28,67.89 59,68.26 59.53,68.69 59.33,69.12 57.91,70.04 58.4,71.7 58.34,72.26 57.97,72.39 56.12,71.2 54.77,72.36 54.37,72.39 54.1,72.06 54.43,70.08 53.08,69.12 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="59.53,68.75 59.83,68.39 61.58,67.99 62.37,66.21 62.74,66.14 63.03,66.31 63.89,67.89 65.61,68.26 66.14,68.69 65.94,69.12 64.52,70.04 65.02,71.7 64.95,72.26 64.59,72.39 62.74,71.2 61.38,72.36 60.98,72.39 60.72,72.06 61.05,70.08 59.69,69.12 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="66.14,68.75 66.44,68.39 68.19,67.99 68.99,66.21 69.35,66.14 69.65,66.31 70.51,67.89 72.23,68.26 72.76,68.69 72.56,69.12 71.14,70.04 71.63,71.7 71.57,72.26 71.2,72.39 69.35,71.2 67.99,72.36 67.6,72.39 67.33,72.06 67.66,70.08 66.31,69.12 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="85.98,68.75 86.28,68.39 88.03,67.99 88.83,66.21 89.19,66.14 89.49,66.31 90.35,67.89 92.07,68.26 92.6,68.69 92.4,69.12 90.98,70.04 91.47,71.7 91.41,72.26 91.04,72.39 89.19,71.2 87.84,72.36 87.44,72.39 87.17,72.06 87.51,70.08 86.15,69.12 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="99.21,68.75 99.51,68.39 101.26,67.99 102.06,66.21 102.42,66.14 102.72,66.31 103.58,67.89 105.3,68.26 105.83,68.69 105.63,69.12 104.21,70.04 104.7,71.7 104.64,72.26 104.27,72.39 102.42,71.2 101.06,72.36 100.67,72.39 100.4,72.06 100.73,70.08 99.38,69.12 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="112.44,68.75 112.74,68.39 114.49,67.99 115.29,66.21 115.65,66.14 115.95,66.31 116.81,67.89 118.53,68.26 119.06,68.69 118.86,69.12 117.43,70.04 117.93,71.7 117.86,72.26 117.5,72.39 115.65,71.2 114.29,72.36 113.9,72.39 113.63,72.06 113.96,70.08 112.61,69.12 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="125.67,68.75 125.97,68.39 127.72,67.99 128.51,66.21 128.88,66.14 129.17,66.31 130.03,67.89 131.75,68.26 132.28,68.69 132.09,69.12 130.66,70.04 131.16,71.7 131.09,72.26 130.73,72.39 128.88,71.2 127.52,72.36 127.12,72.39 126.86,72.06 127.19,70.08 125.83,69.12 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="138.9,68.75 139.2,68.39 140.95,67.99 141.74,66.21 142.11,66.14 142.4,66.31 143.26,67.89 144.98,68.26 145.51,68.69 145.31,69.12 143.89,70.04 144.39,71.7 144.32,72.26 143.96,72.39 142.11,71.2 140.75,72.36 140.35,72.39 140.09,72.06 140.42,70.08 139.06,69.12 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="13.23,75.37 13.53,75 15.28,74.61 16.07,72.82 16.44,72.76 16.73,72.92 17.59,74.51 19.31,74.87 19.84,75.3 19.64,75.73 18.22,76.66 18.72,78.31 18.65,78.87 18.29,79.01 16.44,77.82 15.08,78.97 14.68,79.01 14.42,78.68 14.75,76.69 13.39,75.73 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="19.84,75.37 20.14,75 21.89,74.61 22.69,72.82 23.05,72.76 23.35,72.92 24.21,74.51 25.93,74.87 26.46,75.3 26.26,75.73 24.84,76.66 25.33,78.31 25.27,78.87 24.9,79.01 23.05,77.82 21.69,78.97 21.3,79.01 21.03,78.68 21.36,76.69 20.01,75.73 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="26.46,75.37 26.75,75 28.51,74.61 29.3,72.82 29.66,72.76 29.96,72.92 30.82,74.51 32.54,74.87 33.07,75.3 32.87,75.73 31.45,76.66 31.95,78.31 31.88,78.87 31.52,79.01 29.66,77.82 28.31,78.97 27.91,79.01 27.65,78.68 27.98,76.69 26.62,75.73 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="46.3,75.37 46.6,75 48.35,74.61 49.14,72.82 49.51,72.76 49.8,72.92 50.66,74.51 52.38,74.87 52.91,75.3 52.71,75.73 51.29,76.66 51.79,78.31 51.72,78.87 51.36,79.01 49.51,77.82 48.15,78.97 47.75,79.01 47.49,78.68 47.82,76.69 46.46,75.73 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="59.53,75.37 59.83,75 61.58,74.61 62.37,72.82 62.74,72.76 63.03,72.92 63.89,74.51 65.61,74.87 66.14,75.3 65.94,75.73 64.52,76.66 65.02,78.31 64.95,78.87 64.59,79.01 62.74,77.82 61.38,78.97 60.98,79.01 60.72,78.68 61.05,76.69 59.69,75.73 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="72.76,75.37 73.05,75 74.81,74.61 75.6,72.82 75.96,72.76 76.26,72.92 77.12,74.51 78.84,74.87 79.37,75.3 79.17,75.73 77.75,76.66 78.25,78.31 78.18,78.87 77.82,79.01 75.96,77.82 74.61,78.97 74.21,79.01 73.95,78.68 74.28,76.69 72.92,75.73 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="85.98,75.37 86.28,75 88.03,74.61 88.83,72.82 89.19,72.76 89.49,72.92 90.35,74.51 92.07,74.87 92.6,75.3 92.4,75.73 90.98,76.66 91.47,78.31 91.41,78.87 91.04,79.01 89.19,77.82 87.84,78.97 87.44,79.01 87.17,78.68 87.51,76.69 86.15,75.73 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="92.6,75.37 92.9,75 94.65,74.61 95.44,72.82 95.81,72.76 96.1,72.92 96.96,74.51 98.68,74.87 99.21,75.3 99.01,75.73 97.59,76.66 98.09,78.31 98.02,78.87 97.66,79.01 95.81,77.82 94.45,78.97 94.05,79.01 93.79,78.68 94.12,76.69 92.76,75.73 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="99.21,75.37 99.51,75 101.26,74.61 102.06,72.82 102.42,72.76 102.72,72.92 103.58,74.51 105.3,74.87 105.83,75.3 105.63,75.73 104.21,76.66 104.7,78.31 104.64,78.87 104.27,79.01 102.42,77.82 101.06,78.97 100.67,79.01 100.4,78.68 100.73,76.69 99.38,75.73 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="105.83,75.37 106.12,75 107.88,74.61 108.67,72.82 109.03,72.76 109.33,72.92 110.19,74.51 111.91,74.87 112.44,75.3 112.24,75.73 110.82,76.66 111.32,78.31 111.25,78.87 110.89,79.01 109.03,77.82 107.68,78.97 107.28,79.01 107.02,78.68 107.35,76.69 105.99,75.73 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="125.67,75.37 125.97,75 127.72,74.61 128.51,72.82 128.88,72.76 129.17,72.92 130.03,74.51 131.75,74.87 132.28,75.3 132.09,75.73 130.66,76.66 131.16,78.31 131.09,78.87 130.73,79.01 128.88,77.82 127.52,78.97 127.12,79.01 126.86,78.68 127.19,76.69 125.83,75.73 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="132.28,75.37 132.58,75 134.33,74.61 135.13,72.82 135.49,72.76 135.79,72.92 136.65,74.51 138.37,74.87 138.9,75.3 138.7,75.73 137.28,76.66 137.77,78.31 137.71,78.87 137.34,79.01 135.49,77.82 134.14,78.97 133.74,79.01 133.47,78.68 133.8,76.69 132.45,75.73 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="138.9,75.37 139.2,75 140.95,74.61 141.74,72.82 142.11,72.76 142.4,72.92 143.26,74.51 144.98,74.87 145.51,75.3 145.31,75.73 143.89,76.66 144.39,78.31 144.32,78.87 143.96,79.01 142.11,77.82 140.75,78.97 140.35,79.01 140.09,78.68 140.42,76.69 139.06,75.73 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="145.51,75.37 145.81,75 147.56,74.61 148.36,72.82 148.72,72.76 149.02,72.92 149.88,74.51 151.6,74.87 152.13,75.3 151.93,75.73 150.51,76.66 151,78.31 150.94,78.87 150.57,79.01 148.72,77.82 147.36,78.97 146.97,79.01 146.7,78.68 147.03,76.69 145.68,75.73 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="26.46,81.98 26.75,81.62 28.51,81.22 29.3,79.44 29.66,79.37 29.96,79.54 30.82,81.12 32.54,81.49 33.07,81.92 32.87,82.35 31.45,83.27 31.95,84.93 31.88,85.49 31.52,85.62 29.66,84.43 28.31,85.59 27.91,85.62 27.65,85.29 27.98,83.31 26.62,82.35 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="39.69,81.98 39.98,81.62 41.74,81.22 42.53,79.44 42.89,79.37 43.19,79.54 44.05,81.12 45.77,81.49 46.3,81.92 46.1,82.35 44.68,83.27 45.17,84.93 45.11,85.49 44.74,85.62 42.89,84.43 41.54,85.59 41.14,85.62 40.88,85.29 41.21,83.31 39.85,82.35 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="46.3,81.98 46.6,81.62 48.35,81.22 49.14,79.44 49.51,79.37 49.8,79.54 50.66,81.12 52.38,81.49 52.91,81.92 52.71,82.35 51.29,83.27 51.79,84.93 51.72,85.49 51.36,85.62 49.51,84.43 48.15,85.59 47.75,85.62 47.49,85.29 47.82,83.31 46.46,82.35 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="52.91,81.98 53.21,81.62 54.96,81.22 55.76,79.44 56.12,79.37 56.42,79.54 57.28,81.12 59,81.49 59.53,81.92 59.33,82.35 57.91,83.27 58.4,84.93 58.34,85.49 57.97,85.62 56.12,84.43 54.77,85.59 54.37,85.62 54.1,85.29 54.43,83.31 53.08,82.35 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="66.14,81.98 66.44,81.62 68.19,81.22 68.99,79.44 69.35,79.37 69.65,79.54 70.51,81.12 72.23,81.49 72.76,81.92 72.56,82.35 71.14,83.27 71.63,84.93 71.57,85.49 71.2,85.62 69.35,84.43 67.99,85.59 67.6,85.62 67.33,85.29 67.66,83.31 66.31,82.35 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="72.76,81.98 73.05,81.62 74.81,81.22 75.6,79.44 75.96,79.37 76.26,79.54 77.12,81.12 78.84,81.49 79.37,81.92 79.17,82.35 77.75,83.27 78.25,84.93 78.18,85.49 77.82,85.62 75.96,84.43 74.61,85.59 74.21,85.62 73.95,85.29 74.28,83.31 72.92,82.35 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="92.6,81.98 92.9,81.62 94.65,81.22 95.44,79.44 95.81,79.37 96.1,79.54 96.96,81.12 98.68,81.49 99.21,81.92 99.01,82.35 97.59,83.27 98.09,84.93 98.02,85.49 97.66,85.62 95.81,84.43 94.45,85.59 94.05,85.62 93.79,85.29 94.12,83.31 92.76,82.35 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="105.83,81.98 106.12,81.62 107.88,81.22 108.67,79.44 109.03,79.37 109.33,79.54 110.19,81.12 111.91,81.49 112.44,81.92 112.24,82.35 110.82,83.27 111.32,84.93 111.25,85.49 110.89,85.62 109.03,84.43 107.68,85.59 107.28,85.62 107.02,85.29 107.35,83.31 105.99,82.35 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="112.44,81.98 112.74,81.62 114.49,81.22 115.29,79.44 115.65,79.37 115.95,79.54 116.81,81.12 118.53,81.49 119.06,81.92 118.86,82.35 117.43,83.27 117.93,84.93 117.86,85.49 117.5,85.62 115.65,84.43 114.29,85.59 113.9,85.62 113.63,85.29 113.96,83.31 112.61,82.35 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="125.67,81.98 125.97,81.62 127.72,81.22 128.51,79.44 128.88,79.37 129.17,79.54 130.03,81.12 131.75,81.49 132.28,81.92 132.09,82.35 130.66,83.27 131.16,84.93 131.09,85.49 130.73,85.62 128.88,84.43 127.52,85.59 127.12,85.62 126.86,85.29 127.19,83.31 125.83,82.35 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="145.51,81.98 145.81,81.62 147.56,81.22 148.36,79.44 148.72,79.37 149.02,79.54 149.88,81.12 151.6,81.49 152.13,81.92 151.93,82.35 150.51,83.27 151,84.93 150.94,85.49 150.57,85.62 148.72,84.43 147.36,85.59 146.97,85.62 146.7,85.29 147.03,83.31 145.68,82.35 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="13.23,88.6 13.53,88.23 15.28,87.84 16.07,86.05 16.44,85.98 16.73,86.15 17.59,87.74 19.31,88.1 19.84,88.53 19.64,88.96 18.22,89.89 18.72,91.54 18.65,92.1 18.29,92.23 16.44,91.04 15.08,92.2 14.68,92.23 14.42,91.9 14.75,89.92 13.39,88.96 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="33.07,88.6 33.37,88.23 35.12,87.84 35.91,86.05 36.28,85.98 36.58,86.15 37.44,87.74 39.16,88.1 39.69,88.53 39.49,88.96 38.06,89.89 38.56,91.54 38.49,92.1 38.13,92.23 36.28,91.04 34.92,92.2 34.53,92.23 34.26,91.9 34.59,89.92 33.24,88.96 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="85.98,88.6 86.28,88.23 88.03,87.84 88.83,86.05 89.19,85.98 89.49,86.15 90.35,87.74 92.07,88.1 92.6,88.53 92.4,88.96 90.98,89.89 91.47,91.54 91.41,92.1 91.04,92.23 89.19,91.04 87.84,92.2 87.44,92.23 87.17,91.9 87.51,89.92 86.15,88.96 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="92.6,88.6 92.9,88.23 94.65,87.84 95.44,86.05 95.81,85.98 96.1,86.15 96.96,87.74 98.68,88.1 99.21,88.53 99.01,88.96 97.59,89.89 98.09,91.54 98.02,92.1 97.66,92.23 95.81,91.04 94.45,92.2 94.05,92.23 93.79,91.9 94.12,89.92 92.76,88.96 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="99.21,88.6 99.51,88.23 101.26,87.84 102.06,86.05 102.42,85.98 102.72,86.15 103.58,87.74 105.3,88.1 105.83,88.53 105.63,88.96 104.21,89.89 104.7,91.54 104.64,92.1 104.27,92.23 102.42,91.04 101.06,92.2 100.67,92.23 100.4,91.9 100.73,89.92 99.38,88.96 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="105.83,88.6 106.12,88.23 107.88,87.84 108.67,86.05 109.03,85.98 109.33,86.15 110.19,87.74 111.91,88.1 112.44,88.53 112.24,88.96 110.82,89.89 111.32,91.54 111.25,92.1 110.89,92.23 109.03,91.04 107.68,92.2 107.28,92.23 107.02,91.9 107.35,89.92 105.99,88.96 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="132.28,88.6 132.58,88.23 134.33,87.84 135.13,86.05 135.49,85.98 135.79,86.15 136.65,87.74 138.37,88.1 138.9,88.53 138.7,88.96 137.28,89.89 137.77,91.54 137.71,92.1 137.34,92.23 135.49,91.04 134.14,92.2 133.74,92.23 133.47,91.9 133.8,89.92 132.45,88.96 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="138.9,88.6 139.2,88.23 140.95,87.84 141.74,86.05 142.11,85.98 142.4,86.15 143.26,87.74 144.98,88.1 145.51,88.53 145.31,88.96 143.89,89.89 144.39,91.54 144.32,92.1 143.96,92.23 142.11,91.04 140.75,92.2 140.35,92.23 140.09,91.9 140.42,89.92 139.06,88.96 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="145.51,88.6 145.81,88.23 147.56,87.84 148.36,86.05 148.72,85.98 149.02,86.15 149.88,87.74 151.6,88.1 152.13,88.53 151.93,88.96 150.51,89.89 151,91.54 150.94,92.1 150.57,92.23 148.72,91.04 147.36,92.2 146.97,92.23 146.7,91.9 147.03,89.92 145.68,88.96 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="19.84,95.21 20.14,94.85 21.89,94.45 22.69,92.66 23.05,92.6 23.35,92.76 24.21,94.35 25.93,94.71 26.46,95.14 26.26,95.57 24.84,96.5 25.33,98.15 25.27,98.72 24.9,98.85 23.05,97.66 21.69,98.82 21.3,98.85 21.03,98.52 21.36,96.53 20.01,95.57 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="33.07,95.21 33.37,94.85 35.12,94.45 35.91,92.66 36.28,92.6 36.58,92.76 37.44,94.35 39.16,94.71 39.69,95.14 39.49,95.57 38.06,96.5 38.56,98.15 38.49,98.72 38.13,98.85 36.28,97.66 34.92,98.82 34.53,98.85 34.26,98.52 34.59,96.53 33.24,95.57 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="39.69,95.21 39.98,94.85 41.74,94.45 42.53,92.66 42.89,92.6 43.19,92.76 44.05,94.35 45.77,94.71 46.3,95.14 46.1,95.57 44.68,96.5 45.17,98.15 45.11,98.72 44.74,98.85 42.89,97.66 41.54,98.82 41.14,98.85 40.88,98.52 41.21,96.53 39.85,95.57 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="52.91,95.21 53.21,94.85 54.96,94.45 55.76,92.66 56.12,92.6 56.42,92.76 57.28,94.35 59,94.71 59.53,95.14 59.33,95.57 57.91,96.5 58.4,98.15 58.34,98.72 57.97,98.85 56.12,97.66 54.77,98.82 54.37,98.85 54.1,98.52 54.43,96.53 53.08,95.57 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="66.14,95.21 66.44,94.85 68.19,94.45 68.99,92.66 69.35,92.6 69.65,92.76 70.51,94.35 72.23,94.71 72.76,95.14 72.56,95.57 71.14,96.5 71.63,98.15 71.57,98.72 71.2,98.85 69.35,97.66 67.99,98.82 67.6,98.85 67.33,98.52 67.66,96.53 66.31,95.57 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="72.76,95.21 73.05,94.85 74.81,94.45 75.6,92.66 75.96,92.6 76.26,92.76 77.12,94.35 78.84,94.71 79.37,95.14 79.17,95.57 77.75,96.5 78.25,98.15 78.18,98.72 77.82,98.85 75.96,97.66 74.61,98.82 74.21,98.85 73.95,98.52 74.28,96.53 72.92,95.57 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="92.6,95.21 92.9,94.85 94.65,94.45 95.44,92.66 95.81,92.6 96.1,92.76 96.96,94.35 98.68,94.71 99.21,95.14 99.01,95.57 97.59,96.5 98.09,98.15 98.02,98.72 97.66,98.85 95.81,97.66 94.45,98.82 94.05,98.85 93.79,98.52 94.12,96.53 92.76,95.57 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="112.44,95.21 112.74,94.85 114.49,94.45 115.29,92.66 115.65,92.6 115.95,92.76 116.81,94.35 118.53,94.71 119.06,95.14 118.86,95.57 117.43,96.5 117.93,98.15 117.86,98.72 117.5,98.85 115.65,97.66 114.29,98.82 113.9,98.85 113.63,98.52 113.96,96.53 112.61,95.57 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="138.9,95.21 139.2,94.85 140.95,94.45 141.74,92.66 142.11,92.6 142.4,92.76 143.26,94.35 144.98,94.71 145.51,95.14 145.31,95.57 143.89,96.5 144.39,98.15 144.32,98.72 143.96,98.85 142.11,97.66 140.75,98.82 140.35,98.85 140.09,98.52 140.42,96.53 139.06,95.57 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="66.14,101.83 66.44,101.46 68.19,101.06 68.99,99.28 69.35,99.21 69.65,99.38 70.51,100.97 72.23,101.33 72.76,101.76 72.56,102.19 71.14,103.11 71.63,104.77 71.57,105.33 71.2,105.46 69.35,104.27 67.99,105.43 67.6,105.46 67.33,105.13 67.66,103.15 66.31,102.19 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="79.37,101.83 79.67,101.46 81.42,101.06 82.21,99.28 82.58,99.21 82.88,99.38 83.74,100.97 85.46,101.33 85.98,101.76 85.79,102.19 84.36,103.11 84.86,104.77 84.79,105.33 84.43,105.46 82.58,104.27 81.22,105.43 80.83,105.46 80.56,105.13 80.89,103.15 79.54,102.19 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="92.6,101.83 92.9,101.46 94.65,101.06 95.44,99.28 95.81,99.21 96.1,99.38 96.96,100.97 98.68,101.33 99.21,101.76 99.01,102.19 97.59,103.11 98.09,104.77 98.02,105.33 97.66,105.46 95.81,104.27 94.45,105.43 94.05,105.46 93.79,105.13 94.12,103.15 92.76,102.19 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="112.44,101.83 112.74,101.46 114.49,101.06 115.29,99.28 115.65,99.21 115.95,99.38 116.81,100.97 118.53,101.33 119.06,101.76 118.86,102.19 117.43,103.11 117.93,104.77 117.86,105.33 117.5,105.46 115.65,104.27 114.29,105.43 113.9,105.46 113.63,105.13 113.96,103.15 112.61,102.19 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="132.28,101.83 132.58,101.46 134.33,101.06 135.13,99.28 135.49,99.21 135.79,99.38 136.65,100.97 138.37,101.33 138.9,101.76 138.7,102.19 137.28,103.11 137.77,104.77 137.71,105.33 137.34,105.46 135.49,104.27 134.14,105.43 133.74,105.46 133.47,105.13 133.8,103.15 132.45,102.19 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="66.14,108.44 66.44,108.08 68.19,107.68 68.99,105.89 69.35,105.83 69.65,105.99 70.51,107.58 72.23,107.94 72.76,108.37 72.56,108.8 71.14,109.73 71.63,111.38 71.57,111.94 71.2,112.08 69.35,110.89 67.99,112.04 67.6,112.08 67.33,111.75 67.66,109.76 66.31,108.8 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="85.98,108.44 86.28,108.08 88.03,107.68 88.83,105.89 89.19,105.83 89.49,105.99 90.35,107.58 92.07,107.94 92.6,108.37 92.4,108.8 90.98,109.73 91.47,111.38 91.41,111.94 91.04,112.08 89.19,110.89 87.84,112.04 87.44,112.08 87.17,111.75 87.51,109.76 86.15,108.8 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="99.21,108.44 99.51,108.08 101.26,107.68 102.06,105.89 102.42,105.83 102.72,105.99 103.58,107.58 105.3,107.94 105.83,108.37 105.63,108.8 104.21,109.73 104.7,111.38 104.64,111.94 104.27,112.08 102.42,110.89 101.06,112.04 100.67,112.08 100.4,111.75 100.73,109.76 99.38,108.8 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="119.06,108.44 119.35,108.08 121.11,107.68 121.9,105.89 122.26,105.83 122.56,105.99 123.42,107.58 125.14,107.94 125.67,108.37 125.47,108.8 124.05,109.73 124.54,111.38 124.48,111.94 124.11,112.08 122.26,110.89 120.91,112.04 120.51,112.08 120.25,111.75 120.58,109.76 119.22,108.8 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="125.67,108.44 125.97,108.08 127.72,107.68 128.51,105.89 128.88,105.83 129.17,105.99 130.03,107.58 131.75,107.94 132.28,108.37 132.09,108.8 130.66,109.73 131.16,111.38 131.09,111.94 130.73,112.08 128.88,110.89 127.52,112.04 127.12,112.08 126.86,111.75 127.19,109.76 125.83,108.8 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="138.9,108.44 139.2,108.08 140.95,107.68 141.74,105.89 142.11,105.83 142.4,105.99 143.26,107.58 144.98,107.94 145.51,108.37 145.31,108.8 143.89,109.73 144.39,111.38 144.32,111.94 143.96,112.08 142.11,110.89 140.75,112.04 140.35,112.08 140.09,111.75 140.42,109.76 139.06,108.8 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="145.51,108.44 145.81,108.08 147.56,107.68 148.36,105.89 148.72,105.83 149.02,105.99 149.88,107.58 151.6,107.94 152.13,108.37 151.93,108.8 150.51,109.73 151,111.38 150.94,111.94 150.57,112.08 148.72,110.89 147.36,112.04 146.97,112.08 146.7,111.75 147.03,109.76 145.68,108.8 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="72.76,115.05 73.05,114.69 74.81,114.29 75.6,112.51 75.96,112.44 76.26,112.61 77.12,114.19 78.84,114.56 79.37,114.99 79.17,115.42 77.75,116.34 78.25,118 78.18,118.56 77.82,118.69 75.96,117.5 74.61,118.66 74.21,118.69 73.95,118.36 74.28,116.38 72.92,115.42 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="79.37,115.05 79.67,114.69 81.42,114.29 82.21,112.51 82.58,112.44 82.88,112.61 83.74,114.19 85.46,114.56 85.98,114.99 85.79,115.42 84.36,116.34 84.86,118 84.79,118.56 84.43,118.69 82.58,117.5 81.22,118.66 80.83,118.69 80.56,118.36 80.89,116.38 79.54,115.42 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="112.44,115.05 112.74,114.69 114.49,114.29 115.29,112.51 115.65,112.44 115.95,112.61 116.81,114.19 118.53,114.56 119.06,114.99 118.86,115.42 117.43,116.34 117.93,118 117.86,118.56 117.5,118.69 115.65,117.5 114.29,118.66 113.9,118.69 113.63,118.36 113.96,116.38 112.61,115.42 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="119.06,115.05 119.35,114.69 121.11,114.29 121.9,112.51 122.26,112.44 122.56,112.61 123.42,114.19 125.14,114.56 125.67,114.99 125.47,115.42 124.05,116.34 124.54,118 124.48,118.56 124.11,118.69 122.26,117.5 120.91,118.66 120.51,118.69 120.25,118.36 120.58,116.38 119.22,115.42 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="132.28,115.05 132.58,114.69 134.33,114.29 135.13,112.51 135.49,112.44 135.79,112.61 136.65,114.19 138.37,114.56 138.9,114.99 138.7,115.42 137.28,116.34 137.77,118 137.71,118.56 137.34,118.69 135.49,117.5 134.14,118.66 133.74,118.69 133.47,118.36 133.8,116.38 132.45,115.42 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="145.51,115.05 145.81,114.69 147.56,114.29 148.36,112.51 148.72,112.44 149.02,112.61 149.88,114.19 151.6,114.56 152.13,114.99 151.93,115.42 150.51,116.34 151,118 150.94,118.56 150.57,118.69 148.72,117.5 147.36,118.66 146.97,118.69 146.7,118.36 147.03,116.38 145.68,115.42 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="66.14,121.67 66.44,121.3 68.19,120.91 68.99,119.12 69.35,119.06 69.65,119.22 70.51,120.81 72.23,121.17 72.76,121.6 72.56,122.03 71.14,122.96 71.63,124.61 71.57,125.17 71.2,125.31 69.35,124.11 67.99,125.27 67.6,125.31 67.33,124.97 67.66,122.99 66.31,122.03 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="72.76,121.67 73.05,121.3 74.81,120.91 75.6,119.12 75.96,119.06 76.26,119.22 77.12,120.81 78.84,121.17 79.37,121.6 79.17,122.03 77.75,122.96 78.25,124.61 78.18,125.17 77.82,125.31 75.96,124.11 74.61,125.27 74.21,125.31 73.95,124.97 74.28,122.99 72.92,122.03 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="79.37,121.67 79.67,121.3 81.42,120.91 82.21,119.12 82.58,119.06 82.88,119.22 83.74,120.81 85.46,121.17 85.98,121.6 85.79,122.03 84.36,122.96 84.86,124.61 84.79,125.17 84.43,125.31 82.58,124.11 81.22,125.27 80.83,125.31 80.56,124.97 80.89,122.99 79.54,122.03 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="85.98,121.67 86.28,121.3 88.03,120.91 88.83,119.12 89.19,119.06 89.49,119.22 90.35,120.81 92.07,121.17 92.6,121.6 92.4,122.03 90.98,122.96 91.47,124.61 91.41,125.17 91.04,125.31 89.19,124.11 87.84,125.27 87.44,125.31 87.17,124.97 87.51,122.99 86.15,122.03 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="99.21,121.67 99.51,121.3 101.26,120.91 102.06,119.12 102.42,119.06 102.72,119.22 103.58,120.81 105.3,121.17 105.83,121.6 105.63,122.03 104.21,122.96 104.7,124.61 104.64,125.17 104.27,125.31 102.42,124.11 101.06,125.27 100.67,125.31 100.4,124.97 100.73,122.99 99.38,122.03 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="119.06,121.67 119.35,121.3 121.11,120.91 121.9,119.12 122.26,119.06 122.56,119.22 123.42,120.81 125.14,121.17 125.67,121.6 125.47,122.03 124.05,122.96 124.54,124.61 124.48,125.17 124.11,125.31 122.26,124.11 120.91,125.27 120.51,125.31 120.25,124.97 120.58,122.99 119.22,122.03 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="125.67,121.67 125.97,121.3 127.72,120.91 128.51,119.12 128.88,119.06 129.17,119.22 130.03,120.81 131.75,121.17 132.28,121.6 132.09,122.03 130.66,122.96 131.16,124.61 131.09,125.17 130.73,125.31 128.88,124.11 127.52,125.27 127.12,125.31 126.86,124.97 127.19,122.99 125.83,122.03 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="132.28,121.67 132.58,121.3 134.33,120.91 135.13,119.12 135.49,119.06 135.79,119.22 136.65,120.81 138.37,121.17 138.9,121.6 138.7,122.03 137.28,122.96 137.77,124.61 137.71,125.17 137.34,125.31 135.49,124.11 134.14,125.27 133.74,125.31 133.47,124.97 133.8,122.99 132.45,122.03 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="66.14,128.28 66.44,127.92 68.19,127.52 68.99,125.74 69.35,125.67 69.65,125.83 70.51,127.42 72.23,127.79 72.76,128.22 72.56,128.65 71.14,129.57 71.63,131.23 71.57,131.79 71.2,131.92 69.35,130.73 67.99,131.89 67.6,131.92 67.33,131.59 67.66,129.6 66.31,128.65 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="72.76,128.28 73.05,127.92 74.81,127.52 75.6,125.74 75.96,125.67 76.26,125.83 77.12,127.42 78.84,127.79 79.37,128.22 79.17,128.65 77.75,129.57 78.25,131.23 78.18,131.79 77.82,131.92 75.96,130.73 74.61,131.89 74.21,131.92 73.95,131.59 74.28,129.6 72.92,128.65 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="85.98,128.28 86.28,127.92 88.03,127.52 88.83,125.74 89.19,125.67 89.49,125.83 90.35,127.42 92.07,127.79 92.6,128.22 92.4,128.65 90.98,129.57 91.47,131.23 91.41,131.79 91.04,131.92 89.19,130.73 87.84,131.89 87.44,131.92 87.17,131.59 87.51,129.6 86.15,128.65 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="92.6,128.28 92.9,127.92 94.65,127.52 95.44,125.74 95.81,125.67 96.1,125.83 96.96,127.42 98.68,127.79 99.21,128.22 99.01,128.65 97.59,129.57 98.09,131.23 98.02,131.79 97.66,131.92 95.81,130.73 94.45,131.89 94.05,131.92 93.79,131.59 94.12,129.6 92.76,128.65 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="99.21,128.28 99.51,127.92 101.26,127.52 102.06,125.74 102.42,125.67 102.72,125.83 103.58,127.42 105.3,127.79 105.83,128.22 105.63,128.65 104.21,129.57 104.7,131.23 104.64,131.79 104.27,131.92 102.42,130.73 101.06,131.89 100.67,131.92 100.4,131.59 100.73,129.6 99.38,128.65 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="105.83,128.28 106.12,127.92 107.88,127.52 108.67,125.74 109.03,125.67 109.33,125.83 110.19,127.42 111.91,127.79 112.44,128.22 112.24,128.65 110.82,129.57 111.32,131.23 111.25,131.79 110.89,131.92 109.03,130.73 107.68,131.89 107.28,131.92 107.02,131.59 107.35,129.6 105.99,128.65 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="112.44,128.28 112.74,127.92 114.49,127.52 115.29,125.74 115.65,125.67 115.95,125.83 116.81,127.42 118.53,127.79 119.06,128.22 118.86,128.65 117.43,129.57 117.93,131.23 117.86,131.79 117.5,131.92 115.65,130.73 114.29,131.89 113.9,131.92 113.63,131.59 113.96,129.6 112.61,128.65 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="125.67,128.28 125.97,127.92 127.72,127.52 128.51,125.74 128.88,125.67 129.17,125.83 130.03,127.42 131.75,127.79 132.28,128.22 132.09,128.65 130.66,129.57 131.16,131.23 131.09,131.79 130.73,131.92 128.88,130.73 127.52,131.89 127.12,131.92 126.86,131.59 127.19,129.6 125.83,128.65 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="132.28,128.28 132.58,127.92 134.33,127.52 135.13,125.74 135.49,125.67 135.79,125.83 136.65,127.42 138.37,127.79 138.9,128.22 138.7,128.65 137.28,129.57 137.77,131.23 137.71,131.79 137.34,131.92 135.49,130.73 134.14,131.89 133.74,131.92 133.47,131.59 133.8,129.6 132.45,128.65 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="66.14,134.9 66.44,134.53 68.19,134.14 68.99,132.35 69.35,132.28 69.65,132.45 70.51,134.04 72.23,134.4 72.76,134.83 72.56,135.26 71.14,136.19 71.63,137.84 71.57,138.4 71.2,138.53 69.35,137.34 67.99,138.5 67.6,138.53 67.33,138.2 67.66,136.22 66.31,135.26 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="72.76,134.9 73.05,134.53 74.81,134.14 75.6,132.35 75.96,132.28 76.26,132.45 77.12,134.04 78.84,134.4 79.37,134.83 79.17,135.26 77.75,136.19 78.25,137.84 78.18,138.4 77.82,138.53 75.96,137.34 74.61,138.5 74.21,138.53 73.95,138.2 74.28,136.22 72.92,135.26 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="92.6,134.9 92.9,134.53 94.65,134.14 95.44,132.35 95.81,132.28 96.1,132.45 96.96,134.04 98.68,134.4 99.21,134.83 99.01,135.26 97.59,136.19 98.09,137.84 98.02,138.4 97.66,138.53 95.81,137.34 94.45,138.5 94.05,138.53 93.79,138.2 94.12,136.22 92.76,135.26 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="105.83,134.9 106.12,134.53 107.88,134.14 108.67,132.35 109.03,132.28 109.33,132.45 110.19,134.04 111.91,134.4 112.44,134.83 112.24,135.26 110.82,136.19 111.32,137.84 111.25,138.4 110.89,138.53 109.03,137.34 107.68,138.5 107.28,138.53 107.02,138.2 107.35,136.22 105.99,135.26 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="112.44,134.9 112.74,134.53 114.49,134.14 115.29,132.35 115.65,132.28 115.95,132.45 116.81,134.04 118.53,134.4 119.06,134.83 118.86,135.26 117.43,136.19 117.93,137.84 117.86,138.4 117.5,138.53 115.65,137.34 114.29,138.5 113.9,138.53 113.63,138.2 113.96,136.22 112.61,135.26 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="125.67,134.9 125.97,134.53 127.72,134.14 128.51,132.35 128.88,132.28 129.17,132.45 130.03,134.04 131.75,134.4 132.28,134.83 132.09,135.26 130.66,136.19 131.16,137.84 131.09,138.4 130.73,138.53 128.88,137.34 127.52,138.5 127.12,138.53 126.86,138.2 127.19,136.22 125.83,135.26 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="132.28,134.9 132.58,134.53 134.33,134.14 135.13,132.35 135.49,132.28 135.79,132.45 136.65,134.04 138.37,134.4 138.9,134.83 138.7,135.26 137.28,136.19 137.77,137.84 137.71,138.4 137.34,138.53 135.49,137.34 134.14,138.5 133.74,138.53 133.47,138.2 133.8,136.22 132.45,135.26 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="66.14,141.51 66.44,141.15 68.19,140.75 68.99,138.96 69.35,138.9 69.65,139.06 70.51,140.65 72.23,141.01 72.76,141.44 72.56,141.87 71.14,142.8 71.63,144.45 71.57,145.02 71.2,145.15 69.35,143.96 67.99,145.11 67.6,145.15 67.33,144.82 67.66,142.83 66.31,141.87 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="79.37,141.51 79.67,141.15 81.42,140.75 82.21,138.96 82.58,138.9 82.88,139.06 83.74,140.65 85.46,141.01 85.98,141.44 85.79,141.87 84.36,142.8 84.86,144.45 84.79,145.02 84.43,145.15 82.58,143.96 81.22,145.11 80.83,145.15 80.56,144.82 80.89,142.83 79.54,141.87 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="85.98,141.51 86.28,141.15 88.03,140.75 88.83,138.96 89.19,138.9 89.49,139.06 90.35,140.65 92.07,141.01 92.6,141.44 92.4,141.87 90.98,142.8 91.47,144.45 91.41,145.02 91.04,145.15 89.19,143.96 87.84,145.11 87.44,145.15 87.17,144.82 87.51,142.83 86.15,141.87 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="92.6,141.51 92.9,141.15 94.65,140.75 95.44,138.96 95.81,138.9 96.1,139.06 96.96,140.65 98.68,141.01 99.21,141.44 99.01,141.87 97.59,142.8 98.09,144.45 98.02,145.02 97.66,145.15 95.81,143.96 94.45,145.11 94.05,145.15 93.79,144.82 94.12,142.83 92.76,141.87 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="99.21,141.51 99.51,141.15 101.26,140.75 102.06,138.96 102.42,138.9 102.72,139.06 103.58,140.65 105.3,141.01 105.83,141.44 105.63,141.87 104.21,142.8 104.7,144.45 104.64,145.02 104.27,145.15 102.42,143.96 101.06,145.11 100.67,145.15 100.4,144.82 100.73,142.83 99.38,141.87 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="105.83,141.51 106.12,141.15 107.88,140.75 108.67,138.96 109.03,138.9 109.33,139.06 110.19,140.65 111.91,141.01 112.44,141.44 112.24,141.87 110.82,142.8 111.32,144.45 111.25,145.02 110.89,145.15 109.03,143.96 107.68,145.11 107.28,145.15 107.02,144.82 107.35,142.83 105.99,141.87 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="112.44,141.51 112.74,141.15 114.49,140.75 115.29,138.96 115.65,138.9 115.95,139.06 116.81,140.65 118.53,141.01 119.06,141.44 118.86,141.87 117.43,142.8 117.93,144.45 117.86,145.02 117.5,145.15 115.65,143.96 114.29,145.11 113.9,145.15 113.63,144.82 113.96,142.83 112.61,141.87 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="119.06,141.51 119.35,141.15 121.11,140.75 121.9,138.96 122.26,138.9 122.56,139.06 123.42,140.65 125.14,141.01 125.67,141.44 125.47,141.87 124.05,142.8 124.54,144.45 124.48,145.02 124.11,145.15 122.26,143.96 120.91,145.11 120.51,145.15 120.25,144.82 120.58,142.83 119.22,141.87 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="132.28,141.51 132.58,141.15 134.33,140.75 135.13,138.96 135.49,138.9 135.79,139.06 136.65,140.65 138.37,141.01 138.9,141.44 138.7,141.87 137.28,142.8 137.77,144.45 137.71,145.02 137.34,145.15 135.49,143.96 134.14,145.11 133.74,145.15 133.47,144.82 133.8,142.83 132.45,141.87 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="138.9,141.51 139.2,141.15 140.95,140.75 141.74,138.96 142.11,138.9 142.4,139.06 143.26,140.65 144.98,141.01 145.51,141.44 145.31,141.87 143.89,142.8 144.39,144.45 144.32,145.02 143.96,145.15 142.11,143.96 140.75,145.11 140.35,145.15 140.09,144.82 140.42,142.83 139.06,141.87 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="66.14,148.12 66.44,147.76 68.19,147.36 68.99,145.58 69.35,145.51 69.65,145.68 70.51,147.26 72.23,147.63 72.76,148.06 72.56,148.49 71.14,149.41 71.63,151.07 71.57,151.63 71.2,151.76 69.35,150.57 67.99,151.73 67.6,151.76 67.33,151.43 67.66,149.45 66.31,148.49 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="72.76,148.12 73.05,147.76 74.81,147.36 75.6,145.58 75.96,145.51 76.26,145.68 77.12,147.26 78.84,147.63 79.37,148.06 79.17,148.49 77.75,149.41 78.25,151.07 78.18,151.63 77.82,151.76 75.96,150.57 74.61,151.73 74.21,151.76 73.95,151.43 74.28,149.45 72.92,148.49 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="79.37,148.12 79.67,147.76 81.42,147.36 82.21,145.58 82.58,145.51 82.88,145.68 83.74,147.26 85.46,147.63 85.98,148.06 85.79,148.49 84.36,149.41 84.86,151.07 84.79,151.63 84.43,151.76 82.58,150.57 81.22,151.73 80.83,151.76 80.56,151.43 80.89,149.45 79.54,148.49 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="92.6,148.12 92.9,147.76 94.65,147.36 95.44,145.58 95.81,145.51 96.1,145.68 96.96,147.26 98.68,147.63 99.21,148.06 99.01,148.49 97.59,149.41 98.09,151.07 98.02,151.63 97.66,151.76 95.81,150.57 94.45,151.73 94.05,151.76 93.79,151.43 94.12,149.45 92.76,148.49 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="112.44,148.12 112.74,147.76 114.49,147.36 115.29,145.58 115.65,145.51 115.95,145.68 116.81,147.26 118.53,147.63 119.06,148.06 118.86,148.49 117.43,149.41 117.93,151.07 117.86,151.63 117.5,151.76 115.65,150.57 114.29,151.73 113.9,151.76 113.63,151.43 113.96,149.45 112.61,148.49 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
          <polygon
            points="132.28,148.12 132.58,147.76 134.33,147.36 135.13,145.58 135.49,145.51 135.79,145.68 136.65,147.26 138.37,147.63 138.9,148.06 138.7,148.49 137.28,149.41 137.77,151.07 137.71,151.63 137.34,151.76 135.49,150.57 134.14,151.73 133.74,151.76 133.47,151.43 133.8,149.45 132.45,148.49 "
            style="fill:url(#gradient80618ad2d9ad494d91b68c40b4cb4fde);"
          />
      `,
            },
            {
                value: 19,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(37,86,99,1);"
            shape-rendering="crispEdges"
          />
          <pattern
            id="hatch83f34b8d7c854d8ca48088966a8ce8fa"
            x="0"
            y="0"
            width="8"
            height="8"
            patternUnits="userSpaceOnUse"
          >
            <rect x="0" y="0" width="8" height="8" fill="#C6D9F0" />
            <rect x="0" y="0" width="1" height="1" fill="#FDEADA" />
            <rect x="1" y="0" width="1" height="1" fill="#FDEADA" />
            <rect x="4" y="0" width="1" height="1" fill="#FDEADA" />
            <rect x="5" y="0" width="1" height="1" fill="#FDEADA" />
            <rect x="0" y="1" width="1" height="1" fill="#FDEADA" />
            <rect x="1" y="1" width="1" height="1" fill="#FDEADA" />
            <rect x="4" y="1" width="1" height="1" fill="#FDEADA" />
            <rect x="5" y="1" width="1" height="1" fill="#FDEADA" />
            <rect x="0" y="2" width="1" height="1" fill="#FDEADA" />
            <rect x="1" y="2" width="1" height="1" fill="#FDEADA" />
            <rect x="4" y="2" width="1" height="1" fill="#FDEADA" />
            <rect x="5" y="2" width="1" height="1" fill="#FDEADA" />
            <rect x="0" y="3" width="1" height="1" fill="#FDEADA" />
            <rect x="1" y="3" width="1" height="1" fill="#FDEADA" />
            <rect x="4" y="3" width="1" height="1" fill="#FDEADA" />
            <rect x="5" y="3" width="1" height="1" fill="#FDEADA" />
            <rect x="0" y="4" width="1" height="1" fill="#FDEADA" />
            <rect x="1" y="4" width="1" height="1" fill="#FDEADA" />
            <rect x="4" y="4" width="1" height="1" fill="#FDEADA" />
            <rect x="5" y="4" width="1" height="1" fill="#FDEADA" />
            <rect x="0" y="5" width="1" height="1" fill="#FDEADA" />
            <rect x="1" y="5" width="1" height="1" fill="#FDEADA" />
            <rect x="4" y="5" width="1" height="1" fill="#FDEADA" />
            <rect x="5" y="5" width="1" height="1" fill="#FDEADA" />
            <rect x="0" y="6" width="1" height="1" fill="#FDEADA" />
            <rect x="1" y="6" width="1" height="1" fill="#FDEADA" />
            <rect x="4" y="6" width="1" height="1" fill="#FDEADA" />
            <rect x="5" y="6" width="1" height="1" fill="#FDEADA" />
            <rect x="0" y="7" width="1" height="1" fill="#FDEADA" />
            <rect x="1" y="7" width="1" height="1" fill="#FDEADA" />
            <rect x="4" y="7" width="1" height="1" fill="#FDEADA" />
            <rect x="5" y="7" width="1" height="1" fill="#FDEADA" />
          </pattern>
          <polygon
            points="19.84,16.54 19.59,17.8 18.87,18.87 17.8,19.59 16.54,19.84 15.27,19.59 14.2,18.87 13.48,17.8 13.23,16.54 13.48,15.27 14.2,14.2 15.27,13.48 16.54,13.23 17.8,13.48 18.87,14.2 19.59,15.27 19.84,16.54 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="19.84,56.22 19.59,57.49 18.87,58.56 17.8,59.28 16.54,59.53 15.27,59.28 14.2,58.56 13.48,57.49 13.23,56.22 13.48,54.95 14.2,53.88 15.27,53.17 16.54,52.91 17.8,53.17 18.87,53.88 19.59,54.95 19.84,56.22 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="26.46,16.54 26.2,17.8 25.49,18.87 24.42,19.59 23.15,19.84 21.88,19.59 20.81,18.87 20.09,17.8 19.84,16.54 20.09,15.27 20.81,14.2 21.88,13.48 23.15,13.23 24.42,13.48 25.49,14.2 26.2,15.27 26.46,16.54 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="26.46,56.22 26.2,57.49 25.49,58.56 24.42,59.28 23.15,59.53 21.88,59.28 20.81,58.56 20.09,57.49 19.84,56.22 20.09,54.95 20.81,53.88 21.88,53.17 23.15,52.91 24.42,53.17 25.49,53.88 26.2,54.95 26.46,56.22 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="33.07,16.54 32.82,17.8 32.1,18.87 31.03,19.59 29.76,19.84 28.5,19.59 27.43,18.87 26.71,17.8 26.46,16.54 26.71,15.27 27.43,14.2 28.5,13.48 29.76,13.23 31.03,13.48 32.1,14.2 32.82,15.27 33.07,16.54 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="33.07,56.22 32.82,57.49 32.1,58.56 31.03,59.28 29.76,59.53 28.5,59.28 27.43,58.56 26.71,57.49 26.46,56.22 26.71,54.95 27.43,53.88 28.5,53.17 29.76,52.91 31.03,53.17 32.1,53.88 32.82,54.95 33.07,56.22 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="39.69,16.54 39.43,17.8 38.72,18.87 37.64,19.59 36.38,19.84 35.11,19.59 34.04,18.87 33.32,17.8 33.07,16.54 33.32,15.27 34.04,14.2 35.11,13.48 36.38,13.23 37.64,13.48 38.72,14.2 39.43,15.27 39.69,16.54 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="39.69,56.22 39.43,57.49 38.72,58.56 37.64,59.28 36.38,59.53 35.11,59.28 34.04,58.56 33.32,57.49 33.07,56.22 33.32,54.95 34.04,53.88 35.11,53.17 36.38,52.91 37.64,53.17 38.72,53.88 39.43,54.95 39.69,56.22 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="46.3,16.54 46.05,17.8 45.33,18.87 44.26,19.59 42.99,19.84 41.73,19.59 40.65,18.87 39.94,17.8 39.69,16.54 39.94,15.27 40.65,14.2 41.73,13.48 42.99,13.23 44.26,13.48 45.33,14.2 46.05,15.27 46.3,16.54 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="46.3,56.22 46.05,57.49 45.33,58.56 44.26,59.28 42.99,59.53 41.73,59.28 40.65,58.56 39.94,57.49 39.69,56.22 39.94,54.95 40.65,53.88 41.73,53.17 42.99,52.91 44.26,53.17 45.33,53.88 46.05,54.95 46.3,56.22 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="52.91,16.54 52.66,17.8 51.94,18.87 50.87,19.59 49.61,19.84 48.34,19.59 47.27,18.87 46.55,17.8 46.3,16.54 46.55,15.27 47.27,14.2 48.34,13.48 49.61,13.23 50.87,13.48 51.94,14.2 52.66,15.27 52.91,16.54 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="52.91,56.22 52.66,57.49 51.94,58.56 50.87,59.28 49.61,59.53 48.34,59.28 47.27,58.56 46.55,57.49 46.3,56.22 46.55,54.95 47.27,53.88 48.34,53.17 49.61,52.91 50.87,53.17 51.94,53.88 52.66,54.95 52.91,56.22 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="59.53,16.54 59.28,17.8 58.56,18.87 57.49,19.59 56.22,19.84 54.95,19.59 53.88,18.87 53.17,17.8 52.91,16.54 53.17,15.27 53.88,14.2 54.95,13.48 56.22,13.23 57.49,13.48 58.56,14.2 59.28,15.27 59.53,16.54 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="59.53,56.22 59.28,57.49 58.56,58.56 57.49,59.28 56.22,59.53 54.95,59.28 53.88,58.56 53.17,57.49 52.91,56.22 53.17,54.95 53.88,53.88 54.95,53.17 56.22,52.91 57.49,53.17 58.56,53.88 59.28,54.95 59.53,56.22 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="19.84,23.15 19.59,24.42 18.87,25.49 17.8,26.2 16.54,26.46 15.27,26.2 14.2,25.49 13.48,24.42 13.23,23.15 13.48,21.88 14.2,20.81 15.27,20.09 16.54,19.84 17.8,20.09 18.87,20.81 19.59,21.88 19.84,23.15 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="59.53,23.15 59.28,24.42 58.56,25.49 57.49,26.2 56.22,26.46 54.95,26.2 53.88,25.49 53.17,24.42 52.91,23.15 53.17,21.88 53.88,20.81 54.95,20.09 56.22,19.84 57.49,20.09 58.56,20.81 59.28,21.88 59.53,23.15 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="19.84,29.76 19.59,31.03 18.87,32.1 17.8,32.82 16.54,33.07 15.27,32.82 14.2,32.1 13.48,31.03 13.23,29.76 13.48,28.5 14.2,27.43 15.27,26.71 16.54,26.46 17.8,26.71 18.87,27.43 19.59,28.5 19.84,29.76 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="59.53,29.76 59.28,31.03 58.56,32.1 57.49,32.82 56.22,33.07 54.95,32.82 53.88,32.1 53.17,31.03 52.91,29.76 53.17,28.5 53.88,27.43 54.95,26.71 56.22,26.46 57.49,26.71 58.56,27.43 59.28,28.5 59.53,29.76 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="19.84,36.38 19.59,37.64 18.87,38.72 17.8,39.43 16.54,39.69 15.27,39.43 14.2,38.72 13.48,37.64 13.23,36.38 13.48,35.11 14.2,34.04 15.27,33.32 16.54,33.07 17.8,33.32 18.87,34.04 19.59,35.11 19.84,36.38 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="59.53,36.38 59.28,37.64 58.56,38.72 57.49,39.43 56.22,39.69 54.95,39.43 53.88,38.72 53.17,37.64 52.91,36.38 53.17,35.11 53.88,34.04 54.95,33.32 56.22,33.07 57.49,33.32 58.56,34.04 59.28,35.11 59.53,36.38 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="19.84,42.99 19.59,44.26 18.87,45.33 17.8,46.05 16.54,46.3 15.27,46.05 14.2,45.33 13.48,44.26 13.23,42.99 13.48,41.73 14.2,40.65 15.27,39.94 16.54,39.69 17.8,39.94 18.87,40.65 19.59,41.73 19.84,42.99 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="59.53,42.99 59.28,44.26 58.56,45.33 57.49,46.05 56.22,46.3 54.95,46.05 53.88,45.33 53.17,44.26 52.91,42.99 53.17,41.73 53.88,40.65 54.95,39.94 56.22,39.69 57.49,39.94 58.56,40.65 59.28,41.73 59.53,42.99 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="19.84,49.61 19.59,50.87 18.87,51.94 17.8,52.66 16.54,52.91 15.27,52.66 14.2,51.94 13.48,50.87 13.23,49.61 13.48,48.34 14.2,47.27 15.27,46.55 16.54,46.3 17.8,46.55 18.87,47.27 19.59,48.34 19.84,49.61 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="59.53,49.61 59.28,50.87 58.56,51.94 57.49,52.66 56.22,52.91 54.95,52.66 53.88,51.94 53.17,50.87 52.91,49.61 53.17,48.34 53.88,47.27 54.95,46.55 56.22,46.3 57.49,46.55 58.56,47.27 59.28,48.34 59.53,49.61 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="19.84,109.13 19.59,110.4 18.87,111.47 17.8,112.19 16.54,112.44 15.27,112.19 14.2,111.47 13.48,110.4 13.23,109.13 13.48,107.87 14.2,106.8 15.27,106.08 16.54,105.83 17.8,106.08 18.87,106.8 19.59,107.87 19.84,109.13 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="19.84,148.82 19.59,150.08 18.87,151.16 17.8,151.87 16.54,152.13 15.27,151.87 14.2,151.16 13.48,150.08 13.23,148.82 13.48,147.55 14.2,146.48 15.27,145.76 16.54,145.51 17.8,145.76 18.87,146.48 19.59,147.55 19.84,148.82 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="26.46,109.13 26.2,110.4 25.49,111.47 24.42,112.19 23.15,112.44 21.88,112.19 20.81,111.47 20.09,110.4 19.84,109.13 20.09,107.87 20.81,106.8 21.88,106.08 23.15,105.83 24.42,106.08 25.49,106.8 26.2,107.87 26.46,109.13 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="26.46,148.82 26.2,150.08 25.49,151.16 24.42,151.87 23.15,152.13 21.88,151.87 20.81,151.16 20.09,150.08 19.84,148.82 20.09,147.55 20.81,146.48 21.88,145.76 23.15,145.51 24.42,145.76 25.49,146.48 26.2,147.55 26.46,148.82 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="33.07,109.13 32.82,110.4 32.1,111.47 31.03,112.19 29.76,112.44 28.5,112.19 27.43,111.47 26.71,110.4 26.46,109.13 26.71,107.87 27.43,106.8 28.5,106.08 29.76,105.83 31.03,106.08 32.1,106.8 32.82,107.87 33.07,109.13 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="33.07,148.82 32.82,150.08 32.1,151.16 31.03,151.87 29.76,152.13 28.5,151.87 27.43,151.16 26.71,150.08 26.46,148.82 26.71,147.55 27.43,146.48 28.5,145.76 29.76,145.51 31.03,145.76 32.1,146.48 32.82,147.55 33.07,148.82 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="39.69,109.13 39.43,110.4 38.72,111.47 37.64,112.19 36.38,112.44 35.11,112.19 34.04,111.47 33.32,110.4 33.07,109.13 33.32,107.87 34.04,106.8 35.11,106.08 36.38,105.83 37.64,106.08 38.72,106.8 39.43,107.87 39.69,109.13 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="39.69,148.82 39.43,150.08 38.72,151.16 37.64,151.87 36.38,152.13 35.11,151.87 34.04,151.16 33.32,150.08 33.07,148.82 33.32,147.55 34.04,146.48 35.11,145.76 36.38,145.51 37.64,145.76 38.72,146.48 39.43,147.55 39.69,148.82 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="46.3,109.13 46.05,110.4 45.33,111.47 44.26,112.19 42.99,112.44 41.73,112.19 40.65,111.47 39.94,110.4 39.69,109.13 39.94,107.87 40.65,106.8 41.73,106.08 42.99,105.83 44.26,106.08 45.33,106.8 46.05,107.87 46.3,109.13 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="46.3,148.82 46.05,150.08 45.33,151.16 44.26,151.87 42.99,152.13 41.73,151.87 40.65,151.16 39.94,150.08 39.69,148.82 39.94,147.55 40.65,146.48 41.73,145.76 42.99,145.51 44.26,145.76 45.33,146.48 46.05,147.55 46.3,148.82 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="52.91,109.13 52.66,110.4 51.94,111.47 50.87,112.19 49.61,112.44 48.34,112.19 47.27,111.47 46.55,110.4 46.3,109.13 46.55,107.87 47.27,106.8 48.34,106.08 49.61,105.83 50.87,106.08 51.94,106.8 52.66,107.87 52.91,109.13 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="52.91,148.82 52.66,150.08 51.94,151.16 50.87,151.87 49.61,152.13 48.34,151.87 47.27,151.16 46.55,150.08 46.3,148.82 46.55,147.55 47.27,146.48 48.34,145.76 49.61,145.51 50.87,145.76 51.94,146.48 52.66,147.55 52.91,148.82 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="59.53,109.13 59.28,110.4 58.56,111.47 57.49,112.19 56.22,112.44 54.95,112.19 53.88,111.47 53.17,110.4 52.91,109.13 53.17,107.87 53.88,106.8 54.95,106.08 56.22,105.83 57.49,106.08 58.56,106.8 59.28,107.87 59.53,109.13 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="59.53,148.82 59.28,150.08 58.56,151.16 57.49,151.87 56.22,152.13 54.95,151.87 53.88,151.16 53.17,150.08 52.91,148.82 53.17,147.55 53.88,146.48 54.95,145.76 56.22,145.51 57.49,145.76 58.56,146.48 59.28,147.55 59.53,148.82 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="19.84,115.75 19.59,117.01 18.87,118.09 17.8,118.8 16.54,119.06 15.27,118.8 14.2,118.09 13.48,117.01 13.23,115.75 13.48,114.48 14.2,113.41 15.27,112.69 16.54,112.44 17.8,112.69 18.87,113.41 19.59,114.48 19.84,115.75 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="59.53,115.75 59.28,117.01 58.56,118.09 57.49,118.8 56.22,119.06 54.95,118.8 53.88,118.09 53.17,117.01 52.91,115.75 53.17,114.48 53.88,113.41 54.95,112.69 56.22,112.44 57.49,112.69 58.56,113.41 59.28,114.48 59.53,115.75 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="19.84,122.36 19.59,123.63 18.87,124.7 17.8,125.42 16.54,125.67 15.27,125.42 14.2,124.7 13.48,123.63 13.23,122.36 13.48,121.1 14.2,120.02 15.27,119.31 16.54,119.06 17.8,119.31 18.87,120.02 19.59,121.1 19.84,122.36 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="59.53,122.36 59.28,123.63 58.56,124.7 57.49,125.42 56.22,125.67 54.95,125.42 53.88,124.7 53.17,123.63 52.91,122.36 53.17,121.1 53.88,120.02 54.95,119.31 56.22,119.06 57.49,119.31 58.56,120.02 59.28,121.1 59.53,122.36 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="19.84,128.98 19.59,130.24 18.87,131.31 17.8,132.03 16.54,132.28 15.27,132.03 14.2,131.31 13.48,130.24 13.23,128.98 13.48,127.71 14.2,126.64 15.27,125.92 16.54,125.67 17.8,125.92 18.87,126.64 19.59,127.71 19.84,128.98 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="59.53,128.98 59.28,130.24 58.56,131.31 57.49,132.03 56.22,132.28 54.95,132.03 53.88,131.31 53.17,130.24 52.91,128.98 53.17,127.71 53.88,126.64 54.95,125.92 56.22,125.67 57.49,125.92 58.56,126.64 59.28,127.71 59.53,128.98 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="19.84,135.59 19.59,136.86 18.87,137.93 17.8,138.65 16.54,138.9 15.27,138.65 14.2,137.93 13.48,136.86 13.23,135.59 13.48,134.32 14.2,133.25 15.27,132.54 16.54,132.28 17.8,132.54 18.87,133.25 19.59,134.32 19.84,135.59 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="59.53,135.59 59.28,136.86 58.56,137.93 57.49,138.65 56.22,138.9 54.95,138.65 53.88,137.93 53.17,136.86 52.91,135.59 53.17,134.32 53.88,133.25 54.95,132.54 56.22,132.28 57.49,132.54 58.56,133.25 59.28,134.32 59.53,135.59 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="19.84,142.2 19.59,143.47 18.87,144.54 17.8,145.26 16.54,145.51 15.27,145.26 14.2,144.54 13.48,143.47 13.23,142.2 13.48,140.94 14.2,139.87 15.27,139.15 16.54,138.9 17.8,139.15 18.87,139.87 19.59,140.94 19.84,142.2 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="59.53,142.2 59.28,143.47 58.56,144.54 57.49,145.26 56.22,145.51 54.95,145.26 53.88,144.54 53.17,143.47 52.91,142.2 53.17,140.94 53.88,139.87 54.95,139.15 56.22,138.9 57.49,139.15 58.56,139.87 59.28,140.94 59.53,142.2 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="112.44,16.54 112.19,17.8 111.47,18.87 110.4,19.59 109.13,19.84 107.87,19.59 106.8,18.87 106.08,17.8 105.83,16.54 106.08,15.27 106.8,14.2 107.87,13.48 109.13,13.23 110.4,13.48 111.47,14.2 112.19,15.27 112.44,16.54 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="112.44,56.22 112.19,57.49 111.47,58.56 110.4,59.28 109.13,59.53 107.87,59.28 106.8,58.56 106.08,57.49 105.83,56.22 106.08,54.95 106.8,53.88 107.87,53.17 109.13,52.91 110.4,53.17 111.47,53.88 112.19,54.95 112.44,56.22 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="119.06,16.54 118.8,17.8 118.09,18.87 117.01,19.59 115.75,19.84 114.48,19.59 113.41,18.87 112.69,17.8 112.44,16.54 112.69,15.27 113.41,14.2 114.48,13.48 115.75,13.23 117.01,13.48 118.09,14.2 118.8,15.27 119.06,16.54 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="119.06,56.22 118.8,57.49 118.09,58.56 117.01,59.28 115.75,59.53 114.48,59.28 113.41,58.56 112.69,57.49 112.44,56.22 112.69,54.95 113.41,53.88 114.48,53.17 115.75,52.91 117.01,53.17 118.09,53.88 118.8,54.95 119.06,56.22 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="125.67,16.54 125.42,17.8 124.7,18.87 123.63,19.59 122.36,19.84 121.1,19.59 120.02,18.87 119.31,17.8 119.06,16.54 119.31,15.27 120.02,14.2 121.1,13.48 122.36,13.23 123.63,13.48 124.7,14.2 125.42,15.27 125.67,16.54 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="125.67,56.22 125.42,57.49 124.7,58.56 123.63,59.28 122.36,59.53 121.1,59.28 120.02,58.56 119.31,57.49 119.06,56.22 119.31,54.95 120.02,53.88 121.1,53.17 122.36,52.91 123.63,53.17 124.7,53.88 125.42,54.95 125.67,56.22 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="132.28,16.54 132.03,17.8 131.31,18.87 130.24,19.59 128.98,19.84 127.71,19.59 126.64,18.87 125.92,17.8 125.67,16.54 125.92,15.27 126.64,14.2 127.71,13.48 128.98,13.23 130.24,13.48 131.31,14.2 132.03,15.27 132.28,16.54 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="132.28,56.22 132.03,57.49 131.31,58.56 130.24,59.28 128.98,59.53 127.71,59.28 126.64,58.56 125.92,57.49 125.67,56.22 125.92,54.95 126.64,53.88 127.71,53.17 128.98,52.91 130.24,53.17 131.31,53.88 132.03,54.95 132.28,56.22 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="138.9,16.54 138.65,17.8 137.93,18.87 136.86,19.59 135.59,19.84 134.32,19.59 133.25,18.87 132.54,17.8 132.28,16.54 132.54,15.27 133.25,14.2 134.32,13.48 135.59,13.23 136.86,13.48 137.93,14.2 138.65,15.27 138.9,16.54 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="138.9,56.22 138.65,57.49 137.93,58.56 136.86,59.28 135.59,59.53 134.32,59.28 133.25,58.56 132.54,57.49 132.28,56.22 132.54,54.95 133.25,53.88 134.32,53.17 135.59,52.91 136.86,53.17 137.93,53.88 138.65,54.95 138.9,56.22 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="145.51,16.54 145.26,17.8 144.54,18.87 143.47,19.59 142.2,19.84 140.94,19.59 139.87,18.87 139.15,17.8 138.9,16.54 139.15,15.27 139.87,14.2 140.94,13.48 142.2,13.23 143.47,13.48 144.54,14.2 145.26,15.27 145.51,16.54 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="145.51,56.22 145.26,57.49 144.54,58.56 143.47,59.28 142.2,59.53 140.94,59.28 139.87,58.56 139.15,57.49 138.9,56.22 139.15,54.95 139.87,53.88 140.94,53.17 142.2,52.91 143.47,53.17 144.54,53.88 145.26,54.95 145.51,56.22 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="152.13,16.54 151.87,17.8 151.16,18.87 150.08,19.59 148.82,19.84 147.55,19.59 146.48,18.87 145.76,17.8 145.51,16.54 145.76,15.27 146.48,14.2 147.55,13.48 148.82,13.23 150.08,13.48 151.16,14.2 151.87,15.27 152.13,16.54 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="152.13,56.22 151.87,57.49 151.16,58.56 150.08,59.28 148.82,59.53 147.55,59.28 146.48,58.56 145.76,57.49 145.51,56.22 145.76,54.95 146.48,53.88 147.55,53.17 148.82,52.91 150.08,53.17 151.16,53.88 151.87,54.95 152.13,56.22 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="112.44,23.15 112.19,24.42 111.47,25.49 110.4,26.2 109.13,26.46 107.87,26.2 106.8,25.49 106.08,24.42 105.83,23.15 106.08,21.88 106.8,20.81 107.87,20.09 109.13,19.84 110.4,20.09 111.47,20.81 112.19,21.88 112.44,23.15 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="152.13,23.15 151.87,24.42 151.16,25.49 150.08,26.2 148.82,26.46 147.55,26.2 146.48,25.49 145.76,24.42 145.51,23.15 145.76,21.88 146.48,20.81 147.55,20.09 148.82,19.84 150.08,20.09 151.16,20.81 151.87,21.88 152.13,23.15 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="112.44,29.76 112.19,31.03 111.47,32.1 110.4,32.82 109.13,33.07 107.87,32.82 106.8,32.1 106.08,31.03 105.83,29.76 106.08,28.5 106.8,27.43 107.87,26.71 109.13,26.46 110.4,26.71 111.47,27.43 112.19,28.5 112.44,29.76 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="152.13,29.76 151.87,31.03 151.16,32.1 150.08,32.82 148.82,33.07 147.55,32.82 146.48,32.1 145.76,31.03 145.51,29.76 145.76,28.5 146.48,27.43 147.55,26.71 148.82,26.46 150.08,26.71 151.16,27.43 151.87,28.5 152.13,29.76 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="112.44,36.38 112.19,37.64 111.47,38.72 110.4,39.43 109.13,39.69 107.87,39.43 106.8,38.72 106.08,37.64 105.83,36.38 106.08,35.11 106.8,34.04 107.87,33.32 109.13,33.07 110.4,33.32 111.47,34.04 112.19,35.11 112.44,36.38 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="152.13,36.38 151.87,37.64 151.16,38.72 150.08,39.43 148.82,39.69 147.55,39.43 146.48,38.72 145.76,37.64 145.51,36.38 145.76,35.11 146.48,34.04 147.55,33.32 148.82,33.07 150.08,33.32 151.16,34.04 151.87,35.11 152.13,36.38 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="112.44,42.99 112.19,44.26 111.47,45.33 110.4,46.05 109.13,46.3 107.87,46.05 106.8,45.33 106.08,44.26 105.83,42.99 106.08,41.73 106.8,40.65 107.87,39.94 109.13,39.69 110.4,39.94 111.47,40.65 112.19,41.73 112.44,42.99 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="152.13,42.99 151.87,44.26 151.16,45.33 150.08,46.05 148.82,46.3 147.55,46.05 146.48,45.33 145.76,44.26 145.51,42.99 145.76,41.73 146.48,40.65 147.55,39.94 148.82,39.69 150.08,39.94 151.16,40.65 151.87,41.73 152.13,42.99 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="112.44,49.61 112.19,50.87 111.47,51.94 110.4,52.66 109.13,52.91 107.87,52.66 106.8,51.94 106.08,50.87 105.83,49.61 106.08,48.34 106.8,47.27 107.87,46.55 109.13,46.3 110.4,46.55 111.47,47.27 112.19,48.34 112.44,49.61 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <polygon
            points="152.13,49.61 151.87,50.87 151.16,51.94 150.08,52.66 148.82,52.91 147.55,52.66 146.48,51.94 145.76,50.87 145.51,49.61 145.76,48.34 146.48,47.27 147.55,46.55 148.82,46.3 150.08,46.55 151.16,47.27 151.87,48.34 152.13,49.61 "
            style="fill:url(#hatch83f34b8d7c854d8ca48088966a8ce8fa);"
          />
          <linearGradient
            id="gradient0fffa2ee11214e519944c5c7756592ab"
            gradientUnits="userSpaceOnUse"
            x1="23.1471699955989"
            y1="78.5144232839259"
            x2="142.207158159919"
            y2="86.8399086862889"
          >
            <stop offset="0%" stop-color="#B2A1C7" />
            <stop offset="100%" stop-color="#FFFFFF" />
          </linearGradient>
          <polygon
            points="26.79,29.43 27.01,28.29 27.66,27.33 28.62,26.68 29.76,26.46 30.9,26.68 31.87,27.33 32.51,28.29 32.74,29.43 32.74,43.32 32.51,44.46 31.87,45.43 30.9,46.07 29.76,46.3 28.62,46.07 27.66,45.43 27.01,44.46 26.79,43.32 "
            style="fill:url(#gradient0fffa2ee11214e519944c5c7756592ab);"
          />
          <polygon
            points="33.4,29.43 33.63,28.29 34.27,27.33 35.24,26.68 36.38,26.46 37.52,26.68 38.48,27.33 39.13,28.29 39.35,29.43 39.35,43.32 39.13,44.46 38.48,45.43 37.52,46.07 36.38,46.3 35.24,46.07 34.27,45.43 33.63,44.46 33.4,43.32 "
            style="fill:url(#gradient0fffa2ee11214e519944c5c7756592ab);"
          />
          <polygon
            points="40.02,29.43 40.24,28.29 40.89,27.33 41.85,26.68 42.99,26.46 44.13,26.68 45.1,27.33 45.74,28.29 45.97,29.43 45.97,43.32 45.74,44.46 45.1,45.43 44.13,46.07 42.99,46.3 41.85,46.07 40.89,45.43 40.24,44.46 40.02,43.32 "
            style="fill:url(#gradient0fffa2ee11214e519944c5c7756592ab);"
          />
          <polygon
            points="26.79,122.03 27.01,120.89 27.66,119.93 28.62,119.28 29.76,119.06 30.9,119.28 31.87,119.93 32.51,120.89 32.74,122.03 32.74,135.92 32.51,137.06 31.87,138.03 30.9,138.67 29.76,138.9 28.62,138.67 27.66,138.03 27.01,137.06 26.79,135.92 "
            style="fill:url(#gradient0fffa2ee11214e519944c5c7756592ab);"
          />
          <polygon
            points="33.4,122.03 33.63,120.89 34.27,119.93 35.24,119.28 36.38,119.06 37.52,119.28 38.48,119.93 39.13,120.89 39.35,122.03 39.35,135.92 39.13,137.06 38.48,138.03 37.52,138.67 36.38,138.9 35.24,138.67 34.27,138.03 33.63,137.06 33.4,135.92 "
            style="fill:url(#gradient0fffa2ee11214e519944c5c7756592ab);"
          />
          <polygon
            points="40.02,122.03 40.24,120.89 40.89,119.93 41.85,119.28 42.99,119.06 44.13,119.28 45.1,119.93 45.74,120.89 45.97,122.03 45.97,135.92 45.74,137.06 45.1,138.03 44.13,138.67 42.99,138.9 41.85,138.67 40.89,138.03 40.24,137.06 40.02,135.92 "
            style="fill:url(#gradient0fffa2ee11214e519944c5c7756592ab);"
          />
          <polygon
            points="119.39,29.43 119.61,28.29 120.26,27.33 121.22,26.68 122.36,26.46 123.5,26.68 124.47,27.33 125.11,28.29 125.34,29.43 125.34,43.32 125.11,44.46 124.47,45.43 123.5,46.07 122.36,46.3 121.22,46.07 120.26,45.43 119.61,44.46 119.39,43.32 "
            style="fill:url(#gradient0fffa2ee11214e519944c5c7756592ab);"
          />
          <polygon
            points="126,29.43 126.23,28.29 126.87,27.33 127.84,26.68 128.98,26.46 130.12,26.68 131.08,27.33 131.73,28.29 131.95,29.43 131.95,43.32 131.73,44.46 131.08,45.43 130.12,46.07 128.98,46.3 127.84,46.07 126.87,45.43 126.23,44.46 126,43.32 "
            style="fill:url(#gradient0fffa2ee11214e519944c5c7756592ab);"
          />
          <polygon
            points="132.61,29.43 132.84,28.29 133.49,27.33 134.45,26.68 135.59,26.46 136.73,26.68 137.7,27.33 138.34,28.29 138.57,29.43 138.57,43.32 138.34,44.46 137.7,45.43 136.73,46.07 135.59,46.3 134.45,46.07 133.49,45.43 132.84,44.46 132.61,43.32 "
            style="fill:url(#gradient0fffa2ee11214e519944c5c7756592ab);"
          />
          <linearGradient
            id="gradient6a46f7652d584c37a6ba75a90d08d89b"
            gradientUnits="userSpaceOnUse"
            x1="10.4830545936657"
            y1="78.893629314992"
            x2="154.871269747155"
            y2="86.4606950258283"
          >
            <stop offset="0%" stop-color="#00E278" />
            <stop offset="50%" stop-color="#FFFF00" />
            <stop offset="100%" stop-color="#00E278" />
          </linearGradient>
          <polygon
            points="16.54,72.09 15.52,71.89 14.66,71.32 14.09,70.46 13.89,69.45 14.09,68.44 14.66,67.58 15.52,67 16.54,66.8 42.99,66.8 44,67 44.86,67.58 45.44,68.44 45.64,69.45 45.44,70.46 44.86,71.32 44,71.89 42.99,72.09 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="56.22,72.09 55.21,71.89 54.35,71.32 53.78,70.46 53.57,69.45 53.78,68.44 54.35,67.58 55.21,67 56.22,66.8 69.45,66.8 70.46,67 71.32,67.58 71.89,68.44 72.09,69.45 71.89,70.46 71.32,71.32 70.46,71.89 69.45,72.09 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="102.52,72.09 101.51,71.89 100.65,71.32 100.08,70.46 99.87,69.45 100.08,68.44 100.65,67.58 101.51,67 102.52,66.8 102.52,66.8 103.53,67 104.39,67.58 104.96,68.44 105.17,69.45 104.96,70.46 104.39,71.32 103.53,71.89 102.52,72.09 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="115.75,72.09 114.74,71.89 113.88,71.32 113.3,70.46 113.1,69.45 113.3,68.44 113.88,67.58 114.74,67 115.75,66.8 115.75,66.8 116.76,67 117.62,67.58 118.19,68.44 118.39,69.45 118.19,70.46 117.62,71.32 116.76,71.89 115.75,72.09 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="128.98,72.09 127.96,71.89 127.11,71.32 126.53,70.46 126.33,69.45 126.53,68.44 127.11,67.58 127.96,67 128.98,66.8 128.98,66.8 129.99,67 130.85,67.58 131.42,68.44 131.62,69.45 131.42,70.46 130.85,71.32 129.99,71.89 128.98,72.09 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="142.2,72.09 141.19,71.89 140.33,71.32 139.76,70.46 139.56,69.45 139.76,68.44 140.33,67.58 141.19,67 142.2,66.8 142.2,66.8 143.22,67 144.08,67.58 144.65,68.44 144.85,69.45 144.65,70.46 144.08,71.32 143.22,71.89 142.2,72.09 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="16.54,78.71 15.52,78.51 14.66,77.93 14.09,77.08 13.89,76.06 14.09,75.05 14.66,74.19 15.52,73.62 16.54,73.42 29.76,73.42 30.78,73.62 31.63,74.19 32.21,75.05 32.41,76.06 32.21,77.08 31.63,77.93 30.78,78.51 29.76,78.71 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="49.61,78.71 48.59,78.51 47.74,77.93 47.16,77.08 46.96,76.06 47.16,75.05 47.74,74.19 48.59,73.62 49.61,73.42 49.61,73.42 50.62,73.62 51.48,74.19 52.05,75.05 52.25,76.06 52.05,77.08 51.48,77.93 50.62,78.51 49.61,78.71 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="62.83,78.71 61.82,78.51 60.96,77.93 60.39,77.08 60.19,76.06 60.39,75.05 60.96,74.19 61.82,73.62 62.83,73.42 62.83,73.42 63.85,73.62 64.71,74.19 65.28,75.05 65.48,76.06 65.28,77.08 64.71,77.93 63.85,78.51 62.83,78.71 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="76.06,78.71 75.05,78.51 74.19,77.93 73.62,77.08 73.42,76.06 73.62,75.05 74.19,74.19 75.05,73.62 76.06,73.42 76.06,73.42 77.08,73.62 77.93,74.19 78.51,75.05 78.71,76.06 78.51,77.08 77.93,77.93 77.08,78.51 76.06,78.71 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="89.29,78.71 88.28,78.51 87.42,77.93 86.85,77.08 86.65,76.06 86.85,75.05 87.42,74.19 88.28,73.62 89.29,73.42 109.13,73.42 110.15,73.62 111,74.19 111.58,75.05 111.78,76.06 111.58,77.08 111,77.93 110.15,78.51 109.13,78.71 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="128.98,78.71 127.96,78.51 127.11,77.93 126.53,77.08 126.33,76.06 126.53,75.05 127.11,74.19 127.96,73.62 128.98,73.42 148.82,73.42 149.83,73.62 150.69,74.19 151.26,75.05 151.46,76.06 151.26,77.08 150.69,77.93 149.83,78.51 148.82,78.71 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="29.76,85.32 28.75,85.12 27.89,84.55 27.32,83.69 27.12,82.68 27.32,81.66 27.89,80.81 28.75,80.23 29.76,80.03 29.76,80.03 30.78,80.23 31.63,80.81 32.21,81.66 32.41,82.68 32.21,83.69 31.63,84.55 30.78,85.12 29.76,85.32 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="42.99,85.32 41.98,85.12 41.12,84.55 40.55,83.69 40.35,82.68 40.55,81.66 41.12,80.81 41.98,80.23 42.99,80.03 56.22,80.03 57.23,80.23 58.09,80.81 58.66,81.66 58.87,82.68 58.66,83.69 58.09,84.55 57.23,85.12 56.22,85.32 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="69.45,85.32 68.44,85.12 67.58,84.55 67,83.69 66.8,82.68 67,81.66 67.58,80.81 68.44,80.23 69.45,80.03 76.06,80.03 77.08,80.23 77.93,80.81 78.51,81.66 78.71,82.68 78.51,83.69 77.93,84.55 77.08,85.12 76.06,85.32 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="95.91,85.32 94.89,85.12 94.03,84.55 93.46,83.69 93.26,82.68 93.46,81.66 94.03,80.81 94.89,80.23 95.91,80.03 95.91,80.03 96.92,80.23 97.78,80.81 98.35,81.66 98.55,82.68 98.35,83.69 97.78,84.55 96.92,85.12 95.91,85.32 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="109.13,85.32 108.12,85.12 107.26,84.55 106.69,83.69 106.49,82.68 106.69,81.66 107.26,80.81 108.12,80.23 109.13,80.03 115.75,80.03 116.76,80.23 117.62,80.81 118.19,81.66 118.39,82.68 118.19,83.69 117.62,84.55 116.76,85.12 115.75,85.32 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="128.98,85.32 127.96,85.12 127.11,84.55 126.53,83.69 126.33,82.68 126.53,81.66 127.11,80.81 127.96,80.23 128.98,80.03 128.98,80.03 129.99,80.23 130.85,80.81 131.42,81.66 131.62,82.68 131.42,83.69 130.85,84.55 129.99,85.12 128.98,85.32 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="148.82,85.32 147.81,85.12 146.95,84.55 146.37,83.69 146.17,82.68 146.37,81.66 146.95,80.81 147.81,80.23 148.82,80.03 148.82,80.03 149.83,80.23 150.69,80.81 151.26,81.66 151.46,82.68 151.26,83.69 150.69,84.55 149.83,85.12 148.82,85.32 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="16.54,91.94 15.52,91.74 14.66,91.16 14.09,90.3 13.89,89.29 14.09,88.28 14.66,87.42 15.52,86.85 16.54,86.65 16.54,86.65 17.55,86.85 18.41,87.42 18.98,88.28 19.18,89.29 18.98,90.3 18.41,91.16 17.55,91.74 16.54,91.94 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="36.38,91.94 35.37,91.74 34.51,91.16 33.93,90.3 33.73,89.29 33.93,88.28 34.51,87.42 35.37,86.85 36.38,86.65 36.38,86.65 37.39,86.85 38.25,87.42 38.82,88.28 39.02,89.29 38.82,90.3 38.25,91.16 37.39,91.74 36.38,91.94 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="89.29,91.94 88.28,91.74 87.42,91.16 86.85,90.3 86.65,89.29 86.85,88.28 87.42,87.42 88.28,86.85 89.29,86.65 109.13,86.65 110.15,86.85 111,87.42 111.58,88.28 111.78,89.29 111.58,90.3 111,91.16 110.15,91.74 109.13,91.94 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="135.59,91.94 134.58,91.74 133.72,91.16 133.15,90.3 132.94,89.29 133.15,88.28 133.72,87.42 134.58,86.85 135.59,86.65 148.82,86.65 149.83,86.85 150.69,87.42 151.26,88.28 151.46,89.29 151.26,90.3 150.69,91.16 149.83,91.74 148.82,91.94 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="23.15,98.55 22.14,98.35 21.28,97.78 20.71,96.92 20.5,95.91 20.71,94.89 21.28,94.03 22.14,93.46 23.15,93.26 23.15,93.26 24.16,93.46 25.02,94.03 25.59,94.89 25.8,95.91 25.59,96.92 25.02,97.78 24.16,98.35 23.15,98.55 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="36.38,98.55 35.37,98.35 34.51,97.78 33.93,96.92 33.73,95.91 33.93,94.89 34.51,94.03 35.37,93.46 36.38,93.26 42.99,93.26 44,93.46 44.86,94.03 45.44,94.89 45.64,95.91 45.44,96.92 44.86,97.78 44,98.35 42.99,98.55 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="56.22,98.55 55.21,98.35 54.35,97.78 53.78,96.92 53.57,95.91 53.78,94.89 54.35,94.03 55.21,93.46 56.22,93.26 56.22,93.26 57.23,93.46 58.09,94.03 58.66,94.89 58.87,95.91 58.66,96.92 58.09,97.78 57.23,98.35 56.22,98.55 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="69.45,98.55 68.44,98.35 67.58,97.78 67,96.92 66.8,95.91 67,94.89 67.58,94.03 68.44,93.46 69.45,93.26 69.45,93.26 70.46,93.46 71.32,94.03 71.89,94.89 72.09,95.91 71.89,96.92 71.32,97.78 70.46,98.35 69.45,98.55 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="95.91,98.55 94.89,98.35 94.03,97.78 93.46,96.92 93.26,95.91 93.46,94.89 94.03,94.03 94.89,93.46 95.91,93.26 95.91,93.26 96.92,93.46 97.78,94.03 98.35,94.89 98.55,95.91 98.35,96.92 97.78,97.78 96.92,98.35 95.91,98.55 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="115.75,98.55 114.74,98.35 113.88,97.78 113.3,96.92 113.1,95.91 113.3,94.89 113.88,94.03 114.74,93.46 115.75,93.26 115.75,93.26 116.76,93.46 117.62,94.03 118.19,94.89 118.39,95.91 118.19,96.92 117.62,97.78 116.76,98.35 115.75,98.55 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="142.2,98.55 141.19,98.35 140.33,97.78 139.76,96.92 139.56,95.91 139.76,94.89 140.33,94.03 141.19,93.46 142.2,93.26 142.2,93.26 143.22,93.46 144.08,94.03 144.65,94.89 144.85,95.91 144.65,96.92 144.08,97.78 143.22,98.35 142.2,98.55 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="115.75,105.17 114.74,104.96 113.88,104.39 113.3,103.53 113.1,102.52 113.3,101.51 113.88,100.65 114.74,100.08 115.75,99.87 115.75,99.87 116.76,100.08 117.62,100.65 118.19,101.51 118.39,102.52 118.19,103.53 117.62,104.39 116.76,104.96 115.75,105.17 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="135.59,105.17 134.58,104.96 133.72,104.39 133.15,103.53 132.94,102.52 133.15,101.51 133.72,100.65 134.58,100.08 135.59,99.87 135.59,99.87 136.6,100.08 137.46,100.65 138.03,101.51 138.24,102.52 138.03,103.53 137.46,104.39 136.6,104.96 135.59,105.17 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="122.36,111.78 121.35,111.58 120.49,111 119.92,110.15 119.72,109.13 119.92,108.12 120.49,107.26 121.35,106.69 122.36,106.49 128.98,106.49 129.99,106.69 130.85,107.26 131.42,108.12 131.62,109.13 131.42,110.15 130.85,111 129.99,111.58 128.98,111.78 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="142.2,111.78 141.19,111.58 140.33,111 139.76,110.15 139.56,109.13 139.76,108.12 140.33,107.26 141.19,106.69 142.2,106.49 148.82,106.49 149.83,106.69 150.69,107.26 151.26,108.12 151.46,109.13 151.26,110.15 150.69,111 149.83,111.58 148.82,111.78 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="115.75,118.39 114.74,118.19 113.88,117.62 113.3,116.76 113.1,115.75 113.3,114.74 113.88,113.88 114.74,113.3 115.75,113.1 122.36,113.1 123.37,113.3 124.23,113.88 124.81,114.74 125.01,115.75 124.81,116.76 124.23,117.62 123.37,118.19 122.36,118.39 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="135.59,118.39 134.58,118.19 133.72,117.62 133.15,116.76 132.94,115.75 133.15,114.74 133.72,113.88 134.58,113.3 135.59,113.1 135.59,113.1 136.6,113.3 137.46,113.88 138.03,114.74 138.24,115.75 138.03,116.76 137.46,117.62 136.6,118.19 135.59,118.39 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="148.82,118.39 147.81,118.19 146.95,117.62 146.37,116.76 146.17,115.75 146.37,114.74 146.95,113.88 147.81,113.3 148.82,113.1 148.82,113.1 149.83,113.3 150.69,113.88 151.26,114.74 151.46,115.75 151.26,116.76 150.69,117.62 149.83,118.19 148.82,118.39 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="122.36,125.01 121.35,124.81 120.49,124.23 119.92,123.37 119.72,122.36 119.92,121.35 120.49,120.49 121.35,119.92 122.36,119.72 135.59,119.72 136.6,119.92 137.46,120.49 138.03,121.35 138.24,122.36 138.03,123.37 137.46,124.23 136.6,124.81 135.59,125.01 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="128.98,131.62 127.96,131.42 127.11,130.85 126.53,129.99 126.33,128.98 126.53,127.96 127.11,127.11 127.96,126.53 128.98,126.33 135.59,126.33 136.6,126.53 137.46,127.11 138.03,127.96 138.24,128.98 138.03,129.99 137.46,130.85 136.6,131.42 135.59,131.62 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="135.59,138.24 134.58,138.03 133.72,137.46 133.15,136.6 132.94,135.59 133.15,134.58 133.72,133.72 134.58,133.15 135.59,132.94 135.59,132.94 136.6,133.15 137.46,133.72 138.03,134.58 138.24,135.59 138.03,136.6 137.46,137.46 136.6,138.03 135.59,138.24 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="142.2,144.85 141.19,144.65 140.33,144.08 139.76,143.22 139.56,142.2 139.76,141.19 140.33,140.33 141.19,139.76 142.2,139.56 142.2,139.56 143.22,139.76 144.08,140.33 144.65,141.19 144.85,142.2 144.65,143.22 144.08,144.08 143.22,144.65 142.2,144.85 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="66.8,23.15 67,22.14 67.58,21.28 68.44,20.71 69.45,20.5 70.46,20.71 71.32,21.28 71.89,22.14 72.09,23.15 72.09,23.15 71.89,24.16 71.32,25.02 70.46,25.59 69.45,25.8 68.44,25.59 67.58,25.02 67,24.16 66.8,23.15 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="66.8,36.38 67,35.37 67.58,34.51 68.44,33.93 69.45,33.73 70.46,33.93 71.32,34.51 71.89,35.37 72.09,36.38 72.09,36.38 71.89,37.39 71.32,38.25 70.46,38.82 69.45,39.02 68.44,38.82 67.58,38.25 67,37.39 66.8,36.38 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="66.8,49.61 67,48.59 67.58,47.74 68.44,47.16 69.45,46.96 70.46,47.16 71.32,47.74 71.89,48.59 72.09,49.61 72.09,56.22 71.89,57.23 71.32,58.09 70.46,58.66 69.45,58.87 68.44,58.66 67.58,58.09 67,57.23 66.8,56.22 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="66.8,95.91 67,94.89 67.58,94.03 68.44,93.46 69.45,93.26 70.46,93.46 71.32,94.03 71.89,94.89 72.09,95.91 72.09,109.13 71.89,110.15 71.32,111 70.46,111.58 69.45,111.78 68.44,111.58 67.58,111 67,110.15 66.8,109.13 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="66.8,122.36 67,121.35 67.58,120.49 68.44,119.92 69.45,119.72 70.46,119.92 71.32,120.49 71.89,121.35 72.09,122.36 72.09,148.82 71.89,149.83 71.32,150.69 70.46,151.26 69.45,151.46 68.44,151.26 67.58,150.69 67,149.83 66.8,148.82 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="73.42,23.15 73.62,22.14 74.19,21.28 75.05,20.71 76.06,20.5 77.08,20.71 77.93,21.28 78.51,22.14 78.71,23.15 78.71,23.15 78.51,24.16 77.93,25.02 77.08,25.59 76.06,25.8 75.05,25.59 74.19,25.02 73.62,24.16 73.42,23.15 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="73.42,36.38 73.62,35.37 74.19,34.51 75.05,33.93 76.06,33.73 77.08,33.93 77.93,34.51 78.51,35.37 78.71,36.38 78.71,42.99 78.51,44 77.93,44.86 77.08,45.44 76.06,45.64 75.05,45.44 74.19,44.86 73.62,44 73.42,42.99 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="73.42,62.83 73.62,61.82 74.19,60.96 75.05,60.39 76.06,60.19 77.08,60.39 77.93,60.96 78.51,61.82 78.71,62.83 78.71,62.83 78.51,63.85 77.93,64.71 77.08,65.28 76.06,65.48 75.05,65.28 74.19,64.71 73.62,63.85 73.42,62.83 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="73.42,95.91 73.62,94.89 74.19,94.03 75.05,93.46 76.06,93.26 77.08,93.46 77.93,94.03 78.51,94.89 78.71,95.91 78.71,95.91 78.51,96.92 77.93,97.78 77.08,98.35 76.06,98.55 75.05,98.35 74.19,97.78 73.62,96.92 73.42,95.91 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="73.42,115.75 73.62,114.74 74.19,113.88 75.05,113.3 76.06,113.1 77.08,113.3 77.93,113.88 78.51,114.74 78.71,115.75 78.71,135.59 78.51,136.6 77.93,137.46 77.08,138.03 76.06,138.24 75.05,138.03 74.19,137.46 73.62,136.6 73.42,135.59 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="73.42,148.82 73.62,147.81 74.19,146.95 75.05,146.37 76.06,146.17 77.08,146.37 77.93,146.95 78.51,147.81 78.71,148.82 78.71,148.82 78.51,149.83 77.93,150.69 77.08,151.26 76.06,151.46 75.05,151.26 74.19,150.69 73.62,149.83 73.42,148.82 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="80.03,16.54 80.23,15.52 80.81,14.66 81.66,14.09 82.68,13.89 83.69,14.09 84.55,14.66 85.12,15.52 85.32,16.54 85.32,29.76 85.12,30.78 84.55,31.63 83.69,32.21 82.68,32.41 81.66,32.21 80.81,31.63 80.23,30.78 80.03,29.76 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="80.03,56.22 80.23,55.21 80.81,54.35 81.66,53.78 82.68,53.57 83.69,53.78 84.55,54.35 85.12,55.21 85.32,56.22 85.32,56.22 85.12,57.23 84.55,58.09 83.69,58.66 82.68,58.87 81.66,58.66 80.81,58.09 80.23,57.23 80.03,56.22 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="80.03,102.52 80.23,101.51 80.81,100.65 81.66,100.08 82.68,99.87 83.69,100.08 84.55,100.65 85.12,101.51 85.32,102.52 85.32,102.52 85.12,103.53 84.55,104.39 83.69,104.96 82.68,105.17 81.66,104.96 80.81,104.39 80.23,103.53 80.03,102.52 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="80.03,115.75 80.23,114.74 80.81,113.88 81.66,113.3 82.68,113.1 83.69,113.3 84.55,113.88 85.12,114.74 85.32,115.75 85.32,122.36 85.12,123.37 84.55,124.23 83.69,124.81 82.68,125.01 81.66,124.81 80.81,124.23 80.23,123.37 80.03,122.36 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="80.03,142.2 80.23,141.19 80.81,140.33 81.66,139.76 82.68,139.56 83.69,139.76 84.55,140.33 85.12,141.19 85.32,142.2 85.32,148.82 85.12,149.83 84.55,150.69 83.69,151.26 82.68,151.46 81.66,151.26 80.81,150.69 80.23,149.83 80.03,148.82 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="86.65,16.54 86.85,15.52 87.42,14.66 88.28,14.09 89.29,13.89 90.3,14.09 91.16,14.66 91.74,15.52 91.94,16.54 91.94,16.54 91.74,17.55 91.16,18.41 90.3,18.98 89.29,19.18 88.28,18.98 87.42,18.41 86.85,17.55 86.65,16.54 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="86.65,29.76 86.85,28.75 87.42,27.89 88.28,27.32 89.29,27.12 90.3,27.32 91.16,27.89 91.74,28.75 91.94,29.76 91.94,29.76 91.74,30.78 91.16,31.63 90.3,32.21 89.29,32.41 88.28,32.21 87.42,31.63 86.85,30.78 86.65,29.76 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="86.65,49.61 86.85,48.59 87.42,47.74 88.28,47.16 89.29,46.96 90.3,47.16 91.16,47.74 91.74,48.59 91.94,49.61 91.94,49.61 91.74,50.62 91.16,51.48 90.3,52.05 89.29,52.25 88.28,52.05 87.42,51.48 86.85,50.62 86.65,49.61 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="86.65,69.45 86.85,68.44 87.42,67.58 88.28,67 89.29,66.8 90.3,67 91.16,67.58 91.74,68.44 91.94,69.45 91.94,69.45 91.74,70.46 91.16,71.32 90.3,71.89 89.29,72.09 88.28,71.89 87.42,71.32 86.85,70.46 86.65,69.45 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="86.65,89.29 86.85,88.28 87.42,87.42 88.28,86.85 89.29,86.65 90.3,86.85 91.16,87.42 91.74,88.28 91.94,89.29 91.94,89.29 91.74,90.3 91.16,91.16 90.3,91.74 89.29,91.94 88.28,91.74 87.42,91.16 86.85,90.3 86.65,89.29 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="86.65,109.13 86.85,108.12 87.42,107.26 88.28,106.69 89.29,106.49 90.3,106.69 91.16,107.26 91.74,108.12 91.94,109.13 91.94,109.13 91.74,110.15 91.16,111 90.3,111.58 89.29,111.78 88.28,111.58 87.42,111 86.85,110.15 86.65,109.13 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="86.65,122.36 86.85,121.35 87.42,120.49 88.28,119.92 89.29,119.72 90.3,119.92 91.16,120.49 91.74,121.35 91.94,122.36 91.94,128.98 91.74,129.99 91.16,130.85 90.3,131.42 89.29,131.62 88.28,131.42 87.42,130.85 86.85,129.99 86.65,128.98 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="86.65,142.2 86.85,141.19 87.42,140.33 88.28,139.76 89.29,139.56 90.3,139.76 91.16,140.33 91.74,141.19 91.94,142.2 91.94,142.2 91.74,143.22 91.16,144.08 90.3,144.65 89.29,144.85 88.28,144.65 87.42,144.08 86.85,143.22 86.65,142.2 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="93.26,16.54 93.46,15.52 94.03,14.66 94.89,14.09 95.91,13.89 96.92,14.09 97.78,14.66 98.35,15.52 98.55,16.54 98.55,42.99 98.35,44 97.78,44.86 96.92,45.44 95.91,45.64 94.89,45.44 94.03,44.86 93.46,44 93.26,42.99 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="93.26,56.22 93.46,55.21 94.03,54.35 94.89,53.78 95.91,53.57 96.92,53.78 97.78,54.35 98.35,55.21 98.55,56.22 98.55,56.22 98.35,57.23 97.78,58.09 96.92,58.66 95.91,58.87 94.89,58.66 94.03,58.09 93.46,57.23 93.26,56.22 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="93.26,95.91 93.46,94.89 94.03,94.03 94.89,93.46 95.91,93.26 96.92,93.46 97.78,94.03 98.35,94.89 98.55,95.91 98.55,102.52 98.35,103.53 97.78,104.39 96.92,104.96 95.91,105.17 94.89,104.96 94.03,104.39 93.46,103.53 93.26,102.52 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="93.26,128.98 93.46,127.96 94.03,127.11 94.89,126.53 95.91,126.33 96.92,126.53 97.78,127.11 98.35,127.96 98.55,128.98 98.55,148.82 98.35,149.83 97.78,150.69 96.92,151.26 95.91,151.46 94.89,151.26 94.03,150.69 93.46,149.83 93.26,148.82 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="99.87,109.13 100.08,108.12 100.65,107.26 101.51,106.69 102.52,106.49 103.53,106.69 104.39,107.26 104.96,108.12 105.17,109.13 105.17,109.13 104.96,110.15 104.39,111 103.53,111.58 102.52,111.78 101.51,111.58 100.65,111 100.08,110.15 99.87,109.13 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="99.87,122.36 100.08,121.35 100.65,120.49 101.51,119.92 102.52,119.72 103.53,119.92 104.39,120.49 104.96,121.35 105.17,122.36 105.17,128.98 104.96,129.99 104.39,130.85 103.53,131.42 102.52,131.62 101.51,131.42 100.65,130.85 100.08,129.99 99.87,128.98 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="99.87,142.2 100.08,141.19 100.65,140.33 101.51,139.76 102.52,139.56 103.53,139.76 104.39,140.33 104.96,141.19 105.17,142.2 105.17,142.2 104.96,143.22 104.39,144.08 103.53,144.65 102.52,144.85 101.51,144.65 100.65,144.08 100.08,143.22 99.87,142.2 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="106.49,128.98 106.69,127.96 107.26,127.11 108.12,126.53 109.13,126.33 110.15,126.53 111,127.11 111.58,127.96 111.78,128.98 111.78,142.2 111.58,143.22 111,144.08 110.15,144.65 109.13,144.85 108.12,144.65 107.26,144.08 106.69,143.22 106.49,142.2 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="113.1,115.75 113.3,114.74 113.88,113.88 114.74,113.3 115.75,113.1 116.76,113.3 117.62,113.88 118.19,114.74 118.39,115.75 118.39,115.75 118.19,116.76 117.62,117.62 116.76,118.19 115.75,118.39 114.74,118.19 113.88,117.62 113.3,116.76 113.1,115.75 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="113.1,128.98 113.3,127.96 113.88,127.11 114.74,126.53 115.75,126.33 116.76,126.53 117.62,127.11 118.19,127.96 118.39,128.98 118.39,148.82 118.19,149.83 117.62,150.69 116.76,151.26 115.75,151.46 114.74,151.26 113.88,150.69 113.3,149.83 113.1,148.82 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="119.72,122.36 119.92,121.35 120.49,120.49 121.35,119.92 122.36,119.72 123.37,119.92 124.23,120.49 124.81,121.35 125.01,122.36 125.01,122.36 124.81,123.37 124.23,124.23 123.37,124.81 122.36,125.01 121.35,124.81 120.49,124.23 119.92,123.37 119.72,122.36 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="119.72,142.2 119.92,141.19 120.49,140.33 121.35,139.76 122.36,139.56 123.37,139.76 124.23,140.33 124.81,141.19 125.01,142.2 125.01,142.2 124.81,143.22 124.23,144.08 123.37,144.65 122.36,144.85 121.35,144.65 120.49,144.08 119.92,143.22 119.72,142.2 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="126.33,128.98 126.53,127.96 127.11,127.11 127.96,126.53 128.98,126.33 129.99,126.53 130.85,127.11 131.42,127.96 131.62,128.98 131.62,135.59 131.42,136.6 130.85,137.46 129.99,138.03 128.98,138.24 127.96,138.03 127.11,137.46 126.53,136.6 126.33,135.59 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="132.94,135.59 133.15,134.58 133.72,133.72 134.58,133.15 135.59,132.94 136.6,133.15 137.46,133.72 138.03,134.58 138.24,135.59 138.24,148.82 138.03,149.83 137.46,150.69 136.6,151.26 135.59,151.46 134.58,151.26 133.72,150.69 133.15,149.83 132.94,148.82 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
          <polygon
            points="139.56,142.2 139.76,141.19 140.33,140.33 141.19,139.76 142.2,139.56 143.22,139.76 144.08,140.33 144.65,141.19 144.85,142.2 144.85,142.2 144.65,143.22 144.08,144.08 143.22,144.65 142.2,144.85 141.19,144.65 140.33,144.08 139.76,143.22 139.56,142.2 "
            style="fill:url(#gradient6a46f7652d584c37a6ba75a90d08d89b);"
          />
      `,
            },
            {
                value: 20,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(37,86,99,1);"
            shape-rendering="crispEdges"
          />
          <linearGradient
            id="gradient3449309bbfd94eed961adfc4a828ceb6"
            gradientUnits="userSpaceOnUse"
            x1="7.72605761144101"
            y1="76.1197884622769"
            x2="157.628262914682"
            y2="89.2345320638461"
          >
            <stop offset="0%" stop-color="#FF93FB" />
            <stop offset="100%" stop-color="#FF9393" />
          </linearGradient>
          <polygon
            points="13.23,29.76 13.55,26.54 14.49,23.44 16.02,20.58 18.07,18.07 20.58,16.02 23.44,14.49 26.54,13.55 29.76,13.23 59.53,13.23 59.53,59.53 13.23,59.53 13.23,29.76 19.84,29.76 19.84,52.91 52.91,52.91 52.91,19.84 29.76,19.84 27.2,20.18 24.8,21.17 22.75,22.75 21.17,24.8 20.18,27.2 19.84,29.76 "
            style="fill:url(#gradient3449309bbfd94eed961adfc4a828ceb6);"
          />
          <polygon
            points="13.23,122.36 13.23,105.83 59.53,105.83 59.53,152.13 29.76,152.13 26.54,151.81 23.44,150.87 20.58,149.34 18.07,147.28 16.02,144.78 14.49,141.92 13.55,138.82 13.23,135.59 13.23,122.36 19.84,122.36 19.84,135.59 20.18,138.16 21.17,140.55 22.75,142.61 24.8,144.18 27.2,145.17 29.76,145.51 52.91,145.51 52.91,112.44 19.84,112.44 19.84,122.36 "
            style="fill:url(#gradient3449309bbfd94eed961adfc4a828ceb6);"
          />
          <polygon
            points="105.83,29.76 105.83,13.23 135.59,13.23 138.82,13.55 141.92,14.49 144.78,16.02 147.28,18.07 149.34,20.58 150.87,23.44 151.81,26.54 152.13,29.76 152.13,59.53 105.83,59.53 105.83,29.76 112.44,29.76 112.44,52.91 145.51,52.91 145.51,29.76 145.17,27.2 144.18,24.8 142.61,22.75 140.55,21.17 138.16,20.18 135.59,19.84 112.44,19.84 112.44,29.76 "
            style="fill:url(#gradient3449309bbfd94eed961adfc4a828ceb6);"
          />
          <pattern
            id="glass707f0bfb55ce441694040af327da98a2"
            x="26.45669"
            y="26.45669"
            width="112.4409"
            height="112.4409"
            patternUnits="userSpaceOnUse"
          >
            <rect x="0" y="0" width="112.4409" height="112.4409" style="fill:rgb(147,255,255);fill-opacity:1;" />
            <rect x="0" y="0" width="112.4409" height="56.22047" style="fill:rgb(159,255,255);fill-opacity:1;" />
          </pattern>
          <polygon
            points="46.3,36.38 46.11,38.31 45.54,40.17 44.63,41.89 43.39,43.39 41.89,44.63 40.17,45.54 38.31,46.11 36.38,46.3 34.44,46.11 32.58,45.54 30.87,44.63 29.36,43.39 28.13,41.89 27.21,40.17 26.65,38.31 26.46,36.38 26.65,34.44 27.21,32.58 28.13,30.87 29.36,29.36 30.87,28.13 32.58,27.21 34.44,26.65 36.38,26.46 38.31,26.65 40.17,27.21 41.89,28.13 43.39,29.36 44.63,30.87 45.54,32.58 46.11,34.44 46.3,36.38 "
            style="fill:url(#glass707f0bfb55ce441694040af327da98a2);"
          />
          <polygon
            points="46.3,128.98 46.11,130.91 45.54,132.77 44.63,134.49 43.39,135.99 41.89,137.23 40.17,138.14 38.31,138.71 36.38,138.9 34.44,138.71 32.58,138.14 30.87,137.23 29.36,135.99 28.13,134.49 27.21,132.77 26.65,130.91 26.46,128.98 26.65,127.04 27.21,125.18 28.13,123.46 29.36,121.96 30.87,120.73 32.58,119.81 34.44,119.25 36.38,119.06 38.31,119.25 40.17,119.81 41.89,120.73 43.39,121.96 44.63,123.46 45.54,125.18 46.11,127.04 46.3,128.98 "
            style="fill:url(#glass707f0bfb55ce441694040af327da98a2);"
          />
          <polygon
            points="138.9,36.38 138.71,38.31 138.14,40.17 137.23,41.89 135.99,43.39 134.49,44.63 132.77,45.54 130.91,46.11 128.98,46.3 127.04,46.11 125.18,45.54 123.46,44.63 121.96,43.39 120.73,41.89 119.81,40.17 119.25,38.31 119.06,36.38 119.25,34.44 119.81,32.58 120.73,30.87 121.96,29.36 123.46,28.13 125.18,27.21 127.04,26.65 128.98,26.46 130.91,26.65 132.77,27.21 134.49,28.13 135.99,29.36 137.23,30.87 138.14,32.58 138.71,34.44 138.9,36.38 "
            style="fill:url(#glass707f0bfb55ce441694040af327da98a2);"
          />
          <linearGradient
            id="gradient230bd81be3cd4d5c8b2e8d6590a4404d"
            gradientUnits="userSpaceOnUse"
            x1="13.889762878418"
            y1="82.6771621704102"
            x2="151.464561462402"
            y2="82.6771621704102"
          >
            <stop offset="0%" stop-color="#FF9393" />
            <stop offset="50%" stop-color="#DBEEF3" />
            <stop offset="100%" stop-color="#FF9393" />
          </linearGradient>
          <polygon
            points="82.68,19.18 81.66,18.98 80.81,18.41 80.23,17.55 80.03,16.54 80.23,15.52 80.81,14.66 81.66,14.09 82.68,13.89 95.91,13.89 96.92,14.09 97.78,14.66 98.35,15.52 98.55,16.54 98.35,17.55 97.78,18.41 96.92,18.98 95.91,19.18 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="69.45,25.8 68.44,25.59 67.58,25.02 67,24.16 66.8,23.15 67,22.14 67.58,21.28 68.44,20.71 69.45,20.5 82.68,20.5 83.69,20.71 84.55,21.28 85.12,22.14 85.32,23.15 85.12,24.16 84.55,25.02 83.69,25.59 82.68,25.8 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="95.91,25.8 94.89,25.59 94.03,25.02 93.46,24.16 93.26,23.15 93.46,22.14 94.03,21.28 94.89,20.71 95.91,20.5 95.91,20.5 96.92,20.71 97.78,21.28 98.35,22.14 98.55,23.15 98.35,24.16 97.78,25.02 96.92,25.59 95.91,25.8 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="82.68,32.41 81.66,32.21 80.81,31.63 80.23,30.78 80.03,29.76 80.23,28.75 80.81,27.89 81.66,27.32 82.68,27.12 95.91,27.12 96.92,27.32 97.78,27.89 98.35,28.75 98.55,29.76 98.35,30.78 97.78,31.63 96.92,32.21 95.91,32.41 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="69.45,39.02 68.44,38.82 67.58,38.25 67,37.39 66.8,36.38 67,35.37 67.58,34.51 68.44,33.93 69.45,33.73 76.06,33.73 77.08,33.93 77.93,34.51 78.51,35.37 78.71,36.38 78.51,37.39 77.93,38.25 77.08,38.82 76.06,39.02 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="95.91,39.02 94.89,38.82 94.03,38.25 93.46,37.39 93.26,36.38 93.46,35.37 94.03,34.51 94.89,33.93 95.91,33.73 95.91,33.73 96.92,33.93 97.78,34.51 98.35,35.37 98.55,36.38 98.35,37.39 97.78,38.25 96.92,38.82 95.91,39.02 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="76.06,45.64 75.05,45.44 74.19,44.86 73.62,44 73.42,42.99 73.62,41.98 74.19,41.12 75.05,40.55 76.06,40.35 76.06,40.35 77.08,40.55 77.93,41.12 78.51,41.98 78.71,42.99 78.51,44 77.93,44.86 77.08,45.44 76.06,45.64 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="95.91,45.64 94.89,45.44 94.03,44.86 93.46,44 93.26,42.99 93.46,41.98 94.03,41.12 94.89,40.55 95.91,40.35 95.91,40.35 96.92,40.55 97.78,41.12 98.35,41.98 98.55,42.99 98.35,44 97.78,44.86 96.92,45.44 95.91,45.64 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="69.45,52.25 68.44,52.05 67.58,51.48 67,50.62 66.8,49.61 67,48.59 67.58,47.74 68.44,47.16 69.45,46.96 69.45,46.96 70.46,47.16 71.32,47.74 71.89,48.59 72.09,49.61 71.89,50.62 71.32,51.48 70.46,52.05 69.45,52.25 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="89.29,52.25 88.28,52.05 87.42,51.48 86.85,50.62 86.65,49.61 86.85,48.59 87.42,47.74 88.28,47.16 89.29,46.96 89.29,46.96 90.3,47.16 91.16,47.74 91.74,48.59 91.94,49.61 91.74,50.62 91.16,51.48 90.3,52.05 89.29,52.25 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="69.45,58.87 68.44,58.66 67.58,58.09 67,57.23 66.8,56.22 67,55.21 67.58,54.35 68.44,53.78 69.45,53.57 69.45,53.57 70.46,53.78 71.32,54.35 71.89,55.21 72.09,56.22 71.89,57.23 71.32,58.09 70.46,58.66 69.45,58.87 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="82.68,58.87 81.66,58.66 80.81,58.09 80.23,57.23 80.03,56.22 80.23,55.21 80.81,54.35 81.66,53.78 82.68,53.57 82.68,53.57 83.69,53.78 84.55,54.35 85.12,55.21 85.32,56.22 85.12,57.23 84.55,58.09 83.69,58.66 82.68,58.87 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="95.91,58.87 94.89,58.66 94.03,58.09 93.46,57.23 93.26,56.22 93.46,55.21 94.03,54.35 94.89,53.78 95.91,53.57 95.91,53.57 96.92,53.78 97.78,54.35 98.35,55.21 98.55,56.22 98.35,57.23 97.78,58.09 96.92,58.66 95.91,58.87 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="76.06,65.48 75.05,65.28 74.19,64.71 73.62,63.85 73.42,62.83 73.62,61.82 74.19,60.96 75.05,60.39 76.06,60.19 76.06,60.19 77.08,60.39 77.93,60.96 78.51,61.82 78.71,62.83 78.51,63.85 77.93,64.71 77.08,65.28 76.06,65.48 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="69.45,72.09 68.44,71.89 67.58,71.32 67,70.46 66.8,69.45 67,68.44 67.58,67.58 68.44,67 69.45,66.8 69.45,66.8 70.46,67 71.32,67.58 71.89,68.44 72.09,69.45 71.89,70.46 71.32,71.32 70.46,71.89 69.45,72.09 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="89.29,72.09 88.28,71.89 87.42,71.32 86.85,70.46 86.65,69.45 86.85,68.44 87.42,67.58 88.28,67 89.29,66.8 89.29,66.8 90.3,67 91.16,67.58 91.74,68.44 91.94,69.45 91.74,70.46 91.16,71.32 90.3,71.89 89.29,72.09 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="76.06,78.71 75.05,78.51 74.19,77.93 73.62,77.08 73.42,76.06 73.62,75.05 74.19,74.19 75.05,73.62 76.06,73.42 76.06,73.42 77.08,73.62 77.93,74.19 78.51,75.05 78.71,76.06 78.51,77.08 77.93,77.93 77.08,78.51 76.06,78.71 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="89.29,78.71 88.28,78.51 87.42,77.93 86.85,77.08 86.65,76.06 86.85,75.05 87.42,74.19 88.28,73.62 89.29,73.42 89.29,73.42 90.3,73.62 91.16,74.19 91.74,75.05 91.94,76.06 91.74,77.08 91.16,77.93 90.3,78.51 89.29,78.71 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="89.29,91.94 88.28,91.74 87.42,91.16 86.85,90.3 86.65,89.29 86.85,88.28 87.42,87.42 88.28,86.85 89.29,86.65 89.29,86.65 90.3,86.85 91.16,87.42 91.74,88.28 91.94,89.29 91.74,90.3 91.16,91.16 90.3,91.74 89.29,91.94 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="69.45,98.55 68.44,98.35 67.58,97.78 67,96.92 66.8,95.91 67,94.89 67.58,94.03 68.44,93.46 69.45,93.26 76.06,93.26 77.08,93.46 77.93,94.03 78.51,94.89 78.71,95.91 78.51,96.92 77.93,97.78 77.08,98.35 76.06,98.55 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="95.91,98.55 94.89,98.35 94.03,97.78 93.46,96.92 93.26,95.91 93.46,94.89 94.03,94.03 94.89,93.46 95.91,93.26 95.91,93.26 96.92,93.46 97.78,94.03 98.35,94.89 98.55,95.91 98.35,96.92 97.78,97.78 96.92,98.35 95.91,98.55 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="69.45,105.17 68.44,104.96 67.58,104.39 67,103.53 66.8,102.52 67,101.51 67.58,100.65 68.44,100.08 69.45,99.87 69.45,99.87 70.46,100.08 71.32,100.65 71.89,101.51 72.09,102.52 71.89,103.53 71.32,104.39 70.46,104.96 69.45,105.17 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="82.68,105.17 81.66,104.96 80.81,104.39 80.23,103.53 80.03,102.52 80.23,101.51 80.81,100.65 81.66,100.08 82.68,99.87 82.68,99.87 83.69,100.08 84.55,100.65 85.12,101.51 85.32,102.52 85.12,103.53 84.55,104.39 83.69,104.96 82.68,105.17 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="95.91,105.17 94.89,104.96 94.03,104.39 93.46,103.53 93.26,102.52 93.46,101.51 94.03,100.65 94.89,100.08 95.91,99.87 95.91,99.87 96.92,100.08 97.78,100.65 98.35,101.51 98.55,102.52 98.35,103.53 97.78,104.39 96.92,104.96 95.91,105.17 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="69.45,111.78 68.44,111.58 67.58,111 67,110.15 66.8,109.13 67,108.12 67.58,107.26 68.44,106.69 69.45,106.49 69.45,106.49 70.46,106.69 71.32,107.26 71.89,108.12 72.09,109.13 71.89,110.15 71.32,111 70.46,111.58 69.45,111.78 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="89.29,111.78 88.28,111.58 87.42,111 86.85,110.15 86.65,109.13 86.85,108.12 87.42,107.26 88.28,106.69 89.29,106.49 89.29,106.49 90.3,106.69 91.16,107.26 91.74,108.12 91.94,109.13 91.74,110.15 91.16,111 90.3,111.58 89.29,111.78 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="102.52,111.78 101.51,111.58 100.65,111 100.08,110.15 99.87,109.13 100.08,108.12 100.65,107.26 101.51,106.69 102.52,106.49 102.52,106.49 103.53,106.69 104.39,107.26 104.96,108.12 105.17,109.13 104.96,110.15 104.39,111 103.53,111.58 102.52,111.78 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="76.06,118.39 75.05,118.19 74.19,117.62 73.62,116.76 73.42,115.75 73.62,114.74 74.19,113.88 75.05,113.3 76.06,113.1 82.68,113.1 83.69,113.3 84.55,113.88 85.12,114.74 85.32,115.75 85.12,116.76 84.55,117.62 83.69,118.19 82.68,118.39 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="115.75,118.39 114.74,118.19 113.88,117.62 113.3,116.76 113.1,115.75 113.3,114.74 113.88,113.88 114.74,113.3 115.75,113.1 115.75,113.1 116.76,113.3 117.62,113.88 118.19,114.74 118.39,115.75 118.19,116.76 117.62,117.62 116.76,118.19 115.75,118.39 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="69.45,125.01 68.44,124.81 67.58,124.23 67,123.37 66.8,122.36 67,121.35 67.58,120.49 68.44,119.92 69.45,119.72 89.29,119.72 90.3,119.92 91.16,120.49 91.74,121.35 91.94,122.36 91.74,123.37 91.16,124.23 90.3,124.81 89.29,125.01 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="102.52,125.01 101.51,124.81 100.65,124.23 100.08,123.37 99.87,122.36 100.08,121.35 100.65,120.49 101.51,119.92 102.52,119.72 102.52,119.72 103.53,119.92 104.39,120.49 104.96,121.35 105.17,122.36 104.96,123.37 104.39,124.23 103.53,124.81 102.52,125.01 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="122.36,125.01 121.35,124.81 120.49,124.23 119.92,123.37 119.72,122.36 119.92,121.35 120.49,120.49 121.35,119.92 122.36,119.72 122.36,119.72 123.37,119.92 124.23,120.49 124.81,121.35 125.01,122.36 124.81,123.37 124.23,124.23 123.37,124.81 122.36,125.01 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="69.45,131.62 68.44,131.42 67.58,130.85 67,129.99 66.8,128.98 67,127.96 67.58,127.11 68.44,126.53 69.45,126.33 76.06,126.33 77.08,126.53 77.93,127.11 78.51,127.96 78.71,128.98 78.51,129.99 77.93,130.85 77.08,131.42 76.06,131.62 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="89.29,131.62 88.28,131.42 87.42,130.85 86.85,129.99 86.65,128.98 86.85,127.96 87.42,127.11 88.28,126.53 89.29,126.33 115.75,126.33 116.76,126.53 117.62,127.11 118.19,127.96 118.39,128.98 118.19,129.99 117.62,130.85 116.76,131.42 115.75,131.62 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="128.98,131.62 127.96,131.42 127.11,130.85 126.53,129.99 126.33,128.98 126.53,127.96 127.11,127.11 127.96,126.53 128.98,126.33 128.98,126.33 129.99,126.53 130.85,127.11 131.42,127.96 131.62,128.98 131.42,129.99 130.85,130.85 129.99,131.42 128.98,131.62 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="69.45,138.24 68.44,138.03 67.58,137.46 67,136.6 66.8,135.59 67,134.58 67.58,133.72 68.44,133.15 69.45,132.94 76.06,132.94 77.08,133.15 77.93,133.72 78.51,134.58 78.71,135.59 78.51,136.6 77.93,137.46 77.08,138.03 76.06,138.24 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="95.91,138.24 94.89,138.03 94.03,137.46 93.46,136.6 93.26,135.59 93.46,134.58 94.03,133.72 94.89,133.15 95.91,132.94 95.91,132.94 96.92,133.15 97.78,133.72 98.35,134.58 98.55,135.59 98.35,136.6 97.78,137.46 96.92,138.03 95.91,138.24 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="109.13,138.24 108.12,138.03 107.26,137.46 106.69,136.6 106.49,135.59 106.69,134.58 107.26,133.72 108.12,133.15 109.13,132.94 115.75,132.94 116.76,133.15 117.62,133.72 118.19,134.58 118.39,135.59 118.19,136.6 117.62,137.46 116.76,138.03 115.75,138.24 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="128.98,138.24 127.96,138.03 127.11,137.46 126.53,136.6 126.33,135.59 126.53,134.58 127.11,133.72 127.96,133.15 128.98,132.94 135.59,132.94 136.6,133.15 137.46,133.72 138.03,134.58 138.24,135.59 138.03,136.6 137.46,137.46 136.6,138.03 135.59,138.24 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="69.45,144.85 68.44,144.65 67.58,144.08 67,143.22 66.8,142.2 67,141.19 67.58,140.33 68.44,139.76 69.45,139.56 69.45,139.56 70.46,139.76 71.32,140.33 71.89,141.19 72.09,142.2 71.89,143.22 71.32,144.08 70.46,144.65 69.45,144.85 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="82.68,144.85 81.66,144.65 80.81,144.08 80.23,143.22 80.03,142.2 80.23,141.19 80.81,140.33 81.66,139.76 82.68,139.56 122.36,139.56 123.37,139.76 124.23,140.33 124.81,141.19 125.01,142.2 124.81,143.22 124.23,144.08 123.37,144.65 122.36,144.85 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="135.59,144.85 134.58,144.65 133.72,144.08 133.15,143.22 132.94,142.2 133.15,141.19 133.72,140.33 134.58,139.76 135.59,139.56 142.2,139.56 143.22,139.76 144.08,140.33 144.65,141.19 144.85,142.2 144.65,143.22 144.08,144.08 143.22,144.65 142.2,144.85 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="69.45,151.46 68.44,151.26 67.58,150.69 67,149.83 66.8,148.82 67,147.81 67.58,146.95 68.44,146.37 69.45,146.17 82.68,146.17 83.69,146.37 84.55,146.95 85.12,147.81 85.32,148.82 85.12,149.83 84.55,150.69 83.69,151.26 82.68,151.46 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="95.91,151.46 94.89,151.26 94.03,150.69 93.46,149.83 93.26,148.82 93.46,147.81 94.03,146.95 94.89,146.37 95.91,146.17 95.91,146.17 96.92,146.37 97.78,146.95 98.35,147.81 98.55,148.82 98.35,149.83 97.78,150.69 96.92,151.26 95.91,151.46 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="115.75,151.46 114.74,151.26 113.88,150.69 113.3,149.83 113.1,148.82 113.3,147.81 113.88,146.95 114.74,146.37 115.75,146.17 115.75,146.17 116.76,146.37 117.62,146.95 118.19,147.81 118.39,148.82 118.19,149.83 117.62,150.69 116.76,151.26 115.75,151.46 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="135.59,151.46 134.58,151.26 133.72,150.69 133.15,149.83 132.94,148.82 133.15,147.81 133.72,146.95 134.58,146.37 135.59,146.17 135.59,146.17 136.6,146.37 137.46,146.95 138.03,147.81 138.24,148.82 138.03,149.83 137.46,150.69 136.6,151.26 135.59,151.46 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="13.89,69.45 14.09,68.44 14.66,67.58 15.52,67 16.54,66.8 17.55,67 18.41,67.58 18.98,68.44 19.18,69.45 19.18,76.06 18.98,77.08 18.41,77.93 17.55,78.51 16.54,78.71 15.52,78.51 14.66,77.93 14.09,77.08 13.89,76.06 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="13.89,89.29 14.09,88.28 14.66,87.42 15.52,86.85 16.54,86.65 17.55,86.85 18.41,87.42 18.98,88.28 19.18,89.29 19.18,89.29 18.98,90.3 18.41,91.16 17.55,91.74 16.54,91.94 15.52,91.74 14.66,91.16 14.09,90.3 13.89,89.29 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="20.5,69.45 20.71,68.44 21.28,67.58 22.14,67 23.15,66.8 24.16,67 25.02,67.58 25.59,68.44 25.8,69.45 25.8,76.06 25.59,77.08 25.02,77.93 24.16,78.51 23.15,78.71 22.14,78.51 21.28,77.93 20.71,77.08 20.5,76.06 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="20.5,95.91 20.71,94.89 21.28,94.03 22.14,93.46 23.15,93.26 24.16,93.46 25.02,94.03 25.59,94.89 25.8,95.91 25.8,95.91 25.59,96.92 25.02,97.78 24.16,98.35 23.15,98.55 22.14,98.35 21.28,97.78 20.71,96.92 20.5,95.91 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="27.12,69.45 27.32,68.44 27.89,67.58 28.75,67 29.76,66.8 30.78,67 31.63,67.58 32.21,68.44 32.41,69.45 32.41,82.68 32.21,83.69 31.63,84.55 30.78,85.12 29.76,85.32 28.75,85.12 27.89,84.55 27.32,83.69 27.12,82.68 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="33.73,69.45 33.93,68.44 34.51,67.58 35.37,67 36.38,66.8 37.39,67 38.25,67.58 38.82,68.44 39.02,69.45 39.02,69.45 38.82,70.46 38.25,71.32 37.39,71.89 36.38,72.09 35.37,71.89 34.51,71.32 33.93,70.46 33.73,69.45 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="33.73,89.29 33.93,88.28 34.51,87.42 35.37,86.85 36.38,86.65 37.39,86.85 38.25,87.42 38.82,88.28 39.02,89.29 39.02,95.91 38.82,96.92 38.25,97.78 37.39,98.35 36.38,98.55 35.37,98.35 34.51,97.78 33.93,96.92 33.73,95.91 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="40.35,69.45 40.55,68.44 41.12,67.58 41.98,67 42.99,66.8 44,67 44.86,67.58 45.44,68.44 45.64,69.45 45.64,69.45 45.44,70.46 44.86,71.32 44,71.89 42.99,72.09 41.98,71.89 41.12,71.32 40.55,70.46 40.35,69.45 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="40.35,82.68 40.55,81.66 41.12,80.81 41.98,80.23 42.99,80.03 44,80.23 44.86,80.81 45.44,81.66 45.64,82.68 45.64,82.68 45.44,83.69 44.86,84.55 44,85.12 42.99,85.32 41.98,85.12 41.12,84.55 40.55,83.69 40.35,82.68 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="40.35,95.91 40.55,94.89 41.12,94.03 41.98,93.46 42.99,93.26 44,93.46 44.86,94.03 45.44,94.89 45.64,95.91 45.64,95.91 45.44,96.92 44.86,97.78 44,98.35 42.99,98.55 41.98,98.35 41.12,97.78 40.55,96.92 40.35,95.91 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="46.96,76.06 47.16,75.05 47.74,74.19 48.59,73.62 49.61,73.42 50.62,73.62 51.48,74.19 52.05,75.05 52.25,76.06 52.25,82.68 52.05,83.69 51.48,84.55 50.62,85.12 49.61,85.32 48.59,85.12 47.74,84.55 47.16,83.69 46.96,82.68 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="53.57,69.45 53.78,68.44 54.35,67.58 55.21,67 56.22,66.8 57.23,67 58.09,67.58 58.66,68.44 58.87,69.45 58.87,69.45 58.66,70.46 58.09,71.32 57.23,71.89 56.22,72.09 55.21,71.89 54.35,71.32 53.78,70.46 53.57,69.45 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="53.57,82.68 53.78,81.66 54.35,80.81 55.21,80.23 56.22,80.03 57.23,80.23 58.09,80.81 58.66,81.66 58.87,82.68 58.87,82.68 58.66,83.69 58.09,84.55 57.23,85.12 56.22,85.32 55.21,85.12 54.35,84.55 53.78,83.69 53.57,82.68 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="53.57,95.91 53.78,94.89 54.35,94.03 55.21,93.46 56.22,93.26 57.23,93.46 58.09,94.03 58.66,94.89 58.87,95.91 58.87,95.91 58.66,96.92 58.09,97.78 57.23,98.35 56.22,98.55 55.21,98.35 54.35,97.78 53.78,96.92 53.57,95.91 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="60.19,69.45 60.39,68.44 60.96,67.58 61.82,67 62.83,66.8 63.85,67 64.71,67.58 65.28,68.44 65.48,69.45 65.48,76.06 65.28,77.08 64.71,77.93 63.85,78.51 62.83,78.71 61.82,78.51 60.96,77.93 60.39,77.08 60.19,76.06 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="66.8,69.45 67,68.44 67.58,67.58 68.44,67 69.45,66.8 70.46,67 71.32,67.58 71.89,68.44 72.09,69.45 72.09,69.45 71.89,70.46 71.32,71.32 70.46,71.89 69.45,72.09 68.44,71.89 67.58,71.32 67,70.46 66.8,69.45 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="66.8,82.68 67,81.66 67.58,80.81 68.44,80.23 69.45,80.03 70.46,80.23 71.32,80.81 71.89,81.66 72.09,82.68 72.09,82.68 71.89,83.69 71.32,84.55 70.46,85.12 69.45,85.32 68.44,85.12 67.58,84.55 67,83.69 66.8,82.68 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="73.42,76.06 73.62,75.05 74.19,74.19 75.05,73.62 76.06,73.42 77.08,73.62 77.93,74.19 78.51,75.05 78.71,76.06 78.71,82.68 78.51,83.69 77.93,84.55 77.08,85.12 76.06,85.32 75.05,85.12 74.19,84.55 73.62,83.69 73.42,82.68 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="86.65,76.06 86.85,75.05 87.42,74.19 88.28,73.62 89.29,73.42 90.3,73.62 91.16,74.19 91.74,75.05 91.94,76.06 91.94,76.06 91.74,77.08 91.16,77.93 90.3,78.51 89.29,78.71 88.28,78.51 87.42,77.93 86.85,77.08 86.65,76.06 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="93.26,76.06 93.46,75.05 94.03,74.19 94.89,73.62 95.91,73.42 96.92,73.62 97.78,74.19 98.35,75.05 98.55,76.06 98.55,89.29 98.35,90.3 97.78,91.16 96.92,91.74 95.91,91.94 94.89,91.74 94.03,91.16 93.46,90.3 93.26,89.29 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="99.87,69.45 100.08,68.44 100.65,67.58 101.51,67 102.52,66.8 103.53,67 104.39,67.58 104.96,68.44 105.17,69.45 105.17,76.06 104.96,77.08 104.39,77.93 103.53,78.51 102.52,78.71 101.51,78.51 100.65,77.93 100.08,77.08 99.87,76.06 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="99.87,89.29 100.08,88.28 100.65,87.42 101.51,86.85 102.52,86.65 103.53,86.85 104.39,87.42 104.96,88.28 105.17,89.29 105.17,89.29 104.96,90.3 104.39,91.16 103.53,91.74 102.52,91.94 101.51,91.74 100.65,91.16 100.08,90.3 99.87,89.29 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="106.49,76.06 106.69,75.05 107.26,74.19 108.12,73.62 109.13,73.42 110.15,73.62 111,74.19 111.58,75.05 111.78,76.06 111.78,89.29 111.58,90.3 111,91.16 110.15,91.74 109.13,91.94 108.12,91.74 107.26,91.16 106.69,90.3 106.49,89.29 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="113.1,69.45 113.3,68.44 113.88,67.58 114.74,67 115.75,66.8 116.76,67 117.62,67.58 118.19,68.44 118.39,69.45 118.39,69.45 118.19,70.46 117.62,71.32 116.76,71.89 115.75,72.09 114.74,71.89 113.88,71.32 113.3,70.46 113.1,69.45 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="113.1,82.68 113.3,81.66 113.88,80.81 114.74,80.23 115.75,80.03 116.76,80.23 117.62,80.81 118.19,81.66 118.39,82.68 118.39,82.68 118.19,83.69 117.62,84.55 116.76,85.12 115.75,85.32 114.74,85.12 113.88,84.55 113.3,83.69 113.1,82.68 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="113.1,95.91 113.3,94.89 113.88,94.03 114.74,93.46 115.75,93.26 116.76,93.46 117.62,94.03 118.19,94.89 118.39,95.91 118.39,102.52 118.19,103.53 117.62,104.39 116.76,104.96 115.75,105.17 114.74,104.96 113.88,104.39 113.3,103.53 113.1,102.52 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="119.72,109.13 119.92,108.12 120.49,107.26 121.35,106.69 122.36,106.49 123.37,106.69 124.23,107.26 124.81,108.12 125.01,109.13 125.01,115.75 124.81,116.76 124.23,117.62 123.37,118.19 122.36,118.39 121.35,118.19 120.49,117.62 119.92,116.76 119.72,115.75 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="126.33,69.45 126.53,68.44 127.11,67.58 127.96,67 128.98,66.8 129.99,67 130.85,67.58 131.42,68.44 131.62,69.45 131.62,82.68 131.42,83.69 130.85,84.55 129.99,85.12 128.98,85.32 127.96,85.12 127.11,84.55 126.53,83.69 126.33,82.68 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="126.33,109.13 126.53,108.12 127.11,107.26 127.96,106.69 128.98,106.49 129.99,106.69 130.85,107.26 131.42,108.12 131.62,109.13 131.62,109.13 131.42,110.15 130.85,111 129.99,111.58 128.98,111.78 127.96,111.58 127.11,111 126.53,110.15 126.33,109.13 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="126.33,122.36 126.53,121.35 127.11,120.49 127.96,119.92 128.98,119.72 129.99,119.92 130.85,120.49 131.42,121.35 131.62,122.36 131.62,122.36 131.42,123.37 130.85,124.23 129.99,124.81 128.98,125.01 127.96,124.81 127.11,124.23 126.53,123.37 126.33,122.36 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="132.94,76.06 133.15,75.05 133.72,74.19 134.58,73.62 135.59,73.42 136.6,73.62 137.46,74.19 138.03,75.05 138.24,76.06 138.24,76.06 138.03,77.08 137.46,77.93 136.6,78.51 135.59,78.71 134.58,78.51 133.72,77.93 133.15,77.08 132.94,76.06 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="132.94,89.29 133.15,88.28 133.72,87.42 134.58,86.85 135.59,86.65 136.6,86.85 137.46,87.42 138.03,88.28 138.24,89.29 138.24,89.29 138.03,90.3 137.46,91.16 136.6,91.74 135.59,91.94 134.58,91.74 133.72,91.16 133.15,90.3 132.94,89.29 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="132.94,102.52 133.15,101.51 133.72,100.65 134.58,100.08 135.59,99.87 136.6,100.08 137.46,100.65 138.03,101.51 138.24,102.52 138.24,102.52 138.03,103.53 137.46,104.39 136.6,104.96 135.59,105.17 134.58,104.96 133.72,104.39 133.15,103.53 132.94,102.52 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="132.94,115.75 133.15,114.74 133.72,113.88 134.58,113.3 135.59,113.1 136.6,113.3 137.46,113.88 138.03,114.74 138.24,115.75 138.24,128.98 138.03,129.99 137.46,130.85 136.6,131.42 135.59,131.62 134.58,131.42 133.72,130.85 133.15,129.99 132.94,128.98 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="139.56,69.45 139.76,68.44 140.33,67.58 141.19,67 142.2,66.8 143.22,67 144.08,67.58 144.65,68.44 144.85,69.45 144.85,76.06 144.65,77.08 144.08,77.93 143.22,78.51 142.2,78.71 141.19,78.51 140.33,77.93 139.76,77.08 139.56,76.06 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="139.56,89.29 139.76,88.28 140.33,87.42 141.19,86.85 142.2,86.65 143.22,86.85 144.08,87.42 144.65,88.28 144.85,89.29 144.85,95.91 144.65,96.92 144.08,97.78 143.22,98.35 142.2,98.55 141.19,98.35 140.33,97.78 139.76,96.92 139.56,95.91 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="139.56,109.13 139.76,108.12 140.33,107.26 141.19,106.69 142.2,106.49 143.22,106.69 144.08,107.26 144.65,108.12 144.85,109.13 144.85,109.13 144.65,110.15 144.08,111 143.22,111.58 142.2,111.78 141.19,111.58 140.33,111 139.76,110.15 139.56,109.13 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="146.17,76.06 146.37,75.05 146.95,74.19 147.81,73.62 148.82,73.42 149.83,73.62 150.69,74.19 151.26,75.05 151.46,76.06 151.46,89.29 151.26,90.3 150.69,91.16 149.83,91.74 148.82,91.94 147.81,91.74 146.95,91.16 146.37,90.3 146.17,89.29 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
          <polygon
            points="146.17,109.13 146.37,108.12 146.95,107.26 147.81,106.69 148.82,106.49 149.83,106.69 150.69,107.26 151.26,108.12 151.46,109.13 151.46,115.75 151.26,116.76 150.69,117.62 149.83,118.19 148.82,118.39 147.81,118.19 146.95,117.62 146.37,116.76 146.17,115.75 "
            style="fill:url(#gradient230bd81be3cd4d5c8b2e8d6590a4404d);"
          />
      `,
            },
            {
                value: 21,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(37,86,99,1);"
            shape-rendering="crispEdges"
          />
          <pattern
            id="glass201707dc0d7345a1a213d10146189fee"
            x="13.22835"
            y="13.22835"
            width="138.8976"
            height="138.8976"
            patternUnits="userSpaceOnUse"
          >
            <rect x="0" y="0" width="138.8976" height="138.8976" style="fill:rgb(219,229,241);fill-opacity:1;" />
            <rect x="0" y="0" width="138.8976" height="69.44881" style="fill:rgb(231,241,253);fill-opacity:1;" />
          </pattern>
          <polygon
            points="59.53,36.38 59.08,40.89 57.77,45.24 55.63,49.24 52.75,52.75 49.24,55.63 45.24,57.77 40.89,59.08 36.38,59.53 31.86,59.08 27.52,57.77 23.52,55.63 20.01,52.75 17.13,49.24 14.99,45.24 13.67,40.89 13.23,36.38 13.67,31.86 14.99,27.52 17.13,23.52 20.01,20.01 23.52,17.13 27.52,14.99 31.86,13.67 36.38,13.23 40.89,13.67 45.24,14.99 49.24,17.13 52.75,20.01 55.63,23.52 57.77,27.52 59.08,31.86 59.53,36.38 52.91,36.38 52.6,33.15 51.65,30.05 50.13,27.19 48.07,24.69 45.56,22.63 42.71,21.1 39.6,20.16 36.38,19.84 33.15,20.16 30.05,21.1 27.19,22.63 24.69,24.69 22.63,27.19 21.1,30.05 20.16,33.15 19.84,36.38 20.16,39.6 21.1,42.71 22.63,45.56 24.69,48.07 27.19,50.13 30.05,51.65 33.15,52.6 36.38,52.91 39.6,52.6 42.71,51.65 45.56,50.13 48.07,48.07 50.13,45.56 51.65,42.71 52.6,39.6 52.91,36.38 "
            style="fill:url(#glass201707dc0d7345a1a213d10146189fee);"
          />
          <polygon
            points="59.53,128.98 59.08,133.49 57.77,137.84 55.63,141.84 52.75,145.35 49.24,148.22 45.24,150.36 40.89,151.68 36.38,152.13 31.86,151.68 27.52,150.36 23.52,148.22 20.01,145.35 17.13,141.84 14.99,137.84 13.67,133.49 13.23,128.98 13.67,124.46 14.99,120.12 17.13,116.12 20.01,112.61 23.52,109.73 27.52,107.59 31.86,106.27 36.38,105.83 40.89,106.27 45.24,107.59 49.24,109.73 52.75,112.61 55.63,116.12 57.77,120.12 59.08,124.46 59.53,128.98 52.91,128.98 52.6,125.75 51.65,122.65 50.13,119.79 48.07,117.28 45.56,115.23 42.71,113.7 39.6,112.76 36.38,112.44 33.15,112.76 30.05,113.7 27.19,115.23 24.69,117.28 22.63,119.79 21.1,122.65 20.16,125.75 19.84,128.98 20.16,132.2 21.1,135.3 22.63,138.16 24.69,140.67 27.19,142.73 30.05,144.25 33.15,145.19 36.38,145.51 39.6,145.19 42.71,144.25 45.56,142.73 48.07,140.67 50.13,138.16 51.65,135.3 52.6,132.2 52.91,128.98 "
            style="fill:url(#glass201707dc0d7345a1a213d10146189fee);"
          />
          <polygon
            points="152.13,36.38 151.68,40.89 150.36,45.24 148.22,49.24 145.35,52.75 141.84,55.63 137.84,57.77 133.49,59.08 128.98,59.53 124.46,59.08 120.12,57.77 116.12,55.63 112.61,52.75 109.73,49.24 107.59,45.24 106.27,40.89 105.83,36.38 106.27,31.86 107.59,27.52 109.73,23.52 112.61,20.01 116.12,17.13 120.12,14.99 124.46,13.67 128.98,13.23 133.49,13.67 137.84,14.99 141.84,17.13 145.35,20.01 148.22,23.52 150.36,27.52 151.68,31.86 152.13,36.38 145.51,36.38 145.19,33.15 144.25,30.05 142.73,27.19 140.67,24.69 138.16,22.63 135.3,21.1 132.2,20.16 128.98,19.84 125.75,20.16 122.65,21.1 119.79,22.63 117.28,24.69 115.23,27.19 113.7,30.05 112.76,33.15 112.44,36.38 112.76,39.6 113.7,42.71 115.23,45.56 117.28,48.07 119.79,50.13 122.65,51.65 125.75,52.6 128.98,52.91 132.2,52.6 135.3,51.65 138.16,50.13 140.67,48.07 142.73,45.56 144.25,42.71 145.19,39.6 145.51,36.38 "
            style="fill:url(#glass201707dc0d7345a1a213d10146189fee);"
          />
          <linearGradient
            id="gradientf338e33a7b584819b1c744d73e747428"
            gradientUnits="userSpaceOnUse"
            x1="22.0024585616932"
            y1="77.3688099608975"
            x2="143.351858149733"
            y2="87.9855067505283"
          >
            <stop offset="0%" stop-color="#D7E3BC" />
            <stop offset="50%" stop-color="#FF93FB" />
            <stop offset="100%" stop-color="#D7E3BC" />
          </linearGradient>
          <polygon
            points="46.3,36.38 46.11,38.31 45.54,40.17 44.63,41.89 43.39,43.39 41.89,44.63 40.17,45.54 38.31,46.11 36.38,46.3 34.44,46.11 32.58,45.54 30.87,44.63 29.36,43.39 28.13,41.89 27.21,40.17 26.65,38.31 26.46,36.38 26.65,34.44 27.21,32.58 28.13,30.87 29.36,29.36 30.87,28.13 32.58,27.21 34.44,26.65 36.38,26.46 38.31,26.65 40.17,27.21 41.89,28.13 43.39,29.36 44.63,30.87 45.54,32.58 46.11,34.44 46.3,36.38 "
            style="fill:url(#gradientf338e33a7b584819b1c744d73e747428);"
          />
          <polygon
            points="46.3,128.98 46.11,130.91 45.54,132.77 44.63,134.49 43.39,135.99 41.89,137.23 40.17,138.14 38.31,138.71 36.38,138.9 34.44,138.71 32.58,138.14 30.87,137.23 29.36,135.99 28.13,134.49 27.21,132.77 26.65,130.91 26.46,128.98 26.65,127.04 27.21,125.18 28.13,123.46 29.36,121.96 30.87,120.73 32.58,119.81 34.44,119.25 36.38,119.06 38.31,119.25 40.17,119.81 41.89,120.73 43.39,121.96 44.63,123.46 45.54,125.18 46.11,127.04 46.3,128.98 "
            style="fill:url(#gradientf338e33a7b584819b1c744d73e747428);"
          />
          <polygon
            points="138.9,36.38 138.71,38.31 138.14,40.17 137.23,41.89 135.99,43.39 134.49,44.63 132.77,45.54 130.91,46.11 128.98,46.3 127.04,46.11 125.18,45.54 123.46,44.63 121.96,43.39 120.73,41.89 119.81,40.17 119.25,38.31 119.06,36.38 119.25,34.44 119.81,32.58 120.73,30.87 121.96,29.36 123.46,28.13 125.18,27.21 127.04,26.65 128.98,26.46 130.91,26.65 132.77,27.21 134.49,28.13 135.99,29.36 137.23,30.87 138.14,32.58 138.71,34.44 138.9,36.38 "
            style="fill:url(#gradientf338e33a7b584819b1c744d73e747428);"
          />
          <linearGradient
            id="gradientf6ada64ee4ea4c3ab409c80131769b18"
            gradientUnits="userSpaceOnUse"
            x1="9.78888088478347"
            y1="78.8572474050841"
            x2="155.56543964134"
            y2="86.497073121039"
          >
            <stop offset="0%" stop-color="#FFFFFF" />
            <stop offset="100%" stop-color="#A5A5A5" />
          </linearGradient>
          <polygon
            points="85.98,16.54 85.73,17.8 85.02,18.87 83.94,19.59 82.68,19.84 81.41,19.59 80.34,18.87 79.62,17.8 79.37,16.54 79.62,15.27 80.34,14.2 81.41,13.48 82.68,13.23 83.94,13.48 85.02,14.2 85.73,15.27 85.98,16.54 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="92.6,16.54 92.35,17.8 91.63,18.87 90.56,19.59 89.29,19.84 88.03,19.59 86.95,18.87 86.24,17.8 85.98,16.54 86.24,15.27 86.95,14.2 88.03,13.48 89.29,13.23 90.56,13.48 91.63,14.2 92.35,15.27 92.6,16.54 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="99.21,16.54 98.96,17.8 98.24,18.87 97.17,19.59 95.91,19.84 94.64,19.59 93.57,18.87 92.85,17.8 92.6,16.54 92.85,15.27 93.57,14.2 94.64,13.48 95.91,13.23 97.17,13.48 98.24,14.2 98.96,15.27 99.21,16.54 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="72.76,23.15 72.5,24.42 71.79,25.49 70.71,26.2 69.45,26.46 68.18,26.2 67.11,25.49 66.39,24.42 66.14,23.15 66.39,21.88 67.11,20.81 68.18,20.09 69.45,19.84 70.71,20.09 71.79,20.81 72.5,21.88 72.76,23.15 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="79.37,23.15 79.12,24.42 78.4,25.49 77.33,26.2 76.06,26.46 74.8,26.2 73.72,25.49 73.01,24.42 72.76,23.15 73.01,21.88 73.72,20.81 74.8,20.09 76.06,19.84 77.33,20.09 78.4,20.81 79.12,21.88 79.37,23.15 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="85.98,23.15 85.73,24.42 85.02,25.49 83.94,26.2 82.68,26.46 81.41,26.2 80.34,25.49 79.62,24.42 79.37,23.15 79.62,21.88 80.34,20.81 81.41,20.09 82.68,19.84 83.94,20.09 85.02,20.81 85.73,21.88 85.98,23.15 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="99.21,23.15 98.96,24.42 98.24,25.49 97.17,26.2 95.91,26.46 94.64,26.2 93.57,25.49 92.85,24.42 92.6,23.15 92.85,21.88 93.57,20.81 94.64,20.09 95.91,19.84 97.17,20.09 98.24,20.81 98.96,21.88 99.21,23.15 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="85.98,29.76 85.73,31.03 85.02,32.1 83.94,32.82 82.68,33.07 81.41,32.82 80.34,32.1 79.62,31.03 79.37,29.76 79.62,28.5 80.34,27.43 81.41,26.71 82.68,26.46 83.94,26.71 85.02,27.43 85.73,28.5 85.98,29.76 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="92.6,29.76 92.35,31.03 91.63,32.1 90.56,32.82 89.29,33.07 88.03,32.82 86.95,32.1 86.24,31.03 85.98,29.76 86.24,28.5 86.95,27.43 88.03,26.71 89.29,26.46 90.56,26.71 91.63,27.43 92.35,28.5 92.6,29.76 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="99.21,29.76 98.96,31.03 98.24,32.1 97.17,32.82 95.91,33.07 94.64,32.82 93.57,32.1 92.85,31.03 92.6,29.76 92.85,28.5 93.57,27.43 94.64,26.71 95.91,26.46 97.17,26.71 98.24,27.43 98.96,28.5 99.21,29.76 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="72.76,36.38 72.5,37.64 71.79,38.72 70.71,39.43 69.45,39.69 68.18,39.43 67.11,38.72 66.39,37.64 66.14,36.38 66.39,35.11 67.11,34.04 68.18,33.32 69.45,33.07 70.71,33.32 71.79,34.04 72.5,35.11 72.76,36.38 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="79.37,36.38 79.12,37.64 78.4,38.72 77.33,39.43 76.06,39.69 74.8,39.43 73.72,38.72 73.01,37.64 72.76,36.38 73.01,35.11 73.72,34.04 74.8,33.32 76.06,33.07 77.33,33.32 78.4,34.04 79.12,35.11 79.37,36.38 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="99.21,36.38 98.96,37.64 98.24,38.72 97.17,39.43 95.91,39.69 94.64,39.43 93.57,38.72 92.85,37.64 92.6,36.38 92.85,35.11 93.57,34.04 94.64,33.32 95.91,33.07 97.17,33.32 98.24,34.04 98.96,35.11 99.21,36.38 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="79.37,42.99 79.12,44.26 78.4,45.33 77.33,46.05 76.06,46.3 74.8,46.05 73.72,45.33 73.01,44.26 72.76,42.99 73.01,41.73 73.72,40.65 74.8,39.94 76.06,39.69 77.33,39.94 78.4,40.65 79.12,41.73 79.37,42.99 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="99.21,42.99 98.96,44.26 98.24,45.33 97.17,46.05 95.91,46.3 94.64,46.05 93.57,45.33 92.85,44.26 92.6,42.99 92.85,41.73 93.57,40.65 94.64,39.94 95.91,39.69 97.17,39.94 98.24,40.65 98.96,41.73 99.21,42.99 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="72.76,49.61 72.5,50.87 71.79,51.94 70.71,52.66 69.45,52.91 68.18,52.66 67.11,51.94 66.39,50.87 66.14,49.61 66.39,48.34 67.11,47.27 68.18,46.55 69.45,46.3 70.71,46.55 71.79,47.27 72.5,48.34 72.76,49.61 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="92.6,49.61 92.35,50.87 91.63,51.94 90.56,52.66 89.29,52.91 88.03,52.66 86.95,51.94 86.24,50.87 85.98,49.61 86.24,48.34 86.95,47.27 88.03,46.55 89.29,46.3 90.56,46.55 91.63,47.27 92.35,48.34 92.6,49.61 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="72.76,56.22 72.5,57.49 71.79,58.56 70.71,59.28 69.45,59.53 68.18,59.28 67.11,58.56 66.39,57.49 66.14,56.22 66.39,54.95 67.11,53.88 68.18,53.17 69.45,52.91 70.71,53.17 71.79,53.88 72.5,54.95 72.76,56.22 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="85.98,56.22 85.73,57.49 85.02,58.56 83.94,59.28 82.68,59.53 81.41,59.28 80.34,58.56 79.62,57.49 79.37,56.22 79.62,54.95 80.34,53.88 81.41,53.17 82.68,52.91 83.94,53.17 85.02,53.88 85.73,54.95 85.98,56.22 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="99.21,56.22 98.96,57.49 98.24,58.56 97.17,59.28 95.91,59.53 94.64,59.28 93.57,58.56 92.85,57.49 92.6,56.22 92.85,54.95 93.57,53.88 94.64,53.17 95.91,52.91 97.17,53.17 98.24,53.88 98.96,54.95 99.21,56.22 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="79.37,62.83 79.12,64.1 78.4,65.17 77.33,65.89 76.06,66.14 74.8,65.89 73.72,65.17 73.01,64.1 72.76,62.83 73.01,61.57 73.72,60.5 74.8,59.78 76.06,59.53 77.33,59.78 78.4,60.5 79.12,61.57 79.37,62.83 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="19.84,69.45 19.59,70.71 18.87,71.79 17.8,72.5 16.54,72.76 15.27,72.5 14.2,71.79 13.48,70.71 13.23,69.45 13.48,68.18 14.2,67.11 15.27,66.39 16.54,66.14 17.8,66.39 18.87,67.11 19.59,68.18 19.84,69.45 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="26.46,69.45 26.2,70.71 25.49,71.79 24.42,72.5 23.15,72.76 21.88,72.5 20.81,71.79 20.09,70.71 19.84,69.45 20.09,68.18 20.81,67.11 21.88,66.39 23.15,66.14 24.42,66.39 25.49,67.11 26.2,68.18 26.46,69.45 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="33.07,69.45 32.82,70.71 32.1,71.79 31.03,72.5 29.76,72.76 28.5,72.5 27.43,71.79 26.71,70.71 26.46,69.45 26.71,68.18 27.43,67.11 28.5,66.39 29.76,66.14 31.03,66.39 32.1,67.11 32.82,68.18 33.07,69.45 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="39.69,69.45 39.43,70.71 38.72,71.79 37.64,72.5 36.38,72.76 35.11,72.5 34.04,71.79 33.32,70.71 33.07,69.45 33.32,68.18 34.04,67.11 35.11,66.39 36.38,66.14 37.64,66.39 38.72,67.11 39.43,68.18 39.69,69.45 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="46.3,69.45 46.05,70.71 45.33,71.79 44.26,72.5 42.99,72.76 41.73,72.5 40.65,71.79 39.94,70.71 39.69,69.45 39.94,68.18 40.65,67.11 41.73,66.39 42.99,66.14 44.26,66.39 45.33,67.11 46.05,68.18 46.3,69.45 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="59.53,69.45 59.28,70.71 58.56,71.79 57.49,72.5 56.22,72.76 54.95,72.5 53.88,71.79 53.17,70.71 52.91,69.45 53.17,68.18 53.88,67.11 54.95,66.39 56.22,66.14 57.49,66.39 58.56,67.11 59.28,68.18 59.53,69.45 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="66.14,69.45 65.89,70.71 65.17,71.79 64.1,72.5 62.83,72.76 61.57,72.5 60.5,71.79 59.78,70.71 59.53,69.45 59.78,68.18 60.5,67.11 61.57,66.39 62.83,66.14 64.1,66.39 65.17,67.11 65.89,68.18 66.14,69.45 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="72.76,69.45 72.5,70.71 71.79,71.79 70.71,72.5 69.45,72.76 68.18,72.5 67.11,71.79 66.39,70.71 66.14,69.45 66.39,68.18 67.11,67.11 68.18,66.39 69.45,66.14 70.71,66.39 71.79,67.11 72.5,68.18 72.76,69.45 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="92.6,69.45 92.35,70.71 91.63,71.79 90.56,72.5 89.29,72.76 88.03,72.5 86.95,71.79 86.24,70.71 85.98,69.45 86.24,68.18 86.95,67.11 88.03,66.39 89.29,66.14 90.56,66.39 91.63,67.11 92.35,68.18 92.6,69.45 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="105.83,69.45 105.58,70.71 104.86,71.79 103.79,72.5 102.52,72.76 101.25,72.5 100.18,71.79 99.46,70.71 99.21,69.45 99.46,68.18 100.18,67.11 101.25,66.39 102.52,66.14 103.79,66.39 104.86,67.11 105.58,68.18 105.83,69.45 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="119.06,69.45 118.8,70.71 118.09,71.79 117.01,72.5 115.75,72.76 114.48,72.5 113.41,71.79 112.69,70.71 112.44,69.45 112.69,68.18 113.41,67.11 114.48,66.39 115.75,66.14 117.01,66.39 118.09,67.11 118.8,68.18 119.06,69.45 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="132.28,69.45 132.03,70.71 131.31,71.79 130.24,72.5 128.98,72.76 127.71,72.5 126.64,71.79 125.92,70.71 125.67,69.45 125.92,68.18 126.64,67.11 127.71,66.39 128.98,66.14 130.24,66.39 131.31,67.11 132.03,68.18 132.28,69.45 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="145.51,69.45 145.26,70.71 144.54,71.79 143.47,72.5 142.2,72.76 140.94,72.5 139.87,71.79 139.15,70.71 138.9,69.45 139.15,68.18 139.87,67.11 140.94,66.39 142.2,66.14 143.47,66.39 144.54,67.11 145.26,68.18 145.51,69.45 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="19.84,76.06 19.59,77.33 18.87,78.4 17.8,79.12 16.54,79.37 15.27,79.12 14.2,78.4 13.48,77.33 13.23,76.06 13.48,74.8 14.2,73.72 15.27,73.01 16.54,72.76 17.8,73.01 18.87,73.72 19.59,74.8 19.84,76.06 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="26.46,76.06 26.2,77.33 25.49,78.4 24.42,79.12 23.15,79.37 21.88,79.12 20.81,78.4 20.09,77.33 19.84,76.06 20.09,74.8 20.81,73.72 21.88,73.01 23.15,72.76 24.42,73.01 25.49,73.72 26.2,74.8 26.46,76.06 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="33.07,76.06 32.82,77.33 32.1,78.4 31.03,79.12 29.76,79.37 28.5,79.12 27.43,78.4 26.71,77.33 26.46,76.06 26.71,74.8 27.43,73.72 28.5,73.01 29.76,72.76 31.03,73.01 32.1,73.72 32.82,74.8 33.07,76.06 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="52.91,76.06 52.66,77.33 51.94,78.4 50.87,79.12 49.61,79.37 48.34,79.12 47.27,78.4 46.55,77.33 46.3,76.06 46.55,74.8 47.27,73.72 48.34,73.01 49.61,72.76 50.87,73.01 51.94,73.72 52.66,74.8 52.91,76.06 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="66.14,76.06 65.89,77.33 65.17,78.4 64.1,79.12 62.83,79.37 61.57,79.12 60.5,78.4 59.78,77.33 59.53,76.06 59.78,74.8 60.5,73.72 61.57,73.01 62.83,72.76 64.1,73.01 65.17,73.72 65.89,74.8 66.14,76.06 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="79.37,76.06 79.12,77.33 78.4,78.4 77.33,79.12 76.06,79.37 74.8,79.12 73.72,78.4 73.01,77.33 72.76,76.06 73.01,74.8 73.72,73.72 74.8,73.01 76.06,72.76 77.33,73.01 78.4,73.72 79.12,74.8 79.37,76.06 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="92.6,76.06 92.35,77.33 91.63,78.4 90.56,79.12 89.29,79.37 88.03,79.12 86.95,78.4 86.24,77.33 85.98,76.06 86.24,74.8 86.95,73.72 88.03,73.01 89.29,72.76 90.56,73.01 91.63,73.72 92.35,74.8 92.6,76.06 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="99.21,76.06 98.96,77.33 98.24,78.4 97.17,79.12 95.91,79.37 94.64,79.12 93.57,78.4 92.85,77.33 92.6,76.06 92.85,74.8 93.57,73.72 94.64,73.01 95.91,72.76 97.17,73.01 98.24,73.72 98.96,74.8 99.21,76.06 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="105.83,76.06 105.58,77.33 104.86,78.4 103.79,79.12 102.52,79.37 101.25,79.12 100.18,78.4 99.46,77.33 99.21,76.06 99.46,74.8 100.18,73.72 101.25,73.01 102.52,72.76 103.79,73.01 104.86,73.72 105.58,74.8 105.83,76.06 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="112.44,76.06 112.19,77.33 111.47,78.4 110.4,79.12 109.13,79.37 107.87,79.12 106.8,78.4 106.08,77.33 105.83,76.06 106.08,74.8 106.8,73.72 107.87,73.01 109.13,72.76 110.4,73.01 111.47,73.72 112.19,74.8 112.44,76.06 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="132.28,76.06 132.03,77.33 131.31,78.4 130.24,79.12 128.98,79.37 127.71,79.12 126.64,78.4 125.92,77.33 125.67,76.06 125.92,74.8 126.64,73.72 127.71,73.01 128.98,72.76 130.24,73.01 131.31,73.72 132.03,74.8 132.28,76.06 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="138.9,76.06 138.65,77.33 137.93,78.4 136.86,79.12 135.59,79.37 134.32,79.12 133.25,78.4 132.54,77.33 132.28,76.06 132.54,74.8 133.25,73.72 134.32,73.01 135.59,72.76 136.86,73.01 137.93,73.72 138.65,74.8 138.9,76.06 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="145.51,76.06 145.26,77.33 144.54,78.4 143.47,79.12 142.2,79.37 140.94,79.12 139.87,78.4 139.15,77.33 138.9,76.06 139.15,74.8 139.87,73.72 140.94,73.01 142.2,72.76 143.47,73.01 144.54,73.72 145.26,74.8 145.51,76.06 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="152.13,76.06 151.87,77.33 151.16,78.4 150.08,79.12 148.82,79.37 147.55,79.12 146.48,78.4 145.76,77.33 145.51,76.06 145.76,74.8 146.48,73.72 147.55,73.01 148.82,72.76 150.08,73.01 151.16,73.72 151.87,74.8 152.13,76.06 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="33.07,82.68 32.82,83.94 32.1,85.02 31.03,85.73 29.76,85.98 28.5,85.73 27.43,85.02 26.71,83.94 26.46,82.68 26.71,81.41 27.43,80.34 28.5,79.62 29.76,79.37 31.03,79.62 32.1,80.34 32.82,81.41 33.07,82.68 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="46.3,82.68 46.05,83.94 45.33,85.02 44.26,85.73 42.99,85.98 41.73,85.73 40.65,85.02 39.94,83.94 39.69,82.68 39.94,81.41 40.65,80.34 41.73,79.62 42.99,79.37 44.26,79.62 45.33,80.34 46.05,81.41 46.3,82.68 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="52.91,82.68 52.66,83.94 51.94,85.02 50.87,85.73 49.61,85.98 48.34,85.73 47.27,85.02 46.55,83.94 46.3,82.68 46.55,81.41 47.27,80.34 48.34,79.62 49.61,79.37 50.87,79.62 51.94,80.34 52.66,81.41 52.91,82.68 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="59.53,82.68 59.28,83.94 58.56,85.02 57.49,85.73 56.22,85.98 54.95,85.73 53.88,85.02 53.17,83.94 52.91,82.68 53.17,81.41 53.88,80.34 54.95,79.62 56.22,79.37 57.49,79.62 58.56,80.34 59.28,81.41 59.53,82.68 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="72.76,82.68 72.5,83.94 71.79,85.02 70.71,85.73 69.45,85.98 68.18,85.73 67.11,85.02 66.39,83.94 66.14,82.68 66.39,81.41 67.11,80.34 68.18,79.62 69.45,79.37 70.71,79.62 71.79,80.34 72.5,81.41 72.76,82.68 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="79.37,82.68 79.12,83.94 78.4,85.02 77.33,85.73 76.06,85.98 74.8,85.73 73.72,85.02 73.01,83.94 72.76,82.68 73.01,81.41 73.72,80.34 74.8,79.62 76.06,79.37 77.33,79.62 78.4,80.34 79.12,81.41 79.37,82.68 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="99.21,82.68 98.96,83.94 98.24,85.02 97.17,85.73 95.91,85.98 94.64,85.73 93.57,85.02 92.85,83.94 92.6,82.68 92.85,81.41 93.57,80.34 94.64,79.62 95.91,79.37 97.17,79.62 98.24,80.34 98.96,81.41 99.21,82.68 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="112.44,82.68 112.19,83.94 111.47,85.02 110.4,85.73 109.13,85.98 107.87,85.73 106.8,85.02 106.08,83.94 105.83,82.68 106.08,81.41 106.8,80.34 107.87,79.62 109.13,79.37 110.4,79.62 111.47,80.34 112.19,81.41 112.44,82.68 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="119.06,82.68 118.8,83.94 118.09,85.02 117.01,85.73 115.75,85.98 114.48,85.73 113.41,85.02 112.69,83.94 112.44,82.68 112.69,81.41 113.41,80.34 114.48,79.62 115.75,79.37 117.01,79.62 118.09,80.34 118.8,81.41 119.06,82.68 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="132.28,82.68 132.03,83.94 131.31,85.02 130.24,85.73 128.98,85.98 127.71,85.73 126.64,85.02 125.92,83.94 125.67,82.68 125.92,81.41 126.64,80.34 127.71,79.62 128.98,79.37 130.24,79.62 131.31,80.34 132.03,81.41 132.28,82.68 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="152.13,82.68 151.87,83.94 151.16,85.02 150.08,85.73 148.82,85.98 147.55,85.73 146.48,85.02 145.76,83.94 145.51,82.68 145.76,81.41 146.48,80.34 147.55,79.62 148.82,79.37 150.08,79.62 151.16,80.34 151.87,81.41 152.13,82.68 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="19.84,89.29 19.59,90.56 18.87,91.63 17.8,92.35 16.54,92.6 15.27,92.35 14.2,91.63 13.48,90.56 13.23,89.29 13.48,88.03 14.2,86.95 15.27,86.24 16.54,85.98 17.8,86.24 18.87,86.95 19.59,88.03 19.84,89.29 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="39.69,89.29 39.43,90.56 38.72,91.63 37.64,92.35 36.38,92.6 35.11,92.35 34.04,91.63 33.32,90.56 33.07,89.29 33.32,88.03 34.04,86.95 35.11,86.24 36.38,85.98 37.64,86.24 38.72,86.95 39.43,88.03 39.69,89.29 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="92.6,89.29 92.35,90.56 91.63,91.63 90.56,92.35 89.29,92.6 88.03,92.35 86.95,91.63 86.24,90.56 85.98,89.29 86.24,88.03 86.95,86.95 88.03,86.24 89.29,85.98 90.56,86.24 91.63,86.95 92.35,88.03 92.6,89.29 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="99.21,89.29 98.96,90.56 98.24,91.63 97.17,92.35 95.91,92.6 94.64,92.35 93.57,91.63 92.85,90.56 92.6,89.29 92.85,88.03 93.57,86.95 94.64,86.24 95.91,85.98 97.17,86.24 98.24,86.95 98.96,88.03 99.21,89.29 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="105.83,89.29 105.58,90.56 104.86,91.63 103.79,92.35 102.52,92.6 101.25,92.35 100.18,91.63 99.46,90.56 99.21,89.29 99.46,88.03 100.18,86.95 101.25,86.24 102.52,85.98 103.79,86.24 104.86,86.95 105.58,88.03 105.83,89.29 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="112.44,89.29 112.19,90.56 111.47,91.63 110.4,92.35 109.13,92.6 107.87,92.35 106.8,91.63 106.08,90.56 105.83,89.29 106.08,88.03 106.8,86.95 107.87,86.24 109.13,85.98 110.4,86.24 111.47,86.95 112.19,88.03 112.44,89.29 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="138.9,89.29 138.65,90.56 137.93,91.63 136.86,92.35 135.59,92.6 134.32,92.35 133.25,91.63 132.54,90.56 132.28,89.29 132.54,88.03 133.25,86.95 134.32,86.24 135.59,85.98 136.86,86.24 137.93,86.95 138.65,88.03 138.9,89.29 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="145.51,89.29 145.26,90.56 144.54,91.63 143.47,92.35 142.2,92.6 140.94,92.35 139.87,91.63 139.15,90.56 138.9,89.29 139.15,88.03 139.87,86.95 140.94,86.24 142.2,85.98 143.47,86.24 144.54,86.95 145.26,88.03 145.51,89.29 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="152.13,89.29 151.87,90.56 151.16,91.63 150.08,92.35 148.82,92.6 147.55,92.35 146.48,91.63 145.76,90.56 145.51,89.29 145.76,88.03 146.48,86.95 147.55,86.24 148.82,85.98 150.08,86.24 151.16,86.95 151.87,88.03 152.13,89.29 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="26.46,95.91 26.2,97.17 25.49,98.24 24.42,98.96 23.15,99.21 21.88,98.96 20.81,98.24 20.09,97.17 19.84,95.91 20.09,94.64 20.81,93.57 21.88,92.85 23.15,92.6 24.42,92.85 25.49,93.57 26.2,94.64 26.46,95.91 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="39.69,95.91 39.43,97.17 38.72,98.24 37.64,98.96 36.38,99.21 35.11,98.96 34.04,98.24 33.32,97.17 33.07,95.91 33.32,94.64 34.04,93.57 35.11,92.85 36.38,92.6 37.64,92.85 38.72,93.57 39.43,94.64 39.69,95.91 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="46.3,95.91 46.05,97.17 45.33,98.24 44.26,98.96 42.99,99.21 41.73,98.96 40.65,98.24 39.94,97.17 39.69,95.91 39.94,94.64 40.65,93.57 41.73,92.85 42.99,92.6 44.26,92.85 45.33,93.57 46.05,94.64 46.3,95.91 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="59.53,95.91 59.28,97.17 58.56,98.24 57.49,98.96 56.22,99.21 54.95,98.96 53.88,98.24 53.17,97.17 52.91,95.91 53.17,94.64 53.88,93.57 54.95,92.85 56.22,92.6 57.49,92.85 58.56,93.57 59.28,94.64 59.53,95.91 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="72.76,95.91 72.5,97.17 71.79,98.24 70.71,98.96 69.45,99.21 68.18,98.96 67.11,98.24 66.39,97.17 66.14,95.91 66.39,94.64 67.11,93.57 68.18,92.85 69.45,92.6 70.71,92.85 71.79,93.57 72.5,94.64 72.76,95.91 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="79.37,95.91 79.12,97.17 78.4,98.24 77.33,98.96 76.06,99.21 74.8,98.96 73.72,98.24 73.01,97.17 72.76,95.91 73.01,94.64 73.72,93.57 74.8,92.85 76.06,92.6 77.33,92.85 78.4,93.57 79.12,94.64 79.37,95.91 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="99.21,95.91 98.96,97.17 98.24,98.24 97.17,98.96 95.91,99.21 94.64,98.96 93.57,98.24 92.85,97.17 92.6,95.91 92.85,94.64 93.57,93.57 94.64,92.85 95.91,92.6 97.17,92.85 98.24,93.57 98.96,94.64 99.21,95.91 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="119.06,95.91 118.8,97.17 118.09,98.24 117.01,98.96 115.75,99.21 114.48,98.96 113.41,98.24 112.69,97.17 112.44,95.91 112.69,94.64 113.41,93.57 114.48,92.85 115.75,92.6 117.01,92.85 118.09,93.57 118.8,94.64 119.06,95.91 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="145.51,95.91 145.26,97.17 144.54,98.24 143.47,98.96 142.2,99.21 140.94,98.96 139.87,98.24 139.15,97.17 138.9,95.91 139.15,94.64 139.87,93.57 140.94,92.85 142.2,92.6 143.47,92.85 144.54,93.57 145.26,94.64 145.51,95.91 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="72.76,102.52 72.5,103.79 71.79,104.86 70.71,105.58 69.45,105.83 68.18,105.58 67.11,104.86 66.39,103.79 66.14,102.52 66.39,101.25 67.11,100.18 68.18,99.46 69.45,99.21 70.71,99.46 71.79,100.18 72.5,101.25 72.76,102.52 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="85.98,102.52 85.73,103.79 85.02,104.86 83.94,105.58 82.68,105.83 81.41,105.58 80.34,104.86 79.62,103.79 79.37,102.52 79.62,101.25 80.34,100.18 81.41,99.46 82.68,99.21 83.94,99.46 85.02,100.18 85.73,101.25 85.98,102.52 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="99.21,102.52 98.96,103.79 98.24,104.86 97.17,105.58 95.91,105.83 94.64,105.58 93.57,104.86 92.85,103.79 92.6,102.52 92.85,101.25 93.57,100.18 94.64,99.46 95.91,99.21 97.17,99.46 98.24,100.18 98.96,101.25 99.21,102.52 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="119.06,102.52 118.8,103.79 118.09,104.86 117.01,105.58 115.75,105.83 114.48,105.58 113.41,104.86 112.69,103.79 112.44,102.52 112.69,101.25 113.41,100.18 114.48,99.46 115.75,99.21 117.01,99.46 118.09,100.18 118.8,101.25 119.06,102.52 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="138.9,102.52 138.65,103.79 137.93,104.86 136.86,105.58 135.59,105.83 134.32,105.58 133.25,104.86 132.54,103.79 132.28,102.52 132.54,101.25 133.25,100.18 134.32,99.46 135.59,99.21 136.86,99.46 137.93,100.18 138.65,101.25 138.9,102.52 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="72.76,109.13 72.5,110.4 71.79,111.47 70.71,112.19 69.45,112.44 68.18,112.19 67.11,111.47 66.39,110.4 66.14,109.13 66.39,107.87 67.11,106.8 68.18,106.08 69.45,105.83 70.71,106.08 71.79,106.8 72.5,107.87 72.76,109.13 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="92.6,109.13 92.35,110.4 91.63,111.47 90.56,112.19 89.29,112.44 88.03,112.19 86.95,111.47 86.24,110.4 85.98,109.13 86.24,107.87 86.95,106.8 88.03,106.08 89.29,105.83 90.56,106.08 91.63,106.8 92.35,107.87 92.6,109.13 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="105.83,109.13 105.58,110.4 104.86,111.47 103.79,112.19 102.52,112.44 101.25,112.19 100.18,111.47 99.46,110.4 99.21,109.13 99.46,107.87 100.18,106.8 101.25,106.08 102.52,105.83 103.79,106.08 104.86,106.8 105.58,107.87 105.83,109.13 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="125.67,109.13 125.42,110.4 124.7,111.47 123.63,112.19 122.36,112.44 121.1,112.19 120.02,111.47 119.31,110.4 119.06,109.13 119.31,107.87 120.02,106.8 121.1,106.08 122.36,105.83 123.63,106.08 124.7,106.8 125.42,107.87 125.67,109.13 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="132.28,109.13 132.03,110.4 131.31,111.47 130.24,112.19 128.98,112.44 127.71,112.19 126.64,111.47 125.92,110.4 125.67,109.13 125.92,107.87 126.64,106.8 127.71,106.08 128.98,105.83 130.24,106.08 131.31,106.8 132.03,107.87 132.28,109.13 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="145.51,109.13 145.26,110.4 144.54,111.47 143.47,112.19 142.2,112.44 140.94,112.19 139.87,111.47 139.15,110.4 138.9,109.13 139.15,107.87 139.87,106.8 140.94,106.08 142.2,105.83 143.47,106.08 144.54,106.8 145.26,107.87 145.51,109.13 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="152.13,109.13 151.87,110.4 151.16,111.47 150.08,112.19 148.82,112.44 147.55,112.19 146.48,111.47 145.76,110.4 145.51,109.13 145.76,107.87 146.48,106.8 147.55,106.08 148.82,105.83 150.08,106.08 151.16,106.8 151.87,107.87 152.13,109.13 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="79.37,115.75 79.12,117.01 78.4,118.09 77.33,118.8 76.06,119.06 74.8,118.8 73.72,118.09 73.01,117.01 72.76,115.75 73.01,114.48 73.72,113.41 74.8,112.69 76.06,112.44 77.33,112.69 78.4,113.41 79.12,114.48 79.37,115.75 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="85.98,115.75 85.73,117.01 85.02,118.09 83.94,118.8 82.68,119.06 81.41,118.8 80.34,118.09 79.62,117.01 79.37,115.75 79.62,114.48 80.34,113.41 81.41,112.69 82.68,112.44 83.94,112.69 85.02,113.41 85.73,114.48 85.98,115.75 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="119.06,115.75 118.8,117.01 118.09,118.09 117.01,118.8 115.75,119.06 114.48,118.8 113.41,118.09 112.69,117.01 112.44,115.75 112.69,114.48 113.41,113.41 114.48,112.69 115.75,112.44 117.01,112.69 118.09,113.41 118.8,114.48 119.06,115.75 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="125.67,115.75 125.42,117.01 124.7,118.09 123.63,118.8 122.36,119.06 121.1,118.8 120.02,118.09 119.31,117.01 119.06,115.75 119.31,114.48 120.02,113.41 121.1,112.69 122.36,112.44 123.63,112.69 124.7,113.41 125.42,114.48 125.67,115.75 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="138.9,115.75 138.65,117.01 137.93,118.09 136.86,118.8 135.59,119.06 134.32,118.8 133.25,118.09 132.54,117.01 132.28,115.75 132.54,114.48 133.25,113.41 134.32,112.69 135.59,112.44 136.86,112.69 137.93,113.41 138.65,114.48 138.9,115.75 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="152.13,115.75 151.87,117.01 151.16,118.09 150.08,118.8 148.82,119.06 147.55,118.8 146.48,118.09 145.76,117.01 145.51,115.75 145.76,114.48 146.48,113.41 147.55,112.69 148.82,112.44 150.08,112.69 151.16,113.41 151.87,114.48 152.13,115.75 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="72.76,122.36 72.5,123.63 71.79,124.7 70.71,125.42 69.45,125.67 68.18,125.42 67.11,124.7 66.39,123.63 66.14,122.36 66.39,121.1 67.11,120.02 68.18,119.31 69.45,119.06 70.71,119.31 71.79,120.02 72.5,121.1 72.76,122.36 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="79.37,122.36 79.12,123.63 78.4,124.7 77.33,125.42 76.06,125.67 74.8,125.42 73.72,124.7 73.01,123.63 72.76,122.36 73.01,121.1 73.72,120.02 74.8,119.31 76.06,119.06 77.33,119.31 78.4,120.02 79.12,121.1 79.37,122.36 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="85.98,122.36 85.73,123.63 85.02,124.7 83.94,125.42 82.68,125.67 81.41,125.42 80.34,124.7 79.62,123.63 79.37,122.36 79.62,121.1 80.34,120.02 81.41,119.31 82.68,119.06 83.94,119.31 85.02,120.02 85.73,121.1 85.98,122.36 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="92.6,122.36 92.35,123.63 91.63,124.7 90.56,125.42 89.29,125.67 88.03,125.42 86.95,124.7 86.24,123.63 85.98,122.36 86.24,121.1 86.95,120.02 88.03,119.31 89.29,119.06 90.56,119.31 91.63,120.02 92.35,121.1 92.6,122.36 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="105.83,122.36 105.58,123.63 104.86,124.7 103.79,125.42 102.52,125.67 101.25,125.42 100.18,124.7 99.46,123.63 99.21,122.36 99.46,121.1 100.18,120.02 101.25,119.31 102.52,119.06 103.79,119.31 104.86,120.02 105.58,121.1 105.83,122.36 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="125.67,122.36 125.42,123.63 124.7,124.7 123.63,125.42 122.36,125.67 121.1,125.42 120.02,124.7 119.31,123.63 119.06,122.36 119.31,121.1 120.02,120.02 121.1,119.31 122.36,119.06 123.63,119.31 124.7,120.02 125.42,121.1 125.67,122.36 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="132.28,122.36 132.03,123.63 131.31,124.7 130.24,125.42 128.98,125.67 127.71,125.42 126.64,124.7 125.92,123.63 125.67,122.36 125.92,121.1 126.64,120.02 127.71,119.31 128.98,119.06 130.24,119.31 131.31,120.02 132.03,121.1 132.28,122.36 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="138.9,122.36 138.65,123.63 137.93,124.7 136.86,125.42 135.59,125.67 134.32,125.42 133.25,124.7 132.54,123.63 132.28,122.36 132.54,121.1 133.25,120.02 134.32,119.31 135.59,119.06 136.86,119.31 137.93,120.02 138.65,121.1 138.9,122.36 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="72.76,128.98 72.5,130.24 71.79,131.31 70.71,132.03 69.45,132.28 68.18,132.03 67.11,131.31 66.39,130.24 66.14,128.98 66.39,127.71 67.11,126.64 68.18,125.92 69.45,125.67 70.71,125.92 71.79,126.64 72.5,127.71 72.76,128.98 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="79.37,128.98 79.12,130.24 78.4,131.31 77.33,132.03 76.06,132.28 74.8,132.03 73.72,131.31 73.01,130.24 72.76,128.98 73.01,127.71 73.72,126.64 74.8,125.92 76.06,125.67 77.33,125.92 78.4,126.64 79.12,127.71 79.37,128.98 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="92.6,128.98 92.35,130.24 91.63,131.31 90.56,132.03 89.29,132.28 88.03,132.03 86.95,131.31 86.24,130.24 85.98,128.98 86.24,127.71 86.95,126.64 88.03,125.92 89.29,125.67 90.56,125.92 91.63,126.64 92.35,127.71 92.6,128.98 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="99.21,128.98 98.96,130.24 98.24,131.31 97.17,132.03 95.91,132.28 94.64,132.03 93.57,131.31 92.85,130.24 92.6,128.98 92.85,127.71 93.57,126.64 94.64,125.92 95.91,125.67 97.17,125.92 98.24,126.64 98.96,127.71 99.21,128.98 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="105.83,128.98 105.58,130.24 104.86,131.31 103.79,132.03 102.52,132.28 101.25,132.03 100.18,131.31 99.46,130.24 99.21,128.98 99.46,127.71 100.18,126.64 101.25,125.92 102.52,125.67 103.79,125.92 104.86,126.64 105.58,127.71 105.83,128.98 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="112.44,128.98 112.19,130.24 111.47,131.31 110.4,132.03 109.13,132.28 107.87,132.03 106.8,131.31 106.08,130.24 105.83,128.98 106.08,127.71 106.8,126.64 107.87,125.92 109.13,125.67 110.4,125.92 111.47,126.64 112.19,127.71 112.44,128.98 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="119.06,128.98 118.8,130.24 118.09,131.31 117.01,132.03 115.75,132.28 114.48,132.03 113.41,131.31 112.69,130.24 112.44,128.98 112.69,127.71 113.41,126.64 114.48,125.92 115.75,125.67 117.01,125.92 118.09,126.64 118.8,127.71 119.06,128.98 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="132.28,128.98 132.03,130.24 131.31,131.31 130.24,132.03 128.98,132.28 127.71,132.03 126.64,131.31 125.92,130.24 125.67,128.98 125.92,127.71 126.64,126.64 127.71,125.92 128.98,125.67 130.24,125.92 131.31,126.64 132.03,127.71 132.28,128.98 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="138.9,128.98 138.65,130.24 137.93,131.31 136.86,132.03 135.59,132.28 134.32,132.03 133.25,131.31 132.54,130.24 132.28,128.98 132.54,127.71 133.25,126.64 134.32,125.92 135.59,125.67 136.86,125.92 137.93,126.64 138.65,127.71 138.9,128.98 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="72.76,135.59 72.5,136.86 71.79,137.93 70.71,138.65 69.45,138.9 68.18,138.65 67.11,137.93 66.39,136.86 66.14,135.59 66.39,134.32 67.11,133.25 68.18,132.54 69.45,132.28 70.71,132.54 71.79,133.25 72.5,134.32 72.76,135.59 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="79.37,135.59 79.12,136.86 78.4,137.93 77.33,138.65 76.06,138.9 74.8,138.65 73.72,137.93 73.01,136.86 72.76,135.59 73.01,134.32 73.72,133.25 74.8,132.54 76.06,132.28 77.33,132.54 78.4,133.25 79.12,134.32 79.37,135.59 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="99.21,135.59 98.96,136.86 98.24,137.93 97.17,138.65 95.91,138.9 94.64,138.65 93.57,137.93 92.85,136.86 92.6,135.59 92.85,134.32 93.57,133.25 94.64,132.54 95.91,132.28 97.17,132.54 98.24,133.25 98.96,134.32 99.21,135.59 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="112.44,135.59 112.19,136.86 111.47,137.93 110.4,138.65 109.13,138.9 107.87,138.65 106.8,137.93 106.08,136.86 105.83,135.59 106.08,134.32 106.8,133.25 107.87,132.54 109.13,132.28 110.4,132.54 111.47,133.25 112.19,134.32 112.44,135.59 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="119.06,135.59 118.8,136.86 118.09,137.93 117.01,138.65 115.75,138.9 114.48,138.65 113.41,137.93 112.69,136.86 112.44,135.59 112.69,134.32 113.41,133.25 114.48,132.54 115.75,132.28 117.01,132.54 118.09,133.25 118.8,134.32 119.06,135.59 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="132.28,135.59 132.03,136.86 131.31,137.93 130.24,138.65 128.98,138.9 127.71,138.65 126.64,137.93 125.92,136.86 125.67,135.59 125.92,134.32 126.64,133.25 127.71,132.54 128.98,132.28 130.24,132.54 131.31,133.25 132.03,134.32 132.28,135.59 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="138.9,135.59 138.65,136.86 137.93,137.93 136.86,138.65 135.59,138.9 134.32,138.65 133.25,137.93 132.54,136.86 132.28,135.59 132.54,134.32 133.25,133.25 134.32,132.54 135.59,132.28 136.86,132.54 137.93,133.25 138.65,134.32 138.9,135.59 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="72.76,142.2 72.5,143.47 71.79,144.54 70.71,145.26 69.45,145.51 68.18,145.26 67.11,144.54 66.39,143.47 66.14,142.2 66.39,140.94 67.11,139.87 68.18,139.15 69.45,138.9 70.71,139.15 71.79,139.87 72.5,140.94 72.76,142.2 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="85.98,142.2 85.73,143.47 85.02,144.54 83.94,145.26 82.68,145.51 81.41,145.26 80.34,144.54 79.62,143.47 79.37,142.2 79.62,140.94 80.34,139.87 81.41,139.15 82.68,138.9 83.94,139.15 85.02,139.87 85.73,140.94 85.98,142.2 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="92.6,142.2 92.35,143.47 91.63,144.54 90.56,145.26 89.29,145.51 88.03,145.26 86.95,144.54 86.24,143.47 85.98,142.2 86.24,140.94 86.95,139.87 88.03,139.15 89.29,138.9 90.56,139.15 91.63,139.87 92.35,140.94 92.6,142.2 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="99.21,142.2 98.96,143.47 98.24,144.54 97.17,145.26 95.91,145.51 94.64,145.26 93.57,144.54 92.85,143.47 92.6,142.2 92.85,140.94 93.57,139.87 94.64,139.15 95.91,138.9 97.17,139.15 98.24,139.87 98.96,140.94 99.21,142.2 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="105.83,142.2 105.58,143.47 104.86,144.54 103.79,145.26 102.52,145.51 101.25,145.26 100.18,144.54 99.46,143.47 99.21,142.2 99.46,140.94 100.18,139.87 101.25,139.15 102.52,138.9 103.79,139.15 104.86,139.87 105.58,140.94 105.83,142.2 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="112.44,142.2 112.19,143.47 111.47,144.54 110.4,145.26 109.13,145.51 107.87,145.26 106.8,144.54 106.08,143.47 105.83,142.2 106.08,140.94 106.8,139.87 107.87,139.15 109.13,138.9 110.4,139.15 111.47,139.87 112.19,140.94 112.44,142.2 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="119.06,142.2 118.8,143.47 118.09,144.54 117.01,145.26 115.75,145.51 114.48,145.26 113.41,144.54 112.69,143.47 112.44,142.2 112.69,140.94 113.41,139.87 114.48,139.15 115.75,138.9 117.01,139.15 118.09,139.87 118.8,140.94 119.06,142.2 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="125.67,142.2 125.42,143.47 124.7,144.54 123.63,145.26 122.36,145.51 121.1,145.26 120.02,144.54 119.31,143.47 119.06,142.2 119.31,140.94 120.02,139.87 121.1,139.15 122.36,138.9 123.63,139.15 124.7,139.87 125.42,140.94 125.67,142.2 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="138.9,142.2 138.65,143.47 137.93,144.54 136.86,145.26 135.59,145.51 134.32,145.26 133.25,144.54 132.54,143.47 132.28,142.2 132.54,140.94 133.25,139.87 134.32,139.15 135.59,138.9 136.86,139.15 137.93,139.87 138.65,140.94 138.9,142.2 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="145.51,142.2 145.26,143.47 144.54,144.54 143.47,145.26 142.2,145.51 140.94,145.26 139.87,144.54 139.15,143.47 138.9,142.2 139.15,140.94 139.87,139.87 140.94,139.15 142.2,138.9 143.47,139.15 144.54,139.87 145.26,140.94 145.51,142.2 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="72.76,148.82 72.5,150.08 71.79,151.16 70.71,151.87 69.45,152.13 68.18,151.87 67.11,151.16 66.39,150.08 66.14,148.82 66.39,147.55 67.11,146.48 68.18,145.76 69.45,145.51 70.71,145.76 71.79,146.48 72.5,147.55 72.76,148.82 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="79.37,148.82 79.12,150.08 78.4,151.16 77.33,151.87 76.06,152.13 74.8,151.87 73.72,151.16 73.01,150.08 72.76,148.82 73.01,147.55 73.72,146.48 74.8,145.76 76.06,145.51 77.33,145.76 78.4,146.48 79.12,147.55 79.37,148.82 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="85.98,148.82 85.73,150.08 85.02,151.16 83.94,151.87 82.68,152.13 81.41,151.87 80.34,151.16 79.62,150.08 79.37,148.82 79.62,147.55 80.34,146.48 81.41,145.76 82.68,145.51 83.94,145.76 85.02,146.48 85.73,147.55 85.98,148.82 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="99.21,148.82 98.96,150.08 98.24,151.16 97.17,151.87 95.91,152.13 94.64,151.87 93.57,151.16 92.85,150.08 92.6,148.82 92.85,147.55 93.57,146.48 94.64,145.76 95.91,145.51 97.17,145.76 98.24,146.48 98.96,147.55 99.21,148.82 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="119.06,148.82 118.8,150.08 118.09,151.16 117.01,151.87 115.75,152.13 114.48,151.87 113.41,151.16 112.69,150.08 112.44,148.82 112.69,147.55 113.41,146.48 114.48,145.76 115.75,145.51 117.01,145.76 118.09,146.48 118.8,147.55 119.06,148.82 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
          <polygon
            points="138.9,148.82 138.65,150.08 137.93,151.16 136.86,151.87 135.59,152.13 134.32,151.87 133.25,151.16 132.54,150.08 132.28,148.82 132.54,147.55 133.25,146.48 134.32,145.76 135.59,145.51 136.86,145.76 137.93,146.48 138.65,147.55 138.9,148.82 "
            style="fill:url(#gradientf6ada64ee4ea4c3ab409c80131769b18);"
          />
      `,
            },
            {
                value: 22,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(37,86,99,1);"
            shape-rendering="crispEdges"
          />
          <linearGradient
            id="gradientff154b24163e4fb69b5bbd4023a55584"
            gradientUnits="userSpaceOnUse"
            x1="7.72605761144101"
            y1="76.1197884622769"
            x2="157.628262914682"
            y2="89.2345320638461"
          >
            <stop offset="0%" stop-color="#C993FF" />
            <stop offset="50%" stop-color="#DBE5F1" />
            <stop offset="100%" stop-color="#C993FF" />
          </linearGradient>
          <polygon
            points="13.23,29.76 13.55,26.54 14.49,23.44 16.02,20.58 18.07,18.07 20.58,16.02 23.44,14.49 26.54,13.55 29.76,13.23 42.99,13.23 46.22,13.55 49.32,14.49 52.18,16.02 54.68,18.07 56.74,20.58 58.27,23.44 59.21,26.54 59.53,29.76 59.53,42.99 59.21,46.22 58.27,49.32 56.74,52.18 54.68,54.68 52.18,56.74 49.32,58.27 46.22,59.21 42.99,59.53 29.76,59.53 26.54,59.21 23.44,58.27 20.58,56.74 18.07,54.68 16.02,52.18 14.49,49.32 13.55,46.22 13.23,42.99 13.23,29.76 19.84,29.76 19.84,42.99 20.18,45.56 21.17,47.95 22.75,50.01 24.8,51.58 27.2,52.58 29.76,52.91 42.99,52.91 45.56,52.58 47.95,51.58 50.01,50.01 51.58,47.95 52.58,45.56 52.91,42.99 52.91,29.76 52.58,27.2 51.58,24.8 50.01,22.75 47.95,21.17 45.56,20.18 42.99,19.84 29.76,19.84 27.2,20.18 24.8,21.17 22.75,22.75 21.17,24.8 20.18,27.2 19.84,29.76 "
            style="fill:url(#gradientff154b24163e4fb69b5bbd4023a55584);"
          />
          <polygon
            points="13.23,122.36 13.55,119.14 14.49,116.03 16.02,113.18 18.07,110.67 20.58,108.61 23.44,107.09 26.54,106.14 29.76,105.83 42.99,105.83 46.22,106.14 49.32,107.09 52.18,108.61 54.68,110.67 56.74,113.18 58.27,116.03 59.21,119.14 59.53,122.36 59.53,135.59 59.21,138.82 58.27,141.92 56.74,144.78 54.68,147.28 52.18,149.34 49.32,150.87 46.22,151.81 42.99,152.13 29.76,152.13 26.54,151.81 23.44,150.87 20.58,149.34 18.07,147.28 16.02,144.78 14.49,141.92 13.55,138.82 13.23,135.59 13.23,122.36 19.84,122.36 19.84,135.59 20.18,138.16 21.17,140.55 22.75,142.61 24.8,144.18 27.2,145.17 29.76,145.51 42.99,145.51 45.56,145.17 47.95,144.18 50.01,142.61 51.58,140.55 52.58,138.16 52.91,135.59 52.91,122.36 52.58,119.79 51.58,117.4 50.01,115.35 47.95,113.77 45.56,112.78 42.99,112.44 29.76,112.44 27.2,112.78 24.8,113.77 22.75,115.35 21.17,117.4 20.18,119.79 19.84,122.36 "
            style="fill:url(#gradientff154b24163e4fb69b5bbd4023a55584);"
          />
          <polygon
            points="105.83,29.76 106.14,26.54 107.09,23.44 108.61,20.58 110.67,18.07 113.18,16.02 116.03,14.49 119.14,13.55 122.36,13.23 135.59,13.23 138.82,13.55 141.92,14.49 144.78,16.02 147.28,18.07 149.34,20.58 150.87,23.44 151.81,26.54 152.13,29.76 152.13,42.99 151.81,46.22 150.87,49.32 149.34,52.18 147.28,54.68 144.78,56.74 141.92,58.27 138.82,59.21 135.59,59.53 122.36,59.53 119.14,59.21 116.03,58.27 113.18,56.74 110.67,54.68 108.61,52.18 107.09,49.32 106.14,46.22 105.83,42.99 105.83,29.76 112.44,29.76 112.44,42.99 112.78,45.56 113.77,47.95 115.35,50.01 117.4,51.58 119.79,52.58 122.36,52.91 135.59,52.91 138.16,52.58 140.55,51.58 142.61,50.01 144.18,47.95 145.17,45.56 145.51,42.99 145.51,29.76 145.17,27.2 144.18,24.8 142.61,22.75 140.55,21.17 138.16,20.18 135.59,19.84 122.36,19.84 119.79,20.18 117.4,21.17 115.35,22.75 113.77,24.8 112.78,27.2 112.44,29.76 "
            style="fill:url(#gradientff154b24163e4fb69b5bbd4023a55584);"
          />
          <pattern
            id="hatch2db9197d1dd34ec6a96c1df3c769c1f3"
            x="0"
            y="0"
            width="8"
            height="8"
            patternUnits="userSpaceOnUse"
          >
            <rect x="0" y="0" width="8" height="8" fill="#F2DCDB" />
            <rect x="4" y="0" width="1" height="1" fill="#CCC1D9" />
            <rect x="5" y="0" width="1" height="1" fill="#CCC1D9" />
            <rect x="6" y="0" width="1" height="1" fill="#CCC1D9" />
            <rect x="7" y="0" width="1" height="1" fill="#CCC1D9" />
            <rect x="4" y="1" width="1" height="1" fill="#CCC1D9" />
            <rect x="5" y="1" width="1" height="1" fill="#CCC1D9" />
            <rect x="6" y="1" width="1" height="1" fill="#CCC1D9" />
            <rect x="7" y="1" width="1" height="1" fill="#CCC1D9" />
            <rect x="4" y="2" width="1" height="1" fill="#CCC1D9" />
            <rect x="5" y="2" width="1" height="1" fill="#CCC1D9" />
            <rect x="6" y="2" width="1" height="1" fill="#CCC1D9" />
            <rect x="7" y="2" width="1" height="1" fill="#CCC1D9" />
            <rect x="4" y="3" width="1" height="1" fill="#CCC1D9" />
            <rect x="5" y="3" width="1" height="1" fill="#CCC1D9" />
            <rect x="6" y="3" width="1" height="1" fill="#CCC1D9" />
            <rect x="7" y="3" width="1" height="1" fill="#CCC1D9" />
            <rect x="0" y="4" width="1" height="1" fill="#CCC1D9" />
            <rect x="1" y="4" width="1" height="1" fill="#CCC1D9" />
            <rect x="2" y="4" width="1" height="1" fill="#CCC1D9" />
            <rect x="3" y="4" width="1" height="1" fill="#CCC1D9" />
            <rect x="0" y="5" width="1" height="1" fill="#CCC1D9" />
            <rect x="1" y="5" width="1" height="1" fill="#CCC1D9" />
            <rect x="2" y="5" width="1" height="1" fill="#CCC1D9" />
            <rect x="3" y="5" width="1" height="1" fill="#CCC1D9" />
            <rect x="0" y="6" width="1" height="1" fill="#CCC1D9" />
            <rect x="1" y="6" width="1" height="1" fill="#CCC1D9" />
            <rect x="2" y="6" width="1" height="1" fill="#CCC1D9" />
            <rect x="3" y="6" width="1" height="1" fill="#CCC1D9" />
            <rect x="0" y="7" width="1" height="1" fill="#CCC1D9" />
            <rect x="1" y="7" width="1" height="1" fill="#CCC1D9" />
            <rect x="2" y="7" width="1" height="1" fill="#CCC1D9" />
            <rect x="3" y="7" width="1" height="1" fill="#CCC1D9" />
          </pattern>
          <polygon
            points="26.46,31.09 26.61,29.89 27.08,28.77 27.81,27.81 28.77,27.08 29.89,26.61 31.09,26.46 41.67,26.46 42.87,26.61 43.98,27.08 44.94,27.81 45.68,28.77 46.14,29.89 46.3,31.09 46.3,41.67 46.14,42.87 45.68,43.98 44.94,44.94 43.98,45.68 42.87,46.14 41.67,46.3 31.09,46.3 29.89,46.14 28.77,45.68 27.81,44.94 27.08,43.98 26.61,42.87 26.46,41.67 "
            style="fill:url(#hatch2db9197d1dd34ec6a96c1df3c769c1f3);"
          />
          <polygon
            points="26.46,123.69 26.61,122.49 27.08,121.37 27.81,120.41 28.77,119.68 29.89,119.21 31.09,119.06 41.67,119.06 42.87,119.21 43.98,119.68 44.94,120.41 45.68,121.37 46.14,122.49 46.3,123.69 46.3,134.27 46.14,135.47 45.68,136.58 44.94,137.54 43.98,138.28 42.87,138.74 41.67,138.9 31.09,138.9 29.89,138.74 28.77,138.28 27.81,137.54 27.08,136.58 26.61,135.47 26.46,134.27 "
            style="fill:url(#hatch2db9197d1dd34ec6a96c1df3c769c1f3);"
          />
          <polygon
            points="119.06,31.09 119.21,29.89 119.68,28.77 120.41,27.81 121.37,27.08 122.49,26.61 123.69,26.46 134.27,26.46 135.47,26.61 136.58,27.08 137.54,27.81 138.28,28.77 138.74,29.89 138.9,31.09 138.9,41.67 138.74,42.87 138.28,43.98 137.54,44.94 136.58,45.68 135.47,46.14 134.27,46.3 123.69,46.3 122.49,46.14 121.37,45.68 120.41,44.94 119.68,43.98 119.21,42.87 119.06,41.67 "
            style="fill:url(#hatch2db9197d1dd34ec6a96c1df3c769c1f3);"
          />
          <linearGradient
            id="gradiente627b093eb384267aa5f678537adf961"
            gradientUnits="userSpaceOnUse"
            x1="5.85921475478483"
            y1="73.2451025543645"
            x2="159.495105771338"
            y2="92.1092179717585"
          >
            <stop offset="0%" stop-color="#E5B9B7" />
            <stop offset="90%" stop-color="#8DB3E2" />
            <stop offset="100%" stop-color="#E5B9B7" />
          </linearGradient>
          <polygon
            points="79.37,15.54 79.55,14.66 80.05,13.91 80.8,13.4 81.69,13.23 86.05,13.23 86.05,19.91 79.37,19.91 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="85.92,16.54 85.92,13.23 92.66,13.23 92.66,19.84 85.92,19.84 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="92.53,13.23 96.9,13.23 97.78,13.4 98.53,13.91 99.04,14.66 99.21,15.54 99.21,19.91 92.53,19.91 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="66.14,22.16 66.32,21.27 66.82,20.52 67.57,20.02 68.46,19.84 72.82,19.84 72.82,26.46 68.46,26.46 67.57,26.28 66.82,25.78 66.32,25.03 66.14,24.14 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="72.69,23.15 72.69,19.84 79.44,19.84 79.44,26.46 72.69,26.46 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="79.3,23.15 79.3,19.78 85.98,19.78 85.98,26.52 79.3,26.52 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="92.6,23.15 92.6,19.78 99.21,19.78 99.21,26.52 92.6,26.52 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="79.37,26.39 86.05,26.39 86.05,33.07 81.69,33.07 80.8,32.89 80.05,32.39 79.55,31.64 79.37,30.76 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="85.92,29.76 85.92,26.46 92.66,26.46 92.66,33.07 85.92,33.07 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="92.53,29.76 92.53,26.39 99.21,26.39 99.21,33.14 92.53,33.14 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="66.14,35.39 66.32,34.5 66.82,33.75 67.57,33.25 68.46,33.07 72.82,33.07 72.82,39.69 68.46,39.69 67.57,39.51 66.82,39.01 66.32,38.26 66.14,37.37 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="72.69,33.07 77.06,33.07 77.94,33.25 78.69,33.75 79.19,34.5 79.37,35.39 79.37,39.75 72.69,39.75 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="92.6,36.38 92.6,33 99.21,33 99.21,39.75 92.6,39.75 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="72.76,39.62 79.37,39.62 79.37,43.98 79.19,44.87 78.69,45.62 77.94,46.12 77.06,46.3 75.07,46.3 74.18,46.12 73.43,45.62 72.93,44.87 72.76,43.98 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="92.6,39.62 99.21,39.62 99.21,43.98 99.04,44.87 98.53,45.62 97.78,46.12 96.9,46.3 94.91,46.3 94.03,46.12 93.28,45.62 92.77,44.87 92.6,43.98 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="66.14,48.61 66.32,47.73 66.82,46.98 67.57,46.48 68.46,46.3 70.44,46.3 71.33,46.48 72.08,46.98 72.58,47.73 72.76,48.61 72.76,52.98 66.14,52.98 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="85.98,48.61 86.16,47.73 86.66,46.98 87.41,46.48 88.3,46.3 90.28,46.3 91.17,46.48 91.92,46.98 92.42,47.73 92.6,48.61 92.6,50.6 92.42,51.48 91.92,52.24 91.17,52.74 90.28,52.91 88.3,52.91 87.41,52.74 86.66,52.24 86.16,51.48 85.98,50.6 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="66.14,52.85 72.76,52.85 72.76,57.21 72.58,58.1 72.08,58.85 71.33,59.35 70.44,59.53 68.46,59.53 67.57,59.35 66.82,58.85 66.32,58.1 66.14,57.21 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="79.37,55.23 79.55,54.34 80.05,53.59 80.8,53.09 81.69,52.91 83.67,52.91 84.56,53.09 85.31,53.59 85.81,54.34 85.98,55.23 85.98,57.21 85.81,58.1 85.31,58.85 84.56,59.35 83.67,59.53 81.69,59.53 80.8,59.35 80.05,58.85 79.55,58.1 79.37,57.21 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="92.6,55.23 92.77,54.34 93.28,53.59 94.03,53.09 94.91,52.91 96.9,52.91 97.78,53.09 98.53,53.59 99.04,54.34 99.21,55.23 99.21,57.21 99.04,58.1 98.53,58.85 97.78,59.35 96.9,59.53 94.91,59.53 94.03,59.35 93.28,58.85 92.77,58.1 92.6,57.21 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="72.76,61.84 72.93,60.96 73.43,60.21 74.18,59.7 75.07,59.53 77.06,59.53 77.94,59.7 78.69,60.21 79.19,60.96 79.37,61.84 79.37,63.83 79.19,64.71 78.69,65.46 77.94,65.97 77.06,66.14 75.07,66.14 74.18,65.97 73.43,65.46 72.93,64.71 72.76,63.83 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="13.23,68.46 13.4,67.57 13.91,66.82 14.66,66.32 15.54,66.14 19.91,66.14 19.91,72.82 13.23,72.82 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="19.78,69.45 19.78,66.14 26.52,66.14 26.52,72.82 19.78,72.82 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="26.39,69.45 26.39,66.14 33.14,66.14 33.14,72.82 26.39,72.82 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="33,69.45 33,66.14 39.75,66.14 39.75,72.76 33,72.76 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="39.62,66.14 43.98,66.14 44.87,66.32 45.62,66.82 46.12,67.57 46.3,68.46 46.3,70.44 46.12,71.33 45.62,72.08 44.87,72.58 43.98,72.76 39.62,72.76 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="52.91,68.46 53.09,67.57 53.59,66.82 54.34,66.32 55.23,66.14 59.59,66.14 59.59,72.76 55.23,72.76 54.34,72.58 53.59,72.08 53.09,71.33 52.91,70.44 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="59.46,69.45 59.46,66.14 66.21,66.14 66.21,72.82 59.46,72.82 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="66.08,66.14 70.44,66.14 71.33,66.32 72.08,66.82 72.58,67.57 72.76,68.46 72.76,70.44 72.58,71.33 72.08,72.08 71.33,72.58 70.44,72.76 66.08,72.76 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="85.98,68.46 86.16,67.57 86.66,66.82 87.41,66.32 88.3,66.14 90.28,66.14 91.17,66.32 91.92,66.82 92.42,67.57 92.6,68.46 92.6,72.82 85.98,72.82 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="99.21,68.46 99.39,67.57 99.89,66.82 100.64,66.32 101.53,66.14 103.51,66.14 104.4,66.32 105.15,66.82 105.65,67.57 105.83,68.46 105.83,72.82 99.21,72.82 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="112.44,68.46 112.62,67.57 113.12,66.82 113.87,66.32 114.76,66.14 116.74,66.14 117.63,66.32 118.38,66.82 118.88,67.57 119.06,68.46 119.06,70.44 118.88,71.33 118.38,72.08 117.63,72.58 116.74,72.76 114.76,72.76 113.87,72.58 113.12,72.08 112.62,71.33 112.44,70.44 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="125.67,68.46 125.85,67.57 126.35,66.82 127.1,66.32 127.98,66.14 129.97,66.14 130.85,66.32 131.61,66.82 132.11,67.57 132.28,68.46 132.28,72.82 125.67,72.82 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="138.9,68.46 139.07,67.57 139.58,66.82 140.33,66.32 141.21,66.14 143.2,66.14 144.08,66.32 144.83,66.82 145.34,67.57 145.51,68.46 145.51,72.82 138.9,72.82 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="13.23,72.69 19.91,72.69 19.91,79.37 15.54,79.37 14.66,79.19 13.91,78.69 13.4,77.94 13.23,77.06 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="19.78,76.06 19.78,72.69 26.52,72.69 26.52,79.37 19.78,79.37 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="26.39,76.06 26.39,72.69 33.07,72.69 33.07,79.44 26.39,79.44 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="46.3,75.07 46.48,74.18 46.98,73.43 47.73,72.93 48.61,72.76 50.6,72.76 51.48,72.93 52.24,73.43 52.74,74.18 52.91,75.07 52.91,79.44 46.3,79.44 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="59.53,72.69 66.14,72.69 66.14,77.06 65.97,77.94 65.46,78.69 64.71,79.19 63.83,79.37 61.84,79.37 60.96,79.19 60.21,78.69 59.7,77.94 59.53,77.06 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="72.76,75.07 72.93,74.18 73.43,73.43 74.18,72.93 75.07,72.76 77.06,72.76 77.94,72.93 78.69,73.43 79.19,74.18 79.37,75.07 79.37,79.44 72.76,79.44 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="85.98,72.69 92.66,72.69 92.66,79.37 88.3,79.37 87.41,79.19 86.66,78.69 86.16,77.94 85.98,77.06 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="92.53,76.06 92.53,72.76 99.28,72.76 99.28,79.44 92.53,79.44 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="99.15,76.06 99.15,72.69 105.89,72.69 105.89,79.37 99.15,79.37 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="105.76,72.76 110.13,72.76 111.01,72.93 111.76,73.43 112.26,74.18 112.44,75.07 112.44,79.44 105.76,79.44 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="125.67,76.06 125.67,72.69 132.35,72.69 132.35,79.44 125.67,79.44 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="132.22,76.06 132.22,72.76 138.96,72.76 138.96,79.37 132.22,79.37 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="138.83,76.06 138.83,72.69 145.58,72.69 145.58,79.37 138.83,79.37 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="145.45,72.76 149.81,72.76 150.7,72.93 151.45,73.43 151.95,74.18 152.13,75.07 152.13,79.44 145.45,79.44 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="26.46,79.3 33.07,79.3 33.07,83.67 32.89,84.56 32.39,85.31 31.64,85.81 30.76,85.98 28.77,85.98 27.89,85.81 27.13,85.31 26.63,84.56 26.46,83.67 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="39.69,81.69 39.86,80.8 40.36,80.05 41.11,79.55 42,79.37 46.37,79.37 46.37,85.98 42,85.98 41.11,85.81 40.36,85.31 39.86,84.56 39.69,83.67 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="46.23,82.68 46.23,79.3 52.98,79.3 52.98,85.98 46.23,85.98 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="52.85,79.37 57.21,79.37 58.1,79.55 58.85,80.05 59.35,80.8 59.53,81.69 59.53,83.67 59.35,84.56 58.85,85.31 58.1,85.81 57.21,85.98 52.85,85.98 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="66.14,81.69 66.32,80.8 66.82,80.05 67.57,79.55 68.46,79.37 72.82,79.37 72.82,85.98 68.46,85.98 67.57,85.81 66.82,85.31 66.32,84.56 66.14,83.67 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="72.69,79.3 79.37,79.3 79.37,83.67 79.19,84.56 78.69,85.31 77.94,85.81 77.06,85.98 72.69,85.98 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="92.6,82.68 92.6,79.3 99.21,79.3 99.21,86.05 92.6,86.05 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="105.83,82.68 105.83,79.3 112.51,79.3 112.51,86.05 105.83,86.05 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="112.37,79.37 116.74,79.37 117.63,79.55 118.38,80.05 118.88,80.8 119.06,81.69 119.06,83.67 118.88,84.56 118.38,85.31 117.63,85.81 116.74,85.98 112.37,85.98 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="125.67,79.3 132.28,79.3 132.28,83.67 132.11,84.56 131.61,85.31 130.85,85.81 129.97,85.98 127.98,85.98 127.1,85.81 126.35,85.31 125.85,84.56 125.67,83.67 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="145.51,82.68 145.51,79.3 152.13,79.3 152.13,86.05 145.51,86.05 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="13.23,88.3 13.4,87.41 13.91,86.66 14.66,86.16 15.54,85.98 17.53,85.98 18.41,86.16 19.16,86.66 19.67,87.41 19.84,88.3 19.84,90.28 19.67,91.17 19.16,91.92 18.41,92.42 17.53,92.6 15.54,92.6 14.66,92.42 13.91,91.92 13.4,91.17 13.23,90.28 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="33.07,88.3 33.25,87.41 33.75,86.66 34.5,86.16 35.39,85.98 37.37,85.98 38.26,86.16 39.01,86.66 39.51,87.41 39.69,88.3 39.69,92.66 33.07,92.66 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="85.98,88.3 86.16,87.41 86.66,86.66 87.41,86.16 88.3,85.98 92.66,85.98 92.66,92.6 88.3,92.6 87.41,92.42 86.66,91.92 86.16,91.17 85.98,90.28 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="92.53,89.29 92.53,85.92 99.28,85.92 99.28,92.66 92.53,92.66 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="99.15,89.29 99.15,85.98 105.89,85.98 105.89,92.6 99.15,92.6 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="105.76,85.92 112.44,85.92 112.44,90.28 112.26,91.17 111.76,91.92 111.01,92.42 110.13,92.6 105.76,92.6 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="132.28,88.3 132.46,87.41 132.96,86.66 133.71,86.16 134.6,85.98 138.96,85.98 138.96,92.6 134.6,92.6 133.71,92.42 132.96,91.92 132.46,91.17 132.28,90.28 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="138.83,89.29 138.83,85.98 145.58,85.98 145.58,92.66 138.83,92.66 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="145.45,85.92 152.13,85.92 152.13,90.28 151.95,91.17 151.45,91.92 150.7,92.42 149.81,92.6 145.45,92.6 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="19.84,94.91 20.02,94.03 20.52,93.28 21.27,92.77 22.16,92.6 24.14,92.6 25.03,92.77 25.78,93.28 26.28,94.03 26.46,94.91 26.46,96.9 26.28,97.78 25.78,98.53 25.03,99.04 24.14,99.21 22.16,99.21 21.27,99.04 20.52,98.53 20.02,97.78 19.84,96.9 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="33.07,92.53 39.75,92.53 39.75,99.21 35.39,99.21 34.5,99.04 33.75,98.53 33.25,97.78 33.07,96.9 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="39.62,92.6 43.98,92.6 44.87,92.77 45.62,93.28 46.12,94.03 46.3,94.91 46.3,96.9 46.12,97.78 45.62,98.53 44.87,99.04 43.98,99.21 39.62,99.21 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="52.91,94.91 53.09,94.03 53.59,93.28 54.34,92.77 55.23,92.6 57.21,92.6 58.1,92.77 58.85,93.28 59.35,94.03 59.53,94.91 59.53,96.9 59.35,97.78 58.85,98.53 58.1,99.04 57.21,99.21 55.23,99.21 54.34,99.04 53.59,98.53 53.09,97.78 52.91,96.9 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="66.14,94.91 66.32,94.03 66.82,93.28 67.57,92.77 68.46,92.6 72.82,92.6 72.82,99.28 66.14,99.28 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="72.69,92.6 77.06,92.6 77.94,92.77 78.69,93.28 79.19,94.03 79.37,94.91 79.37,96.9 79.19,97.78 78.69,98.53 77.94,99.04 77.06,99.21 72.69,99.21 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="92.6,95.91 92.6,92.53 99.21,92.53 99.21,99.28 92.6,99.28 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="112.44,94.91 112.62,94.03 113.12,93.28 113.87,92.77 114.76,92.6 116.74,92.6 117.63,92.77 118.38,93.28 118.88,94.03 119.06,94.91 119.06,99.28 112.44,99.28 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="138.9,92.53 145.51,92.53 145.51,96.9 145.34,97.78 144.83,98.53 144.08,99.04 143.2,99.21 141.21,99.21 140.33,99.04 139.58,98.53 139.07,97.78 138.9,96.9 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="66.14,102.52 66.14,99.15 72.76,99.15 72.76,105.89 66.14,105.89 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="79.37,101.53 79.55,100.64 80.05,99.89 80.8,99.39 81.69,99.21 83.67,99.21 84.56,99.39 85.31,99.89 85.81,100.64 85.98,101.53 85.98,103.51 85.81,104.4 85.31,105.15 84.56,105.65 83.67,105.83 81.69,105.83 80.8,105.65 80.05,105.15 79.55,104.4 79.37,103.51 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="92.6,99.15 99.21,99.15 99.21,103.51 99.04,104.4 98.53,105.15 97.78,105.65 96.9,105.83 94.91,105.83 94.03,105.65 93.28,105.15 92.77,104.4 92.6,103.51 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="112.44,99.15 119.06,99.15 119.06,103.51 118.88,104.4 118.38,105.15 117.63,105.65 116.74,105.83 114.76,105.83 113.87,105.65 113.12,105.15 112.62,104.4 112.44,103.51 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="132.28,101.53 132.46,100.64 132.96,99.89 133.71,99.39 134.6,99.21 136.58,99.21 137.47,99.39 138.22,99.89 138.72,100.64 138.9,101.53 138.9,103.51 138.72,104.4 138.22,105.15 137.47,105.65 136.58,105.83 134.6,105.83 133.71,105.65 132.96,105.15 132.46,104.4 132.28,103.51 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="66.14,105.76 72.76,105.76 72.76,110.13 72.58,111.01 72.08,111.76 71.33,112.26 70.44,112.44 68.46,112.44 67.57,112.26 66.82,111.76 66.32,111.01 66.14,110.13 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="85.98,108.14 86.16,107.26 86.66,106.5 87.41,106 88.3,105.83 90.28,105.83 91.17,106 91.92,106.5 92.42,107.26 92.6,108.14 92.6,110.13 92.42,111.01 91.92,111.76 91.17,112.26 90.28,112.44 88.3,112.44 87.41,112.26 86.66,111.76 86.16,111.01 85.98,110.13 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="99.21,108.14 99.39,107.26 99.89,106.5 100.64,106 101.53,105.83 103.51,105.83 104.4,106 105.15,106.5 105.65,107.26 105.83,108.14 105.83,110.13 105.65,111.01 105.15,111.76 104.4,112.26 103.51,112.44 101.53,112.44 100.64,112.26 99.89,111.76 99.39,111.01 99.21,110.13 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="119.06,108.14 119.23,107.26 119.73,106.5 120.48,106 121.37,105.83 125.74,105.83 125.74,112.51 119.06,112.51 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="125.6,105.83 129.97,105.83 130.85,106 131.61,106.5 132.11,107.26 132.28,108.14 132.28,110.13 132.11,111.01 131.61,111.76 130.85,112.26 129.97,112.44 125.6,112.44 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="138.9,108.14 139.07,107.26 139.58,106.5 140.33,106 141.21,105.83 145.58,105.83 145.58,112.44 141.21,112.44 140.33,112.26 139.58,111.76 139.07,111.01 138.9,110.13 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="145.45,105.83 149.81,105.83 150.7,106 151.45,106.5 151.95,107.26 152.13,108.14 152.13,112.51 145.45,112.51 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="72.76,114.76 72.93,113.87 73.43,113.12 74.18,112.62 75.07,112.44 79.44,112.44 79.44,119.12 72.76,119.12 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="79.3,112.44 83.67,112.44 84.56,112.62 85.31,113.12 85.81,113.87 85.98,114.76 85.98,119.12 79.3,119.12 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="112.44,114.76 112.62,113.87 113.12,113.12 113.87,112.62 114.76,112.44 119.12,112.44 119.12,119.06 114.76,119.06 113.87,118.88 113.12,118.38 112.62,117.63 112.44,116.74 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="118.99,115.75 118.99,112.37 125.67,112.37 125.67,119.12 118.99,119.12 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="132.28,114.76 132.46,113.87 132.96,113.12 133.71,112.62 134.6,112.44 136.58,112.44 137.47,112.62 138.22,113.12 138.72,113.87 138.9,114.76 138.9,119.12 132.28,119.12 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="145.51,112.37 152.13,112.37 152.13,116.74 151.95,117.63 151.45,118.38 150.7,118.88 149.81,119.06 147.83,119.06 146.94,118.88 146.19,118.38 145.69,117.63 145.51,116.74 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="66.14,121.37 66.32,120.48 66.82,119.73 67.57,119.23 68.46,119.06 72.82,119.06 72.82,125.74 66.14,125.74 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="72.69,122.36 72.69,118.99 79.44,118.99 79.44,125.74 72.69,125.74 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="79.3,122.36 79.3,118.99 86.05,118.99 86.05,125.67 79.3,125.67 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="85.92,119.06 90.28,119.06 91.17,119.23 91.92,119.73 92.42,120.48 92.6,121.37 92.6,125.74 85.92,125.74 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="99.21,121.37 99.39,120.48 99.89,119.73 100.64,119.23 101.53,119.06 103.51,119.06 104.4,119.23 105.15,119.73 105.65,120.48 105.83,121.37 105.83,125.74 99.21,125.74 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="119.06,118.99 125.74,118.99 125.74,125.67 121.37,125.67 120.48,125.49 119.73,124.99 119.23,124.24 119.06,123.35 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="125.6,122.36 125.6,119.06 132.35,119.06 132.35,125.74 125.6,125.74 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="132.22,122.36 132.22,118.99 138.9,118.99 138.9,125.74 132.22,125.74 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="66.14,128.98 66.14,125.6 72.82,125.6 72.82,132.35 66.14,132.35 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="72.69,128.98 72.69,125.6 79.37,125.6 79.37,132.35 72.69,132.35 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="85.98,125.6 92.66,125.6 92.66,132.28 88.3,132.28 87.41,132.11 86.66,131.61 86.16,130.85 85.98,129.97 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="92.53,128.98 92.53,125.67 99.28,125.67 99.28,132.35 92.53,132.35 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="99.15,128.98 99.15,125.6 105.89,125.6 105.89,132.28 99.15,132.28 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="105.76,128.98 105.76,125.67 112.51,125.67 112.51,132.35 105.76,132.35 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="112.37,125.67 116.74,125.67 117.63,125.85 118.38,126.35 118.88,127.1 119.06,127.98 119.06,132.35 112.37,132.35 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="125.67,128.98 125.67,125.6 132.35,125.6 132.35,132.35 125.67,132.35 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="132.22,128.98 132.22,125.6 138.9,125.6 138.9,132.35 132.22,132.35 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="66.14,135.59 66.14,132.22 72.82,132.22 72.82,138.96 66.14,138.96 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="72.69,132.22 79.37,132.22 79.37,136.58 79.19,137.47 78.69,138.22 77.94,138.72 77.06,138.9 72.69,138.9 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="92.6,135.59 92.6,132.22 99.21,132.22 99.21,138.96 92.6,138.96 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="105.83,135.59 105.83,132.22 112.51,132.22 112.51,138.96 105.83,138.96 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="112.37,135.59 112.37,132.22 119.06,132.22 119.06,138.96 112.37,138.96 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="125.67,132.22 132.35,132.22 132.35,138.9 127.98,138.9 127.1,138.72 126.35,138.22 125.85,137.47 125.67,136.58 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="132.22,135.59 132.22,132.22 138.9,132.22 138.9,138.96 132.22,138.96 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="66.14,142.2 66.14,138.83 72.76,138.83 72.76,145.58 66.14,145.58 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="79.37,141.21 79.55,140.33 80.05,139.58 80.8,139.07 81.69,138.9 86.05,138.9 86.05,145.58 79.37,145.58 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="85.92,142.2 85.92,138.9 92.66,138.9 92.66,145.51 85.92,145.51 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="92.53,142.2 92.53,138.83 99.28,138.83 99.28,145.58 92.53,145.58 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="99.15,142.2 99.15,138.9 105.89,138.9 105.89,145.51 99.15,145.51 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="105.76,142.2 105.76,138.83 112.51,138.83 112.51,145.51 105.76,145.51 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="112.37,142.2 112.37,138.83 119.12,138.83 119.12,145.58 112.37,145.58 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="118.99,138.9 123.35,138.9 124.24,139.07 124.99,139.58 125.49,140.33 125.67,141.21 125.67,143.2 125.49,144.08 124.99,144.83 124.24,145.34 123.35,145.51 118.99,145.51 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="132.28,142.2 132.28,138.83 138.96,138.83 138.96,145.58 132.28,145.58 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="138.83,138.9 143.2,138.9 144.08,139.07 144.83,139.58 145.34,140.33 145.51,141.21 145.51,143.2 145.34,144.08 144.83,144.83 144.08,145.34 143.2,145.51 138.83,145.51 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="66.14,145.45 72.82,145.45 72.82,152.13 68.46,152.13 67.57,151.95 66.82,151.45 66.32,150.7 66.14,149.81 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="72.69,148.82 72.69,145.51 79.44,145.51 79.44,152.13 72.69,152.13 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="79.3,145.45 85.98,145.45 85.98,149.81 85.81,150.7 85.31,151.45 84.56,151.95 83.67,152.13 79.3,152.13 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="92.6,145.45 99.21,145.45 99.21,149.81 99.04,150.7 98.53,151.45 97.78,151.95 96.9,152.13 94.91,152.13 94.03,151.95 93.28,151.45 92.77,150.7 92.6,149.81 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="112.44,145.45 119.06,145.45 119.06,149.81 118.88,150.7 118.38,151.45 117.63,151.95 116.74,152.13 114.76,152.13 113.87,151.95 113.12,151.45 112.62,150.7 112.44,149.81 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
          <polygon
            points="132.28,145.45 138.9,145.45 138.9,149.81 138.72,150.7 138.22,151.45 137.47,151.95 136.58,152.13 134.6,152.13 133.71,151.95 132.96,151.45 132.46,150.7 132.28,149.81 "
            style="fill:url(#gradiente627b093eb384267aa5f678537adf961);"
          />
      `,
            },
            {
                value: 23,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(37,86,99,1);"
            shape-rendering="crispEdges"
          />
          <pattern
            id="glassae3eb042472a405d96f6461eac120955"
            x="13.22835"
            y="13.22835"
            width="138.8976"
            height="138.8976"
            patternUnits="userSpaceOnUse"
          >
            <rect x="0" y="0" width="138.8976" height="138.8976" style="fill:rgb(219,238,243);fill-opacity:1;" />
            <rect x="0" y="0" width="138.8976" height="69.44881" style="fill:rgb(231,250,255);fill-opacity:1;" />
          </pattern>
          <polygon
            points="13.23,29.76 13.55,26.54 14.49,23.44 16.02,20.58 18.07,18.07 20.58,16.02 23.44,14.49 26.54,13.55 29.76,13.23 59.53,13.23 59.53,59.53 13.23,59.53 13.23,29.76 19.84,29.76 19.84,52.91 52.91,52.91 52.91,19.84 29.76,19.84 27.2,20.18 24.8,21.17 22.75,22.75 21.17,24.8 20.18,27.2 19.84,29.76 "
            style="fill:url(#glassae3eb042472a405d96f6461eac120955);"
          />
          <polygon
            points="13.23,122.36 13.23,105.83 59.53,105.83 59.53,152.13 29.76,152.13 26.54,151.81 23.44,150.87 20.58,149.34 18.07,147.28 16.02,144.78 14.49,141.92 13.55,138.82 13.23,135.59 13.23,122.36 19.84,122.36 19.84,135.59 20.18,138.16 21.17,140.55 22.75,142.61 24.8,144.18 27.2,145.17 29.76,145.51 52.91,145.51 52.91,112.44 19.84,112.44 19.84,122.36 "
            style="fill:url(#glassae3eb042472a405d96f6461eac120955);"
          />
          <polygon
            points="105.83,29.76 105.83,13.23 135.59,13.23 138.82,13.55 141.92,14.49 144.78,16.02 147.28,18.07 149.34,20.58 150.87,23.44 151.81,26.54 152.13,29.76 152.13,59.53 105.83,59.53 105.83,29.76 112.44,29.76 112.44,52.91 145.51,52.91 145.51,29.76 145.17,27.2 144.18,24.8 142.61,22.75 140.55,21.17 138.16,20.18 135.59,19.84 112.44,19.84 112.44,29.76 "
            style="fill:url(#glassae3eb042472a405d96f6461eac120955);"
          />
          <linearGradient
            id="gradienta7475673351c4aa69ee49c9489bed02a"
            gradientUnits="userSpaceOnUse"
            x1="22.0024585616932"
            y1="77.3688099608975"
            x2="143.351858149733"
            y2="87.9855067505283"
          >
            <stop offset="0%" stop-color="#93FFFF" />
            <stop offset="50%" stop-color="#7030A0" />
            <stop offset="100%" stop-color="#93FFFF" />
          </linearGradient>
          <polygon
            points="26.46,31.09 26.61,29.89 27.08,28.77 27.81,27.81 28.77,27.08 29.89,26.61 31.09,26.46 46.3,26.46 46.3,46.3 26.46,46.3 "
            style="fill:url(#gradienta7475673351c4aa69ee49c9489bed02a);"
          />
          <polygon
            points="26.46,119.06 46.3,119.06 46.3,138.9 31.09,138.9 29.89,138.74 28.77,138.28 27.81,137.54 27.08,136.58 26.61,135.47 26.46,134.27 "
            style="fill:url(#gradienta7475673351c4aa69ee49c9489bed02a);"
          />
          <polygon
            points="119.06,26.46 134.27,26.46 135.47,26.61 136.58,27.08 137.54,27.81 138.28,28.77 138.74,29.89 138.9,31.09 138.9,46.3 119.06,46.3 "
            style="fill:url(#gradienta7475673351c4aa69ee49c9489bed02a);"
          />
          <linearGradient
            id="gradient70fbdf3aa00f40a38c535d7a4bcd9a20"
            gradientUnits="userSpaceOnUse"
            x1="9.78888088478347"
            y1="78.8572474050841"
            x2="155.56543964134"
            y2="86.497073121039"
          >
            <stop offset="0%" stop-color="#B2A1C7" />
            <stop offset="100%" stop-color="#FFFFFF" />
          </linearGradient>
          <polygon
            points="79.37,16.54 82.68,13.23 85.98,16.54 82.68,19.84 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="85.98,16.54 89.29,13.23 92.6,16.54 89.29,19.84 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="92.6,16.54 95.91,13.23 99.21,16.54 95.91,19.84 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="66.14,23.15 69.45,19.84 72.76,23.15 69.45,26.46 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="72.76,23.15 76.06,19.84 79.37,23.15 76.06,26.46 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="79.37,23.15 82.68,19.84 85.98,23.15 82.68,26.46 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="92.6,23.15 95.91,19.84 99.21,23.15 95.91,26.46 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="79.37,29.76 82.68,26.46 85.98,29.76 82.68,33.07 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="85.98,29.76 89.29,26.46 92.6,29.76 89.29,33.07 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="92.6,29.76 95.91,26.46 99.21,29.76 95.91,33.07 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="66.14,36.38 69.45,33.07 72.76,36.38 69.45,39.69 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="72.76,36.38 76.06,33.07 79.37,36.38 76.06,39.69 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="92.6,36.38 95.91,33.07 99.21,36.38 95.91,39.69 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="72.76,42.99 76.06,39.69 79.37,42.99 76.06,46.3 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="92.6,42.99 95.91,39.69 99.21,42.99 95.91,46.3 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="66.14,49.61 69.45,46.3 72.76,49.61 69.45,52.91 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="85.98,49.61 89.29,46.3 92.6,49.61 89.29,52.91 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="66.14,56.22 69.45,52.91 72.76,56.22 69.45,59.53 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="79.37,56.22 82.68,52.91 85.98,56.22 82.68,59.53 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="92.6,56.22 95.91,52.91 99.21,56.22 95.91,59.53 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="72.76,62.83 76.06,59.53 79.37,62.83 76.06,66.14 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="13.23,69.45 16.54,66.14 19.84,69.45 16.54,72.76 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="19.84,69.45 23.15,66.14 26.46,69.45 23.15,72.76 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="26.46,69.45 29.76,66.14 33.07,69.45 29.76,72.76 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="33.07,69.45 36.38,66.14 39.69,69.45 36.38,72.76 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="39.69,69.45 42.99,66.14 46.3,69.45 42.99,72.76 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="52.91,69.45 56.22,66.14 59.53,69.45 56.22,72.76 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="59.53,69.45 62.83,66.14 66.14,69.45 62.83,72.76 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="66.14,69.45 69.45,66.14 72.76,69.45 69.45,72.76 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="85.98,69.45 89.29,66.14 92.6,69.45 89.29,72.76 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="99.21,69.45 102.52,66.14 105.83,69.45 102.52,72.76 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="112.44,69.45 115.75,66.14 119.06,69.45 115.75,72.76 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="125.67,69.45 128.98,66.14 132.28,69.45 128.98,72.76 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="138.9,69.45 142.2,66.14 145.51,69.45 142.2,72.76 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="13.23,76.06 16.54,72.76 19.84,76.06 16.54,79.37 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="19.84,76.06 23.15,72.76 26.46,76.06 23.15,79.37 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="26.46,76.06 29.76,72.76 33.07,76.06 29.76,79.37 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="46.3,76.06 49.61,72.76 52.91,76.06 49.61,79.37 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="59.53,76.06 62.83,72.76 66.14,76.06 62.83,79.37 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="72.76,76.06 76.06,72.76 79.37,76.06 76.06,79.37 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="85.98,76.06 89.29,72.76 92.6,76.06 89.29,79.37 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="92.6,76.06 95.91,72.76 99.21,76.06 95.91,79.37 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="99.21,76.06 102.52,72.76 105.83,76.06 102.52,79.37 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="105.83,76.06 109.13,72.76 112.44,76.06 109.13,79.37 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="125.67,76.06 128.98,72.76 132.28,76.06 128.98,79.37 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="132.28,76.06 135.59,72.76 138.9,76.06 135.59,79.37 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="138.9,76.06 142.2,72.76 145.51,76.06 142.2,79.37 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="145.51,76.06 148.82,72.76 152.13,76.06 148.82,79.37 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="26.46,82.68 29.76,79.37 33.07,82.68 29.76,85.98 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="39.69,82.68 42.99,79.37 46.3,82.68 42.99,85.98 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="46.3,82.68 49.61,79.37 52.91,82.68 49.61,85.98 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="52.91,82.68 56.22,79.37 59.53,82.68 56.22,85.98 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="66.14,82.68 69.45,79.37 72.76,82.68 69.45,85.98 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="72.76,82.68 76.06,79.37 79.37,82.68 76.06,85.98 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="92.6,82.68 95.91,79.37 99.21,82.68 95.91,85.98 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="105.83,82.68 109.13,79.37 112.44,82.68 109.13,85.98 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="112.44,82.68 115.75,79.37 119.06,82.68 115.75,85.98 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="125.67,82.68 128.98,79.37 132.28,82.68 128.98,85.98 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="145.51,82.68 148.82,79.37 152.13,82.68 148.82,85.98 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="13.23,89.29 16.54,85.98 19.84,89.29 16.54,92.6 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="33.07,89.29 36.38,85.98 39.69,89.29 36.38,92.6 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="85.98,89.29 89.29,85.98 92.6,89.29 89.29,92.6 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="92.6,89.29 95.91,85.98 99.21,89.29 95.91,92.6 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="99.21,89.29 102.52,85.98 105.83,89.29 102.52,92.6 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="105.83,89.29 109.13,85.98 112.44,89.29 109.13,92.6 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="132.28,89.29 135.59,85.98 138.9,89.29 135.59,92.6 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="138.9,89.29 142.2,85.98 145.51,89.29 142.2,92.6 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="145.51,89.29 148.82,85.98 152.13,89.29 148.82,92.6 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="19.84,95.91 23.15,92.6 26.46,95.91 23.15,99.21 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="33.07,95.91 36.38,92.6 39.69,95.91 36.38,99.21 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="39.69,95.91 42.99,92.6 46.3,95.91 42.99,99.21 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="52.91,95.91 56.22,92.6 59.53,95.91 56.22,99.21 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="66.14,95.91 69.45,92.6 72.76,95.91 69.45,99.21 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="72.76,95.91 76.06,92.6 79.37,95.91 76.06,99.21 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="92.6,95.91 95.91,92.6 99.21,95.91 95.91,99.21 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="112.44,95.91 115.75,92.6 119.06,95.91 115.75,99.21 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="138.9,95.91 142.2,92.6 145.51,95.91 142.2,99.21 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="66.14,102.52 69.45,99.21 72.76,102.52 69.45,105.83 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="79.37,102.52 82.68,99.21 85.98,102.52 82.68,105.83 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="92.6,102.52 95.91,99.21 99.21,102.52 95.91,105.83 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="112.44,102.52 115.75,99.21 119.06,102.52 115.75,105.83 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="132.28,102.52 135.59,99.21 138.9,102.52 135.59,105.83 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="66.14,109.13 69.45,105.83 72.76,109.13 69.45,112.44 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="85.98,109.13 89.29,105.83 92.6,109.13 89.29,112.44 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="99.21,109.13 102.52,105.83 105.83,109.13 102.52,112.44 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="119.06,109.13 122.36,105.83 125.67,109.13 122.36,112.44 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="125.67,109.13 128.98,105.83 132.28,109.13 128.98,112.44 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="138.9,109.13 142.2,105.83 145.51,109.13 142.2,112.44 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="145.51,109.13 148.82,105.83 152.13,109.13 148.82,112.44 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="72.76,115.75 76.06,112.44 79.37,115.75 76.06,119.06 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="79.37,115.75 82.68,112.44 85.98,115.75 82.68,119.06 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="112.44,115.75 115.75,112.44 119.06,115.75 115.75,119.06 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="119.06,115.75 122.36,112.44 125.67,115.75 122.36,119.06 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="132.28,115.75 135.59,112.44 138.9,115.75 135.59,119.06 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="145.51,115.75 148.82,112.44 152.13,115.75 148.82,119.06 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="66.14,122.36 69.45,119.06 72.76,122.36 69.45,125.67 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="72.76,122.36 76.06,119.06 79.37,122.36 76.06,125.67 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="79.37,122.36 82.68,119.06 85.98,122.36 82.68,125.67 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="85.98,122.36 89.29,119.06 92.6,122.36 89.29,125.67 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="99.21,122.36 102.52,119.06 105.83,122.36 102.52,125.67 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="119.06,122.36 122.36,119.06 125.67,122.36 122.36,125.67 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="125.67,122.36 128.98,119.06 132.28,122.36 128.98,125.67 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="132.28,122.36 135.59,119.06 138.9,122.36 135.59,125.67 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="66.14,128.98 69.45,125.67 72.76,128.98 69.45,132.28 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="72.76,128.98 76.06,125.67 79.37,128.98 76.06,132.28 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="85.98,128.98 89.29,125.67 92.6,128.98 89.29,132.28 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="92.6,128.98 95.91,125.67 99.21,128.98 95.91,132.28 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="99.21,128.98 102.52,125.67 105.83,128.98 102.52,132.28 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="105.83,128.98 109.13,125.67 112.44,128.98 109.13,132.28 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="112.44,128.98 115.75,125.67 119.06,128.98 115.75,132.28 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="125.67,128.98 128.98,125.67 132.28,128.98 128.98,132.28 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="132.28,128.98 135.59,125.67 138.9,128.98 135.59,132.28 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="66.14,135.59 69.45,132.28 72.76,135.59 69.45,138.9 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="72.76,135.59 76.06,132.28 79.37,135.59 76.06,138.9 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="92.6,135.59 95.91,132.28 99.21,135.59 95.91,138.9 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="105.83,135.59 109.13,132.28 112.44,135.59 109.13,138.9 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="112.44,135.59 115.75,132.28 119.06,135.59 115.75,138.9 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="125.67,135.59 128.98,132.28 132.28,135.59 128.98,138.9 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="132.28,135.59 135.59,132.28 138.9,135.59 135.59,138.9 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="66.14,142.2 69.45,138.9 72.76,142.2 69.45,145.51 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="79.37,142.2 82.68,138.9 85.98,142.2 82.68,145.51 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="85.98,142.2 89.29,138.9 92.6,142.2 89.29,145.51 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="92.6,142.2 95.91,138.9 99.21,142.2 95.91,145.51 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="99.21,142.2 102.52,138.9 105.83,142.2 102.52,145.51 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="105.83,142.2 109.13,138.9 112.44,142.2 109.13,145.51 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="112.44,142.2 115.75,138.9 119.06,142.2 115.75,145.51 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="119.06,142.2 122.36,138.9 125.67,142.2 122.36,145.51 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="132.28,142.2 135.59,138.9 138.9,142.2 135.59,145.51 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="138.9,142.2 142.2,138.9 145.51,142.2 142.2,145.51 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="66.14,148.82 69.45,145.51 72.76,148.82 69.45,152.13 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="72.76,148.82 76.06,145.51 79.37,148.82 76.06,152.13 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="79.37,148.82 82.68,145.51 85.98,148.82 82.68,152.13 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="92.6,148.82 95.91,145.51 99.21,148.82 95.91,152.13 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="112.44,148.82 115.75,145.51 119.06,148.82 115.75,152.13 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
          <polygon
            points="132.28,148.82 135.59,145.51 138.9,148.82 135.59,152.13 "
            style="fill:url(#gradient70fbdf3aa00f40a38c535d7a4bcd9a20);"
          />
      `,
            },
            {
                value: 24,
                innerHtml: `
      <rect
            x="0"
            y="0"
            width="165.3543"
            height="165.3543"
            fill="red"
            style="fill:rgba(37,86,99,1);"
            shape-rendering="crispEdges"
          />
          <pattern
            id="hatchad53d08ec2bb4d06b2513bb3a3c22ff9"
            x="0"
            y="0"
            width="8"
            height="8"
            patternUnits="userSpaceOnUse"
          >
            <rect x="0" y="0" width="8" height="8" fill="#B2A1C7" />
            <rect x="3" y="0" width="1" height="1" fill="#B8CCE4" />
            <rect x="7" y="0" width="1" height="1" fill="#B8CCE4" />
            <rect x="2" y="1" width="1" height="1" fill="#B8CCE4" />
            <rect x="6" y="1" width="1" height="1" fill="#B8CCE4" />
            <rect x="1" y="2" width="1" height="1" fill="#B8CCE4" />
            <rect x="5" y="2" width="1" height="1" fill="#B8CCE4" />
            <rect x="0" y="3" width="1" height="1" fill="#B8CCE4" />
            <rect x="4" y="3" width="1" height="1" fill="#B8CCE4" />
          </pattern>
          <polygon
            points="59.53,36.38 59.08,40.89 57.77,45.24 55.63,49.24 52.75,52.75 49.24,55.63 45.24,57.77 40.89,59.08 36.38,59.53 31.86,59.08 27.52,57.77 23.52,55.63 20.01,52.75 17.13,49.24 14.99,45.24 13.67,40.89 13.23,36.38 13.67,31.86 14.99,27.52 17.13,23.52 20.01,20.01 23.52,17.13 27.52,14.99 31.86,13.67 36.38,13.23 40.89,13.67 45.24,14.99 49.24,17.13 52.75,20.01 55.63,23.52 57.77,27.52 59.08,31.86 59.53,36.38 52.91,36.38 52.6,33.15 51.65,30.05 50.13,27.19 48.07,24.69 45.56,22.63 42.71,21.1 39.6,20.16 36.38,19.84 33.15,20.16 30.05,21.1 27.19,22.63 24.69,24.69 22.63,27.19 21.1,30.05 20.16,33.15 19.84,36.38 20.16,39.6 21.1,42.71 22.63,45.56 24.69,48.07 27.19,50.13 30.05,51.65 33.15,52.6 36.38,52.91 39.6,52.6 42.71,51.65 45.56,50.13 48.07,48.07 50.13,45.56 51.65,42.71 52.6,39.6 52.91,36.38 "
            style="fill:url(#hatchad53d08ec2bb4d06b2513bb3a3c22ff9);"
          />
          <polygon
            points="59.53,128.98 59.08,133.49 57.77,137.84 55.63,141.84 52.75,145.35 49.24,148.22 45.24,150.36 40.89,151.68 36.38,152.13 31.86,151.68 27.52,150.36 23.52,148.22 20.01,145.35 17.13,141.84 14.99,137.84 13.67,133.49 13.23,128.98 13.67,124.46 14.99,120.12 17.13,116.12 20.01,112.61 23.52,109.73 27.52,107.59 31.86,106.27 36.38,105.83 40.89,106.27 45.24,107.59 49.24,109.73 52.75,112.61 55.63,116.12 57.77,120.12 59.08,124.46 59.53,128.98 52.91,128.98 52.6,125.75 51.65,122.65 50.13,119.79 48.07,117.28 45.56,115.23 42.71,113.7 39.6,112.76 36.38,112.44 33.15,112.76 30.05,113.7 27.19,115.23 24.69,117.28 22.63,119.79 21.1,122.65 20.16,125.75 19.84,128.98 20.16,132.2 21.1,135.3 22.63,138.16 24.69,140.67 27.19,142.73 30.05,144.25 33.15,145.19 36.38,145.51 39.6,145.19 42.71,144.25 45.56,142.73 48.07,140.67 50.13,138.16 51.65,135.3 52.6,132.2 52.91,128.98 "
            style="fill:url(#hatchad53d08ec2bb4d06b2513bb3a3c22ff9);"
          />
          <polygon
            points="152.13,36.38 151.68,40.89 150.36,45.24 148.22,49.24 145.35,52.75 141.84,55.63 137.84,57.77 133.49,59.08 128.98,59.53 124.46,59.08 120.12,57.77 116.12,55.63 112.61,52.75 109.73,49.24 107.59,45.24 106.27,40.89 105.83,36.38 106.27,31.86 107.59,27.52 109.73,23.52 112.61,20.01 116.12,17.13 120.12,14.99 124.46,13.67 128.98,13.23 133.49,13.67 137.84,14.99 141.84,17.13 145.35,20.01 148.22,23.52 150.36,27.52 151.68,31.86 152.13,36.38 145.51,36.38 145.19,33.15 144.25,30.05 142.73,27.19 140.67,24.69 138.16,22.63 135.3,21.1 132.2,20.16 128.98,19.84 125.75,20.16 122.65,21.1 119.79,22.63 117.28,24.69 115.23,27.19 113.7,30.05 112.76,33.15 112.44,36.38 112.76,39.6 113.7,42.71 115.23,45.56 117.28,48.07 119.79,50.13 122.65,51.65 125.75,52.6 128.98,52.91 132.2,52.6 135.3,51.65 138.16,50.13 140.67,48.07 142.73,45.56 144.25,42.71 145.19,39.6 145.51,36.38 "
            style="fill:url(#hatchad53d08ec2bb4d06b2513bb3a3c22ff9);"
          />
          <linearGradient
            id="gradientfaf3a21afc704938bc9ffddae142b7dd"
            gradientUnits="userSpaceOnUse"
            x1="24.8031482696533"
            y1="82.0984210968018"
            x2="140.551179885864"
            y2="82.0984210968018"
          >
            <stop offset="0%" stop-color="#00B0F0" />
            <stop offset="100%" stop-color="#E5E0EC" />
          </linearGradient>
          <polygon
            points="24.8,33.95 25.15,33.14 26.54,32.33 31.98,31.29 34.41,25.96 35.1,25.15 36.03,24.8 36.73,25.03 37.54,25.84 40.08,30.94 45.29,31.75 47.14,32.56 47.95,33.72 47.72,34.76 46.8,35.8 42.28,38.46 44.02,43.67 44.13,45.17 43.79,46.22 42.98,46.68 42.05,46.56 36.03,42.51 31.86,46.33 30.82,46.8 29.9,46.68 29.2,45.99 28.97,44.94 30.13,38.58 25.73,35.57 25.03,34.87 "
            style="fill:url(#gradientfaf3a21afc704938bc9ffddae142b7dd);"
          />
          <polygon
            points="24.8,126.55 25.15,125.74 26.54,124.93 31.98,123.88 34.41,118.56 35.1,117.75 36.03,117.4 36.73,117.63 37.54,118.44 40.08,123.54 45.29,124.35 47.14,125.16 47.95,126.31 47.72,127.36 46.8,128.4 42.28,131.06 44.02,136.27 44.13,137.77 43.79,138.81 42.98,139.28 42.05,139.16 36.03,135.11 31.86,138.93 30.82,139.39 29.9,139.28 29.2,138.58 28.97,137.54 30.13,131.18 25.73,128.17 25.03,127.47 "
            style="fill:url(#gradientfaf3a21afc704938bc9ffddae142b7dd);"
          />
          <polygon
            points="117.4,33.95 117.75,33.14 119.14,32.33 124.58,31.29 127.01,25.96 127.7,25.15 128.63,24.8 129.32,25.03 130.13,25.84 132.68,30.94 137.89,31.75 139.74,32.56 140.55,33.72 140.32,34.76 139.39,35.8 134.88,38.46 136.62,43.67 136.73,45.17 136.38,46.22 135.57,46.68 134.65,46.56 128.63,42.51 124.46,46.33 123.42,46.8 122.49,46.68 121.8,45.99 121.57,44.94 122.73,38.58 118.33,35.57 117.63,34.87 "
            style="fill:url(#gradientfaf3a21afc704938bc9ffddae142b7dd);"
          />
          <linearGradient
            id="gradientffcbed388ab34855992a9fd38824ed9b"
            gradientUnits="userSpaceOnUse"
            x1="9.8216375862194"
            y1="78.893629314992"
            x2="154.209852739708"
            y2="86.4606950258283"
          >
            <stop offset="0%" stop-color="#FF2864" />
            <stop offset="50%" stop-color="#92D750" />
            <stop offset="100%" stop-color="#FF2864" />
          </linearGradient>
          <polygon
            points="82.02,19.18 81,18.98 80.14,18.41 79.57,17.55 79.37,16.54 79.57,15.52 80.14,14.66 81,14.09 82.02,13.89 95.24,13.89 96.26,14.09 97.11,14.66 97.69,15.52 97.89,16.54 97.69,17.55 97.11,18.41 96.26,18.98 95.24,19.18 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="68.79,25.8 67.77,25.59 66.92,25.02 66.34,24.16 66.14,23.15 66.34,22.14 66.92,21.28 67.77,20.71 68.79,20.5 82.02,20.5 83.03,20.71 83.89,21.28 84.46,22.14 84.66,23.15 84.46,24.16 83.89,25.02 83.03,25.59 82.02,25.8 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="95.24,25.8 94.23,25.59 93.37,25.02 92.8,24.16 92.6,23.15 92.8,22.14 93.37,21.28 94.23,20.71 95.24,20.5 95.24,20.5 96.26,20.71 97.11,21.28 97.69,22.14 97.89,23.15 97.69,24.16 97.11,25.02 96.26,25.59 95.24,25.8 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="82.02,32.41 81,32.21 80.14,31.63 79.57,30.78 79.37,29.76 79.57,28.75 80.14,27.89 81,27.32 82.02,27.12 95.24,27.12 96.26,27.32 97.11,27.89 97.69,28.75 97.89,29.76 97.69,30.78 97.11,31.63 96.26,32.21 95.24,32.41 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="68.79,39.02 67.77,38.82 66.92,38.25 66.34,37.39 66.14,36.38 66.34,35.37 66.92,34.51 67.77,33.93 68.79,33.73 75.4,33.73 76.41,33.93 77.27,34.51 77.85,35.37 78.05,36.38 77.85,37.39 77.27,38.25 76.41,38.82 75.4,39.02 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="95.24,39.02 94.23,38.82 93.37,38.25 92.8,37.39 92.6,36.38 92.8,35.37 93.37,34.51 94.23,33.93 95.24,33.73 95.24,33.73 96.26,33.93 97.11,34.51 97.69,35.37 97.89,36.38 97.69,37.39 97.11,38.25 96.26,38.82 95.24,39.02 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="75.4,45.64 74.39,45.44 73.53,44.86 72.96,44 72.76,42.99 72.96,41.98 73.53,41.12 74.39,40.55 75.4,40.35 75.4,40.35 76.41,40.55 77.27,41.12 77.85,41.98 78.05,42.99 77.85,44 77.27,44.86 76.41,45.44 75.4,45.64 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="95.24,45.64 94.23,45.44 93.37,44.86 92.8,44 92.6,42.99 92.8,41.98 93.37,41.12 94.23,40.55 95.24,40.35 95.24,40.35 96.26,40.55 97.11,41.12 97.69,41.98 97.89,42.99 97.69,44 97.11,44.86 96.26,45.44 95.24,45.64 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="68.79,52.25 67.77,52.05 66.92,51.48 66.34,50.62 66.14,49.61 66.34,48.59 66.92,47.74 67.77,47.16 68.79,46.96 68.79,46.96 69.8,47.16 70.66,47.74 71.23,48.59 71.43,49.61 71.23,50.62 70.66,51.48 69.8,52.05 68.79,52.25 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="88.63,52.25 87.62,52.05 86.76,51.48 86.19,50.62 85.98,49.61 86.19,48.59 86.76,47.74 87.62,47.16 88.63,46.96 88.63,46.96 89.64,47.16 90.5,47.74 91.07,48.59 91.28,49.61 91.07,50.62 90.5,51.48 89.64,52.05 88.63,52.25 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="68.79,58.87 67.77,58.66 66.92,58.09 66.34,57.23 66.14,56.22 66.34,55.21 66.92,54.35 67.77,53.78 68.79,53.57 68.79,53.57 69.8,53.78 70.66,54.35 71.23,55.21 71.43,56.22 71.23,57.23 70.66,58.09 69.8,58.66 68.79,58.87 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="82.02,58.87 81,58.66 80.14,58.09 79.57,57.23 79.37,56.22 79.57,55.21 80.14,54.35 81,53.78 82.02,53.57 82.02,53.57 83.03,53.78 83.89,54.35 84.46,55.21 84.66,56.22 84.46,57.23 83.89,58.09 83.03,58.66 82.02,58.87 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="95.24,58.87 94.23,58.66 93.37,58.09 92.8,57.23 92.6,56.22 92.8,55.21 93.37,54.35 94.23,53.78 95.24,53.57 95.24,53.57 96.26,53.78 97.11,54.35 97.69,55.21 97.89,56.22 97.69,57.23 97.11,58.09 96.26,58.66 95.24,58.87 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="75.4,65.48 74.39,65.28 73.53,64.71 72.96,63.85 72.76,62.83 72.96,61.82 73.53,60.96 74.39,60.39 75.4,60.19 75.4,60.19 76.41,60.39 77.27,60.96 77.85,61.82 78.05,62.83 77.85,63.85 77.27,64.71 76.41,65.28 75.4,65.48 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="15.87,72.09 14.86,71.89 14,71.32 13.43,70.46 13.23,69.45 13.43,68.44 14,67.58 14.86,67 15.87,66.8 42.33,66.8 43.34,67 44.2,67.58 44.77,68.44 44.98,69.45 44.77,70.46 44.2,71.32 43.34,71.89 42.33,72.09 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="55.56,72.09 54.55,71.89 53.69,71.32 53.11,70.46 52.91,69.45 53.11,68.44 53.69,67.58 54.55,67 55.56,66.8 68.79,66.8 69.8,67 70.66,67.58 71.23,68.44 71.43,69.45 71.23,70.46 70.66,71.32 69.8,71.89 68.79,72.09 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="88.63,72.09 87.62,71.89 86.76,71.32 86.19,70.46 85.98,69.45 86.19,68.44 86.76,67.58 87.62,67 88.63,66.8 88.63,66.8 89.64,67 90.5,67.58 91.07,68.44 91.28,69.45 91.07,70.46 90.5,71.32 89.64,71.89 88.63,72.09 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="101.86,72.09 100.85,71.89 99.99,71.32 99.41,70.46 99.21,69.45 99.41,68.44 99.99,67.58 100.85,67 101.86,66.8 101.86,66.8 102.87,67 103.73,67.58 104.3,68.44 104.5,69.45 104.3,70.46 103.73,71.32 102.87,71.89 101.86,72.09 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="115.09,72.09 114.07,71.89 113.22,71.32 112.64,70.46 112.44,69.45 112.64,68.44 113.22,67.58 114.07,67 115.09,66.8 115.09,66.8 116.1,67 116.96,67.58 117.53,68.44 117.73,69.45 117.53,70.46 116.96,71.32 116.1,71.89 115.09,72.09 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="128.31,72.09 127.3,71.89 126.44,71.32 125.87,70.46 125.67,69.45 125.87,68.44 126.44,67.58 127.3,67 128.31,66.8 128.31,66.8 129.33,67 130.19,67.58 130.76,68.44 130.96,69.45 130.76,70.46 130.19,71.32 129.33,71.89 128.31,72.09 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="141.54,72.09 140.53,71.89 139.67,71.32 139.1,70.46 138.9,69.45 139.1,68.44 139.67,67.58 140.53,67 141.54,66.8 141.54,66.8 142.56,67 143.41,67.58 143.99,68.44 144.19,69.45 143.99,70.46 143.41,71.32 142.56,71.89 141.54,72.09 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="15.87,78.71 14.86,78.51 14,77.93 13.43,77.08 13.23,76.06 13.43,75.05 14,74.19 14.86,73.62 15.87,73.42 29.1,73.42 30.11,73.62 30.97,74.19 31.55,75.05 31.75,76.06 31.55,77.08 30.97,77.93 30.11,78.51 29.1,78.71 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="48.94,78.71 47.93,78.51 47.07,77.93 46.5,77.08 46.3,76.06 46.5,75.05 47.07,74.19 47.93,73.62 48.94,73.42 48.94,73.42 49.96,73.62 50.82,74.19 51.39,75.05 51.59,76.06 51.39,77.08 50.82,77.93 49.96,78.51 48.94,78.71 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="62.17,78.71 61.16,78.51 60.3,77.93 59.73,77.08 59.53,76.06 59.73,75.05 60.3,74.19 61.16,73.62 62.17,73.42 62.17,73.42 63.19,73.62 64.04,74.19 64.62,75.05 64.82,76.06 64.62,77.08 64.04,77.93 63.19,78.51 62.17,78.71 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="75.4,78.71 74.39,78.51 73.53,77.93 72.96,77.08 72.76,76.06 72.96,75.05 73.53,74.19 74.39,73.62 75.4,73.42 75.4,73.42 76.41,73.62 77.27,74.19 77.85,75.05 78.05,76.06 77.85,77.08 77.27,77.93 76.41,78.51 75.4,78.71 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="88.63,78.71 87.62,78.51 86.76,77.93 86.19,77.08 85.98,76.06 86.19,75.05 86.76,74.19 87.62,73.62 88.63,73.42 108.47,73.42 109.48,73.62 110.34,74.19 110.92,75.05 111.12,76.06 110.92,77.08 110.34,77.93 109.48,78.51 108.47,78.71 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="128.31,78.71 127.3,78.51 126.44,77.93 125.87,77.08 125.67,76.06 125.87,75.05 126.44,74.19 127.3,73.62 128.31,73.42 148.16,73.42 149.17,73.62 150.03,74.19 150.6,75.05 150.8,76.06 150.6,77.08 150.03,77.93 149.17,78.51 148.16,78.71 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="29.1,85.32 28.09,85.12 27.23,84.55 26.66,83.69 26.46,82.68 26.66,81.66 27.23,80.81 28.09,80.23 29.1,80.03 29.1,80.03 30.11,80.23 30.97,80.81 31.55,81.66 31.75,82.68 31.55,83.69 30.97,84.55 30.11,85.12 29.1,85.32 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="42.33,85.32 41.32,85.12 40.46,84.55 39.89,83.69 39.69,82.68 39.89,81.66 40.46,80.81 41.32,80.23 42.33,80.03 55.56,80.03 56.57,80.23 57.43,80.81 58,81.66 58.2,82.68 58,83.69 57.43,84.55 56.57,85.12 55.56,85.32 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="68.79,85.32 67.77,85.12 66.92,84.55 66.34,83.69 66.14,82.68 66.34,81.66 66.92,80.81 67.77,80.23 68.79,80.03 75.4,80.03 76.41,80.23 77.27,80.81 77.85,81.66 78.05,82.68 77.85,83.69 77.27,84.55 76.41,85.12 75.4,85.32 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="95.24,85.32 94.23,85.12 93.37,84.55 92.8,83.69 92.6,82.68 92.8,81.66 93.37,80.81 94.23,80.23 95.24,80.03 95.24,80.03 96.26,80.23 97.11,80.81 97.69,81.66 97.89,82.68 97.69,83.69 97.11,84.55 96.26,85.12 95.24,85.32 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="108.47,85.32 107.46,85.12 106.6,84.55 106.03,83.69 105.83,82.68 106.03,81.66 106.6,80.81 107.46,80.23 108.47,80.03 115.09,80.03 116.1,80.23 116.96,80.81 117.53,81.66 117.73,82.68 117.53,83.69 116.96,84.55 116.1,85.12 115.09,85.32 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="128.31,85.32 127.3,85.12 126.44,84.55 125.87,83.69 125.67,82.68 125.87,81.66 126.44,80.81 127.3,80.23 128.31,80.03 128.31,80.03 129.33,80.23 130.19,80.81 130.76,81.66 130.96,82.68 130.76,83.69 130.19,84.55 129.33,85.12 128.31,85.32 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="148.16,85.32 147.15,85.12 146.29,84.55 145.71,83.69 145.51,82.68 145.71,81.66 146.29,80.81 147.15,80.23 148.16,80.03 148.16,80.03 149.17,80.23 150.03,80.81 150.6,81.66 150.8,82.68 150.6,83.69 150.03,84.55 149.17,85.12 148.16,85.32 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="15.87,91.94 14.86,91.74 14,91.16 13.43,90.3 13.23,89.29 13.43,88.28 14,87.42 14.86,86.85 15.87,86.65 15.87,86.65 16.89,86.85 17.74,87.42 18.32,88.28 18.52,89.29 18.32,90.3 17.74,91.16 16.89,91.74 15.87,91.94 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="35.72,91.94 34.7,91.74 33.85,91.16 33.27,90.3 33.07,89.29 33.27,88.28 33.85,87.42 34.7,86.85 35.72,86.65 35.72,86.65 36.73,86.85 37.59,87.42 38.16,88.28 38.36,89.29 38.16,90.3 37.59,91.16 36.73,91.74 35.72,91.94 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="88.63,91.94 87.62,91.74 86.76,91.16 86.19,90.3 85.98,89.29 86.19,88.28 86.76,87.42 87.62,86.85 88.63,86.65 108.47,86.65 109.48,86.85 110.34,87.42 110.92,88.28 111.12,89.29 110.92,90.3 110.34,91.16 109.48,91.74 108.47,91.94 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="134.93,91.94 133.92,91.74 133.06,91.16 132.48,90.3 132.28,89.29 132.48,88.28 133.06,87.42 133.92,86.85 134.93,86.65 148.16,86.65 149.17,86.85 150.03,87.42 150.6,88.28 150.8,89.29 150.6,90.3 150.03,91.16 149.17,91.74 148.16,91.94 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="22.49,98.55 21.48,98.35 20.62,97.78 20.04,96.92 19.84,95.91 20.04,94.89 20.62,94.03 21.48,93.46 22.49,93.26 22.49,93.26 23.5,93.46 24.36,94.03 24.93,94.89 25.13,95.91 24.93,96.92 24.36,97.78 23.5,98.35 22.49,98.55 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="35.72,98.55 34.7,98.35 33.85,97.78 33.27,96.92 33.07,95.91 33.27,94.89 33.85,94.03 34.7,93.46 35.72,93.26 42.33,93.26 43.34,93.46 44.2,94.03 44.77,94.89 44.98,95.91 44.77,96.92 44.2,97.78 43.34,98.35 42.33,98.55 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="55.56,98.55 54.55,98.35 53.69,97.78 53.11,96.92 52.91,95.91 53.11,94.89 53.69,94.03 54.55,93.46 55.56,93.26 55.56,93.26 56.57,93.46 57.43,94.03 58,94.89 58.2,95.91 58,96.92 57.43,97.78 56.57,98.35 55.56,98.55 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="68.79,98.55 67.77,98.35 66.92,97.78 66.34,96.92 66.14,95.91 66.34,94.89 66.92,94.03 67.77,93.46 68.79,93.26 75.4,93.26 76.41,93.46 77.27,94.03 77.85,94.89 78.05,95.91 77.85,96.92 77.27,97.78 76.41,98.35 75.4,98.55 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="95.24,98.55 94.23,98.35 93.37,97.78 92.8,96.92 92.6,95.91 92.8,94.89 93.37,94.03 94.23,93.46 95.24,93.26 95.24,93.26 96.26,93.46 97.11,94.03 97.69,94.89 97.89,95.91 97.69,96.92 97.11,97.78 96.26,98.35 95.24,98.55 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="115.09,98.55 114.07,98.35 113.22,97.78 112.64,96.92 112.44,95.91 112.64,94.89 113.22,94.03 114.07,93.46 115.09,93.26 115.09,93.26 116.1,93.46 116.96,94.03 117.53,94.89 117.73,95.91 117.53,96.92 116.96,97.78 116.1,98.35 115.09,98.55 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="141.54,98.55 140.53,98.35 139.67,97.78 139.1,96.92 138.9,95.91 139.1,94.89 139.67,94.03 140.53,93.46 141.54,93.26 141.54,93.26 142.56,93.46 143.41,94.03 143.99,94.89 144.19,95.91 143.99,96.92 143.41,97.78 142.56,98.35 141.54,98.55 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="68.79,105.17 67.77,104.96 66.92,104.39 66.34,103.53 66.14,102.52 66.34,101.51 66.92,100.65 67.77,100.08 68.79,99.87 68.79,99.87 69.8,100.08 70.66,100.65 71.23,101.51 71.43,102.52 71.23,103.53 70.66,104.39 69.8,104.96 68.79,105.17 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="82.02,105.17 81,104.96 80.14,104.39 79.57,103.53 79.37,102.52 79.57,101.51 80.14,100.65 81,100.08 82.02,99.87 82.02,99.87 83.03,100.08 83.89,100.65 84.46,101.51 84.66,102.52 84.46,103.53 83.89,104.39 83.03,104.96 82.02,105.17 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="95.24,105.17 94.23,104.96 93.37,104.39 92.8,103.53 92.6,102.52 92.8,101.51 93.37,100.65 94.23,100.08 95.24,99.87 95.24,99.87 96.26,100.08 97.11,100.65 97.69,101.51 97.89,102.52 97.69,103.53 97.11,104.39 96.26,104.96 95.24,105.17 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="115.09,105.17 114.07,104.96 113.22,104.39 112.64,103.53 112.44,102.52 112.64,101.51 113.22,100.65 114.07,100.08 115.09,99.87 115.09,99.87 116.1,100.08 116.96,100.65 117.53,101.51 117.73,102.52 117.53,103.53 116.96,104.39 116.1,104.96 115.09,105.17 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="134.93,105.17 133.92,104.96 133.06,104.39 132.48,103.53 132.28,102.52 132.48,101.51 133.06,100.65 133.92,100.08 134.93,99.87 134.93,99.87 135.94,100.08 136.8,100.65 137.37,101.51 137.57,102.52 137.37,103.53 136.8,104.39 135.94,104.96 134.93,105.17 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="68.79,111.78 67.77,111.58 66.92,111 66.34,110.15 66.14,109.13 66.34,108.12 66.92,107.26 67.77,106.69 68.79,106.49 68.79,106.49 69.8,106.69 70.66,107.26 71.23,108.12 71.43,109.13 71.23,110.15 70.66,111 69.8,111.58 68.79,111.78 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="88.63,111.78 87.62,111.58 86.76,111 86.19,110.15 85.98,109.13 86.19,108.12 86.76,107.26 87.62,106.69 88.63,106.49 88.63,106.49 89.64,106.69 90.5,107.26 91.07,108.12 91.28,109.13 91.07,110.15 90.5,111 89.64,111.58 88.63,111.78 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="101.86,111.78 100.85,111.58 99.99,111 99.41,110.15 99.21,109.13 99.41,108.12 99.99,107.26 100.85,106.69 101.86,106.49 101.86,106.49 102.87,106.69 103.73,107.26 104.3,108.12 104.5,109.13 104.3,110.15 103.73,111 102.87,111.58 101.86,111.78 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="121.7,111.78 120.69,111.58 119.83,111 119.26,110.15 119.06,109.13 119.26,108.12 119.83,107.26 120.69,106.69 121.7,106.49 128.31,106.49 129.33,106.69 130.19,107.26 130.76,108.12 130.96,109.13 130.76,110.15 130.19,111 129.33,111.58 128.31,111.78 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="141.54,111.78 140.53,111.58 139.67,111 139.1,110.15 138.9,109.13 139.1,108.12 139.67,107.26 140.53,106.69 141.54,106.49 148.16,106.49 149.17,106.69 150.03,107.26 150.6,108.12 150.8,109.13 150.6,110.15 150.03,111 149.17,111.58 148.16,111.78 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="75.4,118.39 74.39,118.19 73.53,117.62 72.96,116.76 72.76,115.75 72.96,114.74 73.53,113.88 74.39,113.3 75.4,113.1 82.02,113.1 83.03,113.3 83.89,113.88 84.46,114.74 84.66,115.75 84.46,116.76 83.89,117.62 83.03,118.19 82.02,118.39 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="115.09,118.39 114.07,118.19 113.22,117.62 112.64,116.76 112.44,115.75 112.64,114.74 113.22,113.88 114.07,113.3 115.09,113.1 121.7,113.1 122.71,113.3 123.57,113.88 124.15,114.74 124.35,115.75 124.15,116.76 123.57,117.62 122.71,118.19 121.7,118.39 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="134.93,118.39 133.92,118.19 133.06,117.62 132.48,116.76 132.28,115.75 132.48,114.74 133.06,113.88 133.92,113.3 134.93,113.1 134.93,113.1 135.94,113.3 136.8,113.88 137.37,114.74 137.57,115.75 137.37,116.76 136.8,117.62 135.94,118.19 134.93,118.39 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="148.16,118.39 147.15,118.19 146.29,117.62 145.71,116.76 145.51,115.75 145.71,114.74 146.29,113.88 147.15,113.3 148.16,113.1 148.16,113.1 149.17,113.3 150.03,113.88 150.6,114.74 150.8,115.75 150.6,116.76 150.03,117.62 149.17,118.19 148.16,118.39 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="68.79,125.01 67.77,124.81 66.92,124.23 66.34,123.37 66.14,122.36 66.34,121.35 66.92,120.49 67.77,119.92 68.79,119.72 88.63,119.72 89.64,119.92 90.5,120.49 91.07,121.35 91.28,122.36 91.07,123.37 90.5,124.23 89.64,124.81 88.63,125.01 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="101.86,125.01 100.85,124.81 99.99,124.23 99.41,123.37 99.21,122.36 99.41,121.35 99.99,120.49 100.85,119.92 101.86,119.72 101.86,119.72 102.87,119.92 103.73,120.49 104.3,121.35 104.5,122.36 104.3,123.37 103.73,124.23 102.87,124.81 101.86,125.01 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="121.7,125.01 120.69,124.81 119.83,124.23 119.26,123.37 119.06,122.36 119.26,121.35 119.83,120.49 120.69,119.92 121.7,119.72 134.93,119.72 135.94,119.92 136.8,120.49 137.37,121.35 137.57,122.36 137.37,123.37 136.8,124.23 135.94,124.81 134.93,125.01 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="68.79,131.62 67.77,131.42 66.92,130.85 66.34,129.99 66.14,128.98 66.34,127.96 66.92,127.11 67.77,126.53 68.79,126.33 75.4,126.33 76.41,126.53 77.27,127.11 77.85,127.96 78.05,128.98 77.85,129.99 77.27,130.85 76.41,131.42 75.4,131.62 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="88.63,131.62 87.62,131.42 86.76,130.85 86.19,129.99 85.98,128.98 86.19,127.96 86.76,127.11 87.62,126.53 88.63,126.33 115.09,126.33 116.1,126.53 116.96,127.11 117.53,127.96 117.73,128.98 117.53,129.99 116.96,130.85 116.1,131.42 115.09,131.62 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="128.31,131.62 127.3,131.42 126.44,130.85 125.87,129.99 125.67,128.98 125.87,127.96 126.44,127.11 127.3,126.53 128.31,126.33 134.93,126.33 135.94,126.53 136.8,127.11 137.37,127.96 137.57,128.98 137.37,129.99 136.8,130.85 135.94,131.42 134.93,131.62 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="68.79,138.24 67.77,138.03 66.92,137.46 66.34,136.6 66.14,135.59 66.34,134.58 66.92,133.72 67.77,133.15 68.79,132.94 75.4,132.94 76.41,133.15 77.27,133.72 77.85,134.58 78.05,135.59 77.85,136.6 77.27,137.46 76.41,138.03 75.4,138.24 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="95.24,138.24 94.23,138.03 93.37,137.46 92.8,136.6 92.6,135.59 92.8,134.58 93.37,133.72 94.23,133.15 95.24,132.94 95.24,132.94 96.26,133.15 97.11,133.72 97.69,134.58 97.89,135.59 97.69,136.6 97.11,137.46 96.26,138.03 95.24,138.24 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="108.47,138.24 107.46,138.03 106.6,137.46 106.03,136.6 105.83,135.59 106.03,134.58 106.6,133.72 107.46,133.15 108.47,132.94 115.09,132.94 116.1,133.15 116.96,133.72 117.53,134.58 117.73,135.59 117.53,136.6 116.96,137.46 116.1,138.03 115.09,138.24 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="128.31,138.24 127.3,138.03 126.44,137.46 125.87,136.6 125.67,135.59 125.87,134.58 126.44,133.72 127.3,133.15 128.31,132.94 134.93,132.94 135.94,133.15 136.8,133.72 137.37,134.58 137.57,135.59 137.37,136.6 136.8,137.46 135.94,138.03 134.93,138.24 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="68.79,144.85 67.77,144.65 66.92,144.08 66.34,143.22 66.14,142.2 66.34,141.19 66.92,140.33 67.77,139.76 68.79,139.56 68.79,139.56 69.8,139.76 70.66,140.33 71.23,141.19 71.43,142.2 71.23,143.22 70.66,144.08 69.8,144.65 68.79,144.85 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="82.02,144.85 81,144.65 80.14,144.08 79.57,143.22 79.37,142.2 79.57,141.19 80.14,140.33 81,139.76 82.02,139.56 121.7,139.56 122.71,139.76 123.57,140.33 124.15,141.19 124.35,142.2 124.15,143.22 123.57,144.08 122.71,144.65 121.7,144.85 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="134.93,144.85 133.92,144.65 133.06,144.08 132.48,143.22 132.28,142.2 132.48,141.19 133.06,140.33 133.92,139.76 134.93,139.56 141.54,139.56 142.56,139.76 143.41,140.33 143.99,141.19 144.19,142.2 143.99,143.22 143.41,144.08 142.56,144.65 141.54,144.85 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="68.79,151.46 67.77,151.26 66.92,150.69 66.34,149.83 66.14,148.82 66.34,147.81 66.92,146.95 67.77,146.37 68.79,146.17 82.02,146.17 83.03,146.37 83.89,146.95 84.46,147.81 84.66,148.82 84.46,149.83 83.89,150.69 83.03,151.26 82.02,151.46 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="95.24,151.46 94.23,151.26 93.37,150.69 92.8,149.83 92.6,148.82 92.8,147.81 93.37,146.95 94.23,146.37 95.24,146.17 95.24,146.17 96.26,146.37 97.11,146.95 97.69,147.81 97.89,148.82 97.69,149.83 97.11,150.69 96.26,151.26 95.24,151.46 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="115.09,151.46 114.07,151.26 113.22,150.69 112.64,149.83 112.44,148.82 112.64,147.81 113.22,146.95 114.07,146.37 115.09,146.17 115.09,146.17 116.1,146.37 116.96,146.95 117.53,147.81 117.73,148.82 117.53,149.83 116.96,150.69 116.1,151.26 115.09,151.46 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
          <polygon
            points="134.93,151.46 133.92,151.26 133.06,150.69 132.48,149.83 132.28,148.82 132.48,147.81 133.06,146.95 133.92,146.37 134.93,146.17 134.93,146.17 135.94,146.37 136.8,146.95 137.37,147.81 137.57,148.82 137.37,149.83 136.8,150.69 135.94,151.26 134.93,151.46 "
            style="fill:url(#gradientffcbed388ab34855992a9fd38824ed9b);"
          />
      `,
            },
        ];
    }
    init() {
        if (!this.initialized) {
            this.mouseService.getDocumentMouseMove().subscribe(() => {
                if (!this.model.draggingElement) {
                    this.startUpdate();
                }
            });
            this.mouseService.getDocumentMouseUp().subscribe(() => {
                this.startUpdate();
            });
            document.body.addEventListener("keyup", () => this.startUpdate(), true);
            this.model.formEvents.subscribe((e) => {
                if (e.name == "SetForm") {
                    this.startUpdate();
                }
            });
            document.body.addEventListener("keyup", () => this.startUpdate(), true);
        }
        this.initialized = true;
        this.startUpdate();
    }
    startUpdate() {
        let this_ = this;
        if (!this.timerSarted) {
            this.timerSarted = true;
            setTimeout(() => {
                this.timerSarted = false;
                let barcodes = [];
                this.findChangedBarcodes(this.model.form, barcodes);
                if (barcodes.length > 0) {
                    let jsonBarcodes = [];
                    barcodes.forEach((b) => {
                        let barcode = b;
                        barcode.resetChanged();
                        barcode.showProgress = true;
                        jsonBarcodes.push(barcode.saveToJsonObject({}).serialize());
                    });
                    let data = {
                        action: "GetBorcodeImages",
                        barcodes: jsonBarcodes,
                    };
                    this.httpService.post(this.model.requestUrl, data, "json", { showProgress: false }).subscribe((data) => {
                        this_.model.showProgress = false;
                        let barcodeImgs = data;
                        for (let i = 0; i < barcodes.length; i++) {
                            barcodes[i].img = barcodeImgs[i];
                            barcodes[i].showProgress = false;
                        }
                    });
                }
            }, 400);
        }
    }
    findChangedBarcodes(element, barcodes) {
        let iterable = element?.pages ? element.pages : element?.elements ? element.elements : [];
        iterable.forEach((p) => this.findChangedBarcodes(p, barcodes));
        let barcode = element instanceof StiBarcodeElement ? element : null;
        if (barcode?.isChanged()) {
            barcodes.push(barcode);
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBarcodeService, deps: [{ token: StiModelService }, { token: StiMouseService }, { token: StiHttpClientService }, { token: StiUndoService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBarcodeService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBarcodeService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiMouseService }, { type: StiHttpClientService }, { type: StiUndoService }] });

class StiComponentResizerService {
    constructor(model, mouseService, render, barcodeService) {
        this.model = model;
        this.mouseService = mouseService;
        this.render = render;
        this.barcodeService = barcodeService;
        this.isResizing = false;
        this.startFromRight = false;
        this.startFromLeft = false;
        this.startFromBottom = false;
        this.startFromBottomLeft = false;
        this.startFromBottomRight = false;
        this.maxWidth = 0;
        this.minWidth = 0;
        this.columnWidth = 64.326;
        this.StartResizeSubj = new Subject();
        this.EndResizeSubj = new Subject();
        mouseService.getDocumentMouseUp().subscribe((event) => {
            document.body.style.cursor = "";
            if (this.isResizing) {
                this.EndResizeSubj.next({ event: "End Resize" });
            }
            this.currentPage = null;
            this.currentPanel = null;
            this.isResizing = false;
            this.model.canDrag = true;
            this.startFromRight = false;
            this.startFromLeft = false;
            this.startFromBottom = false;
            this.startFromBottomLeft = false;
            this.startFromBottomRight = false;
            this.model.cursor = "default";
        });
        mouseService.getDocumentMouseMove().subscribe((event) => {
            this.resizeFromBottomRight(event);
            this.resizeFromBottomLeft(event);
            this.resizeFromLeft(event);
            this.resizeFromRight(event);
            this.resizeFromBottom(event);
        });
        model.formEvents.subscribe((e) => {
            if (e.name == "UpdateAllSizes") {
                this.elementsToUpdate = [];
                this.model.elementToUpdate = null;
                this.model.form.pages.forEach((p) => p.allElements.forEach((e) => this.elementsToUpdate.push(e)));
                this.updateElements();
            }
        });
    }
    updateElements() {
        if (this.elementsToUpdate.length > 0) {
            if (this.model.elementToUpdate == null) {
                this.model.elementToUpdate = this.elementsToUpdate.splice(0, 1)[0];
            }
            setTimeout(() => {
                this.updateElements();
            }, 0);
        }
        else {
        }
    }
    initResize(element, e, startPosition) {
        e.stopPropagation();
        document.body.style.cursor = "nwse-resize";
        this.freeAreaHeight = 0;
        this.startMouseX = e.clientX;
        this.startMouseY = e.clientY;
        this.startElementX = element.x;
        this.startHeight = element.height;
        this.model.lastFormState = this.model.form.saveToJsonObject().serialize();
        this.gridVerticalStep = this.model.form.settings.gridVerticalStep;
        element.width = this.startWidth = element.width;
        if (element instanceof StiSignatureElement || element instanceof StiImageElement) {
            this.startCanvasHeight = element.canvasHeight;
        }
        if (element instanceof StiBarcodeElement) {
            this.startCanvasHeight = element.Height;
        }
        this.element = element;
        this.maxWidth = 0;
        this.StartResizeSubj.next({ event: "Start Resize" });
        this.currentPage = this.model.getElementPage(element);
        this.currentPanel = this.model.getElementPanel(element);
        this.currentPage
            ? (this.maxWidth = this.currentPage?.contentAreaWidth)
            : (this.maxWidth = this.currentPanel.contentAreaWidth);
        this.minWidth = element.geometry.minWidth;
        let otherElements = Array.from(this.currentPage?.elements ?? this.currentPanel?.elements);
        otherElements.splice(otherElements.indexOf(this.element), 1);
        this.freeAreaHeight = this.render.getFreeToBottomResizeArea(this.element, otherElements);
        this.currentPage
            ? (this.columnWidth = Number((this.currentPage?.contentAreaWidth / this.model.form.settings.gridColumns).toFixed(2)))
            : (this.columnWidth = Number((this.currentPanel?.contentAreaWidth / this.model.form.settings.gridColumns).toFixed(2)));
        if (startPosition == "fromRight") {
            this.startFromRight = true;
            this.model.cursor = "ew-resize";
            element.width = Math.round((element.x + element.width) / this.columnWidth) * this.columnWidth - element.x;
            this.startWidth = element.width;
        }
        else if (startPosition == "fromLeft") {
            this.startFromLeft = true;
            this.model.cursor = "ew-resize";
            let startX = element.x;
            element.x = Math.round(element.x / this.columnWidth) * this.columnWidth;
            this.startElementX = element.x;
            element.width = startX > element.x ? element.width + (startX - element.x) : element.width - (element.x - startX);
            this.startWidth = element.width;
        }
        else if (startPosition == "fromBottom") {
            this.startFromBottom = true;
            this.model.cursor = "ns-resize";
            element.height =
                Math.round((element.height + element.y) / this.model.form.settings.gridVerticalStep) *
                    this.model.form.settings.gridVerticalStep -
                    element.y;
            this.startHeight = element.height;
        }
        else if (startPosition == "fromBottomLeft") {
            this.startFromBottomLeft = true;
            this.model.cursor = "nesw-resize";
            let startX = element.x;
            element.x = Math.round(element.x / this.columnWidth) * this.columnWidth;
            this.startElementX = element.x;
            element.width = startX > element.x ? element.width + (startX - element.x) : element.width - (element.x - startX);
            this.startWidth = element.width;
            element.height =
                Math.round((element.height + element.y) / this.model.form.settings.gridVerticalStep) *
                    this.model.form.settings.gridVerticalStep -
                    element.y;
            this.startHeight = element.height;
        }
        else if (startPosition == "fromBottomRight") {
            this.startFromBottomRight = true;
            this.model.cursor = "nwse-resize";
            element.width = Math.round((element.x + element.width) / this.columnWidth) * this.columnWidth - element.x;
            this.startWidth = element.width;
            element.height =
                Math.round((element.height + element.y) / this.model.form.settings.gridVerticalStep) *
                    this.model.form.settings.gridVerticalStep -
                    element.y;
            this.startHeight = element.height;
        }
        this.isResizing = true;
    }
    resizeFromBottomRight(event) {
        if (this.isResizing && this.startFromBottomRight) {
            let delta = this.startMouseX - event.clientX;
            let deltaTop = this.startMouseY - event.clientY;
            if (Math.abs(delta) >= (this.columnWidth * this.model.zoom) / 2) {
                let step = Math.round(Math.abs(delta) / (this.columnWidth * this.model.zoom));
                if (delta < 0) {
                    this.element.width = this.startWidth + this.columnWidth * step;
                }
                else {
                    this.element.width = this.startWidth - this.columnWidth * step;
                }
            }
            else {
                this.element.width = this.startWidth;
            }
            if (this.element.width + this.element.x > this.maxWidth) {
                this.element.width = this.maxWidth - this.element.x;
            }
            else if (this.element.width <= this.minWidth) {
                this.element.width = this.minWidth;
            }
            let step = Math.round(Math.abs(deltaTop) / (this.gridVerticalStep * this.model.zoom));
            if (deltaTop < 0) {
                this.element.height = this.startHeight + this.gridVerticalStep * step;
            }
            else {
                this.element.height = this.startHeight - this.gridVerticalStep * step;
            }
            if (this.element instanceof StiSignatureElement || this.element instanceof StiImageElement) {
                if (deltaTop < 0) {
                    this.element.canvasHeight = this.startCanvasHeight + this.gridVerticalStep * step;
                }
                else {
                    this.element.canvasHeight = this.startCanvasHeight - this.gridVerticalStep * step;
                }
                if (this.element.canvasHeight <= 34) {
                    this.element.canvasHeight = 34;
                }
            }
            if (this.element instanceof StiBarcodeElement) {
                if (deltaTop < 0) {
                    this.element.Height = this.startCanvasHeight + this.gridVerticalStep * step;
                }
                else {
                    this.element.Height = this.startCanvasHeight - this.gridVerticalStep * step;
                }
                if (this.element.Height <= 55) {
                    this.element.Height = 55;
                }
                this.element.Width =
                    this.element.width -
                        (this.element.label.alignment != StiLabelAlignment.Top ? this.element.label.width : 0) -
                        this.element.padding.right -
                        this.element.padding.left;
            }
            if (this.element.height <= this.element.geometry.minHeight) {
                this.element.height = this.element.geometry.minHeight;
            }
            if (this.element.height >= this.startHeight + this.freeAreaHeight) {
                this.element.height = this.startHeight + this.freeAreaHeight;
            }
            //
            let otherElements = Array.from(this.currentPage?.elements ?? this.currentPanel?.elements);
            otherElements.splice(otherElements.indexOf(this.element), 1);
            this.render.changeElementGeometry(this.element, otherElements);
        }
    }
    resizeFromBottomLeft(event) {
        if (this.isResizing && this.startFromBottomLeft) {
            let delta = this.startMouseX - event.clientX;
            let deltaTop = this.startMouseY - event.clientY;
            if (Math.abs(delta) >= (this.columnWidth * this.model.zoom) / 2) {
                let step = Math.round(Math.abs(delta) / (this.columnWidth * this.model.zoom));
                if (delta < 0) {
                    this.element.x = this.startElementX + this.columnWidth * step;
                    this.element.width = this.startWidth - this.columnWidth * step;
                }
                else {
                    this.element.x = this.startElementX - this.columnWidth * step;
                    this.element.width = this.startWidth + this.columnWidth * step;
                }
            }
            else {
                this.element.x = this.startElementX;
                this.element.width = this.startWidth;
            }
            if (this.element.x < 0) {
                this.element.x = 0;
                this.element.width = this.startWidth + this.startElementX;
            }
            else if (this.element.x + this.element.geometry.minWidth > this.startElementX + this.startWidth) {
                this.element.x = this.startWidth - this.element.geometry.minWidth + this.startElementX;
                this.element.width = this.element.geometry.minWidth;
            }
            let step = Math.round(Math.abs(deltaTop) / (this.gridVerticalStep * this.model.zoom));
            if (deltaTop < 0) {
                this.element.height = this.startHeight + this.gridVerticalStep * step;
            }
            else {
                this.element.height = this.startHeight - this.gridVerticalStep * step;
            }
            if (this.element instanceof StiSignatureElement || this.element instanceof StiImageElement) {
                if (deltaTop < 0) {
                    this.element.canvasHeight = this.startCanvasHeight + this.gridVerticalStep * step;
                }
                else {
                    this.element.canvasHeight = this.startCanvasHeight - this.gridVerticalStep * step;
                }
                if (this.element.canvasHeight <= 34) {
                    this.element.canvasHeight = 34;
                }
            }
            if (this.element instanceof StiBarcodeElement) {
                if (deltaTop < 0) {
                    this.element.Height = this.startCanvasHeight + this.gridVerticalStep * step;
                }
                else {
                    this.element.Height = this.startCanvasHeight - this.gridVerticalStep * step;
                }
                if (this.element.Height <= 55) {
                    this.element.Height = 55;
                }
                this.element.Width =
                    this.element.width -
                        (this.element.label.alignment != StiLabelAlignment.Top ? this.element.label.width : 0) -
                        this.element.padding.right -
                        this.element.padding.left;
            }
            if (this.element.height <= this.element.geometry.minHeight) {
                this.element.height = this.element.geometry.minHeight;
            }
            if (this.element.height >= this.startHeight + this.freeAreaHeight) {
                this.element.height = this.startHeight + this.freeAreaHeight;
            }
            //
            let otherElements = Array.from(this.currentPage?.elements ?? this.currentPanel?.elements);
            otherElements.splice(otherElements.indexOf(this.element), 1);
            this.render.changeElementGeometry(this.element, otherElements);
        }
    }
    resizeFromRight(event) {
        if (this.isResizing && this.startFromRight) {
            let delta = this.startMouseX - event.clientX;
            if (Math.abs(delta) >= (this.columnWidth * this.model.zoom) / 2) {
                let step = Math.round(Math.abs(delta) / (this.columnWidth * this.model.zoom));
                if (delta < 0) {
                    this.element.width = this.startWidth + this.columnWidth * step;
                }
                else {
                    this.element.width = this.startWidth - this.columnWidth * step;
                }
            }
            else {
                this.element.width = this.startWidth;
            }
            if (this.element.width + this.element.x > this.maxWidth) {
                this.element.width = this.maxWidth - this.element.x;
            }
            else if (this.element.width <= this.minWidth) {
                this.element.width = this.minWidth;
            }
            //
            let otherElements = Array.from(this.currentPage?.elements ?? this.currentPanel?.elements);
            otherElements.splice(otherElements.indexOf(this.element), 1);
            this.render.changeElementGeometry(this.element, otherElements);
        }
    }
    resizeFromLeft(event) {
        if (this.isResizing && this.startFromLeft) {
            let delta = this.startMouseX - event.clientX;
            if (Math.abs(delta) >= (this.columnWidth * this.model.zoom) / 2) {
                let step = Math.round(Math.abs(delta) / (this.columnWidth * this.model.zoom));
                if (delta < 0) {
                    this.element.x = this.startElementX + this.columnWidth * step;
                    this.element.width = this.startWidth - this.columnWidth * step;
                }
                else {
                    this.element.x = this.startElementX - this.columnWidth * step;
                    this.element.width = this.startWidth + this.columnWidth * step;
                }
            }
            else {
                this.element.x = this.startElementX;
                this.element.width = this.startWidth;
            }
            if (this.element.x < 0) {
                this.element.x = 0;
                this.element.width = this.startWidth + this.startElementX;
            }
            else if (this.element.x + this.element.geometry.minWidth > this.startElementX + this.startWidth) {
                this.element.x = this.startWidth - this.element.geometry.minWidth + this.startElementX;
                this.element.width = this.element.geometry.minWidth;
            }
            //
            let otherElements = Array.from(this.currentPage?.elements ?? this.currentPanel?.elements);
            otherElements.splice(otherElements.indexOf(this.element), 1);
            this.render.changeElementGeometry(this.element, otherElements);
        }
    }
    resizeFromBottom(event) {
        if (this.isResizing && this.startFromBottom) {
            let deltaTop = this.startMouseY - event.clientY;
            let step = Math.round(Math.abs(deltaTop) / (this.gridVerticalStep * this.model.zoom));
            if (deltaTop < 0) {
                this.element.height = this.startHeight + this.gridVerticalStep * step;
            }
            else {
                this.element.height = this.startHeight - this.gridVerticalStep * step;
            }
            if (this.element instanceof StiSignatureElement || this.element instanceof StiImageElement) {
                if (deltaTop < 0) {
                    this.element.canvasHeight = this.startCanvasHeight + this.gridVerticalStep * step;
                }
                else {
                    this.element.canvasHeight = this.startCanvasHeight - this.gridVerticalStep * step;
                }
                if (this.element.canvasHeight <= 34) {
                    this.element.canvasHeight = 34;
                }
            }
            if (this.element instanceof StiBarcodeElement) {
                if (deltaTop < 0) {
                    this.element.Height = this.startCanvasHeight + this.gridVerticalStep * step;
                }
                else {
                    this.element.Height = this.startCanvasHeight - this.gridVerticalStep * step;
                }
                if (this.element.Height <= 55) {
                    this.element.Height = 55;
                }
                this.element.Width = this.element.width - this.element.padding.right - this.element.padding.left;
            }
            if (this.element.height <= this.element.geometry.minHeight) {
                this.element.height = this.element.geometry.minHeight;
            }
            if (this.element.height >= this.startHeight + this.freeAreaHeight) {
                this.element.height = this.startHeight + this.freeAreaHeight;
            }
            //
            let otherElements = Array.from(this.currentPage?.elements ?? this.currentPanel?.elements);
            otherElements.splice(otherElements.indexOf(this.element), 1);
            this.render.changeElementGeometry(this.element, otherElements);
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiComponentResizerService, deps: [{ token: StiModelService }, { token: StiMouseService }, { token: StiRectangleGeometryLayout }, { token: StiBarcodeService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiComponentResizerService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiComponentResizerService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiMouseService }, { type: StiRectangleGeometryLayout }, { type: StiBarcodeService }] });

class StiDragPreviewElement extends StiFormElement {
    constructor() {
        super();
        this.type = "Drag_Preview";
        this.hasGeometry = true;
    }
}

class StiDraggableService {
    static { this.MOUSE_DELTA = 5; }
    constructor(mouseService, model, nameService, helper, render) {
        this.mouseService = mouseService;
        this.model = model;
        this.nameService = nameService;
        this.helper = helper;
        this.render = render;
        this.newElement = true;
        this.dragPreview = new StiDragPreviewElement();
        mouseService.getDocumentMouseMove().subscribe((event) => {
            this.drag(event);
        });
        mouseService.getDocumentMouseUp().subscribe((event) => {
            this.endDrag(event);
        });
    }
    drag(event) {
        if (this.model.draggingElement) {
            let bottomPage = this.model.getPageFromPoint(event.clientX, event.clientY);
            if (this.model.lastUsedPage != bottomPage && bottomPage != null && bottomPage != undefined) {
                this.model.lastUsedPage = bottomPage;
            }
            this.model.cursor = bottomPage ? "move" : "not-allowed";
            this.left = event.clientX - this.startX;
            this.top = event.clientY - this.startY;
            if (this.newElement) {
                if (bottomPage) {
                    if (this.model.draggingElement instanceof StiTableElement ||
                        this.model.draggingElement instanceof StiLineElement ||
                        this.model.draggingElement instanceof StiPanelElement) {
                        this.model.draggingElement.width = this.model.lastUsedPage.contentAreaWidth;
                    }
                    else if (this.model.draggingElement instanceof StiButtonElement) {
                        this.model.draggingElement.width =
                            this.model.lastUsedPage.contentAreaWidth / this.model.form.settings.gridColumns > 1
                                ? Math.round(this.model.form.settings.gridColumns * 0.2)
                                : 1;
                    }
                    else {
                        this.model.draggingElement.width =
                            this.model.lastUsedPage.contentAreaWidth / this.model.form.settings.gridColumns > 1
                                ? Math.round(this.model.form.settings.gridColumns * 0.4)
                                : 1;
                    }
                }
                else {
                    //this.model.draggingElement.width = 0; ???
                }
            }
            this.moveDragPreview(event);
        }
    }
    endDrag(event) {
        if (this.model.draggingElement) {
            let page = this.model.getElementPage(this.dragPreview);
            let panel = this.model.getElementPanel(this.dragPreview);
            let elements = page ? page?.elements : panel?.elements;
            this.model.draggingElement.x = this.dragPreview.x;
            this.model.draggingElement.y = this.dragPreview.y;
            this.model.draggingElement.width = this.dragPreview.width;
            if (elements) {
                if (this.model.draggingElement instanceof StiLabelElement) {
                    elements.splice(elements.indexOf(this.dragPreview), 1);
                    elements.splice(0, 0, this.model.draggingElement);
                }
                else {
                    elements.splice(elements.indexOf(this.dragPreview), 1, this.model.draggingElement);
                }
                if (this.newElement) {
                    this.model.draggingElement.guid = Guid.newGuid().toString();
                    this.model.draggingElement.name = this.nameService.getElementName(this.model.draggingElement);
                    this.model.draggingElement.hasGeometry = true;
                }
                this.model.draggingElement.position = "absolute";
                this.model.draggingElement.needToSelectComponent = true;
                this.model.draggingElement.isAdded = true;
                if (this.model.draggingElement instanceof StiTableElement) {
                    this.model.currentTablePropertyHeader.next("Table");
                }
            }
            else {
                if (!this.model.overToolbar(event.clientX, event.clientY) && !this.newElement) {
                    this.model.lastUsedPage.elements.push(this.currentUsableElement);
                    this.render.insertElement(this.currentUsableElement);
                }
                else {
                    this.render.removeElement(this.model.draggingElement, this.model.lastUsedPage.elements);
                    this.model.selectedComponent = null;
                }
            }
            this.render.checkOutputs(this.model.getElementPage(this.model.draggingElement));
            this.model.cursor = "default";
            this.model.draggingElement = null;
            this.model.pageWithGrid = null;
            this.newElement = false;
        }
    }
    addingByDoubleClick(element) {
        element.hasGeometry = false;
        element.position = "absolute";
        element.guid = Guid.newGuid().toString();
        let columnWidth = this.model.lastUsedPage.getColumnWidth(this.model.form.settings.gridColumns);
        if (element instanceof StiTableElement || element instanceof StiLineElement || element instanceof StiPanelElement) {
            element.width = this.model.lastUsedPage.contentAreaWidth;
        }
        else if (element instanceof StiButtonElement) {
            element.width = Number((columnWidth *
                (this.model.form.settings.gridColumns > 1 ? Math.round(this.model.form.settings.gridColumns * 0.2) : 1)).toFixed(2));
        }
        else {
            element.width = Number((columnWidth *
                (this.model.form.settings.gridColumns > 1 ? Math.round(this.model.form.settings.gridColumns * 0.4) : 1)).toFixed(2));
        }
        element.name = this.nameService.getElementName(element);
        element.needToSelectComponent = true;
        element.isAdded = true;
        let lastPage = this.model.form.pages[this.model.form.pages.length - 1];
        element.x = 0;
        element.y = lastPage.contentAreaHeight - element.height;
        if (element instanceof StiLabelElement) {
            lastPage.elements.splice(0, 0, element);
        }
        else if (element instanceof StiSignatureElement) {
            lastPage.elements.splice(lastPage.elements.length, 0, element);
        }
        else {
            lastPage.elements.splice(lastPage.elements.length - 1, 0, element);
        }
        this.render.insertElement(element);
        this.model.lastUsedPage = lastPage;
        this.newElement = false;
        if (element instanceof StiTableElement) {
            this.model.currentTablePropertyHeader.next("Table");
        }
        this.render.checkOutputs(this.model.getElementPage(element));
    }
    startDrag(event, element, newElement = true, isClone, layerX, layerY, page) {
        this.showDragPreview(element);
        this.currentUsableElement = this.helper.clone(element);
        element.isAdded = false;
        element.position = "relative";
        element.geometry.x = 0;
        element.geometry.y = 0;
        this.model.draggingElement = element;
        this.newElement = newElement;
        if (newElement) {
            let formRect = this.model?.rootFormElement?.getBoundingClientRect();
            this.startX = (formRect ? formRect.x + 15 : 15) * this.model.zoom;
            this.startY = (formRect ? formRect.y + 5 : 5) * this.model.zoom;
            let cf = 0.4;
            if (element instanceof StiTableElement ||
                element instanceof StiLineElement ||
                element instanceof StiPanelElement) {
                cf = 1;
            }
            if (element instanceof StiButtonElement) {
                cf = 0.2;
            }
            if (element instanceof StiAddressElement) {
                cf = 0.6;
            }
            this.draggingElementWidthInColumns = Math.max(Math.round(this.model.form.settings.gridColumns * cf), 1);
            this.model.draggingElement.width =
                this.model.lastUsedPage.getColumnWidth(this.model.form.settings.gridColumns) *
                    this.draggingElementWidthInColumns;
        }
        else {
            this.draggingElementWidth = element.width;
            if (!isClone) {
                this.startX = layerX;
                this.startY = layerY;
            }
            else {
                this.startX = this.model.draggingElement.width / 2;
                this.startY = this.model.draggingElement.height / 2;
            }
        }
        this.drag(event);
    }
    showDragPreview(element) {
        let page = this.model.getElementPage(element);
        page?.elements.splice(page.elements.indexOf(element), 1);
        let panel = this.model.getElementPanel(element);
        panel?.elements.splice(panel.elements.indexOf(element), 1);
        this.dragPreview.geometry = element.geometry.clone();
        setTimeout(() => {
            this.dragPreview.height = element.height;
        });
        panel ? panel.elements?.push(this.dragPreview) : (page ?? this.model.lastUsedPage).elements?.push(this.dragPreview);
    }
    moveDragPreview(event) {
        let excludeId = this.model.draggingElement instanceof StiPanelElement ? this.model.draggingElement.guid : null;
        let mouseOnPanel = this.model.getPanelFromPoint(event.clientX, event.clientY, excludeId);
        let mouseOnPage = mouseOnPanel
            ? null
            : this.model.getPageFromPoint(event.clientX, event.clientY);
        this.model.pageWithGrid = mouseOnPage;
        let dragPreviewPage = this.model.getElementPage(this.dragPreview);
        let dragPreviewPanel = this.model.getElementPanel(this.dragPreview);
        let dragPreviewContainer = dragPreviewPage ?? dragPreviewPanel;
        if (!mouseOnPage && !mouseOnPanel && (dragPreviewPage || dragPreviewPanel)) {
            dragPreviewContainer.elements.splice(dragPreviewContainer.elements.indexOf(this.dragPreview), 1);
            this.render.removeElement(this.dragPreview, dragPreviewContainer.elements);
        }
        else if ((mouseOnPage || mouseOnPanel) && !dragPreviewPage && !dragPreviewPanel) {
            (mouseOnPage ?? mouseOnPanel).elements.push(this.dragPreview);
        }
        else if ((mouseOnPanel && dragPreviewPage) ||
            (mouseOnPage && dragPreviewPanel) ||
            (mouseOnPage && dragPreviewPage && mouseOnPage != dragPreviewPage) ||
            (mouseOnPanel && dragPreviewPanel && mouseOnPanel != dragPreviewPanel)) {
            dragPreviewContainer.elements.splice(dragPreviewContainer.elements.indexOf(this.dragPreview), 1);
            this.render.removeElement(this.dragPreview, dragPreviewContainer.elements);
            (mouseOnPage ?? mouseOnPanel).elements.push(this.dragPreview);
        }
        this.dragPreview.geometry.minWidth = this.model.draggingElement.geometry.minWidth;
        let container = mouseOnPage ?? mouseOnPanel;
        if (container) {
            let columnWidth = container?.getColumnWidth(this.model.form.settings.gridColumns) ?? 1;
            var mousePos = mouseOnPage
                ? this.model.getMouseOverPagePosition(event)
                : this.model.getMouseOverPanelPosition(event, excludeId);
            if (mousePos != null) {
                let cols = this.draggingElementWidthInColumns;
                if (this.newElement && mouseOnPanel && this.model.draggingElement instanceof StiPanelElement) {
                    cols = Math.max(1, Math.ceil(cols * 0.3));
                }
                else if (!this.newElement) {
                    cols = Math.min(Math.round(this.draggingElementWidth / columnWidth), this.model.form.settings.gridColumns);
                }
                let otherElements = Array.from(container.elements);
                otherElements.splice(otherElements.indexOf(this.dragPreview), 1);
                this.render.removeElement(this.dragPreview, otherElements);
                this.model.draggingElement.width = columnWidth * cols;
                this.dragPreview.width = this.model.draggingElement.width;
                if (mousePos.x - this.startX <= columnWidth * this.model.zoom) {
                    this.dragPreview.x = 0;
                }
                else if (mousePos.x - this.startX >=
                    (container.contentAreaWidth - this.dragPreview.geometry.minWidth) * this.model.zoom) {
                    this.dragPreview.x = container.contentAreaWidth - this.dragPreview.geometry.minWidth;
                }
                else if (Math.abs(mousePos.x - this.startX) >= columnWidth * this.model.zoom) {
                    let step = Math.floor(Math.abs(mousePos.x - this.startX) / (columnWidth * this.model.zoom));
                    this.dragPreview.x = step * columnWidth;
                }
                if ((mousePos.y - this.startY) / this.model.zoom <= 0) {
                    this.dragPreview.y = 0;
                }
                else {
                    this.dragPreview.y = (mousePos.y - this.startY) / this.model.zoom;
                }
                this.render.insertElement(this.dragPreview, container.contentAreaWidth);
            }
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDraggableService, deps: [{ token: StiMouseService }, { token: StiModelService }, { token: StiNameService }, { token: StiHelperService }, { token: StiRectangleGeometryLayout }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDraggableService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDraggableService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiMouseService }, { type: StiModelService }, { type: StiNameService }, { type: StiHelperService }, { type: StiRectangleGeometryLayout }] });

class StiToolbarResizerService {
    constructor() {
        this.isMaximizeMode = false;
        this.isMinimizeMode = true;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiToolbarResizerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiToolbarResizerService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiToolbarResizerService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [] });

class StiComponentResizerComponent {
    constructor(model, componentResizerService) {
        this.model = model;
        this.componentResizerService = componentResizerService;
        this.size = 5;
        this.leftOffset = 2;
        this.rightOffset = 3;
    }
    get visible() {
        return (this.model.selectedComponent == this.component &&
            !this.model.previewMode &&
            this.component.element.position == "absolute");
    }
    get width() {
        return this.component.element.width;
    }
    get height() {
        return this.component.element.height;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiComponentResizerComponent, deps: [{ token: StiModelService }, { token: StiComponentResizerService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiComponentResizerComponent, selector: "sti-component-resizer", inputs: { left: "left", top: "top", size: "size", component: "component" }, ngImport: i0, template: `
    <div
      class="bottom-right resizer"
      style="position: absolute;cursor: nwse-resize;background: rgb(105, 105, 105);transition: opacity 0.2s ease; z-index: 100"
      draggable="false"
      [style.opacity]="visible ? 1 : 0"
      [style.left.px]="left - rightOffset"
      [style.top.px]="top - rightOffset"
      [style.width.px]="size"
      [style.height.px]="size"
      (mousedown)="componentResizerService.initResize(component.element, $event, 'fromBottomRight')"
      (dragstart)="$event.preventDefault()"
      [@visibility]="visible ? 'visible' : 'hidden'"
    ></div>
    <div
      class="right resizer"
      style="position: absolute;cursor: ew-resize;background: rgb(105, 105, 105);transition: opacity 0.2s ease; z-index: 100"
      draggable="false"
      [style.opacity]="visible ? 1 : 0"
      [style.left.px]="left - rightOffset"
      [style.top.px]="top - height / 2 - rightOffset"
      [style.width.px]="size"
      [style.height.px]="size"
      (mousedown)="componentResizerService.initResize(component.element, $event, 'fromRight')"
      (dragstart)="$event.preventDefault()"
      [@visibility]="visible ? 'visible' : 'hidden'"
    ></div>
    <div
      class="bottom resizer"
      style="position: absolute;cursor: ns-resize;background: rgb(105, 105, 105);transition: opacity 0.2s ease; z-index: 100"
      draggable="false"
      [style.opacity]="visible ? 1 : 0"
      [style.left.px]="left - width / 2 - rightOffset"
      [style.top.px]="top - rightOffset"
      [style.width.px]="size"
      [style.height.px]="size"
      (mousedown)="componentResizerService.initResize(component.element, $event, 'fromBottom')"
      (dragstart)="$event.preventDefault()"
      [@visibility]="visible ? 'visible' : 'hidden'"
    ></div>
    <div
      class="bottom-left resizer"
      style="position: absolute;cursor: nesw-resize;background: rgb(105, 105, 105);transition: opacity 0.2s ease; z-index: 100"
      draggable="false"
      [style.opacity]="visible ? 1 : 0"
      [style.left.px]="left - width - leftOffset"
      [style.top.px]="top - rightOffset"
      [style.width.px]="size"
      [style.height.px]="size"
      (mousedown)="componentResizerService.initResize(component.element, $event, 'fromBottomLeft')"
      (dragstart)="$event.preventDefault()"
      [@visibility]="visible ? 'visible' : 'hidden'"
    ></div>
    <div
      class="left resizer"
      style="position: absolute;cursor: ew-resize;background: rgb(105, 105, 105);transition: opacity 0.2s ease; z-index: 100"
      draggable="false"
      [style.opacity]="visible ? 1 : 0"
      [style.left.px]="left - width - leftOffset"
      [style.top.px]="top - height / 2 - rightOffset"
      [style.width.px]="size"
      [style.height.px]="size"
      (mousedown)="componentResizerService.initResize(component.element, $event, 'fromLeft')"
      (dragstart)="$event.preventDefault()"
      [@visibility]="visible ? 'visible' : 'hidden'"
    ></div>
  `, isInline: true, animations: [
            trigger("visibility", [
                // ...
                state("visible", style({
                    visibility: "",
                })),
                state("hidden", style({
                    visibility: "hidden",
                })),
                transition("visible => hidden", [animate("0s 0.2s")]),
                transition("hidden => visible", [animate("0s")]),
            ]),
        ] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiComponentResizerComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-component-resizer",
                    template: `
    <div
      class="bottom-right resizer"
      style="position: absolute;cursor: nwse-resize;background: rgb(105, 105, 105);transition: opacity 0.2s ease; z-index: 100"
      draggable="false"
      [style.opacity]="visible ? 1 : 0"
      [style.left.px]="left - rightOffset"
      [style.top.px]="top - rightOffset"
      [style.width.px]="size"
      [style.height.px]="size"
      (mousedown)="componentResizerService.initResize(component.element, $event, 'fromBottomRight')"
      (dragstart)="$event.preventDefault()"
      [@visibility]="visible ? 'visible' : 'hidden'"
    ></div>
    <div
      class="right resizer"
      style="position: absolute;cursor: ew-resize;background: rgb(105, 105, 105);transition: opacity 0.2s ease; z-index: 100"
      draggable="false"
      [style.opacity]="visible ? 1 : 0"
      [style.left.px]="left - rightOffset"
      [style.top.px]="top - height / 2 - rightOffset"
      [style.width.px]="size"
      [style.height.px]="size"
      (mousedown)="componentResizerService.initResize(component.element, $event, 'fromRight')"
      (dragstart)="$event.preventDefault()"
      [@visibility]="visible ? 'visible' : 'hidden'"
    ></div>
    <div
      class="bottom resizer"
      style="position: absolute;cursor: ns-resize;background: rgb(105, 105, 105);transition: opacity 0.2s ease; z-index: 100"
      draggable="false"
      [style.opacity]="visible ? 1 : 0"
      [style.left.px]="left - width / 2 - rightOffset"
      [style.top.px]="top - rightOffset"
      [style.width.px]="size"
      [style.height.px]="size"
      (mousedown)="componentResizerService.initResize(component.element, $event, 'fromBottom')"
      (dragstart)="$event.preventDefault()"
      [@visibility]="visible ? 'visible' : 'hidden'"
    ></div>
    <div
      class="bottom-left resizer"
      style="position: absolute;cursor: nesw-resize;background: rgb(105, 105, 105);transition: opacity 0.2s ease; z-index: 100"
      draggable="false"
      [style.opacity]="visible ? 1 : 0"
      [style.left.px]="left - width - leftOffset"
      [style.top.px]="top - rightOffset"
      [style.width.px]="size"
      [style.height.px]="size"
      (mousedown)="componentResizerService.initResize(component.element, $event, 'fromBottomLeft')"
      (dragstart)="$event.preventDefault()"
      [@visibility]="visible ? 'visible' : 'hidden'"
    ></div>
    <div
      class="left resizer"
      style="position: absolute;cursor: ew-resize;background: rgb(105, 105, 105);transition: opacity 0.2s ease; z-index: 100"
      draggable="false"
      [style.opacity]="visible ? 1 : 0"
      [style.left.px]="left - width - leftOffset"
      [style.top.px]="top - height / 2 - rightOffset"
      [style.width.px]="size"
      [style.height.px]="size"
      (mousedown)="componentResizerService.initResize(component.element, $event, 'fromLeft')"
      (dragstart)="$event.preventDefault()"
      [@visibility]="visible ? 'visible' : 'hidden'"
    ></div>
  `,
                    animations: [
                        trigger("visibility", [
                            // ...
                            state("visible", style({
                                visibility: "",
                            })),
                            state("hidden", style({
                                visibility: "hidden",
                            })),
                            transition("visible => hidden", [animate("0s 0.2s")]),
                            transition("hidden => visible", [animate("0s")]),
                        ]),
                    ],
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiComponentResizerService }], propDecorators: { left: [{
                type: Input
            }], top: [{
                type: Input
            }], size: [{
                type: Input
            }], component: [{
                type: Input
            }] } });

class StiCornerRadiusComponent {
    constructor(model) {
        this.model = model;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiCornerRadiusComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiCornerRadiusComponent, selector: "sti-corner-radius-component", ngImport: i0, template: `
    <div class="corner-container">
      <div class="corner top-left"></div>
      <div class="corner top-right"></div>
      <div class="corner bottom-left"></div>
      <div class="corner bottom-right"></div>
    </div>
  `, isInline: true, styles: [".corner-container{height:100%;width:100%;position:absolute}.corner{position:absolute;height:5px;width:5px;border:1px solid transparent}.top-left{border-top-color:#696969;border-left-color:#696969;top:0;left:0}.top-right{border-top-color:#696969;border-right-color:#696969;top:0;right:0}.bottom-left{border-bottom-color:#696969;border-left-color:#696969;bottom:0;left:0}.bottom-right{border-bottom-color:#696969;border-right-color:#696969;bottom:0;right:0}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiCornerRadiusComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-corner-radius-component", template: `
    <div class="corner-container">
      <div class="corner top-left"></div>
      <div class="corner top-right"></div>
      <div class="corner bottom-left"></div>
      <div class="corner bottom-right"></div>
    </div>
  `, styles: [".corner-container{height:100%;width:100%;position:absolute}.corner{position:absolute;height:5px;width:5px;border:1px solid transparent}.top-left{border-top-color:#696969;border-left-color:#696969;top:0;left:0}.top-right{border-top-color:#696969;border-right-color:#696969;top:0;right:0}.bottom-left{border-bottom-color:#696969;border-left-color:#696969;bottom:0;left:0}.bottom-right{border-bottom-color:#696969;border-right-color:#696969;bottom:0;right:0}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }] });

class StiComponent {
    constructor(model, draggableService, mouseService, helper, nameService, resizer, signatureService) {
        this.model = model;
        this.draggableService = draggableService;
        this.mouseService = mouseService;
        this.helper = helper;
        this.nameService = nameService;
        this.resizer = resizer;
        this.signatureService = signatureService;
        this.isClone = false;
        this.subject = new Subject();
        this.hover = false;
        this.canDrag = false;
    }
    ngOnDestroy() {
        this.mouseUpSubscription?.unsubscribe();
        this.mouseMoveSubscription?.unsubscribe();
        this.needToSelectedSubscription?.unsubscribe();
    }
    get borderInnerWidth() {
        return (Number(this.borderArea?.width) +
            Number(this.borderArea?.border?.pen.width) +
            (this.element.label.alignment == StiLabelAlignment.Top ? this.element.padding.left : 0) +
            this.element.padding.right);
    }
    get borderInnerHeight() {
        return (Number(this.borderArea?.height) +
            Number(this.borderArea?.border?.pen.width) +
            (this.element.label.alignment != StiLabelAlignment.Top
                ? this.element.padding.bottom + this.element.padding.top
                : 0));
    }
    haveAreaContainer() {
        return this.borderArea && (this.element instanceof StiPanelElement || this.element instanceof StiImageElement)
            ? this.element instanceof StiPanelElement && !this.element.isAdded
                ? false
                : true
            : false;
    }
    get overflow() {
        return this.element instanceof StiTableElement ||
            this.element instanceof StiLabelElement ||
            this.element instanceof StiTextElement ||
            this.element instanceof StiImageElement ||
            this.element instanceof StiPanelElement
            ? ""
            : "hidden";
    }
    get className() {
        return "sti-component " + this.class;
    }
    get direction() {
        return this.element?.label?.alignment == StiLabelAlignment.Top || this.element instanceof StiButtonElement
            ? "column"
            : "row";
    }
    get computedX() {
        if (this.isClone) {
            return 0;
        }
        else {
            return (this.element.x +
                (this.model.getElementPage(this.element) ? this.model.getElementPage(this.element).padding.left : 0));
        }
    }
    get cursor() {
        return !this.model.previewMode ? this.model.cursor : "default";
    }
    get computedY() {
        if (this.isClone) {
            return 0;
        }
        else {
            return Number((this.element.y +
                (this.model.getElementPage(this.element) ? this.model.getElementPage(this.element).padding.top : 0)).toFixed(3));
        }
    }
    get width() {
        if (this.isClone) {
            return "auto";
        }
        else {
            return Number(this.element.width) + "px";
        }
    }
    get height() {
        //
        if (this.isClone || (this.model.draggingElement == this.element && this.draggableService.newElement)) {
            return "auto";
        }
        else {
            return Number(this.element.height) + "px";
        }
    }
    get position() {
        if (this.isClone) {
            return "relative";
        }
        else {
            return this.element?.position;
        }
    }
    get align() {
        return this.element instanceof StiButtonElement ? "center" : "normal";
    }
    getMessage() {
        return this.subject.asObservable();
    }
    withoutBorder() {
        if (this.model.selectedComponent?.element["border"] &&
            !(this.model.selectedComponent?.element instanceof StiTableElement) &&
            (this.model.selectedComponent?.element["border"]["drawLeft"] ||
                this.model.selectedComponent?.element["border"]["drawTop"] ||
                this.model.selectedComponent?.element["border"]["drawRight"] ||
                this.model.selectedComponent?.element["border"]["drawBottom"]) &&
            this.model.selectedComponent?.element["border"]["pen"]["color"]["a"] > 0) {
            return false;
        }
        else {
            return true;
        }
    }
    onMouseMove(event) {
        if (this.model.draggingElement) {
            return;
        }
        if (event.ctrlKey &&
            this.canDrag &&
            this.model.canDrag &&
            Math.max(Math.abs(this.mouseDownX - event.clientX), Math.abs(this.mouseDownY - event.clientY)) >
                StiDraggableService.MOUSE_DELTA) {
            let copy = this.helper.clone(this.element);
            copy.name = this.nameService.getElementName(copy);
            this.draggableService.startDrag(event, copy, false, true);
            this.canDrag = false;
        }
        else if (this.canDrag &&
            this.model.canDrag &&
            Math.max(Math.abs(this.mouseDownX - event.clientX), Math.abs(this.mouseDownY - event.clientY)) >
                StiDraggableService.MOUSE_DELTA) {
            this.draggableService.startDrag(event, this.element, false, false, this.layerX, this.layerY, this.elementPage);
            this.canDrag = false;
        }
    }
    onMouseDown(event) {
        this.signatureService.drawingMode = false;
        event.stopPropagation();
        if (!this.model.previewMode && event.button == 0) {
            let form = document.querySelector("stimulsoft-forms");
            form?.classList.add("unselectable");
            if (!event["fromEditableContent"]) {
                this.mouseDownX = event.clientX;
                this.mouseDownY = event.clientY;
                this.canDrag = true;
            }
            else {
            }
            this.model.lastFormState = this.model.form.saveToJsonObject().serialize();
            if (this.model.selectedComponent != this) {
                this.model.previousSelectedComponent = this.model.selectedComponent;
                this.model.selectedComponent = this;
            }
            this.elementPage = this.model.getElementPage(this.element);
            let pos = this.model.getMouseOverPagePosition(event);
            let geometry = this.element.getOverPageGeometry(this.model.form);
            this.layerY = pos?.y - geometry.y * this.model.zoom;
            this.layerX = pos?.x - geometry.x * this.model.zoom;
        }
        else if (!this.model.previewMode && event.button != 0) {
            if (this.model.selectedComponent != this) {
                this.model.previousSelectedComponent = this.model.selectedComponent;
                this.model.selectedComponent = this;
            }
        }
    }
    ngOnInit() {
        this.mouseUpSubscription = this.mouseService.getDocumentMouseUp().subscribe(() => {
            this.canDrag = false;
        });
        this.mouseMoveSubscription = this.mouseService.getDocumentMouseMove().subscribe((event) => {
            this.onMouseMove(event);
        });
        this.needToSelectedSubscription = this.model.needToSelectedComponent.subscribe((element) => {
            if (!this.isClone && element == this.element) {
                this.model.selectedComponent = this;
            }
        });
        setTimeout(() => {
            if (!this.isClone) {
                if (this.element.needToSelectComponent) {
                    this.model.selectedComponent = this;
                    this.element.needToSelectComponent = false;
                }
            }
        }, 0);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiComponent, deps: [{ token: StiModelService }, { token: StiDraggableService }, { token: StiMouseService }, { token: StiHelperService }, { token: StiNameService }, { token: StiComponentResizerService }, { token: SignatureService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiComponent, selector: "sti-component", inputs: { element: "element", class: "class", isClone: "isClone", borderArea: "borderArea" }, ngImport: i0, template: `
    <div
      draggable="false"
      [id]="element?.guid"
      [class]="className"
      [style.left.px]="computedX"
      [style.top.px]="computedY"
      [style.width]="width"
      [style.height]="height"
      [style.position]="position"
      [style.overflow]="overflow"
      [style.display]="'flex'"
      [style.flex-direction]="direction"
      [style.align-items]="align"
      [style.cursor]="cursor"
      [style.transition]="
        element?.position == 'absolute' && resizer.element != element
          ? 'top 0.1s ease 0s,left 0.1s ease 0s,border-color 0.1s ease 0s'
          : ''
      "
      [style.padding-left.px]="element?.padding.left"
      [style.padding-right.px]="element?.padding.right"
      [style.padding-top.px]="element?.padding.top"
      [style.padding-bottom.px]="element?.padding.bottom"
      [style.visibility]="!element?.visible && this.model.previewMode ? 'hidden' : 'visible'"
      (mousedown)="onMouseDown($event)"
      (mouseenter)="this.hover = true; this.model.cursor = 'move'"
      (mouseleave)="this.hover = false; this.model.cursor = 'default'"
      (dragstart)="$event.preventDefault()"
    >
      <ng-content></ng-content>
      <sti-corner-radius-component
        [style.position]="'absolute'"
        [style.pointer-events]="'none'"
        [style.width]="width"
        [style.height]="height"
        [style.left.px]="0"
        [style.top.px]="0"
        *ngIf="model.showCornerRadius && !model.previewMode && element != model.draggingElement"
      ></sti-corner-radius-component>
      <div
        *ngIf="withoutBorder()"
        style="position: absolute; border: 1px solid rgb(126, 180, 234); pointer-events: none"
        [style.width]="width"
        [style.transition]="'opacity 0.2s ease, border-color 0.2s ease'"
        [style.height]="height"
        [style.left.px]="0"
        [style.top.px]="0"
        [style.border-color]="
          model.selectedComponent == this && !model.previewMode && element?.position == 'absolute'
            ? 'rgb(146, 146, 146, 0.35)'
            : 'rgba(213, 213, 213, 0.35)'
        "
        [style.opacity]="
          (model.selectedComponent == this && !model.previewMode && element?.position == 'absolute') ||
          (hover && !model.previewMode && element?.position == 'absolute')
            ? 1
            : 0
        "
      ></div>
      <div
        *ngIf="haveAreaContainer()"
        style="position: absolute; border: 1px solid rgb(126, 180, 234); pointer-events: none"
        [style.width.px]="borderInnerWidth"
        [style.height.px]="borderInnerHeight"
        [style.left.px]="borderArea?.left - borderArea?.border?.pen.width / 2"
        [style.top.px]="borderArea?.top - borderArea?.border?.pen.width / 2"
        [style.border-top]="borderArea?.border.drawTop ? borderArea?.border.pen.toHtmlBorder() : 'transparent'"
        [style.border-left]="borderArea?.border.drawLeft ? borderArea?.border.pen.toHtmlBorder() : 'transparent'"
        [style.border-right]="borderArea?.border.drawRight ? borderArea?.border.pen.toHtmlBorder() : 'transparent'"
        [style.border-bottom]="borderArea?.border.drawBottom ? borderArea?.border.pen.toHtmlBorder() : 'transparent'"
      ></div>
      <i *ngIf="!element?.visible" class="pi pi-eye-slash" style="opacity: 0.3;"></i>
    </div>
    <sti-component-resizer
      [component]="this"
      [left]="computedX + element.width"
      [top]="computedY + element.height"
    ></sti-component-resizer>
    <style>
      .sti-component {
        width: 100%;
        font-size: 1px;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        position: relative;
        padding: 10px;
        z-index: 11;
      }

      .sti-component i {
        position: absolute;
        right: 5px;
        top: 5px;
      }
    </style>
  `, isInline: true, styles: ["\n      .sti-component {\n        width: 100%;\n        font-size: 1px;\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n        position: relative;\n        padding: 10px;\n        z-index: 11;\n      }\n\n      .sti-component i {\n        position: absolute;\n        right: 5px;\n        top: 5px;\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiComponentResizerComponent, selector: "sti-component-resizer", inputs: ["left", "top", "size", "component"] }, { kind: "component", type: StiCornerRadiusComponent, selector: "sti-corner-radius-component" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-component",
                    template: `
    <div
      draggable="false"
      [id]="element?.guid"
      [class]="className"
      [style.left.px]="computedX"
      [style.top.px]="computedY"
      [style.width]="width"
      [style.height]="height"
      [style.position]="position"
      [style.overflow]="overflow"
      [style.display]="'flex'"
      [style.flex-direction]="direction"
      [style.align-items]="align"
      [style.cursor]="cursor"
      [style.transition]="
        element?.position == 'absolute' && resizer.element != element
          ? 'top 0.1s ease 0s,left 0.1s ease 0s,border-color 0.1s ease 0s'
          : ''
      "
      [style.padding-left.px]="element?.padding.left"
      [style.padding-right.px]="element?.padding.right"
      [style.padding-top.px]="element?.padding.top"
      [style.padding-bottom.px]="element?.padding.bottom"
      [style.visibility]="!element?.visible && this.model.previewMode ? 'hidden' : 'visible'"
      (mousedown)="onMouseDown($event)"
      (mouseenter)="this.hover = true; this.model.cursor = 'move'"
      (mouseleave)="this.hover = false; this.model.cursor = 'default'"
      (dragstart)="$event.preventDefault()"
    >
      <ng-content></ng-content>
      <sti-corner-radius-component
        [style.position]="'absolute'"
        [style.pointer-events]="'none'"
        [style.width]="width"
        [style.height]="height"
        [style.left.px]="0"
        [style.top.px]="0"
        *ngIf="model.showCornerRadius && !model.previewMode && element != model.draggingElement"
      ></sti-corner-radius-component>
      <div
        *ngIf="withoutBorder()"
        style="position: absolute; border: 1px solid rgb(126, 180, 234); pointer-events: none"
        [style.width]="width"
        [style.transition]="'opacity 0.2s ease, border-color 0.2s ease'"
        [style.height]="height"
        [style.left.px]="0"
        [style.top.px]="0"
        [style.border-color]="
          model.selectedComponent == this && !model.previewMode && element?.position == 'absolute'
            ? 'rgb(146, 146, 146, 0.35)'
            : 'rgba(213, 213, 213, 0.35)'
        "
        [style.opacity]="
          (model.selectedComponent == this && !model.previewMode && element?.position == 'absolute') ||
          (hover && !model.previewMode && element?.position == 'absolute')
            ? 1
            : 0
        "
      ></div>
      <div
        *ngIf="haveAreaContainer()"
        style="position: absolute; border: 1px solid rgb(126, 180, 234); pointer-events: none"
        [style.width.px]="borderInnerWidth"
        [style.height.px]="borderInnerHeight"
        [style.left.px]="borderArea?.left - borderArea?.border?.pen.width / 2"
        [style.top.px]="borderArea?.top - borderArea?.border?.pen.width / 2"
        [style.border-top]="borderArea?.border.drawTop ? borderArea?.border.pen.toHtmlBorder() : 'transparent'"
        [style.border-left]="borderArea?.border.drawLeft ? borderArea?.border.pen.toHtmlBorder() : 'transparent'"
        [style.border-right]="borderArea?.border.drawRight ? borderArea?.border.pen.toHtmlBorder() : 'transparent'"
        [style.border-bottom]="borderArea?.border.drawBottom ? borderArea?.border.pen.toHtmlBorder() : 'transparent'"
      ></div>
      <i *ngIf="!element?.visible" class="pi pi-eye-slash" style="opacity: 0.3;"></i>
    </div>
    <sti-component-resizer
      [component]="this"
      [left]="computedX + element.width"
      [top]="computedY + element.height"
    ></sti-component-resizer>
    <style>
      .sti-component {
        width: 100%;
        font-size: 1px;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        position: relative;
        padding: 10px;
        z-index: 11;
      }

      .sti-component i {
        position: absolute;
        right: 5px;
        top: 5px;
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiDraggableService }, { type: StiMouseService }, { type: StiHelperService }, { type: StiNameService }, { type: StiComponentResizerService }, { type: SignatureService }], propDecorators: { element: [{
                type: Input
            }], class: [{
                type: Input
            }], isClone: [{
                type: Input
            }], borderArea: [{
                type: Input
            }] } });

////
class StiEditableContentComponent {
    get cursor() {
        if (this.model.previewMode) {
            return "default";
        }
        else {
            return this.showPlaceholder ? "text" : "";
        }
    }
    get showPlaceholder() {
        return (!this.hideEmpty &&
            !(!this.focused && this.displayContent != null ? this.displayContent : this.getValue()) &&
            this.active &&
            !this.model.previewMode /* &&
        this.editableContentService.editableContent != this.editableContent */);
    }
    hasWordWrap() {
        return this.editableContent["useWordWrap"] ? true : false;
    }
    getValue() {
        return this.editableContent?.sValue ?? this.editableContent.eValue;
    }
    get showNonActivePlaceholder() {
        return (!this.hideEmpty &&
            !(!this.focused && this.displayContent != null ? this.displayContent : this.getValue()) &&
            ((!this.active && !this.model.previewMode) ||
                (!this.active && this.model.previewMode) ||
                (this.active && this.model.previewMode)) /* &&
      this.editableContentService.editableContent != this.editableContent */);
    }
    get placeholderOutline() {
        if (this.showPlaceholder) {
            return !this.fromButton ? "1px dashed rgba(213, 213, 213, 0.8)" : "1px dashed rgba(255, 255, 255, 1)";
        }
        else {
            return "";
        }
    }
    click() {
        if (this.showPlaceholder) {
            this.elementRef.nativeElement.focus();
        }
    }
    get isEditable() {
        return (!this.model.previewMode &&
            (this.editableContentService.editableContent == this.editableContent || this.showPlaceholder));
    }
    get width() {
        if (this.editableContent instanceof StiLabelItem && this.editableContent.alignment != StiLabelAlignment.Top) {
            return this.editableContent.width + "px";
        }
        else {
            return "100%";
        }
    }
    get align() {
        if (this.alignment) {
            return Enum.getName(StiHorizontalAlignment, this.alignment);
        }
        else {
            return "";
        }
    }
    constructor(model, editableContentService, mouseService, cdr) {
        this.model = model;
        this.editableContentService = editableContentService;
        this.mouseService = mouseService;
        this.cdr = cdr;
        this.required = false;
        this.hideEmpty = true;
        this.active = true;
        this.isTableTotalHeader = false;
        this.disablePadding = false;
        this.fromButton = false;
        this.isTableHeader = false;
        this.isInitialize = false;
        this.focused = false;
    }
    ngOnDestroy() {
        this.mouseUpSubscription?.unsubscribe();
    }
    ngAfterContentInit() {
        setTimeout(() => {
            if (this.editableContent && this.eParent) {
                this.editableContent.eParent = this.eParent;
            }
        }, 0);
    }
    needToUpdate(event) {
        let elements = document.elementsFromPoint(event.clientX, event.clientY);
        let needToUpdate = true;
        elements.forEach((element) => {
            if (element.className == "Properties") {
                needToUpdate = false;
            }
        });
        if (needToUpdate &&
            typeof this.editableContentService.editableContent != typeof this.editableContent &&
            this.isInitialize &&
            !this.editableContentService.activeControl) {
            this.closeAll(this.model.selectedComponent?.element);
            this.isInitialize = false;
            needToUpdate = true;
            this.model.needToRefresh.next(true);
        }
    }
    focus() {
        this.editableContentService.editableContent = this.editableContent;
        this.editableContentService.editableElementRef = this.elementRef;
        if (this.model.selectedComponent?.element instanceof StiTableElement) {
            // this.closeAll(this.model.selectedComponent.element);
            // this.model.currentTablePropertyHeader.next("Table");
            if (this.editableContent instanceof StiColumnItem) {
                if (!this.model.selectedComponent?.element.showColumnsEditor) {
                    this.model.selectedComponent.element.showColumnsEditor = true;
                    this.model.needToRefresh.next(true);
                }
                // this.model.currentTablePropertyHeader.next("Columns");
                setTimeout(() => {
                    if (this.model.selectedComponent?.element instanceof StiTableElement) {
                        let index = this.model.selectedComponent.element.columns.findIndex((column) => column == this.editableContent);
                        if (this.model.currentContentEditableItemIndex != index ||
                            this.model.previousSelectedComponent != this.model.selectedComponent)
                            this.model.currentContentEditableItem.next(index);
                        this.model.currentContentEditableItemIndex = index;
                    }
                }, 0);
            }
            else if (this.editableContent instanceof StiRowLabel) {
                this.model.selectedComponent.element.showRowsEditor = true;
                this.model.needToRefresh.next(true);
                // this.model.currentTablePropertyHeader.next("Rows");
                /*  setTimeout(() => {
                  if (this.model.selectedComponent.element instanceof StiTableElement) {
                    this.model.currentContentEditableItem.next(
                      this.model.selectedComponent.element.rowLabelsContentEditable.findIndex(
                        (column) => column == this.editableContent
                      )
                    );
                  }
                }, 0); */
            }
            else if (this.editableContent instanceof StiTotalsFieldItem) {
                if (!this.model.selectedComponent.element.showTotalsEditor) {
                    this.model.selectedComponent.element.showTotalsEditor = true;
                    this.model.needToRefresh.next(true);
                }
                // this.model.currentTablePropertyHeader.next("Totals");
                setTimeout(() => {
                    if (this.model.selectedComponent.element instanceof StiTableElement) {
                        let index = this.model.selectedComponent.element.totalsFields.findIndex((column) => column == this.editableContent);
                        this.model.currentContentEditableItem.next(index);
                    }
                }, 0);
            }
            else if (this.isTableTotalHeader) {
                this.model.selectedComponent.element.showTotalsEditor = true;
                this.model.needToRefresh.next(true);
            }
            else {
                this.model.selectedComponent.element.showHeaderEditor = true;
                this.model.needToRefresh.next(true);
            }
        }
        this.isInitialize = true;
        this.focused = true;
    }
    blur() {
        let sValue = this.editableContent.sValue;
        if (sValue != null) {
            this.editableContent.eValue = sValue;
            this.editableContent.sValue = null;
        }
        if (!this.editableContentService.activeControl) {
            setTimeout(() => {
                if (this.editableContentService.editableContent == this.editableContent) {
                    this.editableContentService.editableContent = null;
                    this.editableContentService.editableElementRef = null;
                    if (this.model.getBrowserType() == "safari" ||
                        (this.model.getBrowserType() == "firefox" && !this.showPlaceholder)) {
                        this.cdr.reattach();
                        this.cdr.detectChanges();
                    }
                    this.model.formEvents.next({ name: "ValueChanged" });
                }
                this.focused = false;
            }, 0);
        }
    }
    setContent(innerText) {
        if ((this.model.getBrowserType() == "safari" || this.model.getBrowserType() == "firefox") && this.showPlaceholder) {
            this.editableContentService.startEdit();
        }
        if (this.model.getBrowserType() == "safari" ||
            (this.model.getBrowserType() == "firefox" && !this.showPlaceholder)) {
            this.cdr.detach();
        }
        this.editableContent.sValue = innerText;
        if (innerText == "") {
            this.editableContent.eValue = "";
        }
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    getCharCode(event) {
        return null === event.which ? event.keyCode : !(0 === event.which || 0 === event.charCode) ? event.which : -1;
    }
    disableEnter(event) {
        if (13 === this.getCharCode(event)) {
            event.preventDefault();
            this.blur();
        }
    }
    disableDrag(event) {
        event.fromEditableContent = true;
        this.focus();
    }
    closeAll(element) {
        if (element instanceof StiTableElement) {
            element.showTotalsEditor = false;
            element.showRowsEditor = false;
            element.showColumnsEditor = false;
        }
    }
    ngOnInit() {
        this.mouseUpSubscription = this.mouseService.getDocumentMouseUp().subscribe((event) => {
            this.needToUpdate(event);
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiEditableContentComponent, deps: [{ token: StiModelService }, { token: StiEditableContentService }, { token: StiMouseService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: { editableContent: "editableContent", displayContent: "displayContent", required: "required", eParent: "eParent", hideEmpty: "hideEmpty", active: "active", alignment: "alignment", isTableTotalHeader: "isTableTotalHeader", disablePadding: "disablePadding", fromButton: "fromButton", parentCursor: "parentCursor", isTableHeader: "isTableHeader" }, viewQueries: [{ propertyName: "elementRef", first: true, predicate: ["elementRef"], descendants: true }], ngImport: i0, template: ` <div
    style="-webkit-user-select: {{ model.getBrowserType() == 'safari' ? 'text' : '' }}"
    [style.width]="width"
    [style.overflow]="'hidden'"
  >
    <div
      class="editable-content"
      [style.display]="alignment ? 'flex' : ''"
      [style.justify-content]="align"
      [style.width]="showPlaceholder ? '10px' : width"
      [style.minWidth.px]="showPlaceholder ? 10 : 0"
      [style.outline]="placeholderOutline"
      [style.outline-offset]="'-1px'"
      [style.cursor]="cursor"
      (click)="click()"
    >
      <label
        #elementRef
        *ngIf="!focused && displayContent != null ? displayContent : getValue() || !hideEmpty"
        [style]="editableContent?.htmlStyle() ? editableContent?.htmlStyle() : ''"
        [style.padding-right.px]="disablePadding || required ? 0.1 : showNonActivePlaceholder ? 0 : 5"
        spellcheck="false"
        [style.cursor]="parentCursor ? parentCursor : !model.previewMode ? 'text' : 'default'"
        [attr.contenteditable]="isEditable ? 'plaintext-only' : false"
        [textContent]="!focused && displayContent != null ? displayContent : editableContent?.eValue"
        [style.word-wrap]="hasWordWrap() ? 'break-word' : ''"
        [style.white-space]="hasWordWrap() ? '' : 'nowrap'"
        [style.width]="showPlaceholder ? '100%' : ''"
        [style.text-align]="isTableHeader ? align : ''"
        (input)="setContent($event.target.textContent)"
        (keypress)="disableEnter($event)"
        (focus)="focus()"
        (mousedown)="disableDrag($event)"
        (blur)="blur()"
      >
      </label>
      <span
        class="required"
        [style]="editableContent?.htmlStyle() ? editableContent?.htmlStyle() : ''"
        *ngIf="required"
        [style.color]="'red'"
        [style.font-style]="'normal'"
        [style.font-weight]="'normal'"
        >*</span
      >
      <div
        *ngIf="showNonActivePlaceholder"
        [style]="editableContent?.htmlStyle() ? editableContent?.htmlStyle() : ''"
        class="empty-content"
      >
        .
      </div>
    </div>
  </div>`, isInline: true, styles: [".empty-content{position:relative;left:0;top:0;opacity:0;max-height:1px}label{margin:0;outline:none;max-width:100%;overflow:hidden;scroll-behavior:smooth}.required{color:red;position:relative;margin:0 2px}label:hover{cursor:text}.editable-content{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiEditableContentComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-editable-content-component", template: ` <div
    style="-webkit-user-select: {{ model.getBrowserType() == 'safari' ? 'text' : '' }}"
    [style.width]="width"
    [style.overflow]="'hidden'"
  >
    <div
      class="editable-content"
      [style.display]="alignment ? 'flex' : ''"
      [style.justify-content]="align"
      [style.width]="showPlaceholder ? '10px' : width"
      [style.minWidth.px]="showPlaceholder ? 10 : 0"
      [style.outline]="placeholderOutline"
      [style.outline-offset]="'-1px'"
      [style.cursor]="cursor"
      (click)="click()"
    >
      <label
        #elementRef
        *ngIf="!focused && displayContent != null ? displayContent : getValue() || !hideEmpty"
        [style]="editableContent?.htmlStyle() ? editableContent?.htmlStyle() : ''"
        [style.padding-right.px]="disablePadding || required ? 0.1 : showNonActivePlaceholder ? 0 : 5"
        spellcheck="false"
        [style.cursor]="parentCursor ? parentCursor : !model.previewMode ? 'text' : 'default'"
        [attr.contenteditable]="isEditable ? 'plaintext-only' : false"
        [textContent]="!focused && displayContent != null ? displayContent : editableContent?.eValue"
        [style.word-wrap]="hasWordWrap() ? 'break-word' : ''"
        [style.white-space]="hasWordWrap() ? '' : 'nowrap'"
        [style.width]="showPlaceholder ? '100%' : ''"
        [style.text-align]="isTableHeader ? align : ''"
        (input)="setContent($event.target.textContent)"
        (keypress)="disableEnter($event)"
        (focus)="focus()"
        (mousedown)="disableDrag($event)"
        (blur)="blur()"
      >
      </label>
      <span
        class="required"
        [style]="editableContent?.htmlStyle() ? editableContent?.htmlStyle() : ''"
        *ngIf="required"
        [style.color]="'red'"
        [style.font-style]="'normal'"
        [style.font-weight]="'normal'"
        >*</span
      >
      <div
        *ngIf="showNonActivePlaceholder"
        [style]="editableContent?.htmlStyle() ? editableContent?.htmlStyle() : ''"
        class="empty-content"
      >
        .
      </div>
    </div>
  </div>`, styles: [".empty-content{position:relative;left:0;top:0;opacity:0;max-height:1px}label{margin:0;outline:none;max-width:100%;overflow:hidden;scroll-behavior:smooth}.required{color:red;position:relative;margin:0 2px}label:hover{cursor:text}.editable-content{overflow:hidden}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiEditableContentService }, { type: StiMouseService }, { type: i0.ChangeDetectorRef }], propDecorators: { elementRef: [{
                type: ViewChild,
                args: ["elementRef"]
            }], editableContent: [{
                type: Input
            }], displayContent: [{
                type: Input
            }], required: [{
                type: Input
            }], eParent: [{
                type: Input
            }], hideEmpty: [{
                type: Input
            }], active: [{
                type: Input
            }], alignment: [{
                type: Input
            }], isTableTotalHeader: [{
                type: Input
            }], disablePadding: [{
                type: Input
            }], fromButton: [{
                type: Input
            }], parentCursor: [{
                type: Input
            }], isTableHeader: [{
                type: Input
            }] } });

class StiInputTextComponent {
    get needToFill() {
        return this.element.required && !this.value && this.model.hasEmptyReuiredFields;
    }
    get value() {
        return this.helper.getProperty(this.element, this.property);
    }
    set value(val) {
        this.helper.setProperty(this.element, this.property, val);
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    get placeholder() {
        return this.element.mask == null || this.element.mask.length == 0 ? "" : this.element.mask.replace(/(A)|(X)|(O)|(9)/g, "_");
    }
    constructor(model, helper, editableService) {
        this.model = model;
        this.helper = helper;
        this.editableService = editableService;
        this.MASK_PATTERN = { A: "[a-zA-Z]", X: "[ -ÿ]", O: "[0-9a-zA-Z]", 9: "[0-9]" };
    }
    disableDrag(event) {
        let t = null;
        this.model.canDrag = false;
    }
    borderWidth() {
        return `${this.element.borderWeight}px`;
    }
    inFocus(e) {
        setTimeout(() => {
            let editableContent = new StiInputTextItem(this.element.text, this.element.font, this.element.textColor, this.element.backgroundColor, this.element.contentAlignment);
            editableContent.element = this.element;
            this.editableService.editableContent = editableContent;
            this.editableService.usedElement = this.element;
        }, 0);
        this.checkMask(e);
    }
    lostFocus() {
        if (this.model.selectedComponent?.element != this.element) {
            this.editableService.editableContent = null;
        }
    }
    checkMask(e) {
        if (this.element.mask != null && this.element.mask.length > 0) {
            let msk = this.element.mask.split("");
            let i = this.input.nativeElement;
            if (e.type == "focus" && i.value !== "")
                return;
            const mskd = [];
            let s = i.selectionStart - 1;
            msk.forEach((el, n) => {
                if (this.MASK_PATTERN[el]) {
                    const t = new RegExp(this.MASK_PATTERN[el], "i").test(i.value.charAt(n));
                    mskd.push(t ? i.value.charAt(n) : "_");
                    if (t && s === n && i.value.charAt(n) !== "_") {
                        s++;
                    }
                }
                else {
                    mskd.push(el);
                    if (s === n)
                        s++;
                }
            });
            i.value = mskd.join("");
            i.selectionStart = i.selectionEnd = s < 0 ? 0 : s;
            setTimeout(function () {
                i.selectionStart = i.selectionEnd = s < 0 ? 0 : s;
            }, 0);
        }
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiInputTextComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiEditableContentService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiInputTextComponent, selector: "sti-input-text-component", inputs: { element: "element", property: "property", tabIndex: "tabIndex" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: `
    <input
      #input
      type="text"
      [style]="element?.htmlStyle()"
      [style.color]="element?.textColor.toHtmlColor()"
      [style.background-color]="element?.backgroundColor.toHtmlColor()"
      [style.border-color]="needToFill ? 'red' : element?.borderColor.toHtmlColor()"
      [style.border-width]="borderWidth()"
      autocomplete="disabled"
      spellcheck="false"
      [placeholder]="placeholder"
      [style.align-self]="'center'"
      [attr.maxlength]="element['useRange'] ? element['maximum'] : '255'"
      tooltipPosition="bottom"
      showDelay="500"
      [required]="element?.required"
      [readonly]="element?.readOnly"
      [tabIndex]="tabIndex"
      [(ngModel)]="value"
      (mousedown)="disableDrag($event)"
      (mouseup)="this.model.canDrag = true"
      (focus)="inFocus($event)"
      (input)="checkMask($event)"
      (blur)="lostFocus()"
    />
  `, isInline: true, styles: ["input{height:fit-content;padding:3px 4px;width:100%;border:1px solid rgb(198,198,198)}input:hover{border-color:#a3bde3!important}input:focus{outline:none;border:1px solid rgb(163,189,227)}\n"], dependencies: [{ kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiInputTextComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-input-text-component", template: `
    <input
      #input
      type="text"
      [style]="element?.htmlStyle()"
      [style.color]="element?.textColor.toHtmlColor()"
      [style.background-color]="element?.backgroundColor.toHtmlColor()"
      [style.border-color]="needToFill ? 'red' : element?.borderColor.toHtmlColor()"
      [style.border-width]="borderWidth()"
      autocomplete="disabled"
      spellcheck="false"
      [placeholder]="placeholder"
      [style.align-self]="'center'"
      [attr.maxlength]="element['useRange'] ? element['maximum'] : '255'"
      tooltipPosition="bottom"
      showDelay="500"
      [required]="element?.required"
      [readonly]="element?.readOnly"
      [tabIndex]="tabIndex"
      [(ngModel)]="value"
      (mousedown)="disableDrag($event)"
      (mouseup)="this.model.canDrag = true"
      (focus)="inFocus($event)"
      (input)="checkMask($event)"
      (blur)="lostFocus()"
    />
  `, styles: ["input{height:fit-content;padding:3px 4px;width:100%;border:1px solid rgb(198,198,198)}input:hover{border-color:#a3bde3!important}input:focus{outline:none;border:1px solid rgb(163,189,227)}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiEditableContentService }], propDecorators: { input: [{
                type: ViewChild,
                args: ["input"]
            }], element: [{
                type: Input
            }], property: [{
                type: Input
            }], tabIndex: [{
                type: Input
            }] } });

class StiTooltipService {
    constructor() {
        this.text = "";
        this.position = "bottom";
        this.left = 0;
        this.top = 0;
        this.delay = 0;
        this.elementRect = new DOMRect();
        this.showTooltip = false;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTooltipService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTooltipService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTooltipService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [] });

class StiTooltipDirective {
    constructor(tooltipService, el, model) {
        this.tooltipService = tooltipService;
        this.el = el;
        this.model = model;
        this.active = false;
    }
    ngAfterViewInit() {
        const onMouseEnter = (event) => {
            this.active = true;
            this.tooltipService.text = this.text;
            this.tooltipService.position = this.tooltipPosition ? this.tooltipPosition : "bottom";
            this.tooltipService.delay = this.showDelay ? this.showDelay : 0;
            this.tooltipService.elementRect = this.model.getPositionRelativeToForm(this.el.nativeElement);
            if (this.text) {
                this.activate();
            }
        };
        const onClick = (event) => {
            this.deactivate();
        };
        const onMouseLeave = (event) => {
            this.deactivate();
        };
        this.el.nativeElement.addEventListener("mouseenter", onMouseEnter);
        this.el.nativeElement.addEventListener("click", onClick);
        this.el.nativeElement.addEventListener("mouseleave", onMouseLeave);
    }
    activate() {
        this.active = true;
        this.clearHideTimeout();
        if (this.showDelay) {
            this.showTimeout = setTimeout(() => {
                this.show();
            }, this.showDelay);
        }
        else {
            this.show();
        }
    }
    deactivate() {
        this.active = false;
        this.clearShowTimeout();
        this.hide();
    }
    show() {
        this.tooltipService.showTooltip = true;
    }
    hide() {
        this.tooltipService.showTooltip = false;
    }
    clearShowTimeout() {
        if (this.showTimeout) {
            clearTimeout(this.showTimeout);
            this.showTimeout = null;
        }
    }
    clearHideTimeout() {
        if (this.hideTimeout) {
            clearTimeout(this.hideTimeout);
            this.hideTimeout = null;
        }
    }
    ngOnDestroy() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTooltipDirective, deps: [{ token: StiTooltipService }, { token: i0.ElementRef }, { token: StiModelService }], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: { tooltipPosition: "tooltipPosition", text: ["stiTooltip", "text"], showDelay: "showDelay" }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTooltipDirective, decorators: [{
            type: Directive,
            args: [{ selector: "[stiTooltip]" }]
        }], ctorParameters: () => [{ type: StiTooltipService }, { type: i0.ElementRef }, { type: StiModelService }], propDecorators: { tooltipPosition: [{
                type: Input
            }], text: [{
                type: Input,
                args: ["stiTooltip"]
            }], showDelay: [{
                type: Input
            }] } });

class StiTextBoxComponent {
    get align() {
        return "start";
    }
    get needToFill() {
        return (this.element.required &&
            (this.element.isPassword ? !this.element.password : !this.element.value) &&
            this.model.hasEmptyReuiredFields);
    }
    disableDrag(event) {
        let t = null;
        this.model.canDrag = false;
    }
    constructor(model) {
        this.model = model;
        this.isClone = false;
    }
    ngDoCheck() {
        if (this.textArea) {
            this.element.element = this.textArea;
        }
    }
    ngOnInit() { }
    borderWidth() {
        return `${this.element.borderWeight}px`;
    }
    get text() {
        return this.element.text;
    }
    set text(value) {
        this.element.text = value;
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    get password() {
        return this.element.password;
    }
    set password(value) {
        this.element.password = value;
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    onInput(value) {
        this.element.text = value;
        this.model.formEvents.next({ name: "ValueChanged" });
        //this.model.selectedComponent.element.options.options = value.split("\n"); TODO
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTextBoxComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTextBoxComponent, selector: "sti-textbox-component", inputs: { element: "element", isClone: "isClone" }, viewQueries: [{ propertyName: "textArea", first: true, predicate: ["textArea"], descendants: true }], ngImport: i0, template: `
    <sti-component [element]="element" [isClone]="isClone" class="sti-text-box">
      <sti-editable-content-component
        *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
        [editableContent]="element?.label"
        [required]="element.required"
        [style.align-self]="align"
        [style.text-align]="element?.getContentAlign()"
        [style.width]="element?.getLabelWidth()"
        [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      ></sti-editable-content-component>
      <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
        <tr>
          <td
            *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
            [style.display]="'flex'"
            [style.height]="'100%'"
            [style.width]="element?.getLabelWidth()"
            [style.align-items]="element?.getVerticalAlignment()"
          >
            <sti-editable-content-component
              *ngIf="element?.label.value?.length > 0"
              [editableContent]="element?.label"
              [required]="element.required"
              [style.text-align]="element?.getContentAlign()"
              [style.width]="element?.getLabelWidth()"
              [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
            ></sti-editable-content-component>
          </td>
          <td [style.width]="'100%'">
            <textarea
              #textArea
              name=""
              id=""
              cols="30"
              [rows]="element?.linesCount"
              *ngIf="!element?.isPassword && element?.isMultiline"
              [ngModel]="text"
              (input)="onInput($event.target.value)"
              [style.color]="element?.textColor.toHtmlColor()"
              [style.background-color]="element?.backgroundColor.toHtmlColor()"
              [style.border-color]="needToFill ? 'red' : element?.borderColor.toHtmlColor()"
              [style.border-width]="borderWidth()"
              [style]="element?.htmlStyle()"
              [stiTooltip]="element?.tooltip"
              [tabIndex]="element['tabIndex']"
              tooltipPosition="bottom"
              showDelay="500"
              [required]="element?.required"
              [readonly]="element?.readOnly"
              (mousedown)="disableDrag($event)"
              (mouseup)="this.model.canDrag = true"
            ></textarea>
            <input
              type="password"
              *ngIf="element?.isPassword"
              [style]="element?.htmlStyle()"
              [style.color]="element?.textColor.toHtmlColor()"
              [style.background-color]="element?.backgroundColor.toHtmlColor()"
              spellcheck="false"
              [style.border-color]="needToFill ? 'red' : element?.borderColor.toHtmlColor()"
              [style.border-width]="borderWidth()"
              maxlength="{{ element?.maxLength }}"
              [stiTooltip]="element?.tooltip"
              [tabIndex]="element['tabIndex']"
              tooltipPosition="bottom"
              showDelay="500"
              [required]="element?.required"
              [readonly]="element?.readOnly"
              [(ngModel)]="password"
              (mousedown)="disableDrag($event)"
              (mouseup)="this.model.canDrag = true"
            />
            <sti-input-text-component
              *ngIf="!element?.isPassword && !element?.isMultiline"
              [element]="element"
              [tabIndex]="element['tabIndex']"
              [property]="'text'"
              [stiTooltip]="element?.tooltip"
              tooltipPosition="bottom"
              showDelay="500"
            ></sti-input-text-component>
          </td>
        </tr>
        <tr *ngIf="element?.description.value?.length > 0">
          <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
          <td [style.maxWidth.px]="element.maxWidth + 1">
            <sti-editable-content-component
              *ngIf="element?.description.value?.length > 0"
              [editableContent]="element.description"
            >
            </sti-editable-content-component>
          </td>
        </tr>
      </table>
    </sti-component>
  `, isInline: true, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}textarea{resize:none;width:100%;height:auto;overflow-y:auto;padding:3px 4px}textarea:hover{border-color:#a3bde3!important}textarea:focus{outline:none}input{height:fit-content;padding:3px 4px;width:100%;border:1px solid rgb(198,198,198)}.sti-text-box input:hover{border-color:#a3bde3!important}.sti-text-box input:focus{outline:none;border:1px solid rgb(163,189,227)}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }, { kind: "component", type: StiInputTextComponent, selector: "sti-input-text-component", inputs: ["element", "property", "tabIndex"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTextBoxComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-textbox-component", template: `
    <sti-component [element]="element" [isClone]="isClone" class="sti-text-box">
      <sti-editable-content-component
        *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
        [editableContent]="element?.label"
        [required]="element.required"
        [style.align-self]="align"
        [style.text-align]="element?.getContentAlign()"
        [style.width]="element?.getLabelWidth()"
        [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      ></sti-editable-content-component>
      <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
        <tr>
          <td
            *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
            [style.display]="'flex'"
            [style.height]="'100%'"
            [style.width]="element?.getLabelWidth()"
            [style.align-items]="element?.getVerticalAlignment()"
          >
            <sti-editable-content-component
              *ngIf="element?.label.value?.length > 0"
              [editableContent]="element?.label"
              [required]="element.required"
              [style.text-align]="element?.getContentAlign()"
              [style.width]="element?.getLabelWidth()"
              [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
            ></sti-editable-content-component>
          </td>
          <td [style.width]="'100%'">
            <textarea
              #textArea
              name=""
              id=""
              cols="30"
              [rows]="element?.linesCount"
              *ngIf="!element?.isPassword && element?.isMultiline"
              [ngModel]="text"
              (input)="onInput($event.target.value)"
              [style.color]="element?.textColor.toHtmlColor()"
              [style.background-color]="element?.backgroundColor.toHtmlColor()"
              [style.border-color]="needToFill ? 'red' : element?.borderColor.toHtmlColor()"
              [style.border-width]="borderWidth()"
              [style]="element?.htmlStyle()"
              [stiTooltip]="element?.tooltip"
              [tabIndex]="element['tabIndex']"
              tooltipPosition="bottom"
              showDelay="500"
              [required]="element?.required"
              [readonly]="element?.readOnly"
              (mousedown)="disableDrag($event)"
              (mouseup)="this.model.canDrag = true"
            ></textarea>
            <input
              type="password"
              *ngIf="element?.isPassword"
              [style]="element?.htmlStyle()"
              [style.color]="element?.textColor.toHtmlColor()"
              [style.background-color]="element?.backgroundColor.toHtmlColor()"
              spellcheck="false"
              [style.border-color]="needToFill ? 'red' : element?.borderColor.toHtmlColor()"
              [style.border-width]="borderWidth()"
              maxlength="{{ element?.maxLength }}"
              [stiTooltip]="element?.tooltip"
              [tabIndex]="element['tabIndex']"
              tooltipPosition="bottom"
              showDelay="500"
              [required]="element?.required"
              [readonly]="element?.readOnly"
              [(ngModel)]="password"
              (mousedown)="disableDrag($event)"
              (mouseup)="this.model.canDrag = true"
            />
            <sti-input-text-component
              *ngIf="!element?.isPassword && !element?.isMultiline"
              [element]="element"
              [tabIndex]="element['tabIndex']"
              [property]="'text'"
              [stiTooltip]="element?.tooltip"
              tooltipPosition="bottom"
              showDelay="500"
            ></sti-input-text-component>
          </td>
        </tr>
        <tr *ngIf="element?.description.value?.length > 0">
          <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
          <td [style.maxWidth.px]="element.maxWidth + 1">
            <sti-editable-content-component
              *ngIf="element?.description.value?.length > 0"
              [editableContent]="element.description"
            >
            </sti-editable-content-component>
          </td>
        </tr>
      </table>
    </sti-component>
  `, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}textarea{resize:none;width:100%;height:auto;overflow-y:auto;padding:3px 4px}textarea:hover{border-color:#a3bde3!important}textarea:focus{outline:none}input{height:fit-content;padding:3px 4px;width:100%;border:1px solid rgb(198,198,198)}.sti-text-box input:hover{border-color:#a3bde3!important}.sti-text-box input:focus{outline:none;border:1px solid rgb(163,189,227)}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { element: [{
                type: Input
            }], textArea: [{
                type: ViewChild,
                args: ["textArea"]
            }], isClone: [{
                type: Input
            }] } });

class StiNumberComponent {
    get isNumberBox() {
        return this.element instanceof StiNumberBoxElement;
    }
    get needToFill() {
        return this.element["required"] && !this.element["value"] && this.model.hasEmptyReuiredFields;
    }
    get disabled() {
        return (this.element.type == "Number_BoxElement" && this.element.readOnly) ||
            (this.element.type != "Number_BoxElement" && this.element.eParent?.readOnly)
            ? true
            : false;
    }
    constructor(model, helper, editableService, mouseService) {
        this.model = model;
        this.helper = helper;
        this.editableService = editableService;
        this.mouseService = mouseService;
        this.buttonDown = 0;
        this.mouseOver = false;
        this.focused = false;
    }
    get tabIndex() {
        try {
            let columns = this.table?.columns;
            return columns
                ? this.table["tabIndex"] + columns.indexOf(this.element) + columns.length * this.index
                : this.element["tabIndex"];
        }
        catch { }
    }
    ngOnDestroy() {
        this.mouseUpSubscription?.unsubscribe();
    }
    clear() {
        setTimeout(() => {
            this.buttonDown = 0;
        }, 0);
    }
    ngOnInit() {
        this.mouseUpSubscription = this.mouseService.getCaptureMouseUp().subscribe(() => {
            this.buttonDown = 0;
        });
    }
    onFocus(event) {
        this.focused = true;
        setTimeout(() => {
            let editableContent;
            if (this.element.type == "Number_BoxElement") {
                let nbe = this.element;
                editableContent = new StiInputTextItem(this.elementValue?.toString(), nbe.font, nbe.textColor, nbe.backgroundColor, nbe.contentAlignment);
            }
            else {
                let nbce = this.element;
                editableContent = new StiInputTextItem(this.elementValue?.toString(), this.table.font, nbce.cellForeColor, nbce.cellBackColor, nbce.cellAlignment);
            }
            editableContent.element = this.element;
            this.editableService.editableContent = editableContent;
            this.editableService.usedElement = this.element;
        }, 0);
        event.currentTarget.value = this.elementValue?.toString();
    }
    get elementBorderColor() {
        return this.element.type == "Number_BoxElement"
            ? this.element.borderColor
            : this.element.cellBorderColor;
    }
    get readonly() {
        return this.element.type == "Number_BoxElement"
            ? this.element.readOnly
            : this.element.eParent?.readOnly;
    }
    get cellBackgroundColor() {
        return this.element.type == "Number_BoxElement"
            ? this.element.backgroundColor
            : this.element.cellBackColor;
    }
    get elementTextColor() {
        return this.element.type == "Number_BoxElement"
            ? this.element.textColor
            : this.element.cellForeColor;
    }
    get elementHtmlStyle() {
        return this.element.type == "Number_BoxElement"
            ? this.element.htmlStyle()
            : this.table.font.htmlStyle();
    }
    get elementValue() {
        return this.element.type == "Number_BoxElement"
            ? this.element.value
            : this.element.cells[this.index].value;
    }
    set elementValue(value) {
        if (this.element.type == "Number_BoxElement") {
            this.element.value = value;
            if (this.element.useRange) {
                this.model.checkNumberRange(this.element);
            }
        }
        else {
            this.element.cells[this.index].value = value;
        }
    }
    onLostFocus(event) {
        if (this.model.selectedComponent?.element != this.element) {
            this.editableService.editableContent = null;
        }
        this.editableService.usedElement = this.element;
        let value = 0;
        try {
            value = parseFloat(event.currentTarget.value);
        }
        catch { }
        this.focused = false;
        this.elementValue = !isNaN(value) ? value : 0;
        event.currentTarget.value = this.value;
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    setIncDec(value) {
        if (!this.readonly) {
            if (this.incTimeout) {
                clearTimeout(this.incTimeout);
                this.incTimeout = null;
            }
            setTimeout(() => {
                this.elementValue += value;
                this.buttonDown = value;
                this.incDecTimer();
                this.model.formEvents.next({ name: "ValueChanged" });
            }, 0);
        }
    }
    incDecTimer(first = true) {
        let this_ = this;
        this.incTimeout = setTimeout(() => {
            if (this_.buttonDown != 0) {
                this_.elementValue += this_.buttonDown;
                this_.incDecTimer(false);
                this.model.formEvents.next({ name: "ValueChanged" });
            }
        }, first ? 400 : 50);
    }
    get isCurrency() {
        return this.element?.numberType == StiNumberType.Currency ? true : false;
    }
    getCurrency(currency) {
        if (this.isCurrency) {
            let value = this.helper.currencyInfo.find((item) => item.code == currency);
            if (this.element.currencyLabelFormat == StiDisplayCurrencyAs.Symbol) {
                return value.symbol;
            }
            else {
                return value.code;
            }
        }
    }
    get value() {
        let unit = this.element.numberType == StiNumberType.Decimal
            ? this.element.unitLabel
            : this.getCurrency(this.element.currency);
        return this.focused
            ? this.elementValue?.toString()
            : this.model.formatNumber(this.elementValue, this.element.thousandSeparator, this.element.decimalDigits, this.element.unitAlignment, unit);
    }
    get isPrefix() {
        return this.element.unitAlignment == StiUnitAlignment.Prefix;
    }
    get isSuffix() {
        return this.element.unitAlignment == StiUnitAlignment.Suffix;
    }
    borderWidth() {
        return `${this.element["borderWeight"]}px`;
    }
    disableDrag(event) {
        this.model.canDrag = false;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiNumberComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiEditableContentService }, { token: StiMouseService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiNumberComponent, selector: "sti-number-component", inputs: { element: "element", index: "index", table: "table" }, ngImport: i0, template: `
    <div class="number-component" [style.align-self]="'start'" [style.flexDirection]="isPrefix ? 'row' : 'row-reverse'">
      <div
        class="unit"
        *ngIf="(element.unitLabel && !isCurrency && (isPrefix || isSuffix)) || (isCurrency && (isPrefix || isSuffix))"
      >
        <span [style]="element?.htmlStyle()" [style.color]="element.unitForeground?.toHtmlColor()">{{
          isCurrency ? getCurrency(element.currency) : element.unitLabel
        }}</span>
      </div>

      <div
        class="number-box"
        [stiTooltip]="element['tooltip']"
        tooltipPosition="bottom"
        showDelay="500"
        [style.border-width]="borderWidth()"
        [style.border-color]="needToFill ? 'red' : elementBorderColor.toHtmlColor()"
        [style.background-color]="element['backgroundColor'].toHtmlColor()"
        (mouseover)="mouseOver = true"
        (mouseleave)="mouseOver = false"
      >
        <input
          type="text"
          (focus)="onFocus($event)"
          (blur)="onLostFocus($event)"
          [value]="value"
          [required]="element['required']"
          [style.border-width]="borderWidth()"
          [readonly]="readonly"
          [tabIndex]="tabIndex"
          [style]="elementHtmlStyle"
          [style.color]="elementTextColor.toHtmlColor()"
          [style.background-color]="cellBackgroundColor.toHtmlColor()"
          [style.pointer-events]="disabled ? 'none' : ''"
          (mousedown)="disableDrag($event)"
          (mouseup)="this.model.canDrag = true"
        />
        <div
          class="buttons"
          [style.width.px]="isNumberBox ? 28 : 20"
          *ngIf="((focused || mouseOver) && !disabled) || isNumberBox"
        >
          <div class="button-up" (mousedown)="setIncDec(1)" (mouseup)="clear()">
            <i class="pi pi-angle-up"></i>
          </div>
          <div class="button-down" (mousedown)="setIncDec(-1)" (mouseup)="clear()">
            <i class="pi pi-angle-down"></i>
          </div>
        </div>
      </div>
    </div>
  `, isInline: true, styles: [".number-component{display:flex;width:100%}.unit{align-self:center;padding-left:1px;padding-right:1px}.number-box{width:100%;height:auto;border:1px solid rgb(171,170,169);background-color:#fff;position:relative;display:flex}.number-box:hover{border-color:#a3bde3!important}input{outline:none;border:0px;width:100%;height:auto;padding:3px 5px}.buttons{width:20px;height:100%;align-self:flex-end;display:flex;flex-direction:column;color:#bab9b8}.button-up{width:100%;height:50%;display:flex;justify-content:center}.button-up i{margin-top:.4px}.button-up:hover{cursor:default;background-color:#d5e1f2}.button-up:active{background-color:#a3bde3}.button-down{width:100%;height:50%;display:flex;align-items:center;justify-content:center}.button-down i{margin-bottom:2px}.button-down:hover{cursor:default;background-color:#d5e1f2}.button-down:active{background-color:#a3bde3}i{margin:0;height:8px}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiNumberComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-number-component", template: `
    <div class="number-component" [style.align-self]="'start'" [style.flexDirection]="isPrefix ? 'row' : 'row-reverse'">
      <div
        class="unit"
        *ngIf="(element.unitLabel && !isCurrency && (isPrefix || isSuffix)) || (isCurrency && (isPrefix || isSuffix))"
      >
        <span [style]="element?.htmlStyle()" [style.color]="element.unitForeground?.toHtmlColor()">{{
          isCurrency ? getCurrency(element.currency) : element.unitLabel
        }}</span>
      </div>

      <div
        class="number-box"
        [stiTooltip]="element['tooltip']"
        tooltipPosition="bottom"
        showDelay="500"
        [style.border-width]="borderWidth()"
        [style.border-color]="needToFill ? 'red' : elementBorderColor.toHtmlColor()"
        [style.background-color]="element['backgroundColor'].toHtmlColor()"
        (mouseover)="mouseOver = true"
        (mouseleave)="mouseOver = false"
      >
        <input
          type="text"
          (focus)="onFocus($event)"
          (blur)="onLostFocus($event)"
          [value]="value"
          [required]="element['required']"
          [style.border-width]="borderWidth()"
          [readonly]="readonly"
          [tabIndex]="tabIndex"
          [style]="elementHtmlStyle"
          [style.color]="elementTextColor.toHtmlColor()"
          [style.background-color]="cellBackgroundColor.toHtmlColor()"
          [style.pointer-events]="disabled ? 'none' : ''"
          (mousedown)="disableDrag($event)"
          (mouseup)="this.model.canDrag = true"
        />
        <div
          class="buttons"
          [style.width.px]="isNumberBox ? 28 : 20"
          *ngIf="((focused || mouseOver) && !disabled) || isNumberBox"
        >
          <div class="button-up" (mousedown)="setIncDec(1)" (mouseup)="clear()">
            <i class="pi pi-angle-up"></i>
          </div>
          <div class="button-down" (mousedown)="setIncDec(-1)" (mouseup)="clear()">
            <i class="pi pi-angle-down"></i>
          </div>
        </div>
      </div>
    </div>
  `, styles: [".number-component{display:flex;width:100%}.unit{align-self:center;padding-left:1px;padding-right:1px}.number-box{width:100%;height:auto;border:1px solid rgb(171,170,169);background-color:#fff;position:relative;display:flex}.number-box:hover{border-color:#a3bde3!important}input{outline:none;border:0px;width:100%;height:auto;padding:3px 5px}.buttons{width:20px;height:100%;align-self:flex-end;display:flex;flex-direction:column;color:#bab9b8}.button-up{width:100%;height:50%;display:flex;justify-content:center}.button-up i{margin-top:.4px}.button-up:hover{cursor:default;background-color:#d5e1f2}.button-up:active{background-color:#a3bde3}.button-down{width:100%;height:50%;display:flex;align-items:center;justify-content:center}.button-down i{margin-bottom:2px}.button-down:hover{cursor:default;background-color:#d5e1f2}.button-down:active{background-color:#a3bde3}i{margin:0;height:8px}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiEditableContentService }, { type: StiMouseService }], propDecorators: { element: [{
                type: Input
            }], index: [{
                type: Input
            }], table: [{
                type: Input
            }] } });

class StiNumberBoxComponent {
    get align() {
        return "start";
    }
    constructor(model, helper, editableService, mouseService) {
        this.model = model;
        this.helper = helper;
        this.editableService = editableService;
        this.mouseService = mouseService;
        this.isClone = false;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiNumberBoxComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiEditableContentService }, { token: StiMouseService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiNumberBoxComponent, selector: "sti-numberbox-component", inputs: { element: "element", isClone: "isClone" }, ngImport: i0, template: ` <sti-component [element]="element" [isClone]="isClone" class="StiNumberBox">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.align-self]="align"
      [style.text-align]="element?.getContentAlign()"
      [required]="element.required"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [style.width]="element?.getLabelWidth()"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
            [editableContent]="element.label"
            [style.text-align]="element?.getContentAlign()"
            [required]="element.required"
            [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
            [style.width]="element?.getLabelWidth()"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'">
          <sti-number-component [element]="element"> </sti-number-component>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, isInline: true, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiNumberComponent, selector: "sti-number-component", inputs: ["element", "index", "table"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiNumberBoxComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-numberbox-component", template: ` <sti-component [element]="element" [isClone]="isClone" class="StiNumberBox">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.align-self]="align"
      [style.text-align]="element?.getContentAlign()"
      [required]="element.required"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [style.width]="element?.getLabelWidth()"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
            [editableContent]="element.label"
            [style.text-align]="element?.getContentAlign()"
            [required]="element.required"
            [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
            [style.width]="element?.getLabelWidth()"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'">
          <sti-number-component [element]="element"> </sti-number-component>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiEditableContentService }, { type: StiMouseService }], propDecorators: { element: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiComboBoxComponent {
    get align() {
        return "start";
    }
    disableDrag(event) {
        this.model.canDrag = false;
    }
    get needToFill() {
        return this.element.required && !this.element.value && this.model.hasEmptyReuiredFields;
    }
    constructor(model, editableService) {
        this.model = model;
        this.editableService = editableService;
        this.isClone = false;
    }
    ngOnInit() { }
    get selectedOption() {
        return this.element.selectedOption;
    }
    set selectedOption(value) {
        this.element.selectedOption = value;
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    borderWidth() {
        return `${this.element.borderWeight}px`;
    }
    inFocus() {
        setTimeout(() => {
            this.editableService.editableContent = new StiTextItem(this.element.selectedOption, this.element.font, this.element.textColor, this.element.backgroundColor);
            this.editableService.usedElement = this.element;
        }, 0);
    }
    lostFocus() {
        if (this.model.selectedComponent?.element != this.element) {
            this.editableService.editableContent = null;
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiComboBoxComponent, deps: [{ token: StiModelService }, { token: StiEditableContentService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiComboBoxComponent, selector: "sti-combobox-component", inputs: { element: "element", isClone: "isClone" }, ngImport: i0, template: ` <sti-component [element]="element" [isClone]="isClone" class="sti-combo-box">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.align-self]="align"
      [style.text-align]="element?.getContentAlign()"
      [required]="element.required"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [style.width]="element?.getLabelWidth()"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'">
          <select
            class="selection"
            name=""
            id=""
            [(ngModel)]="selectedOption"
            [style.align-self]="align"
            [style]="element?.htmlStyle()"
            [style.color]="element?.textColor.toHtmlColor()"
            [style.background-color]="element?.backgroundColor.toHtmlColor()"
            [style.border-color]="needToFill ? 'red' : element?.borderColor.toHtmlColor()"
            [style.border-width]="borderWidth()"
            [disabled]="element?.readOnly ? true : false"
            [required]="element?.required"
            [stiTooltip]="element?.tooltip"
            [tabIndex]="element['tabIndex']"
            tooltipPosition="bottom"
            showDelay="500"
            (mousedown)="disableDrag($event)"
            (mouseup)="this.model.canDrag = true"
            (focus)="inFocus()"
            (blur)="lostFocus()"
          >
            <option
              [style.background-color]="element?.backgroundColor.toHtmlColor()"
              *ngFor="let option of element?.options"
            >
              {{ option }}
            </option>
          </select>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, isInline: true, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}.selection{width:100%;border:1px solid rgb(198,198,198);background-color:#fff;height:fit-content;padding:3px 4px;appearance:none;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3NpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDA2IDc5LjE2NDc1MywgMjAyMS8wMi8xNS0xMTo1MjoxMyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDphNzFiNTVkYi0wMGZlLTVjNDctYmVkZS1jYTVhNjk0NjdkNjgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6N0UxNDE5MzBBNDBDMTFFQkE5MDBCNzU3NjhFQUY2QTQiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6N0UxNDE5MkZBNDBDMTFFQkE5MDBCNzU3NjhFQUY2QTQiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIyLjMgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6YTcxYjU1ZGItMDBmZS01YzQ3LWJlZGUtY2E1YTY5NDY3ZDY4IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOmE3MWI1NWRiLTAwZmUtNWM0Ny1iZWRlLWNhNWE2OTQ2N2Q2OCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pg8NmFEAAABPSURBVHjaYmxsbGSgBDAxUAiGqQH1eNTXE2NAAw5D6qFyBA1oxGIITDNGnLPgcAEDmm0NSAYTNACbIVg14zMAmwsYSDUAr8bRpIwAAAEGAFUJDal4N9jVAAAAAElFTkSuQmCC);background-repeat:no-repeat;background-position:right 5px top 50%;background-size:14px auto}.selection:hover{border-color:#a3bde3!important;background-color:#e2effc!important}.selection:focus{outline:none;border-color:#a3bde3!important}.sti-combo-box option:hover{box-shadow:0 0 10px 100px orange inset}select:focus>option:checked{background-color:#f6f6f6!important}select option:hover{box-shadow:0 0 10px 100px orange inset}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiComboBoxComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-combobox-component", template: ` <sti-component [element]="element" [isClone]="isClone" class="sti-combo-box">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.align-self]="align"
      [style.text-align]="element?.getContentAlign()"
      [required]="element.required"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [style.width]="element?.getLabelWidth()"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'">
          <select
            class="selection"
            name=""
            id=""
            [(ngModel)]="selectedOption"
            [style.align-self]="align"
            [style]="element?.htmlStyle()"
            [style.color]="element?.textColor.toHtmlColor()"
            [style.background-color]="element?.backgroundColor.toHtmlColor()"
            [style.border-color]="needToFill ? 'red' : element?.borderColor.toHtmlColor()"
            [style.border-width]="borderWidth()"
            [disabled]="element?.readOnly ? true : false"
            [required]="element?.required"
            [stiTooltip]="element?.tooltip"
            [tabIndex]="element['tabIndex']"
            tooltipPosition="bottom"
            showDelay="500"
            (mousedown)="disableDrag($event)"
            (mouseup)="this.model.canDrag = true"
            (focus)="inFocus()"
            (blur)="lostFocus()"
          >
            <option
              [style.background-color]="element?.backgroundColor.toHtmlColor()"
              *ngFor="let option of element?.options"
            >
              {{ option }}
            </option>
          </select>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}.selection{width:100%;border:1px solid rgb(198,198,198);background-color:#fff;height:fit-content;padding:3px 4px;appearance:none;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3NpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDA2IDc5LjE2NDc1MywgMjAyMS8wMi8xNS0xMTo1MjoxMyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDphNzFiNTVkYi0wMGZlLTVjNDctYmVkZS1jYTVhNjk0NjdkNjgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6N0UxNDE5MzBBNDBDMTFFQkE5MDBCNzU3NjhFQUY2QTQiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6N0UxNDE5MkZBNDBDMTFFQkE5MDBCNzU3NjhFQUY2QTQiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIyLjMgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6YTcxYjU1ZGItMDBmZS01YzQ3LWJlZGUtY2E1YTY5NDY3ZDY4IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOmE3MWI1NWRiLTAwZmUtNWM0Ny1iZWRlLWNhNWE2OTQ2N2Q2OCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pg8NmFEAAABPSURBVHjaYmxsbGSgBDAxUAiGqQH1eNTXE2NAAw5D6qFyBA1oxGIITDNGnLPgcAEDmm0NSAYTNACbIVg14zMAmwsYSDUAr8bRpIwAAAEGAFUJDal4N9jVAAAAAElFTkSuQmCC);background-repeat:no-repeat;background-position:right 5px top 50%;background-size:14px auto}.selection:hover{border-color:#a3bde3!important;background-color:#e2effc!important}.selection:focus{outline:none;border-color:#a3bde3!important}.sti-combo-box option:hover{box-shadow:0 0 10px 100px orange inset}select:focus>option:checked{background-color:#f6f6f6!important}select option:hover{box-shadow:0 0 10px 100px orange inset}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiEditableContentService }], propDecorators: { element: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiListBoxComponent {
    get align() {
        return "start";
    }
    get needToFill() {
        return this.element.required && this.element.value.length == 0 && this.model.hasEmptyReuiredFields;
    }
    constructor(model, editableService) {
        this.model = model;
        this.editableService = editableService;
        this.isClone = false;
    }
    disableDrag(event) {
        setTimeout(() => {
            this.editableService.editableContent = new StiTextItem("", this.element.font, this.element.textColor, this.element.backgroundColor);
            this.editableService.usedElement = this.element;
        }, 0);
        this.model.canDrag = false;
    }
    ngOnInit() { }
    borderWidth() {
        return `${this.element.borderWeight}px`;
    }
    selectValue(option) {
        if (this.element.allowMultiselection) {
            if (this.element.selectedOptions.indexOf(option) >= 0) {
                this.element?.selectedOptions.splice(this.element.selectedOptions.indexOf(option), 1);
            }
            else {
                this.element.selectedOptions.push(option);
            }
        }
        else {
            this.element.selectedOptions = [];
            this.element.selectedOptions.push(option);
        }
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    get htmlStyleElement() {
        return this.element;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiListBoxComponent, deps: [{ token: StiModelService }, { token: StiEditableContentService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiListBoxComponent, selector: "sti-listbox-component", inputs: { element: "element", isClone: "isClone" }, ngImport: i0, template: ` <sti-component [element]="element" [isClone]="isClone" class="sti-list-box">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.align-self]="align"
      [style.text-align]="element?.getContentAlign()"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [required]="element.required"
      [style.width]="element?.getLabelWidth()"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'">
          <ul
            [style.margin-top.px]="element?.getTopMargin()"
            [style.align-self]="'center'"
            class="{{ element?.readOnly ? 'disabled' : '' }}"
            [style.border-color]="needToFill ? 'red' : element?.borderColor.toHtmlColor()"
            [style.background-color]="element?.backgroundColor.toHtmlColor()"
            [style.color]="element?.textColor.toHtmlColor()"
            [style]="htmlStyleElement?.htmlStyle()"
            [style.border-width]="borderWidth()"
            [stiTooltip]="element?.tooltip"
            [tabIndex]="element['tabIndex']"
            tooltipPosition="bottom"
            showDelay="500"
            (mousedown)="disableDrag($event)"
            (mouseup)="this.model.canDrag = true"
          >
            <li
              *ngFor="let option of element.options"
              [disabled]="element?.readOnly ? true : false"
              (mousedown)="selectValue(option)"
              class="{{ element.selectedOptions.indexOf(option) >= 0 ? 'active' : '' }}"
            >
              {{ option }}
            </li>
          </ul>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, isInline: true, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}.sti-list-box ul{width:100%;list-style:none;padding:2px;margin-top:10px;margin-bottom:0;border:1px solid}.sti-list-box li{padding:1px 4px;border:1px solid transparent}.sti-list-box li:hover{background-color:#e5f3fb;border-color:#70c0e7}.sti-list-box li:active{background-color:#cbe8f6;border-color:#26a0da}.active{background-color:#f6f6f6;border-color:#dadada!important}.active:hover{background-color:#e5f3fb;border-color:#70c0e7}.active:focus{background-color:#cbe8f6;border-color:#26a0da}.disabled{pointer-events:none;opacity:.5}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiListBoxComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-listbox-component", template: ` <sti-component [element]="element" [isClone]="isClone" class="sti-list-box">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.align-self]="align"
      [style.text-align]="element?.getContentAlign()"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [required]="element.required"
      [style.width]="element?.getLabelWidth()"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'">
          <ul
            [style.margin-top.px]="element?.getTopMargin()"
            [style.align-self]="'center'"
            class="{{ element?.readOnly ? 'disabled' : '' }}"
            [style.border-color]="needToFill ? 'red' : element?.borderColor.toHtmlColor()"
            [style.background-color]="element?.backgroundColor.toHtmlColor()"
            [style.color]="element?.textColor.toHtmlColor()"
            [style]="htmlStyleElement?.htmlStyle()"
            [style.border-width]="borderWidth()"
            [stiTooltip]="element?.tooltip"
            [tabIndex]="element['tabIndex']"
            tooltipPosition="bottom"
            showDelay="500"
            (mousedown)="disableDrag($event)"
            (mouseup)="this.model.canDrag = true"
          >
            <li
              *ngFor="let option of element.options"
              [disabled]="element?.readOnly ? true : false"
              (mousedown)="selectValue(option)"
              class="{{ element.selectedOptions.indexOf(option) >= 0 ? 'active' : '' }}"
            >
              {{ option }}
            </li>
          </ul>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}.sti-list-box ul{width:100%;list-style:none;padding:2px;margin-top:10px;margin-bottom:0;border:1px solid}.sti-list-box li{padding:1px 4px;border:1px solid transparent}.sti-list-box li:hover{background-color:#e5f3fb;border-color:#70c0e7}.sti-list-box li:active{background-color:#cbe8f6;border-color:#26a0da}.active{background-color:#f6f6f6;border-color:#dadada!important}.active:hover{background-color:#e5f3fb;border-color:#70c0e7}.active:focus{background-color:#cbe8f6;border-color:#26a0da}.disabled{pointer-events:none;opacity:.5}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiEditableContentService }], propDecorators: { element: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiSvgRadiobuttonComponent {
    constructor(model) {
        this.model = model;
        this.useCustomOption = false;
        this.buttonClick = new EventEmitter();
        this.isCurrentOption = false;
    }
    get selected() {
        return this.model.selectedComponent?.element == this.element;
    }
    get isMozila() {
        return this.model.getBrowserType() == "firefox" ? true : false;
    }
    get isSafari() {
        return this.model.getBrowserType() == "safari" ? true : false;
    }
    get backColor() {
        return this.element.backgroundColor.toHtmlColor();
    }
    get checkColor() {
        return this.element.checkColor.toHtmlColor();
    }
    get borderColor() {
        return this.element.borderColor.toHtmlColor();
    }
    get textStyle() {
        return this.element?.htmlStyle();
    }
    disableDrag(event) {
        this.model.canDrag = false;
    }
    changeState() {
        this.buttonClick.emit();
    }
    get needToFill() {
        return this.element.required && !this.element.value && this.model.hasEmptyReuiredFields;
    }
    getContent(innerText) {
        if (this.isCurrentOption) {
            this.element.selectedOption = innerText;
        }
        this.element["customOptionText"] = innerText;
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    getCharCode(event) {
        return null === event.which ? event.keyCode : !(0 === event.which || 0 === event.charCode) ? event.which : -1;
    }
    checkOption() {
        if (this.element.selectedOption == this.element.customOptionText) {
            this.isCurrentOption = true;
        }
    }
    disableEnter(event) {
        if (13 === this.getCharCode(event))
            event.preventDefault();
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSvgRadiobuttonComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiSvgRadiobuttonComponent, selector: "sti-svg-radiobutton-component", inputs: { element: "element", id: "id", text: "text", state: "state", useCustomOption: "useCustomOption", tabIndex: "tabIndex" }, outputs: { buttonClick: "buttonClick" }, ngImport: i0, template: `
    <div
      class="custom-radio"
      *ngIf="!useCustomOption"
      (mousedown)="disableDrag($event)"
      (mouseup)="this.model.canDrag = true"
    >
      <input
        type="radio"
        name="radio +{{ element.name }}"
        id="{{ id }}"
        value=""
        [tabIndex]="tabIndex"
        [disabled]="element?.readOnly ? true : false"
        [required]="element?.required"
        [stiTooltip]="element?.tooltip"
        (click)="changeState()"
      />
      <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none">
        <circle
          class="box"
          cx="6"
          cy="6"
          r="5.5"
          [attr.fill]="backColor"
          [attr.stroke]="needToFill ? 'red' : borderColor"
        />
        <circle *ngIf="state" class="check" cx="6" cy="6" r="2.5" [attr.fill]="checkColor" />
      </svg>
      <sti-editable-content-component
        [style.display]="'flex'"
        [style.margin-left]="'5px'"
        [style.overflow]="'hidden'"
        [style.maxWidth]="'calc(100% - 17px)'"
        [eParent]="element"
        [editableContent]="text"
        [hideEmpty]="false"
        [active]="selected"
      ></sti-editable-content-component>
    </div>
    <div
      class="custom-radio other"
      *ngIf="useCustomOption"
      [style.width]="'100%'"
      [style.align-items]="'center'"
      (mousedown)="disableDrag($event)"
      (mouseup)="this.model.canDrag = true"
    >
      <input
        type="radio"
        name="radio +{{ element.name }}"
        id="{{ id }}"
        value=""
        [disabled]="element?.readOnly ? true : false"
        [required]="element?.required"
        [stiTooltip]="element?.tooltip"
        (mousedown)="changeState()"
      />
      <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none">
        <circle class="box" cx="6" cy="6" r="5.5" [attr.fill]="backColor" [attr.stroke]="borderColor" />
        <circle *ngIf="state" class="check" cx="6" cy="6" r="2.5" [attr.fill]="checkColor" />
      </svg>
      <div class="other-option-container" [style.maxWidth]="'calc(100% - 17px)'" [style]="textStyle">
        <span *ngIf="element?.prefix?.length > 0">
          {{ element?.prefix }}
        </span>
        <input
          type="text"
          [style.background-color]="backColor"
          [style.border-color]="borderColor"
          [style.maxWidth]="'100%'"
          [ngModel]="text"
          [tabIndex]="-1"
          (input)="getContent($event.target.value)"
          [style]="textStyle"
          (focus)="checkOption()"
          (blur)="isCurrentOption = false"
        />
        <span *ngIf="element?.suffix?.length > 0" [style.margin-left.px]="3">
          {{ element?.suffix }}
        </span>
      </div>
      <!-- <span
        for="{{ id }}"
        [attr.contenteditable]="true"
        [style.flex]="1"
        class="custom-option"
        [textContent]="text"
        [style.background-color]="backColor"
        [style.border-color]="borderColor"
        [style.-webkit-user-select]="isSafari ? 'text' : ''"
        (input)="!isMozila && !isSafari ? getContent($event.target.textContent) : ''"
        (blur)="isMozila || isSafari ? getContent($event.target.textContent) : ''"
        (keyup.enter)="isMozila || isSafari ? getContent($event.target.textContent) : ''"
        (keypress)="disableEnter($event)"
        [style]="textStyle"
        >{{ text }}</span
      > -->
    </div>
  `, isInline: true, styles: [".other-option-container{display:flex}.other-option-container span{align-self:center}input[type=radio]:hover+svg .box{stroke:#a3bde3!important;fill:#f3f9ff!important}input[type=radio]:active+svg .box{stroke:#3c77dd!important;fill:#d9ecff!important}input[type=radio]:disabled+svg .box{stroke:#bcbcbc!important;fill:#e6e6e6!important}input[type=text]{margin-left:5px;width:100%;outline:none;border:1px solid lightgray;padding:3px 5px}label,span{margin-left:5px}.box:hover:{stroke:#a3bde3!important}.custom-radio{width:100%;position:relative;align-items:center;display:flex}.custom-radio input[type=radio],.other input[type=radio]{position:absolute;width:14px;z-index:10;opacity:0;margin:0}.custom-option{border:1px solid lightgray;padding:3px 5px;z-index:11;white-space:nowrap;outline:none;overflow:hidden;scroll-behavior:smooth}.custom-option:hover{border-color:#a3bde3;cursor:text}.custom-option:focus{border-color:#a3bde3}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSvgRadiobuttonComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-svg-radiobutton-component", template: `
    <div
      class="custom-radio"
      *ngIf="!useCustomOption"
      (mousedown)="disableDrag($event)"
      (mouseup)="this.model.canDrag = true"
    >
      <input
        type="radio"
        name="radio +{{ element.name }}"
        id="{{ id }}"
        value=""
        [tabIndex]="tabIndex"
        [disabled]="element?.readOnly ? true : false"
        [required]="element?.required"
        [stiTooltip]="element?.tooltip"
        (click)="changeState()"
      />
      <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none">
        <circle
          class="box"
          cx="6"
          cy="6"
          r="5.5"
          [attr.fill]="backColor"
          [attr.stroke]="needToFill ? 'red' : borderColor"
        />
        <circle *ngIf="state" class="check" cx="6" cy="6" r="2.5" [attr.fill]="checkColor" />
      </svg>
      <sti-editable-content-component
        [style.display]="'flex'"
        [style.margin-left]="'5px'"
        [style.overflow]="'hidden'"
        [style.maxWidth]="'calc(100% - 17px)'"
        [eParent]="element"
        [editableContent]="text"
        [hideEmpty]="false"
        [active]="selected"
      ></sti-editable-content-component>
    </div>
    <div
      class="custom-radio other"
      *ngIf="useCustomOption"
      [style.width]="'100%'"
      [style.align-items]="'center'"
      (mousedown)="disableDrag($event)"
      (mouseup)="this.model.canDrag = true"
    >
      <input
        type="radio"
        name="radio +{{ element.name }}"
        id="{{ id }}"
        value=""
        [disabled]="element?.readOnly ? true : false"
        [required]="element?.required"
        [stiTooltip]="element?.tooltip"
        (mousedown)="changeState()"
      />
      <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none">
        <circle class="box" cx="6" cy="6" r="5.5" [attr.fill]="backColor" [attr.stroke]="borderColor" />
        <circle *ngIf="state" class="check" cx="6" cy="6" r="2.5" [attr.fill]="checkColor" />
      </svg>
      <div class="other-option-container" [style.maxWidth]="'calc(100% - 17px)'" [style]="textStyle">
        <span *ngIf="element?.prefix?.length > 0">
          {{ element?.prefix }}
        </span>
        <input
          type="text"
          [style.background-color]="backColor"
          [style.border-color]="borderColor"
          [style.maxWidth]="'100%'"
          [ngModel]="text"
          [tabIndex]="-1"
          (input)="getContent($event.target.value)"
          [style]="textStyle"
          (focus)="checkOption()"
          (blur)="isCurrentOption = false"
        />
        <span *ngIf="element?.suffix?.length > 0" [style.margin-left.px]="3">
          {{ element?.suffix }}
        </span>
      </div>
      <!-- <span
        for="{{ id }}"
        [attr.contenteditable]="true"
        [style.flex]="1"
        class="custom-option"
        [textContent]="text"
        [style.background-color]="backColor"
        [style.border-color]="borderColor"
        [style.-webkit-user-select]="isSafari ? 'text' : ''"
        (input)="!isMozila && !isSafari ? getContent($event.target.textContent) : ''"
        (blur)="isMozila || isSafari ? getContent($event.target.textContent) : ''"
        (keyup.enter)="isMozila || isSafari ? getContent($event.target.textContent) : ''"
        (keypress)="disableEnter($event)"
        [style]="textStyle"
        >{{ text }}</span
      > -->
    </div>
  `, styles: [".other-option-container{display:flex}.other-option-container span{align-self:center}input[type=radio]:hover+svg .box{stroke:#a3bde3!important;fill:#f3f9ff!important}input[type=radio]:active+svg .box{stroke:#3c77dd!important;fill:#d9ecff!important}input[type=radio]:disabled+svg .box{stroke:#bcbcbc!important;fill:#e6e6e6!important}input[type=text]{margin-left:5px;width:100%;outline:none;border:1px solid lightgray;padding:3px 5px}label,span{margin-left:5px}.box:hover:{stroke:#a3bde3!important}.custom-radio{width:100%;position:relative;align-items:center;display:flex}.custom-radio input[type=radio],.other input[type=radio]{position:absolute;width:14px;z-index:10;opacity:0;margin:0}.custom-option{border:1px solid lightgray;padding:3px 5px;z-index:11;white-space:nowrap;outline:none;overflow:hidden;scroll-behavior:smooth}.custom-option:hover{border-color:#a3bde3;cursor:text}.custom-option:focus{border-color:#a3bde3}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { element: [{
                type: Input
            }], id: [{
                type: Input
            }], text: [{
                type: Input
            }], state: [{
                type: Input
            }], useCustomOption: [{
                type: Input
            }], buttonClick: [{
                type: Output
            }], tabIndex: [{
                type: Input
            }] } });

class StiSingleSelectionComponent {
    constructor(model) {
        this.model = model;
        this.isClone = false;
    }
    get columns() {
        return (this.element.useCustomOption ? this.element.options.length + 1 : this.element.options.length) >
            this.element.columns
            ? new Array(Number(this.element.columns)).fill(3)
            : new Array(this.element.useCustomOption ? this.element.options.length + 1 : this.element.options.length).fill(1);
    }
    get rows() {
        return this.element.useCustomOption
            ? new Array(Math.ceil((this.element.options.length + 1) / Number(this.element.columns))).fill(2)
            : new Array(Math.ceil(this.element.options.length / Number(this.element.columns))).fill(2);
    }
    getColumns(rowIndex) {
        if ((this.element.useCustomOption ? this.element.options.length + 1 : this.element.options.length) -
            Number(this.element.columns) * rowIndex >=
            Number(this.element.columns)) {
            return new Array(Number(this.element.columns)).fill(3);
        }
        else {
            let count = (this.element.useCustomOption ? this.element.options.length + 1 : this.element.options.length) -
                Number(this.element.columns) * rowIndex;
            return new Array(Number(count)).fill(3);
        }
    }
    get align() {
        return "start";
    }
    disableDrag(event) {
        this.model.canDrag = false;
    }
    changeState(option) {
        this.element.selectedOption = option;
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSingleSelectionComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiSingleSelectionComponent, selector: "sti-singleselection-component", inputs: { element: "element", isClone: "isClone" }, ngImport: i0, template: ` <sti-component [element]="element" [isClone]="isClone" class="sti-single-selection">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element?.label"
      [style.align-self]="align"
      [style.text-align]="element?.getContentAlign()"
      [required]="element.required"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [style.width]="element?.getLabelWidth()"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'">
          <div class="table-container" [style.maxWidth.px]="element.maxWidth + 0.1">
            <table>
              <tr *ngFor="let row of rows; let i = index">
                <td
                  *ngFor="let column of getColumns(i); let idx = index"
                  [colSpan]="
                    element?.useCustomOption && i * element.columns + idx == element.options.length
                      ? element.columns - idx + 1
                      : 0
                  "
                  [style.width]="
                    element?.useCustomOption && i * element.columns + idx == element.options.length ? '100%' : ''
                  "
                  [style.padding-top.px]="(element?.useCustomOption && i == rows.length - 1) || i == 0 ? 0 : 3"
                  [style.padding-bottom.px]="
                    (element?.useCustomOption && i == rows.length - 1) || i == rows.length - 1 ? 0 : 3
                  "
                >
                  <sti-svg-radiobutton-component
                    *ngIf="element?.options[i * element.columns + idx] != null"
                    [element]="element"
                    [id]="element?.options[i * element.columns + idx] + i + element?.name"
                    [text]="element.optionsContentEditable[i * element.columns + idx]"
                    [tabIndex]="i == 0 && idx == 0 ? element['tabIndex'] : null"
                    [state]="
                      element?.options[i * element.columns + idx] == element?.selectedOption && element?.selectedOption
                    "
                    (buttonClick)="changeState(element?.options[i * element.columns + idx])"
                  ></sti-svg-radiobutton-component>
                  <sti-svg-radiobutton-component
                    *ngIf="element?.useCustomOption && i * element.columns + idx == element.options.length"
                    [element]="element"
                    [useCustomOption]="element?.useCustomOption"
                    [tabIndex]="i == 0 && idx == 0 ? element['tabIndex'] : null"
                    [id]="'SingleSelectionCustomOption'"
                    [text]="element?.customOptionText"
                    [state]="element?.customOptionText == element?.selectedOption"
                    (buttonClick)="changeState(element?.customOptionText)"
                    [style.width]="'100%'"
                  ></sti-svg-radiobutton-component>
                </td>
                <td [style.width]="'100%'" *ngIf="i != rows.length - 1 || (i == 0 && !element.useCustomOption)"></td>
              </tr>
            </table>
          </div>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, isInline: true, styles: [".table-container{overflow:hidden}table{width:100%;border-spacing:0;overflow:hidden}ul{width:100%;margin:0;padding:0;list-style:none;column-width:auto;column-gap:10px}li{margin-top:5px}.custom-radio{position:absolute;opacity:0;z-index:-1;left:0}tr{width:100%;max-width:inherit;height:max-content;padding:0;margin:0}td{max-width:inherit;height:100%;padding:0;margin:0}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }, { kind: "component", type: StiSvgRadiobuttonComponent, selector: "sti-svg-radiobutton-component", inputs: ["element", "id", "text", "state", "useCustomOption", "tabIndex"], outputs: ["buttonClick"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSingleSelectionComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-singleselection-component", template: ` <sti-component [element]="element" [isClone]="isClone" class="sti-single-selection">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element?.label"
      [style.align-self]="align"
      [style.text-align]="element?.getContentAlign()"
      [required]="element.required"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [style.width]="element?.getLabelWidth()"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'">
          <div class="table-container" [style.maxWidth.px]="element.maxWidth + 0.1">
            <table>
              <tr *ngFor="let row of rows; let i = index">
                <td
                  *ngFor="let column of getColumns(i); let idx = index"
                  [colSpan]="
                    element?.useCustomOption && i * element.columns + idx == element.options.length
                      ? element.columns - idx + 1
                      : 0
                  "
                  [style.width]="
                    element?.useCustomOption && i * element.columns + idx == element.options.length ? '100%' : ''
                  "
                  [style.padding-top.px]="(element?.useCustomOption && i == rows.length - 1) || i == 0 ? 0 : 3"
                  [style.padding-bottom.px]="
                    (element?.useCustomOption && i == rows.length - 1) || i == rows.length - 1 ? 0 : 3
                  "
                >
                  <sti-svg-radiobutton-component
                    *ngIf="element?.options[i * element.columns + idx] != null"
                    [element]="element"
                    [id]="element?.options[i * element.columns + idx] + i + element?.name"
                    [text]="element.optionsContentEditable[i * element.columns + idx]"
                    [tabIndex]="i == 0 && idx == 0 ? element['tabIndex'] : null"
                    [state]="
                      element?.options[i * element.columns + idx] == element?.selectedOption && element?.selectedOption
                    "
                    (buttonClick)="changeState(element?.options[i * element.columns + idx])"
                  ></sti-svg-radiobutton-component>
                  <sti-svg-radiobutton-component
                    *ngIf="element?.useCustomOption && i * element.columns + idx == element.options.length"
                    [element]="element"
                    [useCustomOption]="element?.useCustomOption"
                    [tabIndex]="i == 0 && idx == 0 ? element['tabIndex'] : null"
                    [id]="'SingleSelectionCustomOption'"
                    [text]="element?.customOptionText"
                    [state]="element?.customOptionText == element?.selectedOption"
                    (buttonClick)="changeState(element?.customOptionText)"
                    [style.width]="'100%'"
                  ></sti-svg-radiobutton-component>
                </td>
                <td [style.width]="'100%'" *ngIf="i != rows.length - 1 || (i == 0 && !element.useCustomOption)"></td>
              </tr>
            </table>
          </div>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, styles: [".table-container{overflow:hidden}table{width:100%;border-spacing:0;overflow:hidden}ul{width:100%;margin:0;padding:0;list-style:none;column-width:auto;column-gap:10px}li{margin-top:5px}.custom-radio{position:absolute;opacity:0;z-index:-1;left:0}tr{width:100%;max-width:inherit;height:max-content;padding:0;margin:0}td{max-width:inherit;height:100%;padding:0;margin:0}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { element: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiSvgCheckBoxComponent {
    constructor(model) {
        this.model = model;
        this.useCustomOption = false;
        this.disablePlaceHolder = false;
        this.buttonClick = new EventEmitter();
        this.isCurrentOption = false;
    }
    get selected() {
        return this.model.selectedComponent?.element == this.element;
    }
    get isMozila() {
        return this.model.getBrowserType() == "firefox" ? true : false;
    }
    get isSafari() {
        return this.model.getBrowserType() == "safari" ? true : false;
    }
    get isCheckBox() {
        return this.element instanceof StiCheckBoxElement;
    }
    get backColor() {
        return this.element.backgroundColor.toHtmlColor();
    }
    get checkColor() {
        if (this.element instanceof StiCheckBoxElement) {
            return this.element?.checkColor.toHtmlColor();
        }
        else if (this.element instanceof StiMultipleSelectionElement) {
            return this.element?.checkColor.toHtmlColor();
        }
        else if (this.element instanceof StiDateTimeBoxElement) {
            return "black";
        }
    }
    get borderColor() {
        return this.element.borderColor.toHtmlColor();
    }
    get required() {
        return this.element["required"];
    }
    get tooltip() {
        return this.element instanceof StiDateTimeBoxElement ? "" : this.element["tooltip"];
    }
    get textStyle() {
        if (this.element instanceof StiCheckBoxElement) {
            return this.element?.text.htmlStyle();
        }
        else if (this.element instanceof StiMultipleSelectionElement) {
            return this.element?.htmlStyle();
        }
    }
    get needToFill() {
        return (this.element.required &&
            (!this.element.value || this.element.value.length == 0) &&
            this.model.hasEmptyReuiredFields);
    }
    setContent(innerText) {
        this.text = innerText;
    }
    disableDrag(event) {
        this.model.canDrag = false;
    }
    changeState() {
        this.buttonClick.emit();
    }
    getContent(innerText) {
        if (this.isCurrentOption) {
            this.element.selectedOptions?.forEach((option) => {
                if (this.element.options?.indexOf(option) == -1) {
                    this.element.selectedOptions?.splice(this.element.selectedOptions.indexOf(option), 1);
                }
            });
            this.element.selectedOptions.push(innerText);
        }
        this.element["customOptionText"] = innerText;
    }
    getCharCode(event) {
        return null === event.which ? event.keyCode : !(0 === event.which || 0 === event.charCode) ? event.which : -1;
    }
    disableEnter(event) {
        if (13 === this.getCharCode(event))
            event.preventDefault();
    }
    checkOption() {
        if (this.element.selectedOptions.indexOf(this.element?.customOptionText) >= 0) {
            this.isCurrentOption = true;
        }
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSvgCheckBoxComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiSvgCheckBoxComponent, selector: "sti-svg-checkbox-component", inputs: { element: "element", id: "id", text: "text", state: "state", useCustomOption: "useCustomOption", disablePlaceHolder: "disablePlaceHolder", tabIndex: "tabIndex" }, outputs: { buttonClick: "buttonClick" }, ngImport: i0, template: `
    <div
      class="custom-checkbox"
      *ngIf="!useCustomOption"
      (mousedown)="disableDrag($event)"
      (mouseup)="model.canDrag = true"
    >
      <input
        type="checkbox"
        name=""
        id="{{ id }}"
        [disabled]="element?.readOnly ? true : false"
        [required]="required"
        [stiTooltip]="tooltip"
        [tabIndex]="tabIndex"
        tooltipPosition="bottom"
        showDelay="500"
        (click)="changeState()"
      />
      <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 18 16" fill="none">
        <rect
          class="box"
          x="0.5"
          y="15.5"
          width="16"
          height="16"
          transform="rotate(-90 0.5 15.5)"
          [attr.fill]="backColor"
          [attr.stroke]="needToFill ? 'red' : borderColor"
        />
        <path
          *ngIf="state"
          class="check"
          d="M5 7.23529L8.15 12L14 3"
          attr.stroke="{{ checkColor }}"
          fill="transparent"
          stroke-width="2"
          stroke-linecap="round"
          stroke-linejoin="round"
        />
      </svg>

      <sti-editable-content-component
        [style.display]="'flex'"
        [style.margin-left]="'5px'"
        [style.overflow]="'hidden'"
        [style.maxWidth]="'calc(100% - 19px)'"
        [eParent]="element"
        [editableContent]="text"
        [hideEmpty]="disablePlaceHolder"
        [active]="selected"
      ></sti-editable-content-component>
    </div>
    <div
      class="custom-checkbox other"
      *ngIf="useCustomOption"
      [style.width]="'100%'"
      [style.align-items]="'center'"
      (mousedown)="disableDrag($event)"
      (mouseup)="model.canDrag = true"
    >
      <input
        type="checkbox"
        name=""
        id="{{ id }}"
        [disabled]="element?.readOnly ? true : false"
        [required]="required"
        [stiTooltip]="tooltip"
        tooltipPosition="bottom"
        [tabIndex]="tabIndex"
        showDelay="500"
        (mousedown)="changeState()"
      />
      <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 18 16" fill="none">
        <rect
          class="box"
          x="0.5"
          y="15.5"
          width="16"
          height="16"
          transform="rotate(-90 0.5 15.5)"
          [attr.fill]="backColor"
          [attr.stroke]="borderColor"
        />
        <path
          *ngIf="state"
          class="check"
          d="M5 7.23529L8.15 12L14 3"
          attr.stroke="{{ checkColor }}"
          fill="transparent"
          stroke-width="2"
          stroke-linecap="round"
          stroke-linejoin="round"
        />
      </svg>
      <div class="other-option-container" [style.maxWidth]="'calc(100% - 19px)'" [style]="textStyle">
        <span *ngIf="element?.prefix?.length > 0">
          {{ element?.prefix }}
        </span>
        <input
          type="text"
          [style.background-color]="backColor"
          [style.border-color]="borderColor"
          [style.maxWidth]="'100%'"
          [ngModel]="text"
          [tabIndex]="-1"
          (input)="getContent($event.target.value)"
          (focus)="checkOption()"
          (blur)="isCurrentOption = false"
        />
        <span *ngIf="element?.suffix?.length > 0" [style.margin-left.px]="3">
          {{ element?.suffix }}
        </span>
      </div>

      <!--  <span
        for="{{ id }}"
        [attr.contenteditable]="true"
        [style.flex]="1"
        class="custom-option"
        [textContent]="text"
        [style.background-color]="backColor"
        [style.border-color]="borderColor"
        [style.-webkit-user-select]="isSafari ? 'text' : ''"
        (input)="!isMozila && !isSafari ? getContent($event.target.textContent) : ''"
        (blur)="isMozila || isSafari ? getContent($event.target.textContent) : ''"
        (keyup.enter)="isMozila || isSafari ? getContent($event.target.textContent) : ''"
        (keypress)="disableEnter($event)"
        [style]="textStyle"
        >{{ text }}</span
      > -->
    </div>
  `, isInline: true, styles: [".other-option-container{display:flex}.other-option-container span{align-self:center}input[type=checkbox]:hover+svg .box{stroke:#a3bde3!important;fill:#f3f9ff!important}input[type=checkbox]:active+svg .box{stroke:#3c77dd!important;fill:#d9ecff!important}input[type=checkbox]:disabled+svg .box{stroke:#bcbcbc!important;fill:#e6e6e6!important}input[type=text]{margin-left:5px;width:100%;outline:none;border:1px solid lightgray;padding:3px 5px}label{margin-left:5px;white-space:nowrap;outline:none;overflow:hidden;scroll-behavior:smooth}label:hover{cursor:text}span{margin-left:5px}.box:hover:{stroke:#a3bde3!important}.custom-checkbox{align-items:center;width:100%;position:relative;display:flex}.custom-checkbox input[type=checkbox],.other input[type=checkbox]{position:absolute;width:14px;z-index:10;opacity:0;margin:0}.custom-option{border:1px solid lightgray;padding:3px 5px;z-index:100;white-space:nowrap;outline:none;overflow:hidden;scroll-behavior:smooth}.custom-option:hover{border-color:#a3bde3;cursor:text}.custom-option:focus{border-color:#a3bde3}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSvgCheckBoxComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-svg-checkbox-component", template: `
    <div
      class="custom-checkbox"
      *ngIf="!useCustomOption"
      (mousedown)="disableDrag($event)"
      (mouseup)="model.canDrag = true"
    >
      <input
        type="checkbox"
        name=""
        id="{{ id }}"
        [disabled]="element?.readOnly ? true : false"
        [required]="required"
        [stiTooltip]="tooltip"
        [tabIndex]="tabIndex"
        tooltipPosition="bottom"
        showDelay="500"
        (click)="changeState()"
      />
      <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 18 16" fill="none">
        <rect
          class="box"
          x="0.5"
          y="15.5"
          width="16"
          height="16"
          transform="rotate(-90 0.5 15.5)"
          [attr.fill]="backColor"
          [attr.stroke]="needToFill ? 'red' : borderColor"
        />
        <path
          *ngIf="state"
          class="check"
          d="M5 7.23529L8.15 12L14 3"
          attr.stroke="{{ checkColor }}"
          fill="transparent"
          stroke-width="2"
          stroke-linecap="round"
          stroke-linejoin="round"
        />
      </svg>

      <sti-editable-content-component
        [style.display]="'flex'"
        [style.margin-left]="'5px'"
        [style.overflow]="'hidden'"
        [style.maxWidth]="'calc(100% - 19px)'"
        [eParent]="element"
        [editableContent]="text"
        [hideEmpty]="disablePlaceHolder"
        [active]="selected"
      ></sti-editable-content-component>
    </div>
    <div
      class="custom-checkbox other"
      *ngIf="useCustomOption"
      [style.width]="'100%'"
      [style.align-items]="'center'"
      (mousedown)="disableDrag($event)"
      (mouseup)="model.canDrag = true"
    >
      <input
        type="checkbox"
        name=""
        id="{{ id }}"
        [disabled]="element?.readOnly ? true : false"
        [required]="required"
        [stiTooltip]="tooltip"
        tooltipPosition="bottom"
        [tabIndex]="tabIndex"
        showDelay="500"
        (mousedown)="changeState()"
      />
      <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 18 16" fill="none">
        <rect
          class="box"
          x="0.5"
          y="15.5"
          width="16"
          height="16"
          transform="rotate(-90 0.5 15.5)"
          [attr.fill]="backColor"
          [attr.stroke]="borderColor"
        />
        <path
          *ngIf="state"
          class="check"
          d="M5 7.23529L8.15 12L14 3"
          attr.stroke="{{ checkColor }}"
          fill="transparent"
          stroke-width="2"
          stroke-linecap="round"
          stroke-linejoin="round"
        />
      </svg>
      <div class="other-option-container" [style.maxWidth]="'calc(100% - 19px)'" [style]="textStyle">
        <span *ngIf="element?.prefix?.length > 0">
          {{ element?.prefix }}
        </span>
        <input
          type="text"
          [style.background-color]="backColor"
          [style.border-color]="borderColor"
          [style.maxWidth]="'100%'"
          [ngModel]="text"
          [tabIndex]="-1"
          (input)="getContent($event.target.value)"
          (focus)="checkOption()"
          (blur)="isCurrentOption = false"
        />
        <span *ngIf="element?.suffix?.length > 0" [style.margin-left.px]="3">
          {{ element?.suffix }}
        </span>
      </div>

      <!--  <span
        for="{{ id }}"
        [attr.contenteditable]="true"
        [style.flex]="1"
        class="custom-option"
        [textContent]="text"
        [style.background-color]="backColor"
        [style.border-color]="borderColor"
        [style.-webkit-user-select]="isSafari ? 'text' : ''"
        (input)="!isMozila && !isSafari ? getContent($event.target.textContent) : ''"
        (blur)="isMozila || isSafari ? getContent($event.target.textContent) : ''"
        (keyup.enter)="isMozila || isSafari ? getContent($event.target.textContent) : ''"
        (keypress)="disableEnter($event)"
        [style]="textStyle"
        >{{ text }}</span
      > -->
    </div>
  `, styles: [".other-option-container{display:flex}.other-option-container span{align-self:center}input[type=checkbox]:hover+svg .box{stroke:#a3bde3!important;fill:#f3f9ff!important}input[type=checkbox]:active+svg .box{stroke:#3c77dd!important;fill:#d9ecff!important}input[type=checkbox]:disabled+svg .box{stroke:#bcbcbc!important;fill:#e6e6e6!important}input[type=text]{margin-left:5px;width:100%;outline:none;border:1px solid lightgray;padding:3px 5px}label{margin-left:5px;white-space:nowrap;outline:none;overflow:hidden;scroll-behavior:smooth}label:hover{cursor:text}span{margin-left:5px}.box:hover:{stroke:#a3bde3!important}.custom-checkbox{align-items:center;width:100%;position:relative;display:flex}.custom-checkbox input[type=checkbox],.other input[type=checkbox]{position:absolute;width:14px;z-index:10;opacity:0;margin:0}.custom-option{border:1px solid lightgray;padding:3px 5px;z-index:100;white-space:nowrap;outline:none;overflow:hidden;scroll-behavior:smooth}.custom-option:hover{border-color:#a3bde3;cursor:text}.custom-option:focus{border-color:#a3bde3}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { element: [{
                type: Input
            }], id: [{
                type: Input
            }], text: [{
                type: Input
            }], state: [{
                type: Input
            }], useCustomOption: [{
                type: Input
            }], disablePlaceHolder: [{
                type: Input
            }], buttonClick: [{
                type: Output
            }], tabIndex: [{
                type: Input
            }] } });

class StiMultipleSelectionComponent {
    get columns() {
        return (this.element.useCustomOption ? this.element.options.length + 1 : this.element.options.length) >
            this.element.columns
            ? new Array(Number(this.element.columns)).fill(3)
            : new Array(this.element.useCustomOption ? this.element.options.length + 1 : this.element.options.length).fill(1);
    }
    get rows() {
        return this.element.useCustomOption
            ? new Array(Math.ceil((this.element.options.length + 1) / Number(this.element.columns))).fill(2)
            : new Array(Math.ceil(this.element.options.length / Number(this.element.columns))).fill(2);
    }
    getColumns(rowIndex) {
        if ((this.element.useCustomOption ? this.element.options.length + 1 : this.element.options.length) -
            Number(this.element.columns) * rowIndex >=
            Number(this.element.columns)) {
            return new Array(Number(this.element.columns)).fill(3);
        }
        else {
            let count = (this.element.useCustomOption ? this.element.options.length + 1 : this.element.options.length) -
                Number(this.element.columns) * rowIndex;
            return new Array(Number(count)).fill(3);
        }
    }
    get align() {
        return "start";
    }
    constructor(model) {
        this.model = model;
        this.isClone = false;
    }
    disableDrag(event) {
        this.model.canDrag = false;
    }
    changeState(option) {
        if (this.element.selectedOptions.indexOf(option) >= 0) {
            this.element.selectedOptions.splice(this.element.selectedOptions.indexOf(option), 1);
        }
        else {
            this.element.selectedOptions.push(option);
        }
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiMultipleSelectionComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiMultipleSelectionComponent, selector: "sti-multipleselection-component", inputs: { element: "element", isClone: "isClone" }, ngImport: i0, template: ` <sti-component [element]="element" [isClone]="isClone" class="sti-multiple-selection">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.align-self]="align"
      [style.text-align]="element?.getContentAlign()"
      [required]="element.required"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [style.width]="element?.getLabelWidth()"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'">
          <div class="table-container" [style.maxWidth.px]="element.maxWidth + 0.1">
            <table>
              <tr *ngFor="let row of rows; let i = index">
                <td
                  *ngFor="let column of getColumns(i); let idx = index"
                  [colSpan]="
                    element?.useCustomOption && i * element.columns + idx == element.options.length
                      ? element.columns - idx + 1
                      : 0
                  "
                  [style.width]="
                    element?.useCustomOption && i * element.columns + idx == element.options.length ? '100%' : ''
                  "
                  [style.padding-top.px]="(element?.useCustomOption && i == rows.length - 1) || i == 0 ? 0 : 3"
                  [style.padding-bottom.px]="
                    (element?.useCustomOption && i == rows.length - 1) || i == rows.length - 1 ? 0 : 3
                  "
                >
                  <sti-svg-checkbox-component
                    *ngIf="element?.options[i * element.columns + idx] != null"
                    [element]="element"
                    [id]="element?.options[i * element.columns + idx] + i + element?.name"
                    [text]="element.optionsContentEditable[i * element.columns + idx]"
                    [state]="element.selectedOptions.indexOf(element?.options[i * element.columns + idx]) >= 0"
                    [tabIndex]="i == 0 && idx == 0 ? element['tabIndex'] : null"
                    (buttonClick)="changeState(element?.options[i * element.columns + idx])"
                  ></sti-svg-checkbox-component>
                  <sti-svg-checkbox-component
                    *ngIf="element?.useCustomOption && i * element.columns + idx == element.options.length"
                    [element]="element"
                    [useCustomOption]="element?.useCustomOption"
                    [id]="'MultipleSelectionCustomOption'"
                    [tabIndex]="i == 0 && idx == 0 ? element['tabIndex'] : null"
                    [text]="element?.customOptionText"
                    [state]="element.selectedOptions.indexOf(element?.customOptionText) >= 0"
                    (buttonClick)="changeState(element?.customOptionText)"
                    [style.width]="'100%'"
                  ></sti-svg-checkbox-component>
                </td>
                <td [style.width]="'100%'" *ngIf="i != rows.length - 1 || (i == 0 && !element.useCustomOption)"></td>
              </tr>
            </table>
          </div>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, isInline: true, styles: [".table-container{overflow:hidden}table{width:100%;border-spacing:0;overflow:hidden}ul{width:100%;margin:0;padding:0;list-style:none;column-width:auto;column-gap:10px}li{margin-top:5px}tr{max-width:inherit;height:max-content;padding:0;margin:0}td{max-width:inherit;height:100%;padding:0;margin:0}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }, { kind: "component", type: StiSvgCheckBoxComponent, selector: "sti-svg-checkbox-component", inputs: ["element", "id", "text", "state", "useCustomOption", "disablePlaceHolder", "tabIndex"], outputs: ["buttonClick"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiMultipleSelectionComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-multipleselection-component", template: ` <sti-component [element]="element" [isClone]="isClone" class="sti-multiple-selection">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.align-self]="align"
      [style.text-align]="element?.getContentAlign()"
      [required]="element.required"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [style.width]="element?.getLabelWidth()"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'">
          <div class="table-container" [style.maxWidth.px]="element.maxWidth + 0.1">
            <table>
              <tr *ngFor="let row of rows; let i = index">
                <td
                  *ngFor="let column of getColumns(i); let idx = index"
                  [colSpan]="
                    element?.useCustomOption && i * element.columns + idx == element.options.length
                      ? element.columns - idx + 1
                      : 0
                  "
                  [style.width]="
                    element?.useCustomOption && i * element.columns + idx == element.options.length ? '100%' : ''
                  "
                  [style.padding-top.px]="(element?.useCustomOption && i == rows.length - 1) || i == 0 ? 0 : 3"
                  [style.padding-bottom.px]="
                    (element?.useCustomOption && i == rows.length - 1) || i == rows.length - 1 ? 0 : 3
                  "
                >
                  <sti-svg-checkbox-component
                    *ngIf="element?.options[i * element.columns + idx] != null"
                    [element]="element"
                    [id]="element?.options[i * element.columns + idx] + i + element?.name"
                    [text]="element.optionsContentEditable[i * element.columns + idx]"
                    [state]="element.selectedOptions.indexOf(element?.options[i * element.columns + idx]) >= 0"
                    [tabIndex]="i == 0 && idx == 0 ? element['tabIndex'] : null"
                    (buttonClick)="changeState(element?.options[i * element.columns + idx])"
                  ></sti-svg-checkbox-component>
                  <sti-svg-checkbox-component
                    *ngIf="element?.useCustomOption && i * element.columns + idx == element.options.length"
                    [element]="element"
                    [useCustomOption]="element?.useCustomOption"
                    [id]="'MultipleSelectionCustomOption'"
                    [tabIndex]="i == 0 && idx == 0 ? element['tabIndex'] : null"
                    [text]="element?.customOptionText"
                    [state]="element.selectedOptions.indexOf(element?.customOptionText) >= 0"
                    (buttonClick)="changeState(element?.customOptionText)"
                    [style.width]="'100%'"
                  ></sti-svg-checkbox-component>
                </td>
                <td [style.width]="'100%'" *ngIf="i != rows.length - 1 || (i == 0 && !element.useCustomOption)"></td>
              </tr>
            </table>
          </div>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, styles: [".table-container{overflow:hidden}table{width:100%;border-spacing:0;overflow:hidden}ul{width:100%;margin:0;padding:0;list-style:none;column-width:auto;column-gap:10px}li{margin-top:5px}tr{max-width:inherit;height:max-content;padding:0;margin:0}td{max-width:inherit;height:100%;padding:0;margin:0}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { element: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiCheckBoxComponent {
    get align() {
        return "start";
    }
    constructor(model) {
        this.model = model;
    }
    disableDrag(event) {
        this.model.canDrag = false;
    }
    changeState() {
        this.element.isChecked = !this.element.isChecked;
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiCheckBoxComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiCheckBoxComponent, selector: "sti-checkbox-component", inputs: { element: "element", isClone: "isClone" }, ngImport: i0, template: `
    <sti-component [element]="element" [isClone]="isClone" class="sti-check-box">
      <sti-editable-content-component
        *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
        [editableContent]="element.label"
        [style.align-self]="align"
        [style.text-align]="element?.getContentAlign()"
        [required]="element.required"
        [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
        [style.width]="element?.getLabelWidth()"
      ></sti-editable-content-component>
      <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
        <tr>
          <td
            *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
            [style.display]="'flex'"
            [style.height]="'100%'"
            [style.width]="element?.getLabelWidth()"
            [style.align-items]="element?.getVerticalAlignment()"
          >
            <sti-editable-content-component
              *ngIf="element?.label.value?.length > 0"
              [editableContent]="element?.label"
              [required]="element.required"
              [style.text-align]="element?.getContentAlign()"
              [style.width]="element?.getLabelWidth()"
              [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
            ></sti-editable-content-component>
          </td>
          <td [style.width]="'100%'" [style.maxWidth.px]="element.maxWidth + 1">
            <sti-svg-checkbox-component
              [element]="element"
              [tabIndex]="element['tabIndex']"
              [id]="element?.name"
              [text]="element?.text"
              [state]="element?.isChecked"
              (buttonClick)="changeState()"
            ></sti-svg-checkbox-component>
          </td>
        </tr>
        <tr *ngIf="element?.description.value?.length > 0">
          <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
          <td [style.maxWidth.px]="element.maxWidth + 1">
            <sti-editable-content-component
              *ngIf="element?.description.value?.length > 0"
              [editableContent]="element.description"
            >
            </sti-editable-content-component>
          </td>
        </tr>
      </table>
    </sti-component>
    <style>
      table {
        border-spacing: 0;
      }
      tr {
        height: max-content;
        padding: 0;
        margin: 0;
      }
      td {
        height: 100%;
        padding: 0;
        margin: 0;
      }
    </style>
  `, isInline: true, styles: ["\n      table {\n        border-spacing: 0;\n      }\n      tr {\n        height: max-content;\n        padding: 0;\n        margin: 0;\n      }\n      td {\n        height: 100%;\n        padding: 0;\n        margin: 0;\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }, { kind: "component", type: StiSvgCheckBoxComponent, selector: "sti-svg-checkbox-component", inputs: ["element", "id", "text", "state", "useCustomOption", "disablePlaceHolder", "tabIndex"], outputs: ["buttonClick"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiCheckBoxComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-checkbox-component",
                    template: `
    <sti-component [element]="element" [isClone]="isClone" class="sti-check-box">
      <sti-editable-content-component
        *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
        [editableContent]="element.label"
        [style.align-self]="align"
        [style.text-align]="element?.getContentAlign()"
        [required]="element.required"
        [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
        [style.width]="element?.getLabelWidth()"
      ></sti-editable-content-component>
      <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
        <tr>
          <td
            *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
            [style.display]="'flex'"
            [style.height]="'100%'"
            [style.width]="element?.getLabelWidth()"
            [style.align-items]="element?.getVerticalAlignment()"
          >
            <sti-editable-content-component
              *ngIf="element?.label.value?.length > 0"
              [editableContent]="element?.label"
              [required]="element.required"
              [style.text-align]="element?.getContentAlign()"
              [style.width]="element?.getLabelWidth()"
              [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
            ></sti-editable-content-component>
          </td>
          <td [style.width]="'100%'" [style.maxWidth.px]="element.maxWidth + 1">
            <sti-svg-checkbox-component
              [element]="element"
              [tabIndex]="element['tabIndex']"
              [id]="element?.name"
              [text]="element?.text"
              [state]="element?.isChecked"
              (buttonClick)="changeState()"
            ></sti-svg-checkbox-component>
          </td>
        </tr>
        <tr *ngIf="element?.description.value?.length > 0">
          <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
          <td [style.maxWidth.px]="element.maxWidth + 1">
            <sti-editable-content-component
              *ngIf="element?.description.value?.length > 0"
              [editableContent]="element.description"
            >
            </sti-editable-content-component>
          </td>
        </tr>
      </table>
    </sti-component>
    <style>
      table {
        border-spacing: 0;
      }
      tr {
        height: max-content;
        padding: 0;
        margin: 0;
      }
      td {
        height: 100%;
        padding: 0;
        margin: 0;
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { element: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiLineComponent {
    constructor(model) {
        this.model = model;
        this.isClone = false;
    }
    get verticalAlignment() {
        if (this.element.verticalAlignment == StiVerticalAlignment.Top) {
            return "start";
        }
        else if (this.element.verticalAlignment == StiVerticalAlignment.Bottom) {
            return "flex-end";
        }
        else {
            return "center";
        }
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiLineComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiLineComponent, selector: "sti-line-component", inputs: { element: "element", isClone: "isClone" }, ngImport: i0, template: ` <sti-component [element]="element" [isClone]="isClone" class="sti-line">
    <div class="line-container" [style.align-items]="verticalAlignment">
      <div class="line" [style.border-bottom]="element.toHtmlBorder()"></div>
    </div>
    <sti-editable-content-component
      *ngIf="element?.description.value?.length > 0"
      [editableContent]="element.description"
    >
    </sti-editable-content-component>
  </sti-component>`, isInline: true, styles: [".line-container{height:100%;width:100%;display:flex}.line{width:100%;margin:0;font-size:1px;height:1px;border-bottom:1px solid transparent}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiLineComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-line-component", template: ` <sti-component [element]="element" [isClone]="isClone" class="sti-line">
    <div class="line-container" [style.align-items]="verticalAlignment">
      <div class="line" [style.border-bottom]="element.toHtmlBorder()"></div>
    </div>
    <sti-editable-content-component
      *ngIf="element?.description.value?.length > 0"
      [editableContent]="element.description"
    >
    </sti-editable-content-component>
  </sti-component>`, styles: [".line-container{height:100%;width:100%;display:flex}.line{width:100%;margin:0;font-size:1px;height:1px;border-bottom:1px solid transparent}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { element: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiToolboxElement {
    constructor(caption, image, component, element, setForm) {
        this.caption = caption;
        this.image = image;
        this.component = component;
        this.element = element;
        this.setForm = setForm;
    }
}
class StiEvent {
    constructor(name, value) {
        this.name = name;
        this.value = value;
    }
}
class StiEditorProperty {
    constructor(type, property, label, tooltip) {
        this.type = type;
        this.property = property;
        this.label = label;
        this.tooltip = tooltip;
    }
}
class Item {
    constructor(name, caption, imageName, key, haveSubMenu, imageSizes, selected, type) {
        this.name = name;
        this.caption = caption;
        this.imageName = imageName;
        this.key = key;
        this.haveSubMenu = haveSubMenu;
        this.imageSizes = imageSizes;
        this.selected = selected;
        this.type = type;
    }
}
class MenuItem {
    constructor(name, caption, img, type, selected, imageSize, value, label, items, command) {
        this.name = name;
        this.caption = caption;
        this.img = img;
        this.type = type;
        this.selected = selected;
        this.imageSize = imageSize;
        this.value = value;
        this.label = label;
        this.items = items;
        this.command = command;
    }
}
class Menu {
    constructor(name, items, parent, type, state, menuEl, top, left, innerContent, width, height, menuStyleName, verticalItems, action, itemStyleName, value, sizeStyle) {
        this.name = name;
        this.items = items;
        this.parent = parent;
        this.type = type;
        this.state = state;
        this.menuEl = menuEl;
        this.top = top;
        this.left = left;
        this.innerContent = innerContent;
        this.width = width;
        this.height = height;
        this.menuStyleName = menuStyleName;
        this.verticalItems = verticalItems;
        this.action = action;
        this.itemStyleName = itemStyleName;
        this.value = value;
        this.sizeStyle = sizeStyle;
    }
}
class StiWebFormOptions {
    constructor() {
        this.saveMode = StiFormSaveMode.Automatic;
    }
}
class StiLocalizationObject {
}
class FormEvent {
    constructor(name, value) {
        this.name = name;
        this.value = value;
    }
}
class UsedFont {
    constructor(fontFamily, fontStyle, fontSize) {
        this.fontFamily = fontFamily;
        this.fontStyle = fontStyle;
        this.fontSize = fontSize;
    }
}
class StiUsedFontsList {
    constructor() {
        this.fonts = [];
    }
    add(fontFamily, fontStyle, fontSize) {
        if (!this.fonts.find((u) => u.fontFamily == fontFamily &&
            u.fontStyle.length == fontStyle.length &&
            u.fontStyle == fontStyle &&
            u.fontSize == fontSize)) {
            this.fonts.push({ fontFamily: fontFamily, fontStyle: fontStyle, fontSize: fontSize });
        }
    }
}
class StiInterfaceEvent {
    constructor(name, data) {
        this.name = name;
        this.data = data;
    }
}
class StiClipboardData {
    constructor(value, type, displayValue, clipboardId = "StiFormsClipboard") {
        this.value = value;
        this.type = type;
        this.displayValue = displayValue;
        this.clipboardId = clipboardId;
    }
}

class StiFontService {
    constructor(model, httpService) {
        this.model = model;
        this.httpService = httpService;
        this.signatureFontsLoaded = false;
        this.checkedFonts = new StiUsedFontsList();
        model.formEvents.subscribe((e) => {
            if (this.model.getBrowserType() != "firefox") {
                if (e.name == "SetForm") {
                    this.checkFonts();
                }
                else if (e.name == "UpdateFonts") {
                    this.updateFonts(e.value);
                }
            }
        });
    }
    loadFont(fonts) {
        if (fonts.length > 0) {
            fonts.forEach((font) => {
                this.checkedFonts.add(font.fontFamily, font.fontStyle, font.fontSize);
            });
            this.httpService
                .post(this.model.requestUrl, { action: "GetFonts", fonts: fonts }, "json", { showProgress: false })
                .subscribe((data) => {
                if (Array.isArray(data)) {
                    this.loadFontsToCss(data);
                }
            });
        }
    }
    loadSignatureFonts() {
        if (!this.signatureFontsLoaded) {
            this.signatureFontsLoaded = true;
            this.httpService
                .post(this.model.requestUrl, { action: "GetSignatureFonts" }, "json", { showProgress: false })
                .subscribe((data) => {
                if (Array.isArray(data)) {
                    this.loadFontsToCss(data);
                }
            });
        }
    }
    loadFontsToCss(data) {
        data.forEach((item) => {
            let style = document.createElement("style");
            let cssText = "@font-face {\r\n" +
                "font-family: '" + item.originalFontFamily + "';\r\n" +
                (item.originalFontWeight ? "font-weight: " + item.originalFontWeight + ";\r\n" : "") +
                (item.originalFontStyle ? "font-style: " + item.originalFontStyle + ";\r\n" : "") +
                "src: url(" + item.contentForCss + "); }";
            style.innerHTML = cssText;
            style.id = item.originalFontFamily;
            let head = document.getElementsByTagName("head")[0];
            head.appendChild(style);
        });
    }
    checkFonts() {
        let usedFonts = new StiUsedFontsList();
        this.model.form.pages.forEach((page) => {
            page.allElements.forEach((element) => {
                element.getUsedFonts(usedFonts);
            });
        });
        let forceLoad = document.fonts.check("12px Dummy font name");
        let fontsToLoad = usedFonts.fonts.filter((f) => this.checkedFonts.fonts.indexOf(f) == -1 &&
            (forceLoad || !document?.fonts.check(f.fontStyle + " " + f.fontSize + "px '" + f.fontFamily + "'")));
        this.loadFont(fontsToLoad);
    }
    updateFonts(font) {
        let isChecked = this.checkedFonts.fonts.find((f) => f.fontFamily == font.fontFamily && f.fontSize == font.fontSize && f.fontStyle == font.fontStyle);
        if (!isChecked &&
            !document?.fonts?.check((font?.fontStyle ? font?.fontStyle : "") +
                " " +
                (font?.fontSize ? font?.fontSize : 12) +
                "px '" +
                (font?.fontFamily ? font?.fontFamily : "Arial") +
                "'")) {
            let fontToLoad = [];
            fontToLoad.push(font);
            this.loadFont(fontToLoad);
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFontService, deps: [{ token: StiModelService }, { token: StiHttpClientService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFontService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFontService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHttpClientService }] });

class StiSignatureComponent {
    isDrawingMode() {
        if (this.isCurrentEditableSignature) {
            return this.signatureService.selectedMode == "Draw";
        }
        else {
            return this.element.currentSignatureMode == "Draw";
        }
    }
    get isAspectRatio() {
        if (this.isCurrentEditableSignature) {
            return (this.signatureService?.currentEditableImage?.aspectRatio && this.signatureService?.currentEditableImage?.stretch);
        }
        else {
            return this.element?.insertedImage?.aspectRatio && this.element?.insertedImage?.stretch;
        }
    }
    get align() {
        return "start";
    }
    get isCurrentEditableSignature() {
        return (this.signatureService?.currentEditableSignatureElement == this.element &&
            this.model.showSignatureEditor &&
            !this.element.readOnly &&
            !this.isClone);
    }
    getImageWidth(parentContainer) {
        if (this.isInitialized && parentContainer) {
            return this.isAspectRatio
                ? parentContainer.clientHeight > parentContainer.clientWidth
                    ? parentContainer.clientWidth
                    : parentContainer.clientHeight
                : parentContainer.clientWidth;
        }
        else {
            return 0;
        }
    }
    get cursor() {
        return this.signatureService.drawingMode
            ? `url(${this.model.getImage("signature.Brush.png")}) 8 ${16 * window.devicePixelRatio - 4 * window.devicePixelRatio}, auto`
            : "";
    }
    isOldVersion() {
        if (this.element.backgroundImage &&
            !this.element.insertedImage.loadedImage &&
            !this.element.drawedImage &&
            !this.element.insertedText.value &&
            !this.element.fullName &&
            !this.element.initials) {
            return true;
        }
        else
            return false;
    }
    getInsertedTextValue() {
        if (this.isCurrentEditableSignature) {
            return this.signatureService.selectedMode === "Draw" ? this.signatureService?.currentEditableText?.value : "";
        }
        else {
            return this.element.currentSignatureMode === "Draw" ? this.element?.insertedText?.value : "";
        }
    }
    getTypeTextValue() {
        if (this.isCurrentEditableSignature) {
            return this.signatureService.selectedMode === "Type"
                ? `${this.signatureService.currentEditableFullName} ${this.signatureService.currentEditableInitials}`
                : "";
        }
        else {
            return this.element.currentSignatureMode === "Type" ? `${this.element?.fullName} ${this.element?.initials}` : "";
        }
    }
    showSignatureEditor() {
        if (!this.isClone) {
            this.signatureService.currentSignatureElement = this.helper.clone(this.element);
            this.signatureService.currentEditableImage = this.signatureService.currentSignatureElement.insertedImage;
            this.signatureService.currentEditableText = this.signatureService.currentSignatureElement.insertedText;
            this.signatureService.currentCanvasContent = this.element.drawedImage;
            this.signatureService.currentEditableFullName = this.element.fullName;
            this.signatureService.currentEditableInitials = this.element.initials;
            this.signatureService.selectedMode = this.element.currentSignatureMode;
            this.signatureService.currentPreviewFont = this.element.specialFont;
            this.signatureService.currentEditableSignatureElement = this.element;
            this.model.showSignatureEditor = !this.model.showSignatureEditor;
        }
    }
    get canvasWidth() {
        if (this.isClone) {
            return 0;
        }
        else {
            if (this.element["label"]["alignment"] != StiLabelAlignment.Top && this.element["label"]["value"]) {
                return (this.element.width - this.element.label.width - this.element.padding.right - this.element.padding.left - 2);
            }
            else {
                return this.element.width - this.element.padding.right - this.element.padding.left;
            }
        }
    }
    get oldBackgroundImage() {
        return this.getUrlImage(this.element.backgroundImage);
    }
    get image() {
        return this.isCurrentEditableSignature && this.signatureService.selectedMode == "Draw"
            ? this.getUrlImage(this.signatureService?.currentEditableImage?.loadedImage)
            : this.isCurrentEditableSignature && this.signatureService.selectedMode == "Type"
                ? ""
                : this.getUrlImage(this.element?.insertedImage?.loadedImage);
    }
    get drawedImage() {
        return this.isCurrentEditableSignature && this.signatureService.selectedMode == "Draw"
            ? this.getUrlImage(this.signatureService?.currentCanvasContent)
            : this.isCurrentEditableSignature && this.signatureService.selectedMode == "Type"
                ? ""
                : this.getUrlImage(this.element?.drawedImage);
    }
    getUrlImage(image) {
        return image ? "url(" + image + ")" : null;
    }
    get alignment() {
        if (this.isCurrentEditableSignature) {
            if (this.signatureService.selectedMode == "Type") {
                return "start";
            }
            else {
                if (this.signatureService?.currentEditableText?.horizontalAlignment == StiHorizontalAlignment.Center) {
                    return "center";
                }
                else if (this.signatureService?.currentEditableText?.horizontalAlignment == StiHorizontalAlignment.Right) {
                    return "end";
                }
                else {
                    return "start";
                }
            }
        }
        else {
            if (this.element.currentSignatureMode == "Type") {
                return "start";
            }
            else {
                if (this.element?.insertedText?.horizontalAlignment == StiHorizontalAlignment.Center) {
                    return "center";
                }
                else if (this.element?.insertedText?.horizontalAlignment == StiHorizontalAlignment.Right) {
                    return "end";
                }
                else {
                    return "start";
                }
            }
        }
    }
    getHorizontalAlignment() {
        if (this.isCurrentEditableSignature) {
            if (this.signatureService?.currentEditableImage?.horizontalAlignment == StiHorizontalAlignment.Center) {
                return "center";
            }
            else if (this.signatureService?.currentEditableImage?.horizontalAlignment == StiHorizontalAlignment.Left) {
                return "start";
            }
            else {
                return "end";
            }
        }
        else {
            if (this.element?.insertedImage?.horizontalAlignment == StiHorizontalAlignment.Center) {
                return "center";
            }
            else if (this.element?.insertedImage?.horizontalAlignment == StiHorizontalAlignment.Left) {
                return "start";
            }
            else {
                return "end";
            }
        }
    }
    getBackgroundSize(container) {
        if (this.isCurrentEditableSignature) {
            if (!this.signatureService?.currentEditableImage?.loadedImage) {
                return;
            }
            if (this.signatureService?.currentEditableImage?.aspectRatio &&
                this.signatureService?.currentEditableImage?.stretch) {
                return "contain";
            }
            if (this.signatureService?.currentEditableImage?.stretch) {
                return `${container.offsetWidth}px ${container.offsetHeight}px`;
            }
            else {
                return `${this.signatureService?.currentEditableImage?.naturalWidth}px ${this.signatureService?.currentEditableImage?.naturalHeight}px`;
            }
        }
        else {
            if (!this.element?.insertedImage?.loadedImage) {
                return;
            }
            if (this.element?.insertedImage?.aspectRatio && this.element?.insertedImage?.stretch) {
                return "contain";
            }
            if (this.element?.insertedImage?.stretch) {
                return `${container.offsetWidth}px ${container.offsetHeight}px`;
            }
            else {
                return `${this.element?.insertedImage?.naturalWidth}px ${this.element?.insertedImage?.naturalHeight}px`;
            }
        }
    }
    getCanvasSize(container) {
        return `${container.offsetWidth}px ${container.offsetHeight}px`;
    }
    getBackgroundPosition() {
        if (this.isCurrentEditableSignature) {
            if (this.signatureService?.currentEditableImage?.stretch &&
                !this.signatureService?.currentEditableImage?.aspectRatio) {
                return `center`;
            }
            else {
                return `${this.signatureService.getVerticalPosition(this.signatureService?.currentEditableImage?.verticalAlignment)} ${this.signatureService.getHorizontalPosition(this.signatureService?.currentEditableImage?.horizontalAlignment)}`;
            }
        }
        else {
            if (this.element?.insertedImage?.stretch && !this.element?.insertedImage?.aspectRatio) {
                return `center`;
            }
            else {
                return `${this.signatureService.getVerticalPosition(this.element?.insertedImage?.verticalAlignment)} ${this.signatureService.getHorizontalPosition(this.element?.insertedImage?.horizontalAlignment)}`;
            }
        }
    }
    get canvasHeight() {
        if (this.isClone) {
            return 0;
        }
        else {
            if (this.element["label"]["alignment"] != StiLabelAlignment.Top) {
                return this.element.height - this.element.padding.top - this.element.padding.bottom;
            }
            else {
                return (this.element.height -
                    (this.labelRef?.offsetHeight ? this.labelRef?.offsetHeight : 0) -
                    this.element.padding.top -
                    this.element.padding.bottom -
                    (this.labelRef?.offsetHeight ? this.topMargin : 0));
            }
        }
    }
    constructor(model, mouse, resize, loc, signatureService, helper, fontService, cdr) {
        this.model = model;
        this.mouse = mouse;
        this.resize = resize;
        this.loc = loc;
        this.signatureService = signatureService;
        this.helper = helper;
        this.fontService = fontService;
        this.cdr = cdr;
        this.isClone = false;
        this.topMargin = 8;
        this.drawingMode = false;
        this.textMode = false;
        this.isDrawing = false;
        this.loadedImage = false;
        this.isInitialized = false;
    }
    ngOnDestroy() {
        this.mouseUpSubscription?.unsubscribe();
        this.buttonClickSubscribe?.unsubscribe();
        this.loadedImageSubscribe?.unsubscribe();
    }
    ngDoCheck() {
        this.labelRef = this.label ? this.label["elementRef"]["nativeElement"] : null;
    }
    isCanvasBlank(canvas) {
        const context = canvas.getContext("2d");
        const pixelBuffer = new Uint32Array(context.getImageData(0, 0, canvas.width, canvas.height).data.buffer);
        return !pixelBuffer.some((color) => color !== 0);
    }
    ngAfterViewInit() {
        if (!this.isClone) {
            this.element.element = this.sigPad;
            this.cdr.detectChanges();
            this.sigPadElement = this.sigPad?.nativeElement;
            if (this.element.backgroundImage && this.context) {
                // this.drawImage(this.element.backgroundImage);
            }
            setTimeout(() => {
                this.isInitialized = true;
            });
        }
    }
    ngOnInit() {
        this.resize.EndResizeSubj.subscribe(() => this.UpdateState());
        this.loadedImageSubscribe = this.signatureService.loadedImage.subscribe((any) => {
            if (this.element == this.model.selectedComponent?.element) {
                this.loadedImage = true;
                // this.drawImage(any);
            }
        });
        this.fontService.loadSignatureFonts();
    }
    UpdateState() {
        if (!this.isClone) {
            // this.drawImage(this.element.backgroundImage);
        }
    }
    relativeCoords(event) {
        const bounds = this.model.getPositionRelativeToForm(this.sigPad.nativeElement);
        const x = (event.clientX - bounds.left) / this.model.zoom;
        const y = (event.clientY - bounds.top) / this.model.zoom;
        return { x: x, y: y };
    }
    clear() {
        if (!this.isClone) {
            this.context.clearRect(0, 0, this.sigPadElement.width, this.sigPadElement.height);
            this.context.beginPath();
            this.element.backgroundImage = "";
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSignatureComponent, deps: [{ token: StiModelService }, { token: StiMouseService }, { token: StiComponentResizerService }, { token: StiLocalizationService }, { token: SignatureService }, { token: StiHelperService }, { token: StiFontService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiSignatureComponent, selector: "sti-signature-component", inputs: { element: "element", isClone: "isClone" }, viewQueries: [{ propertyName: "sigPad", first: true, predicate: ["sigPad"], descendants: true }, { propertyName: "ref", first: true, predicate: ["ref"], descendants: true }, { propertyName: "label", first: true, predicate: ["label"], descendants: true }], ngImport: i0, template: ` <sti-component
    [element]="element"
    [isClone]="isClone"
    class="sti-signature"
    (dblclick)="!model.previewMode ? showSignatureEditor() : ''"
    (click)="model.previewMode && !element.readOnly ? showSignatureEditor() : ''"
  >
    <div class="component-container" #previewContainer>
      <div
        class="signature-image-container"
        *ngIf="isOldVersion() && !isCurrentEditableSignature"
        [style.justify-content]="getHorizontalAlignment()"
      >
        <div
          class="signature-image"
          [style.background-image]="oldBackgroundImage"
          [style.background-position]="'center'"
          [style.background-size]="'contain'"
          [style.background-repeat]="'no-repeat'"
        ></div>
      </div>
      <div class="inserted-image-container" [style.justify-content]="getHorizontalAlignment()">
        <div
          class="preview-inserted-image"
          *ngIf="isDrawingMode()"
          [style.width.px]="getImageWidth(previewContainer)"
          [style.height.px]="previewContainer.clientHeight"
          [style.background-image]="image"
          [style.background-position]="getBackgroundPosition()"
          [style.background-size]="getBackgroundSize(previewContainer)"
          [style.background-repeat]="image ? 'no-repeat' : ''"
        ></div>
        <div
          *ngIf="isDrawingMode()"
          class="preview-drawed-image"
          [style.background-size]="'contain'"
          [style.background-image]="drawedImage"
        ></div>
      </div>
      <div
        class="preview-inserted-text"
        [style]="
          isCurrentEditableSignature
            ? signatureService?.currentEditableText?.htmlStyle()
            : element?.insertedText?.htmlStyle()
        "
        [style.justify-content]="alignment"
      >
        <span>{{ getInsertedTextValue() }}</span>
      </div>
      <div class="signature-content">
        <div
          class="preview-inserted-type-text"
          [style.font-family]="isCurrentEditableSignature ? signatureService.currentPreviewFont : element.specialFont"
          [style.font-size]="'16pt'"
          [style.justify-content]="alignment"
        >
          <span #sigPad>{{ getTypeTextValue() }}</span>
        </div>
      </div>
      <div class="signature-description" [style]="element?.description?.htmlStyle()">
        <sti-editable-content-component
          *ngIf="element?.description.value?.length > 0"
          [editableContent]="element.description"
        >
        </sti-editable-content-component>
      </div>
    </div>
  </sti-component>`, isInline: true, styles: [".signature-image,.preview-inserted-image{position:absolute;height:100%;width:100%}.preview-inserted-type-text{height:100%;width:100%;display:flex;align-items:flex-end;overflow:hidden;white-space:nowrap}.preview-inserted-text{position:absolute;width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;white-space:nowrap}.signature-description{width:calc(100% - 10px);height:50px;margin:0 5px;padding:0 5px;border-top:1px solid lightgray;display:flex;align-items:center;overflow:hidden;z-index:100}.signature-content{z-index:9999;height:100%;width:100%}.preview-drawed-image{position:absolute;width:100%;height:100%;background-position:center;background-repeat:no-repeat;z-index:100}.signature-image-container{position:absolute;left:0;top:0;display:flex;height:100%;width:100%;z-index:999}.inserted-image-container{position:absolute;left:0;top:0;display:flex;height:100%;width:100%}.component-container{width:100%;height:100%;display:flex;flex-direction:column;position:relative}table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}.canvas{position:relative;cursor:inherit}.text-preview:focus{outline:none}.text-preview{position:absolute;white-space:nowrap;display:flex;align-items:center;justify-content:center;text-align:center;width:100%;height:100%;overflow-x:hidden;z-index:100;font-size:28px;cursor:text}input{visibility:hidden;width:0px}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSignatureComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-signature-component", template: ` <sti-component
    [element]="element"
    [isClone]="isClone"
    class="sti-signature"
    (dblclick)="!model.previewMode ? showSignatureEditor() : ''"
    (click)="model.previewMode && !element.readOnly ? showSignatureEditor() : ''"
  >
    <div class="component-container" #previewContainer>
      <div
        class="signature-image-container"
        *ngIf="isOldVersion() && !isCurrentEditableSignature"
        [style.justify-content]="getHorizontalAlignment()"
      >
        <div
          class="signature-image"
          [style.background-image]="oldBackgroundImage"
          [style.background-position]="'center'"
          [style.background-size]="'contain'"
          [style.background-repeat]="'no-repeat'"
        ></div>
      </div>
      <div class="inserted-image-container" [style.justify-content]="getHorizontalAlignment()">
        <div
          class="preview-inserted-image"
          *ngIf="isDrawingMode()"
          [style.width.px]="getImageWidth(previewContainer)"
          [style.height.px]="previewContainer.clientHeight"
          [style.background-image]="image"
          [style.background-position]="getBackgroundPosition()"
          [style.background-size]="getBackgroundSize(previewContainer)"
          [style.background-repeat]="image ? 'no-repeat' : ''"
        ></div>
        <div
          *ngIf="isDrawingMode()"
          class="preview-drawed-image"
          [style.background-size]="'contain'"
          [style.background-image]="drawedImage"
        ></div>
      </div>
      <div
        class="preview-inserted-text"
        [style]="
          isCurrentEditableSignature
            ? signatureService?.currentEditableText?.htmlStyle()
            : element?.insertedText?.htmlStyle()
        "
        [style.justify-content]="alignment"
      >
        <span>{{ getInsertedTextValue() }}</span>
      </div>
      <div class="signature-content">
        <div
          class="preview-inserted-type-text"
          [style.font-family]="isCurrentEditableSignature ? signatureService.currentPreviewFont : element.specialFont"
          [style.font-size]="'16pt'"
          [style.justify-content]="alignment"
        >
          <span #sigPad>{{ getTypeTextValue() }}</span>
        </div>
      </div>
      <div class="signature-description" [style]="element?.description?.htmlStyle()">
        <sti-editable-content-component
          *ngIf="element?.description.value?.length > 0"
          [editableContent]="element.description"
        >
        </sti-editable-content-component>
      </div>
    </div>
  </sti-component>`, styles: [".signature-image,.preview-inserted-image{position:absolute;height:100%;width:100%}.preview-inserted-type-text{height:100%;width:100%;display:flex;align-items:flex-end;overflow:hidden;white-space:nowrap}.preview-inserted-text{position:absolute;width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;white-space:nowrap}.signature-description{width:calc(100% - 10px);height:50px;margin:0 5px;padding:0 5px;border-top:1px solid lightgray;display:flex;align-items:center;overflow:hidden;z-index:100}.signature-content{z-index:9999;height:100%;width:100%}.preview-drawed-image{position:absolute;width:100%;height:100%;background-position:center;background-repeat:no-repeat;z-index:100}.signature-image-container{position:absolute;left:0;top:0;display:flex;height:100%;width:100%;z-index:999}.inserted-image-container{position:absolute;left:0;top:0;display:flex;height:100%;width:100%}.component-container{width:100%;height:100%;display:flex;flex-direction:column;position:relative}table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}.canvas{position:relative;cursor:inherit}.text-preview:focus{outline:none}.text-preview{position:absolute;white-space:nowrap;display:flex;align-items:center;justify-content:center;text-align:center;width:100%;height:100%;overflow-x:hidden;z-index:100;font-size:28px;cursor:text}input{visibility:hidden;width:0px}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiMouseService }, { type: StiComponentResizerService }, { type: StiLocalizationService }, { type: SignatureService }, { type: StiHelperService }, { type: StiFontService }, { type: i0.ChangeDetectorRef }], propDecorators: { element: [{
                type: Input
            }], isClone: [{
                type: Input
            }], sigPad: [{
                type: ViewChild,
                args: ["sigPad"]
            }], ref: [{
                type: ViewChild,
                args: ["ref"]
            }], label: [{
                type: ViewChild,
                args: ["label"]
            }] } });

class StiDateTimeBoxComponent {
    get isCurrent() {
        return this.element.initialState == StiDateTimeBoxValueChoise.Current;
    }
    get isReadOnly() {
        return this.element.readOnly;
    }
    get needToFill() {
        return (this.element.required &&
            (this.element.allowNull ? !this.element.dateTimeValueIsNotNull : !this.element.value) &&
            this.model.hasEmptyReuiredFields);
    }
    get align() {
        return "start";
    }
    get isMozila() {
        return this.model.getBrowserType() == "firefox" ? true : false;
    }
    get horizontalAlignment() {
        if (this.element.contentAlignment == StiHorizontalAlignment.Left) {
            return "start";
        }
        else if (this.element.contentAlignment == StiHorizontalAlignment.Right) {
            return "flex-end";
        }
        else {
            return "center";
        }
    }
    get format() {
        return this.element.valueType == StiDateTimeBoxType.Date
            ? this.element.dateFormat
            : this.element.valueType == StiDateTimeBoxType.Time
                ? this.element.timeFormat
                : this.element.dateTimeFormat;
    }
    getValue() {
        return this.element.dateValueString;
    }
    parseDate(value) {
        if (value.length > 0) {
            this.element.dateValue = new Date(value);
            this.model.formEvents.next({ name: "ValueChanged" });
        }
    }
    formattingDate(dateFormat) {
        let result = dateFormat
            .replace(/M/g, "k")
            .replace(/m/g, "r")
            .replace(/tt/g, "a")
            .replace(/k/g, "m")
            .replace(/r/g, "M");
        return result;
    }
    changeState() {
        this.element.dateTimeValueIsNotNull = !this.element.dateTimeValueIsNotNull;
    }
    borderWidth() {
        return `${this.element.borderWeight}px`;
    }
    inFocus() {
        setTimeout(() => {
            let editableContent = new StiInputTextItem("", this.element.font, this.element.textColor, this.element.backgroundColor, this.element.contentAlignment);
            editableContent.element = this.element;
            this.editableService.editableContent = editableContent;
            this.editableService.usedElement = this.element;
        }, 0);
    }
    constructor(model, editableService) {
        this.model = model;
        this.editableService = editableService;
        this.isClone = false;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDateTimeBoxComponent, deps: [{ token: StiModelService }, { token: StiEditableContentService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiDateTimeBoxComponent, selector: "sti-datetimebox-component", inputs: { element: "element", isClone: "isClone" }, viewQueries: [{ propertyName: "inputDate", first: true, predicate: ["inputDate"], descendants: true }], ngImport: i0, template: ` <sti-component [element]="element" [isClone]="isClone" class="sti-date-time-box">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.align-self]="align"
      [style.text-align]="element?.getContentAlign()"
      [required]="element.required"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [style.width]="element?.getLabelWidth()"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'" [style.position]="'relative'">
          <div
            class="date-time-box-container"
            [style.align-self]="align"
            [stiTooltip]="element?.tooltip"
            tooltipPosition="bottom"
            showDelay="500"
            [style]="element?.htmlStyle()"
            [style.justify-content]="horizontalAlignment"
            [style.border-color]="needToFill ? 'red' : element?.borderColor.toHtmlColor()"
            [style.background-color]="this.element.backgroundColor.toHtmlColor()"
            [style.border-width]="borderWidth()"
            (click)="inFocus(); inputDate.click()"
          >
            <sti-svg-checkbox-component
              *ngIf="element.allowNull && !model.previewMode"
              [style.margin-top.px]="margin"
              [style.align-self]="align"
              [style.margin-block]="'auto'"
              [element]="element"
              [id]="element?.name"
              [text]=""
              [state]="element?.dateTimeValueIsNotNull"
              [disablePlaceHolder]="true"
              (buttonClick)="changeState()"
            ></sti-svg-checkbox-component>
            <span
              [style.width]="'100%'"
              [style.opacity]="!element.dateTimeValueIsNotNull && element.allowNull ? 0 : 1"
              [style.pointer-events]="!element.dateTimeValueIsNotNull && element.allowNull ? 'none' : ''"
              [style.color]="this.element.textColor.toHtmlColor()"
              (click)="inputDate.click()"
              >{{getValue()}}</span
            >
            <div
              class="date-picker"
              [style.pointer-events]="!element.dateTimeValueIsNotNull && element.allowNull ? 'none' : ''"
              [style.opacity]="!element.dateTimeValueIsNotNull && element.allowNull ? 0 : 1"
              *ngIf="!isReadOnly"
            >
              <label [style.display]="'flex'" [style.align-items]="'center'" [style.justify-content]="'center'"
                ><i class="pi pi-chevron-down"></i
              ></label>
            </div>
            <input
              #inputDate
              [style.left.px]="element.allowNull ? 20 : 0"
              [type]="isMozila ? 'date' : 'datetime-local'"
              (input)="parseDate($event.target.value)"
              [tabIndex]="element['tabIndex']"
              [disabled]="element.readOnly && model.previewMode"
              (select)="inputDate.click()"
            />
          </div>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, isInline: true, styles: [".date-time-box-container{align-items:center;padding:3px 4px;display:flex;width:100%;border:1px solid transparent}.date-time-box-container:hover{border-color:#a3bde3!important}input{opacity:0;position:absolute;left:0;top:0;width:100%;height:100%}input::-webkit-datetime-edit{display:none}input::-webkit-calendar-picker-indicator{cursor:pointer;width:100%}.date-picker{background-color:transparent;width:16px;position:relative;height:16px;display:flex;align-items:center;justify-content:center;margin-left:4px;padding-right:1px}i{color:#d3d3d3}.pi-chevron-down{font-size:.575rem;font-weight:700;color:#c5c5c5;padding-top:1px}img{vertical-align:middle;margin-left:0;height:16px;width:16px}table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }, { kind: "component", type: StiSvgCheckBoxComponent, selector: "sti-svg-checkbox-component", inputs: ["element", "id", "text", "state", "useCustomOption", "disablePlaceHolder", "tabIndex"], outputs: ["buttonClick"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDateTimeBoxComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-datetimebox-component", template: ` <sti-component [element]="element" [isClone]="isClone" class="sti-date-time-box">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.align-self]="align"
      [style.text-align]="element?.getContentAlign()"
      [required]="element.required"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [style.width]="element?.getLabelWidth()"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'" [style.position]="'relative'">
          <div
            class="date-time-box-container"
            [style.align-self]="align"
            [stiTooltip]="element?.tooltip"
            tooltipPosition="bottom"
            showDelay="500"
            [style]="element?.htmlStyle()"
            [style.justify-content]="horizontalAlignment"
            [style.border-color]="needToFill ? 'red' : element?.borderColor.toHtmlColor()"
            [style.background-color]="this.element.backgroundColor.toHtmlColor()"
            [style.border-width]="borderWidth()"
            (click)="inFocus(); inputDate.click()"
          >
            <sti-svg-checkbox-component
              *ngIf="element.allowNull && !model.previewMode"
              [style.margin-top.px]="margin"
              [style.align-self]="align"
              [style.margin-block]="'auto'"
              [element]="element"
              [id]="element?.name"
              [text]=""
              [state]="element?.dateTimeValueIsNotNull"
              [disablePlaceHolder]="true"
              (buttonClick)="changeState()"
            ></sti-svg-checkbox-component>
            <span
              [style.width]="'100%'"
              [style.opacity]="!element.dateTimeValueIsNotNull && element.allowNull ? 0 : 1"
              [style.pointer-events]="!element.dateTimeValueIsNotNull && element.allowNull ? 'none' : ''"
              [style.color]="this.element.textColor.toHtmlColor()"
              (click)="inputDate.click()"
              >{{getValue()}}</span
            >
            <div
              class="date-picker"
              [style.pointer-events]="!element.dateTimeValueIsNotNull && element.allowNull ? 'none' : ''"
              [style.opacity]="!element.dateTimeValueIsNotNull && element.allowNull ? 0 : 1"
              *ngIf="!isReadOnly"
            >
              <label [style.display]="'flex'" [style.align-items]="'center'" [style.justify-content]="'center'"
                ><i class="pi pi-chevron-down"></i
              ></label>
            </div>
            <input
              #inputDate
              [style.left.px]="element.allowNull ? 20 : 0"
              [type]="isMozila ? 'date' : 'datetime-local'"
              (input)="parseDate($event.target.value)"
              [tabIndex]="element['tabIndex']"
              [disabled]="element.readOnly && model.previewMode"
              (select)="inputDate.click()"
            />
          </div>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, styles: [".date-time-box-container{align-items:center;padding:3px 4px;display:flex;width:100%;border:1px solid transparent}.date-time-box-container:hover{border-color:#a3bde3!important}input{opacity:0;position:absolute;left:0;top:0;width:100%;height:100%}input::-webkit-datetime-edit{display:none}input::-webkit-calendar-picker-indicator{cursor:pointer;width:100%}.date-picker{background-color:transparent;width:16px;position:relative;height:16px;display:flex;align-items:center;justify-content:center;margin-left:4px;padding-right:1px}i{color:#d3d3d3}.pi-chevron-down{font-size:.575rem;font-weight:700;color:#c5c5c5;padding-top:1px}img{vertical-align:middle;margin-left:0;height:16px;width:16px}table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiEditableContentService }], propDecorators: { inputDate: [{
                type: ViewChild,
                args: ["inputDate"]
            }], element: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiColumnDraggableService {
    constructor(model, mouseService, httpService) {
        this.model = model;
        this.mouseService = mouseService;
        this.httpService = httpService;
        this.isDragging = false;
        this.cursor = "";
        this.canDrop = false;
        this.fromTable = false;
        this._insertIndex = -1;
        this.headerClicked = false;
        mouseService.getDocumentMouseMove().subscribe((event) => {
            this.mouseMove(event);
        });
        mouseService.getDocumentMouseUp().subscribe((event) => {
            this.endDrag();
        });
    }
    mouseMove(event) {
        if (this.headerClicked) {
            if (!this.isDragging &&
                Math.max(Math.abs(this.mouseDownX - event.clientX), Math.abs(this.mouseDownY - event.clientY)) >
                    StiDraggableService.MOUSE_DELTA) {
                this.isDragging = true;
            }
            else if (this.isDragging) {
                this.left = event.clientX - this.startX + "px";
                this.top = event.clientY - this.startY + "px";
                this.getIndexOfBottomItem(event);
                this.canDrop ? (this.model.cursor = "copy") : (this.model.cursor = "not-allowed");
                //
            }
        }
    }
    endDrag() {
        if (this.isDragging) {
            if (this._insertIndex > this.items.indexOf(this.item)) {
                this._insertIndex--;
            }
            this.items["stopFit"] = true;
            this.items.splice(this.items.indexOf(this.item), 1);
            this.items.splice(this._insertIndex, 0, this.item);
            this.items["stopFit"] = false;
        }
        this.isDragging = false;
        this.fromTable = false;
        this.parentElement = null;
        this.canDrop = false;
        this.headerClicked = false;
        this.model.cursor = "default";
    }
    onHeaderClick(event, item, items, fromTable, parentElement) {
        this.mouseDownX = event.clientX;
        this.mouseDownY = event.clientY;
        this._item = item;
        this.items = items;
        this.itemLabel = item.label ?? item.header;
        this.headerClicked = true;
        if (fromTable) {
            this.startX = event.offsetX;
            this.startY = event.offsetY;
        }
        this._insertIndex = items.indexOf(item);
        this.headerRect = this.model.getPositionRelativeToForm(event.currentTarget);
        if (fromTable) {
            this.fromTable = true;
            this.parentElement = parentElement;
        }
    }
    getIndexOfBottomItem(event) {
        let index;
        let elements = document.elementsFromPoint(event.clientX, event.clientY);
        this.canDrop = false;
        if (this.fromTable) {
            elements.forEach((element) => {
                if (element?.classList.contains("column-drop-area")) {
                    this.canDrop = true;
                }
            });
        }
        else {
            elements.forEach((element) => {
                if (element?.classList.contains("drop-area")) {
                    this.canDrop = true;
                }
            });
        }
    }
    get insertIndex() {
        return this.isDragging ? this._insertIndex : -1;
    }
    set insertIndex(value) {
        this._insertIndex = value;
    }
    get item() {
        return this.isDragging ? this._item : null;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiColumnDraggableService, deps: [{ token: StiModelService }, { token: StiMouseService }, { token: StiHttpClientService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiColumnDraggableService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiColumnDraggableService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiMouseService }, { type: StiHttpClientService }] });

class StiTableTotalsFieldComponent {
    get showResizePreview() {
        return this.object instanceof StiTableElement &&
            !this.object.gridLines.drawVertical &&
            this.model.selectedComponent.element == this.object
            ? true
            : false;
    }
    showPropertyInfo(field) {
        setTimeout(() => {
            if (this.model.selectedComponent?.element instanceof StiTableElement &&
                !this.model.selectedComponent?.element.showTotalsEditor) {
                this.model.selectedComponent.element.showTotalsEditor = true;
                this.model.needToRefresh.next(true);
            }
            setTimeout(() => {
                if (this.model.selectedComponent?.element instanceof StiTableElement) {
                    let index = this.model.selectedComponent.element.totalsFields.findIndex((column) => column == field);
                    this.model.currentContentEditableItem.next(index);
                }
            }, 0);
        }, 0);
    }
    getAlignment(value) {
        if (value == StiHorizontalAlignment.Left) {
            return "flex-start";
        }
        else if (value == StiHorizontalAlignment.Right) {
            return "flex-end";
        }
        else {
            return "center";
        }
    }
    get selected() {
        return this.model.selectedComponent?.element == this.object;
    }
    getValue(field) {
        let value = this.model.getFormattedValue(field, field.value);
        return `${field.prefix}${value != null && value != undefined ? value : ""}${field.suffix}`;
    }
    initResize(event, columnType) {
        event.stopPropagation();
        this.isResizing = true;
        this.startPoint = event.clientX;
        this.currentColumnType = columnType;
        if (columnType == "totalHeader") {
            this.startColumnWidth = this.object.totalsHeadersWidth;
            let tableWidth = this.object.label.alignment == StiLabelAlignment.Top || this.object.label.value.length == 0
                ? this.object.width - this.object.padding.left - this.object.padding.right
                : this.object.width - this.object.padding.left - this.object.padding.right - this.object.label.width;
            this.maxWidth = tableWidth - this.object.totalsValuesWidth;
            this.adjacentColumnWidth = this.maxWidth - this.object.totalsHeadersWidth;
        }
        else {
            this.startColumnWidth = this.object.totalsValuesWidth;
            this.maxWidth = this.object.totalsHeadersWidth + this.object.totalsValuesWidth;
            this.adjacentColumnWidth = this.object.totalsHeadersWidth;
        }
    }
    resize(event) {
        if (this.isResizing) {
            let delta = event.clientX - this.startPoint;
            if (this.startColumnWidth - delta >= this.minWidth && this.adjacentColumnWidth + delta >= this.minWidth) {
                if (this.currentColumnType == "totalHeader") {
                    this.object.totalsHeadersWidth = this.startColumnWidth - delta;
                }
                else {
                    this.object.totalsValuesWidth = this.startColumnWidth - delta;
                    this.object.totalsHeadersWidth = this.adjacentColumnWidth + delta;
                }
            }
            else {
                if (this.currentColumnType == "totalHeader") {
                    if (this.startColumnWidth - delta <= this.minWidth) {
                        this.object.totalsHeadersWidth = this.minWidth;
                    }
                    else if (this.adjacentColumnWidth + delta <= this.minWidth) {
                        this.object.totalsHeadersWidth = this.maxWidth - this.minWidth;
                    }
                }
                else {
                    if (this.startColumnWidth - delta <= this.minWidth) {
                        this.object.totalsValuesWidth = this.minWidth;
                        this.object.totalsHeadersWidth = this.maxWidth - this.minWidth;
                    }
                    else if (this.adjacentColumnWidth + delta <= this.minWidth) {
                        this.object.totalsValuesWidth = this.maxWidth - this.minWidth;
                        this.object.totalsHeadersWidth = this.minWidth;
                    }
                }
            }
        }
    }
    constructor(model, mouseService) {
        this.model = model;
        this.mouseService = mouseService;
        this.isClone = false;
        this.minWidth = 40;
        this.isResizing = false;
        this.mouseUpSubscription = this.mouseService.getDocumentMouseUp().subscribe((event) => {
            this.isResizing = false;
        });
        this.mouseMoveSubscription = this.mouseService.getDocumentMouseMove().subscribe((event) => {
            this.resize(event);
        });
    }
    ngOnDestroy() {
        this.mouseUpSubscription?.unsubscribe();
        this.mouseMoveSubscription?.unsubscribe();
    }
    ngOnInit() {
        this.mouseUpSubscription = this.mouseService.getDocumentMouseUp().subscribe((event) => {
            this.isResizing = false;
        });
        this.mouseMoveSubscription = this.mouseService.getDocumentMouseMove().subscribe((event) => {
            this.resize(event);
        });
        /*  if (this.object.loadedFromJson) {
          this.object.totalsFields.forEach((totalField) => {
            totalField.calculationAlgorithm.expression = StiAlgorithmExpression.NumberColumnSum;
    
          });
        } */
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableTotalsFieldComponent, deps: [{ token: StiModelService }, { token: StiMouseService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTableTotalsFieldComponent, selector: "sti-table-totals-field-component", inputs: { fields: "fields", object: "object", isClone: "isClone" }, ngImport: i0, template: ` <table>
    <tr *ngFor="let field of fields; index as i">
      <td
        class="field-header"
        [style.border-top]="
          i == 0 && selected && !model.previewMode ? '1px solid rgba(218,218,218,0.5)' : '1px solid transparent'
        "
        [style.border-bottom]="
          selected && !model.previewMode ? '1px solid rgba(218,218,218,0.5)' : '1px solid transparent'
        "
        [style.border-right]="
          selected && !model.previewMode ? '1px solid rgba(218,218,218,0.5)' : '1px solid transparent'
        "
        [style.border-left]="
          selected && !model.previewMode ? '1px solid rgba(218,218,218,0.5)' : '1px solid transparent'
        "
        [style.width.px]="object.totalsHeadersWidth"
        [style.justify-content]="getAlignment(field.headerAlignment)"
      >
        <div class="total-resizer" *ngIf="selected" (mousedown)="initResize($event, 'totalHeader')"></div>
        <sti-editable-content-component
          [editableContent]="field"
          [eParent]="object"
          [hideEmpty]="false"
          [active]="selected"
        ></sti-editable-content-component>
      </td>
      <td
        class="field-value"
        [style.border-top]="
          i == 0 && selected && !model.previewMode ? '1px solid rgba(218,218,218,0.5)' : '1px solid transparent'
        "
        [style.border-bottom]="
          selected && !model.previewMode ? '1px solid rgba(218,218,218,0.5)' : '1px solid transparent'
        "
        [style.border-right]="
          selected && !model.previewMode ? '1px solid rgba(218,218,218,0.5)' : '1px solid transparent'
        "
        [style.width.px]="object.totalsValuesWidth"
        [style.justify-content]="getAlignment(field.valueAlignment)"
      >
        <div class="total-resizer" *ngIf="selected" (mousedown)="initResize($event, 'totalValue')"></div>
        <label
          [style]="object.font.htmlStyle()"
          [style.text-decoration]="'none'"
          [style.color]="field.headerColor.toHtmlColor()"
          (mousedown)="showPropertyInfo(field)"
          >{{ getValue(field) }}
        </label>
      </td>
    </tr>
  </table>`, isInline: true, styles: ["table{border-spacing:0;border-collapse:collapse;overflow:hidden}td{padding:3px 1px;display:flex;position:relative;white-space:nowrap;overflow:hidden}tr{display:flex}label{width:max-content}.total-resizer{height:100%;width:5px;position:absolute;left:0;top:0}.total-resizer:hover{cursor:ew-resize}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableTotalsFieldComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-table-totals-field-component", template: ` <table>
    <tr *ngFor="let field of fields; index as i">
      <td
        class="field-header"
        [style.border-top]="
          i == 0 && selected && !model.previewMode ? '1px solid rgba(218,218,218,0.5)' : '1px solid transparent'
        "
        [style.border-bottom]="
          selected && !model.previewMode ? '1px solid rgba(218,218,218,0.5)' : '1px solid transparent'
        "
        [style.border-right]="
          selected && !model.previewMode ? '1px solid rgba(218,218,218,0.5)' : '1px solid transparent'
        "
        [style.border-left]="
          selected && !model.previewMode ? '1px solid rgba(218,218,218,0.5)' : '1px solid transparent'
        "
        [style.width.px]="object.totalsHeadersWidth"
        [style.justify-content]="getAlignment(field.headerAlignment)"
      >
        <div class="total-resizer" *ngIf="selected" (mousedown)="initResize($event, 'totalHeader')"></div>
        <sti-editable-content-component
          [editableContent]="field"
          [eParent]="object"
          [hideEmpty]="false"
          [active]="selected"
        ></sti-editable-content-component>
      </td>
      <td
        class="field-value"
        [style.border-top]="
          i == 0 && selected && !model.previewMode ? '1px solid rgba(218,218,218,0.5)' : '1px solid transparent'
        "
        [style.border-bottom]="
          selected && !model.previewMode ? '1px solid rgba(218,218,218,0.5)' : '1px solid transparent'
        "
        [style.border-right]="
          selected && !model.previewMode ? '1px solid rgba(218,218,218,0.5)' : '1px solid transparent'
        "
        [style.width.px]="object.totalsValuesWidth"
        [style.justify-content]="getAlignment(field.valueAlignment)"
      >
        <div class="total-resizer" *ngIf="selected" (mousedown)="initResize($event, 'totalValue')"></div>
        <label
          [style]="object.font.htmlStyle()"
          [style.text-decoration]="'none'"
          [style.color]="field.headerColor.toHtmlColor()"
          (mousedown)="showPropertyInfo(field)"
          >{{ getValue(field) }}
        </label>
      </td>
    </tr>
  </table>`, styles: ["table{border-spacing:0;border-collapse:collapse;overflow:hidden}td{padding:3px 1px;display:flex;position:relative;white-space:nowrap;overflow:hidden}tr{display:flex}label{width:max-content}.total-resizer{height:100%;width:5px;position:absolute;left:0;top:0}.total-resizer:hover{cursor:ew-resize}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiMouseService }], propDecorators: { fields: [{
                type: Input
            }], object: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiTableColumnResizerComponent {
    initResize(event) {
        event.stopPropagation();
        if (this.model.previewMode) {
            return;
        }
        this.isResizing = true;
        this.startPoint = event.clientX;
        if (this.resizableItem instanceof StiColumnItem) {
            this.startColumnWidth = this.resizableItem.width;
            this.maxWidth = this.startColumnWidth + this.element.columns[this.index + 1].width;
            this.adjacentColumnWidth = this.element.columns[this.index + 1].width;
        }
        else {
            this.startColumnWidth = this.resizableItem.rowLabelsWidth;
            this.maxWidth = this.startColumnWidth + this.element.columns[0].width;
            this.adjacentColumnWidth = this.element.columns[0].width;
        }
    }
    resize(event) {
        if (this.isResizing) {
            let delta = event.clientX - this.startPoint;
            if (this.startColumnWidth + delta >= this.minWidth && this.adjacentColumnWidth - delta >= this.minWidth) {
                if (this.resizableItem instanceof StiColumnItem) {
                    this.resizableItem.width = this.startColumnWidth + delta;
                    this.element.columns[this.index + 1].width = this.adjacentColumnWidth - delta;
                }
                else {
                    this.resizableItem.rowLabelsWidth = this.startColumnWidth + delta;
                    this.element.columns[0].width = this.adjacentColumnWidth - delta;
                }
            }
            else {
                if (this.resizableItem instanceof StiColumnItem) {
                    if (this.startColumnWidth + delta <= this.minWidth) {
                        this.resizableItem.width = this.minWidth;
                        this.element.columns[this.index + 1].width = this.maxWidth - this.minWidth;
                    }
                    else if (this.adjacentColumnWidth - delta <= this.minWidth) {
                        this.element.columns[this.index + 1].width = this.minWidth;
                        this.resizableItem.width = this.maxWidth - this.minWidth;
                    }
                }
                else {
                    if (this.startColumnWidth + delta <= this.minWidth) {
                        this.resizableItem.rowLabelsWidth = this.minWidth;
                        this.element.columns[0].width = this.maxWidth - this.minWidth;
                    }
                    else if (this.adjacentColumnWidth - delta <= this.minWidth) {
                        this.element.columns[0].width = this.minWidth;
                        this.resizableItem.rowLabelsWidth = this.maxWidth - this.minWidth;
                    }
                }
            }
        }
    }
    get showResizePreview() {
        return this.element instanceof StiTableElement &&
            !this.model.previewMode &&
            ((!this.element.gridLines.drawVertical && this.resizableItem instanceof StiColumnItem) ||
                (!this.element.columnHeadersBorder.drawLeft && !(this.resizableItem instanceof StiColumnItem))) &&
            this.model.selectedComponent?.element == this.element
            ? true
            : false;
    }
    constructor(model, mouseService) {
        this.model = model;
        this.mouseService = mouseService;
        this.minWidth = 40;
        this.isResizing = false;
    }
    ngOnDestroy() {
        this.mouseUpSubscription?.unsubscribe();
        this.mouseMoveSubscription?.unsubscribe();
    }
    ngOnInit() {
        this.mouseUpSubscription = this.mouseService.getDocumentMouseUp().subscribe((event) => {
            this.isResizing = false;
        });
        this.mouseMoveSubscription = this.mouseService.getDocumentMouseMove().subscribe((event) => {
            this.resize(event);
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableColumnResizerComponent, deps: [{ token: StiModelService }, { token: StiMouseService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTableColumnResizerComponent, selector: "sti-table-column-resizer", inputs: { resizableItem: "resizableItem", element: "element", index: "index" }, ngImport: i0, template: `
    <div
      class="column-resizer"
      (mousedown)="initResize($event)"
      [style.border-right]="showResizePreview ? '1px solid black' : ''"
      [style.cursor]="model.previewMode ? 'default' : 'ew-resize'"
    ></div>
    <style>
      .column-resizer {
        height: 100%;
        width: 5px;
        position: absolute;
        opacity: 0.5;
        top: 0;
        right: 0;
      }
      .column-resizer:hover {
        cursor: ew-resize;
      }
    </style>
  `, isInline: true, styles: ["\n      .column-resizer {\n        height: 100%;\n        width: 5px;\n        position: absolute;\n        opacity: 0.5;\n        top: 0;\n        right: 0;\n      }\n      .column-resizer:hover {\n        cursor: ew-resize;\n      }\n    "] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableColumnResizerComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-table-column-resizer",
                    template: `
    <div
      class="column-resizer"
      (mousedown)="initResize($event)"
      [style.border-right]="showResizePreview ? '1px solid black' : ''"
      [style.cursor]="model.previewMode ? 'default' : 'ew-resize'"
    ></div>
    <style>
      .column-resizer {
        height: 100%;
        width: 5px;
        position: absolute;
        opacity: 0.5;
        top: 0;
        right: 0;
      }
      .column-resizer:hover {
        cursor: ew-resize;
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiMouseService }], propDecorators: { resizableItem: [{
                type: Input
            }], element: [{
                type: Input
            }], index: [{
                type: Input
            }] } });

class StiTableInputTextComponent {
    getColumnAlignment() {
        return Enum.getName(StiHorizontalAlignment, this.item.cellAlignment);
    }
    get cell() {
        return this.item.cells[this.index] ? this.item.cells[this.index] : null;
    }
    get tabIndex() {
        try {
            let columns = this.object.columns;
            return this.object["tabIndex"] + columns.indexOf(this.item) + columns.length * this.index;
        }
        catch { }
    }
    /* public set cell(value) {
      this.item.cells[this.index] = value;
    } */
    inFocus() { }
    lostFocus() { }
    disableDrag() {
        this.model.canDrag = false;
    }
    enableDrag() {
        this.model.canDrag = true;
    }
    constructor(model) {
        this.model = model;
        this.isClone = false;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableInputTextComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTableInputTextComponent, selector: "sti-table-input-text-component", inputs: { item: "item", index: "index", object: "object", disabled: "disabled", isClone: "isClone" }, ngImport: i0, template: `<input
    type="text"
    spellcheck="false"
    [(ngModel)]="cell.text"
    [style]="object.font.htmlStyle()"
    [style.text-decoration]="'none'"
    [style.text-align]="getColumnAlignment()"
    [style.border-color]="item.cellBorderColor.toHtmlColor()"
    [style.color]="item.cellForeColor.toHtmlColor()"
    [style.background-color]="item.cellBackColor.toHtmlColor()"
    [disabled]="disabled"
    [tabIndex]="tabIndex"
    (mousedown)="disableDrag()"
    (mouseup)="enableDrag()"
    (focus)="inFocus()"
    (blur)="lostFocus()"
  />`, isInline: true, styles: ["input{height:fit-content;padding:3px 4px;width:99%;border:1px solid rgb(198,198,198)}input:not([disabled]):hover{border-color:#a3bde3!important}input:focus{outline:none;border:1px solid rgb(163,189,227)}\n"], dependencies: [{ kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableInputTextComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-table-input-text-component", template: `<input
    type="text"
    spellcheck="false"
    [(ngModel)]="cell.text"
    [style]="object.font.htmlStyle()"
    [style.text-decoration]="'none'"
    [style.text-align]="getColumnAlignment()"
    [style.border-color]="item.cellBorderColor.toHtmlColor()"
    [style.color]="item.cellForeColor.toHtmlColor()"
    [style.background-color]="item.cellBackColor.toHtmlColor()"
    [disabled]="disabled"
    [tabIndex]="tabIndex"
    (mousedown)="disableDrag()"
    (mouseup)="enableDrag()"
    (focus)="inFocus()"
    (blur)="lostFocus()"
  />`, styles: ["input{height:fit-content;padding:3px 4px;width:99%;border:1px solid rgb(198,198,198)}input:not([disabled]):hover{border-color:#a3bde3!important}input:focus{outline:none;border:1px solid rgb(163,189,227)}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { item: [{
                type: Input
            }], index: [{
                type: Input
            }], object: [{
                type: Input
            }], disabled: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiTableRadioButtonComponent {
    get cell() {
        return this.item.cells[this.index];
    }
    constructor(model) {
        this.model = model;
        this.isClone = false;
        this.buttonClick = new EventEmitter();
    }
    changeState() {
        this.buttonClick.emit();
    }
    ngOnInit() { }
    get tabIndex() {
        try {
            let columns = this.object.columns;
            return this.object["tabIndex"] + columns.indexOf(this.item) + columns.length * this.index;
        }
        catch { }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableRadioButtonComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTableRadioButtonComponent, selector: "sti-table-radio-button-component", inputs: { item: "item", index: "index", disabled: "disabled", isClone: "isClone", object: "object", alignment: "alignment" }, outputs: { buttonClick: "buttonClick" }, ngImport: i0, template: `<div
    class="custom-radio"
    [style.justify-content]="alignment"
    (mousedown)="model.canDrag = false"
    (mouseup)="model.canDrag = true"
  >
    <input type="radio" (click)="changeState()" [disabled]="disabled" [tabIndex]="tabIndex" />
    <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none">
      <circle
        class="box"
        cx="6"
        cy="6"
        r="5.5"
        [attr.fill]="item.cellBackColor.toHtmlColor()"
        [attr.stroke]="item.cellBorderColor.toHtmlColor()"
      />
      <circle
        *ngIf="cell?.isChecked"
        class="check"
        cx="6"
        cy="6"
        r="2.5"
        [attr.fill]="item.cellForeColor.toHtmlColor()"
      />
    </svg>
  </div>`, isInline: true, styles: ["input[type=radio]:hover+svg .box{stroke:#a3bde3!important;fill:#f3f9ff!important}input[type=radio]:active+svg .box{stroke:#3c77dd!important;fill:#d9ecff!important}input[type=radio]:disabled+svg .box{stroke:#bcbcbc!important;fill:#e6e6e6!important}label,span{margin-left:5px}.box:hover:{stroke:#a3bde3!important}.custom-radio{width:fit-content;position:relative;align-items:center;display:flex;width:100%}.custom-radio input[type=radio]{position:absolute;width:100%;z-index:10;opacity:0}.other input[type=radio]{position:absolute;width:16px;z-index:10;opacity:0}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableRadioButtonComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-table-radio-button-component", template: `<div
    class="custom-radio"
    [style.justify-content]="alignment"
    (mousedown)="model.canDrag = false"
    (mouseup)="model.canDrag = true"
  >
    <input type="radio" (click)="changeState()" [disabled]="disabled" [tabIndex]="tabIndex" />
    <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none">
      <circle
        class="box"
        cx="6"
        cy="6"
        r="5.5"
        [attr.fill]="item.cellBackColor.toHtmlColor()"
        [attr.stroke]="item.cellBorderColor.toHtmlColor()"
      />
      <circle
        *ngIf="cell?.isChecked"
        class="check"
        cx="6"
        cy="6"
        r="2.5"
        [attr.fill]="item.cellForeColor.toHtmlColor()"
      />
    </svg>
  </div>`, styles: ["input[type=radio]:hover+svg .box{stroke:#a3bde3!important;fill:#f3f9ff!important}input[type=radio]:active+svg .box{stroke:#3c77dd!important;fill:#d9ecff!important}input[type=radio]:disabled+svg .box{stroke:#bcbcbc!important;fill:#e6e6e6!important}label,span{margin-left:5px}.box:hover:{stroke:#a3bde3!important}.custom-radio{width:fit-content;position:relative;align-items:center;display:flex;width:100%}.custom-radio input[type=radio]{position:absolute;width:100%;z-index:10;opacity:0}.other input[type=radio]{position:absolute;width:16px;z-index:10;opacity:0}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { item: [{
                type: Input
            }], index: [{
                type: Input
            }], disabled: [{
                type: Input
            }], isClone: [{
                type: Input
            }], object: [{
                type: Input
            }], alignment: [{
                type: Input
            }], buttonClick: [{
                type: Output
            }] } });

class StiTableComboboxComponent {
    get cell() {
        return this.item.cells[this.index];
    }
    get selectedIndex() {
        return this.item?.comboBoxOptions[this.cell?.selectedIndex ? this.cell?.selectedIndex : 0];
    }
    set selectedIndex(value) {
        this.item.comboBoxOptions.forEach((option, index) => {
            if (option == value) {
                this.cell.selectedIndex = index;
            }
        });
    }
    constructor(model) {
        this.model = model;
        this.isClone = false;
    }
    get tabIndex() {
        try {
            let columns = this.object.columns;
            return this.object["tabIndex"] + columns.indexOf(this.item) + columns.length * this.index;
        }
        catch { }
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableComboboxComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTableComboboxComponent, selector: "sti-table-combobox-component", inputs: { item: "item", index: "index", object: "object", disabled: "disabled", isClone: "isClone" }, ngImport: i0, template: ` <select
    class="selection"
    name=""
    id=""
    [style]="object.font.htmlStyle()"
    [style.border-color]="item.cellBorderColor.toHtmlColor()"
    [style.text-decoration]="'none'"
    [style.color]="item.cellForeColor.toHtmlColor()"
    [style.background-color]="item.cellBackColor.toHtmlColor()"
    [(ngModel)]="selectedIndex"
    [tabIndex]="tabIndex"
    [disabled]="disabled"
  >
    <option
      *ngFor="let option of item?.comboBoxOptions"
      [style.background-color]="item.cellBackColor.toHtmlColor()"
      [style]="object.font.htmlStyle()"
    >
      {{ option }}
    </option>
  </select>`, isInline: true, styles: [".selection{width:99%;border:1px solid rgb(198,198,198);background:#fff;height:fit-content;padding:3px 4px;appearance:none;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3NpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDA2IDc5LjE2NDc1MywgMjAyMS8wMi8xNS0xMTo1MjoxMyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDphNzFiNTVkYi0wMGZlLTVjNDctYmVkZS1jYTVhNjk0NjdkNjgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6N0UxNDE5MzBBNDBDMTFFQkE5MDBCNzU3NjhFQUY2QTQiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6N0UxNDE5MkZBNDBDMTFFQkE5MDBCNzU3NjhFQUY2QTQiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIyLjMgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6YTcxYjU1ZGItMDBmZS01YzQ3LWJlZGUtY2E1YTY5NDY3ZDY4IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOmE3MWI1NWRiLTAwZmUtNWM0Ny1iZWRlLWNhNWE2OTQ2N2Q2OCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pg8NmFEAAABPSURBVHjaYmxsbGSgBDAxUAiGqQH1eNTXE2NAAw5D6qFyBA1oxGIITDNGnLPgcAEDmm0NSAYTNACbIVg14zMAmwsYSDUAr8bRpIwAAAEGAFUJDal4N9jVAAAAAElFTkSuQmCC);background-repeat:no-repeat;background-position:right 5px top 50%;background-size:14px auto}.selection:not([disabled]):hover{border-color:#a3bde3!important;background-color:#e2effc!important}.selection:focus{outline:none;border-color:#a3bde3!important;background-color:#fff!important}select:focus>option:checked{background-color:#f6f6f6!important}select option:hover{box-shadow:0 0 10px 100px orange inset}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableComboboxComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-table-combobox-component", template: ` <select
    class="selection"
    name=""
    id=""
    [style]="object.font.htmlStyle()"
    [style.border-color]="item.cellBorderColor.toHtmlColor()"
    [style.text-decoration]="'none'"
    [style.color]="item.cellForeColor.toHtmlColor()"
    [style.background-color]="item.cellBackColor.toHtmlColor()"
    [(ngModel)]="selectedIndex"
    [tabIndex]="tabIndex"
    [disabled]="disabled"
  >
    <option
      *ngFor="let option of item?.comboBoxOptions"
      [style.background-color]="item.cellBackColor.toHtmlColor()"
      [style]="object.font.htmlStyle()"
    >
      {{ option }}
    </option>
  </select>`, styles: [".selection{width:99%;border:1px solid rgb(198,198,198);background:#fff;height:fit-content;padding:3px 4px;appearance:none;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3NpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDA2IDc5LjE2NDc1MywgMjAyMS8wMi8xNS0xMTo1MjoxMyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDphNzFiNTVkYi0wMGZlLTVjNDctYmVkZS1jYTVhNjk0NjdkNjgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6N0UxNDE5MzBBNDBDMTFFQkE5MDBCNzU3NjhFQUY2QTQiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6N0UxNDE5MkZBNDBDMTFFQkE5MDBCNzU3NjhFQUY2QTQiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIyLjMgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6YTcxYjU1ZGItMDBmZS01YzQ3LWJlZGUtY2E1YTY5NDY3ZDY4IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOmE3MWI1NWRiLTAwZmUtNWM0Ny1iZWRlLWNhNWE2OTQ2N2Q2OCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pg8NmFEAAABPSURBVHjaYmxsbGSgBDAxUAiGqQH1eNTXE2NAAw5D6qFyBA1oxGIITDNGnLPgcAEDmm0NSAYTNACbIVg14zMAmwsYSDUAr8bRpIwAAAEGAFUJDal4N9jVAAAAAElFTkSuQmCC);background-repeat:no-repeat;background-position:right 5px top 50%;background-size:14px auto}.selection:not([disabled]):hover{border-color:#a3bde3!important;background-color:#e2effc!important}.selection:focus{outline:none;border-color:#a3bde3!important;background-color:#fff!important}select:focus>option:checked{background-color:#f6f6f6!important}select option:hover{box-shadow:0 0 10px 100px orange inset}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { item: [{
                type: Input
            }], index: [{
                type: Input
            }], object: [{
                type: Input
            }], disabled: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiTableCheckboxComponent {
    get cell() {
        return this.item.cells[this.index] ? this.item.cells[this.index] : null;
    }
    constructor(model) {
        this.model = model;
        this.isClone = false;
        this.buttonClick = new EventEmitter();
    }
    changeState() {
        this.buttonClick.emit();
    }
    ngOnInit() { }
    get tabIndex() {
        try {
            let columns = this.object.columns;
            return this.object["tabIndex"] + columns.indexOf(this.item) + columns.length * this.index;
        }
        catch { }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableCheckboxComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTableCheckboxComponent, selector: "sti-table-checkbox-component", inputs: { item: "item", index: "index", object: "object", disabled: "disabled", isClone: "isClone", alignment: "alignment" }, outputs: { buttonClick: "buttonClick" }, ngImport: i0, template: ` <div
    class="custom-checkbox"
    [style.justify-content]="alignment"
    (mousedown)="model.canDrag = false"
    (mouseup)="model.canDrag = true"
  >
    <input
      type="checkbox"
      name=""
      tooltipPosition="bottom"
      showDelay="500"
      [tabIndex]="tabIndex"
      (click)="changeState()"
      [disabled]="disabled"
    />
    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 18 16" fill="none">
      <rect
        class="box"
        x="0.5"
        y="15.5"
        width="16"
        height="16"
        transform="rotate(-90 0.5 15.5)"
        [attr.fill]="item.cellBackColor.toHtmlColor()"
        [attr.stroke]="item.cellBorderColor.toHtmlColor()"
      />
      <path
        *ngIf="cell?.isChecked"
        class="check"
        d="M5 7.23529L8.15 12L14 3"
        [attr.stroke]="item.cellForeColor.toHtmlColor()"
        fill="transparent"
        stroke-width="2"
        stroke-linecap="round"
        stroke-linejoin="round"
      />
    </svg>
  </div>`, isInline: true, styles: ["input[type=checkbox]:hover+svg .box{stroke:#a3bde3!important;fill:#f3f9ff!important}input[type=checkbox]:active+svg .box{stroke:#3c77dd!important;fill:#d9ecff!important}input[type=checkbox]:disabled+svg .box{stroke:#bcbcbc!important;fill:#e6e6e6!important}label,span{margin-left:5px}.box:hover:{stroke:#a3bde3!important}.custom-checkbox{align-items:center;width:fit-content;position:relative;display:flex;width:100%}.custom-checkbox input[type=checkbox]{position:absolute;width:14px;z-index:10;opacity:0;margin:0}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableCheckboxComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-table-checkbox-component", template: ` <div
    class="custom-checkbox"
    [style.justify-content]="alignment"
    (mousedown)="model.canDrag = false"
    (mouseup)="model.canDrag = true"
  >
    <input
      type="checkbox"
      name=""
      tooltipPosition="bottom"
      showDelay="500"
      [tabIndex]="tabIndex"
      (click)="changeState()"
      [disabled]="disabled"
    />
    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 18 16" fill="none">
      <rect
        class="box"
        x="0.5"
        y="15.5"
        width="16"
        height="16"
        transform="rotate(-90 0.5 15.5)"
        [attr.fill]="item.cellBackColor.toHtmlColor()"
        [attr.stroke]="item.cellBorderColor.toHtmlColor()"
      />
      <path
        *ngIf="cell?.isChecked"
        class="check"
        d="M5 7.23529L8.15 12L14 3"
        [attr.stroke]="item.cellForeColor.toHtmlColor()"
        fill="transparent"
        stroke-width="2"
        stroke-linecap="round"
        stroke-linejoin="round"
      />
    </svg>
  </div>`, styles: ["input[type=checkbox]:hover+svg .box{stroke:#a3bde3!important;fill:#f3f9ff!important}input[type=checkbox]:active+svg .box{stroke:#3c77dd!important;fill:#d9ecff!important}input[type=checkbox]:disabled+svg .box{stroke:#bcbcbc!important;fill:#e6e6e6!important}label,span{margin-left:5px}.box:hover:{stroke:#a3bde3!important}.custom-checkbox{align-items:center;width:fit-content;position:relative;display:flex;width:100%}.custom-checkbox input[type=checkbox]{position:absolute;width:14px;z-index:10;opacity:0;margin:0}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { item: [{
                type: Input
            }], index: [{
                type: Input
            }], object: [{
                type: Input
            }], disabled: [{
                type: Input
            }], isClone: [{
                type: Input
            }], alignment: [{
                type: Input
            }], buttonClick: [{
                type: Output
            }] } });

class StiExpressionService {
    static { this.MOUSE_DELTA = 3; }
    getExpressionString(startItem) {
        let expressionObject = { previewString: "", startObject: null, lastCaretOffset: 1 };
        expressionObject.startObject = startItem;
        if (typeof startItem.object == "string") {
            if (startItem.object.length == 1) {
                expressionObject.previewString = startItem.object;
            }
            else {
                let string = "";
                if (startItem.object.toLowerCase() == "value") {
                    string = startItem.object + `('')`;
                }
                else if (startItem.object.toLowerCase() == "line" ||
                    startItem.object.toLowerCase() == "today" ||
                    startItem.object.toLowerCase() == "time") {
                    string = startItem.object;
                }
                else if (startItem.object.toLowerCase() == "cell") {
                    string = startItem.object + "(,,'')";
                }
                else if (startItem.object.toLowerCase() == "total" ||
                    startItem.object.toLowerCase() == "col" ||
                    startItem.object.toLowerCase() == "row") {
                    string = startItem.object + "(,'')";
                }
                else {
                    string = startItem.object + "()";
                }
                expressionObject.previewString = string;
            }
        }
        else {
            if (startItem.object instanceof StiFormElement) {
                expressionObject.previewString = `Value('${startItem.object.name}')`;
            }
            else {
                if (startItem.object instanceof StiTotalsFieldItem) {
                    expressionObject.previewString = `Total(${startItem.object.eParent.totalsFields.indexOf(startItem.object) + 1},'${startItem.object.eParent.name}')`;
                }
                else if (startItem.object instanceof StiColumnItem && !startItem.isCell) {
                    expressionObject.previewString = `Col(${startItem.object.eParent.columns.indexOf(startItem.object) + 1},'${startItem.object.eParent.name}')`;
                }
                else {
                    expressionObject.previewString = `Cell(${startItem.object.eParent.columns.indexOf(startItem.object) + 1},${startItem.index},'${startItem.object.eParent.name}')`;
                }
            }
        }
        return expressionObject;
    }
    startContainerDrag(object) {
        this.startExpressionDraggingX = object.event.clientX;
        this.startExpressionDraggingY = object.event.clientY;
        this.draggableExpressionObject = this.getExpressionString(object);
        this.isDragging = true;
        let elem = this.elementRef.nativeElement;
        elem.focus();
    }
    moveContainer(event) {
        if (this.isDragging) {
            event.preventDefault();
            let elements = document.elementsFromPoint(event.clientX, event.clientY);
            if (elements.find((elem) => elem.classList.contains("expression-preview"))) {
                let currentRange;
                if (document.caretRangeFromPoint) {
                    currentRange = document.caretRangeFromPoint(event.clientX, event.clientY);
                }
                else {
                    let sel = window.getSelection();
                    sel.collapse(event.rangeParent, event.rangeOffset);
                    currentRange = sel.getRangeAt(0);
                }
                this.currentCarretOffset = currentRange.startOffset;
                setTimeout(() => {
                    var range = document.createRange();
                    var sel = window.getSelection();
                    if (this.elementRef.nativeElement.childNodes[0]) {
                        range?.setStart(this.elementRef.nativeElement.childNodes[0], this.currentCarretOffset);
                        range?.collapse(true);
                        sel.removeAllRanges();
                        sel.addRange(range);
                        this.draggableExpressionObject.lastCaretOffset = this.currentCarretOffset;
                    }
                });
            }
            let deltaX = event.clientX - this.startExpressionDraggingX;
            let deltaY = event.clientY - this.startExpressionDraggingY;
            if (this.startExpressionDraggingX - 10 + deltaX < 0) {
                this.expressionDraggableContainerX = 0;
            }
            else if (this.startExpressionDraggingX - 10 + deltaX >
                window.innerWidth - this.elementRef?.nativeElement.clientWidth) {
                this.expressionDraggableContainerX = window.innerWidth - this.elementRef?.nativeElement.clientWidth;
            }
            else {
                this.expressionDraggableContainerX = this.startExpressionDraggingX - 10 + deltaX;
            }
            if (this.startExpressionDraggingY - 10 + deltaY < 0) {
                this.expressionDraggableContainerY = 0;
            }
            else if (this.startExpressionDraggingY - 10 + deltaY >
                window.innerHeight - this.elementRef?.nativeElement.clientHeight) {
                this.expressionDraggableContainerY = window.innerHeight - this.elementRef?.nativeElement.clientHeight;
            }
            else {
                this.expressionDraggableContainerY = this.startExpressionDraggingY - 10 + deltaY;
            }
        }
    }
    endContainerDrag(event) {
        if (this.isDragging) {
            if (document
                .elementsFromPoint(event.clientX, event.clientY)
                .find((element) => element.classList.contains("expression-preview"))) {
                this.needToAddExpression.next(this.draggableExpressionObject);
            }
            this.isDragging = false;
            this.draggableExpressionObject = null;
        }
    }
    constructor(model, mouseService) {
        this.model = model;
        this.mouseService = mouseService;
        this.started = false;
        this.status = {};
        this.componentWidth = 700;
        this.componentHeight = 482;
        this.needToAddExpression = new Subject();
        this.expressionPreviewString = "";
        this.isDragging = false;
        window.onresize = (event) => {
            if (window.innerWidth > this.componentWidth) {
                if (window.innerWidth < this.componentX + this.componentWidth) {
                    this.componentX = (window.innerWidth - this.componentWidth) / 2;
                }
            }
            else {
                this.componentX = 0;
            }
            if (window.innerHeight > this.componentHeight) {
                if (window.innerHeight < this.componentY + this.componentHeight) {
                    this.componentY = (window.innerHeight - this.componentHeight) / 2;
                }
            }
            else {
                this.componentY = 0;
            }
        };
        this.mouseService.getDocumentMouseMove().subscribe((event) => {
            this.moveContainer(event);
        });
        this.mouseService.getDocumentMouseUp().subscribe((event) => {
            this.endContainerDrag(event);
        });
    }
    getCaretOffset(element) {
        let caretOffset = 0;
        let doc = element.ownerDocument || element.document;
        let win = doc.defaultView || doc.parentWindow;
        let sel;
        if (typeof win.getSelection != "undefined") {
            sel = win.getSelection();
            if (sel.rangeCount > 0) {
                let range = win.getSelection().getRangeAt(0);
                let preCaretRange = range.cloneRange();
                preCaretRange.selectNodeContents(element);
                preCaretRange.setEnd(range.endContainer, range.endOffset);
                caretOffset = preCaretRange.toString().length;
            }
        }
        else if ((sel = doc.selection) && sel.type != "Control") {
            let textRange = sel.createRange();
            let preCaretTextRange = doc.body.createTextRange();
            preCaretTextRange.moveToElementText(element);
            preCaretTextRange.setEndPoint("EndToEnd", textRange);
            caretOffset = preCaretTextRange.text.length;
        }
        return caretOffset;
    }
    start() {
        if (this.started) {
            return;
        }
        this.started = true;
        this.model.formEvents.subscribe((e) => {
            if (e.name == "ValueChanged" || e.name == "ComponentDeleted" || e.name == "SetForm" || e.name == "UpdateForm") {
                setTimeout(() => {
                    this.calculate();
                }, 0);
            }
        });
    }
    addDependency(expression, names, dependecies, excludeName) {
        let regex = /(\{.+?\})/g;
        let exec;
        while ((exec = regex.exec(expression)) !== null) {
            names.forEach(n => {
                if (excludeName != n && exec[0].indexOf(`'${n}'`) > 0 && dependecies.indexOf(n) == -1) {
                    dependecies.push(n);
                }
            });
        }
    }
    calculate() {
        let elements = {};
        let dependencies = {};
        let allElements = this.model.form.allElements.filter(el => (el instanceof StiTableElement || el instanceof StiLabelElement));
        let names = allElements.map(e => e.name);
        allElements.forEach((e) => {
            if (e instanceof StiTableElement) {
                let dep = [];
                let table = e;
                table.columns.filter(c => c instanceof StiLabelColumnItem).
                    forEach((col) => this.addDependency(col.expression, names, dep, table.name));
                table.totalsFields.forEach(t => this.addDependency(t.value, names, dep, table.name));
                dependencies[table.name] = dep;
            }
            else if (e instanceof StiLabelElement) {
                let dep = [];
                let label = e;
                this.addDependency(label.text.value, names, dep, label.name);
                dependencies[label.name] = dep;
            }
        });
        let calculatedElements = [];
        let excludeElements = ["dummy"];
        while (excludeElements.length > 0) {
            excludeElements = [];
            allElements.forEach((e) => {
                if (dependencies[e.name].length == 0 || dependencies[e.name].every(name => calculatedElements.indexOf(name) >= 0)) {
                    excludeElements.push(e);
                    calculatedElements.push(e.name);
                    if (e instanceof StiTableElement) {
                        let table = e;
                        table.columns.forEach((c, colIndex) => {
                            if (c instanceof StiLabelColumnItem) {
                                let label = c;
                                label.cells.forEach((c, rowIndex) => {
                                    this.exec(label, elements, table, colIndex, rowIndex);
                                });
                            }
                        });
                        table.totalsFields.forEach((t, index) => {
                            let total = t;
                            this.exec(total, elements, table, null, null, index);
                        });
                        table.rowLabelsContentEditable.forEach((r, index) => {
                            let row = r;
                            this.exec(row, elements, table, null, index);
                        });
                    }
                    else if (e instanceof StiLabelElement) {
                        let label = e;
                        this.exec(label, elements);
                    }
                }
            });
            allElements = allElements.filter(e => excludeElements.indexOf(e) == -1);
        }
    }
    getElementName(element, row) {
        if (element instanceof StiTotalsFieldItem ||
            element instanceof StiLabelColumnItem ||
            element instanceof StiRowLabel) {
            let tables = [];
            this.model.form.pages.forEach((p) => p.allElements.forEach((e) => {
                if (e instanceof StiTableElement) {
                    tables.push(e);
                }
            }));
            let table = tables.find((t) => t.totalsFields?.indexOf(element) >= 0 ||
                t.columns?.indexOf(element) >= 0 ||
                t.rowLabelsContentEditable?.indexOf(element) >= 0);
            if (element instanceof StiRowLabel) {
                return `${table.name}.Row.${row}`;
            }
            if (element instanceof StiTotalsFieldItem) {
                return `${table.name}.0.0.${table.totalsFields.indexOf(element)}`;
            }
            else {
                return `${table.name}.${table.columns?.indexOf(element)}.${row}`;
            }
        }
        else {
            return element.name;
        }
    }
    exec(element, elements, table, col, row, total) {
        let elName = this.getElementName(element, row);
        if (elements[elName] || !("expression" in element)) {
            return;
        }
        else if (this.haveExpression(element)) {
            try {
                elements[elName] = true;
                let this_ = this;
                let Value = function (elementName) {
                    let el = this_.findElement(elementName);
                    if (el) {
                        this_.exec(el, elements);
                        return el.value;
                    }
                    return null;
                };
                let Sum = function (elements) {
                    let sum = 0;
                    try {
                        elements.forEach((element) => {
                            if (this_.isNumber(element)) {
                                sum += element;
                            }
                        });
                    }
                    catch { }
                    return sum;
                };
                let Line = function () {
                    try {
                        return row + 1;
                    }
                    catch {
                        return 0;
                    }
                };
                let Today = function () {
                    try {
                        return StiStaticHelperService.formatDate(new Date(), this_.model.form.settings.dateFormat, this_.model.form.settings.culture);
                    }
                    catch {
                        return null;
                    }
                };
                let Time = function () {
                    try {
                        return StiStaticHelperService.formatDate(new Date(), this_.model.form.settings.timeFormat, this_.model.form.settings.culture);
                    }
                    catch {
                        return null;
                    }
                };
                let Max = function (elements) {
                    let res;
                    try {
                        elements.forEach((element) => {
                            if (this_.isNumber(element)) {
                                if (res == null) {
                                    res = element;
                                }
                                res = Math.max(element, res);
                            }
                        });
                    }
                    catch { }
                    return res;
                };
                let Min = function (elements) {
                    let res;
                    try {
                        elements.forEach((element) => {
                            if (this_.isNumber(element)) {
                                if (res == null) {
                                    res = element;
                                }
                                res = Math.min(element, res);
                            }
                        });
                    }
                    catch { }
                    return res;
                };
                let Total = function (index, tableName) {
                    try {
                        let curTable = tableName ? this_.model.form.getElementByName(tableName) : table;
                        let total = typeof index == "number"
                            ? curTable.totalsFields[index - 1]
                            : curTable.totalsFields.find((t) => t.header == index);
                        this_.exec(total, elements, curTable, null, null, index);
                        return total.value;
                    }
                    catch { }
                };
                let Count = function (elements) {
                    try {
                        return elements.length;
                    }
                    catch {
                        return 0;
                    }
                };
                let Col = function (name, tableName) {
                    try {
                        let curTable = tableName ? this_.model.form.getElementByName(tableName) : table;
                        let column = this_.isNumber(name)
                            ? curTable.columns[name - 1]
                            : curTable.columns.find((c) => c.label.toLowerCase() == name.toLowerCase());
                        let result = [];
                        column["cells"].forEach((cell, index) => {
                            try {
                                this_.exec(column, elements, curTable, curTable.columns.indexOf(column), index);
                                result.push(cell["value"] != undefined ? cell.value : cell);
                            }
                            catch {
                                result.push(undefined);
                            }
                        });
                        return row != null ? result[row] : result;
                    }
                    catch { }
                };
                let Row = function (name, tableName) {
                    try {
                        let curTable = tableName ? this_.model.form.getElementByName(tableName) : table;
                        let rowIndex = this_.isNumber(name)
                            ? name - 1
                            : curTable.rowLabels.findIndex((value) => value.toLowerCase() == name.toLowerCase());
                        let result = [];
                        curTable.columns.forEach((ccol, index) => {
                            try {
                                let cell = ccol["cells"][rowIndex];
                                if (typeof cell == "number") {
                                    result.push(cell);
                                }
                                else {
                                    this_.exec(cell, elements, curTable, index, rowIndex);
                                    result.push(cell["value"] != undefined ? cell.value : cell);
                                }
                            }
                            catch {
                                result.push(undefined);
                            }
                        });
                        return col != null ? result[col] : result;
                    }
                    catch { }
                };
                let Cell = function (colIndex, rowIndex, tableName) {
                    try {
                        let curTable = tableName ? this_.model.form.getElementByName(tableName) : table;
                        let ccol = this_.isNumber(colIndex)
                            ? curTable.columns[colIndex - 1]
                            : curTable.columns.find((c) => c.label == colIndex);
                        let curRowIndex = this_.isNumber(rowIndex)
                            ? rowIndex - 1
                            : curTable.rowLabels.findIndex((value) => value.toLowerCase() == rowIndex.toLowerCase());
                        let cell = ccol["cells"][curRowIndex];
                        this_.exec(cell["value"] != undefined ? cell : ccol, elements, curTable, colIndex, rowIndex);
                        return cell["value"] != undefined ? cell.value : cell;
                    }
                    catch { }
                };
                let regex = /(\{.+?\})/g;
                let exp = element["expression"].toString();
                let exec;
                let displayValue = exp;
                while ((exec = regex.exec(exp)) !== null) {
                    let value = this.isSystemVariables(exec[0]) ? eval(this.replaceSystemVariables(exec[0])) : eval(exec[0]);
                    if (element instanceof StiRowLabel) {
                        value = value;
                    }
                    else {
                        value = typeof value == "function" ? "" : value;
                        value = Number.isNaN(value) || value === undefined ? exec[0] : value;
                    }
                    if (element instanceof StiLabelColumnItem) {
                        element.cells[row] = value;
                    }
                    else if (element instanceof StiRowLabel) {
                        element.value = exec.input;
                    }
                    else {
                        element.value = value;
                    }
                    if (this_.isNumber(value) && !this_.isSystemVariables(exec[0])) {
                        let formattedElement = element instanceof StiLabelElement ? this_.model.form.settings : element;
                        value = this_.model.getFormattedValue(formattedElement, value);
                    }
                    displayValue = displayValue.replace(exec[0], Number.isNaN(value) || value === undefined ? exec[0] : value);
                    if (exec.index > 1 &&
                        !(element instanceof StiLabelElement) &&
                        !(element instanceof StiRowLabel)) {
                        if (element instanceof StiLabelColumnItem) {
                            element.cells[row] = displayValue;
                        }
                        else {
                            element.value = displayValue;
                        }
                    }
                }
                if (element instanceof StiLabelElement || element instanceof StiRowLabel) {
                    element.displayValue = displayValue;
                }
            }
            catch {
                this.resetValue(element, row, element["expression"]);
            }
        }
        else {
            this.resetValue(element, row, element["expression"]);
        }
    }
    replaceSystemVariables(expressionString) {
        let value = expressionString.replace(/\s/g, "").toLowerCase();
        let startIndex;
        let slicedValue;
        if (value.indexOf("line") != -1) {
            startIndex = value.indexOf("line");
        }
        else if (value.indexOf("today") != -1) {
            startIndex = value.indexOf("today");
        }
        else {
            startIndex = value.indexOf("time");
        }
        if (value.slice(startIndex, startIndex + 5) == "today") {
            slicedValue = value.slice(startIndex, startIndex + 5);
        }
        else {
            slicedValue = value.slice(startIndex, startIndex + 4);
        }
        let valueForReplace = slicedValue.split();
        valueForReplace.push("(");
        valueForReplace.push(")");
        let resultString = valueForReplace.join().replace(/,/g, "");
        resultString = resultString[0].toUpperCase() + resultString.slice(1);
        return value.replace(slicedValue, resultString);
    }
    resetValue(element, row, expression) {
        if (element instanceof StiLabelElement) {
            element.displayValue = undefined;
            element.value = null;
        }
        else {
            let value = this.haveExpression(element) && expression?.toString() == parseFloat(expression).toString()
                ? parseFloat(expression)
                : expression?.toString() == parseFloat(expression).toString()
                    ? parseFloat(expression)
                    : expression;
            if (element instanceof StiLabelColumnItem) {
                element.cells[row] = value;
            }
            else {
                element.value = value;
            }
        }
    }
    isNumber(value) {
        return typeof value === "number" && !isNaN(value);
    }
    haveExpression(element) {
        let str = element["expression"];
        let regex = /(\{.+?\})/g;
        let regex2 = /{.+?\}/g;
        return element instanceof StiLabelElement || element instanceof StiRowLabel
            ? regex.test(str)
            : (element instanceof StiTotalsFieldItem || element instanceof StiLabelColumnItem) && regex2.test(str);
    }
    isSystemVariables(string) {
        let value = string.replace(/\s/g, "");
        return (value.toLowerCase().indexOf("line") != -1 ||
            value.toLowerCase().indexOf("today") != -1 ||
            value.toLowerCase().indexOf("time") != -1);
    }
    findElement(name) {
        let el;
        this.model.form.pages.forEach((p) => p.allElements.forEach((e) => {
            if (e.name == name) {
                el = e;
            }
        }));
        return el;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiExpressionService, deps: [{ token: StiModelService }, { token: StiMouseService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiExpressionService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiExpressionService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiMouseService }] });

class StiTableLabelComponent {
    get cell() {
        let value = this.expressionService.isSystemVariables(this.item.expression)
            ? this.item.cells[this.index]
            : this.model.getFormattedValue(this.item, this.item.cells[this.index]);
        return `${this.item.prefix}${value != null && value != undefined ? value : ""}${this.item.suffix}`;
    }
    /* public set cell(value) {
      this.item.cells[this.index] = value;
    } */
    constructor(model, expressionService) {
        this.model = model;
        this.expressionService = expressionService;
        this.isClone = false;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableLabelComponent, deps: [{ token: StiModelService }, { token: StiExpressionService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTableLabelComponent, selector: "sti-table-label-component", inputs: { item: "item", index: "index", object: "object", disabled: "disabled", isClone: "isClone" }, ngImport: i0, template: `<div
    class="cell"
    [style.text-align]="'inherit'"
    (mousedown)="model.canDrag = false"
    (mouseup)="model.canDrag = true"
  >
    <span
      [style]="object.font.htmlStyle()"
      [style.text-decoration]="'none'"
      [style.width]="'100%'"
      [style.border-color]="item.cellBorderColor.toHtmlColor()"
      [style.color]="item.cellForeColor.toHtmlColor()"
      [style.background-color]="item.cellBackColor.toHtmlColor()"
      [style.whiteSpace]="'nowrap'"
      >{{ cell }}</span
    >
  </div>`, isInline: true, styles: [".cell{display:flex;width:100%}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableLabelComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-table-label-component", template: `<div
    class="cell"
    [style.text-align]="'inherit'"
    (mousedown)="model.canDrag = false"
    (mouseup)="model.canDrag = true"
  >
    <span
      [style]="object.font.htmlStyle()"
      [style.text-decoration]="'none'"
      [style.width]="'100%'"
      [style.border-color]="item.cellBorderColor.toHtmlColor()"
      [style.color]="item.cellForeColor.toHtmlColor()"
      [style.background-color]="item.cellBackColor.toHtmlColor()"
      [style.whiteSpace]="'nowrap'"
      >{{ cell }}</span
    >
  </div>`, styles: [".cell{display:flex;width:100%}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiExpressionService }], propDecorators: { item: [{
                type: Input
            }], index: [{
                type: Input
            }], object: [{
                type: Input
            }], disabled: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiTableColumnComponent {
    getColumnAlignment(column) {
        return Enum.getName(StiHorizontalAlignment, column.cellAlignment);
    }
    changeState(column, i) {
        if (column instanceof StiRadioButtonColumnItem) {
            if (this.element instanceof StiTableElement) {
                this.element.columns.forEach((col) => {
                    if (col instanceof StiRadioButtonColumnItem && col != column) {
                        col.cells[i].isChecked = false;
                    }
                });
            }
            if (!column.cells[i].isChecked) {
                column.cells[i].isChecked = true;
            }
        }
        else {
            column.cells[i].isChecked = !column.cells[i].isChecked;
        }
    }
    constructor(model) {
        this.model = model;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableColumnComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTableColumnComponent, selector: "sti-table-column-component", inputs: { column: "column", index: "index", element: "element" }, ngImport: i0, template: `
    <sti-table-label-component
      *ngIf="column && column.type == 'LabelColumn'"
      [item]="column"
      [disabled]="element?.readOnly"
      [style.text-align]="getColumnAlignment(column)"
      [index]="index"
      [object]="element"
      [style.overflow]="'hidden'"
      [style.width]="'100%'"
    ></sti-table-label-component>
    <sti-table-input-text-component
      *ngIf="column && column.type == 'TextBoxColumn'"
      [item]="column"
      [disabled]="element?.readOnly"
      [index]="index"
      [object]="element"
      [style.overflow]="'hidden'"
      [style.width]="'100%'"
    ></sti-table-input-text-component>
    <sti-table-radio-button-component
      *ngIf="column && column.type == 'RadioButtonColumn'"
      [item]="column"
      [alignment]="getColumnAlignment(column)"
      [disabled]="element?.readOnly"
      [index]="index"
      [object]="element"
      (buttonClick)="changeState(column, index)"
      [style.width]="'100%'"
    ></sti-table-radio-button-component>
    <sti-number-component
      *ngIf="column && column.type == 'NumberBoxColumn'"
      [element]="column"
      [index]="index"
      [table]="element"
      [style.width]="'100%'"
      [style.overflow]="'hidden'"
    ></sti-number-component>
    <sti-table-combobox-component
      *ngIf="column && column.type == 'ComboBoxColumn'"
      [item]="column"
      [disabled]="element?.readOnly"
      [index]="index"
      [object]="element"
      [style.width]="'100%'"
      [style.overflow]="'hidden'"
    ></sti-table-combobox-component>
    <sti-table-checkbox-component
      *ngIf="column && column.type == 'CheckBoxColumn'"
      [item]="column"
      [disabled]="element?.readOnly"
      [object]="element"
      [alignment]="getColumnAlignment(column)"
      [index]="index"
      (buttonClick)="changeState(column, index)"
      [style.width]="'100%'"
    ></sti-table-checkbox-component>
  `, isInline: true, styles: [""], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiNumberComponent, selector: "sti-number-component", inputs: ["element", "index", "table"] }, { kind: "component", type: StiTableInputTextComponent, selector: "sti-table-input-text-component", inputs: ["item", "index", "object", "disabled", "isClone"] }, { kind: "component", type: StiTableRadioButtonComponent, selector: "sti-table-radio-button-component", inputs: ["item", "index", "disabled", "isClone", "object", "alignment"], outputs: ["buttonClick"] }, { kind: "component", type: StiTableComboboxComponent, selector: "sti-table-combobox-component", inputs: ["item", "index", "object", "disabled", "isClone"] }, { kind: "component", type: StiTableCheckboxComponent, selector: "sti-table-checkbox-component", inputs: ["item", "index", "object", "disabled", "isClone", "alignment"], outputs: ["buttonClick"] }, { kind: "component", type: StiTableLabelComponent, selector: "sti-table-label-component", inputs: ["item", "index", "object", "disabled", "isClone"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableColumnComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-table-column-component", template: `
    <sti-table-label-component
      *ngIf="column && column.type == 'LabelColumn'"
      [item]="column"
      [disabled]="element?.readOnly"
      [style.text-align]="getColumnAlignment(column)"
      [index]="index"
      [object]="element"
      [style.overflow]="'hidden'"
      [style.width]="'100%'"
    ></sti-table-label-component>
    <sti-table-input-text-component
      *ngIf="column && column.type == 'TextBoxColumn'"
      [item]="column"
      [disabled]="element?.readOnly"
      [index]="index"
      [object]="element"
      [style.overflow]="'hidden'"
      [style.width]="'100%'"
    ></sti-table-input-text-component>
    <sti-table-radio-button-component
      *ngIf="column && column.type == 'RadioButtonColumn'"
      [item]="column"
      [alignment]="getColumnAlignment(column)"
      [disabled]="element?.readOnly"
      [index]="index"
      [object]="element"
      (buttonClick)="changeState(column, index)"
      [style.width]="'100%'"
    ></sti-table-radio-button-component>
    <sti-number-component
      *ngIf="column && column.type == 'NumberBoxColumn'"
      [element]="column"
      [index]="index"
      [table]="element"
      [style.width]="'100%'"
      [style.overflow]="'hidden'"
    ></sti-number-component>
    <sti-table-combobox-component
      *ngIf="column && column.type == 'ComboBoxColumn'"
      [item]="column"
      [disabled]="element?.readOnly"
      [index]="index"
      [object]="element"
      [style.width]="'100%'"
      [style.overflow]="'hidden'"
    ></sti-table-combobox-component>
    <sti-table-checkbox-component
      *ngIf="column && column.type == 'CheckBoxColumn'"
      [item]="column"
      [disabled]="element?.readOnly"
      [object]="element"
      [alignment]="getColumnAlignment(column)"
      [index]="index"
      (buttonClick)="changeState(column, index)"
      [style.width]="'100%'"
    ></sti-table-checkbox-component>
  ` }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { column: [{
                type: Input
            }], index: [{
                type: Input
            }], element: [{
                type: Input
            }] } });

class StiTableComponent {
    get selected() {
        return this.model.selectedComponent?.element == this.element;
    }
    get canAddRow() {
        return this._canAddRow;
    }
    set canAddRow(value) {
        let oldValue = this._canAddRow;
        if (oldValue != value) {
            this._canAddRow = value;
            this.cdr.detectChanges();
        }
    }
    get canDeleteRow() {
        return this._canDeleteRow;
    }
    set canDeleteRow(value) {
        let oldValue = this._canDeleteRow;
        if (oldValue != value) {
            this._canDeleteRow = value;
            this.cdr.detectChanges();
        }
    }
    checkAbilityToAddRow() {
        if (this.isInitialized) {
            let tableRect = this.model.getPositionRelativeToForm(this.table?.nativeElement);
            let totalsRect = this.model.getPositionRelativeToForm(this.totals?.nativeElement);
            let tableRowRect = this.model.getPositionRelativeToForm(this.tableRow?.nativeElement);
            let componentLabelRect = this.model.getPositionRelativeToForm(this.componentLabel?.nativeElement);
            let componentDescriptionRect = this.model.getPositionRelativeToForm(this.componentDescription?.nativeElement);
            if (this.model.previewMode) {
                let componentInnerHeight = this.element.height - this.element.padding.top - this.element.padding.bottom;
                this.canAddRow =
                    componentInnerHeight -
                        (this.element.label.value && this.element.label.alignment == StiLabelAlignment.Top
                            ? componentLabelRect?.height
                            : 0) -
                        (this.element.description.value ? componentDescriptionRect?.height : 0) -
                        (this.element.useTotals ? totalsRect?.height : 0) -
                        tableRect?.height >
                        tableRowRect?.height;
            }
            else {
                let parentContainer = this.model.getElementPage(this.element) ?? this.model.getElementPanel(this.element);
                this.canAddRow =
                    parentContainer.contentAreaHeight -
                        (this.element.label.value && this.element.label.alignment == StiLabelAlignment.Top
                            ? componentLabelRect?.height
                            : 0) -
                        (this.element.description.value ? componentDescriptionRect?.height : 0) -
                        (this.element.useTotals ? totalsRect?.height : 0) -
                        tableRect?.height >
                        tableRowRect?.height;
            }
        }
        else {
            this.canAddRow = false;
        }
    }
    getMaxHeight() {
        if (!this.isInitialized) {
            return 0;
        }
        let tBodyRec = this.tBody ? this.model.getPositionRelativeToForm(this.tBody?.nativeElement) : 0;
        let totalsRec = this.totals ? this.model.getPositionRelativeToForm(this.totals?.nativeElement) : 0;
        return Number((this.element.geometry.bottom -
            this.element.padding.bottom -
            this.element.padding.top -
            this.getSizeWithZoom(tBodyRec instanceof DOMRect ? tBodyRec.height : 0) -
            this.getSizeWithZoom(totalsRec instanceof DOMRect ? totalsRec.height : 0) -
            this.innerMargin).toFixed(2));
    }
    checkAbilityToDeleteRow() {
        this.canDeleteRow = this.element.rowLabels.length > 1;
    }
    canDeleteColumn() {
        return this.element.columns.length > 0 && this.isInitialized ? true : false;
    }
    getSizeWithZoom(size) {
        return size / this.model.zoom;
    }
    isOverMaxHeight() {
        if (!this.isInitialized) {
            return false;
        }
        let parentContainer = this.model.getElementPage(this.element) ?? this.model.getElementPanel(this.element);
        return this.element.height == parentContainer.contentAreaHeight - this.element.y;
    }
    updatePropertyGrid(column, event) {
        if (!this.element.showColumnsEditor) {
            this.element.showColumnsEditor = true;
            this.model.needToRefresh.next(true);
        }
        setTimeout(() => {
            let index = this.element.columns.findIndex((item) => item == column);
            if (this.model.currentContentEditableItemIndex != index ||
                this.model.previousSelectedComponent?.element != this.element) {
                this.model.currentContentEditableItem.next(index);
                this.model.currentContentEditableItemIndex = index;
            }
        }, 0);
    }
    get totalsWidth() {
        return this.element?.label?.alignment == StiLabelAlignment.Top
            ? this.element?.width - this.element.padding.left - this.element.padding.right
            : this.element?.width - this.element?.label?.width - this.element.padding.left - this.element.padding.right;
    }
    getPageColor() {
        if (this.model.selectedComponent.element == this.element) {
            if (this.model.getElementPage(this.element)) {
                return this.model.getElementPage(this.element)?.backgroundColor?.toHtmlColor();
            }
            else {
                let currentElement = this.model.getElementPanel(this.element);
                if (this.model.getElementPage(currentElement)) {
                    return this.model.getElementPage(currentElement)?.backgroundColor?.toHtmlColor();
                }
                else {
                    while (this.model.getElementPage(currentElement)) {
                        currentElement = this.model.getElementPanel(currentElement);
                    }
                    return this.model.getElementPage(currentElement)?.backgroundColor?.toHtmlColor();
                }
            }
        }
        else {
            return "transparent";
        }
    }
    get align() {
        return "start";
    }
    get contentAlign() {
        return this.element["label"]["alignment"] == StiLabelAlignment.Right ? "flex-end" : "start";
    }
    get width() {
        if (this.element.label.alignment == StiLabelAlignment.Top) {
            return "100%";
        }
        else {
            return this.element.label.width + "px";
        }
    }
    get margin() {
        return this.element["label"]["alignment"] == StiLabelAlignment.Top && this.element.label.value ? "10" : "0";
    }
    get headerAlignment() {
        return Enum.getName(StiHorizontalAlignment, this.element.tableHeaderAlignment);
    }
    get rowAlignment() {
        return Enum.getName(StiHorizontalAlignment, this.element.rowLabelsHorizontalAlignment);
    }
    get totalVerticalAlignment() {
        if (this.element.totalsRowHeaderVerticalAlignment == StiVerticalAlignment.Top) {
            return "flex-start";
        }
        else if (this.element.totalsRowHeaderVerticalAlignment == StiVerticalAlignment.Bottom) {
            return "flex-end";
        }
        else {
            return "center";
        }
    }
    get totalHorizontalAlignment() {
        if (this.element.totalsRowHeaderHorizontalAlignment == StiHorizontalAlignment.Left) {
            return "flex-start";
        }
        else if (this.element.totalsRowHeaderHorizontalAlignment == StiHorizontalAlignment.Right) {
            return "flex-end";
        }
        else {
            return "center";
        }
    }
    onHeaderClick(event, item) {
        if (this.model.previewMode) {
            return;
        }
        let form = document.querySelector("stimulsoft-forms");
        form?.classList.add("unselectable");
        this.model.canDrag = false;
        if (this.editableContentService.editableContent != item) {
            this.columnDraggableService.onHeaderClick(event, item, this.element.columns, true, this.element);
        }
    }
    changeStyle(elem) { }
    get tableBackColor() {
        return this.element?.backgroundColor.toHtmlColor()
            ? this.element.backgroundColor.toHtmlColor()
            : Color.transparent().toHtmlColor();
    }
    addColumn() {
        this.element.addColumnLikeLast();
        this.model.showColumnPreview(this.element.columns.length - 1);
    }
    addRow() {
        this.element.addRow();
    }
    deleteColumn() {
        this.element.deleteLastColumn();
    }
    deleteRow() {
        this.element.deleteLastRow();
    }
    getColumnAlignment(column) {
        return Enum.getName(StiHorizontalAlignment, column.cellAlignment);
    }
    getBorder(pen, isVisible, isDragPreview = false) {
        return isVisible || isDragPreview ? pen.toHtmlBorder() : "transparent";
    }
    getBorderWidth(pen, isDragPreview) {
        let res = isDragPreview ? Number(pen.width) + 2 : pen.width;
        return res + "px";
    }
    getColumnBackColor(column, index) {
        if (this.element.alternateRowColors) {
            if (index % 2 === 0) {
                return this.element.oddRowsStyle.toHtmlColor();
            }
            else {
                return this.element.evenRowsStyle.toHtmlColor();
            }
        }
        else {
            return column.backgroundColor?.toHtmlColor() ?? column.eBackgroundColor.toHtmlColor();
        }
    }
    getColumnForeColor(column, index) {
        if (this.element.alternateRowColors) {
            if (index % 2 === 0) {
                return this.element.oddRowsTextColor.toHtmlColor();
            }
            else {
                return this.element.evenRowsTextColor.toHtmlColor();
            }
        }
        else {
            return column.cellForeColor?.toHtmlColor() ?? column.eColor.toHtmlColor();
        }
    }
    constructor(model, draggableService, columnDraggableService, editableContentService, cdr, mouseService) {
        this.model = model;
        this.draggableService = draggableService;
        this.columnDraggableService = columnDraggableService;
        this.editableContentService = editableContentService;
        this.cdr = cdr;
        this.mouseService = mouseService;
        this.isClone = false;
        this.minWidth = 40;
        this.isDrag = false;
        this.canDrag = false;
        this.isInitialized = false;
        this.isActive = false;
        this._canAddRow = false;
        this._canDeleteRow = false;
        this.innerMargin = 5;
    }
    ngAfterContentChecked() {
        if (!this.model.draggingElement &&
            !this.isClone &&
            (this.model?.selectedComponent?.element == this.element || this.isActive)) {
            this.checkAbilityToAddRow();
            this.checkAbilityToDeleteRow();
        }
    }
    ngOnDestroy() {
        this.isInitialized = false;
    }
    ngAfterViewInit() {
        if (this.element && !this.isClone) {
            this.element.element = this.tableTr;
            if (this.element != this.model.draggingElement) {
                setTimeout(() => {
                    this.isInitialized = true;
                });
            }
        }
    }
    ngOnInit() { }
    changeState(column, i) {
        if (column instanceof StiRadioButtonColumnItem) {
            column.cells.forEach((cell) => {
                cell.isChecked = false;
            });
        }
        column.cells[i].isChecked = !column.cells[i].isChecked;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableComponent, deps: [{ token: StiModelService }, { token: StiDraggableService }, { token: StiColumnDraggableService }, { token: StiEditableContentService }, { token: i0.ChangeDetectorRef }, { token: StiMouseService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTableComponent, selector: "sti-table-component", inputs: { element: "element", isClone: "isClone" }, viewQueries: [{ propertyName: "tableTr", first: true, predicate: ["tableTr"], descendants: true }, { propertyName: "tBody", first: true, predicate: ["tBody"], descendants: true }, { propertyName: "totals", first: true, predicate: ["totals"], descendants: true }, { propertyName: "table", first: true, predicate: ["table"], descendants: true }, { propertyName: "tableRow", first: true, predicate: ["tableRow"], descendants: true }, { propertyName: "componentDescription", first: true, predicate: ["description"], descendants: true }, { propertyName: "componentLabel", first: true, predicate: ["label"], descendants: true }], ngImport: i0, template: ` <sti-component
    [element]="element"
    [isClone]="isClone"
    (mouseenter)="model.previewMode ? (isActive = true) : ''"
    (mouseleave)="model.previewMode ? (isActive = false) : ''"
  >
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [style.align-self]="align"
      [style.text-align]="contentAlign"
      [editableContent]="element.label"
      [style.width]="width"
    ></sti-editable-content-component>
    <table
      class="outer-table"
      [style.width]="'100%'"
      [style.height]="'max-content'"
      [style.margin-top.px]="element?.getTopMargin()"
    >
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
          #label
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'">
          <div class="sti-table" #table>
            <div [style.display]="'flex'">
              <table
                class="column-drop-area"
                [style.background-color]="element?.backgroundColor.toHtmlColor()"
                [style.align-self]="align"
              >
                <thead>
                  <tr #tableTr>
                    <th
                      *ngIf="element?.showRowLabels"
                      [id]="0"
                      (mousemove)="columnDraggableService.fromTable ? (columnDraggableService.insertIndex = 0) : return"
                      [style.justify-content]="headerAlignment"
                      [style.color]="element?.tableHeaderColor.toHtmlColor()"
                      [style.background-color]="element?.tableHeaderBackgroundColor.toHtmlColor()"
                      [style.width.px]="!isClone ? element?.rowLabelsWidth : 0"
                      [style.max-height.px]="
                        !isClone && !model.pdfPreviewMode && isInitialized && isOverMaxHeight()
                          ? getMaxHeight()
                          : 'auto'
                      "
                      [style.border-top]="getBorder(element?.border.pen, element?.border.drawTop)"
                      [style.border-left]="getBorder(element?.border.pen, element?.border.drawLeft)"
                      [style.border-bottom]="
                        getBorder(element?.rowHeadersBorder.pen, element?.rowHeadersBorder.drawTop)
                      "
                      [style.border-right]="
                        element.columns.length > 0 ? '' : getBorder(element?.border.pen, element?.border.drawRight)
                      "
                      [style.padding]="'5px 0px 5px 5px'"
                    >
                      <sti-editable-content-component
                        [editableContent]="element"
                        [alignment]="element?.tableHeaderAlignment"
                        [isTableHeader]="true"
                        [style.width]="'100%'"
                        [hideEmpty]="false"
                        [active]="selected"
                      ></sti-editable-content-component>
                      <sti-table-column-resizer
                        [resizableItem]="element"
                        [element]="element"
                        [style.height]="'100%'"
                      ></sti-table-column-resizer>
                    </th>
                    <th
                      *ngFor="let column of element.columns; index as idx"
                      [id]="idx + 1"
                      (mousemove)="
                        columnDraggableService.fromTable ? (columnDraggableService.insertIndex = idx + 1) : return
                      "
                      class="drag-item sti-table-th"
                      (click)="model.showColumnPreview(idx)"
                      [style]="element.font.htmlStyle()"
                      [style.justify-content]="getColumnAlignment(column)"
                      (mousedown)="onHeaderClick($event, column)"
                      [style.color]="column?.headerForeColor.toHtmlColor()"
                      [style.background-color]="column?.headerBackColor.toHtmlColor()"
                      [style.width.px]="!isClone ? column?.width : 0"
                      [style.height.px]="
                        isClone && !model.pdfPreviewMode ? element?.element?.nativeElement?.clientHeight : 'auto'
                      "
                      [style.max-height.px]="
                        !isClone && !model.pdfPreviewMode && isInitialized && isOverMaxHeight()
                          ? getMaxHeight()
                          : 'auto'
                      "
                      [style.transition]="columnDraggableService.fromTable ? 'border-width 50ms linear' : ''"
                      [style.border-top]="
                        getBorder(element?.columnHeadersBorder.pen, element?.columnHeadersBorder.drawTop) !=
                        'transparent'
                          ? getBorder(element?.columnHeadersBorder.pen, element?.columnHeadersBorder.drawTop)
                          : getBorder(element?.border.pen, element?.border.drawTop)
                      "
                      [style.border-bottom]="
                        getBorder(element?.columnHeadersBorder.pen, element?.columnHeadersBorder.drawBottom)
                      "
                      [style.border-right]="
                        getBorder(
                          element?.columnHeadersBorder.pen,
                          element?.columnHeadersBorder.drawRight,
                          columnDraggableService.parentElement == element &&
                            columnDraggableService.fromTable &&
                            columnDraggableService.insertIndex == idx + 1
                            ? true
                            : false
                        ) != 'transparent'
                          ? idx == element.columns.length - 1
                            ? getBorder(
                                element?.columnHeadersBorder.pen,
                                element?.columnHeadersBorder.drawRight,
                                columnDraggableService.parentElement == element &&
                                  columnDraggableService.fromTable &&
                                  columnDraggableService.insertIndex == idx + 1
                                  ? true
                                  : false
                              )
                            : getBorder(
                                element?.gridLines.pen,
                                element?.gridLines.drawVertical,
                                columnDraggableService.parentElement == element &&
                                  columnDraggableService.fromTable &&
                                  columnDraggableService.insertIndex == idx + 1
                                  ? true
                                  : false
                              )
                          : idx == element.columns.length - 1
                          ? getBorder(
                              element?.border.pen,
                              element?.border.drawRight,
                              columnDraggableService.parentElement == element &&
                                columnDraggableService.fromTable &&
                                columnDraggableService.insertIndex == idx + 1
                                ? true
                                : false
                            )
                          : getBorder(
                              element?.gridLines.pen,
                              element?.gridLines.drawVertical,
                              columnDraggableService.parentElement == element &&
                                columnDraggableService.fromTable &&
                                columnDraggableService.insertIndex == idx + 1
                                ? true
                                : false
                            )
                      "
                      [style.border-left]="
                        idx == 0
                          ? getBorder(
                              element?.columnHeadersBorder.pen,
                              element?.columnHeadersBorder.drawLeft,
                              columnDraggableService.parentElement == element &&
                                columnDraggableService.fromTable &&
                                columnDraggableService.insertIndex == 0 &&
                                idx == 0
                                ? true
                                : false
                            )
                          : ''
                      "
                      [style.border-left-width]="
                        columnDraggableService.parentElement == element &&
                        columnDraggableService.fromTable &&
                        columnDraggableService.insertIndex == 0 &&
                        idx == 0
                          ? getBorderWidth(element?.columnHeadersBorder.pen, true)
                          : getBorderWidth(element?.columnHeadersBorder.pen, false)
                      "
                      [style.border-right-width]="
                        idx != element.columns.length - 1
                          ? columnDraggableService.parentElement == element &&
                            columnDraggableService.fromTable &&
                            columnDraggableService.insertIndex == idx + 1
                            ? getBorderWidth(element?.gridLines.pen, true)
                            : getBorderWidth(element?.gridLines.pen, false)
                          : element?.columnHeadersBorder.drawRight
                          ? columnDraggableService.parentElement == element &&
                            columnDraggableService.fromTable &&
                            columnDraggableService.insertIndex == idx + 1
                            ? getBorderWidth(element?.columnHeadersBorder.pen, true)
                            : getBorderWidth(element?.columnHeadersBorder.pen, false)
                          : columnDraggableService.parentElement == element &&
                            columnDraggableService.fromTable &&
                            columnDraggableService.insertIndex == idx + 1
                          ? getBorderWidth(element?.border.pen, true)
                          : getBorderWidth(element?.border.pen, false)
                      "
                      [style.padding]="'5px 0px 5px 5px'"
                    >
                      <sti-editable-content-component
                        [eParent]="element"
                        [editableContent]="column"
                        [alignment]="column?.headerAlignment"
                        [isTableHeader]="true"
                        [style.width]="'100%'"
                        [hideEmpty]="false"
                        [active]="selected"
                      ></sti-editable-content-component>
                      <sti-table-column-resizer
                        [resizableItem]="column"
                        [element]="element"
                        [index]="idx"
                        *ngIf="idx != element.columns.length - 1"
                        [style.height]="'100%'"
                      ></sti-table-column-resizer>
                    </th>
                  </tr>
                </thead>
                <tbody #tBody>
                  <tr *ngFor="let rowLabel of element.rowLabelsContentEditable; index as i" #tableRow>
                    <td
                      *ngIf="element?.showRowLabels"
                      [attr.data-label]="element.tableHeaderText"
                      [id]="0"
                      (mousemove)="columnDraggableService.fromTable ? (columnDraggableService.insertIndex = 0) : return"
                      [style]="element.font.htmlStyle()"
                      [style.justify-content]="rowAlignment"
                      [style.color]="getColumnForeColor(rowLabel, i)"
                      [style.width.px]="!isClone ? element?.rowLabelsWidth : 0"
                      [style.background-color]="getColumnBackColor(rowLabel, i)"
                      [style.border-left]="
                        getBorder(element?.rowHeadersBorder.pen, element?.rowHeadersBorder.drawLeft) != 'transparent'
                          ? getBorder(element?.rowHeadersBorder.pen, element?.rowHeadersBorder.drawLeft)
                          : getBorder(element?.border.pen, element?.border.drawLeft)
                      "
                      [style.border-bottom]="
                        getBorder(element?.rowHeadersBorder.pen, element?.rowHeadersBorder.drawBottom) != 'transparent'
                          ? i == element.rowLabels.length - 1
                            ? getBorder(element?.rowHeadersBorder.pen, element?.rowHeadersBorder.drawBottom)
                            : getBorder(element?.gridLines.pen, element?.gridLines.drawHorizontal)
                          : i == element.rowLabels.length - 1
                          ? getBorder(element?.border.pen, element?.border.drawBottom)
                          : getBorder(element?.gridLines.pen, element?.gridLines.drawHorizontal)
                      "
                      [style.border-right]="
                        element.columns.length > 0
                          ? ''
                          : getBorder(element?.rowHeadersBorder.pen, element?.rowHeadersBorder.drawRight) !=
                            'transparent'
                          ? getBorder(element?.rowHeadersBorder.pen, element?.rowHeadersBorder.drawRight)
                          : getBorder(element?.border.pen, element?.border.drawRight)
                      "
                    >
                      <sti-editable-content-component
                        [eParent]="element"
                        [editableContent]="rowLabel"
                        [displayContent]="rowLabel?.displayValue"
                        [alignment]="element?.rowLabelsHorizontalAlignment"
                        [style.width]="'100%'"
                        [hideEmpty]="false"
                        [active]="selected"
                      ></sti-editable-content-component>
                    </td>
                    <td
                      *ngFor="let column of element.columns; index as ind"
                      [attr.data-label]="column.label"
                      [id]="ind + 1"
                      (mousedown)="updatePropertyGrid(column, $event)"
                      (mousemove)="
                        columnDraggableService.fromTable ? (columnDraggableService.insertIndex = ind + 1) : return
                      "
                      class="drag-item sti-table-td"
                      [style.justify-content]="getColumnAlignment(column)"
                      [style.color]="getColumnForeColor(column, i)"
                      [style.background-color]="getColumnBackColor(column, i)"
                      [style.width.px]="
                        !isClone ? (ind == element.columns.length - 1 ? column?.width + 0.04 : column?.width) : 0
                      "
                      [style.transition]="columnDraggableService.fromTable ? 'border-width 50ms linear' : ''"
                      [style.border-left]="
                        ind == 0
                          ? getBorder(
                              element?.rowHeadersBorder.pen,
                              element?.rowHeadersBorder.drawRight,
                              columnDraggableService.parentElement == element &&
                                columnDraggableService.fromTable &&
                                columnDraggableService.insertIndex == 0 &&
                                ind == 0
                                ? true
                                : false
                            )
                          : ''
                      "
                      [style.border-bottom]="
                        i == element.rowLabels.length - 1
                          ? getBorder(element?.border.pen, element?.border.drawBottom)
                          : getBorder(element?.gridLines.pen, element?.gridLines.drawHorizontal)
                      "
                      [style.border-right]="
                        ind == element.columns.length - 1
                          ? getBorder(
                              element?.border.pen,
                              element?.border.drawRight,
                              columnDraggableService.parentElement == element &&
                                columnDraggableService.fromTable &&
                                columnDraggableService.insertIndex == ind + 1
                                ? true
                                : false
                            )
                          : getBorder(
                              element?.gridLines.pen,
                              element?.gridLines.drawVertical,
                              columnDraggableService.parentElement == element &&
                                columnDraggableService.fromTable &&
                                columnDraggableService.insertIndex == ind + 1
                                ? true
                                : false
                            )
                      "
                      [style.border-left-width]="
                        columnDraggableService.parentElement == element &&
                        columnDraggableService.fromTable &&
                        columnDraggableService.insertIndex == 0 &&
                        ind == 0
                          ? getBorderWidth(element?.rowHeadersBorder.pen, true)
                          : getBorderWidth(element?.rowHeadersBorder.pen, false)
                      "
                      [style.border-right-width]="
                        ind != element.columns.length - 1
                          ? columnDraggableService.parentElement == element &&
                            columnDraggableService.fromTable &&
                            columnDraggableService.insertIndex == ind + 1
                            ? getBorderWidth(element?.gridLines.pen, true)
                            : getBorderWidth(element?.gridLines.pen, false)
                          : element?.columnHeadersBorder.drawRight
                          ? columnDraggableService.parentElement == element &&
                            columnDraggableService.fromTable &&
                            columnDraggableService.insertIndex == ind + 1
                            ? getBorderWidth(element?.border.pen, true)
                            : getBorderWidth(element?.border.pen, false)
                          : columnDraggableService.parentElement == element &&
                            columnDraggableService.fromTable &&
                            columnDraggableService.insertIndex == ind + 1
                          ? getBorderWidth(element?.border.pen, true)
                          : getBorderWidth(element?.border.pen, false)
                      "
                    >
                      <sti-table-column-component
                        [column]="column"
                        [index]="i"
                        [element]="element"
                        [style.width]="'100%'"
                      ></sti-table-column-component>
                    </td>
                  </tr>
                </tbody>
              </table>
              <div
                class="right"
                *ngIf="
                  element == model.selectedComponent?.element &&
                  model.draggingElement != element &&
                  !model.previewMode
                "
              >
                <div class="right-control-panel">
                  <div
                    class="add control-button"
                    [style.margin-bottom.px]="5"
                    [style.background-color]="getPageColor()"
                    (click)="addColumn()"
                  >
                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
                      <rect class="plus" width="16" height="16" [attr.fill]="getPageColor()" />
                      <path
                        d="M11.5656 8.905H8.97358V11.5656H7.16329V8.905H4.57129V7.23186H7.16329V4.57129H8.97358V7.23186H11.5656V8.905Z"
                        fill="#898989"
                      />
                    </svg>
                  </div>
                  <div
                    class="delete control-button {{ canDeleteColumn() ? '' : 'disabled' }}"
                    [style.background-color]="getPageColor()"
                    (click)="deleteColumn()"
                  >
                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
                      <path
                        d="M6 8H8H10"
                        stroke="#898989"
                        stroke-width="2"
                        stroke-linecap="square"
                        stroke-linejoin="round"
                      />
                    </svg>
                  </div>
                </div>
              </div>
            </div>
            <div
              class="bottom"
              *ngIf="
                (element == model.selectedComponent?.element &&
                  model.draggingElement != element &&
                  !model.previewMode) ||
                (model.previewMode && !element.readOnly && element.dynamicRows && isActive)
              "
            >
              <div class="bottom-control-panel">
                <div
                  class="add control-button {{ canAddRow ? '' : 'disabled' }}"
                  [style.margin-right.px]="5"
                  [style.background-color]="getPageColor()"
                  (click)="addRow()"
                >
                  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
                    <rect class="plus" width="16" height="16" [attr.fill]="getPageColor()" />
                    <path
                      d="M11.5656 8.905H8.97358V11.5656H7.16329V8.905H4.57129V7.23186H7.16329V4.57129H8.97358V7.23186H11.5656V8.905Z"
                      fill="#898989"
                    />
                  </svg>
                </div>
                <div
                  class="delete control-button {{ canDeleteRow ? '' : 'disabled' }}"
                  [style.background-color]="getPageColor()"
                  (click)="deleteRow()"
                >
                  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
                    <path
                      d="M6 8H8H10"
                      stroke="#898989"
                      stroke-width="2"
                      stroke-linecap="square"
                      stroke-linejoin="round"
                    />
                  </svg>
                </div>
              </div>
            </div>
          </div>
          <div class="totals" *ngIf="element?.useTotals" #totals>
            <div
              class="totals-header"
              [style.align-items]="totalVerticalAlignment"
              [style.justify-content]="totalHorizontalAlignment"
            >
              <sti-editable-content-component
                [editableContent]="element.totalsRowHeaderEditableContent"
                [hideEmpty]="false"
                [active]="selected"
                [isTableTotalHeader]="true"
              ></sti-editable-content-component>
            </div>
            <div class="totals-fields">
              <sti-table-totals-field-component
                [fields]="element.totalsFields"
                [object]="element"
              ></sti-table-totals-field-component>
            </div>
          </div>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0" #description>
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, isInline: true, styles: [".outer-table table{border-spacing:0}.outer-table tr{height:max-content;padding:0;margin:0}.outer-table td{height:100%;padding:0;margin:0}.add{border-radius:3px;background-color:transparent;display:flex;border:1px solid lightGray;justify-content:center;align-items:center;z-index:100}.disabled{opacity:.5;pointer-events:none}.right{width:0px;background-color:transparent;position:relative}.right-control-panel{height:55px;width:18px;left:3px;top:calc(50% - 22.5px);position:absolute;display:flex;flex-direction:column}.right-control-panel .control-button{height:25px}.control-button{border-radius:3px;background-color:transparent;display:flex;border:1px solid lightGray;justify-content:center;align-items:center;z-index:100}.control-button:hover{background-color:#d3d3d3!important;cursor:default}.control-button:hover .plus{fill:#d3d3d3!important;cursor:default}.bottom-control-panel{height:18px;width:55px;top:3px;left:calc(50% - 22.5px);position:absolute;display:flex}.bottom-control-panel .control-button{width:25px}.bottom{width:calc(100% - 5px);height:0px;background-color:transparent;position:relative}.table-content{min-width:260px;width:100%;display:inline-block;flex-direction:column;flex:1}table,th,td{border-collapse:collapse}th{position:relative}.sti-table th,.sti-table td{display:flex;flex-direction:row;align-items:center;overflow:hidden;padding:4px;height:auto}.sti-table table{width:100%;margin:0;padding:0;display:inline-table;table-layout:auto;border-collapse:collapse;border-spacing:0;overflow:hidden}.sti-table th{padding:3px}.sti-table tr{display:flex;flex-direction:row;flex:1}.totals{width:100%;display:flex;min-height:5px;margin-top:5px;overflow:hidden}.totals-header{display:flex;flex:1;padding:4px 0}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }, { kind: "component", type: StiTableTotalsFieldComponent, selector: "sti-table-totals-field-component", inputs: ["fields", "object", "isClone"] }, { kind: "component", type: StiTableColumnResizerComponent, selector: "sti-table-column-resizer", inputs: ["resizableItem", "element", "index"] }, { kind: "component", type: StiTableColumnComponent, selector: "sti-table-column-component", inputs: ["column", "index", "element"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-table-component", template: ` <sti-component
    [element]="element"
    [isClone]="isClone"
    (mouseenter)="model.previewMode ? (isActive = true) : ''"
    (mouseleave)="model.previewMode ? (isActive = false) : ''"
  >
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [style.align-self]="align"
      [style.text-align]="contentAlign"
      [editableContent]="element.label"
      [style.width]="width"
    ></sti-editable-content-component>
    <table
      class="outer-table"
      [style.width]="'100%'"
      [style.height]="'max-content'"
      [style.margin-top.px]="element?.getTopMargin()"
    >
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
          #label
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'">
          <div class="sti-table" #table>
            <div [style.display]="'flex'">
              <table
                class="column-drop-area"
                [style.background-color]="element?.backgroundColor.toHtmlColor()"
                [style.align-self]="align"
              >
                <thead>
                  <tr #tableTr>
                    <th
                      *ngIf="element?.showRowLabels"
                      [id]="0"
                      (mousemove)="columnDraggableService.fromTable ? (columnDraggableService.insertIndex = 0) : return"
                      [style.justify-content]="headerAlignment"
                      [style.color]="element?.tableHeaderColor.toHtmlColor()"
                      [style.background-color]="element?.tableHeaderBackgroundColor.toHtmlColor()"
                      [style.width.px]="!isClone ? element?.rowLabelsWidth : 0"
                      [style.max-height.px]="
                        !isClone && !model.pdfPreviewMode && isInitialized && isOverMaxHeight()
                          ? getMaxHeight()
                          : 'auto'
                      "
                      [style.border-top]="getBorder(element?.border.pen, element?.border.drawTop)"
                      [style.border-left]="getBorder(element?.border.pen, element?.border.drawLeft)"
                      [style.border-bottom]="
                        getBorder(element?.rowHeadersBorder.pen, element?.rowHeadersBorder.drawTop)
                      "
                      [style.border-right]="
                        element.columns.length > 0 ? '' : getBorder(element?.border.pen, element?.border.drawRight)
                      "
                      [style.padding]="'5px 0px 5px 5px'"
                    >
                      <sti-editable-content-component
                        [editableContent]="element"
                        [alignment]="element?.tableHeaderAlignment"
                        [isTableHeader]="true"
                        [style.width]="'100%'"
                        [hideEmpty]="false"
                        [active]="selected"
                      ></sti-editable-content-component>
                      <sti-table-column-resizer
                        [resizableItem]="element"
                        [element]="element"
                        [style.height]="'100%'"
                      ></sti-table-column-resizer>
                    </th>
                    <th
                      *ngFor="let column of element.columns; index as idx"
                      [id]="idx + 1"
                      (mousemove)="
                        columnDraggableService.fromTable ? (columnDraggableService.insertIndex = idx + 1) : return
                      "
                      class="drag-item sti-table-th"
                      (click)="model.showColumnPreview(idx)"
                      [style]="element.font.htmlStyle()"
                      [style.justify-content]="getColumnAlignment(column)"
                      (mousedown)="onHeaderClick($event, column)"
                      [style.color]="column?.headerForeColor.toHtmlColor()"
                      [style.background-color]="column?.headerBackColor.toHtmlColor()"
                      [style.width.px]="!isClone ? column?.width : 0"
                      [style.height.px]="
                        isClone && !model.pdfPreviewMode ? element?.element?.nativeElement?.clientHeight : 'auto'
                      "
                      [style.max-height.px]="
                        !isClone && !model.pdfPreviewMode && isInitialized && isOverMaxHeight()
                          ? getMaxHeight()
                          : 'auto'
                      "
                      [style.transition]="columnDraggableService.fromTable ? 'border-width 50ms linear' : ''"
                      [style.border-top]="
                        getBorder(element?.columnHeadersBorder.pen, element?.columnHeadersBorder.drawTop) !=
                        'transparent'
                          ? getBorder(element?.columnHeadersBorder.pen, element?.columnHeadersBorder.drawTop)
                          : getBorder(element?.border.pen, element?.border.drawTop)
                      "
                      [style.border-bottom]="
                        getBorder(element?.columnHeadersBorder.pen, element?.columnHeadersBorder.drawBottom)
                      "
                      [style.border-right]="
                        getBorder(
                          element?.columnHeadersBorder.pen,
                          element?.columnHeadersBorder.drawRight,
                          columnDraggableService.parentElement == element &&
                            columnDraggableService.fromTable &&
                            columnDraggableService.insertIndex == idx + 1
                            ? true
                            : false
                        ) != 'transparent'
                          ? idx == element.columns.length - 1
                            ? getBorder(
                                element?.columnHeadersBorder.pen,
                                element?.columnHeadersBorder.drawRight,
                                columnDraggableService.parentElement == element &&
                                  columnDraggableService.fromTable &&
                                  columnDraggableService.insertIndex == idx + 1
                                  ? true
                                  : false
                              )
                            : getBorder(
                                element?.gridLines.pen,
                                element?.gridLines.drawVertical,
                                columnDraggableService.parentElement == element &&
                                  columnDraggableService.fromTable &&
                                  columnDraggableService.insertIndex == idx + 1
                                  ? true
                                  : false
                              )
                          : idx == element.columns.length - 1
                          ? getBorder(
                              element?.border.pen,
                              element?.border.drawRight,
                              columnDraggableService.parentElement == element &&
                                columnDraggableService.fromTable &&
                                columnDraggableService.insertIndex == idx + 1
                                ? true
                                : false
                            )
                          : getBorder(
                              element?.gridLines.pen,
                              element?.gridLines.drawVertical,
                              columnDraggableService.parentElement == element &&
                                columnDraggableService.fromTable &&
                                columnDraggableService.insertIndex == idx + 1
                                ? true
                                : false
                            )
                      "
                      [style.border-left]="
                        idx == 0
                          ? getBorder(
                              element?.columnHeadersBorder.pen,
                              element?.columnHeadersBorder.drawLeft,
                              columnDraggableService.parentElement == element &&
                                columnDraggableService.fromTable &&
                                columnDraggableService.insertIndex == 0 &&
                                idx == 0
                                ? true
                                : false
                            )
                          : ''
                      "
                      [style.border-left-width]="
                        columnDraggableService.parentElement == element &&
                        columnDraggableService.fromTable &&
                        columnDraggableService.insertIndex == 0 &&
                        idx == 0
                          ? getBorderWidth(element?.columnHeadersBorder.pen, true)
                          : getBorderWidth(element?.columnHeadersBorder.pen, false)
                      "
                      [style.border-right-width]="
                        idx != element.columns.length - 1
                          ? columnDraggableService.parentElement == element &&
                            columnDraggableService.fromTable &&
                            columnDraggableService.insertIndex == idx + 1
                            ? getBorderWidth(element?.gridLines.pen, true)
                            : getBorderWidth(element?.gridLines.pen, false)
                          : element?.columnHeadersBorder.drawRight
                          ? columnDraggableService.parentElement == element &&
                            columnDraggableService.fromTable &&
                            columnDraggableService.insertIndex == idx + 1
                            ? getBorderWidth(element?.columnHeadersBorder.pen, true)
                            : getBorderWidth(element?.columnHeadersBorder.pen, false)
                          : columnDraggableService.parentElement == element &&
                            columnDraggableService.fromTable &&
                            columnDraggableService.insertIndex == idx + 1
                          ? getBorderWidth(element?.border.pen, true)
                          : getBorderWidth(element?.border.pen, false)
                      "
                      [style.padding]="'5px 0px 5px 5px'"
                    >
                      <sti-editable-content-component
                        [eParent]="element"
                        [editableContent]="column"
                        [alignment]="column?.headerAlignment"
                        [isTableHeader]="true"
                        [style.width]="'100%'"
                        [hideEmpty]="false"
                        [active]="selected"
                      ></sti-editable-content-component>
                      <sti-table-column-resizer
                        [resizableItem]="column"
                        [element]="element"
                        [index]="idx"
                        *ngIf="idx != element.columns.length - 1"
                        [style.height]="'100%'"
                      ></sti-table-column-resizer>
                    </th>
                  </tr>
                </thead>
                <tbody #tBody>
                  <tr *ngFor="let rowLabel of element.rowLabelsContentEditable; index as i" #tableRow>
                    <td
                      *ngIf="element?.showRowLabels"
                      [attr.data-label]="element.tableHeaderText"
                      [id]="0"
                      (mousemove)="columnDraggableService.fromTable ? (columnDraggableService.insertIndex = 0) : return"
                      [style]="element.font.htmlStyle()"
                      [style.justify-content]="rowAlignment"
                      [style.color]="getColumnForeColor(rowLabel, i)"
                      [style.width.px]="!isClone ? element?.rowLabelsWidth : 0"
                      [style.background-color]="getColumnBackColor(rowLabel, i)"
                      [style.border-left]="
                        getBorder(element?.rowHeadersBorder.pen, element?.rowHeadersBorder.drawLeft) != 'transparent'
                          ? getBorder(element?.rowHeadersBorder.pen, element?.rowHeadersBorder.drawLeft)
                          : getBorder(element?.border.pen, element?.border.drawLeft)
                      "
                      [style.border-bottom]="
                        getBorder(element?.rowHeadersBorder.pen, element?.rowHeadersBorder.drawBottom) != 'transparent'
                          ? i == element.rowLabels.length - 1
                            ? getBorder(element?.rowHeadersBorder.pen, element?.rowHeadersBorder.drawBottom)
                            : getBorder(element?.gridLines.pen, element?.gridLines.drawHorizontal)
                          : i == element.rowLabels.length - 1
                          ? getBorder(element?.border.pen, element?.border.drawBottom)
                          : getBorder(element?.gridLines.pen, element?.gridLines.drawHorizontal)
                      "
                      [style.border-right]="
                        element.columns.length > 0
                          ? ''
                          : getBorder(element?.rowHeadersBorder.pen, element?.rowHeadersBorder.drawRight) !=
                            'transparent'
                          ? getBorder(element?.rowHeadersBorder.pen, element?.rowHeadersBorder.drawRight)
                          : getBorder(element?.border.pen, element?.border.drawRight)
                      "
                    >
                      <sti-editable-content-component
                        [eParent]="element"
                        [editableContent]="rowLabel"
                        [displayContent]="rowLabel?.displayValue"
                        [alignment]="element?.rowLabelsHorizontalAlignment"
                        [style.width]="'100%'"
                        [hideEmpty]="false"
                        [active]="selected"
                      ></sti-editable-content-component>
                    </td>
                    <td
                      *ngFor="let column of element.columns; index as ind"
                      [attr.data-label]="column.label"
                      [id]="ind + 1"
                      (mousedown)="updatePropertyGrid(column, $event)"
                      (mousemove)="
                        columnDraggableService.fromTable ? (columnDraggableService.insertIndex = ind + 1) : return
                      "
                      class="drag-item sti-table-td"
                      [style.justify-content]="getColumnAlignment(column)"
                      [style.color]="getColumnForeColor(column, i)"
                      [style.background-color]="getColumnBackColor(column, i)"
                      [style.width.px]="
                        !isClone ? (ind == element.columns.length - 1 ? column?.width + 0.04 : column?.width) : 0
                      "
                      [style.transition]="columnDraggableService.fromTable ? 'border-width 50ms linear' : ''"
                      [style.border-left]="
                        ind == 0
                          ? getBorder(
                              element?.rowHeadersBorder.pen,
                              element?.rowHeadersBorder.drawRight,
                              columnDraggableService.parentElement == element &&
                                columnDraggableService.fromTable &&
                                columnDraggableService.insertIndex == 0 &&
                                ind == 0
                                ? true
                                : false
                            )
                          : ''
                      "
                      [style.border-bottom]="
                        i == element.rowLabels.length - 1
                          ? getBorder(element?.border.pen, element?.border.drawBottom)
                          : getBorder(element?.gridLines.pen, element?.gridLines.drawHorizontal)
                      "
                      [style.border-right]="
                        ind == element.columns.length - 1
                          ? getBorder(
                              element?.border.pen,
                              element?.border.drawRight,
                              columnDraggableService.parentElement == element &&
                                columnDraggableService.fromTable &&
                                columnDraggableService.insertIndex == ind + 1
                                ? true
                                : false
                            )
                          : getBorder(
                              element?.gridLines.pen,
                              element?.gridLines.drawVertical,
                              columnDraggableService.parentElement == element &&
                                columnDraggableService.fromTable &&
                                columnDraggableService.insertIndex == ind + 1
                                ? true
                                : false
                            )
                      "
                      [style.border-left-width]="
                        columnDraggableService.parentElement == element &&
                        columnDraggableService.fromTable &&
                        columnDraggableService.insertIndex == 0 &&
                        ind == 0
                          ? getBorderWidth(element?.rowHeadersBorder.pen, true)
                          : getBorderWidth(element?.rowHeadersBorder.pen, false)
                      "
                      [style.border-right-width]="
                        ind != element.columns.length - 1
                          ? columnDraggableService.parentElement == element &&
                            columnDraggableService.fromTable &&
                            columnDraggableService.insertIndex == ind + 1
                            ? getBorderWidth(element?.gridLines.pen, true)
                            : getBorderWidth(element?.gridLines.pen, false)
                          : element?.columnHeadersBorder.drawRight
                          ? columnDraggableService.parentElement == element &&
                            columnDraggableService.fromTable &&
                            columnDraggableService.insertIndex == ind + 1
                            ? getBorderWidth(element?.border.pen, true)
                            : getBorderWidth(element?.border.pen, false)
                          : columnDraggableService.parentElement == element &&
                            columnDraggableService.fromTable &&
                            columnDraggableService.insertIndex == ind + 1
                          ? getBorderWidth(element?.border.pen, true)
                          : getBorderWidth(element?.border.pen, false)
                      "
                    >
                      <sti-table-column-component
                        [column]="column"
                        [index]="i"
                        [element]="element"
                        [style.width]="'100%'"
                      ></sti-table-column-component>
                    </td>
                  </tr>
                </tbody>
              </table>
              <div
                class="right"
                *ngIf="
                  element == model.selectedComponent?.element &&
                  model.draggingElement != element &&
                  !model.previewMode
                "
              >
                <div class="right-control-panel">
                  <div
                    class="add control-button"
                    [style.margin-bottom.px]="5"
                    [style.background-color]="getPageColor()"
                    (click)="addColumn()"
                  >
                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
                      <rect class="plus" width="16" height="16" [attr.fill]="getPageColor()" />
                      <path
                        d="M11.5656 8.905H8.97358V11.5656H7.16329V8.905H4.57129V7.23186H7.16329V4.57129H8.97358V7.23186H11.5656V8.905Z"
                        fill="#898989"
                      />
                    </svg>
                  </div>
                  <div
                    class="delete control-button {{ canDeleteColumn() ? '' : 'disabled' }}"
                    [style.background-color]="getPageColor()"
                    (click)="deleteColumn()"
                  >
                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
                      <path
                        d="M6 8H8H10"
                        stroke="#898989"
                        stroke-width="2"
                        stroke-linecap="square"
                        stroke-linejoin="round"
                      />
                    </svg>
                  </div>
                </div>
              </div>
            </div>
            <div
              class="bottom"
              *ngIf="
                (element == model.selectedComponent?.element &&
                  model.draggingElement != element &&
                  !model.previewMode) ||
                (model.previewMode && !element.readOnly && element.dynamicRows && isActive)
              "
            >
              <div class="bottom-control-panel">
                <div
                  class="add control-button {{ canAddRow ? '' : 'disabled' }}"
                  [style.margin-right.px]="5"
                  [style.background-color]="getPageColor()"
                  (click)="addRow()"
                >
                  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
                    <rect class="plus" width="16" height="16" [attr.fill]="getPageColor()" />
                    <path
                      d="M11.5656 8.905H8.97358V11.5656H7.16329V8.905H4.57129V7.23186H7.16329V4.57129H8.97358V7.23186H11.5656V8.905Z"
                      fill="#898989"
                    />
                  </svg>
                </div>
                <div
                  class="delete control-button {{ canDeleteRow ? '' : 'disabled' }}"
                  [style.background-color]="getPageColor()"
                  (click)="deleteRow()"
                >
                  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
                    <path
                      d="M6 8H8H10"
                      stroke="#898989"
                      stroke-width="2"
                      stroke-linecap="square"
                      stroke-linejoin="round"
                    />
                  </svg>
                </div>
              </div>
            </div>
          </div>
          <div class="totals" *ngIf="element?.useTotals" #totals>
            <div
              class="totals-header"
              [style.align-items]="totalVerticalAlignment"
              [style.justify-content]="totalHorizontalAlignment"
            >
              <sti-editable-content-component
                [editableContent]="element.totalsRowHeaderEditableContent"
                [hideEmpty]="false"
                [active]="selected"
                [isTableTotalHeader]="true"
              ></sti-editable-content-component>
            </div>
            <div class="totals-fields">
              <sti-table-totals-field-component
                [fields]="element.totalsFields"
                [object]="element"
              ></sti-table-totals-field-component>
            </div>
          </div>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0" #description>
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, styles: [".outer-table table{border-spacing:0}.outer-table tr{height:max-content;padding:0;margin:0}.outer-table td{height:100%;padding:0;margin:0}.add{border-radius:3px;background-color:transparent;display:flex;border:1px solid lightGray;justify-content:center;align-items:center;z-index:100}.disabled{opacity:.5;pointer-events:none}.right{width:0px;background-color:transparent;position:relative}.right-control-panel{height:55px;width:18px;left:3px;top:calc(50% - 22.5px);position:absolute;display:flex;flex-direction:column}.right-control-panel .control-button{height:25px}.control-button{border-radius:3px;background-color:transparent;display:flex;border:1px solid lightGray;justify-content:center;align-items:center;z-index:100}.control-button:hover{background-color:#d3d3d3!important;cursor:default}.control-button:hover .plus{fill:#d3d3d3!important;cursor:default}.bottom-control-panel{height:18px;width:55px;top:3px;left:calc(50% - 22.5px);position:absolute;display:flex}.bottom-control-panel .control-button{width:25px}.bottom{width:calc(100% - 5px);height:0px;background-color:transparent;position:relative}.table-content{min-width:260px;width:100%;display:inline-block;flex-direction:column;flex:1}table,th,td{border-collapse:collapse}th{position:relative}.sti-table th,.sti-table td{display:flex;flex-direction:row;align-items:center;overflow:hidden;padding:4px;height:auto}.sti-table table{width:100%;margin:0;padding:0;display:inline-table;table-layout:auto;border-collapse:collapse;border-spacing:0;overflow:hidden}.sti-table th{padding:3px}.sti-table tr{display:flex;flex-direction:row;flex:1}.totals{width:100%;display:flex;min-height:5px;margin-top:5px;overflow:hidden}.totals-header{display:flex;flex:1;padding:4px 0}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiDraggableService }, { type: StiColumnDraggableService }, { type: StiEditableContentService }, { type: i0.ChangeDetectorRef }, { type: StiMouseService }], propDecorators: { element: [{
                type: Input
            }], isClone: [{
                type: Input
            }], tableTr: [{
                type: ViewChild,
                args: ["tableTr"]
            }], tBody: [{
                type: ViewChild,
                args: ["tBody"]
            }], totals: [{
                type: ViewChild,
                args: ["totals"]
            }], table: [{
                type: ViewChild,
                args: ["table"]
            }], tableRow: [{
                type: ViewChild,
                args: ["tableRow"]
            }], componentDescription: [{
                type: ViewChild,
                args: ["description"]
            }], componentLabel: [{
                type: ViewChild,
                args: ["label"]
            }] } });

class StiBorderArea {
    constructor() { }
}

class StiImageComponent {
    get align() {
        return "start";
    }
    get image() {
        return this.element.image ? "url(" + this.element.image + ")" : null;
    }
    get imageWidth() {
        if (this.isClone) {
            return 0;
        }
        else {
            if (this.element["label"]["alignment"] != StiLabelAlignment.Top && this.element["label"]["value"]) {
                return this.element.width - this.element.label.width - this.element.padding.right - this.element.padding.left;
            }
            else {
                return this.element.width - this.element.padding.right - this.element.padding.left /*borderWidth */;
            }
        }
    }
    get imageHeight() {
        return this.element.canvasHeight;
    }
    get borderArea() {
        if (!this.isClone) {
            let borderArea = new StiBorderArea();
            borderArea.top =
                this.ref?.nativeElement?.offsetTop -
                    (this.element.label.alignment != StiLabelAlignment.Top ? this.element.padding.top : 0);
            borderArea.left = this.ref?.nativeElement?.offsetLeft;
            borderArea.width = this.ref?.nativeElement?.offsetWidth - this.element.padding.left - this.element.padding.right;
            borderArea.height = this.ref?.nativeElement?.offsetHeight;
            borderArea.border = this.element.border;
            return borderArea;
        }
    }
    onFileSelected(event) {
        if (event.files && event.files[0]) {
            var reader = new FileReader();
            reader.onload = (e) => {
                this.element.image = e.target.result;
            };
            reader.readAsDataURL(event.files[0]);
        }
    }
    openLink() {
        if (this.element.hyperlink.length > 0 && this.model.previewMode) {
            window.open(this.element.hyperlink, "_blank");
        }
    }
    get backgroundSize() {
        if (this.element.preserveAspectRatio) {
            return "contain";
        }
        else {
            return this.imageWidth + "px " + this.imageHeight + "px";
        }
    }
    constructor(model) {
        this.model = model;
        this.isClone = false;
    }
    ngAfterViewInit() {
        if (!this.isClone) {
            this.element.element = this.ref?.nativeElement;
        }
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiImageComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiImageComponent, selector: "sti-image-component", inputs: { element: "element", isClone: "isClone" }, viewQueries: [{ propertyName: "ref", first: true, predicate: ["ref"], descendants: true }], ngImport: i0, template: ` <sti-component [element]="element" [borderArea]="borderArea" [isClone]="isClone" class="sti-image">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.align-self]="align"
      [style.text-align]="element?.getContentAlign()"
      [required]="element.required"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [style.width]="element?.getLabelWidth()"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'100%'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'" [style.height]="'100%'">
          <div
            #ref
            (dblclick)="!model.previewMode ? inputFile.click() : ''"
            (click)="openLink()"
            class="image"
            [style.align-self]="'center'"
            [style.width]="'100%'"
            [style.height]="'100%'"
            [style.min-width.px]="isClone ? 30 : 0"
            [style.min-height.px]="isClone ? 30 : 0"
            [style.background-image]="image"
            [style.background-position]="element.preserveAspectRatio ? '' : 'center'"
            [style.background-size]="backgroundSize"
            [style.background-repeat]="image ? 'no-repeat' : ''"
            [stiTooltip]="element?.tooltip"
            tooltipPosition="bottom"
            showDelay="500"
            [style.cursor]="element.hyperlink.length > 0 ? 'pointer' : model.previewMode ? 'default' : 'move'"
          ></div>
          <input
            type="file"
            [style.display]="'none'"
            accept=".jpg, .jpeg, .png"
            (change)="onFileSelected($event.target)"
            #inputFile
          />
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, isInline: true, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}.sti-image .image{position:relative}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiImageComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-image-component", template: ` <sti-component [element]="element" [borderArea]="borderArea" [isClone]="isClone" class="sti-image">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.align-self]="align"
      [style.text-align]="element?.getContentAlign()"
      [required]="element.required"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [style.width]="element?.getLabelWidth()"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'100%'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'" [style.height]="'100%'">
          <div
            #ref
            (dblclick)="!model.previewMode ? inputFile.click() : ''"
            (click)="openLink()"
            class="image"
            [style.align-self]="'center'"
            [style.width]="'100%'"
            [style.height]="'100%'"
            [style.min-width.px]="isClone ? 30 : 0"
            [style.min-height.px]="isClone ? 30 : 0"
            [style.background-image]="image"
            [style.background-position]="element.preserveAspectRatio ? '' : 'center'"
            [style.background-size]="backgroundSize"
            [style.background-repeat]="image ? 'no-repeat' : ''"
            [stiTooltip]="element?.tooltip"
            tooltipPosition="bottom"
            showDelay="500"
            [style.cursor]="element.hyperlink.length > 0 ? 'pointer' : model.previewMode ? 'default' : 'move'"
          ></div>
          <input
            type="file"
            [style.display]="'none'"
            accept=".jpg, .jpeg, .png"
            (change)="onFileSelected($event.target)"
            #inputFile
          />
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}.sti-image .image{position:relative}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { element: [{
                type: Input
            }], isClone: [{
                type: Input
            }], ref: [{
                type: ViewChild,
                args: ["ref"]
            }] } });

class StiButtonComponent {
    constructor(model, httpClient) {
        this.model = model;
        this.httpClient = httpClient;
        this.isClone = false;
    }
    ngOnDestroy() {
        this.retryEvent?.unsubscribe();
    }
    disableDrag(event) {
        this.model.canDrag = false;
    }
    clickEvent() {
        if (this.element.buttonType == StiButtonType.ClearForm && this.model.previewMode) {
            this.model.form.pages.forEach((page) => {
                page.allElements.forEach((element) => {
                    element.setDefaultValues();
                });
            });
        }
        else if (this.element.buttonType == StiButtonType.SendForm && this.model.previewMode) {
            this.model.errorWindowMessage = this.element.submissionMessage;
            if (this.element.formSendURL) {
                this.model.showProgress = true;
                let xml = this.createXml();
                let url;
                if (this.element.formSendURL.trim().toLocaleLowerCase() == "stimulsoft cloud" ||
                    this.element.formSendURL.trim().toLocaleLowerCase() == "cloud.stimulsoft.com") {
                    url = "https://submit.stimulsoft.com/submit";
                }
                else {
                    url = this.element.formSendURL;
                }
                if (this.formHasEmptyRequiredFields()) {
                    let elem = this.formHasEmptyRequiredFields();
                    this.model.errorWindowMessage = StiLocalizationService.get("Errors", "FieldRequire").replace("{0}", elem["label"] ? elem["label"]["value"] : elem["name"]);
                    this.model.showErrorWindow = true;
                    this.model.showProgress = false;
                    this.scrollToRequired(elem);
                    return;
                }
                this.httpClient
                    .post(url, xml)
                    .pipe(catchError((data) => {
                    this.model.showProgress = false;
                    this.model.showError(StiLocalizationService.get("DesignerFx", "ConnectionError"), true, this.element);
                    this.model.interfaceEvent.next({ name: "FormSubmittedError", data: data });
                    return throwError("Something bad happened; please try again later.");
                }))
                    .subscribe((data) => {
                    this.model.showProgress = false;
                    this.model.interfaceEvent.next({ name: "FormSubmitted", data: data });
                    if (this.element.submissionMessage != null && this.element.submissionMessage.length > 0) {
                        this.model.showButtonMessageWindow = true;
                    }
                });
            }
            else {
                this.model.interfaceEvent.next({ name: "FormSubmitted" });
                if (this.element.submissionMessage != null &&
                    this.element.submissionMessage.length > 0 &&
                    this.element.formSendURL) {
                    this.model.showButtonMessageWindow = true;
                }
            }
        }
        else if (this.element.buttonType == StiButtonType.AttachFiles && this.model.previewMode) {
            this.model.loadAttachedFile();
        }
    }
    get selected() {
        return this.model.selectedComponent?.element == this.element;
    }
    scrollToRequired(elem) {
        let workspace = document.getElementsByTagName("sti-workspace")[0];
        let domElement = document.getElementById(elem.guid);
        let elementRect = this.model.getPositionRelativeToForm(domElement);
        const componentHeader = 38;
        let currentScrollPosition = workspace.scrollTop;
        if (elementRect.top < 0) {
            workspace.scrollTop = currentScrollPosition - (Math.abs(elementRect?.top) + componentHeader);
        }
        else {
            workspace.scrollTop = currentScrollPosition + (elementRect?.top - componentHeader);
        }
    }
    createXml() {
        let string = `<?xml version="1.0" encoding="UTF-8"?>
    <xfdf xmlns="http://ns.adobe.com/xfdf/" xml:space="preserve">
    <fields>` +
            this.addXmlField({ name: "StiFormGuid", value: this.model.form.guid }) +
            (this.model.form.versionKey != null && this.model.form.versionKey.length > 0
                ? this.addXmlField({ name: "StiVersionKey", value: this.model.form.versionKey })
                : "") +
            //this.addXmlField({ name: "StiUserId", value: this.model.form.userId }) +
            this.createFields() +
            this.addAttachedFiles() +
            this.addAdditionsFormField() +
            `</fields>
    </xfdf>`;
        return string;
    }
    createFields() {
        let fields = "";
        this.model.form.pages.forEach((page) => {
            page.allElements.forEach((element) => {
                if (element instanceof StiTableElement) {
                    this.model.removeUnusedCells(element);
                    fields += this.getXmlTableField(element);
                }
                else if (element instanceof StiAddressElement) {
                    fields += this.getXmlAddressField(element);
                }
                else {
                    let field = this.addXmlField(this.getValue(element));
                    if (field) {
                        fields += field;
                    }
                }
            });
        });
        return fields;
    }
    formHasEmptyRequiredFields() {
        this.model.hasEmptyReuiredFields = false;
        let emptyRequiredElement = null;
        for (let page of this.model.form.pages) {
            for (let elem of page.allElements) {
                if ((!elem["value"] || elem["value"].length == 0) && elem["required"]) {
                    emptyRequiredElement = elem;
                    break;
                }
            }
            if (emptyRequiredElement) {
                break;
            }
        }
        if (emptyRequiredElement) {
            this.model.hasEmptyReuiredFields = true;
            return emptyRequiredElement;
        }
        return null;
    }
    addAdditionsFormField() {
        let string = "";
        this.model.form.additionalFormFields.forEach((field) => {
            string += this.addXmlField({ name: field.key, value: field.value });
        });
        return string;
    }
    addXmlField(elementInfo) {
        if (elementInfo && (elementInfo.values != null || elementInfo.value != null)) {
            let val = "";
            (elementInfo.values ?? [elementInfo.value]).forEach((value) => {
                val += `<value>${this.encodeHTML(value)}</value>`;
            });
            return `<field name="${elementInfo.name}">${val}</field>`;
        }
        return "";
    }
    encodeHTML(data) {
        if (data instanceof Date) {
            return StiStaticHelperService.formatDate(data, "dd-mm-yyyyTHH:mm:ss");
        }
        else if (typeof data == "string") {
            return data.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&apos;");
        }
        return data;
    }
    getXmlTableField(element) {
        let field = `<field name="${element.name}">
    ` +
            this.createTableFields(element) +
            `</field>
    `;
        return field;
    }
    addAttachedFiles() {
        let string = "";
        this.model.form.attachedFiles.forEach((file, index) => {
            string += this.addXmlField({ name: "AttachedFile" + index, value: file });
        });
        return string;
    }
    getXmlAddressField(element) {
        let field = `<field name="${element.name}">
    ` +
            this.createAddressField(element) +
            `</field>
    `;
        return field;
    }
    createAddressField(element) {
        let fields = "";
        if (element.useCountry) {
            fields += this.addXmlField({
                name: "Country",
                value: element.country,
            });
        }
        if (element.useCity) {
            fields += this.addXmlField({
                name: "City",
                value: element.city,
            });
        }
        if (element.useState) {
            fields += this.addXmlField({
                name: "State",
                value: element.state,
            });
        }
        if (element.useStreetAddress) {
            fields += this.addXmlField({
                name: "StreetAddress",
                value: element.streetAddress,
            });
        }
        if (element.useStreetAddress2) {
            fields += this.addXmlField({
                name: "StreetAddress2",
                value: element.streetAddress2,
            });
        }
        if (element.useZipCode) {
            fields += this.addXmlField({
                name: "ZipCode",
                value: element.zipCode,
            });
        }
        return fields;
    }
    createTableFields(element) {
        let fields = "";
        element.columns.forEach((column, index) => {
            let columnIndex = index;
            column["cells"].forEach((cell, index) => {
                fields += this.addXmlField(this.getTableCellValue(column, columnIndex, cell, index));
            });
        });
        element.totalsFields.forEach((field, index) => {
            fields += this.addXmlField(this.getTableFieldValue(field, index));
        });
        element.rowLabels.forEach((row, index) => {
            element.columns.forEach((column, idx) => {
                if (column instanceof StiRadioButtonColumnItem && column.cells[index].isChecked) {
                    fields += this.addXmlField(this.getRowValue(index, idx));
                }
            });
        });
        return fields;
    }
    getTableFieldValue(field, fieldIndex) {
        return { name: "TotalsField" + fieldIndex, value: field.value };
    }
    getRowValue(rowIndex, columnIndex) {
        return { name: `Row-${rowIndex}-SingleSelection`, value: `Column-${columnIndex}` };
    }
    getTableCellValue(column, columnIndex, cell, cellIndex) {
        let name = "Cell" +
            "-" +
            columnIndex +
            "-" +
            cellIndex +
            "-" +
            (cell instanceof StiRadioButtonCellItem ? "SingleSelection" : column["type"].replace("Column", ""));
        let value = cell;
        if (cell instanceof StiTextBoxCellItem) {
            value = cell.text;
        }
        else if (cell instanceof StiRadioButtonCellItem) {
            return;
            value = cell.isChecked;
        }
        else if (cell instanceof StiNumberBoxCellItem) {
            value = cell.value;
        }
        else if (cell instanceof StiComboBoxCellItem) {
            value = column.comboBoxOptions[cell.selectedIndex];
        }
        else if (cell instanceof StiCheckBoxCellItem) {
            value = cell.isChecked;
        }
        return { name: name, value: value };
    }
    getValue(element) {
        let name = element.name ?? element.guid;
        let value, values;
        if (element instanceof StiTextBoxElement) {
            value = element.text;
        }
        else if (element instanceof StiNumberBoxElement) {
            value = element.value;
        }
        else if (element instanceof StiComboBoxElement) {
            value = element.selectedOption;
        }
        else if (element instanceof StiListBoxElement) {
            values = element.selectedOptions;
        }
        else if (element instanceof StiSingleSelectionElement) {
            value = element.selectedOption;
        }
        else if (element instanceof StiMultipleSelectionElement) {
            values = element.selectedOptions;
        }
        else if (element instanceof StiCheckBoxElement) {
            value = element.isChecked;
        }
        else if (element instanceof StiSignatureElement) {
            value = element.value;
        }
        else if (element instanceof StiDateTimeBoxElement) {
            value = element.dateValue;
        }
        else if (element instanceof StiBarcodeElement) {
            value = element.img;
        }
        else if (element instanceof StiLabelElement) {
            value = element.displayValue != undefined ? element.displayValue : element.text.value;
        }
        return { name: name, value: value, values: values };
    }
    ngOnInit() {
        if ((this.model.isCloudMode || this.model.isWebView) && this.element.formSendURL?.length == 0) {
            this.element.formSendURL = "cloud.stimulsoft.com";
        }
        this.retryEvent = this.model.retryButtonRequest.subscribe((element) => {
            if (element == this.element && !this.isClone) {
                this.clickEvent();
            }
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiButtonComponent, deps: [{ token: StiModelService }, { token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiButtonComponent, selector: "sti-button-component", inputs: { element: "element", isClone: "isClone" }, ngImport: i0, template: ` <sti-component [element]="element" [isClone]="isClone" [style.align-items]="'center'" class="StiButton">
    <div
      class="button {{ element?.readOnly ? 'disabled' : '' }}"
      [style.background-color]="element?.text.backgroundColor.toHtmlColor()"
      [style.border]="'1px solid' + element?.text.backgroundColor.toHtmlColor()"
      [stiTooltip]="element?.tooltip"
      (click)="clickEvent()"
      tooltipPosition="bottom"
      showDelay="500"
    >
      <sti-editable-content-component
        [hideEmpty]="false"
        [editableContent]="element.text"
        [fromButton]="true"
        [active]="selected"
      ></sti-editable-content-component>
    </div>
  </sti-component>`, isInline: true, styles: [".disabled{pointer-events:none}.button{width:fit-content;padding:10px;background-color:#d3d3d3;height:100%;width:100%;display:flex;align-items:center;justify-content:center}.button:hover{opacity:.5}\n"], dependencies: [{ kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiButtonComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-button-component", template: ` <sti-component [element]="element" [isClone]="isClone" [style.align-items]="'center'" class="StiButton">
    <div
      class="button {{ element?.readOnly ? 'disabled' : '' }}"
      [style.background-color]="element?.text.backgroundColor.toHtmlColor()"
      [style.border]="'1px solid' + element?.text.backgroundColor.toHtmlColor()"
      [stiTooltip]="element?.tooltip"
      (click)="clickEvent()"
      tooltipPosition="bottom"
      showDelay="500"
    >
      <sti-editable-content-component
        [hideEmpty]="false"
        [editableContent]="element.text"
        [fromButton]="true"
        [active]="selected"
      ></sti-editable-content-component>
    </div>
  </sti-component>`, styles: [".disabled{pointer-events:none}.button{width:fit-content;padding:10px;background-color:#d3d3d3;height:100%;width:100%;display:flex;align-items:center;justify-content:center}.button:hover{opacity:.5}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: i1.HttpClient }], propDecorators: { element: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiProgressComponent {
    constructor(model) {
        this.model = model;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiProgressComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiProgressComponent, selector: "sti-progress", inputs: { display: "display" }, ngImport: i0, template: `
    <div
      style="position: absolute; z-index: 99999999; left: calc(50% - 35px);top: calc(50% - 100px);"
      [style.display]="display ? '' : 'none'"
    >
      <div class="sti_loader sti_loader_default"></div>
    </div>

    <style>
      .sti_loader {
        margin: 60px auto;
        font-size: 10px;
        position: relative;
        text-indent: -9999em;
        -webkit-transform: translateZ(0);
        -ms-transform: translateZ(0);
        transform: translateZ(0);
        -webkit-animation: load8 1.1s infinite linear;
        animation: load8 1.1s infinite linear;
        box-sizing: border-box;
      }

      .sti_loader_default {
        border-top: 6px solid rgba(25, 71, 138, 0.2);
        border-right: 6px solid rgba(25, 71, 138, 0.2);
        border-bottom: 6px solid rgba(25, 71, 138, 0.2);
        border-left: 6px solid #19478a;
      }

      .sti_loader,
      .sti_loader:after {
        border-radius: 50%;
        width: 64px;
        height: 64px;
      }

      @-webkit-keyframes load8 {
        0% {
          -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
        }
        100% {
          -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
        }
      }

      @keyframes load8 {
        0% {
          -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
        }
        100% {
          -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
        }
      }
    </style>
  `, isInline: true, styles: ["\n      .sti_loader {\n        margin: 60px auto;\n        font-size: 10px;\n        position: relative;\n        text-indent: -9999em;\n        -webkit-transform: translateZ(0);\n        -ms-transform: translateZ(0);\n        transform: translateZ(0);\n        -webkit-animation: load8 1.1s infinite linear;\n        animation: load8 1.1s infinite linear;\n        box-sizing: border-box;\n      }\n\n      .sti_loader_default {\n        border-top: 6px solid rgba(25, 71, 138, 0.2);\n        border-right: 6px solid rgba(25, 71, 138, 0.2);\n        border-bottom: 6px solid rgba(25, 71, 138, 0.2);\n        border-left: 6px solid #19478a;\n      }\n\n      .sti_loader,\n      .sti_loader:after {\n        border-radius: 50%;\n        width: 64px;\n        height: 64px;\n      }\n\n      @-webkit-keyframes load8 {\n        0% {\n          -webkit-transform: rotate(0deg);\n          transform: rotate(0deg);\n        }\n        100% {\n          -webkit-transform: rotate(360deg);\n          transform: rotate(360deg);\n        }\n      }\n\n      @keyframes load8 {\n        0% {\n          -webkit-transform: rotate(0deg);\n          transform: rotate(0deg);\n        }\n        100% {\n          -webkit-transform: rotate(360deg);\n          transform: rotate(360deg);\n        }\n      }\n    "] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiProgressComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-progress",
                    template: `
    <div
      style="position: absolute; z-index: 99999999; left: calc(50% - 35px);top: calc(50% - 100px);"
      [style.display]="display ? '' : 'none'"
    >
      <div class="sti_loader sti_loader_default"></div>
    </div>

    <style>
      .sti_loader {
        margin: 60px auto;
        font-size: 10px;
        position: relative;
        text-indent: -9999em;
        -webkit-transform: translateZ(0);
        -ms-transform: translateZ(0);
        transform: translateZ(0);
        -webkit-animation: load8 1.1s infinite linear;
        animation: load8 1.1s infinite linear;
        box-sizing: border-box;
      }

      .sti_loader_default {
        border-top: 6px solid rgba(25, 71, 138, 0.2);
        border-right: 6px solid rgba(25, 71, 138, 0.2);
        border-bottom: 6px solid rgba(25, 71, 138, 0.2);
        border-left: 6px solid #19478a;
      }

      .sti_loader,
      .sti_loader:after {
        border-radius: 50%;
        width: 64px;
        height: 64px;
      }

      @-webkit-keyframes load8 {
        0% {
          -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
        }
        100% {
          -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
        }
      }

      @keyframes load8 {
        0% {
          -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
        }
        100% {
          -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
        }
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { display: [{
                type: Input
            }] } });

class StiBarcodeComponent {
    get align() {
        return "start";
    }
    get barcode() {
        return "url(" + this.element.img + ")";
    }
    get barcodeHeight() {
        return this.element.Height;
    }
    get barcodeWidth() {
        if (this.isClone) {
            return 0;
        }
        else {
            if (this.element["label"]["alignment"] != StiLabelAlignment.Top && this.element["label"]["value"]) {
                return (this.element.width - this.element.label.width - this.element.padding.right - this.element.padding.left - 2);
            }
            else {
                return this.element.width - this.element.padding.right - this.element.padding.left - 2 /*borderWidth */;
            }
        }
    }
    constructor(model) {
        this.model = model;
        this.isClone = false;
    }
    ngOnInit() { }
    ngAfterViewInit() {
        if (!this.isClone) {
            this.element.element = this.ref;
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBarcodeComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiBarcodeComponent, selector: "sti-barcode-component", inputs: { element: "element", isClone: "isClone" }, viewQueries: [{ propertyName: "ref", first: true, predicate: ["ref"], descendants: true }], ngImport: i0, template: ` <sti-component [element]="element" [isClone]="isClone" class="sti-barcode">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.text-align]="element?.getContentAlign()"
      [style.align-self]="align"
      [style.width]="element?.getLabelWidth()"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
    ></sti-editable-content-component>
    <sti-progress [display]="element.showProgress"></sti-progress>
    <table [style.width]="'100%'" [style.height]="'100%'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'" [style.height]="'100%'">
          <div
            #ref
            class="image"
            [style.align-self]="'center'"
            [style.width]="'100%'"
            [style.height]="'100%'"
            [style.min-width.px]="isClone ? 55 : 0"
            [style.min-height.px]="isClone ? 55 : 0"
            [style.background-image]="this.barcode"
            [style.background-size]="'contain'"
            [style.background-repeat]="this.barcode ? 'no-repeat' : ''"
            [stiTooltip]="element?.tooltip"
            tooltipPosition="bottom"
            showDelay="500"
          ></div>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, isInline: true, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}.sti-image .image{position:relative}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }, { kind: "component", type: StiProgressComponent, selector: "sti-progress", inputs: ["display"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBarcodeComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-barcode-component", template: ` <sti-component [element]="element" [isClone]="isClone" class="sti-barcode">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.text-align]="element?.getContentAlign()"
      [style.align-self]="align"
      [style.width]="element?.getLabelWidth()"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
    ></sti-editable-content-component>
    <sti-progress [display]="element.showProgress"></sti-progress>
    <table [style.width]="'100%'" [style.height]="'100%'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'" [style.height]="'100%'">
          <div
            #ref
            class="image"
            [style.align-self]="'center'"
            [style.width]="'100%'"
            [style.height]="'100%'"
            [style.min-width.px]="isClone ? 55 : 0"
            [style.min-height.px]="isClone ? 55 : 0"
            [style.background-image]="this.barcode"
            [style.background-size]="'contain'"
            [style.background-repeat]="this.barcode ? 'no-repeat' : ''"
            [stiTooltip]="element?.tooltip"
            tooltipPosition="bottom"
            showDelay="500"
          ></div>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}.sti-image .image{position:relative}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { element: [{
                type: Input
            }], isClone: [{
                type: Input
            }], ref: [{
                type: ViewChild,
                args: ["ref"]
            }] } });

class StiRichTextService {
    constructor(model) {
        this.model = model;
        this.sizes = { 1: 8, 2: 10, 3: 12, 4: 14, 5: 18, 6: 24, 7: 36 };
        this.xSizes = {
            "x-small": 8,
            small: 10,
            medium: 12,
            large: 14,
            "x-large	": 18,
            "xx-large": 24,
            "xxx-large": 36,
        };
        this.activeTextStyles = [];
        this.activeFontFamily = "Arial";
        this.activeFontSize = 3;
        this.activeColor = Color.red();
        this.currentSelectedTextIsBold = false;
        this.currentSelectedTextIsItalic = false;
        this.currentSelectedTextIsUnderline = false;
        this.currentSelectedTextHasCenterAlignment = false;
        this.currentSelectedTextHasLeftAlignment = false;
        this.currentSelectedTextHasRightAlignment = false;
    }
    showCurrentState() {
        this.currentSelectedTextIsBold = this.getIframe()?.queryCommandState("bold");
        this.currentSelectedTextIsItalic = this.getIframe()?.queryCommandState("italic");
        this.currentSelectedTextIsUnderline = this.getIframe()?.queryCommandState("underline");
        this.currentSelectedTextHasCenterAlignment = this.getIframe()?.queryCommandState("justifyCenter");
        this.currentSelectedTextHasLeftAlignment = this.getIframe()?.queryCommandState("justifyLeft");
        this.currentSelectedTextHasRightAlignment = this.getIframe()?.queryCommandState("justifyRight");
        this.activeFontFamily = this.getIframe()?.queryCommandValue("FontName").replace(/"/g, "");
        this.activeFontSize =
            Number(this.getIframe()?.queryCommandValue("FontSize")) > 7
                ? this.convertSizeMmToHtmlSize(Number(this.getIframe()?.queryCommandValue("FontSize")))
                : Number(this.getIframe()?.queryCommandValue("FontSize"));
        if (this.getIframe() != null) {
            let foreColor = this.getIframe()?.queryCommandValue("ForeColor");
            if (foreColor.length > 0) {
                let color = new Color();
                if (this.getIframe().queryCommandValue("ForeColor").includes("#")) {
                    color?.deserializeFromString(this.hexToRgb(this.getIframe()?.queryCommandValue("ForeColor")));
                }
                else {
                    color?.deserializeFromString(this.getIframe().queryCommandValue("ForeColor").replace("rgb(", "").replace(")", ""));
                }
                this.activeColor = color;
            }
        }
        this.activeTextStyles = [];
        if (this.currentSelectedTextIsBold) {
            this.activeTextStyles.push("Bold");
        }
        if (this.currentSelectedTextIsItalic) {
            this.activeTextStyles.push("Italic");
        }
        if (this.currentSelectedTextIsUnderline) {
            this.activeTextStyles.push("Underline");
        }
        if (this.currentSelectedTextHasLeftAlignment) {
            this.activeAlignment = StiHorizontalAlignment.Left;
        }
        if (this.currentSelectedTextHasCenterAlignment) {
            this.activeAlignment = StiHorizontalAlignment.Center;
        }
        if (this.currentSelectedTextHasRightAlignment) {
            this.activeAlignment = StiHorizontalAlignment.Right;
        }
    }
    execCommand(command, value) {
        this.getIframe().execCommand(command, false, value);
    }
    hexToRgb(hex) {
        const r = parseInt(hex.slice(1, 3), 16);
        const g = parseInt(hex.slice(3, 5), 16);
        const b = parseInt(hex.slice(5, 7), 16);
        return `${r}, ${g}, ${b}`;
    }
    getIframe() {
        let frameElement = document.getElementById("iframe" + this.model.selectedComponent?.element?.guid);
        let doc = frameElement?.contentWindow?.document;
        return doc ? doc : null;
    }
    insertBold() {
        this.execCommand("bold");
        this.currentSelectedTextIsBold = this.getIframe()?.queryCommandState("bold");
    }
    insertItalic() {
        this.execCommand("italic");
        this.currentSelectedTextIsItalic = this.getIframe()?.queryCommandState("italic");
    }
    insertUnderline() {
        this.execCommand("underline");
        this.currentSelectedTextIsUnderline = this.getIframe()?.queryCommandState("underline");
    }
    insertForeColor() {
        this.execCommand("foreColor", this.activeColor.toHexColor());
    }
    insertFontFamily(fontName) {
        this.execCommand("fontName", fontName);
    }
    /* useUndo() {
      this.execCommand("undo");
    }
    useRedo() {
      this.execCommand("redo");
    } */
    insertFontSize() {
        this.execCommand("fontSize", this.activeFontSize + "px");
    }
    setCenterAlignment() {
        this.execCommand("justifyCenter");
        this.currentSelectedTextHasCenterAlignment = this.getIframe()?.queryCommandState("justifyCenter");
    }
    setLeftAlignment() {
        this.execCommand("justifyLeft");
        this.currentSelectedTextHasLeftAlignment = this.getIframe()?.queryCommandState("justifyLeft");
    }
    setRightAlignment() {
        this.execCommand("justifyRight");
        this.currentSelectedTextHasRightAlignment = this.getIframe()?.queryCommandState("justifyRight");
    }
    convertSizeMmToHtmlSize(sizeMm) {
        if (sizeMm <= 8)
            return 1;
        else if (sizeMm > 8 && sizeMm <= 10)
            return 2;
        else if (sizeMm > 10 && sizeMm <= 12)
            return 3;
        else if (sizeMm > 12 && sizeMm <= 14)
            return 4;
        else if (sizeMm > 14 && sizeMm <= 18)
            return 5;
        else if (sizeMm > 18 && sizeMm <= 24)
            return 6;
        else if (sizeMm > 24)
            return 7;
        else
            return 3;
    }
    convertDocumentToForm(srcDoc) {
        let doc = document.implementation.createHTMLDocument();
        let newDocElement = doc.importNode(srcDoc.documentElement, true);
        doc.replaceChild(newDocElement, doc.documentElement);
        let tags = doc.getElementsByTagName("*");
        for (let i = 0; i < tags.length; i++) {
            let tag = tags[i];
            let size = tag.getAttribute("size");
            if (size) {
                tag.setAttribute("size", this.sizes[parseInt(size)]);
            }
            let fontSize = tag.style?.fontSize;
            if (fontSize && this.xSizes[fontSize]) {
                tag.style.fontSize = this.xSizes[fontSize] + "px";
            }
            let align = tag.getAttribute("align");
            if (align) {
                tag.style.textAlign = align;
                tag.removeAttribute("align");
            }
        }
        return doc.body.innerHTML.toString();
    }
    convertHtmlAttributesForWysiwyg(doc) {
        var tags = doc.getElementsByTagName("*");
        for (var i = 0; i < tags.length; i++) {
            var tag = tags[i];
            var size = tag.getAttribute("size");
            if (size) {
                var newSize = this.convertSizeMmToHtmlSize(parseInt(size));
                tag.setAttribute("size", newSize);
            }
        }
        for (var i = 0; i < tags.length; i++) {
            var tag = tags[i];
            if (tag.style) {
                if (this.getNavigatorName() == "MSIE" && tag.style.textAlign) {
                    tag.setAttribute("align", tag.style.textAlign.toLowerCase());
                    tag.style.textAlign = "";
                }
                if (tag.style.fontSize) {
                    var childs = [];
                    for (var k = 0; k < tag.childNodes.length; k++) {
                        childs.push(tag.childNodes[k]);
                    }
                    var font = document.createElement("font");
                    for (var k = 0; k < childs.length; k++) {
                        font.appendChild(childs[k]);
                    }
                    tag.appendChild(font);
                    font.setAttribute("size", this.convertSizeMmToHtmlSize(parseInt(tag.style.fontSize)).toString());
                    tag.style.fontSize = "";
                }
            }
        }
    }
    getNavigatorName() {
        var useragent = navigator.userAgent;
        var navigatorname = "Unknown";
        if (this.getIEVersion() > 0) {
            navigatorname = "MSIE";
        }
        else if (useragent.indexOf("Gecko") != -1) {
            if (useragent.indexOf("Chrome") != -1)
                navigatorname = "Google Chrome";
            else
                navigatorname = "Mozilla";
        }
        else if (useragent.indexOf("Mozilla") != -1) {
            navigatorname = "old Netscape or Mozilla";
        }
        else if (useragent.indexOf("Opera") != -1) {
            navigatorname = "Opera";
        }
        return navigatorname;
    }
    getIEVersion() {
        var sAgent = window.navigator.userAgent;
        var Idx = sAgent.indexOf("MSIE");
        // If IE, return version number.
        if (Idx > 0)
            return parseInt(sAgent.substring(Idx + 5, sAgent.indexOf(".", Idx)));
        // If IE 11 then look for Updated user agent string.
        // eslint-disable-next-line no-extra-boolean-cast
        else if (!!navigator.userAgent.match(/Trident\/7\./))
            return 11;
        else
            return 0; //It is not IE
    }
    initFont(htmlTextString) {
        if (htmlTextString?.length == 0) {
            setTimeout(() => {
                let label = this.model.form.settings.label;
                let font = label.font;
                this.activeFontFamily = font.family;
                this.activeFontSize = this.convertSizeMmToHtmlSize(font.size);
                this.activeColor = label.color.clone();
                //this.activeAlignment = label.alignment;
                this.insertFontFamily(font.family);
                this.insertFontSize();
                this.insertForeColor();
                font.style.forEach((style) => {
                    if (style == "Bold") {
                        this.insertBold();
                    }
                    else if (style == "Italic") {
                        this.insertItalic();
                    }
                    else if (style == "Underline") {
                        this.insertUnderline();
                    }
                });
            }, 0);
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiRichTextService, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiRichTextService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiRichTextService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }] });

class StiTextComponent {
    //component: StiComponent;
    get borderInnerWidth() {
        return Number(this.element.width) + Number(this.element.border.pen.width);
    }
    get borderInnerHeight() {
        return Number(this.element.height) + Number(this.element.border.pen.width);
    }
    constructor(model, richTextService, componentResizerService, render) {
        this.model = model;
        this.richTextService = richTextService;
        this.componentResizerService = componentResizerService;
        this.render = render;
        this.isClone = false;
    }
    ngAfterViewChecked() {
        let frameElement = document.getElementById("iframe" + this.element?.guid);
        let doc = frameElement?.contentWindow?.document;
    }
    changeMode(value) {
        let frameElement = document.getElementById("iframe" + this.element?.guid);
        let doc = frameElement?.contentWindow?.document;
        doc.body.contentEditable = value.toString();
    }
    get currentVerticalStep() {
        return this.model.form?.settings?.gridVerticalStep != 1 ? this.model.form?.settings?.gridVerticalStep : 5;
    }
    getIframeHeight(iframe) {
        if (this.getIframeMinHeight(iframe) > this.element?.height) {
            setTimeout(() => {
                if (!this.isClone) {
                    let height = this.getIframeMinHeight(iframe) + this.element.padding.top + this.element.padding.bottom;
                    this.element.height = Math.ceil(height / this.currentVerticalStep) * this.currentVerticalStep;
                    this.updateFormGeometry();
                }
            });
            return this.getIframeMinHeight(iframe);
        }
        else {
            return this.element.height;
        }
    }
    updateFormGeometry() {
        this.render.insertElement(this.element);
    }
    getIframeMinHeight(iframe) {
        if (iframe) {
            let firstChild = iframe?.contentDocument?.body?.firstChild;
            if (firstChild) {
                return firstChild.offsetHeight;
            }
            else {
                return 0;
            }
        }
        else {
            return 0;
        }
    }
    ngOnDestroy() {
        if (this.observer) {
            this.observer.disconnect();
        }
        this.changeModeSubscription?.unsubscribe();
    }
    ngAfterViewInit() {
        if (this.element.isAdded && !this.isClone) {
            if (this.model.getBrowserType() == "firefox") {
                let frameElements = document.querySelectorAll("#iframe" + this.element?.guid);
                frameElements.forEach((frameElement) => {
                    let this_ = this;
                    frameElement?.contentWindow?.addEventListener("load", () => {
                        let doc = frameElement?.contentWindow?.document;
                        doc.body.contentEditable = "true";
                        doc.body.style.margin = "0";
                        doc.body.style.overflowWrap = "break-word";
                        doc.body.innerHTML = this_.element.htmlTextString;
                        this_.richTextService.convertHtmlAttributesForWysiwyg(doc);
                        let element = this_.element;
                        const targetNode = doc.body;
                        this_.observer = new MutationObserver(() => (element.htmlTextString = this_.richTextService.convertDocumentToForm(doc)));
                        doc.body.addEventListener("mouseup", () => this_.richTextService.showCurrentState());
                        doc.body.addEventListener("keyup", () => this_.richTextService.showCurrentState());
                        doc.body.addEventListener("focus", () => {
                            this_.richTextService.initFont(this_.element.htmlTextString);
                            this_.richTextService.showCurrentState();
                        });
                        doc.body.addEventListener("mousedown", () => {
                            this_.model.selectedComponent = this_.component;
                        });
                        this_.observer.observe(targetNode, {
                            childList: true,
                            subtree: true,
                            attributes: true,
                            characterData: true,
                        });
                    });
                });
            }
            else {
                let frameElements = document.querySelectorAll("#iframe" + this.element?.guid);
                frameElements.forEach((frameElement) => {
                    let doc = frameElement?.contentWindow?.document;
                    doc.body.contentEditable = "true";
                    doc.body.style.margin = "0";
                    doc.body.innerHTML = this.element.htmlTextString;
                    this.richTextService.convertHtmlAttributesForWysiwyg(doc);
                    let element = this.element;
                    const targetNode = doc.body;
                    let this_ = this;
                    this.observer = new MutationObserver(() => (element.htmlTextString = this_.richTextService.convertDocumentToForm(doc)));
                    this.observer.observe(targetNode, {
                        childList: true,
                        subtree: true,
                        attributes: true,
                        characterData: true,
                    });
                    doc.body.addEventListener("mouseup", () => this.richTextService.showCurrentState());
                    doc.body.addEventListener("keyup", () => this.richTextService.showCurrentState());
                    doc.body.addEventListener("focus", () => {
                        this.richTextService.initFont(this.element.htmlTextString);
                        this.richTextService.showCurrentState();
                    });
                    doc.body.addEventListener("mousedown", () => {
                        this_.model.selectedComponent = this_.component;
                    });
                });
            }
        }
    }
    ngOnInit() {
        this.changeModeSubscription = this.model.interfaceEvent.subscribe((event) => {
            if (event.name == "setRibbon" && event.data?.ribbon === "Preview") {
                this.changeMode(false);
            }
            else if (event.name == "setRibbon" && event.data?.oldRibbon === "Preview") {
                this.changeMode(true);
            }
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTextComponent, deps: [{ token: StiModelService }, { token: StiRichTextService }, { token: StiComponentResizerService }, { token: StiRectangleGeometryLayout }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTextComponent, selector: "sti-text-component", inputs: { element: "element", isClone: "isClone" }, viewQueries: [{ propertyName: "richTextEditor", first: true, predicate: ["richTextEditor"], descendants: true }, { propertyName: "component", first: true, predicate: ["component"], descendants: true }], ngImport: i0, template: ` <sti-component [element]="element" #component [isClone]="isClone" class="sti-text">
    <div
      style="position: absolute;pointer-events:none;width:100%;height:100%; left:0; top:0;z-index:999"
      [style.height.px]="borderInnerHeight"
      [style.width.px]="borderInnerWidth"
      [style.left.px]="-(element.border.pen.width / 2)"
      [style.top.px]="-(element.border.pen.width / 2)"
      [style.border-top]="element.border.drawTop ? element.border.pen.toHtmlBorder() : 'transparent'"
      [style.border-left]="element.border.drawLeft ? element.border.pen.toHtmlBorder() : 'transparent'"
      [style.border-right]="element.border.drawRight ? element.border.pen.toHtmlBorder() : 'transparent'"
      [style.border-bottom]="element.border.drawBottom ? element.border.pen.toHtmlBorder() : 'transparent'"
    ></div>
    <iframe
      #iframe
      *ngIf="element.isAdded"
      id="{{ 'iframe' + element.guid }}"
      src="about:blank"
      frameborder="0"
      [style.height.px]="getIframeHeight(iframe)"
      [style.width]="'100%'"
      (mouseup)="model.canDrag = true"
      [style.pointer-events]="componentResizerService.isResizing ? 'none' : ''"
    >
    </iframe>
  </sti-component>`, isInline: true, styles: [".rich-text-editor{height:100%;width:100%;outline:none;font-weight:400;overflow:hidden}.rich-text-editor:hover{cursor:text}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTextComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-text-component", template: ` <sti-component [element]="element" #component [isClone]="isClone" class="sti-text">
    <div
      style="position: absolute;pointer-events:none;width:100%;height:100%; left:0; top:0;z-index:999"
      [style.height.px]="borderInnerHeight"
      [style.width.px]="borderInnerWidth"
      [style.left.px]="-(element.border.pen.width / 2)"
      [style.top.px]="-(element.border.pen.width / 2)"
      [style.border-top]="element.border.drawTop ? element.border.pen.toHtmlBorder() : 'transparent'"
      [style.border-left]="element.border.drawLeft ? element.border.pen.toHtmlBorder() : 'transparent'"
      [style.border-right]="element.border.drawRight ? element.border.pen.toHtmlBorder() : 'transparent'"
      [style.border-bottom]="element.border.drawBottom ? element.border.pen.toHtmlBorder() : 'transparent'"
    ></div>
    <iframe
      #iframe
      *ngIf="element.isAdded"
      id="{{ 'iframe' + element.guid }}"
      src="about:blank"
      frameborder="0"
      [style.height.px]="getIframeHeight(iframe)"
      [style.width]="'100%'"
      (mouseup)="model.canDrag = true"
      [style.pointer-events]="componentResizerService.isResizing ? 'none' : ''"
    >
    </iframe>
  </sti-component>`, styles: [".rich-text-editor{height:100%;width:100%;outline:none;font-weight:400;overflow:hidden}.rich-text-editor:hover{cursor:text}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiRichTextService }, { type: StiComponentResizerService }, { type: StiRectangleGeometryLayout }], propDecorators: { richTextEditor: [{
                type: ViewChild,
                args: ["richTextEditor"]
            }], component: [{
                type: ViewChild,
                args: ["component"]
            }], element: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiLabelComponent {
    get borderInnerWidth() {
        return Number(this.element.width) + Number(this.element.border.pen.width);
    }
    get borderInnerHeight() {
        return Number(this.element.height) + Number(this.element.border.pen.width);
    }
    get selected() {
        return this.model.selectedComponent?.element == this.element;
    }
    get exceedMarginsLeft() {
        if (this.element.exceedMargins.drawLeft) {
            return -this.model.getElementPage(this.element)?.padding.left - this.element.geometry.x;
        }
        else {
            return 0;
        }
    }
    get exceedMarginsTop() {
        if (this.element.exceedMargins.drawTop) {
            return -this.model.getElementPage(this.element)?.padding.top - this.element.geometry.y;
        }
        else {
            return 0;
        }
    }
    get exceedMarginsWidth() {
        if (!this.element.exceedMargins.drawLeft && !this.element.exceedMargins.drawRight) {
            return this.element.width;
        }
        else if (this.element.exceedMargins.drawLeft && !this.element.exceedMargins.drawRight) {
            return (this.element.width -
                this.element.padding.right +
                this.model.getElementPage(this.element)?.padding.left +
                this.element.geometry.x);
        }
        else if (!this.element.exceedMargins.drawLeft && this.element.exceedMargins.drawRight) {
            return (this.model.getElementPage(this.element)?.width -
                this.model.getElementPage(this.element)?.padding.left -
                this.element.x -
                this.element.padding.left);
        }
        else {
            return this.model.getElementPage(this.element)?.width;
        }
    }
    get exceedMarginsHeight() {
        if (!this.element.exceedMargins.drawTop && !this.element.exceedMargins.drawBottom) {
            return this.element.height;
        }
        else if (this.element.exceedMargins.drawTop && !this.element.exceedMargins.drawBottom) {
            return (this.element.height -
                this.element.padding.bottom +
                this.model.getElementPage(this.element)?.padding.top +
                this.element.geometry.y);
        }
        else if (!this.element.exceedMargins.drawTop && this.element.exceedMargins.drawBottom) {
            return (this.model.getElementPage(this.element)?.height -
                this.model.getElementPage(this.element)?.padding.top -
                this.element.y -
                this.element.padding.top);
        }
        else {
            return this.model.getElementPage(this.element)?.height;
        }
    }
    get horizontalAlignment() {
        if (this.element.text.horizontalAlignment == StiHorizontalAlignment.Left) {
            return "start";
        }
        else if (this.element.text.horizontalAlignment == StiHorizontalAlignment.Right) {
            return "flex-end";
        }
        else {
            return "center";
        }
    }
    get verticalAlignment() {
        if (this.element.text.verticalAlignment == StiVerticalAlignment.Top) {
            return "start";
        }
        else if (this.element.text.verticalAlignment == StiVerticalAlignment.Bottom) {
            return "flex-end";
        }
        else {
            return "center";
        }
    }
    openLink() {
        if (this.element.hyperlink.length > 0 && this.model.previewMode) {
            window.open(this.element.hyperlink, "_blank");
        }
    }
    constructor(model) {
        this.model = model;
        this.isClone = false;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiLabelComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiLabelComponent, selector: "sti-label-component", inputs: { element: "element", isClone: "isClone" }, ngImport: i0, template: ` <sti-component
    [element]="element"
    [isClone]="isClone"
    class="sti-label"
    [style.pointer-events]="model.previewMode ? 'none' : ''"
  >
    <div
      [style]="element.htmlStyle()"
      [style.justify-content]="horizontalAlignment"
      [style.align-items]="verticalAlignment"
      [style.overflow]="'hidden'"
    >
      <sti-editable-content-component
        [editableContent]="element?.text"
        [displayContent]="element?.displayValue"
        [style]="element.htmlStyle()"
        [hideEmpty]="false"
        [active]="selected"
        [disablePadding]="true"
        (click)="openLink()"
        [parentCursor]="element.hyperlink.length > 0 && model.previewMode ? 'pointer' : 'text'"
      >
      </sti-editable-content-component>
    </div>
    <div
      style="position: absolute;pointer-events:none;width:100%;height:100%; left:0; top:0;z-index:999"
      [style.height.px]="borderInnerHeight"
      [style.width.px]="borderInnerWidth"
      [style.left.px]="-(element.border.pen.width / 2)"
      [style.top.px]="-(element.border.pen.width / 2)"
      [style.border-top]="element.border.drawTop ? element.border.pen.toHtmlBorder() : 'transparent'"
      [style.border-left]="element.border.drawLeft ? element.border.pen.toHtmlBorder() : 'transparent'"
      [style.border-right]="element.border.drawRight ? element.border.pen.toHtmlBorder() : 'transparent'"
      [style.border-bottom]="element.border.drawBottom ? element.border.pen.toHtmlBorder() : 'transparent'"
    ></div>
    <div
      class="exceed-margins"
      [style.background-color]="element?.text.backgroundColor.toHtmlColor()"
      [style.left.px]="exceedMarginsLeft"
      [style.top.px]="exceedMarginsTop"
      [style.width.px]="exceedMarginsWidth"
      [style.height.px]="exceedMarginsHeight"
      [style.pointer-events]="'none'"
    ></div>
  </sti-component>`, isInline: true, styles: [".sti-label p{font-size:12px;font-weight:400;margin:0}div{display:flex;height:100%;width:100%}.exceed-margins{position:absolute;background-color:red;z-index:-1}\n"], dependencies: [{ kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiLabelComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-label-component", template: ` <sti-component
    [element]="element"
    [isClone]="isClone"
    class="sti-label"
    [style.pointer-events]="model.previewMode ? 'none' : ''"
  >
    <div
      [style]="element.htmlStyle()"
      [style.justify-content]="horizontalAlignment"
      [style.align-items]="verticalAlignment"
      [style.overflow]="'hidden'"
    >
      <sti-editable-content-component
        [editableContent]="element?.text"
        [displayContent]="element?.displayValue"
        [style]="element.htmlStyle()"
        [hideEmpty]="false"
        [active]="selected"
        [disablePadding]="true"
        (click)="openLink()"
        [parentCursor]="element.hyperlink.length > 0 && model.previewMode ? 'pointer' : 'text'"
      >
      </sti-editable-content-component>
    </div>
    <div
      style="position: absolute;pointer-events:none;width:100%;height:100%; left:0; top:0;z-index:999"
      [style.height.px]="borderInnerHeight"
      [style.width.px]="borderInnerWidth"
      [style.left.px]="-(element.border.pen.width / 2)"
      [style.top.px]="-(element.border.pen.width / 2)"
      [style.border-top]="element.border.drawTop ? element.border.pen.toHtmlBorder() : 'transparent'"
      [style.border-left]="element.border.drawLeft ? element.border.pen.toHtmlBorder() : 'transparent'"
      [style.border-right]="element.border.drawRight ? element.border.pen.toHtmlBorder() : 'transparent'"
      [style.border-bottom]="element.border.drawBottom ? element.border.pen.toHtmlBorder() : 'transparent'"
    ></div>
    <div
      class="exceed-margins"
      [style.background-color]="element?.text.backgroundColor.toHtmlColor()"
      [style.left.px]="exceedMarginsLeft"
      [style.top.px]="exceedMarginsTop"
      [style.width.px]="exceedMarginsWidth"
      [style.height.px]="exceedMarginsHeight"
      [style.pointer-events]="'none'"
    ></div>
  </sti-component>`, styles: [".sti-label p{font-size:12px;font-weight:400;margin:0}div{display:flex;height:100%;width:100%}.exceed-margins{position:absolute;background-color:red;z-index:-1}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { element: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiAddressComponent {
    constructor(model, helper) {
        this.model = model;
        this.helper = helper;
        this.isClone = false;
    }
    get values() {
        return this.helper.countries;
    }
    disableDrag(event) {
        this.model.canDrag = false;
    }
    borderWidth() {
        return `${this.element.borderWeight}px`;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiAddressComponent, deps: [{ token: StiModelService }, { token: StiHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiAddressComponent, selector: "sti-address-component", inputs: { element: "element", isClone: "isClone" }, ngImport: i0, template: ` <sti-component [element]="element" [isClone]="isClone" [style.align-items]="'center'" class="StiButton">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.text-align]="element?.getContentAlign()"
      [style.align-self]="'start'"
      [style.width]="element?.getLabelWidth()"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'">
          <div
            class="address-form"
            (mousedown)="disableDrag($event)"
            [style.maxWidth.px]="element.maxWidth + 0.1"
            (mouseup)="this.model.canDrag = true"
          >
            <div class="field" *ngIf="element.useStreetAddress">
              <sti-input-text-component
                [element]="element"
                [tabIndex]="element['tabIndex']"
                [property]="'streetAddress'"
                [style.width]="'100%'"
              ></sti-input-text-component>
              <sti-editable-content-component
                [editableContent]="element.streetAddressLabelItem"
                [style.width]="'min-content'"
              ></sti-editable-content-component>
            </div>
            <div class="field" *ngIf="element.useStreetAddress2">
              <sti-input-text-component
                [element]="element"
                [tabIndex]="element['tabIndex'] + 1"
                [property]="'streetAddress2'"
                [style.width]="'100%'"
              ></sti-input-text-component>
              <sti-editable-content-component
                [editableContent]="element.streetAddress2LabelItem"
              ></sti-editable-content-component>
            </div>
            <div
              class="group"
              [style.grid-template-columns]="element.useCity && element.useState ? '50% 50%' : '100%'"
              *ngIf="element.useCity || element.useState"
            >
              <div class="group-field" *ngIf="element.useCity" [style.padding-right.px]="element.useState ? 3 : 0">
                <sti-input-text-component
                  [element]="element"
                  [property]="'city'"
                  [tabIndex]="element['tabIndex'] + 2"
                  [style.width]="'100%'"
                ></sti-input-text-component>
                <sti-editable-content-component
                  [editableContent]="element.cityLabelItem"
                ></sti-editable-content-component>
              </div>
              <div class="group-field" *ngIf="element.useState" [style.padding-left.px]="element.useCity ? 3 : 0">
                <sti-input-text-component
                  [element]="element"
                  [tabIndex]="element['tabIndex'] + 3"
                  [property]="'state'"
                  [style.width]="'100%'"
                ></sti-input-text-component>
                <sti-editable-content-component
                  [editableContent]="element.stateLabelItem"
                ></sti-editable-content-component>
              </div>
            </div>
            <div
              class="group"
              [style.grid-template-columns]="element.useZipCode && element.useCountry ? '50% 50%' : '100%'"
              *ngIf="element.useZipCode || element.useCountry"
            >
              <div class="group-field" *ngIf="element.useZipCode" [style.padding-right.px]="element.useCountry ? 3 : 0">
                <sti-input-text-component
                  [element]="element"
                  [tabIndex]="element['tabIndex'] + 4"
                  [property]="'zipCode'"
                  [style.width]="'100%'"
                ></sti-input-text-component>
                <sti-editable-content-component
                  [editableContent]="element.zipCodeLabelItem"
                ></sti-editable-content-component>
              </div>
              <div class="group-field" *ngIf="element.useCountry" [style.padding-left.px]="element.useZipCode ? 3 : 0">
                <select
                  class="selection"
                  name=""
                  id=""
                  [(ngModel)]="element.country"
                  [style.align-self]="'start'"
                  [style]="element?.comboBoxHtmlStyle()"
                  [style.color]="element?.textColor.toHtmlColor()"
                  [style.background-color]="element?.backgroundColor.toHtmlColor()"
                  [style.border-color]="element?.borderColor.toHtmlColor()"
                  [style.border-width]="borderWidth()"
                  [style.padding-right]="'20px'"
                  [disabled]="element?.readOnly"
                  [required]="element?.required"
                  [tabIndex]="element['tabIndex'] + 5"
                  (mousedown)="disableDrag($event)"
                  (mouseup)="this.model.canDrag = true"
                >
                  <option *ngFor="let country of helper?.countries">{{ country.name }}</option>
                </select>
                <sti-editable-content-component
                  [editableContent]="element.countryLabelItem"
                ></sti-editable-content-component>
              </div>
            </div>
          </div>
        </td>
      </tr>
    </table>
  </sti-component>`, isInline: true, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}.address-form{flex:1}.field{flex:1;margin-bottom:5px}.group{display:grid;grid-template-columns:50% 50%}.group-field{width:100%;margin-bottom:5px}.selection{width:100%;border:1px solid rgb(198,198,198);background-color:#fff;height:fit-content;padding:3px 4px;appearance:none;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3NpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDA2IDc5LjE2NDc1MywgMjAyMS8wMi8xNS0xMTo1MjoxMyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDphNzFiNTVkYi0wMGZlLTVjNDctYmVkZS1jYTVhNjk0NjdkNjgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6N0UxNDE5MzBBNDBDMTFFQkE5MDBCNzU3NjhFQUY2QTQiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6N0UxNDE5MkZBNDBDMTFFQkE5MDBCNzU3NjhFQUY2QTQiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIyLjMgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6YTcxYjU1ZGItMDBmZS01YzQ3LWJlZGUtY2E1YTY5NDY3ZDY4IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOmE3MWI1NWRiLTAwZmUtNWM0Ny1iZWRlLWNhNWE2OTQ2N2Q2OCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pg8NmFEAAABPSURBVHjaYmxsbGSgBDAxUAiGqQH1eNTXE2NAAw5D6qFyBA1oxGIITDNGnLPgcAEDmm0NSAYTNACbIVg14zMAmwsYSDUAr8bRpIwAAAEGAFUJDal4N9jVAAAAAElFTkSuQmCC);background-repeat:no-repeat;background-position:right 5px top 50%;background-size:14px auto}.selection:hover{border-color:#a3bde3!important;background-color:#e2effc!important}.selection:focus{outline:none;border-color:#a3bde3!important;background-color:#fff!important}select:focus>option:checked{background-color:#f6f6f6!important}select option:hover{box-shadow:0 0 10px 100px orange inset}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }, { kind: "component", type: StiInputTextComponent, selector: "sti-input-text-component", inputs: ["element", "property", "tabIndex"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiAddressComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-address-component", template: ` <sti-component [element]="element" [isClone]="isClone" [style.align-items]="'center'" class="StiButton">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.text-align]="element?.getContentAlign()"
      [style.align-self]="'start'"
      [style.width]="element?.getLabelWidth()"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'">
          <div
            class="address-form"
            (mousedown)="disableDrag($event)"
            [style.maxWidth.px]="element.maxWidth + 0.1"
            (mouseup)="this.model.canDrag = true"
          >
            <div class="field" *ngIf="element.useStreetAddress">
              <sti-input-text-component
                [element]="element"
                [tabIndex]="element['tabIndex']"
                [property]="'streetAddress'"
                [style.width]="'100%'"
              ></sti-input-text-component>
              <sti-editable-content-component
                [editableContent]="element.streetAddressLabelItem"
                [style.width]="'min-content'"
              ></sti-editable-content-component>
            </div>
            <div class="field" *ngIf="element.useStreetAddress2">
              <sti-input-text-component
                [element]="element"
                [tabIndex]="element['tabIndex'] + 1"
                [property]="'streetAddress2'"
                [style.width]="'100%'"
              ></sti-input-text-component>
              <sti-editable-content-component
                [editableContent]="element.streetAddress2LabelItem"
              ></sti-editable-content-component>
            </div>
            <div
              class="group"
              [style.grid-template-columns]="element.useCity && element.useState ? '50% 50%' : '100%'"
              *ngIf="element.useCity || element.useState"
            >
              <div class="group-field" *ngIf="element.useCity" [style.padding-right.px]="element.useState ? 3 : 0">
                <sti-input-text-component
                  [element]="element"
                  [property]="'city'"
                  [tabIndex]="element['tabIndex'] + 2"
                  [style.width]="'100%'"
                ></sti-input-text-component>
                <sti-editable-content-component
                  [editableContent]="element.cityLabelItem"
                ></sti-editable-content-component>
              </div>
              <div class="group-field" *ngIf="element.useState" [style.padding-left.px]="element.useCity ? 3 : 0">
                <sti-input-text-component
                  [element]="element"
                  [tabIndex]="element['tabIndex'] + 3"
                  [property]="'state'"
                  [style.width]="'100%'"
                ></sti-input-text-component>
                <sti-editable-content-component
                  [editableContent]="element.stateLabelItem"
                ></sti-editable-content-component>
              </div>
            </div>
            <div
              class="group"
              [style.grid-template-columns]="element.useZipCode && element.useCountry ? '50% 50%' : '100%'"
              *ngIf="element.useZipCode || element.useCountry"
            >
              <div class="group-field" *ngIf="element.useZipCode" [style.padding-right.px]="element.useCountry ? 3 : 0">
                <sti-input-text-component
                  [element]="element"
                  [tabIndex]="element['tabIndex'] + 4"
                  [property]="'zipCode'"
                  [style.width]="'100%'"
                ></sti-input-text-component>
                <sti-editable-content-component
                  [editableContent]="element.zipCodeLabelItem"
                ></sti-editable-content-component>
              </div>
              <div class="group-field" *ngIf="element.useCountry" [style.padding-left.px]="element.useZipCode ? 3 : 0">
                <select
                  class="selection"
                  name=""
                  id=""
                  [(ngModel)]="element.country"
                  [style.align-self]="'start'"
                  [style]="element?.comboBoxHtmlStyle()"
                  [style.color]="element?.textColor.toHtmlColor()"
                  [style.background-color]="element?.backgroundColor.toHtmlColor()"
                  [style.border-color]="element?.borderColor.toHtmlColor()"
                  [style.border-width]="borderWidth()"
                  [style.padding-right]="'20px'"
                  [disabled]="element?.readOnly"
                  [required]="element?.required"
                  [tabIndex]="element['tabIndex'] + 5"
                  (mousedown)="disableDrag($event)"
                  (mouseup)="this.model.canDrag = true"
                >
                  <option *ngFor="let country of helper?.countries">{{ country.name }}</option>
                </select>
                <sti-editable-content-component
                  [editableContent]="element.countryLabelItem"
                ></sti-editable-content-component>
              </div>
            </div>
          </div>
        </td>
      </tr>
    </table>
  </sti-component>`, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}.address-form{flex:1}.field{flex:1;margin-bottom:5px}.group{display:grid;grid-template-columns:50% 50%}.group-field{width:100%;margin-bottom:5px}.selection{width:100%;border:1px solid rgb(198,198,198);background-color:#fff;height:fit-content;padding:3px 4px;appearance:none;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3NpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDA2IDc5LjE2NDc1MywgMjAyMS8wMi8xNS0xMTo1MjoxMyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDphNzFiNTVkYi0wMGZlLTVjNDctYmVkZS1jYTVhNjk0NjdkNjgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6N0UxNDE5MzBBNDBDMTFFQkE5MDBCNzU3NjhFQUY2QTQiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6N0UxNDE5MkZBNDBDMTFFQkE5MDBCNzU3NjhFQUY2QTQiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIyLjMgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6YTcxYjU1ZGItMDBmZS01YzQ3LWJlZGUtY2E1YTY5NDY3ZDY4IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOmE3MWI1NWRiLTAwZmUtNWM0Ny1iZWRlLWNhNWE2OTQ2N2Q2OCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pg8NmFEAAABPSURBVHjaYmxsbGSgBDAxUAiGqQH1eNTXE2NAAw5D6qFyBA1oxGIITDNGnLPgcAEDmm0NSAYTNACbIVg14zMAmwsYSDUAr8bRpIwAAAEGAFUJDal4N9jVAAAAAElFTkSuQmCC);background-repeat:no-repeat;background-position:right 5px top 50%;background-size:14px auto}.selection:hover{border-color:#a3bde3!important;background-color:#e2effc!important}.selection:focus{outline:none;border-color:#a3bde3!important;background-color:#fff!important}select:focus>option:checked{background-color:#f6f6f6!important}select option:hover{box-shadow:0 0 10px 100px orange inset}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }], propDecorators: { element: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiPDFSignatureComponent {
    get align() {
        return "start";
    }
    get cursor() {
        return this.signatureService.drawingMode
            ? `url(${this.model.getImage("signature.Brush.png")}) 8 ${16 * window.devicePixelRatio - 4 * window.devicePixelRatio}, auto`
            : "";
    }
    get canvasWidth() {
        if (this.isClone) {
            return 0;
        }
        else {
            if (this.element["label"]["alignment"] != StiLabelAlignment.Top && this.element["label"]["value"]) {
                return (this.element.width - this.element.label.width - this.element.padding.right - this.element.padding.left - 2);
            }
            else {
                return this.element.width - this.element.padding.right - this.element.padding.left;
            }
        }
    }
    get canvasHeight() {
        if (this.isClone) {
            return 0;
        }
        else {
            if (this.element["label"]["alignment"] != StiLabelAlignment.Top) {
                return this.element.height - this.element.padding.top - this.element.padding.bottom;
            }
            else {
                return (this.element.height -
                    (this.labelRef?.offsetHeight ? this.labelRef?.offsetHeight : 0) -
                    this.element.padding.top -
                    this.element.padding.bottom -
                    (this.labelRef?.offsetHeight ? this.topMargin : 0));
            }
        }
    }
    constructor(model, mouse, resize, loc, signatureService, cdr) {
        this.model = model;
        this.mouse = mouse;
        this.resize = resize;
        this.loc = loc;
        this.signatureService = signatureService;
        this.cdr = cdr;
        this.isClone = false;
        this.topMargin = 8;
    }
    ngAfterContentChecked() { }
    ngOnDestroy() { }
    ngDoCheck() {
        this.labelRef = this.label ? this.label["elementRef"]["nativeElement"] : null;
    }
    ngAfterViewInit() {
        if (!this.isClone) {
            this.element.element = this.sigPad;
            this.cdr.detectChanges();
        }
    }
    onMouseDown(event) { }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPDFSignatureComponent, deps: [{ token: StiModelService }, { token: StiMouseService }, { token: StiComponentResizerService }, { token: StiLocalizationService }, { token: SignatureService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiPDFSignatureComponent, selector: "sti-pdf-signature-component", inputs: { element: "element", isClone: "isClone" }, viewQueries: [{ propertyName: "sigPad", first: true, predicate: ["sigPad"], descendants: true }, { propertyName: "text", first: true, predicate: ["textPreview"], descendants: true }, { propertyName: "ref", first: true, predicate: ["ref"], descendants: true }, { propertyName: "label", first: true, predicate: ["label"], descendants: true }], ngImport: i0, template: ` <sti-component [element]="element" [isClone]="isClone" class="sti-signature">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.align-self]="align"
      [style.text-align]="element?.getContentAlign()"
      [required]="element.required"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [style.width]="element?.getLabelWidth()"
      #label
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'">
          <div [style.align-self]="align" [style.position]="'relative'" [style.display]="'flex'">
            <div
              class="canvas"
              [style.width.px]="canvasWidth"
              [style.height.px]="canvasHeight"
              [style.cursor]="cursor"
            ></div>
            <div
              class="digital-signature"
              [style.width.px]="canvasWidth"
              [style.height.px]="canvasHeight"
              [style.border]="model.previewMode ? '' : '1px dashed lightgray'"
              [style.background-color]="element?.placeholderBackColor.toHtmlColor()"
              [style.position]="'absolute'"
              [style.left]="0"
              [style.top]="0"
              #sigPad
            >
              <h2>{{ element.placeholder }}</h2>
            </div>
          </div>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td>
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, isInline: true, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}.canvas{position:relative;cursor:inherit}.digital-signature{background-color:#d3d3d3;text-align:center;display:flex;align-items:center;justify-content:center;overflow:hidden}.digital-signature h2{color:red;margin:0;font-size:8px}input{visibility:hidden;width:0px}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPDFSignatureComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-pdf-signature-component", template: ` <sti-component [element]="element" [isClone]="isClone" class="sti-signature">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.align-self]="align"
      [style.text-align]="element?.getContentAlign()"
      [required]="element.required"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [style.width]="element?.getLabelWidth()"
      #label
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'max-content'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'">
          <div [style.align-self]="align" [style.position]="'relative'" [style.display]="'flex'">
            <div
              class="canvas"
              [style.width.px]="canvasWidth"
              [style.height.px]="canvasHeight"
              [style.cursor]="cursor"
            ></div>
            <div
              class="digital-signature"
              [style.width.px]="canvasWidth"
              [style.height.px]="canvasHeight"
              [style.border]="model.previewMode ? '' : '1px dashed lightgray'"
              [style.background-color]="element?.placeholderBackColor.toHtmlColor()"
              [style.position]="'absolute'"
              [style.left]="0"
              [style.top]="0"
              #sigPad
            >
              <h2>{{ element.placeholder }}</h2>
            </div>
          </div>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td>
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}.canvas{position:relative;cursor:inherit}.digital-signature{background-color:#d3d3d3;text-align:center;display:flex;align-items:center;justify-content:center;overflow:hidden}.digital-signature h2{color:red;margin:0;font-size:8px}input{visibility:hidden;width:0px}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiMouseService }, { type: StiComponentResizerService }, { type: StiLocalizationService }, { type: SignatureService }, { type: i0.ChangeDetectorRef }], propDecorators: { element: [{
                type: Input
            }], isClone: [{
                type: Input
            }], sigPad: [{
                type: ViewChild,
                args: ["sigPad"]
            }], text: [{
                type: ViewChild,
                args: ["textPreview"]
            }], ref: [{
                type: ViewChild,
                args: ["ref"]
            }], label: [{
                type: ViewChild,
                args: ["label"]
            }] } });

class StiDragPreviewAdornerComponent {
    get x() {
        return Number(this.element?.x + (!this.model.getElementPanel(this.element) ? this.model.lastUsedPage?.padding.left : 0));
    }
    get y() {
        return Number(this.element?.y + (!this.model.getElementPanel(this.element) ? this.model.lastUsedPage?.padding.top : 0));
    }
    get width() {
        return this.element?.width;
    }
    get height() {
        return this.element?.height;
    }
    get id() {
        return this.element?.id;
    }
    get visible() {
        if (this.element?.visible == true) {
            return "visible";
        }
        else {
            return "hidden";
        }
    }
    constructor(model) {
        this.model = model;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDragPreviewAdornerComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiDragPreviewAdornerComponent, selector: "sti-drag-preview-adorner", inputs: { element: "element" }, ngImport: i0, template: ` <div
    class="sti-drag-preview"
    [id]="id"
    [style.left.px]="x"
    [style.top.px]="y"
    [style.width.px]="width"
    [style.height.px]="height"
    [style.visibility]="visible"
  ></div>`, isInline: true, styles: [".sti-drag-preview{background-color:#efefef;border:1px solid rgb(146,146,146);position:absolute;transition:left .1s ease 0s,top .2s ease 0s;-webkit-touch-callout:none;-webkit-user-select:none;opacity:.6;z-index:11}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDragPreviewAdornerComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-drag-preview-adorner", template: ` <div
    class="sti-drag-preview"
    [id]="id"
    [style.left.px]="x"
    [style.top.px]="y"
    [style.width.px]="width"
    [style.height.px]="height"
    [style.visibility]="visible"
  ></div>`, styles: [".sti-drag-preview{background-color:#efefef;border:1px solid rgb(146,146,146);position:absolute;transition:left .1s ease 0s,top .2s ease 0s;-webkit-touch-callout:none;-webkit-user-select:none;opacity:.6;z-index:11}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { element: [{
                type: Input
            }] } });

class StiComponentHolderComponent {
    constructor() {
        this.isClone = false;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiComponentHolderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiComponentHolderComponent, selector: "sti-component-holder", inputs: { element: "element", isClone: "isClone" }, ngImport: i0, template: `
    <ng-container *ngIf="element != null">
      <sti-address-component
        [element]="element"
        *ngIf="element.type === 'AddressElement'"
        [isClone]="isClone"
      ></sti-address-component>
      <sti-textbox-component
        [element]="element"
        *ngIf="element.type === 'Text_BoxElement'"
        [isClone]="isClone"
      ></sti-textbox-component>
      <sti-text-component
        [element]="element"
        *ngIf="element.type === 'TextElement'"
        [isClone]="isClone"
      ></sti-text-component>
      <sti-table-component
        [element]="element"
        *ngIf="element.type === 'TableElement'"
        [isClone]="isClone"
      ></sti-table-component>
      <sti-singleselection-component
        [element]="element"
        *ngIf="element.type === 'Single_SelectionElement'"
        [isClone]="isClone"
      ></sti-singleselection-component>
      <sti-signature-component [element]="element" *ngIf="element.type === 'SignatureElement'" [isClone]="isClone">
      </sti-signature-component>
      <sti-pdf-signature-component
        [element]="element"
        *ngIf="element.type === 'PDFSignatureElement'"
        [isClone]="isClone"
      ></sti-pdf-signature-component>
      <sti-panel-component
        [element]="element"
        *ngIf="element.type === 'PanelElement'"
        [isClone]="isClone"
      ></sti-panel-component>
      <sti-numberbox-component
        [element]="element"
        *ngIf="element.type === 'Number_BoxElement'"
        [isClone]="isClone"
      ></sti-numberbox-component>
      <sti-multipleselection-component
        [element]="element"
        *ngIf="element.type === 'Multiple_SelectionElement'"
        [isClone]="isClone"
      ></sti-multipleselection-component>
      <sti-listbox-component
        [element]="element"
        *ngIf="element.type === 'List_BoxElement'"
        [isClone]="isClone"
      ></sti-listbox-component>
      <sti-label-component
        [element]="element"
        *ngIf="element.type === 'LabelElement'"
        [isClone]="isClone"
      ></sti-label-component>
      <sti-image-component
        [element]="element"
        *ngIf="element.type === 'ImageElement'"
        [isClone]="isClone"
      ></sti-image-component>
      <sti-drag-preview-adorner [element]="element" *ngIf="element.type === 'Drag_Preview'"></sti-drag-preview-adorner>
      <sti-line-component
        [element]="element"
        *ngIf="element.type === 'LineElement'"
        [isClone]="isClone"
      ></sti-line-component>
      <sti-datetimebox-component
        [element]="element"
        *ngIf="element.type === 'DateTime_BoxElement'"
        [isClone]="isClone"
      ></sti-datetimebox-component>
      <sti-combobox-component
        [element]="element"
        *ngIf="element.type === 'Combo_BoxElement'"
        [isClone]="isClone"
      ></sti-combobox-component>
      <sti-checkbox-component
        [element]="element"
        *ngIf="element.type === 'Check_BoxElement'"
        [isClone]="isClone"
      ></sti-checkbox-component>
      <sti-button-component
        [element]="element"
        *ngIf="element.type === 'ButtonElement'"
        [isClone]="isClone"
      ></sti-button-component>
      <sti-barcode-component
        [element]="element"
        *ngIf="element.type === 'BarCodeElement'"
        [isClone]="isClone"
      ></sti-barcode-component>
    </ng-container>
  `, isInline: true, dependencies: [{ kind: "directive", type: i0.forwardRef(() => i5.NgIf), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i0.forwardRef(() => StiTextBoxComponent), selector: "sti-textbox-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiNumberBoxComponent), selector: "sti-numberbox-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiComboBoxComponent), selector: "sti-combobox-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiListBoxComponent), selector: "sti-listbox-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiSingleSelectionComponent), selector: "sti-singleselection-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiMultipleSelectionComponent), selector: "sti-multipleselection-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiCheckBoxComponent), selector: "sti-checkbox-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiLineComponent), selector: "sti-line-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiSignatureComponent), selector: "sti-signature-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiPanelComponent), selector: "sti-panel-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiDateTimeBoxComponent), selector: "sti-datetimebox-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiTableComponent), selector: "sti-table-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiImageComponent), selector: "sti-image-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiButtonComponent), selector: "sti-button-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiBarcodeComponent), selector: "sti-barcode-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiTextComponent), selector: "sti-text-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiDragPreviewAdornerComponent), selector: "sti-drag-preview-adorner", inputs: ["element"] }, { kind: "component", type: i0.forwardRef(() => StiLabelComponent), selector: "sti-label-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiAddressComponent), selector: "sti-address-component", inputs: ["element", "isClone"] }, { kind: "component", type: i0.forwardRef(() => StiPDFSignatureComponent), selector: "sti-pdf-signature-component", inputs: ["element", "isClone"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiComponentHolderComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-component-holder",
                    template: `
    <ng-container *ngIf="element != null">
      <sti-address-component
        [element]="element"
        *ngIf="element.type === 'AddressElement'"
        [isClone]="isClone"
      ></sti-address-component>
      <sti-textbox-component
        [element]="element"
        *ngIf="element.type === 'Text_BoxElement'"
        [isClone]="isClone"
      ></sti-textbox-component>
      <sti-text-component
        [element]="element"
        *ngIf="element.type === 'TextElement'"
        [isClone]="isClone"
      ></sti-text-component>
      <sti-table-component
        [element]="element"
        *ngIf="element.type === 'TableElement'"
        [isClone]="isClone"
      ></sti-table-component>
      <sti-singleselection-component
        [element]="element"
        *ngIf="element.type === 'Single_SelectionElement'"
        [isClone]="isClone"
      ></sti-singleselection-component>
      <sti-signature-component [element]="element" *ngIf="element.type === 'SignatureElement'" [isClone]="isClone">
      </sti-signature-component>
      <sti-pdf-signature-component
        [element]="element"
        *ngIf="element.type === 'PDFSignatureElement'"
        [isClone]="isClone"
      ></sti-pdf-signature-component>
      <sti-panel-component
        [element]="element"
        *ngIf="element.type === 'PanelElement'"
        [isClone]="isClone"
      ></sti-panel-component>
      <sti-numberbox-component
        [element]="element"
        *ngIf="element.type === 'Number_BoxElement'"
        [isClone]="isClone"
      ></sti-numberbox-component>
      <sti-multipleselection-component
        [element]="element"
        *ngIf="element.type === 'Multiple_SelectionElement'"
        [isClone]="isClone"
      ></sti-multipleselection-component>
      <sti-listbox-component
        [element]="element"
        *ngIf="element.type === 'List_BoxElement'"
        [isClone]="isClone"
      ></sti-listbox-component>
      <sti-label-component
        [element]="element"
        *ngIf="element.type === 'LabelElement'"
        [isClone]="isClone"
      ></sti-label-component>
      <sti-image-component
        [element]="element"
        *ngIf="element.type === 'ImageElement'"
        [isClone]="isClone"
      ></sti-image-component>
      <sti-drag-preview-adorner [element]="element" *ngIf="element.type === 'Drag_Preview'"></sti-drag-preview-adorner>
      <sti-line-component
        [element]="element"
        *ngIf="element.type === 'LineElement'"
        [isClone]="isClone"
      ></sti-line-component>
      <sti-datetimebox-component
        [element]="element"
        *ngIf="element.type === 'DateTime_BoxElement'"
        [isClone]="isClone"
      ></sti-datetimebox-component>
      <sti-combobox-component
        [element]="element"
        *ngIf="element.type === 'Combo_BoxElement'"
        [isClone]="isClone"
      ></sti-combobox-component>
      <sti-checkbox-component
        [element]="element"
        *ngIf="element.type === 'Check_BoxElement'"
        [isClone]="isClone"
      ></sti-checkbox-component>
      <sti-button-component
        [element]="element"
        *ngIf="element.type === 'ButtonElement'"
        [isClone]="isClone"
      ></sti-button-component>
      <sti-barcode-component
        [element]="element"
        *ngIf="element.type === 'BarCodeElement'"
        [isClone]="isClone"
      ></sti-barcode-component>
    </ng-container>
  `,
                }]
        }], ctorParameters: () => [], propDecorators: { element: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });
//==========================================================
class StiPanelComponent {
    get elements() {
        return this.element?.elements;
    }
    get borderArea() {
        if (!this.isClone) {
            let borderArea = new StiBorderArea();
            borderArea.top =
                this.ref?.nativeElement?.offsetTop -
                    (this.element.label.alignment != StiLabelAlignment.Top ? this.element.padding.top : 0);
            borderArea.left = this.ref?.nativeElement?.offsetLeft;
            borderArea.width = this.ref?.nativeElement?.offsetWidth - this.element.padding.left - this.element.padding.right;
            borderArea.height = this.ref?.nativeElement?.offsetHeight;
            borderArea.border = this.element.border;
            return borderArea;
        }
    }
    get align() {
        return "start";
    }
    get minWidth() {
        if (this.elements?.length > 0) {
            let minWidth = this.elements[0]?.x + this.elements[0]?.width;
            this.elements.forEach((element) => {
                if (minWidth < element.x + element.width) {
                    minWidth = element.x + element.width;
                }
            });
            return minWidth;
        }
        return "min-content";
    }
    get minHeight() {
        if (!this.model.draggingElement) {
            if (this.elements?.length > 0) {
                let maxBottomPoint = 0;
                this.elements?.forEach((element) => {
                    if (!(element instanceof StiDragPreviewElement) && element.geometry.bottom > maxBottomPoint) {
                        maxBottomPoint = element.geometry.bottom;
                    }
                });
                if (this.currentBottomPoint != maxBottomPoint) {
                    this.render.insertElement(this.element);
                    this.render.checkOutputs(this.model.getElementPage(this.element));
                    this.currentBottomPoint = maxBottomPoint;
                }
                return maxBottomPoint > 0 ? maxBottomPoint : 5;
            }
            else {
                return 5;
            }
        }
    }
    constructor(model, render) {
        this.model = model;
        this.render = render;
        this.isClone = false;
    }
    ngAfterViewInit() {
        if (!this.isClone) {
            this.element.element = this.ref;
        }
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPanelComponent, deps: [{ token: StiModelService }, { token: StiRectangleGeometryLayout }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiPanelComponent, selector: "sti-panel-component", inputs: { element: "element", isClone: "isClone" }, viewQueries: [{ propertyName: "ref", first: true, predicate: ["ref"], descendants: true }], ngImport: i0, template: ` <sti-component [element]="element" [borderArea]="borderArea" [isClone]="isClone" class="sti-panel">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.text-align]="element?.getContentAlign()"
      [style.align-self]="align"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [style.width]="element?.getLabelWidth()"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'100%'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'" [style.height]="'100%'">
          <div
            #ref
            class="sti-panel-container"
            [style.height]="'100%'"
            [style.min-width.px]="minWidth"
            [style.min-height.px]="minHeight"
            [style.align-self]="'center'"
            [style.overflow]="'hidden'"
            [style.background-color]="
              (!element.isAdded &&
                element.backgroundColor.r == 255 &&
                element.backgroundColor.g == 255 &&
                element.backgroundColor.b == 255) ||
              element.backgroundColor.a == 0
                ? 'transparent'
                : element?.backgroundColor.toHtmlColor()
            "
          >
            <div *ngFor="let element of elements" [disabled]="element?.readOnly ? true : false">
              <sti-component-holder [element]="element"></sti-component-holder>
            </div>
          </div>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, isInline: true, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}.sti-panel-container{min-height:5px;position:relative}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiComponent, selector: "sti-component", inputs: ["element", "class", "isClone", "borderArea"] }, { kind: "component", type: StiComponentHolderComponent, selector: "sti-component-holder", inputs: ["element", "isClone"] }, { kind: "component", type: StiEditableContentComponent, selector: "sti-editable-content-component", inputs: ["editableContent", "displayContent", "required", "eParent", "hideEmpty", "active", "alignment", "isTableTotalHeader", "disablePadding", "fromButton", "parentCursor", "isTableHeader"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPanelComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-panel-component", template: ` <sti-component [element]="element" [borderArea]="borderArea" [isClone]="isClone" class="sti-panel">
    <sti-editable-content-component
      *ngIf="element?.label.value?.length > 0 && element?.isLabelTopAlignment()"
      [editableContent]="element.label"
      [style.text-align]="element?.getContentAlign()"
      [style.align-self]="align"
      [hideEmpty]="element.showLabelPlaceholder(model?.selectedComponent?.element == element)"
      [style.width]="element?.getLabelWidth()"
    ></sti-editable-content-component>
    <table [style.width]="'100%'" [style.height]="'100%'" [style.margin-top.px]="element?.getTopMargin()">
      <tr>
        <td
          *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"
          [style.display]="'flex'"
          [style.height]="'100%'"
          [style.width]="element?.getLabelWidth()"
          [style.align-items]="element?.getVerticalAlignment()"
        >
          <sti-editable-content-component
            *ngIf="element?.label.value?.length > 0"
            [editableContent]="element?.label"
            [required]="element.required"
            [style.text-align]="element?.getContentAlign()"
            [style.width]="element?.getLabelWidth()"
            [hideEmpty]="element?.showLabelPlaceholder(model?.selectedComponent?.element == element)"
          ></sti-editable-content-component>
        </td>
        <td [style.width]="'100%'" [style.height]="'100%'">
          <div
            #ref
            class="sti-panel-container"
            [style.height]="'100%'"
            [style.min-width.px]="minWidth"
            [style.min-height.px]="minHeight"
            [style.align-self]="'center'"
            [style.overflow]="'hidden'"
            [style.background-color]="
              (!element.isAdded &&
                element.backgroundColor.r == 255 &&
                element.backgroundColor.g == 255 &&
                element.backgroundColor.b == 255) ||
              element.backgroundColor.a == 0
                ? 'transparent'
                : element?.backgroundColor.toHtmlColor()
            "
          >
            <div *ngFor="let element of elements" [disabled]="element?.readOnly ? true : false">
              <sti-component-holder [element]="element"></sti-component-holder>
            </div>
          </div>
        </td>
      </tr>
      <tr *ngIf="element?.description.value?.length > 0">
        <td *ngIf="element?.label.value?.length > 0 && !element?.isLabelTopAlignment()"></td>
        <td [style.maxWidth.px]="element.maxWidth + 1">
          <sti-editable-content-component
            *ngIf="element?.description.value?.length > 0"
            [editableContent]="element.description"
          >
          </sti-editable-content-component>
        </td>
      </tr>
    </table>
  </sti-component>`, styles: ["table{border-spacing:0}tr{height:max-content;padding:0;margin:0}td{height:100%;padding:0;margin:0}.sti-panel-container{min-height:5px;position:relative}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiRectangleGeometryLayout }], propDecorators: { ref: [{
                type: ViewChild,
                args: ["ref"]
            }], element: [{
                type: Input
            }], isClone: [{
                type: Input
            }] } });

class StiToolboxService {
    isEnabled(element) {
        if (this.unusedElements?.find((item) => item == element.id) || !this.isEnabledFromSettings(element)) {
            return false;
        }
        else {
            return true;
        }
    }
    isEnabledFromSettings(element) {
        return this.model.getBooleanSetting(this.idToCamelCase(element?.id)) ?? true;
    }
    getToolboxId(type) {
        if (type == "TextElement" || type == "Text") {
            return "text";
        }
        else if (type == "Text_BoxElement" || type == "TextBox") {
            return "textbox";
        }
        else if (type == "TableElement" || type == "Table") {
            return "table";
        }
        else if (type == "Single_SelectionElement" || type == "SingleSelection") {
            return "singleSelection";
        }
        else if (type == "SignatureElement" || type == "Signature") {
            return "signature";
        }
        else if (type == "PDFSignatureElement" || type == "PDFSignature") {
            return "PDFsignature";
        }
        else if (type == "PanelElement" || type == "Panel") {
            return "panel";
        }
        else if (type == "Number_BoxElement" || type == "NumberBox") {
            return "numberbox";
        }
        else if (type == "Multiple_SelectionElement" || type == "MultipleSelection") {
            return "multipleSelection";
        }
        else if (type == "List_BoxElement" || type == "ListBox") {
            return "listbox";
        }
        else if (type == "LineElement" || type == "Line") {
            return "line";
        }
        else if (type == "LabelElement" || type == "Label") {
            return "label";
        }
        else if (type == "ImageElement" || type == "Image") {
            return "image";
        }
        else if (type == "DateTime_BoxElement" || type == "DateTimeBox") {
            return "dateTime";
        }
        else if (type == "Combo_BoxElement" || type == "ComboBox") {
            return "combobox";
        }
        else if (type == "Check_BoxElement" || type == "CheckBox") {
            return "checkbox";
        }
        else if (type == "ButtonElement" || type == "Button") {
            return "button";
        }
        else if (type == "BarCodeElement" || type == "BarCode") {
            return "barcode";
        }
        else if (type == "AddressElement" || type == "Address") {
            return "address";
        }
    }
    idToCamelCase(id) {
        switch (id) {
            case "textbox":
                return "showTextBox";
            case "numberbox":
                return "showNumberBox";
            case "combobox":
                return "showComboBox";
            case "listbox":
                return "showListBox";
            case "singleSelection":
                return "showSingleSelection";
            case "multipleSelection":
                return "showMultipleSelection";
            case "checkbox":
                return "showCheckBox";
            case "signature":
                return "showSignature";
            /*  case "PDFsignature":
              return "showPDFSignature"; */
            case "dateTime":
                return "showDateTimeBox";
            case "table":
                return "showTable";
            case "button":
                return "showButton";
            case "barcode":
                return "showBarCode";
            case "address":
                return "showAddress";
            case "label":
                return "showLabel";
            case "text":
                return "showText";
            case "image":
                return "showImage";
            case "line":
                return "showLine";
            case "panel":
                return "showPanel";
        }
    }
    isGroupEnabled(group) {
        if (group.caption == "Input" ||
            group.caption == "Selection" ||
            group.caption == "Other" ||
            group.caption == "Divider") {
            if (group.caption == "Input") {
                if (!this.unusedElements?.find((item) => item == "textbox") ||
                    !this.unusedElements?.find((item) => item == "numberbox") ||
                    !this.unusedElements?.find((item) => item == "combobox") ||
                    !this.unusedElements?.find((item) => item == "dateTime")) {
                    return true;
                }
                else {
                    return false;
                }
            }
            else if (group.caption == "Selection") {
                if (!this.unusedElements?.find((item) => item == "singleSelection") ||
                    !this.unusedElements?.find((item) => item == "multipleSelection") ||
                    !this.unusedElements?.find((item) => item == "listbox") ||
                    !this.unusedElements?.find((item) => item == "checkbox")) {
                    return true;
                }
                else {
                    return false;
                }
            }
            else if (group.caption == "Other") {
                if (!this.unusedElements?.find((item) => item == "signature") ||
                    !this.unusedElements?.find((item) => item == "PDFsignature") ||
                    !this.unusedElements?.find((item) => item == "barcode") ||
                    !this.unusedElements?.find((item) => item == "address") ||
                    !this.unusedElements?.find((item) => item == "line")) {
                    return true;
                }
                else {
                    return false;
                }
            }
        }
        else {
            return true;
        }
    }
    isInsertInlineElementsDividerEnabled(element) {
        if (element.caption == "Divider") {
            if (!this.unusedElements?.find((item) => item == "textbox") ||
                !this.unusedElements?.find((item) => item == "numberbox") ||
                !this.unusedElements?.find((item) => item == "combobox") ||
                !this.unusedElements?.find((item) => item == "dateTime") ||
                !this.unusedElements?.find((item) => item == "singleSelection") ||
                !this.unusedElements?.find((item) => item == "multipleSelection") ||
                !this.unusedElements?.find((item) => item == "listbox") ||
                !this.unusedElements?.find((item) => item == "checkbox") ||
                !this.unusedElements?.find((item) => item == "signature") ||
                !this.unusedElements?.find((item) => item == "PDFsignature") ||
                !this.unusedElements?.find((item) => item == "barcode") ||
                !this.unusedElements?.find((item) => item == "address") ||
                !this.unusedElements?.find((item) => item == "line")) {
                return true;
            }
            else {
                return false;
            }
        }
        else {
            return false;
        }
    }
    isToolboxInlineElementsDividerEnabled(element) {
        if (element.caption == "Divider") {
            if (!this.unusedElements?.find((item) => item == "textbox") ||
                !this.unusedElements?.find((item) => item == "numberbox") ||
                !this.unusedElements?.find((item) => item == "combobox") ||
                !this.unusedElements?.find((item) => item == "dateTime") ||
                !this.unusedElements?.find((item) => item == "singleSelection") ||
                !this.unusedElements?.find((item) => item == "multipleSelection") ||
                !this.unusedElements?.find((item) => item == "listbox") ||
                !this.unusedElements?.find((item) => item == "checkbox") ||
                !this.unusedElements?.find((item) => item == "signature") ||
                !this.unusedElements?.find((item) => item == "PDFsignature") ||
                !this.unusedElements?.find((item) => item == "barcode") ||
                !this.unusedElements?.find((item) => item == "address") ||
                !this.unusedElements?.find((item) => item == "table") ||
                !this.unusedElements?.find((item) => item == "button")) {
                return true;
            }
            else {
                return false;
            }
        }
        else {
            return false;
        }
    }
    isInsertOutlineElementsDividerEnabled() {
        if (!this.unusedElements?.find((item) => item == "table") ||
            !this.unusedElements?.find((item) => item == "button") ||
            !this.unusedElements?.find((item) => item == "label") ||
            !this.unusedElements?.find((item) => item == "text") ||
            !this.unusedElements?.find((item) => item == "image") ||
            !this.unusedElements?.find((item) => item == "panel")) {
            return true;
        }
        else {
            return false;
        }
    }
    isToolboxOutlineElementsDividerEnabled() {
        if (!this.unusedElements?.find((item) => item == "label") ||
            !this.unusedElements?.find((item) => item == "text") ||
            !this.unusedElements?.find((item) => item == "image") ||
            !this.unusedElements?.find((item) => item == "line") ||
            !this.unusedElements?.find((item) => item == "panel")) {
            return true;
        }
        else {
            return false;
        }
    }
    haveEnabledComponents() {
        let isEnabled = false;
        for (let element of this.elements) {
            if (element.enabled) {
                isEnabled = true;
                break;
            }
        }
        return isEnabled;
    }
    constructor(mouseService, draggableService, model, loc) {
        this.mouseService = mouseService;
        this.draggableService = draggableService;
        this.model = model;
        this.loc = loc;
        this.showGroupPreview = false;
        this.elementsForRibbon = [
            {
                caption: "Input",
                image: "images.Toolbox.StiTextBoxElement.png",
                category: "PropertyMain",
            },
            {
                caption: "Selection",
                image: "images.Toolbox.StiSingleSelectionElement.png",
            },
            {
                caption: "Others",
                image: "images.Toolbox.StiSignatureElement.png",
                category: "FormDesigner",
            },
            { caption: "Divider" },
            {
                caption: "StiTable",
                image: "images.Toolbox.StiTableElement.png",
                id: "table",
                component: StiTableComponent,
                element: StiTableElement,
                setForm: true
            },
            {
                caption: "StiButton",
                image: "images.Toolbox.StiButtonElement.png",
                id: "button",
                component: StiButtonComponent,
                element: StiButtonElement,
            },
            {
                caption: "StiLabelControl",
                image: "images.Toolbox.StiLabelElement.png",
                id: "label",
                component: StiLabelComponent,
                element: StiLabelElement,
                category: "Dialogs",
            },
            {
                caption: "StiText",
                image: "images.Toolbox.StiRichTextElement.png",
                id: "text",
                component: StiTextComponent,
                element: StiTextElement,
            },
            {
                caption: "StiImage",
                image: "images.Toolbox.StiImageElement.png",
                id: "image",
                component: StiImageComponent,
                element: StiImageElement,
            },
            {
                caption: "StiPanel",
                image: "images.Toolbox.StiPanelElement.png",
                id: "panel",
                component: StiPanelComponent,
                element: StiPanelElement,
            },
        ];
        this.inputGroup = [
            {
                caption: "StiTextBoxControl",
                image: "images.Toolbox.StiTextBoxElement.png",
                id: "textbox",
                component: StiTextBoxComponent,
                element: StiTextBoxElement,
                category: "Dialogs",
            },
            {
                caption: "StiNumberBox",
                image: "images.Toolbox.StiNumberBoxElement.png",
                id: "numberbox",
                component: StiNumberBoxComponent,
                element: StiNumberBoxElement,
            },
            {
                caption: "StiComboBox",
                image: "images.Toolbox.StiComboBoxElement.png",
                id: "combobox",
                component: StiComboBoxComponent,
                element: StiComboBoxElement,
            },
            {
                caption: "StiDateTimePickerControl",
                image: "images.Toolbox.StiDateTimeBoxElement.png",
                id: "dateTime",
                component: StiDateTimeBoxComponent,
                element: StiDateTimeBoxElement,
                setForm: true,
                category: "Dialogs",
            },
        ];
        this.selectionGroup = [
            {
                caption: "StiSingleSelection",
                image: "images.Toolbox.StiSingleSelectionElement.png",
                id: "singleSelection",
                component: StiSingleSelectionComponent,
                element: StiSingleSelectionElement,
            },
            {
                caption: "StiMultipleSelection",
                image: "images.Toolbox.StiMultipleSelectionElement.png",
                id: "multipleSelection",
                component: StiMultipleSelectionComponent,
                element: StiMultipleSelectionElement,
            },
            {
                caption: "StiListBox",
                image: "images.Toolbox.StiListBoxElement.png",
                id: "listbox",
                component: StiListBoxComponent,
                element: StiListBoxElement,
            },
            {
                caption: "StiCheckBox",
                image: "images.Toolbox.StiCheckBoxElement.png",
                id: "checkbox",
                component: StiCheckBoxComponent,
                element: StiCheckBoxElement,
            },
        ];
        this.otherGroup = [
            {
                caption: "StiElectronicSignature",
                image: "images.Toolbox.StiElectronicSignature.png",
                id: "signature",
                component: StiSignatureComponent,
                element: StiSignatureElement,
            },
            {
                caption: "StiPdfDigitalSignature",
                image: "images.Toolbox.StiPdfDigitalSignature.png",
                id: "PDFsignature",
                component: StiPDFSignatureComponent,
                element: StiPDFSignatureElement,
            },
            {
                caption: "StiBarCode",
                image: "images.Toolbox.StiBarCodeElement.png",
                id: "barcode",
                component: StiBarcodeComponent,
                element: StiBarcodeElement,
            },
            {
                caption: "Address",
                image: "images.Toolbox.Address.png",
                id: "address",
                component: StiAddressComponent,
                element: StiAddressElement,
                category: "Report",
            },
            {
                caption: "Line",
                image: "images.Toolbox.StiLineElement.png",
                id: "line",
                component: StiLineComponent,
                element: StiLineElement,
                category: "Chart",
            },
        ];
        this.elements = [
            {
                caption: "StiTextBoxControl",
                image: "images.Toolbox.StiTextBoxElement.png",
                id: "textbox",
                component: StiTextBoxComponent,
                element: StiTextBoxElement,
                enabled: true,
                category: "Dialogs",
            },
            {
                caption: "StiNumberBox",
                image: "images.Toolbox.StiNumberBoxElement.png",
                id: "numberbox",
                component: StiNumberBoxComponent,
                element: StiNumberBoxElement,
                enabled: true,
            },
            {
                caption: "StiComboBox",
                image: "images.Toolbox.StiComboBoxElement.png",
                id: "combobox",
                component: StiComboBoxComponent,
                element: StiComboBoxElement,
                enabled: true,
            },
            {
                caption: "StiListBox",
                image: "images.Toolbox.StiListBoxElement.png",
                id: "listbox",
                component: StiListBoxComponent,
                element: StiListBoxElement,
                enabled: true,
            },
            {
                caption: "StiSingleSelection",
                image: "images.Toolbox.StiSingleSelectionElement.png",
                id: "singleSelection",
                component: StiSingleSelectionComponent,
                element: StiSingleSelectionElement,
                enabled: true,
            },
            {
                caption: "StiMultipleSelection",
                image: "images.Toolbox.StiMultipleSelectionElement.png",
                id: "multipleSelection",
                component: StiMultipleSelectionComponent,
                element: StiMultipleSelectionElement,
                enabled: true,
            },
            {
                caption: "StiCheckBox",
                image: "images.Toolbox.StiCheckBoxElement.png",
                id: "checkbox",
                component: StiCheckBoxComponent,
                element: StiCheckBoxElement,
                enabled: true,
            },
            {
                caption: "StiElectronicSignature",
                image: "images.Toolbox.StiElectronicSignature.png",
                id: "signature",
                component: StiSignatureComponent,
                element: StiSignatureElement,
                enabled: true,
            },
            {
                caption: "StiPdfDigitalSignature",
                image: "images.Toolbox.StiPdfDigitalSignature.png",
                id: "PDFsignature",
                component: StiPDFSignatureComponent,
                element: StiPDFSignatureElement,
                enabled: true,
            },
            {
                caption: "StiDateTimePickerControl",
                image: "images.Toolbox.StiDateTimeBoxElement.png",
                id: "dateTime",
                component: StiDateTimeBoxComponent,
                element: StiDateTimeBoxElement,
                enabled: true,
                category: "Dialogs",
            },
            {
                caption: "StiTable",
                image: "images.Toolbox.StiTableElement.png",
                id: "table",
                component: StiTableComponent,
                element: StiTableElement,
                enabled: true,
                setForm: true
            },
            {
                caption: "StiButton",
                image: "images.Toolbox.StiButtonElement.png",
                id: "button",
                component: StiButtonComponent,
                element: StiButtonElement,
                enabled: true,
            },
            {
                caption: "StiBarCode",
                image: "images.Toolbox.StiBarCodeElement.png",
                id: "barcode",
                component: StiBarcodeComponent,
                element: StiBarcodeElement,
                enabled: true,
            },
            {
                caption: "Address",
                image: "images.Toolbox.Address.png",
                id: "address",
                component: StiAddressComponent,
                element: StiAddressElement,
                enabled: true,
                category: "Report",
            },
            { caption: "Divider" },
            {
                caption: "StiLabelControl",
                image: "images.Toolbox.StiLabelElement.png",
                id: "label",
                component: StiLabelComponent,
                element: StiLabelElement,
                enabled: true,
                category: "Dialogs",
            },
            {
                caption: "StiText",
                image: "images.Toolbox.StiRichTextElement.png",
                id: "text",
                component: StiTextComponent,
                element: StiTextElement,
                enabled: true,
            },
            {
                caption: "StiImage",
                image: "images.Toolbox.StiImageElement.png",
                id: "image",
                component: StiImageComponent,
                element: StiImageElement,
                enabled: true,
            },
            {
                caption: "Line",
                image: "images.Toolbox.StiLineElement.png",
                id: "line",
                component: StiLineComponent,
                element: StiLineElement,
                enabled: true,
                category: "Chart",
            },
            {
                caption: "StiPanel",
                image: "images.Toolbox.StiPanelElement.png",
                id: "panel",
                component: StiPanelComponent,
                element: StiPanelElement,
                enabled: true,
            },
        ];
        this.unusedElements = [];
        this.subject = new Subject();
        this.showToolbox = true;
        mouseService.getDocumentMouseMove().subscribe((event) => {
            this.onMouseMove(event);
        });
        mouseService.getDocumentMouseUp().subscribe(() => {
            // this.mouseDownComponent = null;
        });
    }
    getMessage() {
        return this.subject.asObservable();
    }
    elementMouseDown(component, event) {
        this.mouseDownComponent = component;
        this.mouseDownX = event.clientX;
        this.mouseDownY = event.clientY;
    }
    elementDoubleClick(component) {
        this.mouseDownComponent = null;
        let element = new component.element.element(component.element.setForm ? this.model.form : undefined);
        this.model.form.settings.applySettings(element);
        this.draggableService.addingByDoubleClick(element);
    }
    onMouseMove(event) {
        if (this.mouseDownComponent &&
            Math.max(Math.abs(this.mouseDownX - event.clientX), Math.abs(this.mouseDownY - event.clientY)) >
                StiDraggableService.MOUSE_DELTA) {
            let element = new this.mouseDownComponent.element.element(this.mouseDownComponent.element.setForm ? this.model.form : undefined);
            this.model.form.settings.applySettings(element);
            this.model.elementToUpdate = element;
            this.draggableService.startDrag(event, element);
            if (this.model.showGroupPreview) {
                this.model.showGroupPreview = false;
            }
            this.mouseDownComponent = null;
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiToolboxService, deps: [{ token: StiMouseService }, { token: StiDraggableService }, { token: StiModelService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiToolboxService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiToolboxService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiMouseService }, { type: StiDraggableService }, { type: StiModelService }, { type: StiLocalizationService }] });

class StiThemeService {
    get currentTheme() {
        return this._currentTheme;
    }
    set currentTheme(value) {
        this._currentTheme = value;
        this.currentThemeSubj.next(value);
    }
    getIcon(type) {
        if (type == "All") {
            return this.model.getImage("images.Properties.BorderAll.png");
        }
        else if (type == "None") {
            return this.model.getImage("images.Properties.BorderNone.png");
        }
        else if (type == "Top") {
            return this.model.getImage("images.Properties.BorderTop.png");
        }
        else if (type == "Left") {
            return this.model.getImage("images.Properties.BorderLeft.png");
        }
        else if (type == "Bottom") {
            return this.model.getImage("images.Properties.BorderBottom.png");
        }
        else if (type == "Right") {
            return this.model.getImage("images.Properties.BorderRight.png");
        }
        else if (type == "GridAll") {
            return this.model.getImage("images.Properties.GridLinesAll.png");
        }
        else if (type == "GridNone") {
            return this.model.getImage("images.Properties.GridLinesNone.png");
        }
        else if (type == "Vertical") {
            return this.model.getImage("images.Properties.GridLinesVertical.png");
        }
        else if (type == "Horizontal") {
            return this.model.getImage("images.Properties.GridLinesHorizontal.png");
        }
    }
    changeTheme() {
        if (this.currentTheme == "Light") {
            if (document.getElementById("CurrentTheme")) {
                document.getElementById("CurrentTheme").remove();
            }
            let head = document.getElementsByTagName("head")[0];
            let style = document.createElement("style");
            style.id = "CurrentTheme";
            style.innerHTML = `:root {
        --back-color: rgb(255, 255, 255);
        --workspace-color: rgb(236,236,236);
        --modalNav-color: rgb(236, 236, 236);
        --modalBorder-color: rgb(195, 195, 195);
        --text-color: rgb(85, 85, 85);
        --property-label-color: rgb(118,118,118);
        --input-color: white;
        --inputBorder-color: rgb(107, 107, 107);
        --track-color: rgb(154, 154, 153);
        --trackHover-color: rgb(170, 171, 169);
        --thumb-color: rgb(192, 192, 191);
        --hover-color: rgb(218, 218, 218);
        --active-color: rgb(239, 239, 239);
        --focus-color: rgb(170, 171, 169);
        --formBorder-color: rgb(224, 224, 224);
        --arrowHover-color: rgb(195, 195, 195);
        --columnDeleteHover-color: rgb(209, 208, 207);
        --toolbarResizer-color: white;
        --toolbarResizerBorder-color: rgb(220, 219, 217);
        --pageNavBackground-color: white;
        --pageNavBorder-color: rgb(220, 219, 217);
        --pageNavDisable-color: rgb(244, 244, 244);
    }`;
            head.appendChild(style);
        }
        else {
            if (document.getElementById("CurrentTheme")) {
                document.getElementById("CurrentTheme").remove();
            }
            let head = document.getElementsByTagName("head")[0];
            let style = document.createElement("style");
            style.id = "CurrentTheme";
            style.innerHTML = `:root {
        --back-color: rgb(51, 51, 51);
        --workspace-color: rgb(45,45,45);
        --modalNav-color: rgb(54, 54, 55);
        --modalBorder-color: rgb(45, 45, 45);
        --text-color: rgb(255, 255, 255);
        --property-label-color: rgb(167,167,167);
        --input-color: rgb(43, 43, 43);
        --inputBorder-color: rgb(190, 190, 190);
        --track-color: rgb(71, 71, 71);
        --trackHover-color: rgb(94, 95, 93);
        --thumb-color: rgb(71, 71, 71);
        --hover-color: rgb(80, 80, 80);
        --active-color: rgb(59, 59, 59);
        --focus-color: rgb(91, 91, 91);
        --formBorder-color: rgb(79, 79, 79);
        --arrowHover-color: rgb(124, 124, 124);
        --columnDeleteHover-color: rgb(132, 132, 132);
        --toolbarResizer-color: rgb(71, 71, 71);
        --toolbarResizerBorder-color: rgb(71, 71, 71);
        --pageNavBackground-color: rgb(71, 71, 71);
        --pageNavBorder-color: rgb(64, 64, 64);
        --pageNavDisable-color: rgb(55, 55, 55);
    }`;
            head.appendChild(style);
        }
    }
    constructor(model) {
        this.model = model;
        this.currentThemeSubj = new Subject();
        this.currentThemeSubj.subscribe(() => this.changeTheme());
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiThemeService, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiThemeService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiThemeService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }] });

class StiLocalStorageService {
    constructor() { }
    getItem(key) {
        try {
            return localStorage.getItem(key);
        }
        catch {
            return null;
        }
    }
    setItem(key, value) {
        try {
            localStorage.setItem(key, value);
        }
        catch { }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiLocalStorageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiLocalStorageService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiLocalStorageService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [] });

class StiExportService {
    constructor(model, httpService) {
        this.model = model;
        this.httpService = httpService;
        this.showModalWindow = false;
        this.useReadOnly = false;
        this.usePdfA = false;
        this.openAfterExport = false;
    }
    exportToPdf() {
        let currentForm = this.model.form.saveToReportJsonObject().serialize();
        let data = {
            action: "GeneratePDF",
            form: currentForm,
            settings: {
                usePdfA: this.usePdfA,
                readOnly: this.useReadOnly,
            },
        };
        this.httpService.post(this.model.requestUrl, data, "byteArray", { showProgress: true }).subscribe((data) => {
            let pdfBytes = new Int8Array(data);
            this.model.showProgress = false;
            this.model.downloadFiles(pdfBytes, "ExportFromForm.pdf");
        });
    }
    getPdfBytes() {
        let currentForm = this.model.form.saveToReportJsonObject().serialize();
        let data = {
            action: "GeneratePDF",
            form: currentForm,
            settings: {
                usePdfA: this.usePdfA,
                readOnly: this.useReadOnly,
            },
        };
        return this.httpService
            .post(this.model.requestUrl, data, "byteArray", { showProgress: true })
            .toPromise()
            .then((res) => {
            this.model.showProgress = false;
            return new Int8Array(res);
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiExportService, deps: [{ token: StiModelService }, { token: StiHttpClientService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiExportService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiExportService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHttpClientService }] });

class StiControllerService {
    constructor(model, httpClient, helper, userService, loc, formService, stiLocalStorage, exportService, draggableService) {
        this.model = model;
        this.httpClient = httpClient;
        this.helper = helper;
        this.userService = userService;
        this.loc = loc;
        this.formService = formService;
        this.stiLocalStorage = stiLocalStorage;
        this.exportService = exportService;
        this.draggableService = draggableService;
        this.USED_PROPERTIES = [
            "localization",
            "accountUserProperties",
            "localizationList",
            "licenseProducts",
            "creationDate",
            "version",
            "fontFamilies",
            "imagesArray",
        ];
        formService.serviceEvents.subscribe((data) => {
            switch (data.action) {
                case "postData":
                    this.httpClient.post(this.model.requestUrl, data.data, "json", data.options).subscribe((result) => {
                        this.model.showProgress = false;
                        if (data.func) {
                            data.func(result);
                        }
                    });
                    break;
                case "showFileMenu":
                    this.model.formEvents.next({ name: "ShowFileMenu" });
                    break;
                case "showSaveMenu":
                    this.model.formEvents.next({ name: "ShowSaveMenu" });
                    break;
                case "showTab":
                    this.model.formEvents.next({ name: "ShowTab", value: data.tabName });
                    break;
                case "exportToPdf":
                    this.exportService.useReadOnly = data.readOnly;
                    this.exportService.usePdfA = data.pdfACompliance;
                    this.exportService.exportToPdf();
                    break;
                case "getPdfBytes":
                    this.exportService.useReadOnly = data.readOnly;
                    this.exportService.usePdfA = data.pdfACompliance;
                    this.exportService.getPdfBytes().then((val) => {
                        this.formService.serviceEventsCallbacks.next({ action: "pdfBytesCallback", value: val });
                    });
                    break;
                case "setZoom":
                    this.model.setZoomFromString(data.zoom);
                    break;
                case "addElementToForm":
                    this.draggableService.addingByDoubleClick(data.element);
                    break;
            }
        });
    }
    initialize() {
        if (this.model.properties?.cloudLoginInfo) {
            this.model.login = this.model.properties.cloudLoginInfo;
            return;
        }
        let localization;
        if (this.stiLocalStorage.getItem("StiFormsLocalization") != null &&
            this.stiLocalStorage.getItem("StiFormsLocalization") != undefined &&
            this.stiLocalStorage.getItem("StiFormsLocalization") != "undefined") {
            localization = JSON.parse(this.stiLocalStorage.getItem("StiFormsLocalization"));
        }
        let currentLocalization = (localization?.cultureName) ?? (StiStaticHelperService.browserLanguage ?? "en");
        let scale = window.devicePixelRatio;
        this.httpClient
            .post(this.model.requestUrl, { action: "Initialize", currentLocalization: currentLocalization, scaleFactor: scale }, "json", { showProgress: this.model.loadingFromCloud ? false : true })
            .subscribe((data) => {
            if (this.model.properties) {
                delete this.model.properties?.cloudLogin;
                delete this.model.properties?.cloudPassword;
            }
            if (data["cloudReload"]) {
                document.location.href = document.location.href;
                return;
            }
            let options = (this.model.options = data);
            StiLocalizationService.setLocalization(options.localization);
            this.model.assemblyInfo = options.assemblyInfo;
            this.userService.licenseProducts = options.licenseProducts;
            this.userService.currentUser = options.accountUserProperties;
            this.model.userName = options.userName;
            this.loc.localizationList = this.model.toCamelCase(options.localizationList);
            let localizationSetting = data["localizationSetting"];
            let defaultLocalization = StiStaticHelperService.browserLanguage;
            if (!this.loc.localizationList?.find((item) => item.cultureName == defaultLocalization)) {
                defaultLocalization = defaultLocalization.substring(0, 2);
            }
            this.loc.defaultLocalization = this.loc.localizationList?.find((item) => item.cultureName == defaultLocalization);
            if (localizationSetting && localizationSetting.length > 0) {
                this.loc.currentLocalization = this.loc.localizationList?.find((item) => item.cultureName == localizationSetting);
            }
            else {
                if (!this.loc.currentLocalization) {
                    if (currentLocalization != this.loc.defaultLocalization?.cultureName) {
                        this.loc.currentLocalization = this.loc.localizationList?.find((item) => item.cultureName == currentLocalization);
                    }
                    else {
                        this.loc.currentLocalization = this.loc.localizationList?.find((item) => item.cultureName == defaultLocalization);
                    }
                }
            }
            if (options.creationDate) {
                this.userService.buildDate = new Date(options.creationDate);
                this.model.buildDate = options.creationDate;
            }
            else {
                this.userService.buildDate = new Date(options.assemblyInfo?.created);
                this.model.buildDate = options.assemblyInfo?.created;
            }
            if (this.model?.properties?.cloudPlanIdent) {
            }
            else {
                this.userService.checkLicense();
            }
            this.model.buildVersion = options.assemblyInfo.version;
            if (options.fontFamilies) {
                let fontFamilies = [];
                options.fontFamilies.forEach((f) => fontFamilies.push({ name: f }));
                this.model.fontFamilies = fontFamilies;
            }
            if (options.imagesArray) {
                this.model.imagesArray = options.imagesArray;
            }
            this.model.showProgress = false;
            this.model.needToRefresh.next(true);
            this.helper.updateHelper();
            setTimeout(() => {
                this.model.showTrialLog();
            });
            let eventData = {};
            this.model.isInitialized = true;
            setTimeout(() => {
                if (this.model.isWebView && this.model.showTrialBar) {
                    this.model.showTrialTimerWindow = true;
                }
            }, 3000);
            this.model.setZoomFromString(this.model?.settings?.zoom);
            StiObject.keys(options)
                .filter((p) => this.USED_PROPERTIES.indexOf(p) == -1)
                .forEach((prop) => (eventData[prop] = options[prop]));
            this.model.interfaceEvent.next({ name: "Loaded", data: eventData });
        }, (error) => {
            if (!this.model?.properties?.cloudPlanIdent) {
                this.userService.checkLicense();
            }
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiControllerService, deps: [{ token: StiModelService }, { token: StiHttpClientService }, { token: StiHelperService }, { token: StiUserService }, { token: StiLocalizationService }, { token: StimulsoftFormsService }, { token: StiLocalStorageService }, { token: StiExportService }, { token: StiDraggableService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiControllerService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiControllerService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHttpClientService }, { type: StiHelperService }, { type: StiUserService }, { type: StiLocalizationService }, { type: StimulsoftFormsService }, { type: StiLocalStorageService }, { type: StiExportService }, { type: StiDraggableService }] });

class StiChangesService {
    constructor(model, mouseService) {
        this.model = model;
        this.mouseService = mouseService;
        this.forceChanged = false;
        this.started = false;
        model.formEvents.subscribe((e) => {
            if (e.name == "SetForm" || e.name == "UpdateForm") {
                this.savedForm = this.model.form.saveToJsonObject({ notSerializeImages: true }).serialize();
            }
        });
    }
    start() {
        if (this.started) {
            return;
        }
        let this_ = this;
        setInterval(() => {
            if (this_.model.form &&
                this_.model.draggingElement == null &&
                !this_.mouseService.leftButtonDown &&
                this.model.elementToUpdate == null) {
                let s = this_.model.form.saveToJsonObject({ notSerializeImages: true }).serialize();
                let equals = this_.savedForm == s;
                if (!equals || this_.forceChanged) {
                    this_.savedForm = s;
                    this_.model.formEvents.next({ name: "FormChanged" });
                    this_.forceChanged = false;
                }
            }
        }, 1000);
    }
    forceChanges() {
        this.forceChanged = true;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiChangesService, deps: [{ token: StiModelService }, { token: StiMouseService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiChangesService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiChangesService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiMouseService }] });

class FormEventsService {
    static dateToJsonDate(date) {
        let offset = date.getTimezoneOffset() * -1;
        let hoursOffset = Math.abs(Math.floor(offset / 60)).toString();
        let minutesOffset = Math.abs(offset % 60).toString();
        if (hoursOffset.length == 1)
            hoursOffset = "0" + hoursOffset;
        if (minutesOffset.length == 1)
            minutesOffset = "0" + minutesOffset;
        return ("/Date(" + Date.parse(date.toString()).toString() + (offset >= 0 ? "+" : "-") + hoursOffset + minutesOffset + ")/");
    }
    get canMoveUp() {
        let state = true;
        this.model.form.pages.forEach((page, index) => {
            if (page === this.currentPage && index == 0) {
                state = false;
            }
        });
        return state;
    }
    get currentPage() {
        return this.model.selectedPage ? this.model.selectedPage : null;
    }
    get canMoveDown() {
        let state = true;
        this.model.form.pages.forEach((page, index) => {
            if (page === this.currentPage && index == this.model.form.pages.length - 1) {
                state = false;
            }
        });
        return state;
    }
    get canDelete() {
        return this.model?.form?.pages?.length > 1 ? true : false;
    }
    get canClear() {
        return this.currentPage.allElements.length > 0 ? true : false;
    }
    deleteComponent() {
        this.helper.deleteSelectedComponent();
        if (this.model.showContextMenu) {
            this.model.showContextMenu = false;
        }
    }
    moveUp() {
        let index = this.model.form.pages.indexOf(this.currentPage);
        this.model.form.pages.splice(index, 1);
        this.model.form.pages.splice(index - 1, 0, this.currentPage);
        setTimeout(() => {
            let workspace = document.getElementsByTagName("sti-workspace")[0];
            workspace.scrollTop = workspace.scrollTop - (this.currentPage?.height + 20) * this.model.zoom;
        }, 0);
        if (this.model.showContextMenu) {
            this.model.showContextMenu = false;
        }
    }
    moveDown() {
        let index = this.model.form.pages.indexOf(this.currentPage);
        this.model.form.pages.splice(index, 1);
        this.model.form.pages.splice(index + 1, 0, this.currentPage);
        setTimeout(() => {
            let workspace = document.getElementsByTagName("sti-workspace")[0];
            workspace.scrollTop = workspace.scrollTop + (this.currentPage?.height + 20) * this.model.zoom;
        }, 0);
        if (this.model.showContextMenu) {
            this.model.showContextMenu = false;
        }
    }
    insertAfter() {
        let newPage = this.helper.clonePage(this.currentPage);
        newPage.elements = [];
        newPage.name = this.nameService.getElementName(newPage);
        this.model.form.pages.splice(this.model.form.pages.indexOf(this.currentPage) + 1, 0, newPage);
        setTimeout(() => {
            this.model.selectedPage = newPage;
        });
        setTimeout(() => {
            let workspace = document.getElementsByTagName("sti-workspace")[0];
            workspace.scrollTop = workspace.scrollTop + (newPage.height + 20) * this.model.zoom;
        }, 0);
        if (this.model.showContextMenu) {
            this.model.showContextMenu = false;
        }
    }
    insertBefore() {
        let newPage = this.helper.clonePage(this.currentPage);
        newPage.name = this.nameService.getElementName(newPage);
        newPage.elements = [];
        this.model.form.pages.splice(this.model.form.pages.indexOf(this.currentPage), 0, newPage);
        setTimeout(() => {
            this.model.selectedPage = newPage;
        });
        if (this.model.showContextMenu) {
            this.model.showContextMenu = false;
        }
    }
    clear() {
        this.currentPage.elements = [];
        if (this.model.showContextMenu) {
            this.model.showContextMenu = false;
        }
    }
    delete() {
        this.model.showModalWindow = true;
        if (this.model.showContextMenu) {
            this.model.showContextMenu = false;
        }
    }
    constructor(model, helper, draggableService, nameService) {
        this.model = model;
        this.helper = helper;
        this.draggableService = draggableService;
        this.nameService = nameService;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FormEventsService, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiDraggableService }, { token: StiNameService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FormEventsService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FormEventsService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiDraggableService }, { type: StiNameService }] });

class StiColorDialogService {
    rgbToHex(rgb) {
        let rgbArray = rgb.split(",");
        let hex = "#";
        rgbArray.forEach((item) => {
            hex += this.componentToHex(Number(item));
        });
        return hex;
    }
    componentToHex(c) {
        let hex = c.toString(16);
        return hex.length == 1 ? "0" + hex : hex;
    }
    openDialog(element, object, isRichText) {
        this.isRichText = isRichText;
        let elementRect = this.model.getPositionRelativeToForm(element);
        let windowHeight = window.innerHeight;
        let windowWidth = window.innerWidth;
        this.currentColorObject = object;
        this.cloneOfCurrentColorObject = object.clone();
        if (elementRect.bottom + this.dialogHeight > windowHeight - 32) {
            this.dialogY = elementRect.top - this.dialogHeight;
        }
        else {
            this.dialogY = elementRect.bottom;
        }
        if (elementRect.left + this.dialogWidth > windowWidth) {
            this.dialogX = windowWidth - this.dialogWidth;
        }
        else {
            this.dialogX = elementRect.left;
        }
        this.model.showColorDialog = true;
    }
    constructor(model) {
        this.model = model;
        this.dialogWidth = 185;
        this.dialogHeight = 236;
        this.browserColors = [
            { name: "Transparent", color: "transparent" },
            { name: "Black", color: "0,0,0" },
            { name: "DimGray", color: "105,105,105" },
            { name: "Gray", color: "128,128,128" },
            { name: "DarkGray", color: "169,169,169" },
            { name: "Silver", color: "192,192,192" },
            { name: "LightGray", color: "211,211,211" },
            { name: "Gainsboro", color: "220,220,220" },
            { name: "WhiteSmoke", color: "245,245,245" },
            { name: "White", color: "255,255,255" },
            { name: "RosyBrown", color: "188,143,143" },
            { name: "IndianRed", color: "205,92,92" },
            { name: "Brown", color: "165,42,42" },
            { name: "Firebrick", color: "178,34,34" },
            { name: "LightCoral", color: "240,128,12" },
            { name: "Maroon", color: "128,0,0" },
            { name: "DarkRed", color: "139,0,0" },
            { name: "Red", color: "255,0,0" },
            { name: "Snow", color: "255,250,250" },
            { name: "MistyRose", color: "255,228,225" },
            { name: "Salmon", color: "250,128,114" },
            { name: "Tomato", color: "255,99,71" },
            { name: "DarkSalmon", color: "233,150,122" },
            { name: "Coral", color: "255,127,80" },
            { name: "OrangeRed", color: "255,69,0" },
            { name: "LightSalmon", color: "255,160,122" },
            { name: "Sienna", color: "160,82,45" },
            { name: "SeaShell", color: "255,245,23" },
            { name: "Chocolate", color: "210,105,30" },
            { name: "SaddleBrown", color: "139,69,19" },
            { name: "SandyBrown", color: "244,164,96" },
            { name: "PeachPuff", color: "255,218,185" },
            { name: "Peru", color: "205,133,63" },
            { name: "Linen", color: "250,240,230" },
            { name: "Bisque", color: "255,228,196" },
            { name: "DarkOrange", color: "255,140,0" },
            { name: "BurlyWood", color: "222,184,135" },
            { name: "Tan", color: "210,180,140" },
            { name: "AntiqueWhite", color: "250,235,215" },
            { name: "NavajoWhite", color: "255,222,173" },
            { name: "BlanchedAlmond", color: "255,235,205" },
            { name: "PapayaWhip", color: "255,239,213" },
            { name: "Moccasin", color: "255,228,181" },
            { name: "Orange", color: "255,165,0" },
            { name: "Wheat", color: "245,222,179" },
            { name: "OldLace", color: "253,245,230" },
            { name: "FloralWhite", color: "255,250,240" },
            { name: "DarkGoldenrod", color: "184,134,11" },
            { name: "Goldenrod", color: "218,165,32" },
            { name: "Cornsilk", color: "255,248,220" },
            { name: "Gold", color: "255,215,0" },
            { name: "Khaki", color: "240,230,140" },
            { name: "LemonChiffon", color: "255,250,205" },
            { name: "PaleGoldenrod", color: "238,232,170" },
            { name: "DarkKhaki", color: "189,183,107" },
            { name: "Beige", color: "245,245,220" },
            { name: "LightGoldenrodYellow", color: "250,250,210" },
            { name: "Olive", color: "128,128,0" },
            { name: "Yellow", color: "255,255,0" },
            { name: "LightYellow", color: "255,255,224" },
            { name: "Ivory", color: "255,255,240" },
            { name: "OliveDrab", color: "107,142,35" },
            { name: "YellowGreen", color: "154,205,50" },
            { name: "DarkOliveGreen", color: "85,107,47" },
            { name: "GreenYellow", color: "173,255,47" },
            { name: "Chartreuse", color: "127,255,0" },
            { name: "LawnGreen", color: "124,252,0" },
            { name: "DarkSeaGreen", color: "143,188,139" },
            { name: "ForestGreen", color: "34,139,34" },
            { name: "LimeGreen", color: "50,205,50" },
            { name: "LightGreen", color: "144,238,144" },
            { name: "PaleGreen", color: "152,251,152" },
            { name: "DarkGreen", color: "0,100,0" },
            { name: "Green", color: "0,128,0" },
            { name: "Lime", color: "0,255,0" },
            { name: "Honeydew", color: "240,255,240" },
            { name: "SeaGreen", color: "46,139,87" },
            { name: "MediumSeaGreen", color: "60,179,113" },
            { name: "SpringGreen", color: "0,255,127" },
            { name: "MintCream", color: "245,255,250" },
            { name: "MediumSpringGreen", color: "0,250,154" },
            { name: "MediumAquamarine", color: "102,205,170" },
            { name: "Aquamarine", color: "127,255,212" },
            { name: "Turquoise", color: "64,224,20" },
            { name: "LightSeaGreen", color: "32,178,170" },
            { name: "MediumTurquoise", color: "72,209,204" },
            { name: "DarkSlateGray", color: "47,79,79" },
            { name: "PaleTurquoise", color: "175,238,23" },
            { name: "Teal", color: "0,128,12" },
            { name: "DarkCyan", color: "0,139,139" },
            { name: "Aqua", color: "0,255,255" },
            { name: "Cyan", color: "0,255,255" },
            { name: "LightCyan", color: "224,255,255" },
            { name: "Azure", color: "240,255,255" },
            { name: "DarkTurquoise", color: "0,206,209" },
            { name: "CadetBlue", color: "95,158,160" },
            { name: "PowderBlue", color: "176,224,230" },
            { name: "LightBlue", color: "173,216,230" },
            { name: "DeepSkyBlue", color: "0,191,255" },
            { name: "SkyBlue", color: "135,206,235" },
            { name: "LightSkyBlue", color: "135,206,250" },
            { name: "SteelBlue", color: "70,130,180" },
            { name: "AliceBlue", color: "240,248,255" },
            { name: "DodgerBlue", color: "30,144,255" },
            { name: "SlateGray", color: "112,128,144" },
            { name: "LightSlateGray", color: "119,136,153" },
            { name: "LightSteelBlue", color: "176,196,222" },
            { name: "CornflowerBlue", color: "100,149,237" },
            { name: "RoyalBlue", color: "65,105,225" },
            { name: "MidnightBlue", color: "25,25,112" },
            { name: "Lavender", color: "230,230,250" },
            { name: "Navy", color: "0,0,12" },
            { name: "DarkBlue", color: "0,0,139" },
            { name: "MediumBlue", color: "0,0,205" },
            { name: "Blue", color: "0,0,255" },
            { name: "GhostWhite", color: "248,248,255" },
            { name: "SlateBlue", color: "106,90,205" },
            { name: "DarkSlateBlue", color: "72,61,139" },
            { name: "MediumSlateBlue", color: "123,104,23" },
            { name: "MediumPurple", color: "147,112,219" },
            { name: "BlueViolet", color: "138,43,226" },
            { name: "Indigo", color: "75,0,130" },
            { name: "DarkOrchid", color: "153,50,204" },
            { name: "DarkViolet", color: "148,0,211" },
            { name: "MediumOrchid", color: "186,85,211" },
            { name: "Thistle", color: "216,191,216" },
            { name: "Plum", color: "221,160,221" },
            { name: "Violet", color: "238,130,23" },
            { name: "Purple", color: "128,0,12" },
            { name: "DarkMagenta", color: "139,0,139" },
            { name: "Magenta", color: "255,0,255" },
            { name: "Fuchsia", color: "255,0,255" },
            { name: "Orchid", color: "218,112,214" },
            { name: "MediumVioletRed", color: "199,21,133" },
            { name: "DeepPink", color: "255,20,147" },
            { name: "HotPink", color: "255,105,180" },
            { name: "LavenderBlush", color: "255,240,245" },
            { name: "PaleVioletRed", color: "219,112,147" },
            { name: "Crimson", color: "220,20,60" },
            { name: "Pink", color: "255,192,203" },
            { name: "LightPink", color: "255,182,193" },
        ];
        this.themeColors = [
            { color: "255,255,255" },
            { color: "0,0,0" },
            { color: "231,230,230" },
            { color: "68,84,106" },
            { color: "91,155,213" },
            { color: "237,125,49" },
            { color: "165,165,165" },
            { color: "255,192,0" },
            { color: "68,114,196" },
            { color: "112,173,71" },
            { color: "242,242,242" },
            { color: "127,127,127" },
            { color: "208,206,206" },
            { color: "214,220,228" },
            { color: "222,235,246" },
            { color: "251,229,213" },
            { color: "237,237,237" },
            { color: "255,242,204" },
            { color: "217,226,243" },
            { color: "226,239,217" },
            { color: "216,216,216" },
            { color: "89,89,89" },
            { color: "174,171,171" },
            { color: "173,185,202" },
            { color: "189,215,238" },
            { color: "247,203,172" },
            { color: "219,219,219" },
            { color: "254,229,153" },
            { color: "180,198,231" },
            { color: "197,224,179" },
            { color: "191,191,191" },
            { color: "63,63,63" },
            { color: "117,112,112" },
            { color: "132,150,176" },
            { color: "156,195,229" },
            { color: "224,177,131" },
            { color: "201,201,201" },
            { color: "255,217,101" },
            { color: "142,170,219" },
            { color: "168,208,141" },
            { color: "165,165,165" },
            { color: "38,38,38" },
            { color: "58,56,56" },
            { color: "50,63,79" },
            { color: "46,117,181" },
            { color: "197,90,17" },
            { color: "123,123,123" },
            { color: "191,144,0" },
            { color: "47,84,150" },
            { color: "83,129,53" },
            { color: "127,127,127" },
            { color: "12,12,12" },
            { color: "23,22,22" },
            { color: "34,42,53" },
            { color: "30,78,121" },
            { color: "131,60,11" },
            { color: "82,82,82" },
            { color: "127,96,0" },
            { color: "31,56,100" },
            { color: "55,86,35" },
        ];
        this.standardColors = [
            { color: "192,0,0" },
            { color: "255,0,0" },
            { color: "255,192,0" },
            { color: "255,255,0" },
            { color: "146,208,80" },
            { color: "0,176,80" },
            { color: "0,176,240" },
            { color: "0,112,192" },
            { color: "0,32,96" },
            { color: "112,48,160" },
        ];
        this.isRichText = false;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiColorDialogService, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiColorDialogService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiColorDialogService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }] });

class StiTabIndexService {
    constructor(model) {
        this.model = model;
        model.interfaceEvent.subscribe((event) => {
            if (event.name == "setRibbon" && event.data?.ribbon === "Preview") {
                this.arrangeTabIndex();
            }
        });
        model.formEvents.subscribe((event) => {
            if (event.name == "SetForm" && model.viewerMode) {
                this.arrangeTabIndex();
            }
        });
    }
    arrangeTabIndex() {
        let elements = [];
        this.model.form?.pages.forEach((form, pageIndex) => {
            form.allElements.filter(e => e["setTabIndex"] != null).forEach(element => {
                elements.push({
                    element: element,
                    geometry: element.geometry,
                    pageIndex: pageIndex
                });
            });
        });
        elements.sort((e1, e2) => {
            if (e1.pageIndex != e2.pageIndex) {
                return e1.pageIndex > e2.pageIndex ? 1 : -1;
            }
            else if (e1.geometry.y != e2.geometry.y) {
                return e1.geometry.y > e2.geometry.y ? 1 : -1;
            }
            else {
                return e1.geometry.x > e2.geometry.x ? 1 : -1;
            }
        });
        let tabIndex = 100;
        elements.forEach(e => tabIndex = e.element.setTabIndex(tabIndex));
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTabIndexService, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTabIndexService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTabIndexService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }] });

class StiFormCheckerService {
    isRibbonWithPreview(ribbon) {
        return ribbon == "Preview" || ribbon == "PDFPreview";
    }
    haveStiCloudSubmitButton() {
        let state = false;
        this.model.form?.pages.forEach((page) => {
            page.allElements.forEach((element) => {
                if (element instanceof StiButtonElement &&
                    (element.formSendURL?.trim().toLocaleLowerCase() == "stimulsoft cloud" ||
                        element.formSendURL?.trim().toLocaleLowerCase() == "cloud.stimulsoft.com")) {
                    state = true;
                }
            });
        });
        return state;
    }
    needToDisplayFormsChecker() {
        return (this.haveStiCloudSubmitButton() && (this.model.form.versionKey == null || this.model.form.versionKey.length == 0));
    }
    check(ribbon) {
        let state = (this.model.isWebView || this.model.isCloudMode) && this.needToDisplayFormsChecker();
        if (state) {
            // this.hasIssue = true;
            // this.currentPressedButton = ribbon;
            // this.displayFormsChecker(ribbon);
        }
        return true;
    }
    get hasIssue() {
        return ((this.model.isWebView || this.model.isCloudMode) && this.needToDisplayFormsChecker() && !this.model.previewMode);
    }
    displayFormsChecker() {
        this.showFormCheckerWindow = true;
    }
    updateFormAfterSaving(form) {
        if (form) {
            if (typeof form != "boolean") {
                this.model.setFormFromString(JSON.stringify(form));
            }
            this.showFormCheckerWindow = false;
            this.model.saveLastFormState();
            this.model.saveSettings();
            this.model.formEvents.next({ name: this.model.ribbon });
        }
    }
    getButtonNames() {
        let buttonElements = [];
        this.model.form?.pages.forEach((page) => {
            page.allElements.forEach((element) => {
                if (element.type == "ButtonElement" &&
                    element.formSendURL?.trim().toLocaleLowerCase() == "stimulsoft cloud") {
                    buttonElements.push(element.name);
                }
            });
        });
        this.buttonNames = buttonElements.join().length > 0 ? "(" + buttonElements.join() + ")" : "";
    }
    constructor(model) {
        this.model = model;
        this.showFormCheckerWindow = false;
        this.formMessages = [];
        this.buttonNames = "";
        this.componentWidth = 700;
        this.componentHeight = 482;
        this.currentPressedButton = "";
        this.issuesCount = 1;
        let newItem = {
            type: "warning",
            label: "Form not saved in Stimulsoft Cloud",
            content: "To submit the form data to the Stimulsoft server, you can use the Submit button {0} on the form. Once the data is sent, you will be able to view all submissions for that particular form. To ensure that the data is processed correctly, it is important to save the form to the cloud. You can modify the URL of the Stimulsoft Cloud button.",
        };
        this.formMessages.push(newItem);
        window.onresize = (event) => {
            if (window.innerWidth > this.componentWidth) {
                if (window.innerWidth < this.componentX + this.componentWidth) {
                    this.componentX = (window.innerWidth - this.componentWidth) / 2;
                }
            }
            else {
                this.componentX = 0;
            }
            if (window.innerHeight > this.componentHeight) {
                if (window.innerHeight < this.componentY + this.componentHeight) {
                    this.componentY = (window.innerHeight - this.componentHeight) / 2;
                }
            }
            else {
                this.componentY = 0;
            }
        };
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFormCheckerService, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFormCheckerService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFormCheckerService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }] });

class StiDraggableModalWindowService {
    get isTextEditor() {
        return this._isTextEditor;
    }
    set isTextEditor(value) {
        if (value) {
            this._isImageEditor = false;
        }
        this._isTextEditor = value;
    }
    get isImageEditor() {
        return this._isImageEditor;
    }
    set isImageEditor(value) {
        if (value) {
            this._isTextEditor = false;
        }
        this._isImageEditor = value;
    }
    get editorX() {
        return this._editorX;
    }
    set editorX(value) {
        value <= 0 ? (this._editorX = 0) : (this._editorX = value);
    }
    get editorY() {
        return this._editorY;
    }
    set editorY(value) {
        value <= 0 ? (this._editorY = 0) : (this._editorY = value);
    }
    constructor() {
        this._isTextEditor = false;
        this._isImageEditor = true;
        this._editorX = 0;
        this._editorY = 0;
        this.showDraggableModalWindow = false;
        this.editorWidth = 800;
        this.editorHeight = 510;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDraggableModalWindowService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDraggableModalWindowService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDraggableModalWindowService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [] });

class StiClipboardService {
    constructor(model, helper, nameService, draggableService) {
        this.model = model;
        this.helper = helper;
        this.nameService = nameService;
        this.draggableService = draggableService;
        document.addEventListener("visibilitychange", () => {
            if (!document.hidden) {
                this.updateDataFromClipboard();
            }
        });
        this.updateDataFromClipboard();
    }
    get hasCopy() {
        return this.copiedElement ? true : false;
    }
    get canCopy() {
        return this.model.selectedComponent?.element ? false : true;
    }
    updateDataFromClipboard() {
        let this_ = this;
        this.loadDataFromClipboard().then(e => {
            if (e instanceof DOMException) {
                setTimeout(() => this_.updateDataFromClipboard(), 500);
            }
        });
    }
    loadDataFromClipboard(forceReadClipboard = false) {
        return navigator.permissions.query({ name: "clipboard-read" }).then(value => {
            try {
                return forceReadClipboard || value.state == "granted" ? navigator.clipboard.readText() : null;
            }
            catch {
                return null;
            }
        }).then(data => {
            try {
                if (data && data.indexOf("StiFormsClipboard") >= 0) {
                    let clipboardData = JSON.parse(data);
                    let clazz = this.helper.getElementClass(clipboardData.type);
                    let element = new clazz();
                    let jObject = new StiJson();
                    let elementStr = this.helper.base64Decode(clipboardData.value);
                    jObject.deserialize(elementStr);
                    element.loadFromJsonObject(jObject);
                    if (clipboardData.displayValue) {
                        element["displayValue"] = this.helper.base64Decode(clipboardData.displayValue);
                    }
                    this.copiedElement = element;
                }
            }
            catch {
                return null;
            }
        }).catch(e => { return e; });
    }
    pasteElement(event) {
        this.loadDataFromClipboard(true).then(() => {
            if (this.copiedElement) {
                let element = this.helper.clone(this.copiedElement);
                element.name = this.nameService.checkElementName(element);
                element.guid = Guid.newGuid().toString();
                this.draggableService.startDrag(event, element, false, true);
            }
        }).catch(reason => {
            //console.log(reason);
        });
    }
    copyElement() {
        let element = this.model.selectedComponent?.element;
        if (element)
            try {
                this.copiedElement = this.helper.clone(element);
                let elementStr = element.saveToJsonObject({}).serialize();
                let base64Element = this.helper.base64Encode(elementStr);
                let base64ElementValue = element["displayValue"] ? this.helper.base64Encode(element["displayValue"]) : null;
                let clipboardData = new StiClipboardData(base64Element, element.type, base64ElementValue);
                navigator.clipboard.writeText(JSON.stringify(clipboardData));
                this.loadDataFromClipboard(true);
            }
            catch (e) {
                //console.error(e);
            }
    }
    cutElement() {
        this.copyElement();
        this.helper.deleteSelectedComponent();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiClipboardService, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiNameService }, { token: StiDraggableService }], target: i0.ɵɵFactoryTarget.Injectable }); }
    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiClipboardService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiClipboardService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiNameService }, { type: StiDraggableService }] });

class StiDropdownComponent {
    constructor(dropdownService, model) {
        this.dropdownService = dropdownService;
        this.model = model;
        this.optionLabel = null;
        this.optionValue = null;
        this.isMinVersion = false;
        this.valueChange = new EventEmitter();
    }
    ngOnDestroy() {
        this.valueChangedSubscription.unsubscribe();
    }
    ngOnInit() {
        this.valueChangedSubscription = this.dropdownService.valueChanged.subscribe((value) => {
            if (this.id == this.dropdownService.currentUsedComponentId) {
                this.valueChange.emit(value);
            }
        });
    }
    getLabel() {
        if (this.optionLabel == this.optionValue) {
            return this.value;
        }
        else {
            let option = this.options.find((option) => option[this.optionValue] == this.value);
            return option[this.optionLabel];
        }
    }
    showList(event) {
        let parentRec = this.model.getPositionRelativeToForm(event.target.parentElement);
        this.dropdownService.dropdownX = parentRec.left;
        this.dropdownService.dropdownY = parentRec.bottom;
        this.dropdownService.currentOptionList = this.options;
        this.dropdownService.optionLabel = this.optionLabel;
        this.dropdownService.optionValue = this.optionValue;
        this.dropdownService.currentValue = this.getLabel();
        this.dropdownService.currentUsedComponentId = this.id;
        this.dropdownService.showDropdownList = true;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDropdownComponent, deps: [{ token: StiDropdownService }, { token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiDropdownComponent, selector: "sti-dropdown-component", inputs: { id: "id", options: "options", value: "value", disabled: "disabled", optionLabel: "optionLabel", optionValue: "optionValue", isMinVersion: "isMinVersion", tooltip: "tooltip" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: `<div
    class="sti-dropdown-component {{ disabled ? 'disabled' : '' }}"
    [stiTooltip]="tooltip"
    tooltipPosition="bottom"
    showDelay="500"
    (click)="showList($event)"
  >
    <span class="current-value">{{
      value ? this.getLabel() : options.length > 0 ? (options[0]["name"] ? options[0]["name"] : options[0]) : ""
    }}</span>
    <div class="button" [style.width.px]="isMinVersion ? 15 : 20">
      <span><i class="pi pi-chevron-down"></i></span>
    </div>
  </div>`, isInline: true, styles: [".sti-dropdown-component{width:inherit;height:inherit;background:var(--input-color);border:1px solid var(--inputBorder-color);border-radius:3px;display:flex;align-items:center}.sti-dropdown-component:hover{background-color:#dadada}.current-value{flex:1;padding:3px 5px;overflow:hidden;white-space:nowrap}.button{width:20px}.button i{height:12px;width:12px;right:3px;color:#bab9b8}.disabled{pointer-events:none;opacity:.5}span{pointer-events:none}\n"], dependencies: [{ kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDropdownComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-dropdown-component", template: `<div
    class="sti-dropdown-component {{ disabled ? 'disabled' : '' }}"
    [stiTooltip]="tooltip"
    tooltipPosition="bottom"
    showDelay="500"
    (click)="showList($event)"
  >
    <span class="current-value">{{
      value ? this.getLabel() : options.length > 0 ? (options[0]["name"] ? options[0]["name"] : options[0]) : ""
    }}</span>
    <div class="button" [style.width.px]="isMinVersion ? 15 : 20">
      <span><i class="pi pi-chevron-down"></i></span>
    </div>
  </div>`, styles: [".sti-dropdown-component{width:inherit;height:inherit;background:var(--input-color);border:1px solid var(--inputBorder-color);border-radius:3px;display:flex;align-items:center}.sti-dropdown-component:hover{background-color:#dadada}.current-value{flex:1;padding:3px 5px;overflow:hidden;white-space:nowrap}.button{width:20px}.button i{height:12px;width:12px;right:3px;color:#bab9b8}.disabled{pointer-events:none;opacity:.5}span{pointer-events:none}\n"] }]
        }], ctorParameters: () => [{ type: StiDropdownService }, { type: StiModelService }], propDecorators: { id: [{
                type: Input
            }], options: [{
                type: Input
            }], value: [{
                type: Input
            }], disabled: [{
                type: Input
            }], optionLabel: [{
                type: Input
            }], optionValue: [{
                type: Input
            }], isMinVersion: [{
                type: Input
            }], tooltip: [{
                type: Input
            }], valueChange: [{
                type: Output
            }] } });

class StiSelectButtonComponent {
    constructor() {
        this.onOptionClick = new EventEmitter();
        this.onChange = new EventEmitter();
        this.valueChange = new EventEmitter();
    }
    getOptionLabel(option) {
        return option[this.optionLabel];
    }
    isSelected(option) {
        let optionValue = this.getOptionValue(option);
        if (this.multiple) {
            if (this.value && this.value?.indexOf(optionValue) != -1) {
                return true;
            }
            else {
                return false;
            }
        }
        else {
            return optionValue === this.value;
        }
    }
    getOptionValue(option) {
        return option.value ? option.value : option;
    }
    removeOption(option) {
        let optionValue = this.getOptionValue(option);
        this.value = this.value.filter((item) => item != optionValue);
    }
    selectOption(event, option, index) {
        if (this.disabled) {
            return;
        }
        let optionValue = this.getOptionValue(option);
        if (this.multiple) {
            if (this.isSelected(option))
                this.removeOption(option);
            else
                this.value = [...(this.value || []), optionValue];
            this.onChange.emit({
                originalEvent: event,
                value: this.value,
            });
            this.valueChange.emit(this.value);
        }
        else if (this.value !== optionValue) {
            this.value = optionValue;
            this.onChange.emit({
                originalEvent: event,
                value: this.value,
            });
            this.valueChange.emit(this.value);
        }
        this.onOptionClick.emit({
            originalEvent: event,
            option: option,
            index: index,
        });
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSelectButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiSelectButtonComponent, selector: "sti-selectButton", inputs: { options: "options", value: "value", optionLabel: "optionLabel", optionValue: "optionValue", multiple: "multiple", disabled: "disabled" }, outputs: { onOptionClick: "onOptionClick", onChange: "onChange", valueChange: "valueChange" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: ` <div class="button-container {{ disabled ? 'disabled' : '' }}">
    <div
      #button
      class="button {{ isSelected(option) ? 'selected' : '' }} {{ i == 0 ? 'left' : '' }} {{
        i == options.length - 1 ? 'right' : ''
      }}"
      [style.border-right-width.px]="i == options.length - 1 ? 1 : 0"
      *ngFor="let option of options; let i = index"
      (click)="selectOption($event, option, i)"
    >
      <ng-container *ngIf="!itemTemplate; else customcontent">
        <span class="label">{{ getOptionLabel(option) }}</span>
      </ng-container>
      <ng-template #customcontent>
        <ng-container *ngTemplateOutlet="itemTemplate; context: { $implicit: option, index: i }"></ng-container>
      </ng-template>
    </div>
  </div>`, isInline: true, styles: [".disabled{pointer-events:none;opacity:.5}.button{background-color:var(--back-color);border:1px solid var(--back-color);color:var(--text-color);padding:3px 6px;width:auto;height:inherit;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",Segoe UI Symbol;font-size:14px;font-weight:400;display:flex;align-items:center;justify-content:center}.button:hover{background-color:var(--active-color);border-color:var(--active-color);cursor:pointer}.selected{background-color:var(--active-color);border-color:var(--active-color)}.button-container{display:flex;width:100%;height:inherit}.left{border-top-left-radius:3px;border-bottom-left-radius:3px}.right{border-top-right-radius:3px;border-bottom-right-radius:3px}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSelectButtonComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-selectButton", template: ` <div class="button-container {{ disabled ? 'disabled' : '' }}">
    <div
      #button
      class="button {{ isSelected(option) ? 'selected' : '' }} {{ i == 0 ? 'left' : '' }} {{
        i == options.length - 1 ? 'right' : ''
      }}"
      [style.border-right-width.px]="i == options.length - 1 ? 1 : 0"
      *ngFor="let option of options; let i = index"
      (click)="selectOption($event, option, i)"
    >
      <ng-container *ngIf="!itemTemplate; else customcontent">
        <span class="label">{{ getOptionLabel(option) }}</span>
      </ng-container>
      <ng-template #customcontent>
        <ng-container *ngTemplateOutlet="itemTemplate; context: { $implicit: option, index: i }"></ng-container>
      </ng-template>
    </div>
  </div>`, styles: [".disabled{pointer-events:none;opacity:.5}.button{background-color:var(--back-color);border:1px solid var(--back-color);color:var(--text-color);padding:3px 6px;width:auto;height:inherit;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",Segoe UI Symbol;font-size:14px;font-weight:400;display:flex;align-items:center;justify-content:center}.button:hover{background-color:var(--active-color);border-color:var(--active-color);cursor:pointer}.selected{background-color:var(--active-color);border-color:var(--active-color)}.button-container{display:flex;width:100%;height:inherit}.left{border-top-left-radius:3px;border-bottom-left-radius:3px}.right{border-top-right-radius:3px;border-bottom-right-radius:3px}\n"] }]
        }], ctorParameters: () => [], propDecorators: { options: [{
                type: Input
            }], value: [{
                type: Input
            }], optionLabel: [{
                type: Input
            }], optionValue: [{
                type: Input
            }], multiple: [{
                type: Input
            }], disabled: [{
                type: Input
            }], onOptionClick: [{
                type: Output
            }], onChange: [{
                type: Output
            }], valueChange: [{
                type: Output
            }], itemTemplate: [{
                type: ContentChild,
                args: [TemplateRef]
            }] } });

class StiHomeRibbonComponent {
    constructor(model, helper, draggableService, theme, render, formEvents, editableContentService, loc, richTextService, undoService, nameService, colorService, clipboardService) {
        this.model = model;
        this.helper = helper;
        this.draggableService = draggableService;
        this.theme = theme;
        this.render = render;
        this.formEvents = formEvents;
        this.editableContentService = editableContentService;
        this.loc = loc;
        this.richTextService = richTextService;
        this.undoService = undoService;
        this.nameService = nameService;
        this.colorService = colorService;
        this.clipboardService = clipboardService;
    }
    get alignment() {
        return this.editableContentService.editableContent["horizontalAlignment"]
            ? this.editableContentService.editableContent["horizontalAlignment"]
            : null;
    }
    haveBackgroundColor() {
        return (this.editableContentService.editableContent != null &&
            this.editableContentService.editableContent.haveBackgoundColor());
    }
    haveContentAlignment() {
        return (this.editableContentService.editableContent != null &&
            this.editableContentService.editableContent.haveContentAlignment());
    }
    haveVerticalAlignment() {
        return (this.editableContentService.editableContent != null &&
            this.editableContentService.editableContent.haveVerticalAlignment());
    }
    showColorPicker(element, object, isRichText = false) {
        this.colorService.openDialog(element, object, isRichText);
    }
    changeEvent() {
        let currentChangableFont = new UsedFont(this.editableContentService.editableContent.eFont.family, this.model.arrayOfStylesToString(this.editableContentService.editableContent.eFont.style), this.editableContentService.editableContent.eFont.size);
        this.model.form.formEvents.next({ name: "UpdateFonts", value: currentChangableFont });
    }
    setStyle(value) {
        if (value == "Bold") {
            this.richTextService.insertBold();
        }
        else if (value == "Italic") {
            this.richTextService.insertItalic();
        }
        else {
            this.richTextService.insertUnderline();
        }
    }
    setAlignment(value) {
        if (value == 1) {
            this.richTextService.setLeftAlignment();
        }
        else if (value == 2) {
            this.richTextService.setCenterAlignment();
        }
        else {
            this.richTextService.setRightAlignment();
        }
    }
    get fontSize() {
        return this.editableContentService.editableContent?.eFont.size;
    }
    set fontSize(value) {
        if (this.editableContentService.editableContent) {
            this.editableContentService.editableContent.eFont.size = value;
        }
    }
    get fontFamily() {
        return this.editableContentService.editableContent?.eFont.family;
    }
    set fontFamily(value) {
        if (this.editableContentService.editableContent) {
            this.editableContentService.editableContent.eFont.family = value;
        }
    }
    get fontStyle() {
        return this.editableContentService.editableContent?.eFont.style;
    }
    set fontStyle(value) {
        if (this.editableContentService.editableContent) {
            this.editableContentService.editableContent.eFont.style = value;
        }
    }
    get foreColor() {
        return this.editableContentService.editableContent?.eColor;
    }
    get backColor() {
        return this.editableContentService.editableContent.eBackgroundColor;
    }
    get canDelete() {
        return this.model.selectedComponent ? true : false;
    }
    get isRichText() {
        return this.model.selectedComponent?.element instanceof StiTextElement ? true : false;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiHomeRibbonComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiDraggableService }, { token: StiThemeService }, { token: StiRectangleGeometryLayout }, { token: FormEventsService }, { token: StiEditableContentService }, { token: StiLocalizationService }, { token: StiRichTextService }, { token: StiUndoService }, { token: StiNameService }, { token: StiColorDialogService }, { token: StiClipboardService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiHomeRibbonComponent, selector: "sti-home-ribbon-component", ngImport: i0, template: `<div
    class="home"
    style="-moz-user-select: none;-webkit-touch-callout: none;-webkit-user-select: none;-ms-user-select: none;user-select: none"
  >
    <div
      [style.margin-left]="'10px'"
      class="container {{ undoService?.undos?.length < 2 ? 'disabled' : '' }}"
      [stiTooltip]="loc.get2('HelpDesigner', 'Undo').replace('.', '')"
      tooltipPosition="bottom"
      showDelay="500"
      (click)="undoService.undo()"
    >
      <div class="button"><img [src]="model.getImage('images.Ribbon.Undo.png')" alt="" /></div>
    </div>
    <div
      class="container {{ undoService?.redos?.length < 1 ? 'disabled' : '' }}"
      [stiTooltip]="loc.get2('HelpDesigner', 'Redo').replace('.', '')"
      tooltipPosition="bottom"
      showDelay="500"
      (click)="undoService.redo()"
    >
      <div class="button"><img [src]="model.getImage('images.Ribbon.Redo.png')" alt="" /></div>
    </div>
    <!-- <div
      *ngIf="isRichText"
      [style.margin-left]="'10px'"
      class="container"
      [stiTooltip]="loc.getP('Undo')"
      tooltipPosition="bottom" showDelay="500"
      (click)="richTextService.useUndo()"
    >
      <div class="button"><img [src]="getIcon('Undo')" alt="" /></div>
    </div>
    <div
      *ngIf="isRichText"
      class="container"
      [stiTooltip]="loc.getP('Redo')"
      tooltipPosition="bottom" showDelay="500"
      (click)="richTextService.useRedo()"
    >
      <div class="button"><img [src]="getIcon('Redo')" alt="" /></div>
    </div> -->
    <div class="vertical-line"></div>
    <div
      class="container {{ !clipboardService.hasCopy ? 'disabled' : '' }}"
      [stiTooltip]="loc.get2('MainMenu', 'menuEditPaste').replace('&amp', '').replace(';', '')"
      tooltipPosition="bottom"
      showDelay="500"
      (click)="clipboardService.pasteElement($event)"
    >
      <div class="button"><img [src]="model.getImage('images.Ribbon.Paste.png')" alt="" /></div>
    </div>
    <div
      class="container {{ clipboardService.canCopy ? 'disabled' : '' }}"
      [stiTooltip]="loc.get2('MainMenu', 'menuEditCopy').replace('&amp', '').replace(';', '')"
      tooltipPosition="bottom"
      showDelay="500"
      (click)="clipboardService.copyElement()"
    >
      <div class="button"><img [src]="model.getImage('images.Ribbon.Copy.png')" alt="" /></div>
    </div>
    <div
      class="container {{ clipboardService.canCopy ? 'disabled' : '' }}"
      [stiTooltip]="loc.get2('MainMenu', 'menuEditCut').replace('&amp', '').replace(';', '')"
      tooltipPosition="bottom"
      showDelay="500"
      (click)="clipboardService.cutElement()"
    >
      <div class="button"><img [src]="model.getImage('images.Ribbon.Cut.png')" alt="" /></div>
    </div>
    <div
      class="container {{ !canDelete ? 'disabled' : '' }}"
      [stiTooltip]="loc.get2('Buttons', 'Delete')"
      tooltipPosition="bottom"
      showDelay="500"
      (click)="formEvents.deleteComponent()"
    >
      <div class="button"><img [src]="model.getImage('images.Ribbon.Delete.png')" alt="" /></div>
    </div>
    <div class="vertical-line"></div>
    <sti-dropdown-component
      *ngIf="!isRichText"
      [id]="0"
      [options]="model.fontFamilies"
      [(value)]="fontFamily"
      [disabled]="editableContentService.editableContent == null"
      [tooltip]="loc.get2('HelpDesigner', 'FontName')"
      [optionLabel]="'name'"
      [optionValue]="'name'"
      [style]="{
        width: '150px',
        height: '32px',
        alignItems: 'center',
        margin: '1px 2px',
        marginTop: '10px',
        fontSize: '12px'
      }"
      (mousedown)="$event.preventDefault()"
      (mouseup)="editableContentService.startEdit()"
      (valueChange)="changeEvent()"
    ></sti-dropdown-component>
    <!-- <p-dropdown
      *ngIf="!isRichText"
      [options]="model.fontFamilies"
      [(ngModel)]="fontFamily"
      optionLabel="name"
      optionValue="name"
      [style]="{
        width: '150px',
        height: '32px',
        alignItems: 'center',
        margin: '1px 2px',
        marginTop: '10px',
        fontSize: '12px'
      }"
      [disabled]="editableContentService.editableContent == null"
      [tooltip]="loc.get2('HelpDesigner', 'FontName')"
      tooltipPosition="bottom"
      showDelay="500"
      (mousedown)="$event.preventDefault()"
      (mouseup)="editableContentService.startEdit()"
      (onChange)="changeEvent()"
    ></p-dropdown> -->
    <sti-dropdown-component
      *ngIf="isRichText"
      [id]="1"
      [options]="model.fontFamilies"
      [(value)]="richTextService.activeFontFamily"
      [tooltip]="loc.get2('HelpDesigner', 'FontName')"
      [optionLabel]="'name'"
      [optionValue]="'name'"
      [style]="{
        width: '150px',
        height: '32px',
        alignItems: 'center',
        margin: '1px 2px',
        marginTop: '10px',
        fontSize: '12px'
      }"
      (mousedown)="$event.preventDefault()"
      (mouseup)="editableContentService.startEdit()"
      (valueChange)="richTextService.insertFontFamily(richTextService.activeFontFamily)"
    ></sti-dropdown-component>
    <!-- <p-dropdown
      *ngIf="isRichText"
      [options]="model.fontFamilies"
      [(ngModel)]="richTextService.activeFontFamily"
      optionLabel="name"
      optionValue="name"
      [style]="{
        width: '150px',
        height: '32px',
        alignItems: 'center',
        margin: '1px 2px',
        marginTop: '10px',
        fontSize: '12px'
      }"
      [tooltip]="loc.get2('HelpDesigner', 'FontName')"
      tooltipPosition="bottom"
      showDelay="500"
      (mousedown)="$event.preventDefault()"
      (onChange)="richTextService.insertFontFamily(richTextService.activeFontFamily)"
      (mouseup)="editableContentService.startEdit()"
    ></p-dropdown> -->
    <sti-dropdown-component
      *ngIf="!isRichText"
      [id]="2"
      [options]="helper.fontSizes"
      [(value)]="fontSize"
      [tooltip]="loc.getP('FontSize')"
      [style]="{
        width: '60px',
        height: '32px',
        alignItems: 'center',
        margin: '10px 10px 1px 2px',
        fontSize: '12px'
      }"
      [disabled]="editableContentService.editableContent == null"
      (mousedown)="$event.preventDefault()"
      (mouseup)="editableContentService.startEdit()"
      (valueChange)="changeEvent()"
    ></sti-dropdown-component>
    <!-- <p-dropdown
      *ngIf="!isRichText"
      [options]="helper.fontSizes"
      [(ngModel)]="fontSize"
      [style]="{ width: '60px', height: '32px', alignItems: 'center', margin: '10px 10px 1px 2px', fontSize: '12px' }"
      [tooltip]="loc.getP('FontSize')"
      tooltipPosition="bottom"
      showDelay="500"
      [disabled]="editableContentService.editableContent == null"
      (mousedown)="$event.preventDefault()"
      (mouseup)="editableContentService.startEdit()"
      (onChange)="changeEvent()"
    ></p-dropdown> -->
    <sti-dropdown-component
      *ngIf="isRichText"
      [id]="3"
      [options]="helper.richTextFontSizes"
      [(value)]="richTextService.activeFontSize"
      [tooltip]="loc.getP('FontSize')"
      [optionLabel]="'name'"
      [optionValue]="'value'"
      [style]="{
        width: '60px',
        height: '32px',
        alignItems: 'center',
        margin: '10px 10px 1px 2px',
        fontSize: '12px'
      }"
      (mousedown)="$event.preventDefault()"
      (mouseup)="editableContentService.startEdit()"
      (valueChange)="richTextService.insertFontSize()"
    ></sti-dropdown-component>
    <!-- <p-dropdown
      *ngIf="isRichText"
      [options]="helper.richTextFontSizes"
      [(ngModel)]="richTextService.activeFontSize"
      optionLabel="name"
      optionValue="value"
      [style]="{ width: '60px', height: '32px', alignItems: 'center', margin: '10px 10px 1px 2px', fontSize: '12px' }"
      [tooltip]="loc.getP('FontSize')"
      tooltipPosition="bottom"
      showDelay="500"
      (mousedown)="$event.preventDefault()"
      (onChange)="richTextService.insertFontSize()"
      (mouseup)="editableContentService.startEdit()"
    ></p-dropdown> -->
    <sti-selectButton
      *ngIf="!isRichText"
      [options]="helper.styleOptions"
      [(value)]="fontStyle"
      [multiple]="true"
      optionValue="value"
      [style]="{ margin: '11px 10px 1px 1px', height: '32px', minWidth: '94px' }"
      [disabled]="editableContentService.editableContent == null"
      (mousedown)="$event.preventDefault()"
      (onChange)="changeEvent()"
      ><ng-template let-item>
        <img
          [src]="model.getImage(item.image)"
          [stiTooltip]="loc.getP(item.value)"
          tooltipPosition="bottom"
          showDelay="500"
        /> </ng-template
    ></sti-selectButton>
    <sti-selectButton
      *ngIf="isRichText"
      [options]="helper.styleOptions"
      [(value)]="richTextService.activeTextStyles"
      [multiple]="true"
      optionValue="value"
      (onOptionClick)="setStyle($event.option.value)"
      [style]="{ margin: '11px 10px 1px 1px', height: '32px', minWidth: '94px' }"
      ><ng-template let-item>
        <img
          [src]="model.getImage(item.image)"
          [stiTooltip]="loc.getP(item.value)"
          tooltipPosition="bottom"
          showDelay="500"
        /> </ng-template
    ></sti-selectButton>
    <div class="vertical-line"></div>
    <div
      *ngIf="!isRichText"
      class="button-container"
      [stiTooltip]="loc.getP('ForeColor')"
      tooltipPosition="bottom"
      showDelay="500"
      [style.opacity]="editableContentService.editableContent != null ? '1' : '0.5'"
      [class]="editableContentService.editableContent != null ? 'enabled' : 'disabled'"
      (click)="showColorPicker(fontColorEditor, foreColor)"
      (mousedown)="$event.preventDefault()"
      #fontColorEditor
    >
      <div class="prev">
        <div class="foreground" [style]="{ backgroundPosition: 'center', backgroundRepeat: 'no-repeat' }">
          <img [src]="model.getImage('images.Brush.png')" alt="" />
        </div>
        <span
          class="color-preview"
          [style.background-color]="
            editableContentService.editableContent != null
              ? editableContentService.editableContent?.eColor?.toHtmlColor()
              : 'rgb(182, 181, 180)'
          "
        ></span>
      </div>
      <div [style]="{ position: 'relative', alignSelf: 'center' }">
        <i class="pi pi-chevron-down"></i>
      </div>
    </div>
    <div
      *ngIf="isRichText"
      class="button-container"
      [stiTooltip]="loc.getP('ForeColor')"
      tooltipPosition="bottom"
      showDelay="500"
      [style.opacity]="1"
      [class]="'enabled'"
      (click)="showColorPicker(richTextColorEditor, richTextService.activeColor, true)"
      (mousedown)="$event.preventDefault()"
      #richTextColorEditor
    >
      <div class="prev">
        <div class="foreground" [style]="{ backgroundPosition: 'center', backgroundRepeat: 'no-repeat' }">
          <img [src]="model.getImage('images.Brush.png')" alt="" />
        </div>
        <span class="color-preview" [style.background-color]="richTextService.activeColor.toHtmlColor()"></span>
      </div>
      <div [style]="{ position: 'relative', alignSelf: 'center' }">
        <i class="pi pi-chevron-down"></i>
      </div>
    </div>
    <div
      class="button-container"
      [stiTooltip]="loc.getP('BackColor')"
      tooltipPosition="bottom"
      showDelay="500"
      [style.opacity]="haveBackgroundColor() ? '1' : '0.5'"
      [class]="haveBackgroundColor() ? 'enabled' : 'disabled'"
      (click)="showColorPicker(backColorEditor, backColor)"
      (mousedown)="$event.preventDefault()"
      (mouseup)="editableContentService.startEdit()"
      #backColorEditor
    >
      <div class="prev">
        <div class="background" [style]="{ backgroundPosition: 'center', backgroundRepeat: 'no-repeat' }">
          <img [src]="model.getImage('images.Fill.png')" alt="" />
        </div>
        <span
          class="color-preview"
          [style.background-color]="
            editableContentService.editableContent != null
              ? editableContentService.editableContent?.eBackgroundColor?.toHtmlColor()
              : 'rgb(182, 181, 180)'
          "
        ></span>
      </div>
      <div [style]="{ position: 'relative', alignSelf: 'center' }">
        <i class="pi pi-chevron-down"></i>
      </div>
    </div>
    <sti-selectButton
      *ngIf="haveContentAlignment()"
      [options]="helper.justifyOptions"
      [(value)]="editableContentService.editableContent.eContentAlignment"
      optionValue="value"
      [style]="{ margin: '11px 10px 1px 1px', height: '32px', minWidth: '94px' }"
      (mousedown)="editableContentService.startEdit()"
    >
      <ng-template let-item>
        <img
          [src]="model.getImage(item.image)"
          [stiTooltip]="loc.getP(item.name)"
          tooltipPosition="bottom"
          showDelay="500"
          [style]="{ height: '16px', width: '16px' }"
        />
      </ng-template>
    </sti-selectButton>
    <sti-selectButton
      *ngIf="!haveContentAlignment() && !isRichText"
      [options]="helper.justifyOptions"
      optionValue="value"
      [style]="{ margin: '11px 10px 1px 1px', height: '32px', minWidth: '94px' }"
      [disabled]="true"
    >
      <ng-template let-item>
        <img
          [src]="model.getImage(item.image)"
          [stiTooltip]="loc.getP(item.name)"
          tooltipPosition="bottom"
          showDelay="500"
          [style]="{ height: '16px', width: '16px' }"
        />
      </ng-template>
    </sti-selectButton>
    <sti-selectButton
      *ngIf="isRichText"
      [options]="helper.justifyOptions"
      [(value)]="richTextService.activeAlignment"
      optionValue="value"
      [style]="{ margin: '11px 10px 1px 1px', height: '32px', minWidth: '94px' }"
      (onOptionClick)="setAlignment($event.option.value)"
    >
      <ng-template let-item>
        <img
          [src]="model.getImage(item.image)"
          [stiTooltip]="loc.getP(item.name)"
          tooltipPosition="bottom"
          showDelay="500"
          [style]="{ height: '16px', width: '16px' }"
        />
      </ng-template>
    </sti-selectButton>
    <sti-selectButton
      *ngIf="haveVerticalAlignment()"
      [options]="helper.verticalAlignment"
      [(value)]="editableContentService.editableContent.eVerticalAlignment"
      optionValue="value"
      [style]="{ margin: '11px 10px 1px 1px', height: '32px', minWidth: '94px' }"
      (mousedown)="editableContentService.startEdit()"
    >
      <ng-template let-item>
        <img
          [src]="model.getImage(item.image)"
          [stiTooltip]="loc.getP(item.name)"
          tooltipPosition="bottom"
          showDelay="500"
          [style]="{ height: '16px', width: '16px' }"
        />
      </ng-template>
    </sti-selectButton>
    <sti-selectButton
      *ngIf="!haveVerticalAlignment()"
      [options]="helper.verticalAlignment"
      optionValue="value"
      [disabled]="true"
      [style]="{ margin: '11px 10px 1px 1px', height: '32px', minWidth: '90px' }"
    >
      <ng-template let-item>
        <img
          [src]="model.getImage(item.image)"
          [stiTooltip]="loc.getP(item.name)"
          tooltipPosition="bottom"
          showDelay="500"
          [style]="{ height: '16px', width: '16px' }"
        />
      </ng-template>
    </sti-selectButton>
    <!-- <div class="vertical-line"></div>
    <div
      class="container"
      [stiTooltip]="loc.getP('ToggleElementCorners')"
      tooltipPosition="bottom"
      showDelay="500"
      (click)="model.showCornerRadius = !model.showCornerRadius"
    >
      <div class="button {{ model.showCornerRadius ? 'active' : '' }}"><img [src]="getIcon('Corners')" alt="" /></div>
    </div> -->
  </div>`, isInline: true, styles: [".active{background-color:var(--active-color)!important}.disabled{opacity:.5;pointer-events:none}.container{width:40px;display:flex;align-items:center;justify-content:center}.button{height:32px;width:32px;background-color:var(--back-color);border-radius:3px;display:flex;align-items:center;justify-content:center}.button:hover{background-color:var(--hover-color)!important}.button:active{background-color:var(--columnDeleteHover-color)!important}img{max-width:18px}.prev{display:flex;width:100%;position:relative;flex-direction:column}.button-container{display:flex;margin-top:11px;height:32px;width:48px;position:relative;margin-right:10px;border-radius:3px}.button-container:hover{background-color:var(--hover-color)}.button-container:active{background-color:var(--columnDeleteHover-color)}.color-preview{width:20px;height:5px;margin-left:6px}i{height:12px;width:12px;right:3px;top:50%;vertical-align:middle;color:var(--text-color)}i:hover{color:#fff}.home{height:55px;color:var(--text-color);width:100%;display:flex;border-bottom:1px solid var(--formBorder-color);vertical-align:-webkit-baseline-middle;background-color:var(--back-color);font-family:Segoe UI;overflow-x:auto;overflow-y:hidden}*{scrollbar-width:thin;scrollbar-color:var(--thumb-color),var(--back-color)}*::-webkit-scrollbar{-webkit-appearance:none;background-color:var(--back-color);height:10px;width:10px;outline:none}*::-webkit-scrollbar-button{-webkit-appearance:none;height:3px;width:3px}*::-webkit-scrollbar-thumb{-webkit-appearance:none;background-color:var(--thumb-color);height:10px;min-width:25px;max-width:80%;border-radius:4px;border:2px solid var(--back-color)}*::-webkit-scrollbar-thumb:hover{background-color:var(--trackHover-color);height:10px}*::-webkit-scrollbar-track{-webkit-appearance:none;background-color:var(--back-color);border:1px solid var(--back-color)}*::-webkit-scrollbar-corner{background-color:var(--back-color)}.home input{margin-top:12.5px;vertical-align:-webkit-baseline-middle}.vertical-line{margin-top:10px;width:0px;height:32px;border-right:1px solid rgb(195,195,195);margin-right:5px}.Bold{background:var(--navbarBold-icon)}.Italic{background:var(--navbarItalic-icon)}.Underline{background:var(--navbarUnder-icon)}.foreground{margin-left:10px;margin-top:5px;width:16px;height:18px}.background{margin-left:8px;margin-top:5px;width:16px;height:18px}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiDropdownComponent, selector: "sti-dropdown-component", inputs: ["id", "options", "value", "disabled", "optionLabel", "optionValue", "isMinVersion", "tooltip"], outputs: ["valueChange"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }, { kind: "component", type: StiSelectButtonComponent, selector: "sti-selectButton", inputs: ["options", "value", "optionLabel", "optionValue", "multiple", "disabled"], outputs: ["onOptionClick", "onChange", "valueChange"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiHomeRibbonComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-home-ribbon-component", template: `<div
    class="home"
    style="-moz-user-select: none;-webkit-touch-callout: none;-webkit-user-select: none;-ms-user-select: none;user-select: none"
  >
    <div
      [style.margin-left]="'10px'"
      class="container {{ undoService?.undos?.length < 2 ? 'disabled' : '' }}"
      [stiTooltip]="loc.get2('HelpDesigner', 'Undo').replace('.', '')"
      tooltipPosition="bottom"
      showDelay="500"
      (click)="undoService.undo()"
    >
      <div class="button"><img [src]="model.getImage('images.Ribbon.Undo.png')" alt="" /></div>
    </div>
    <div
      class="container {{ undoService?.redos?.length < 1 ? 'disabled' : '' }}"
      [stiTooltip]="loc.get2('HelpDesigner', 'Redo').replace('.', '')"
      tooltipPosition="bottom"
      showDelay="500"
      (click)="undoService.redo()"
    >
      <div class="button"><img [src]="model.getImage('images.Ribbon.Redo.png')" alt="" /></div>
    </div>
    <!-- <div
      *ngIf="isRichText"
      [style.margin-left]="'10px'"
      class="container"
      [stiTooltip]="loc.getP('Undo')"
      tooltipPosition="bottom" showDelay="500"
      (click)="richTextService.useUndo()"
    >
      <div class="button"><img [src]="getIcon('Undo')" alt="" /></div>
    </div>
    <div
      *ngIf="isRichText"
      class="container"
      [stiTooltip]="loc.getP('Redo')"
      tooltipPosition="bottom" showDelay="500"
      (click)="richTextService.useRedo()"
    >
      <div class="button"><img [src]="getIcon('Redo')" alt="" /></div>
    </div> -->
    <div class="vertical-line"></div>
    <div
      class="container {{ !clipboardService.hasCopy ? 'disabled' : '' }}"
      [stiTooltip]="loc.get2('MainMenu', 'menuEditPaste').replace('&amp', '').replace(';', '')"
      tooltipPosition="bottom"
      showDelay="500"
      (click)="clipboardService.pasteElement($event)"
    >
      <div class="button"><img [src]="model.getImage('images.Ribbon.Paste.png')" alt="" /></div>
    </div>
    <div
      class="container {{ clipboardService.canCopy ? 'disabled' : '' }}"
      [stiTooltip]="loc.get2('MainMenu', 'menuEditCopy').replace('&amp', '').replace(';', '')"
      tooltipPosition="bottom"
      showDelay="500"
      (click)="clipboardService.copyElement()"
    >
      <div class="button"><img [src]="model.getImage('images.Ribbon.Copy.png')" alt="" /></div>
    </div>
    <div
      class="container {{ clipboardService.canCopy ? 'disabled' : '' }}"
      [stiTooltip]="loc.get2('MainMenu', 'menuEditCut').replace('&amp', '').replace(';', '')"
      tooltipPosition="bottom"
      showDelay="500"
      (click)="clipboardService.cutElement()"
    >
      <div class="button"><img [src]="model.getImage('images.Ribbon.Cut.png')" alt="" /></div>
    </div>
    <div
      class="container {{ !canDelete ? 'disabled' : '' }}"
      [stiTooltip]="loc.get2('Buttons', 'Delete')"
      tooltipPosition="bottom"
      showDelay="500"
      (click)="formEvents.deleteComponent()"
    >
      <div class="button"><img [src]="model.getImage('images.Ribbon.Delete.png')" alt="" /></div>
    </div>
    <div class="vertical-line"></div>
    <sti-dropdown-component
      *ngIf="!isRichText"
      [id]="0"
      [options]="model.fontFamilies"
      [(value)]="fontFamily"
      [disabled]="editableContentService.editableContent == null"
      [tooltip]="loc.get2('HelpDesigner', 'FontName')"
      [optionLabel]="'name'"
      [optionValue]="'name'"
      [style]="{
        width: '150px',
        height: '32px',
        alignItems: 'center',
        margin: '1px 2px',
        marginTop: '10px',
        fontSize: '12px'
      }"
      (mousedown)="$event.preventDefault()"
      (mouseup)="editableContentService.startEdit()"
      (valueChange)="changeEvent()"
    ></sti-dropdown-component>
    <!-- <p-dropdown
      *ngIf="!isRichText"
      [options]="model.fontFamilies"
      [(ngModel)]="fontFamily"
      optionLabel="name"
      optionValue="name"
      [style]="{
        width: '150px',
        height: '32px',
        alignItems: 'center',
        margin: '1px 2px',
        marginTop: '10px',
        fontSize: '12px'
      }"
      [disabled]="editableContentService.editableContent == null"
      [tooltip]="loc.get2('HelpDesigner', 'FontName')"
      tooltipPosition="bottom"
      showDelay="500"
      (mousedown)="$event.preventDefault()"
      (mouseup)="editableContentService.startEdit()"
      (onChange)="changeEvent()"
    ></p-dropdown> -->
    <sti-dropdown-component
      *ngIf="isRichText"
      [id]="1"
      [options]="model.fontFamilies"
      [(value)]="richTextService.activeFontFamily"
      [tooltip]="loc.get2('HelpDesigner', 'FontName')"
      [optionLabel]="'name'"
      [optionValue]="'name'"
      [style]="{
        width: '150px',
        height: '32px',
        alignItems: 'center',
        margin: '1px 2px',
        marginTop: '10px',
        fontSize: '12px'
      }"
      (mousedown)="$event.preventDefault()"
      (mouseup)="editableContentService.startEdit()"
      (valueChange)="richTextService.insertFontFamily(richTextService.activeFontFamily)"
    ></sti-dropdown-component>
    <!-- <p-dropdown
      *ngIf="isRichText"
      [options]="model.fontFamilies"
      [(ngModel)]="richTextService.activeFontFamily"
      optionLabel="name"
      optionValue="name"
      [style]="{
        width: '150px',
        height: '32px',
        alignItems: 'center',
        margin: '1px 2px',
        marginTop: '10px',
        fontSize: '12px'
      }"
      [tooltip]="loc.get2('HelpDesigner', 'FontName')"
      tooltipPosition="bottom"
      showDelay="500"
      (mousedown)="$event.preventDefault()"
      (onChange)="richTextService.insertFontFamily(richTextService.activeFontFamily)"
      (mouseup)="editableContentService.startEdit()"
    ></p-dropdown> -->
    <sti-dropdown-component
      *ngIf="!isRichText"
      [id]="2"
      [options]="helper.fontSizes"
      [(value)]="fontSize"
      [tooltip]="loc.getP('FontSize')"
      [style]="{
        width: '60px',
        height: '32px',
        alignItems: 'center',
        margin: '10px 10px 1px 2px',
        fontSize: '12px'
      }"
      [disabled]="editableContentService.editableContent == null"
      (mousedown)="$event.preventDefault()"
      (mouseup)="editableContentService.startEdit()"
      (valueChange)="changeEvent()"
    ></sti-dropdown-component>
    <!-- <p-dropdown
      *ngIf="!isRichText"
      [options]="helper.fontSizes"
      [(ngModel)]="fontSize"
      [style]="{ width: '60px', height: '32px', alignItems: 'center', margin: '10px 10px 1px 2px', fontSize: '12px' }"
      [tooltip]="loc.getP('FontSize')"
      tooltipPosition="bottom"
      showDelay="500"
      [disabled]="editableContentService.editableContent == null"
      (mousedown)="$event.preventDefault()"
      (mouseup)="editableContentService.startEdit()"
      (onChange)="changeEvent()"
    ></p-dropdown> -->
    <sti-dropdown-component
      *ngIf="isRichText"
      [id]="3"
      [options]="helper.richTextFontSizes"
      [(value)]="richTextService.activeFontSize"
      [tooltip]="loc.getP('FontSize')"
      [optionLabel]="'name'"
      [optionValue]="'value'"
      [style]="{
        width: '60px',
        height: '32px',
        alignItems: 'center',
        margin: '10px 10px 1px 2px',
        fontSize: '12px'
      }"
      (mousedown)="$event.preventDefault()"
      (mouseup)="editableContentService.startEdit()"
      (valueChange)="richTextService.insertFontSize()"
    ></sti-dropdown-component>
    <!-- <p-dropdown
      *ngIf="isRichText"
      [options]="helper.richTextFontSizes"
      [(ngModel)]="richTextService.activeFontSize"
      optionLabel="name"
      optionValue="value"
      [style]="{ width: '60px', height: '32px', alignItems: 'center', margin: '10px 10px 1px 2px', fontSize: '12px' }"
      [tooltip]="loc.getP('FontSize')"
      tooltipPosition="bottom"
      showDelay="500"
      (mousedown)="$event.preventDefault()"
      (onChange)="richTextService.insertFontSize()"
      (mouseup)="editableContentService.startEdit()"
    ></p-dropdown> -->
    <sti-selectButton
      *ngIf="!isRichText"
      [options]="helper.styleOptions"
      [(value)]="fontStyle"
      [multiple]="true"
      optionValue="value"
      [style]="{ margin: '11px 10px 1px 1px', height: '32px', minWidth: '94px' }"
      [disabled]="editableContentService.editableContent == null"
      (mousedown)="$event.preventDefault()"
      (onChange)="changeEvent()"
      ><ng-template let-item>
        <img
          [src]="model.getImage(item.image)"
          [stiTooltip]="loc.getP(item.value)"
          tooltipPosition="bottom"
          showDelay="500"
        /> </ng-template
    ></sti-selectButton>
    <sti-selectButton
      *ngIf="isRichText"
      [options]="helper.styleOptions"
      [(value)]="richTextService.activeTextStyles"
      [multiple]="true"
      optionValue="value"
      (onOptionClick)="setStyle($event.option.value)"
      [style]="{ margin: '11px 10px 1px 1px', height: '32px', minWidth: '94px' }"
      ><ng-template let-item>
        <img
          [src]="model.getImage(item.image)"
          [stiTooltip]="loc.getP(item.value)"
          tooltipPosition="bottom"
          showDelay="500"
        /> </ng-template
    ></sti-selectButton>
    <div class="vertical-line"></div>
    <div
      *ngIf="!isRichText"
      class="button-container"
      [stiTooltip]="loc.getP('ForeColor')"
      tooltipPosition="bottom"
      showDelay="500"
      [style.opacity]="editableContentService.editableContent != null ? '1' : '0.5'"
      [class]="editableContentService.editableContent != null ? 'enabled' : 'disabled'"
      (click)="showColorPicker(fontColorEditor, foreColor)"
      (mousedown)="$event.preventDefault()"
      #fontColorEditor
    >
      <div class="prev">
        <div class="foreground" [style]="{ backgroundPosition: 'center', backgroundRepeat: 'no-repeat' }">
          <img [src]="model.getImage('images.Brush.png')" alt="" />
        </div>
        <span
          class="color-preview"
          [style.background-color]="
            editableContentService.editableContent != null
              ? editableContentService.editableContent?.eColor?.toHtmlColor()
              : 'rgb(182, 181, 180)'
          "
        ></span>
      </div>
      <div [style]="{ position: 'relative', alignSelf: 'center' }">
        <i class="pi pi-chevron-down"></i>
      </div>
    </div>
    <div
      *ngIf="isRichText"
      class="button-container"
      [stiTooltip]="loc.getP('ForeColor')"
      tooltipPosition="bottom"
      showDelay="500"
      [style.opacity]="1"
      [class]="'enabled'"
      (click)="showColorPicker(richTextColorEditor, richTextService.activeColor, true)"
      (mousedown)="$event.preventDefault()"
      #richTextColorEditor
    >
      <div class="prev">
        <div class="foreground" [style]="{ backgroundPosition: 'center', backgroundRepeat: 'no-repeat' }">
          <img [src]="model.getImage('images.Brush.png')" alt="" />
        </div>
        <span class="color-preview" [style.background-color]="richTextService.activeColor.toHtmlColor()"></span>
      </div>
      <div [style]="{ position: 'relative', alignSelf: 'center' }">
        <i class="pi pi-chevron-down"></i>
      </div>
    </div>
    <div
      class="button-container"
      [stiTooltip]="loc.getP('BackColor')"
      tooltipPosition="bottom"
      showDelay="500"
      [style.opacity]="haveBackgroundColor() ? '1' : '0.5'"
      [class]="haveBackgroundColor() ? 'enabled' : 'disabled'"
      (click)="showColorPicker(backColorEditor, backColor)"
      (mousedown)="$event.preventDefault()"
      (mouseup)="editableContentService.startEdit()"
      #backColorEditor
    >
      <div class="prev">
        <div class="background" [style]="{ backgroundPosition: 'center', backgroundRepeat: 'no-repeat' }">
          <img [src]="model.getImage('images.Fill.png')" alt="" />
        </div>
        <span
          class="color-preview"
          [style.background-color]="
            editableContentService.editableContent != null
              ? editableContentService.editableContent?.eBackgroundColor?.toHtmlColor()
              : 'rgb(182, 181, 180)'
          "
        ></span>
      </div>
      <div [style]="{ position: 'relative', alignSelf: 'center' }">
        <i class="pi pi-chevron-down"></i>
      </div>
    </div>
    <sti-selectButton
      *ngIf="haveContentAlignment()"
      [options]="helper.justifyOptions"
      [(value)]="editableContentService.editableContent.eContentAlignment"
      optionValue="value"
      [style]="{ margin: '11px 10px 1px 1px', height: '32px', minWidth: '94px' }"
      (mousedown)="editableContentService.startEdit()"
    >
      <ng-template let-item>
        <img
          [src]="model.getImage(item.image)"
          [stiTooltip]="loc.getP(item.name)"
          tooltipPosition="bottom"
          showDelay="500"
          [style]="{ height: '16px', width: '16px' }"
        />
      </ng-template>
    </sti-selectButton>
    <sti-selectButton
      *ngIf="!haveContentAlignment() && !isRichText"
      [options]="helper.justifyOptions"
      optionValue="value"
      [style]="{ margin: '11px 10px 1px 1px', height: '32px', minWidth: '94px' }"
      [disabled]="true"
    >
      <ng-template let-item>
        <img
          [src]="model.getImage(item.image)"
          [stiTooltip]="loc.getP(item.name)"
          tooltipPosition="bottom"
          showDelay="500"
          [style]="{ height: '16px', width: '16px' }"
        />
      </ng-template>
    </sti-selectButton>
    <sti-selectButton
      *ngIf="isRichText"
      [options]="helper.justifyOptions"
      [(value)]="richTextService.activeAlignment"
      optionValue="value"
      [style]="{ margin: '11px 10px 1px 1px', height: '32px', minWidth: '94px' }"
      (onOptionClick)="setAlignment($event.option.value)"
    >
      <ng-template let-item>
        <img
          [src]="model.getImage(item.image)"
          [stiTooltip]="loc.getP(item.name)"
          tooltipPosition="bottom"
          showDelay="500"
          [style]="{ height: '16px', width: '16px' }"
        />
      </ng-template>
    </sti-selectButton>
    <sti-selectButton
      *ngIf="haveVerticalAlignment()"
      [options]="helper.verticalAlignment"
      [(value)]="editableContentService.editableContent.eVerticalAlignment"
      optionValue="value"
      [style]="{ margin: '11px 10px 1px 1px', height: '32px', minWidth: '94px' }"
      (mousedown)="editableContentService.startEdit()"
    >
      <ng-template let-item>
        <img
          [src]="model.getImage(item.image)"
          [stiTooltip]="loc.getP(item.name)"
          tooltipPosition="bottom"
          showDelay="500"
          [style]="{ height: '16px', width: '16px' }"
        />
      </ng-template>
    </sti-selectButton>
    <sti-selectButton
      *ngIf="!haveVerticalAlignment()"
      [options]="helper.verticalAlignment"
      optionValue="value"
      [disabled]="true"
      [style]="{ margin: '11px 10px 1px 1px', height: '32px', minWidth: '90px' }"
    >
      <ng-template let-item>
        <img
          [src]="model.getImage(item.image)"
          [stiTooltip]="loc.getP(item.name)"
          tooltipPosition="bottom"
          showDelay="500"
          [style]="{ height: '16px', width: '16px' }"
        />
      </ng-template>
    </sti-selectButton>
    <!-- <div class="vertical-line"></div>
    <div
      class="container"
      [stiTooltip]="loc.getP('ToggleElementCorners')"
      tooltipPosition="bottom"
      showDelay="500"
      (click)="model.showCornerRadius = !model.showCornerRadius"
    >
      <div class="button {{ model.showCornerRadius ? 'active' : '' }}"><img [src]="getIcon('Corners')" alt="" /></div>
    </div> -->
  </div>`, styles: [".active{background-color:var(--active-color)!important}.disabled{opacity:.5;pointer-events:none}.container{width:40px;display:flex;align-items:center;justify-content:center}.button{height:32px;width:32px;background-color:var(--back-color);border-radius:3px;display:flex;align-items:center;justify-content:center}.button:hover{background-color:var(--hover-color)!important}.button:active{background-color:var(--columnDeleteHover-color)!important}img{max-width:18px}.prev{display:flex;width:100%;position:relative;flex-direction:column}.button-container{display:flex;margin-top:11px;height:32px;width:48px;position:relative;margin-right:10px;border-radius:3px}.button-container:hover{background-color:var(--hover-color)}.button-container:active{background-color:var(--columnDeleteHover-color)}.color-preview{width:20px;height:5px;margin-left:6px}i{height:12px;width:12px;right:3px;top:50%;vertical-align:middle;color:var(--text-color)}i:hover{color:#fff}.home{height:55px;color:var(--text-color);width:100%;display:flex;border-bottom:1px solid var(--formBorder-color);vertical-align:-webkit-baseline-middle;background-color:var(--back-color);font-family:Segoe UI;overflow-x:auto;overflow-y:hidden}*{scrollbar-width:thin;scrollbar-color:var(--thumb-color),var(--back-color)}*::-webkit-scrollbar{-webkit-appearance:none;background-color:var(--back-color);height:10px;width:10px;outline:none}*::-webkit-scrollbar-button{-webkit-appearance:none;height:3px;width:3px}*::-webkit-scrollbar-thumb{-webkit-appearance:none;background-color:var(--thumb-color);height:10px;min-width:25px;max-width:80%;border-radius:4px;border:2px solid var(--back-color)}*::-webkit-scrollbar-thumb:hover{background-color:var(--trackHover-color);height:10px}*::-webkit-scrollbar-track{-webkit-appearance:none;background-color:var(--back-color);border:1px solid var(--back-color)}*::-webkit-scrollbar-corner{background-color:var(--back-color)}.home input{margin-top:12.5px;vertical-align:-webkit-baseline-middle}.vertical-line{margin-top:10px;width:0px;height:32px;border-right:1px solid rgb(195,195,195);margin-right:5px}.Bold{background:var(--navbarBold-icon)}.Italic{background:var(--navbarItalic-icon)}.Underline{background:var(--navbarUnder-icon)}.foreground{margin-left:10px;margin-top:5px;width:16px;height:18px}.background{margin-left:8px;margin-top:5px;width:16px;height:18px}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiDraggableService }, { type: StiThemeService }, { type: StiRectangleGeometryLayout }, { type: FormEventsService }, { type: StiEditableContentService }, { type: StiLocalizationService }, { type: StiRichTextService }, { type: StiUndoService }, { type: StiNameService }, { type: StiColorDialogService }, { type: StiClipboardService }] });

class StiFileRibbonComponent {
    constructor(model, loc) {
        this.model = model;
        this.loc = loc;
    }
    saveAs() { }
    open() {
        let input = document.createElement("input");
        input.type = "file";
        let model = this.model;
        input.onchange = (_) => {
            // you can use this method to get file and perform respective operations
            let file = Array.from(input.files)[0];
            var reader = new FileReader();
            reader.readAsText(file, "UTF-8");
            reader.onload = function (evt) {
                model.setFormFromString(evt.target.result);
            };
        };
        input.click();
    }
    importFromPdf() {
        //TODO
    }
    showAboutWindow() {
        this.model.showAboutWindow = true;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFileRibbonComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiFileRibbonComponent, selector: "sti-file-ribbon-component", ngImport: i0, template: `<div class="saving">
    <button style="margin-left: 20px">{{ loc.getP("New") }}</button>
    <button (click)="open()">{{ loc.getP("Open") }}</button>
    <button (click)="saveAs()">{{ loc.getP("SaveAs") }}</button>
    <button (click)="importFromPdf()">{{ loc.getP("ImportFromPdf") }}</button>
    <button (click)="showAboutWindow()">{{ loc.getP("About") }}</button>
  </div>`, isInline: true, styles: [".saving{height:55px;color:var(--text-color);width:100%;-webkit-touch-callout:none;-webkit-user-select:none;border-bottom:1px solid var(--formBorder-color);background-color:var(--back-color);font-family:Segoe UI}.saving button{margin-top:15px;padding:3px 12px;text-decoration:none;margin-right:5px;text-align:center;justify-content:center;font-size:12px;color:var(--text-color);font-weight:600;cursor:default;background-color:var(--input-color);border-top:2px solid var(--toolbarResizerBorder-color);border-left:1px solid var(--toolbarResizerBorder-color);border-right:1px solid var(--toolbarResizerBorder-color);border-bottom:1px solid var(--toolbarResizerBorder-color);vertical-align:-webkit-baseline-middle;border-radius:3px}.saving button:hover{background-color:var(--hover-color)}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFileRibbonComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-file-ribbon-component", template: `<div class="saving">
    <button style="margin-left: 20px">{{ loc.getP("New") }}</button>
    <button (click)="open()">{{ loc.getP("Open") }}</button>
    <button (click)="saveAs()">{{ loc.getP("SaveAs") }}</button>
    <button (click)="importFromPdf()">{{ loc.getP("ImportFromPdf") }}</button>
    <button (click)="showAboutWindow()">{{ loc.getP("About") }}</button>
  </div>`, styles: [".saving{height:55px;color:var(--text-color);width:100%;-webkit-touch-callout:none;-webkit-user-select:none;border-bottom:1px solid var(--formBorder-color);background-color:var(--back-color);font-family:Segoe UI}.saving button{margin-top:15px;padding:3px 12px;text-decoration:none;margin-right:5px;text-align:center;justify-content:center;font-size:12px;color:var(--text-color);font-weight:600;cursor:default;background-color:var(--input-color);border-top:2px solid var(--toolbarResizerBorder-color);border-left:1px solid var(--toolbarResizerBorder-color);border-right:1px solid var(--toolbarResizerBorder-color);border-bottom:1px solid var(--toolbarResizerBorder-color);vertical-align:-webkit-baseline-middle;border-radius:3px}.saving button:hover{background-color:var(--hover-color)}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }] });

class StiToolboxElementComponent {
    constructor(toolboxService, toolbarResizerService, theme, model, loc) {
        this.toolboxService = toolboxService;
        this.toolbarResizerService = toolbarResizerService;
        this.theme = theme;
        this.model = model;
        this.loc = loc;
        this.forRibbon = false;
        this.forGroup = false;
    }
    showPreview(event, caption) {
        let elements = document.elementsFromPoint(event.clientX, event.clientY);
        let element = elements?.find((element) => element?.classList.contains("current-group"));
        let elementRect = this.model.getPositionRelativeToForm(element);
        this.toolboxService.previewY = elementRect?.bottom;
        this.toolboxService.previewX = elementRect?.left;
        this.toolboxService.currentGroup = caption;
        if (caption == "Input" &&
            (!this.toolboxService.unusedElements?.find((item) => item == "textbox") ||
                !this.toolboxService.unusedElements?.find((item) => item == "numberbox") ||
                !this.toolboxService.unusedElements?.find((item) => item == "combobox") ||
                !this.toolboxService.unusedElements?.find((item) => item == "dateTime"))) {
            this.model.showGroupPreview = true;
        }
        else if (caption == "Selection" &&
            (!this.toolboxService.unusedElements?.find((item) => item == "singleSelection") ||
                !this.toolboxService.unusedElements?.find((item) => item == "multipleSelection") ||
                !this.toolboxService.unusedElements?.find((item) => item == "listbox") ||
                !this.toolboxService.unusedElements?.find((item) => item == "checkbox"))) {
            this.model.showGroupPreview = true;
        }
        else if (caption == "Others" &&
            (!this.toolboxService.unusedElements?.find((item) => item == "signature") ||
                !this.toolboxService.unusedElements?.find((item) => item == "barcode") ||
                !this.toolboxService.unusedElements?.find((item) => item == "address") ||
                !this.toolboxService.unusedElements?.find((item) => item == "line"))) {
            this.model.showGroupPreview = true;
        }
    }
    onMouseDown(event) {
        let form = document.querySelector("stimulsoft-forms");
        form?.classList.add("unselectable");
        this.toolboxService.elementMouseDown(this, event);
    }
    onDoubleClick() {
        this.toolboxService.elementDoubleClick(this);
    }
    get isMaximize() {
        return this.toolbarResizerService.isMaximizeMode;
    }
    get className() {
        return "element " + (this.toolboxService.mouseDownComponent?.element == this.element ? "active" : "hover");
    }
    get image() {
        return this.model.getImage(this.element.image);
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiToolboxElementComponent, deps: [{ token: StiToolboxService }, { token: StiToolbarResizerService }, { token: StiThemeService }, { token: StiModelService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiToolboxElementComponent, selector: "sti-toolbox-element", inputs: { element: "element", forRibbon: "forRibbon", forGroup: "forGroup" }, ngImport: i0, template: `
    <div
      *ngIf="
        !forGroup && toolboxService.isEnabled(element) && !this.isMaximize && element.caption != 'Divider' && !forRibbon
      "
      [class]="className"
      (mousedown)="onMouseDown($event)"
      (dblclick)="onDoubleClick()"
      [stiTooltip]="loc.get2(element.category ? element.category : 'Components', element.caption)"
      tooltipPosition="right"
      showDelay="500"
    >
      <img [src]="image" style="pointer-events: none" />
    </div>
    <div
      class="divider"
      *ngIf="
        !forGroup &&
        !this.isMaximize &&
        element.caption == 'Divider' &&
        !forRibbon &&
        toolboxService.isToolboxInlineElementsDividerEnabled(element)
      "
      [style.height.px]="4"
      [style.width.px]="28"
    >
      <div [style.height.px]="1" [style.width.px]="22" [style.border-bottom]="'1px solid rgb(170,170,170)'"></div>
    </div>
    <div
      *ngIf="!forGroup && toolboxService.isEnabled(element) && this.isMaximize && !forRibbon"
      [class]="className"
      (mousedown)="onMouseDown($event)"
      (dblclick)="onDoubleClick()"
    >
      <img [src]="image" style="pointer-events: none" />
      <label style="width: 110px;">{{
        loc.get2(element.category ? element.category : "Components", element.caption)
      }}</label>
    </div>
    <div
      *ngIf="
        !forGroup &&
        toolboxService.isEnabled(element) &&
        toolboxService.isGroupEnabled(element) &&
        forRibbon &&
        (element.caption == 'Input' || element.caption == 'Others' || element.caption == 'Selection')
      "
      class="container current-group"
      [stiTooltip]="loc.getP(element.caption)"
      tooltipPosition="bottom"
      showDelay="500"
      (click)="showPreview($event, element.caption)"
    >
      <div class="button">
        <img class="img" [src]="image" alt="" />
        <span>{{
          element.caption == "Others"
            ? loc.get2("FormColorBoxPopup", element.caption).replace("...", "")
            : loc.getP(element.caption)
        }}</span>
        <span class="select-button"><i class="pi pi-chevron-down"></i></span>
      </div>
    </div>
    <div
      *ngIf="
        !forGroup &&
        toolboxService.isEnabled(element) &&
        forRibbon &&
        element.caption != 'Divider' &&
        element.caption != 'Input' &&
        element.caption != 'Selection' &&
        element.caption != 'Others'
      "
      class="container"
      [stiTooltip]="loc.get2(element.category ? element.category : 'Components', element.caption)"
      tooltipPosition="bottom"
      showDelay="500"
      (mousedown)="onMouseDown($event)"
      (dblclick)="onDoubleClick()"
    >
      <div class="button">
        <img class="img" [src]="image" alt="" />
        <span>{{ loc.get2(element.category ? element.category : "Components", element.caption) }}</span>
      </div>
    </div>
    <div
      *ngIf="forGroup && toolboxService.isEnabled(element)"
      class="container-group"
      [stiTooltip]="loc.get2(element.category ? element.category : 'Components', element.caption)"
      tooltipPosition="bottom"
      showDelay="500"
      (mousedown)="onMouseDown($event)"
      (dblclick)="onDoubleClick()"
      [style.width]="'100%'"
    >
      <div class="button-group">
        <img class="img" [src]="image" alt="" />
        <span>{{ loc.get2(element.category ? element.category : "Components", element.caption) }}</span>
      </div>
    </div>
    <div
      class="vertical-line"
      *ngIf="
        !forGroup &&
        forRibbon &&
        element.caption == 'Divider' &&
        toolboxService.isInsertInlineElementsDividerEnabled(element)
      "
    ></div>
  `, isInline: true, styles: [".container{width:max-content;display:flex;align-items:center;justify-content:center;-webkit-touch-callout:none;-webkit-user-select:none;margin-top:2px}.button{height:50px;width:max-content;background-color:var(--back-color);border-radius:3px;display:flex;align-items:center;justify-content:center;padding-left:5px;padding-right:5px}.button:hover{background-color:var(--hover-color)!important}.button:active{background-color:var(--columnDeleteHover-color)!important}.container-group{width:max-content;height:max-content;display:flex;align-items:center;-webkit-touch-callout:none;-webkit-user-select:none;margin-top:1px}.button-group{height:max-content;width:100%;background-color:var(--back-color);border-radius:3px;display:flex;align-items:center;padding:4px}.button-group:hover{background-color:var(--hover-color)!important}.button-group:active{background-color:var(--columnDeleteHover-color)!important}.divider{display:flex;align-items:center;justify-content:center}.element{width:28px;height:28px;background-color:inherit;color:var(--text-color);border-radius:3px;display:flex;flex-wrap:nowrap;font-size:13px;font-weight:500;-webkit-touch-callout:none;-webkit-user-select:none;align-items:center;justify-content:center}.element.hover:hover{background-color:var(--hover-color)}.element.active{background-color:var(--active-color)}img{vertical-align:sub;width:16px;height:16px}.img{max-width:18px;pointer-events:none}.vertical-line{margin-top:10px;width:0px;height:32px;border-right:1px solid rgb(195,195,195);margin-right:5px}label{margin-left:3px;word-wrap:normal;white-space:nowrap;width:110px}span{font-size:13px;white-space:nowrap;margin-left:9px}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiToolboxElementComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-toolbox-element", template: `
    <div
      *ngIf="
        !forGroup && toolboxService.isEnabled(element) && !this.isMaximize && element.caption != 'Divider' && !forRibbon
      "
      [class]="className"
      (mousedown)="onMouseDown($event)"
      (dblclick)="onDoubleClick()"
      [stiTooltip]="loc.get2(element.category ? element.category : 'Components', element.caption)"
      tooltipPosition="right"
      showDelay="500"
    >
      <img [src]="image" style="pointer-events: none" />
    </div>
    <div
      class="divider"
      *ngIf="
        !forGroup &&
        !this.isMaximize &&
        element.caption == 'Divider' &&
        !forRibbon &&
        toolboxService.isToolboxInlineElementsDividerEnabled(element)
      "
      [style.height.px]="4"
      [style.width.px]="28"
    >
      <div [style.height.px]="1" [style.width.px]="22" [style.border-bottom]="'1px solid rgb(170,170,170)'"></div>
    </div>
    <div
      *ngIf="!forGroup && toolboxService.isEnabled(element) && this.isMaximize && !forRibbon"
      [class]="className"
      (mousedown)="onMouseDown($event)"
      (dblclick)="onDoubleClick()"
    >
      <img [src]="image" style="pointer-events: none" />
      <label style="width: 110px;">{{
        loc.get2(element.category ? element.category : "Components", element.caption)
      }}</label>
    </div>
    <div
      *ngIf="
        !forGroup &&
        toolboxService.isEnabled(element) &&
        toolboxService.isGroupEnabled(element) &&
        forRibbon &&
        (element.caption == 'Input' || element.caption == 'Others' || element.caption == 'Selection')
      "
      class="container current-group"
      [stiTooltip]="loc.getP(element.caption)"
      tooltipPosition="bottom"
      showDelay="500"
      (click)="showPreview($event, element.caption)"
    >
      <div class="button">
        <img class="img" [src]="image" alt="" />
        <span>{{
          element.caption == "Others"
            ? loc.get2("FormColorBoxPopup", element.caption).replace("...", "")
            : loc.getP(element.caption)
        }}</span>
        <span class="select-button"><i class="pi pi-chevron-down"></i></span>
      </div>
    </div>
    <div
      *ngIf="
        !forGroup &&
        toolboxService.isEnabled(element) &&
        forRibbon &&
        element.caption != 'Divider' &&
        element.caption != 'Input' &&
        element.caption != 'Selection' &&
        element.caption != 'Others'
      "
      class="container"
      [stiTooltip]="loc.get2(element.category ? element.category : 'Components', element.caption)"
      tooltipPosition="bottom"
      showDelay="500"
      (mousedown)="onMouseDown($event)"
      (dblclick)="onDoubleClick()"
    >
      <div class="button">
        <img class="img" [src]="image" alt="" />
        <span>{{ loc.get2(element.category ? element.category : "Components", element.caption) }}</span>
      </div>
    </div>
    <div
      *ngIf="forGroup && toolboxService.isEnabled(element)"
      class="container-group"
      [stiTooltip]="loc.get2(element.category ? element.category : 'Components', element.caption)"
      tooltipPosition="bottom"
      showDelay="500"
      (mousedown)="onMouseDown($event)"
      (dblclick)="onDoubleClick()"
      [style.width]="'100%'"
    >
      <div class="button-group">
        <img class="img" [src]="image" alt="" />
        <span>{{ loc.get2(element.category ? element.category : "Components", element.caption) }}</span>
      </div>
    </div>
    <div
      class="vertical-line"
      *ngIf="
        !forGroup &&
        forRibbon &&
        element.caption == 'Divider' &&
        toolboxService.isInsertInlineElementsDividerEnabled(element)
      "
    ></div>
  `, styles: [".container{width:max-content;display:flex;align-items:center;justify-content:center;-webkit-touch-callout:none;-webkit-user-select:none;margin-top:2px}.button{height:50px;width:max-content;background-color:var(--back-color);border-radius:3px;display:flex;align-items:center;justify-content:center;padding-left:5px;padding-right:5px}.button:hover{background-color:var(--hover-color)!important}.button:active{background-color:var(--columnDeleteHover-color)!important}.container-group{width:max-content;height:max-content;display:flex;align-items:center;-webkit-touch-callout:none;-webkit-user-select:none;margin-top:1px}.button-group{height:max-content;width:100%;background-color:var(--back-color);border-radius:3px;display:flex;align-items:center;padding:4px}.button-group:hover{background-color:var(--hover-color)!important}.button-group:active{background-color:var(--columnDeleteHover-color)!important}.divider{display:flex;align-items:center;justify-content:center}.element{width:28px;height:28px;background-color:inherit;color:var(--text-color);border-radius:3px;display:flex;flex-wrap:nowrap;font-size:13px;font-weight:500;-webkit-touch-callout:none;-webkit-user-select:none;align-items:center;justify-content:center}.element.hover:hover{background-color:var(--hover-color)}.element.active{background-color:var(--active-color)}img{vertical-align:sub;width:16px;height:16px}.img{max-width:18px;pointer-events:none}.vertical-line{margin-top:10px;width:0px;height:32px;border-right:1px solid rgb(195,195,195);margin-right:5px}label{margin-left:3px;word-wrap:normal;white-space:nowrap;width:110px}span{font-size:13px;white-space:nowrap;margin-left:9px}\n"] }]
        }], ctorParameters: () => [{ type: StiToolboxService }, { type: StiToolbarResizerService }, { type: StiThemeService }, { type: StiModelService }, { type: StiLocalizationService }], propDecorators: { element: [{
                type: Input
            }], forRibbon: [{
                type: Input
            }], forGroup: [{
                type: Input
            }] } });

class StiInsertRibbonComponent {
    constructor(model, loc, toolboxService, helper, nameService) {
        this.model = model;
        this.loc = loc;
        this.toolboxService = toolboxService;
        this.helper = helper;
        this.nameService = nameService;
    }
    addPage() {
        let newPage = this.helper.clonePage(this.model.form.pages[this.model.form.pages.length - 1]);
        newPage.elements = [];
        newPage.name = this.nameService.getElementName(newPage);
        this.model.form.pages.splice(this.model.form.pages.indexOf(this.model.form.pages[this.model.form.pages.length - 1]) + 1, 0, newPage);
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiInsertRibbonComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }, { token: StiToolboxService }, { token: StiHelperService }, { token: StiNameService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiInsertRibbonComponent, selector: "sti-insert-ribbon-component", ngImport: i0, template: `<div class="insert">
    <div
      class="container"
      [stiTooltip]="loc.get2('HelpDesigner', 'PageNew')"
      tooltipPosition="bottom"
      showDelay="500"
      (mousedown)="addPage()"
    >
      <div class="button">
        <img [src]="model.getImage('images.Page.StiPage.png')" alt="" />
        <span>{{ loc.get2("FormViewer", "PageNew") }}</span>
      </div>
    </div>
    <div class="vertical-line"></div>
    <sti-toolbox-element
      [forRibbon]="true"
      *ngFor="let element of toolboxService.elementsForRibbon"
      [element]="element"
    ></sti-toolbox-element>
    <div
      *ngIf="toolboxService.isInsertOutlineElementsDividerEnabled() && model.getBooleanSetting('showSetupToolbox')"
      class="vertical-line"
    ></div>
    <div
      class="container"
      *ngIf="model.getBooleanSetting('showSetupToolbox')"
      (click)="model.showToolboxSetup = true"
      [stiTooltip]="loc.get2('FormDesigner', 'SetupToolbox')"
      tooltipPosition="bottom"
      showDelay="500"
    >
      <div class="button">
        <img [src]="model.getImage('images.Other.SetupToolbox.png')" alt="" />
        <span>{{ loc.get2("FormDesigner", "SetupToolbox") }}</span>
      </div>
    </div>
  </div>`, isInline: true, styles: [".container{width:max-content;display:flex;align-items:center;justify-content:center;-webkit-touch-callout:none;-webkit-user-select:none}.button{height:50px;padding-left:5px;padding-right:5px;width:max-content;background-color:var(--back-color);border-radius:3px;display:flex;align-items:center;justify-content:center}.button:hover{background-color:var(--hover-color)!important}.button:active{background-color:var(--columnDeleteHover-color)!important}img{max-width:18px}.insert{height:55px;color:var(--text-color);width:100%;display:flex;border-bottom:1px solid var(--formBorder-color);vertical-align:-webkit-baseline-middle;background-color:var(--back-color);font-family:Segoe UI;overflow-x:auto;overflow-y:hidden}*{scrollbar-width:thin;scrollbar-color:var(--thumb-color),var(--back-color)}*::-webkit-scrollbar{-webkit-appearance:none;background-color:var(--back-color);height:10px;width:10px;outline:none}*::-webkit-scrollbar-button{-webkit-appearance:none;height:3px;width:3px}*::-webkit-scrollbar-thumb{-webkit-appearance:none;background-color:var(--thumb-color);height:10px;min-width:25px;max-width:80%;border-radius:4px;border:2px solid var(--back-color)}*::-webkit-scrollbar-thumb:hover{background-color:var(--trackHover-color);height:10px}*::-webkit-scrollbar-track{-webkit-appearance:none;background-color:var(--back-color);border:1px solid var(--back-color)}*::-webkit-scrollbar-corner{background-color:var(--back-color)}.vertical-line{margin-top:10px;width:0px;height:32px;border-right:1px solid rgb(195,195,195);margin-right:5px;margin-left:5px}span{font-size:13px;margin-left:3px}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiToolboxElementComponent, selector: "sti-toolbox-element", inputs: ["element", "forRibbon", "forGroup"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiInsertRibbonComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-insert-ribbon-component", template: `<div class="insert">
    <div
      class="container"
      [stiTooltip]="loc.get2('HelpDesigner', 'PageNew')"
      tooltipPosition="bottom"
      showDelay="500"
      (mousedown)="addPage()"
    >
      <div class="button">
        <img [src]="model.getImage('images.Page.StiPage.png')" alt="" />
        <span>{{ loc.get2("FormViewer", "PageNew") }}</span>
      </div>
    </div>
    <div class="vertical-line"></div>
    <sti-toolbox-element
      [forRibbon]="true"
      *ngFor="let element of toolboxService.elementsForRibbon"
      [element]="element"
    ></sti-toolbox-element>
    <div
      *ngIf="toolboxService.isInsertOutlineElementsDividerEnabled() && model.getBooleanSetting('showSetupToolbox')"
      class="vertical-line"
    ></div>
    <div
      class="container"
      *ngIf="model.getBooleanSetting('showSetupToolbox')"
      (click)="model.showToolboxSetup = true"
      [stiTooltip]="loc.get2('FormDesigner', 'SetupToolbox')"
      tooltipPosition="bottom"
      showDelay="500"
    >
      <div class="button">
        <img [src]="model.getImage('images.Other.SetupToolbox.png')" alt="" />
        <span>{{ loc.get2("FormDesigner", "SetupToolbox") }}</span>
      </div>
    </div>
  </div>`, styles: [".container{width:max-content;display:flex;align-items:center;justify-content:center;-webkit-touch-callout:none;-webkit-user-select:none}.button{height:50px;padding-left:5px;padding-right:5px;width:max-content;background-color:var(--back-color);border-radius:3px;display:flex;align-items:center;justify-content:center}.button:hover{background-color:var(--hover-color)!important}.button:active{background-color:var(--columnDeleteHover-color)!important}img{max-width:18px}.insert{height:55px;color:var(--text-color);width:100%;display:flex;border-bottom:1px solid var(--formBorder-color);vertical-align:-webkit-baseline-middle;background-color:var(--back-color);font-family:Segoe UI;overflow-x:auto;overflow-y:hidden}*{scrollbar-width:thin;scrollbar-color:var(--thumb-color),var(--back-color)}*::-webkit-scrollbar{-webkit-appearance:none;background-color:var(--back-color);height:10px;width:10px;outline:none}*::-webkit-scrollbar-button{-webkit-appearance:none;height:3px;width:3px}*::-webkit-scrollbar-thumb{-webkit-appearance:none;background-color:var(--thumb-color);height:10px;min-width:25px;max-width:80%;border-radius:4px;border:2px solid var(--back-color)}*::-webkit-scrollbar-thumb:hover{background-color:var(--trackHover-color);height:10px}*::-webkit-scrollbar-track{-webkit-appearance:none;background-color:var(--back-color);border:1px solid var(--back-color)}*::-webkit-scrollbar-corner{background-color:var(--back-color)}.vertical-line{margin-top:10px;width:0px;height:32px;border-right:1px solid rgb(195,195,195);margin-right:5px;margin-left:5px}span{font-size:13px;margin-left:3px}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }, { type: StiToolboxService }, { type: StiHelperService }, { type: StiNameService }] });

class NavbarComponent {
    get editButtonRight() {
        return (this.saveButton?.nativeElement.offsetWidth ?? 0) + 20;
    }
    get componentHeight() {
        if (this.model.viewerMode) {
            return 0;
        }
        else if (this.model.pdfPreviewMode || this.model.previewMode) {
            return 38;
        }
        else
            return 93;
    }
    getClass(ribbon) {
        return this.model.ribbon == ribbon ? "current" : "other";
    }
    setEvent(event) {
        if (event == "Share") {
            this.httpService.post("", { action: "InterfaceEvent", event: "ShareButtonClick" }).subscribe(() => { });
        }
        else if (event == "Publish") {
            this.httpService.post("", { action: "InterfaceEvent", event: "PublishButtonClick" }).subscribe(() => { });
        }
        else if (event == "Login") {
            this.httpService.post("", { action: "InterfaceEvent", event: "LoginButtonClick" }).subscribe(() => { });
        }
        else if (event == "Signup") {
            this.httpService.post("", { action: "InterfaceEvent", event: "SignUpButtonClick" }).subscribe(() => { });
        }
    }
    setRibbon(ribbon) {
        this.model.ribbon = ribbon;
    }
    onSetRibbon(ribbon, oldRibbon) {
        if (ribbon == "PDFPreview" || ribbon == "File") {
            this.model.currentFormState = this.model.form.saveToReportJsonObject().serialize();
        }
        if ((this.model.isWebView || this.model.embeddedMode) && ribbon == "File") {
            this.httpService.post("", { action: "InterfaceEvent", event: "RibbonFileClick" }).subscribe(() => { });
            this.model.ribbon = oldRibbon;
        }
        else {
            if (ribbon == "File") {
                this.model.currentSelectedFileOption = "Open";
            }
        }
        this.model.showTrialLog();
    }
    save() {
        if (this.model.isWebView || this.model.embeddedMode || this.model.isCloudMode) {
            let form = this.model.form.saveToJsonObject().serialize();
            this.httpService.post("", { action: "InterfaceEvent", event: "SaveButtonClick", form: form }).subscribe(() => { });
        }
        else {
            this.setRibbon("File");
            this.model.currentSelectedFileOption = "SaveAs";
        }
    }
    showInfo(event, type) {
        let elements = document.elementsFromPoint(event.clientX, event.clientY);
        let element = elements.find((element) => element?.classList.contains("localization")) ||
            elements.find((element) => element?.classList.contains("user-info"));
        let elementRect = this.model.getPositionRelativeToForm(element);
        this.userService.previewY = elementRect.bottom;
        if (type == "Localization") {
            this.userService.showLocalizationPreview = true;
            this.userService.previewX = elementRect.right - (this.loc.localizationList?.length > 0 ? 465 : 155);
        }
        else {
            this.userService.showUserInfo = true;
            this.userService.previewX = elementRect.right - 351;
        }
    }
    sendExportEvent() {
        if (this.model.isWebView) {
            this.httpService.post("", { action: "InterfaceEvent", event: "ExportButtonClick" }).subscribe(() => { });
        }
        else if (this.model.isCloudMode && !this.model.viewerMode) {
            this.model.showSaveDialogFromCloud = true;
        }
        else {
            this.showPdfOption();
        }
    }
    constructor(model, helper, draggableService, exportService, render, theme, loc, toolboxService, httpService, userService, formCheckerService) {
        this.model = model;
        this.helper = helper;
        this.draggableService = draggableService;
        this.exportService = exportService;
        this.render = render;
        this.theme = theme;
        this.loc = loc;
        this.toolboxService = toolboxService;
        this.httpService = httpService;
        this.userService = userService;
        this.formCheckerService = formCheckerService;
        this.disabled = true;
    }
    ngOnDestroy() {
        this.startPdfEventSubscription?.unsubscribe();
        this.setFormEventSubscription?.unsubscribe();
    }
    editForm() {
        let cloudParams = {
            demomode: true,
            localizationName: "en",
            themeName: "Office2022WhiteBlue",
            isForm: true,
            reportName: this.helper.base64Encode(this.model.form.formName),
        };
        let win_ = window.open("about:blank");
        let doc = win_ ? win_.document : document;
        this.httpService.postForm("https://designer.stimulsoft.com/", {
            designerParams: this.helper.base64Encode(JSON.stringify(cloudParams)),
        }, doc, true);
    }
    showPdfOption() {
        this.exportService.showModalWindow = !this.exportService.showModalWindow;
    }
    ngOnInit() {
        this.model.form?.pages.length == 1 ? (this.disabled = true) : (this.disabled = false);
        this.setFormEventSubscription = this.model.formEvents.subscribe((e) => {
            if (e.name == "SetForm") {
                this.setDefaultTab();
            }
            else if (e.name == "ShowFileMenu") {
                this.setRibbon("File");
            }
            else if (e.name == "ShowSaveMenu") {
                this.setRibbon("File");
                this.model.currentSelectedFileOption = "SaveAs";
            }
            else if (e.name == "ShowTab") {
                this.setRibbon(e.value);
            }
        });
        this.model.interfaceEvent.subscribe((e) => {
            if (e.name == "setRibbon") {
                this.onSetRibbon(e.data.ribbon, e.data.oldRibbon);
            }
        });
        this.startPdfEventSubscription = this.model.startPdfExportEvent.subscribe(() => {
            this.setRibbon("Preview");
            this.showPdfOption();
        });
    }
    setDefaultTab() {
        let defaultSettingsTab = this.model.settings?.defaultTab;
        let tab = defaultSettingsTab == "Home" || defaultSettingsTab == "Insert" || defaultSettingsTab == "Preview" || defaultSettingsTab == "PDFPreview" ?
            defaultSettingsTab : "Home";
        this.model.ribbon = tab;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: NavbarComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiDraggableService }, { token: StiExportService }, { token: StiRectangleGeometryLayout }, { token: StiThemeService }, { token: StiLocalizationService }, { token: StiToolboxService }, { token: StiHttpClientService }, { token: StiUserService }, { token: StiFormCheckerService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: NavbarComponent, selector: "sti-navbar", viewQueries: [{ propertyName: "saveButton", first: true, predicate: ["saveButton"], descendants: true }], ngImport: i0, template: "<div class=\"navbar\" [style.visibility]=\"model.viewerMode ? 'hidden' : 'visible'\" [style.height.px]=\"componentHeight\">\r\n  <div\r\n    class=\"navigation\"\r\n    [style.border-bottom]=\"\r\n      model.previewMode && !model.viewerMode ? '1px solid rgb(224,224,224)' : '1px solid transparent'\r\n    \"\r\n  >\r\n    <div\r\n      class=\"image-container\"\r\n      *ngIf=\"model.previewMode && model.showEditButton\"\r\n      [style.right.px]=\"editButtonRight\"\r\n      [style.visibility]=\"'visible'\"\r\n      [style.top.px]=\"model.viewerMode ? 5 : 43\"\r\n      [style.min-width.px]=\"model.isMobile() ? 33 : 83\"\r\n      (click)=\"editForm()\"\r\n    >\r\n      <img [style.margin]=\"model.isMobile() ? '0px' : '0px 5px 0px 0px'\" [src]=\"model.getImage('images.Edit.png')\" />\r\n      <span *ngIf=\"!model.isMobile()\">{{ loc.get2(\"MainMenu\", \"menuEditEdit\") }}</span>\r\n    </div>\r\n    <div\r\n      #saveButton\r\n      class=\"image-container\"\r\n      *ngIf=\"(model.viewerMode || model.previewMode) && model.showSaveToPdfButton && !model.fileMenuMode\"\r\n      [style.right.px]=\"15\"\r\n      [style.visibility]=\"'visible'\"\r\n      [style.top.px]=\"model.viewerMode ? 5 : 43\"\r\n      [style.min-width.px]=\"model.isMobile() ? 33 : 83\"\r\n      [stiTooltip]=\"loc.get2('A_WebViewer', 'SaveReport')\"\r\n      tooltipPosition=\"bottom\"\r\n      (click)=\"showPdfOption()\"\r\n    >\r\n      <img\r\n        [style.margin]=\"model.isMobile() ? '0px' : '1px 5px 0px 0px'\"\r\n        [src]=\"\r\n          model.isMobile() ? model.getImage('images.ReportSave.png') : model.getImage('images.Other.DownloadPDF.png')\r\n        \"\r\n      />\r\n      <span *ngIf=\"!model.isMobile()\">{{ loc.get2(\"Buttons\", \"Save\") }}</span>\r\n    </div>\r\n    <div class=\"save-button\" *ngIf=\"model.getBooleanSetting('showSaveButton')\" (click)=\"save()\">\r\n      <img [src]=\"model.getImage('images.Other.Save.png')\" />\r\n    </div>\r\n    <div class=\"file-menu-button\" *ngIf=\"model.getBooleanSetting('showFileButton')\" (click)=\"setRibbon('File')\">\r\n      <span>{{ loc.getP(\"File\") }}</span>\r\n    </div>\r\n    <div class=\"navigation-button\" *ngIf=\"model.getBooleanSetting('showHomeTab')\" (click)=\"setRibbon('Home')\">\r\n      <div class=\"label-container\">\r\n        <div class=\"navigation-label\">\r\n          <span>{{ loc.get2(\"Toolbars\", \"TabHome\") }}</span>\r\n        </div>\r\n      </div>\r\n      <div class=\"current-indicator {{ getClass('Home') }}\"></div>\r\n    </div>\r\n    <div\r\n      class=\"navigation-button\"\r\n      *ngIf=\"model.showInsertTab && model.getBooleanSetting('showInsertTab')\"\r\n      (click)=\"setRibbon('Insert')\"\r\n    >\r\n      <div class=\"label-container\">\r\n        <div class=\"navigation-label\">\r\n          <span>{{ loc.getP(\"Insert\") }}</span>\r\n        </div>\r\n      </div>\r\n      <div class=\"current-indicator {{ getClass('Insert') }}\"></div>\r\n    </div>\r\n    <div class=\"navigation-button\" *ngIf=\"model.getBooleanSetting('showPreviewTab')\" (click)=\"setRibbon('Preview')\">\r\n      <div class=\"label-container\">\r\n        <div class=\"navigation-label\">\r\n          <span>{{ loc.get2(\"FormDesigner\", \"Preview\") }}</span>\r\n        </div>\r\n      </div>\r\n      <div class=\"current-indicator {{ getClass('Preview') }}\"></div>\r\n    </div>\r\n    <div\r\n      class=\"navigation-button\"\r\n      *ngIf=\"model.getBooleanSetting('showPDFPreviewTab')\"\r\n      (click)=\"setRibbon('PDFPreview')\"\r\n    >\r\n      <div class=\"label-container\">\r\n        <div class=\"navigation-label\">\r\n          <span>{{ loc.getP(\"PDFPreview\") }}</span>\r\n        </div>\r\n      </div>\r\n      <div class=\"current-indicator {{ getClass('PDFPreview') }}\"></div>\r\n    </div>\r\n    <div *ngIf=\"(userService.currentUser || model.embeddedMode) && model.userWasChecked\" class=\"user-interface\">\r\n      <div class=\"share button\" (click)=\"setEvent('Share')\">\r\n        <img [src]=\"model.getImage('images.Share.png')\" alt=\"\" />\r\n      </div>\r\n      <div class=\"publish button\" (click)=\"setEvent('Publish')\">\r\n        <span>{{ loc.get2(\"Buttons\", \"Publish\") }}</span>\r\n      </div>\r\n      <div class=\"localization button\" (click)=\"showInfo($event, 'Localization')\" [style.padding]=\"'3px 10px'\">\r\n        <span>{{ loc.currentLocalization ? loc.currentLocalization.cultureName.toUpperCase() : \"EN\" }}</span>\r\n      </div>\r\n      <div\r\n        *ngIf=\"!model.userIsAuthorized && !model.isWebView\"\r\n        class=\"login button\"\r\n        [style.padding]=\"'3px 10px'\"\r\n        (click)=\"setEvent('Login')\"\r\n      >\r\n        <span>{{ loc.get2(\"Cloud\", \"Login\") }}</span>\r\n      </div>\r\n      <div *ngIf=\"!model.userIsAuthorized && !model.isWebView\" class=\"signup button\" (click)=\"setEvent('Signup')\">\r\n        <span>{{ loc.get2(\"Cloud\", \"ButtonSignUp\") }}</span>\r\n      </div>\r\n      <div\r\n        class=\"user-info button\"\r\n        *ngIf=\"model.userIsAuthorized || model.isWebView\"\r\n        (click)=\"showInfo($event, 'User')\"\r\n      >\r\n        <span>{{\r\n          userService.currentUser\r\n            ? (userService.currentUser.firstName ? userService.currentUser.firstName : \"\") +\r\n              \" \" +\r\n              (userService.currentUser.lastName ? userService.currentUser.lastName : \"\")\r\n            : \"My1 Company\"\r\n        }}</span\r\n        ><img\r\n          *ngIf=\"userService?.currentUser?.picture\"\r\n          src=\"data:image/jpeg;base64,{{ userService?.currentUser?.picture }}\"\r\n          alt=\"\"\r\n        />\r\n        <div\r\n          *ngIf=\"!userService?.currentUser?.picture\"\r\n          class=\"custom-image\"\r\n          [style.background-color]=\"userService.getBackground(userService.currentUser)\"\r\n        >\r\n          <span [style.margin-top.px]=\"4\">{{\r\n            userService.currentUser\r\n              ? (userService.currentUser.firstName ? userService.currentUser.firstName[0] : \"\") +\r\n                (userService.currentUser.lastName ? userService.currentUser.lastName[0] : \"\")\r\n              : \"MC\"\r\n          }}</span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <sti-file-ribbon-component *ngIf=\"model.ribbon == 'File'\"></sti-file-ribbon-component>\r\n  <sti-home-ribbon-component *ngIf=\"model.ribbon == 'Home'\"></sti-home-ribbon-component>\r\n  <sti-insert-ribbon-component *ngIf=\"model.ribbon == 'Insert' && model.showInsertTab\"></sti-insert-ribbon-component>\r\n</div>\r\n\r\n<style>\r\n  .save-button img {\r\n    height: 16px;\r\n    width: 16px;\r\n  }\r\n  .save-button {\r\n    height: 30px;\r\n    width: 30px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    margin-left: 3px;\r\n    border-radius: 3px;\r\n  }\r\n  .save-button:hover {\r\n    background-color: rgb(218, 218, 218);\r\n  }\r\n  .label-container {\r\n    padding: 0px 12px;\r\n  }\r\n  .file-menu-button {\r\n    height: 30px;\r\n    margin-left: 3px;\r\n    min-width: 70px;\r\n    background-color: rgb(25, 71, 138);\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    color: white;\r\n    font-size: 12px;\r\n    font-family: Arial;\r\n    padding: 0px 10px;\r\n  }\r\n  .file-menu-button:hover {\r\n    background-color: rgb(61, 98, 152);\r\n  }\r\n  .navigation-button:hover {\r\n    background-color: rgb(218, 218, 218);\r\n  }\r\n  .navigation-button {\r\n    height: 30px;\r\n    min-width: 60px;\r\n    margin-left: 3px;\r\n    display: flex;\r\n    flex-direction: column;\r\n    color: rgb(68, 68, 68);\r\n    font-size: 12px;\r\n    font-family: Arial;\r\n  }\r\n  .navigation-label {\r\n    height: 27px;\r\n    width: 100%;\r\n    padding-top: 2px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    white-space: nowrap;\r\n  }\r\n  .current-indicator {\r\n    height: 3px;\r\n    margin: 0px 10px;\r\n  }\r\n  .navigation-button:hover .current-indicator {\r\n    margin: 0px;\r\n  }\r\n  .image-container {\r\n    position: absolute;\r\n    top: 43px;\r\n    height: 23px;\r\n    min-width: 83px;\r\n    border: 1px solid rgb(218, 218, 218);\r\n    border-radius: 3px;\r\n    display: flex;\r\n    align-items: center;\r\n    padding: 0px 10px;\r\n    justify-content: center;\r\n    background-color: white;\r\n    z-index: 99999999;\r\n  }\r\n  .image-container img {\r\n    height: 16px;\r\n    width: 16px;\r\n    margin: 5px 0px 0px 5px;\r\n  }\r\n  .image-container span {\r\n    font-family: Arial;\r\n    font-size: 12px;\r\n  }\r\n  .image-container:hover {\r\n    background-color: rgb(226, 226, 226);\r\n  }\r\n  .image-container:active {\r\n    background-color: rgb(187, 187, 187);\r\n  }\r\n  .custom-image {\r\n    margin: 0px 5px;\r\n    height: 22px;\r\n    width: 22px;\r\n    font-family: Arial;\r\n    font-size: 12px;\r\n    overflow: hidden;\r\n    border-radius: 40px;\r\n    color: White;\r\n    display: flex;\r\n    justify-content: center;\r\n  }\r\n  .user-info img {\r\n    width: 22px;\r\n    height: 22px;\r\n    margin: 0px 5px;\r\n    border-radius: 40px;\r\n  }\r\n  .button {\r\n    height: 30px;\r\n    min-width: 30px;\r\n    padding: 3px 5px;\r\n    border-radius: 3px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    margin-left: 3px;\r\n  }\r\n  .button:hover {\r\n    background-color: rgb(218, 218, 218);\r\n  }\r\n  .share img {\r\n    height: 16px;\r\n    width: 16px;\r\n  }\r\n  .user-interface {\r\n    display: flex;\r\n    justify-content: flex-end;\r\n    align-items: center;\r\n    height: 30px;\r\n    font-size: 12px;\r\n    font-family: Arial;\r\n    color: #444444;\r\n    flex: 1;\r\n  }\r\n  .signup {\r\n    background-color: #19478a;\r\n    color: #ffffff;\r\n    padding: 0px 17px;\r\n    margin-right: 3px;\r\n  }\r\n  .signup:hover {\r\n    background-color: rgb(61, 98, 152);\r\n  }\r\n  .navbar {\r\n    height: 93px;\r\n    width: 100%;\r\n    display: flex;\r\n    flex-direction: column;\r\n    background-color: var(--back-color);\r\n    color: var(--text-color);\r\n  }\r\n  a span {\r\n    height: 100%;\r\n    padding: 3px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-items: center;\r\n  }\r\n  .navigation {\r\n    position: relative;\r\n    display: flex;\r\n    justify-content: flex-start;\r\n    height: 38px;\r\n    align-items: center;\r\n    background-color: var(--back-color);\r\n    width: 100%;\r\n    padding-top: 1px;\r\n    -webkit-touch-callout: none;\r\n    -webkit-user-select: none;\r\n    font-family: \"Segoe UI\";\r\n  }\r\n\r\n  .navigation a {\r\n    padding: 0px 10px;\r\n    height: 100%;\r\n    text-decoration: none;\r\n    text-align: center;\r\n    font-size: 13px;\r\n    cursor: default;\r\n    margin-right: 5px;\r\n    margin-left: 5px;\r\n  }\r\n  .navigation a:hover {\r\n    padding: 0;\r\n    background-color: var(--hover-color);\r\n  }\r\n  a:hover span {\r\n    padding-left: 13px;\r\n    padding-right: 13px;\r\n    width: 100%;\r\n  }\r\n  .current {\r\n    background-color: rgb(25, 71, 138);\r\n  }\r\n\r\n  .other {\r\n    background-color: transparent;\r\n  }\r\n</style>\r\n", styles: ["\n  .save-button img {\n    height: 16px;\n    width: 16px;\n  }\n  .save-button {\n    height: 30px;\n    width: 30px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin-left: 3px;\n    border-radius: 3px;\n  }\n  .save-button:hover {\n    background-color: rgb(218, 218, 218);\n  }\n  .label-container {\n    padding: 0px 12px;\n  }\n  .file-menu-button {\n    height: 30px;\n    margin-left: 3px;\n    min-width: 70px;\n    background-color: rgb(25, 71, 138);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    color: white;\n    font-size: 12px;\n    font-family: Arial;\n    padding: 0px 10px;\n  }\n  .file-menu-button:hover {\n    background-color: rgb(61, 98, 152);\n  }\n  .navigation-button:hover {\n    background-color: rgb(218, 218, 218);\n  }\n  .navigation-button {\n    height: 30px;\n    min-width: 60px;\n    margin-left: 3px;\n    display: flex;\n    flex-direction: column;\n    color: rgb(68, 68, 68);\n    font-size: 12px;\n    font-family: Arial;\n  }\n  .navigation-label {\n    height: 27px;\n    width: 100%;\n    padding-top: 2px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    white-space: nowrap;\n  }\n  .current-indicator {\n    height: 3px;\n    margin: 0px 10px;\n  }\n  .navigation-button:hover .current-indicator {\n    margin: 0px;\n  }\n  .image-container {\n    position: absolute;\n    top: 43px;\n    height: 23px;\n    min-width: 83px;\n    border: 1px solid rgb(218, 218, 218);\n    border-radius: 3px;\n    display: flex;\n    align-items: center;\n    padding: 0px 10px;\n    justify-content: center;\n    background-color: white;\n    z-index: 99999999;\n  }\n  .image-container img {\n    height: 16px;\n    width: 16px;\n    margin: 5px 0px 0px 5px;\n  }\n  .image-container span {\n    font-family: Arial;\n    font-size: 12px;\n  }\n  .image-container:hover {\n    background-color: rgb(226, 226, 226);\n  }\n  .image-container:active {\n    background-color: rgb(187, 187, 187);\n  }\n  .custom-image {\n    margin: 0px 5px;\n    height: 22px;\n    width: 22px;\n    font-family: Arial;\n    font-size: 12px;\n    overflow: hidden;\n    border-radius: 40px;\n    color: White;\n    display: flex;\n    justify-content: center;\n  }\n  .user-info img {\n    width: 22px;\n    height: 22px;\n    margin: 0px 5px;\n    border-radius: 40px;\n  }\n  .button {\n    height: 30px;\n    min-width: 30px;\n    padding: 3px 5px;\n    border-radius: 3px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin-left: 3px;\n  }\n  .button:hover {\n    background-color: rgb(218, 218, 218);\n  }\n  .share img {\n    height: 16px;\n    width: 16px;\n  }\n  .user-interface {\n    display: flex;\n    justify-content: flex-end;\n    align-items: center;\n    height: 30px;\n    font-size: 12px;\n    font-family: Arial;\n    color: #444444;\n    flex: 1;\n  }\n  .signup {\n    background-color: #19478a;\n    color: #ffffff;\n    padding: 0px 17px;\n    margin-right: 3px;\n  }\n  .signup:hover {\n    background-color: rgb(61, 98, 152);\n  }\n  .navbar {\n    height: 93px;\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    background-color: var(--back-color);\n    color: var(--text-color);\n  }\n  a span {\n    height: 100%;\n    padding: 3px;\n    display: flex;\n    align-items: center;\n    justify-items: center;\n  }\n  .navigation {\n    position: relative;\n    display: flex;\n    justify-content: flex-start;\n    height: 38px;\n    align-items: center;\n    background-color: var(--back-color);\n    width: 100%;\n    padding-top: 1px;\n    -webkit-touch-callout: none;\n    -webkit-user-select: none;\n    font-family: \"Segoe UI\";\n  }\n\n  .navigation a {\n    padding: 0px 10px;\n    height: 100%;\n    text-decoration: none;\n    text-align: center;\n    font-size: 13px;\n    cursor: default;\n    margin-right: 5px;\n    margin-left: 5px;\n  }\n  .navigation a:hover {\n    padding: 0;\n    background-color: var(--hover-color);\n  }\n  a:hover span {\n    padding-left: 13px;\n    padding-right: 13px;\n    width: 100%;\n  }\n  .current {\n    background-color: rgb(25, 71, 138);\n  }\n\n  .other {\n    background-color: transparent;\n  }\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiHomeRibbonComponent, selector: "sti-home-ribbon-component" }, { kind: "component", type: StiFileRibbonComponent, selector: "sti-file-ribbon-component" }, { kind: "component", type: StiInsertRibbonComponent, selector: "sti-insert-ribbon-component" }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: NavbarComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-navbar", template: "<div class=\"navbar\" [style.visibility]=\"model.viewerMode ? 'hidden' : 'visible'\" [style.height.px]=\"componentHeight\">\r\n  <div\r\n    class=\"navigation\"\r\n    [style.border-bottom]=\"\r\n      model.previewMode && !model.viewerMode ? '1px solid rgb(224,224,224)' : '1px solid transparent'\r\n    \"\r\n  >\r\n    <div\r\n      class=\"image-container\"\r\n      *ngIf=\"model.previewMode && model.showEditButton\"\r\n      [style.right.px]=\"editButtonRight\"\r\n      [style.visibility]=\"'visible'\"\r\n      [style.top.px]=\"model.viewerMode ? 5 : 43\"\r\n      [style.min-width.px]=\"model.isMobile() ? 33 : 83\"\r\n      (click)=\"editForm()\"\r\n    >\r\n      <img [style.margin]=\"model.isMobile() ? '0px' : '0px 5px 0px 0px'\" [src]=\"model.getImage('images.Edit.png')\" />\r\n      <span *ngIf=\"!model.isMobile()\">{{ loc.get2(\"MainMenu\", \"menuEditEdit\") }}</span>\r\n    </div>\r\n    <div\r\n      #saveButton\r\n      class=\"image-container\"\r\n      *ngIf=\"(model.viewerMode || model.previewMode) && model.showSaveToPdfButton && !model.fileMenuMode\"\r\n      [style.right.px]=\"15\"\r\n      [style.visibility]=\"'visible'\"\r\n      [style.top.px]=\"model.viewerMode ? 5 : 43\"\r\n      [style.min-width.px]=\"model.isMobile() ? 33 : 83\"\r\n      [stiTooltip]=\"loc.get2('A_WebViewer', 'SaveReport')\"\r\n      tooltipPosition=\"bottom\"\r\n      (click)=\"showPdfOption()\"\r\n    >\r\n      <img\r\n        [style.margin]=\"model.isMobile() ? '0px' : '1px 5px 0px 0px'\"\r\n        [src]=\"\r\n          model.isMobile() ? model.getImage('images.ReportSave.png') : model.getImage('images.Other.DownloadPDF.png')\r\n        \"\r\n      />\r\n      <span *ngIf=\"!model.isMobile()\">{{ loc.get2(\"Buttons\", \"Save\") }}</span>\r\n    </div>\r\n    <div class=\"save-button\" *ngIf=\"model.getBooleanSetting('showSaveButton')\" (click)=\"save()\">\r\n      <img [src]=\"model.getImage('images.Other.Save.png')\" />\r\n    </div>\r\n    <div class=\"file-menu-button\" *ngIf=\"model.getBooleanSetting('showFileButton')\" (click)=\"setRibbon('File')\">\r\n      <span>{{ loc.getP(\"File\") }}</span>\r\n    </div>\r\n    <div class=\"navigation-button\" *ngIf=\"model.getBooleanSetting('showHomeTab')\" (click)=\"setRibbon('Home')\">\r\n      <div class=\"label-container\">\r\n        <div class=\"navigation-label\">\r\n          <span>{{ loc.get2(\"Toolbars\", \"TabHome\") }}</span>\r\n        </div>\r\n      </div>\r\n      <div class=\"current-indicator {{ getClass('Home') }}\"></div>\r\n    </div>\r\n    <div\r\n      class=\"navigation-button\"\r\n      *ngIf=\"model.showInsertTab && model.getBooleanSetting('showInsertTab')\"\r\n      (click)=\"setRibbon('Insert')\"\r\n    >\r\n      <div class=\"label-container\">\r\n        <div class=\"navigation-label\">\r\n          <span>{{ loc.getP(\"Insert\") }}</span>\r\n        </div>\r\n      </div>\r\n      <div class=\"current-indicator {{ getClass('Insert') }}\"></div>\r\n    </div>\r\n    <div class=\"navigation-button\" *ngIf=\"model.getBooleanSetting('showPreviewTab')\" (click)=\"setRibbon('Preview')\">\r\n      <div class=\"label-container\">\r\n        <div class=\"navigation-label\">\r\n          <span>{{ loc.get2(\"FormDesigner\", \"Preview\") }}</span>\r\n        </div>\r\n      </div>\r\n      <div class=\"current-indicator {{ getClass('Preview') }}\"></div>\r\n    </div>\r\n    <div\r\n      class=\"navigation-button\"\r\n      *ngIf=\"model.getBooleanSetting('showPDFPreviewTab')\"\r\n      (click)=\"setRibbon('PDFPreview')\"\r\n    >\r\n      <div class=\"label-container\">\r\n        <div class=\"navigation-label\">\r\n          <span>{{ loc.getP(\"PDFPreview\") }}</span>\r\n        </div>\r\n      </div>\r\n      <div class=\"current-indicator {{ getClass('PDFPreview') }}\"></div>\r\n    </div>\r\n    <div *ngIf=\"(userService.currentUser || model.embeddedMode) && model.userWasChecked\" class=\"user-interface\">\r\n      <div class=\"share button\" (click)=\"setEvent('Share')\">\r\n        <img [src]=\"model.getImage('images.Share.png')\" alt=\"\" />\r\n      </div>\r\n      <div class=\"publish button\" (click)=\"setEvent('Publish')\">\r\n        <span>{{ loc.get2(\"Buttons\", \"Publish\") }}</span>\r\n      </div>\r\n      <div class=\"localization button\" (click)=\"showInfo($event, 'Localization')\" [style.padding]=\"'3px 10px'\">\r\n        <span>{{ loc.currentLocalization ? loc.currentLocalization.cultureName.toUpperCase() : \"EN\" }}</span>\r\n      </div>\r\n      <div\r\n        *ngIf=\"!model.userIsAuthorized && !model.isWebView\"\r\n        class=\"login button\"\r\n        [style.padding]=\"'3px 10px'\"\r\n        (click)=\"setEvent('Login')\"\r\n      >\r\n        <span>{{ loc.get2(\"Cloud\", \"Login\") }}</span>\r\n      </div>\r\n      <div *ngIf=\"!model.userIsAuthorized && !model.isWebView\" class=\"signup button\" (click)=\"setEvent('Signup')\">\r\n        <span>{{ loc.get2(\"Cloud\", \"ButtonSignUp\") }}</span>\r\n      </div>\r\n      <div\r\n        class=\"user-info button\"\r\n        *ngIf=\"model.userIsAuthorized || model.isWebView\"\r\n        (click)=\"showInfo($event, 'User')\"\r\n      >\r\n        <span>{{\r\n          userService.currentUser\r\n            ? (userService.currentUser.firstName ? userService.currentUser.firstName : \"\") +\r\n              \" \" +\r\n              (userService.currentUser.lastName ? userService.currentUser.lastName : \"\")\r\n            : \"My1 Company\"\r\n        }}</span\r\n        ><img\r\n          *ngIf=\"userService?.currentUser?.picture\"\r\n          src=\"data:image/jpeg;base64,{{ userService?.currentUser?.picture }}\"\r\n          alt=\"\"\r\n        />\r\n        <div\r\n          *ngIf=\"!userService?.currentUser?.picture\"\r\n          class=\"custom-image\"\r\n          [style.background-color]=\"userService.getBackground(userService.currentUser)\"\r\n        >\r\n          <span [style.margin-top.px]=\"4\">{{\r\n            userService.currentUser\r\n              ? (userService.currentUser.firstName ? userService.currentUser.firstName[0] : \"\") +\r\n                (userService.currentUser.lastName ? userService.currentUser.lastName[0] : \"\")\r\n              : \"MC\"\r\n          }}</span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <sti-file-ribbon-component *ngIf=\"model.ribbon == 'File'\"></sti-file-ribbon-component>\r\n  <sti-home-ribbon-component *ngIf=\"model.ribbon == 'Home'\"></sti-home-ribbon-component>\r\n  <sti-insert-ribbon-component *ngIf=\"model.ribbon == 'Insert' && model.showInsertTab\"></sti-insert-ribbon-component>\r\n</div>\r\n\r\n<style>\r\n  .save-button img {\r\n    height: 16px;\r\n    width: 16px;\r\n  }\r\n  .save-button {\r\n    height: 30px;\r\n    width: 30px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    margin-left: 3px;\r\n    border-radius: 3px;\r\n  }\r\n  .save-button:hover {\r\n    background-color: rgb(218, 218, 218);\r\n  }\r\n  .label-container {\r\n    padding: 0px 12px;\r\n  }\r\n  .file-menu-button {\r\n    height: 30px;\r\n    margin-left: 3px;\r\n    min-width: 70px;\r\n    background-color: rgb(25, 71, 138);\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    color: white;\r\n    font-size: 12px;\r\n    font-family: Arial;\r\n    padding: 0px 10px;\r\n  }\r\n  .file-menu-button:hover {\r\n    background-color: rgb(61, 98, 152);\r\n  }\r\n  .navigation-button:hover {\r\n    background-color: rgb(218, 218, 218);\r\n  }\r\n  .navigation-button {\r\n    height: 30px;\r\n    min-width: 60px;\r\n    margin-left: 3px;\r\n    display: flex;\r\n    flex-direction: column;\r\n    color: rgb(68, 68, 68);\r\n    font-size: 12px;\r\n    font-family: Arial;\r\n  }\r\n  .navigation-label {\r\n    height: 27px;\r\n    width: 100%;\r\n    padding-top: 2px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    white-space: nowrap;\r\n  }\r\n  .current-indicator {\r\n    height: 3px;\r\n    margin: 0px 10px;\r\n  }\r\n  .navigation-button:hover .current-indicator {\r\n    margin: 0px;\r\n  }\r\n  .image-container {\r\n    position: absolute;\r\n    top: 43px;\r\n    height: 23px;\r\n    min-width: 83px;\r\n    border: 1px solid rgb(218, 218, 218);\r\n    border-radius: 3px;\r\n    display: flex;\r\n    align-items: center;\r\n    padding: 0px 10px;\r\n    justify-content: center;\r\n    background-color: white;\r\n    z-index: 99999999;\r\n  }\r\n  .image-container img {\r\n    height: 16px;\r\n    width: 16px;\r\n    margin: 5px 0px 0px 5px;\r\n  }\r\n  .image-container span {\r\n    font-family: Arial;\r\n    font-size: 12px;\r\n  }\r\n  .image-container:hover {\r\n    background-color: rgb(226, 226, 226);\r\n  }\r\n  .image-container:active {\r\n    background-color: rgb(187, 187, 187);\r\n  }\r\n  .custom-image {\r\n    margin: 0px 5px;\r\n    height: 22px;\r\n    width: 22px;\r\n    font-family: Arial;\r\n    font-size: 12px;\r\n    overflow: hidden;\r\n    border-radius: 40px;\r\n    color: White;\r\n    display: flex;\r\n    justify-content: center;\r\n  }\r\n  .user-info img {\r\n    width: 22px;\r\n    height: 22px;\r\n    margin: 0px 5px;\r\n    border-radius: 40px;\r\n  }\r\n  .button {\r\n    height: 30px;\r\n    min-width: 30px;\r\n    padding: 3px 5px;\r\n    border-radius: 3px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    margin-left: 3px;\r\n  }\r\n  .button:hover {\r\n    background-color: rgb(218, 218, 218);\r\n  }\r\n  .share img {\r\n    height: 16px;\r\n    width: 16px;\r\n  }\r\n  .user-interface {\r\n    display: flex;\r\n    justify-content: flex-end;\r\n    align-items: center;\r\n    height: 30px;\r\n    font-size: 12px;\r\n    font-family: Arial;\r\n    color: #444444;\r\n    flex: 1;\r\n  }\r\n  .signup {\r\n    background-color: #19478a;\r\n    color: #ffffff;\r\n    padding: 0px 17px;\r\n    margin-right: 3px;\r\n  }\r\n  .signup:hover {\r\n    background-color: rgb(61, 98, 152);\r\n  }\r\n  .navbar {\r\n    height: 93px;\r\n    width: 100%;\r\n    display: flex;\r\n    flex-direction: column;\r\n    background-color: var(--back-color);\r\n    color: var(--text-color);\r\n  }\r\n  a span {\r\n    height: 100%;\r\n    padding: 3px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-items: center;\r\n  }\r\n  .navigation {\r\n    position: relative;\r\n    display: flex;\r\n    justify-content: flex-start;\r\n    height: 38px;\r\n    align-items: center;\r\n    background-color: var(--back-color);\r\n    width: 100%;\r\n    padding-top: 1px;\r\n    -webkit-touch-callout: none;\r\n    -webkit-user-select: none;\r\n    font-family: \"Segoe UI\";\r\n  }\r\n\r\n  .navigation a {\r\n    padding: 0px 10px;\r\n    height: 100%;\r\n    text-decoration: none;\r\n    text-align: center;\r\n    font-size: 13px;\r\n    cursor: default;\r\n    margin-right: 5px;\r\n    margin-left: 5px;\r\n  }\r\n  .navigation a:hover {\r\n    padding: 0;\r\n    background-color: var(--hover-color);\r\n  }\r\n  a:hover span {\r\n    padding-left: 13px;\r\n    padding-right: 13px;\r\n    width: 100%;\r\n  }\r\n  .current {\r\n    background-color: rgb(25, 71, 138);\r\n  }\r\n\r\n  .other {\r\n    background-color: transparent;\r\n  }\r\n</style>\r\n" }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiDraggableService }, { type: StiExportService }, { type: StiRectangleGeometryLayout }, { type: StiThemeService }, { type: StiLocalizationService }, { type: StiToolboxService }, { type: StiHttpClientService }, { type: StiUserService }, { type: StiFormCheckerService }], propDecorators: { saveButton: [{
                type: ViewChild,
                args: ["saveButton"]
            }] } });

class StiPageGridOverlayComponent {
    constructor(componentResizerService, model) {
        this.componentResizerService = componentResizerService;
        this.model = model;
    }
    get paddingLeft() {
        return this.model.lastUsedPage?.padding.left;
    }
    get paddingRight() {
        return this.model.lastUsedPage?.padding.right;
    }
    get paddingTop() {
        return this.model.lastUsedPage?.padding.top;
    }
    get paddingBottom() {
        return this.model.lastUsedPage?.padding.bottom;
    }
    get columns() {
        return new Array(Number(this.model.form.settings.gridColumns)).fill(3);
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPageGridOverlayComponent, deps: [{ token: StiComponentResizerService }, { token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiPageGridOverlayComponent, selector: "sti-page-grid-overlay", ngImport: i0, template: `
    <div
      class="grid-overlay"
      [style.opacity]="componentResizerService.isResizing || this.model.pageWithGrid ? 0.5 : 0"
      [style.padding-left.px]="this.paddingLeft"
      [style.padding-right.px]="this.paddingRight"
      [style.padding-top.px]="this.paddingTop"
      [style.padding-bottom.px]="this.paddingBottom"
    >
      <div class="column {{ i == columns.length - 1 ? 'last' : '' }}" *ngFor="let column of columns; index as i"></div>
    </div>

    <style>
      .grid-overlay {
        position: absolute;
        pointer-events: none;
        width: 100%;
        height: 100%;
        top: 0px;
        left: 0px;
        display: flex;
        opacity: 0;
        padding: 10px;
        transition: opacity 0.3s ease 0s;
        z-index: 1;
      }

      .column {
        width: 100%;
        margin: 0px;
        position: relative;
      }

      .column::before {
        content: "";
        position: absolute;
        left: 0px;
        top: 0px;
        width: 1px;
        height: 100%;
        background-color: rgb(234, 234, 234);
      }

      .column.last::after {
        content: "";
        position: absolute;
        right: 0px;
        top: 0px;
        width: 1px;
        height: 100%;
        background-color: rgb(234, 234, 234);
      }
    </style>
  `, isInline: true, styles: ["\n      .grid-overlay {\n        position: absolute;\n        pointer-events: none;\n        width: 100%;\n        height: 100%;\n        top: 0px;\n        left: 0px;\n        display: flex;\n        opacity: 0;\n        padding: 10px;\n        transition: opacity 0.3s ease 0s;\n        z-index: 1;\n      }\n\n      .column {\n        width: 100%;\n        margin: 0px;\n        position: relative;\n      }\n\n      .column::before {\n        content: \"\";\n        position: absolute;\n        left: 0px;\n        top: 0px;\n        width: 1px;\n        height: 100%;\n        background-color: rgb(234, 234, 234);\n      }\n\n      .column.last::after {\n        content: \"\";\n        position: absolute;\n        right: 0px;\n        top: 0px;\n        width: 1px;\n        height: 100%;\n        background-color: rgb(234, 234, 234);\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPageGridOverlayComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-page-grid-overlay",
                    template: `
    <div
      class="grid-overlay"
      [style.opacity]="componentResizerService.isResizing || this.model.pageWithGrid ? 0.5 : 0"
      [style.padding-left.px]="this.paddingLeft"
      [style.padding-right.px]="this.paddingRight"
      [style.padding-top.px]="this.paddingTop"
      [style.padding-bottom.px]="this.paddingBottom"
    >
      <div class="column {{ i == columns.length - 1 ? 'last' : '' }}" *ngFor="let column of columns; index as i"></div>
    </div>

    <style>
      .grid-overlay {
        position: absolute;
        pointer-events: none;
        width: 100%;
        height: 100%;
        top: 0px;
        left: 0px;
        display: flex;
        opacity: 0;
        padding: 10px;
        transition: opacity 0.3s ease 0s;
        z-index: 1;
      }

      .column {
        width: 100%;
        margin: 0px;
        position: relative;
      }

      .column::before {
        content: "";
        position: absolute;
        left: 0px;
        top: 0px;
        width: 1px;
        height: 100%;
        background-color: rgb(234, 234, 234);
      }

      .column.last::after {
        content: "";
        position: absolute;
        right: 0px;
        top: 0px;
        width: 1px;
        height: 100%;
        background-color: rgb(234, 234, 234);
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiComponentResizerService }, { type: StiModelService }] });

class StiPageNavigationComponent {
    constructor(model, formEvents, helper, loc) {
        this.model = model;
        this.formEvents = formEvents;
        this.helper = helper;
        this.loc = loc;
    }
    getTranslate() {
        return `translate(${1 - this.model.zoom > 0 ? Math.abs(1 - this.model.zoom) * 25 : -(Math.abs(1 - this.model.zoom) * 25)}px, ${1 - this.model.zoom > 0 ? Math.abs(1 - this.model.zoom) * 120 : -(Math.abs(1 - this.model.zoom) * 120)}px)`;
    }
    setProperties(newPage, currentPage) {
        newPage.paperKind = currentPage.paperKind;
        newPage.padding = currentPage.padding;
        newPage.backgroundColor = currentPage.backgroundColor;
        newPage.visible = currentPage.visible;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPageNavigationComponent, deps: [{ token: StiModelService }, { token: FormEventsService }, { token: StiHelperService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiPageNavigationComponent, selector: "sti-page-navigation", inputs: { currentPage: "currentPage" }, ngImport: i0, template: `
    <div class="page-navigation" [style.scale]="1 / model.zoom" [style.transform]="getTranslate()">
      <div
        class="button-navigation {{ !formEvents.canMoveUp ? 'disabled' : '' }}"
        [stiTooltip]="loc.get2('QueryBuilder', 'MoveUp')"
        tooltipPosition="bottom"
        showDelay="500"
        (click)="formEvents.moveUp()"
      >
        <img
          [style.filter]="!formEvents.canMoveUp ? 'grayscale(1)' : ''"
          [src]="model.getImage('images.Page.MovePageUp.png')"
        />
      </div>
      <div
        class="button-navigation {{ !formEvents.canMoveDown ? 'disabled' : '' }}"
        [stiTooltip]="loc.get2('QueryBuilder', 'MoveDown')"
        tooltipPosition="bottom"
        showDelay="500"
        (click)="formEvents.moveDown()"
      >
        <img
          [style.filter]="!formEvents.canMoveDown ? 'grayscale(1)' : ''"
          [src]="model.getImage('images.Page.MovePageDown.png')"
        />
      </div>
      <div
        class="button-navigation"
        [stiTooltip]="loc.get2('TableRibbon', 'InsertAbove')"
        tooltipPosition="bottom"
        showDelay="500"
        (click)="formEvents.insertBefore()"
      >
        <img [src]="model.getImage('images.Page.InsertPageBefore.png')" />
      </div>
      <div
        class="button-navigation"
        [stiTooltip]="loc.get2('TableRibbon', 'InsertBelow')"
        tooltipPosition="bottom"
        showDelay="500"
        (click)="formEvents.insertAfter()"
      >
        <img [src]="model.getImage('images.Page.InsertPageAfter.png')" />
      </div>
      <div
        class="button-navigation {{ !formEvents.canClear ? 'disabled' : '' }}"
        [stiTooltip]="loc.get2('MainMenu', 'menuEditClearContents')"
        tooltipPosition="bottom"
        showDelay="500"
        (click)="formEvents.clear()"
      >
        <img
          [style.filter]="!formEvents.canClear ? 'grayscale(1)' : ''"
          [src]="model.getImage('images.Page.ClearContent.png')"
        />
      </div>
      <div
        class="button-navigation {{ !formEvents.canDelete ? 'disabled' : '' }}"
        [stiTooltip]="loc.get2('FormViewer', 'PageDelete')"
        tooltipPosition="bottom"
        showDelay="500"
        [style.border-bottom]="'1px solid var(--pageNavBorder-color)'"
        (click)="formEvents.delete(); $event.stopPropagation()"
      >
        <img
          [style.filter]="!formEvents.canDelete ? 'grayscale(1)' : ''"
          [src]="model.getImage('images.Page.DeletePage.png')"
        />
      </div>
    </div>

    <style>
      .page-navigation {
        display: flex;
        flex-direction: column;
      }
      .button-navigation {
        background-color: var(--pageNavBackground-color);
        border-top: 1px solid var(--pageNavBorder-color);
        border-left: 1px solid var(--pageNavBorder-color);
        border-right: 1px solid var(--pageNavBorder-color);
        width: 40px;
        height: 40px;
        margin: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        user-select: none;
      }
      .button-navigation img {
        height: 16px;
        width: 16px;
      }
      .button-navigation:hover {
        background-color: var(--hover-color);
      }
      .disabled {
        background-color: var(--pageNavDisable-color);
        pointer-events: none;
      }
      .disabled:hover {
        background-color: var(--pageNavDisable-color);
      }
    </style>
  `, isInline: true, styles: ["\n      .page-navigation {\n        display: flex;\n        flex-direction: column;\n      }\n      .button-navigation {\n        background-color: var(--pageNavBackground-color);\n        border-top: 1px solid var(--pageNavBorder-color);\n        border-left: 1px solid var(--pageNavBorder-color);\n        border-right: 1px solid var(--pageNavBorder-color);\n        width: 40px;\n        height: 40px;\n        margin: 0;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        user-select: none;\n      }\n      .button-navigation img {\n        height: 16px;\n        width: 16px;\n      }\n      .button-navigation:hover {\n        background-color: var(--hover-color);\n      }\n      .disabled {\n        background-color: var(--pageNavDisable-color);\n        pointer-events: none;\n      }\n      .disabled:hover {\n        background-color: var(--pageNavDisable-color);\n      }\n    "], dependencies: [{ kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPageNavigationComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-page-navigation",
                    template: `
    <div class="page-navigation" [style.scale]="1 / model.zoom" [style.transform]="getTranslate()">
      <div
        class="button-navigation {{ !formEvents.canMoveUp ? 'disabled' : '' }}"
        [stiTooltip]="loc.get2('QueryBuilder', 'MoveUp')"
        tooltipPosition="bottom"
        showDelay="500"
        (click)="formEvents.moveUp()"
      >
        <img
          [style.filter]="!formEvents.canMoveUp ? 'grayscale(1)' : ''"
          [src]="model.getImage('images.Page.MovePageUp.png')"
        />
      </div>
      <div
        class="button-navigation {{ !formEvents.canMoveDown ? 'disabled' : '' }}"
        [stiTooltip]="loc.get2('QueryBuilder', 'MoveDown')"
        tooltipPosition="bottom"
        showDelay="500"
        (click)="formEvents.moveDown()"
      >
        <img
          [style.filter]="!formEvents.canMoveDown ? 'grayscale(1)' : ''"
          [src]="model.getImage('images.Page.MovePageDown.png')"
        />
      </div>
      <div
        class="button-navigation"
        [stiTooltip]="loc.get2('TableRibbon', 'InsertAbove')"
        tooltipPosition="bottom"
        showDelay="500"
        (click)="formEvents.insertBefore()"
      >
        <img [src]="model.getImage('images.Page.InsertPageBefore.png')" />
      </div>
      <div
        class="button-navigation"
        [stiTooltip]="loc.get2('TableRibbon', 'InsertBelow')"
        tooltipPosition="bottom"
        showDelay="500"
        (click)="formEvents.insertAfter()"
      >
        <img [src]="model.getImage('images.Page.InsertPageAfter.png')" />
      </div>
      <div
        class="button-navigation {{ !formEvents.canClear ? 'disabled' : '' }}"
        [stiTooltip]="loc.get2('MainMenu', 'menuEditClearContents')"
        tooltipPosition="bottom"
        showDelay="500"
        (click)="formEvents.clear()"
      >
        <img
          [style.filter]="!formEvents.canClear ? 'grayscale(1)' : ''"
          [src]="model.getImage('images.Page.ClearContent.png')"
        />
      </div>
      <div
        class="button-navigation {{ !formEvents.canDelete ? 'disabled' : '' }}"
        [stiTooltip]="loc.get2('FormViewer', 'PageDelete')"
        tooltipPosition="bottom"
        showDelay="500"
        [style.border-bottom]="'1px solid var(--pageNavBorder-color)'"
        (click)="formEvents.delete(); $event.stopPropagation()"
      >
        <img
          [style.filter]="!formEvents.canDelete ? 'grayscale(1)' : ''"
          [src]="model.getImage('images.Page.DeletePage.png')"
        />
      </div>
    </div>

    <style>
      .page-navigation {
        display: flex;
        flex-direction: column;
      }
      .button-navigation {
        background-color: var(--pageNavBackground-color);
        border-top: 1px solid var(--pageNavBorder-color);
        border-left: 1px solid var(--pageNavBorder-color);
        border-right: 1px solid var(--pageNavBorder-color);
        width: 40px;
        height: 40px;
        margin: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        user-select: none;
      }
      .button-navigation img {
        height: 16px;
        width: 16px;
      }
      .button-navigation:hover {
        background-color: var(--hover-color);
      }
      .disabled {
        background-color: var(--pageNavDisable-color);
        pointer-events: none;
      }
      .disabled:hover {
        background-color: var(--pageNavDisable-color);
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: FormEventsService }, { type: StiHelperService }, { type: StiLocalizationService }], propDecorators: { currentPage: [{
                type: Input
            }] } });

class PageComponent {
    get width() {
        return this.page.width + this.BORDER_WIDTH;
    }
    get height() {
        return this.page.height + this.BORDER_WIDTH;
    }
    get id() {
        return this.page.guid;
    }
    get elements() {
        return this.page.elements;
    }
    get className() {
        return ("page " +
            (this.model.selectedPage == this.page && !this.model.previewMode ? "active" : "") +
            " " +
            StiModelService.PAGE_CLASS +
            (this.componentResizerService.isResizing ? " disable-text-selection" : ""));
    }
    get backgroundImage() {
        return this.page.backgroundImage ? "url(" + this.page.backgroundImage + ")" : null;
    }
    onContainerMouseDown(event) {
        if (event.target === this.pageContainerEl.nativeElement) {
            this.model.selectedComponent = null;
        }
    }
    onMouseDown(event) {
        this.model.selectedPage = this.page;
        this.editableContent.editableContent = null;
    }
    getPageIndex() {
        return this.model.form.pages.indexOf(this.page);
    }
    get zoom() {
        return this.model.zoom;
    }
    getLeftMargin() {
        let workspace = document.getElementsByTagName("sti-workspace")[0];
        if (!this.isInitialized) {
            return 0;
        }
        if (!this.previewModeIsInitialized && this.model.previewMode) {
            return 0;
        }
        let pageContainerWidth = this.page.width + (this.model.previewMode ? 0 : this.PANEL_NAVIGATION_WIDTH + this.INNER_MARGIN);
        let freeHorizontalSpace = workspace.clientWidth -
            (workspace.clientHeight < workspace.scrollHeight || this.model.previewMode
                ? 0
                : this.model.zoom < 0.5 && this.model.zoom > 0.3
                    ? window.devicePixelRatio == 1.25
                        ? 8
                        : 10
                    : 10) -
            40 -
            pageContainerWidth * this.zoom;
        let leftMargin = Math.round(freeHorizontalSpace / 2);
        return freeHorizontalSpace > 0 ? Number((leftMargin / this.zoom).toFixed(2)) : 0;
    }
    constructor(model, loc, componentResizerService, editableContent) {
        this.model = model;
        this.loc = loc;
        this.componentResizerService = componentResizerService;
        this.editableContent = editableContent;
        this.BORDER_WIDTH = 2;
        this.isInitialized = false;
        this.PANEL_NAVIGATION_WIDTH = 40;
        this.INNER_MARGIN = 10;
        this.previewModeIsInitialized = false;
    }
    ngOnDestroy() {
        this.previewModeChangesObserver?.unsubscribe();
    }
    ngDoCheck() {
        if (this.pageEl && this.page.element != this.pageEl) {
            this.page.element = this.pageEl;
        }
    }
    ngAfterViewInit() {
        this.page.element = this.pageEl;
        setTimeout(() => {
            this.isInitialized = true;
        });
    }
    ngOnInit() {
        if (this.model.previewMode && !this.previewModeIsInitialized) {
            this.previewModeIsInitialized = true;
        }
        this.previewModeChangesObserver = this.model.interfaceEvent.subscribe((event) => {
            if (event.name == "setRibbon" && event.data?.ribbon === "Preview") {
                setTimeout(() => {
                    this.previewModeIsInitialized = true;
                });
            }
            else if (event.name == "setRibbon" && event.data?.oldRibbon === "Preview") {
                this.previewModeIsInitialized = false;
            }
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PageComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }, { token: StiComponentResizerService }, { token: StiEditableContentService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: PageComponent, selector: "app-page", inputs: { page: "page" }, viewQueries: [{ propertyName: "pageEl", first: true, predicate: ["element"], descendants: true }, { propertyName: "pageContainerEl", first: true, predicate: ["pageContainerEl"], descendants: true }], ngImport: i0, template: "<div\r\n  #pageContainerEl\r\n  class=\"page-container\"\r\n  *ngIf=\"((!page.visible || page.visible) && !model.previewMode) || (page.visible && model.previewMode)\"\r\n  [style.width.px]=\"width + (model.viewerMode || model.previewMode ? 0 : 51)\"\r\n  [style.margin-left.px]=\"getLeftMargin()\"\r\n  (mousedown)=\"onContainerMouseDown($event)\"\r\n  [style.opacity]=\"isInitialized ? 1 : 0\"\r\n>\r\n  <div\r\n    #element\r\n    class=\"page\"\r\n    id=\"Page\"\r\n    [id]=\"id\"\r\n    [style.padding-left.px]=\"page?.padding.left\"\r\n    [style.padding-right.px]=\"page?.padding.right\"\r\n    [style.padding-top.px]=\"page?.padding.top\"\r\n    [style.padding-bottom.px]=\"page?.padding.bottom\"\r\n    [style.background-color]=\"page.backgroundColor.toHtmlColor()\"\r\n    [style.overflow]=\"'hidden'\"\r\n    [style.width.px]=\"width\"\r\n    [style.height.px]=\"height\"\r\n    [class]=\"className\"\r\n    [style.background-image]=\"backgroundImage\"\r\n    [style.background-position]=\"'center'\"\r\n    [style.background-size]=\"'cover'\"\r\n    [style.background-repeat]=\"'no-repeat'\"\r\n    [style.margin-top.px]=\"getPageIndex() == 0 ? 0 : 10\"\r\n    (mousedown)=\"onMouseDown($event)\"\r\n  >\r\n    <div *ngFor=\"let element of elements\">\r\n      <sti-component-holder [element]=\"element\"></sti-component-holder>\r\n    </div>\r\n    <sti-page-grid-overlay\r\n      *ngIf=\"model.pageWithGrid == page || (model.lastUsedPage == page && componentResizerService.isResizing)\"\r\n    ></sti-page-grid-overlay>\r\n    <div class=\"trial-title\" [style.zIndex]=\"model.previewMode ? 99999 : 0\" *ngIf=\"model.showTrialTitle\">\r\n      <span>{{ loc.getP(\"Trial\") }}</span>\r\n    </div>\r\n    <div\r\n      class=\"inline-border\"\r\n      *ngIf=\"!model.viewerMode && !model.previewMode\"\r\n      [style.left.px]=\"page.padding.left\"\r\n      [style.top.px]=\"page.padding.top\"\r\n      [style.width.px]=\"page.contentAreaWidth\"\r\n      [style.height.px]=\"page.contentAreaHeight\"\r\n    ></div>\r\n    <i *ngIf=\"!page?.visible\" class=\"pi pi-eye-slash\" style=\"opacity: 0.3\"></i>\r\n  </div>\r\n  <sti-page-navigation\r\n    *ngIf=\"page === model.selectedPage && !model.previewMode\"\r\n    [currentPage]=\"page\"\r\n    [style.visibility]=\"model.previewMode ? 'hidden' : ''\"\r\n    [style.height]=\"'100%'\"\r\n    [style.margin-top.px]=\"getPageIndex() == 0 ? 0 : 10\"\r\n  ></sti-page-navigation>\r\n</div>\r\n<style>\r\n  .page-container {\r\n    position: relative;\r\n    display: flex;\r\n  }\r\n  .page {\r\n    position: relative;\r\n    display: block;\r\n    background: white;\r\n    font-size: 2.5rem;\r\n    color: black;\r\n    border: 1px solid #c6c6c6;\r\n    margin-right: 10px;\r\n    margin-top: 10px;\r\n    margin-bottom: 10px;\r\n  }\r\n  .inline-border {\r\n    position: absolute;\r\n    pointer-events: none;\r\n    border: 1px solid rgb(234, 234, 234);\r\n    opacity: 0.5;\r\n  }\r\n  .trial-title {\r\n    position: absolute;\r\n    pointer-events: none;\r\n    user-select: none;\r\n    opacity: 0.3;\r\n    font-family: \"Segoe UI\";\r\n    font-weight: bold;\r\n    font-size: 100pt;\r\n    left: calc(50% - 135px);\r\n    top: calc(50% - 88px);\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n  }\r\n  .trial-title span {\r\n    transform: rotate(-45deg);\r\n  }\r\n  .hovered {\r\n    border-color: rgb(73, 108, 159);\r\n  }\r\n\r\n  .active {\r\n    border-color: rgb(146, 146, 146);\r\n  }\r\n  i {\r\n    position: absolute;\r\n    right: 5px;\r\n    top: 5px;\r\n  }\r\n\r\n  .disable-text-selection {\r\n    -webkit-touch-callout: none;\r\n    -khtml-user-select: none;\r\n    -moz-user-select: none;\r\n    -ms-user-select: none;\r\n    -webkit-touch-callout: none;\r\n    -webkit-user-select: none;\r\n  }\r\n</style>\r\n", styles: ["\n  .page-container {\n    position: relative;\n    display: flex;\n  }\n  .page {\n    position: relative;\n    display: block;\n    background: white;\n    font-size: 2.5rem;\n    color: black;\n    border: 1px solid #c6c6c6;\n    margin-right: 10px;\n    margin-top: 10px;\n    margin-bottom: 10px;\n  }\n  .inline-border {\n    position: absolute;\n    pointer-events: none;\n    border: 1px solid rgb(234, 234, 234);\n    opacity: 0.5;\n  }\n  .trial-title {\n    position: absolute;\n    pointer-events: none;\n    user-select: none;\n    opacity: 0.3;\n    font-family: \"Segoe UI\";\n    font-weight: bold;\n    font-size: 100pt;\n    left: calc(50% - 135px);\n    top: calc(50% - 88px);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  .trial-title span {\n    transform: rotate(-45deg);\n  }\n  .hovered {\n    border-color: rgb(73, 108, 159);\n  }\n\n  .active {\n    border-color: rgb(146, 146, 146);\n  }\n  i {\n    position: absolute;\n    right: 5px;\n    top: 5px;\n  }\n\n  .disable-text-selection {\n    -webkit-touch-callout: none;\n    -khtml-user-select: none;\n    -moz-user-select: none;\n    -ms-user-select: none;\n    -webkit-touch-callout: none;\n    -webkit-user-select: none;\n  }\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiPageGridOverlayComponent, selector: "sti-page-grid-overlay" }, { kind: "component", type: StiPageNavigationComponent, selector: "sti-page-navigation", inputs: ["currentPage"] }, { kind: "component", type: StiComponentHolderComponent, selector: "sti-component-holder", inputs: ["element", "isClone"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PageComponent, decorators: [{
            type: Component,
            args: [{ selector: "app-page", template: "<div\r\n  #pageContainerEl\r\n  class=\"page-container\"\r\n  *ngIf=\"((!page.visible || page.visible) && !model.previewMode) || (page.visible && model.previewMode)\"\r\n  [style.width.px]=\"width + (model.viewerMode || model.previewMode ? 0 : 51)\"\r\n  [style.margin-left.px]=\"getLeftMargin()\"\r\n  (mousedown)=\"onContainerMouseDown($event)\"\r\n  [style.opacity]=\"isInitialized ? 1 : 0\"\r\n>\r\n  <div\r\n    #element\r\n    class=\"page\"\r\n    id=\"Page\"\r\n    [id]=\"id\"\r\n    [style.padding-left.px]=\"page?.padding.left\"\r\n    [style.padding-right.px]=\"page?.padding.right\"\r\n    [style.padding-top.px]=\"page?.padding.top\"\r\n    [style.padding-bottom.px]=\"page?.padding.bottom\"\r\n    [style.background-color]=\"page.backgroundColor.toHtmlColor()\"\r\n    [style.overflow]=\"'hidden'\"\r\n    [style.width.px]=\"width\"\r\n    [style.height.px]=\"height\"\r\n    [class]=\"className\"\r\n    [style.background-image]=\"backgroundImage\"\r\n    [style.background-position]=\"'center'\"\r\n    [style.background-size]=\"'cover'\"\r\n    [style.background-repeat]=\"'no-repeat'\"\r\n    [style.margin-top.px]=\"getPageIndex() == 0 ? 0 : 10\"\r\n    (mousedown)=\"onMouseDown($event)\"\r\n  >\r\n    <div *ngFor=\"let element of elements\">\r\n      <sti-component-holder [element]=\"element\"></sti-component-holder>\r\n    </div>\r\n    <sti-page-grid-overlay\r\n      *ngIf=\"model.pageWithGrid == page || (model.lastUsedPage == page && componentResizerService.isResizing)\"\r\n    ></sti-page-grid-overlay>\r\n    <div class=\"trial-title\" [style.zIndex]=\"model.previewMode ? 99999 : 0\" *ngIf=\"model.showTrialTitle\">\r\n      <span>{{ loc.getP(\"Trial\") }}</span>\r\n    </div>\r\n    <div\r\n      class=\"inline-border\"\r\n      *ngIf=\"!model.viewerMode && !model.previewMode\"\r\n      [style.left.px]=\"page.padding.left\"\r\n      [style.top.px]=\"page.padding.top\"\r\n      [style.width.px]=\"page.contentAreaWidth\"\r\n      [style.height.px]=\"page.contentAreaHeight\"\r\n    ></div>\r\n    <i *ngIf=\"!page?.visible\" class=\"pi pi-eye-slash\" style=\"opacity: 0.3\"></i>\r\n  </div>\r\n  <sti-page-navigation\r\n    *ngIf=\"page === model.selectedPage && !model.previewMode\"\r\n    [currentPage]=\"page\"\r\n    [style.visibility]=\"model.previewMode ? 'hidden' : ''\"\r\n    [style.height]=\"'100%'\"\r\n    [style.margin-top.px]=\"getPageIndex() == 0 ? 0 : 10\"\r\n  ></sti-page-navigation>\r\n</div>\r\n<style>\r\n  .page-container {\r\n    position: relative;\r\n    display: flex;\r\n  }\r\n  .page {\r\n    position: relative;\r\n    display: block;\r\n    background: white;\r\n    font-size: 2.5rem;\r\n    color: black;\r\n    border: 1px solid #c6c6c6;\r\n    margin-right: 10px;\r\n    margin-top: 10px;\r\n    margin-bottom: 10px;\r\n  }\r\n  .inline-border {\r\n    position: absolute;\r\n    pointer-events: none;\r\n    border: 1px solid rgb(234, 234, 234);\r\n    opacity: 0.5;\r\n  }\r\n  .trial-title {\r\n    position: absolute;\r\n    pointer-events: none;\r\n    user-select: none;\r\n    opacity: 0.3;\r\n    font-family: \"Segoe UI\";\r\n    font-weight: bold;\r\n    font-size: 100pt;\r\n    left: calc(50% - 135px);\r\n    top: calc(50% - 88px);\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n  }\r\n  .trial-title span {\r\n    transform: rotate(-45deg);\r\n  }\r\n  .hovered {\r\n    border-color: rgb(73, 108, 159);\r\n  }\r\n\r\n  .active {\r\n    border-color: rgb(146, 146, 146);\r\n  }\r\n  i {\r\n    position: absolute;\r\n    right: 5px;\r\n    top: 5px;\r\n  }\r\n\r\n  .disable-text-selection {\r\n    -webkit-touch-callout: none;\r\n    -khtml-user-select: none;\r\n    -moz-user-select: none;\r\n    -ms-user-select: none;\r\n    -webkit-touch-callout: none;\r\n    -webkit-user-select: none;\r\n  }\r\n</style>\r\n" }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }, { type: StiComponentResizerService }, { type: StiEditableContentService }], propDecorators: { pageEl: [{
                type: ViewChild,
                args: ["element"]
            }], pageContainerEl: [{
                type: ViewChild,
                args: ["pageContainerEl"]
            }], page: [{
                type: Input
            }] } });

class WorkspaceComponent {
    constructor(model, exportService, toolbarResizerService) {
        this.model = model;
        this.exportService = exportService;
        this.toolbarResizerService = toolbarResizerService;
    }
    get padding() {
        if (this.toolbarResizerService.isMinimizeMode) {
            return 20 + "px";
        }
        else
            return 0 + "px";
    }
    get pages() {
        return this.model.form?.pages;
    }
    onClick(event) {
        let elements = document.elementsFromPoint(event.clientX, event.clientY);
        if (!elements.find((elem) => elem?.classList.contains("page")) &&
            !elements.find((elem) => elem?.classList.contains("page-navigation"))) {
            this.model.selectedComponent = null;
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: WorkspaceComponent, deps: [{ token: StiModelService }, { token: StiExportService }, { token: StiToolbarResizerService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: WorkspaceComponent, selector: "sti-workspace", viewQueries: [{ propertyName: "workspaceEl", first: true, predicate: ["element"], descendants: true }], ngImport: i0, template: `
    <div class="main-container" [style.paddingLeft]="this.padding" (click)="onClick($event)">
      <div #element class="workspace" [style.transform]="model.getScale()" [style.transform-origin]="'left top'">
        <app-page [page]="page" *ngFor="let page of pages" (click)="onClick($event)"></app-page>
        <!-- <sti-toolbar-resizer [style.visibility]="this.model.previewMode ? 'hidden' : ''"></sti-toolbar-resizer> -->
      </div>
    </div>

    <style>
      .workspace {
        width: fit-content;
        height: 100%;
        position: relative;
      }
      .center {
        text-align: center;
      }
      .main-container {
        height: 100%;
        width: 100%;
        padding-top: 10px;
        padding-right: 20px;
      }
    </style>
  `, isInline: true, styles: ["\n      .workspace {\n        width: fit-content;\n        height: 100%;\n        position: relative;\n      }\n      .center {\n        text-align: center;\n      }\n      .main-container {\n        height: 100%;\n        width: 100%;\n        padding-top: 10px;\n        padding-right: 20px;\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: PageComponent, selector: "app-page", inputs: ["page"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: WorkspaceComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-workspace",
                    template: `
    <div class="main-container" [style.paddingLeft]="this.padding" (click)="onClick($event)">
      <div #element class="workspace" [style.transform]="model.getScale()" [style.transform-origin]="'left top'">
        <app-page [page]="page" *ngFor="let page of pages" (click)="onClick($event)"></app-page>
        <!-- <sti-toolbar-resizer [style.visibility]="this.model.previewMode ? 'hidden' : ''"></sti-toolbar-resizer> -->
      </div>
    </div>

    <style>
      .workspace {
        width: fit-content;
        height: 100%;
        position: relative;
      }
      .center {
        text-align: center;
      }
      .main-container {
        height: 100%;
        width: 100%;
        padding-top: 10px;
        padding-right: 20px;
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiExportService }, { type: StiToolbarResizerService }], propDecorators: { workspaceEl: [{
                type: ViewChild,
                args: ["element"]
            }] } });

class StiPropertyGridNavigationComponent {
    constructor(loc, model) {
        this.loc = loc;
        this.model = model;
    }
    selectMode(mode) {
        if (this.model.currentPropertyGridMode != mode) {
            this.model.currentPropertyGridMode = mode;
            if (mode == "Properties") {
                setTimeout(() => {
                    this.model.needToRefresh.next(true);
                });
            }
        }
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPropertyGridNavigationComponent, deps: [{ token: StiLocalizationService }, { token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiPropertyGridNavigationComponent, selector: "property-grid-navigation", ngImport: i0, template: `<div class="navigation-container">
    <div
      class="button {{ model.currentPropertyGridMode == 'Properties' ? 'selected' : '' }}"
      (click)="selectMode('Properties')"
    >
      <img [src]="model.getImage('images.Other.Properties.png')" />
      <div class="label">
        <span>{{ "Properties" }}</span>
        <div class="current-indicator"></div>
      </div>
    </div>
    <div class="button {{ model.currentPropertyGridMode == 'Tree' ? 'selected' : '' }}" (click)="selectMode('Tree')">
      <img [src]="model.getImage('images.Other.ReportTree.png')" />
      <div class="label">
        <span>{{ "Form Tree" }}</span>
        <div class="current-indicator"></div>
      </div>
    </div>
  </div>`, isInline: true, styles: [".navigation-container{display:flex;height:34px;-webkit-user-select:none;align-items:center}.label{display:flex;flex-direction:column}.selected .current-indicator{height:3px;width:100%;background-color:#19478a}.button{font-family:Arial;font-size:12px;min-width:80px;height:26px;border-radius:3px;background-color:transparent;display:flex;align-items:center;margin-right:3px;padding-right:10px}.button:hover{background-color:#dadada;cursor:pointer}.selected{background-color:#e5e5e5}img{height:16px;width:16px;margin:0 6px}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPropertyGridNavigationComponent, decorators: [{
            type: Component,
            args: [{ selector: "property-grid-navigation", template: `<div class="navigation-container">
    <div
      class="button {{ model.currentPropertyGridMode == 'Properties' ? 'selected' : '' }}"
      (click)="selectMode('Properties')"
    >
      <img [src]="model.getImage('images.Other.Properties.png')" />
      <div class="label">
        <span>{{ "Properties" }}</span>
        <div class="current-indicator"></div>
      </div>
    </div>
    <div class="button {{ model.currentPropertyGridMode == 'Tree' ? 'selected' : '' }}" (click)="selectMode('Tree')">
      <img [src]="model.getImage('images.Other.ReportTree.png')" />
      <div class="label">
        <span>{{ "Form Tree" }}</span>
        <div class="current-indicator"></div>
      </div>
    </div>
  </div>`, styles: [".navigation-container{display:flex;height:34px;-webkit-user-select:none;align-items:center}.label{display:flex;flex-direction:column}.selected .current-indicator{height:3px;width:100%;background-color:#19478a}.button{font-family:Arial;font-size:12px;min-width:80px;height:26px;border-radius:3px;background-color:transparent;display:flex;align-items:center;margin-right:3px;padding-right:10px}.button:hover{background-color:#dadada;cursor:pointer}.selected{background-color:#e5e5e5}img{height:16px;width:16px;margin:0 6px}\n"] }]
        }], ctorParameters: () => [{ type: StiLocalizationService }, { type: StiModelService }] });

class StiFormsTreeItemComponent {
    get innerItems() {
        return this.item?.pages ?? this.item?.elements;
    }
    get isFormElement() {
        return this.item instanceof StiForm;
    }
    get isPageElement() {
        return this.item instanceof StiFormPageElement;
    }
    hasSelectedComponent(element) {
        if (element instanceof StiFormPageElement || element instanceof StiPanelElement) {
            if (element.allElements.find((element) => element == this.model.selectedComponent?.element)) {
                return true;
            }
            else {
                return false;
            }
        }
        else {
            return false;
        }
    }
    get isLastIndex() {
        if (this.item instanceof StiFormElement) {
            let parentElement = this.model.getElementPage(this.item) ?? this.model.getElementPanel(this.item);
            return parentElement?.elements?.indexOf(this.item) == parentElement?.elements?.length - 1;
        }
        else {
            return true;
        }
    }
    showInnerComponents() {
        return this.item?.pages ? true : this.model.showComponentsTab;
    }
    selectItem() {
        if (this.item instanceof StiForm) {
            this.model.selectedPage = null;
            this.model.selectedComponent = null;
        }
        else if (this.item instanceof StiFormPageElement) {
            this.model.selectedPage = this.item;
        }
        else {
            this.model.needToSelectedComponent.next(this.item);
        }
        this.scrollToElement();
    }
    scrollToElement() {
        if (this.item instanceof StiForm) {
            return;
        }
        let workspace = document.getElementsByTagName("sti-workspace")[0];
        let page = this.item instanceof StiFormPageElement ? this.item : this.model.getElementPageForScroll(this.item);
        let pageElement = document.getElementById(page.guid);
        let pageElementRect = pageElement.getBoundingClientRect();
        let index = this.model.form.pages.indexOf(page);
        workspace.scrollTop = pageElementRect.height * index + (index != 0 ? 20 * this.model.zoom : 0);
    }
    isCurrentSelectedItem() {
        if (this.item instanceof StiFormPageElement) {
            return this.model.selectedPage == this.item;
        }
        else if (this.item instanceof StiForm) {
            return !this.model.selectedPage && !this.model.selectedComponent;
        }
        else {
            return this.model?.selectedComponent?.element == this.item;
        }
    }
    getItemLabel() {
        if (this.item && this.item instanceof StiForm) {
            return this.item?.formName;
        }
        else {
            return this.item?.name;
        }
    }
    getIconSrc() {
        let path;
        if (this.item && this.item instanceof StiForm) {
            path = "images.Other.StiForm.png";
        }
        else if (this.item instanceof StiFormPageElement) {
            path = "images.Page.StiPage.png";
        }
        else {
            let toolboxElement = this.toolboxService?.elements?.find((elem) => elem.id == this.toolboxService?.getToolboxId(this.item?.type));
            path = toolboxElement?.image;
        }
        return this.model.getImage(path);
    }
    constructor(model, toolboxService) {
        this.model = model;
        this.toolboxService = toolboxService;
        this.showInnerTree = false;
    }
    ngOnDestroy() {
        if (this.innerItems) {
            let itemStateObj = this.model.formTreeInnerItemsStates?.find((item) => item?.element == this.item);
            if (itemStateObj && itemStateObj.state != this.showInnerTree) {
                itemStateObj.state = this.showInnerTree;
            }
            else {
                this.model.formTreeInnerItemsStates.push({ element: this.item, state: this.showInnerTree });
            }
        }
    }
    ngOnInit() {
        if (this.model.formTreeInnerItemsStates.find((item) => item?.element == this.item)) {
            this.showInnerTree = this.model.formTreeInnerItemsStates.find((item) => item?.element == this.item).state;
        }
        if (this.item instanceof StiForm) {
            this.showInnerTree = true;
        }
        if (this.showTree) {
            this.showInnerTree = true;
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFormsTreeItemComponent, deps: [{ token: StiModelService }, { token: StiToolboxService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiFormsTreeItemComponent, selector: "sti-forms-tree-item", inputs: { item: "item", index: "index", showTree: "showTree" }, ngImport: i0, template: `<div class="item-container" [style.left.px]="isFormElement ? 5 : !isPageElement && innerItems ? 13 : 15">
    <div class="tree-item">
      <div class="tree-lines" [style.width.px]="innerItems ? 15 : 13">
        <div
          class="inner-elements-button"
          *ngIf="innerItems && showInnerComponents()"
          (click)="this.showInnerTree = !this.showInnerTree"
        >
          <img
            [src]="
              showInnerTree
                ? model.getImage('images.Other.IconCloseItem.png')
                : model.getImage('images.Other.IconOpenItem.png')
            "
          />
        </div>
      </div>
      <div class="item-content {{ isCurrentSelectedItem() ? 'current' : '' }}" (click)="selectItem()">
        <div class="item-icon"><img [src]="getIconSrc()" /></div>
        <div class="item-label">{{ getItemLabel() }}</div>
      </div>
    </div>
    <div class="inner-items" *ngIf="innerItems && showInnerTree && showInnerComponents()">
      <sti-forms-tree-item
        *ngFor="let innerItem of innerItems; let i = index"
        [item]="innerItem"
        [index]="i"
        [showTree]="hasSelectedComponent(innerItem)"
      ></sti-forms-tree-item>
    </div>
  </div>`, isInline: true, styles: [".item-icon{height:17px}.item-content{border-radius:3px;display:flex;align-items:center;height:23px;padding:3px}.current{background-color:#d3d3d3}.horizontal-line{position:absolute;height:1px;width:11px;left:11px;top:11px;background-color:#d3d3d3}.vertical-line{position:absolute;height:11px;width:1px;left:11px;top:0;background-color:#d3d3d3}.tree-lines{height:100%;position:relative;width:23px;display:flex;align-items:center}.item-label{margin-left:3px}.item-container{position:relative;top:0;font-size:11px;color:#444;font-family:Arial;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;display:flex;flex-direction:column}.tree-item{display:flex;align-items:center;height:23px}img{height:16px;width:16px}.inner-elements-button{display:flex;justify-content:flex-end}.inner-elements-button img{height:12px;width:12px;margin-top:1px;margin-right:3px}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiFormsTreeItemComponent, selector: "sti-forms-tree-item", inputs: ["item", "index", "showTree"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFormsTreeItemComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-forms-tree-item", template: `<div class="item-container" [style.left.px]="isFormElement ? 5 : !isPageElement && innerItems ? 13 : 15">
    <div class="tree-item">
      <div class="tree-lines" [style.width.px]="innerItems ? 15 : 13">
        <div
          class="inner-elements-button"
          *ngIf="innerItems && showInnerComponents()"
          (click)="this.showInnerTree = !this.showInnerTree"
        >
          <img
            [src]="
              showInnerTree
                ? model.getImage('images.Other.IconCloseItem.png')
                : model.getImage('images.Other.IconOpenItem.png')
            "
          />
        </div>
      </div>
      <div class="item-content {{ isCurrentSelectedItem() ? 'current' : '' }}" (click)="selectItem()">
        <div class="item-icon"><img [src]="getIconSrc()" /></div>
        <div class="item-label">{{ getItemLabel() }}</div>
      </div>
    </div>
    <div class="inner-items" *ngIf="innerItems && showInnerTree && showInnerComponents()">
      <sti-forms-tree-item
        *ngFor="let innerItem of innerItems; let i = index"
        [item]="innerItem"
        [index]="i"
        [showTree]="hasSelectedComponent(innerItem)"
      ></sti-forms-tree-item>
    </div>
  </div>`, styles: [".item-icon{height:17px}.item-content{border-radius:3px;display:flex;align-items:center;height:23px;padding:3px}.current{background-color:#d3d3d3}.horizontal-line{position:absolute;height:1px;width:11px;left:11px;top:11px;background-color:#d3d3d3}.vertical-line{position:absolute;height:11px;width:1px;left:11px;top:0;background-color:#d3d3d3}.tree-lines{height:100%;position:relative;width:23px;display:flex;align-items:center}.item-label{margin-left:3px}.item-container{position:relative;top:0;font-size:11px;color:#444;font-family:Arial;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;display:flex;flex-direction:column}.tree-item{display:flex;align-items:center;height:23px}img{height:16px;width:16px}.inner-elements-button{display:flex;justify-content:flex-end}.inner-elements-button img{height:12px;width:12px;margin-top:1px;margin-right:3px}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiToolboxService }], propDecorators: { item: [{
                type: Input
            }], index: [{
                type: Input
            }], showTree: [{
                type: Input
            }] } });

class StiFormsTreeComponent {
    constructor(model, loc) {
        this.model = model;
        this.loc = loc;
        this.value = "";
    }
    inputEvent(value) {
        this.value = value;
    }
    findElement() {
        document.activeElement.blur();
        let names = this.getAllNames();
        let resultNames = [];
        names.forEach((item) => {
            if (item.name.toLowerCase().indexOf(this.value.toLowerCase()) != -1) {
                resultNames.push(item);
            }
        });
        if (resultNames) {
            if (resultNames.findIndex((item) => item.name == this.lastFindedItem?.name) != -1) {
                let index = -1;
                if (this.lastFindedValue == this.value) {
                    index = resultNames.findIndex((item) => item.name == this.lastFindedItem?.name);
                }
                if (index + 1 < resultNames.length) {
                    this.selectItem(resultNames[index + 1]);
                    this.lastFindedItem = resultNames[index + 1];
                    this.lastFindedValue = this.value;
                }
                else {
                    this.model.showFormTreeWarningWindow = true;
                    this.model.formTreeWarningMessage = this.value;
                }
            }
            else {
                this.selectItem(resultNames[0]);
                this.lastFindedItem = resultNames[0];
                this.lastFindedValue = this.value;
            }
        }
    }
    selectItem(item) {
        if (item?.name == "Form") {
            this.model.selectedPage = null;
            this.model.selectedComponent = null;
        }
        else if (item?.element instanceof StiFormPageElement) {
            this.model.selectedPage = item.element;
        }
        else if (item?.element instanceof StiFormElement) {
            this.model.needToSelectedComponent.next(item?.element);
        }
        else {
            this.model.showFormTreeWarningWindow = true;
            this.model.formTreeWarningMessage = this.value;
        }
    }
    getAllNames() {
        let names = [];
        names.push({ name: "Form" });
        this.model.form?.pages?.forEach((page) => {
            names.push({ name: page.name, element: page });
            page.allElements.forEach((elem) => {
                names.push({ name: elem.name, element: elem });
            });
        });
        return names;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFormsTreeComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiFormsTreeComponent, selector: "forms-tree", ngImport: i0, template: `
    <div class="form-tree-container">
      <div class="search-container">
        <div class="search-component">
          <span class="input"
            ><input
              type="text"
              [placeholder]="loc.get2('Editor', 'Search')"
              [value]="value"
              (input)="inputEvent($event.target.value)"
              (keyup.enter)="findElement()"
            />
          </span>
          <div class="search-button" (click)="findElement()">
            <img [src]="model.getImage('images.Other.Search.png')" />
          </div>
        </div>
        <div
          class="show-components-button {{ model.showComponentsTab ? 'selected' : '' }}"
          (click)="model.showComponentsTab = !model.showComponentsTab"
        >
          <img [src]="model.getImage('images.Other.ComponentsTab.png')" />
        </div>
      </div>
      <div class="tree-items-container">
        <sti-forms-tree-item [item]="model?.form"></sti-forms-tree-item>
      </div>
    </div>
  `, isInline: true, styles: [".input{z-index:99999}input{height:22px;font-size:12px;width:100%;outline:none;border:0}.search-button{border-radius:3px;display:flex;align-items:center;justify-content:center;height:100%}.search-button:hover{cursor:pointer;background-color:var(--hover-color)}.disabled{pointer-events:none;opacity:.5}.selected{background-color:var(--hover-color)}.tree-items-container{position:relative;width:fit-content}.container-label{color:#767676;font-size:13px;font-weight:700;margin-left:5px;margin-top:4.5px;-webkit-touch-callout:none;-webkit-user-select:none}.search-component{border:1px solid var(--inputBorder-color);border-radius:3px;display:flex;width:100%;align-items:center;margin-left:5px;min-width:300px;position:relative}.search-component span{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",Segoe UI Symbol;font-size:12px;padding-left:5px;font-weight:500;color:var(--text-color);flex:1}.search-container{display:flex;height:24px;width:100%;margin:5px 0}.form-tree-container{min-width:100%;display:flex;flex-direction:column}.show-components-button{height:100%;margin:0 5px;border-radius:3px}.show-components-button:hover{background-color:var(--hover-color);cursor:pointer}img{height:16px;width:16px;margin:0 4px}\n"], dependencies: [{ kind: "component", type: StiFormsTreeItemComponent, selector: "sti-forms-tree-item", inputs: ["item", "index", "showTree"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFormsTreeComponent, decorators: [{
            type: Component,
            args: [{ selector: "forms-tree", template: `
    <div class="form-tree-container">
      <div class="search-container">
        <div class="search-component">
          <span class="input"
            ><input
              type="text"
              [placeholder]="loc.get2('Editor', 'Search')"
              [value]="value"
              (input)="inputEvent($event.target.value)"
              (keyup.enter)="findElement()"
            />
          </span>
          <div class="search-button" (click)="findElement()">
            <img [src]="model.getImage('images.Other.Search.png')" />
          </div>
        </div>
        <div
          class="show-components-button {{ model.showComponentsTab ? 'selected' : '' }}"
          (click)="model.showComponentsTab = !model.showComponentsTab"
        >
          <img [src]="model.getImage('images.Other.ComponentsTab.png')" />
        </div>
      </div>
      <div class="tree-items-container">
        <sti-forms-tree-item [item]="model?.form"></sti-forms-tree-item>
      </div>
    </div>
  `, styles: [".input{z-index:99999}input{height:22px;font-size:12px;width:100%;outline:none;border:0}.search-button{border-radius:3px;display:flex;align-items:center;justify-content:center;height:100%}.search-button:hover{cursor:pointer;background-color:var(--hover-color)}.disabled{pointer-events:none;opacity:.5}.selected{background-color:var(--hover-color)}.tree-items-container{position:relative;width:fit-content}.container-label{color:#767676;font-size:13px;font-weight:700;margin-left:5px;margin-top:4.5px;-webkit-touch-callout:none;-webkit-user-select:none}.search-component{border:1px solid var(--inputBorder-color);border-radius:3px;display:flex;width:100%;align-items:center;margin-left:5px;min-width:300px;position:relative}.search-component span{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",Segoe UI Symbol;font-size:12px;padding-left:5px;font-weight:500;color:var(--text-color);flex:1}.search-container{display:flex;height:24px;width:100%;margin:5px 0}.form-tree-container{min-width:100%;display:flex;flex-direction:column}.show-components-button{height:100%;margin:0 5px;border-radius:3px}.show-components-button:hover{background-color:var(--hover-color);cursor:pointer}img{height:16px;width:16px;margin:0 4px}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }] });

class StiElementCreator {
    createPropertyEditors(properties, element, model) { }
    constructor() { }
}

class StiAddressCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "FontEditor",
            property: "font",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({ type: "horizontalAlignment", property: "contentAlignment", label: "" });
        properties.push({
            type: "color",
            property: "textColor",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({
            type: "color",
            property: "backgroundColor",
            label: StiLocalizationService.get("PropertyMain", "BackColor"),
        });
        properties.push({
            type: "color",
            property: "borderColor",
            label: StiLocalizationService.get("PropertyMain", "BorderColor"),
        });
        properties.push({
            type: "enum",
            property: "borderWeight",
            label: StiLocalizationService.get("PropertyMain", "BorderWidth"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        properties.push({
            type: "checkbox",
            property: "readOnly",
            checkbox: StiLocalizationService.get("PropertyMain", "ReadOnly"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "label.value",
            label: StiLocalizationService.get("PropertyMain", "Label"),
        });
        properties.push({ type: "labelAlignment", property: "label.alignment", label: "" });
        if (element.label.alignment != StiLabelAlignment.Top) {
            properties.push({
                type: "Number",
                property: "label.width",
                label: StiLocalizationService.get("PropertyMain", "Width"),
            });
        }
        properties.push({
            type: "FontEditor",
            property: "label",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "label.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "FontEditor",
            property: "descriptionFont",
            label: StiLocalizationService.get("PropertyMain", "Description"),
        });
        properties.push({
            type: "color",
            property: "descriptionColor",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "checkbox",
            property: "useStreetAddress",
            checkbox: StiLocalizationService.get("PropertyMain", "StreetAddress"),
        });
        properties.push({
            type: "checkbox",
            property: "useStreetAddress2",
            checkbox: StiLocalizationService.get("PropertyMain", "StreetAddress") + " 2",
        });
        properties.push({
            type: "checkbox",
            property: "useCity",
            checkbox: StiLocalizationService.get("PropertyMain", "City"),
        });
        properties.push({
            type: "checkbox",
            property: "useState",
            checkbox: StiLocalizationService.get("PropertyMain", "State"),
        });
        properties.push({
            type: "checkbox",
            property: "useZipCode",
            checkbox: StiLocalizationService.get("Components", "StiZipCode"),
        });
        properties.push({
            type: "checkbox",
            property: "useCountry",
            checkbox: StiLocalizationService.get("PropertyMain", "Country"),
        });
        return properties;
    }
}

class StiBarcodeCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "codeString",
            label: StiLocalizationService.get("FormDesigner", "Code"),
        });
        properties.push({
            type: "enum",
            property: "barcodeType",
            label: StiLocalizationService.get("PropertyMain", "Type"),
        });
        if (element.barcodeType == StiBarcodeType.QRCode) {
            properties.push({
                type: "barcodeStyles",
                property: "style",
                label: StiLocalizationService.get("PropertyMain", "Style"),
            });
            properties.push({
                type: "simpleEnum",
                property: "matrixSize",
                label: StiLocalizationService.get("PropertyMain", "MatrixSize"),
            });
            properties.push({
                type: "simpleEnum",
                property: "errorCorrectionLevel",
                label: StiLocalizationService.get("PropertyMain", "ErrorCorrectionLevel"),
            });
            properties.push({ type: "divider" });
            properties.push({ type: "BooleanWithArrowEditor", property: "showBodyBrushEditor", label: "" });
            properties.push({ type: "BooleanWithArrowEditor", property: "showEyeBallBrushEditor", label: "" });
            properties.push({ type: "BooleanWithArrowEditor", property: "showEyeFrameBrushEditor", label: "" });
            properties.push({ type: "divider" });
        }
        properties.push({
            type: "color",
            property: "foreColor",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({
            type: "color",
            property: "backColor",
            label: StiLocalizationService.get("PropertyMain", "BackColor"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        /* properties.push({ type: "divider" });
        properties.push({
          type: "TextEditor",
          property: "tooltip",
          label: StiLocalizationService.get("PropertyMain", "ToolTip"),
        }); */
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "label.value",
            label: StiLocalizationService.get("PropertyMain", "Label"),
        });
        properties.push({ type: "labelAlignment", property: "label.alignment", label: "" });
        if (element.label.alignment != StiLabelAlignment.Top) {
            properties.push({
                type: "Number",
                property: "label.width",
                label: StiLocalizationService.get("PropertyMain", "Width"),
            });
        }
        properties.push({
            type: "FontEditor",
            property: "label",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "label.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "description.value",
            label: StiLocalizationService.get("PropertyMain", "Description"),
        });
        properties.push({
            type: "FontEditor",
            property: "description",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "description.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        return properties;
    }
}

class StiButtonCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "text.value",
            label: StiLocalizationService.get("PropertyMain", "Text"),
        });
        properties.push({
            type: "enum",
            property: "buttonType",
            label: StiLocalizationService.get("PropertyMain", "Type"),
        });
        if (element.buttonType == StiButtonType.SendForm) {
            properties.push({
                type: "autoCompleteEditor",
                property: "formSendURL",
                label: StiLocalizationService.get("PropertyMain", "URL"),
            });
            properties.push({
                type: "TextEditor",
                property: "submissionMessage",
                label: StiLocalizationService.get("PropertyMain", "SubmissionMessage"),
            });
            properties.push({
                type: "enum",
                property: "buttonSendType",
                label: StiLocalizationService.get("PropertyMain", "SendType"),
            });
        }
        properties.push({
            type: "FontEditor",
            property: "text",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "text.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({
            type: "color",
            property: "text.backgroundColor",
            label: StiLocalizationService.get("PropertyMain", "BackColor"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "tooltip",
            label: StiLocalizationService.get("PropertyMain", "ToolTip"),
        });
        properties.push({
            type: "checkbox",
            property: "readOnly",
            checkbox: StiLocalizationService.get("PropertyMain", "ReadOnly"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        return properties;
    }
}

class StiCheckBoxCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "text.value",
            label: StiLocalizationService.get("PropertyMain", "Text"),
        });
        properties.push({
            type: "FontEditor",
            property: "text",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "backgroundColor",
            label: StiLocalizationService.get("PropertyMain", "BackColor"),
        });
        properties.push({
            type: "color",
            property: "checkColor",
            label: StiLocalizationService.get("PropertyMain", "CheckColor"),
        });
        properties.push({
            type: "color",
            property: "text.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({
            type: "color",
            property: "borderColor",
            label: StiLocalizationService.get("PropertyMain", "BorderColor"),
        });
        properties.push({
            type: "checkbox",
            property: "isChecked",
            checkbox: StiLocalizationService.get("Dashboard", "InitialValue"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "tooltip",
            label: StiLocalizationService.get("PropertyMain", "ToolTip"),
        });
        properties.push({
            type: "checkbox",
            property: "required",
            checkbox: StiLocalizationService.get("PropertyMain", "Required"),
        });
        properties.push({
            type: "checkbox",
            property: "readOnly",
            checkbox: StiLocalizationService.get("PropertyMain", "ReadOnly"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "label.value",
            label: StiLocalizationService.get("PropertyMain", "Label"),
        });
        properties.push({ type: "labelAlignment", property: "label.alignment", label: "" });
        if (element.label.alignment != StiLabelAlignment.Top) {
            properties.push({
                type: "Number",
                property: "label.width",
                label: StiLocalizationService.get("PropertyMain", "Width"),
            });
        }
        properties.push({
            type: "FontEditor",
            property: "label",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "label.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "description.value",
            label: StiLocalizationService.get("PropertyMain", "Description"),
        });
        properties.push({
            type: "FontEditor",
            property: "description",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "description.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        return properties;
    }
}

class StiComboBoxCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "MultilineEditor",
            property: "options",
            label: StiLocalizationService.get("PropertyMain", "Options"),
        });
        properties.push({
            type: "FontEditor",
            property: "font",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "textColor",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({
            type: "color",
            property: "backgroundColor",
            label: StiLocalizationService.get("PropertyMain", "BackColor"),
        });
        properties.push({
            type: "color",
            property: "borderColor",
            label: StiLocalizationService.get("PropertyMain", "BorderColor"),
        });
        properties.push({
            type: "enum",
            property: "borderWeight",
            label: StiLocalizationService.get("PropertyMain", "BorderWidth"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "tooltip",
            label: StiLocalizationService.get("PropertyMain", "ToolTip"),
        });
        properties.push({
            type: "checkbox",
            property: "required",
            checkbox: StiLocalizationService.get("PropertyMain", "Required"),
        });
        properties.push({
            type: "checkbox",
            property: "readOnly",
            checkbox: StiLocalizationService.get("PropertyMain", "ReadOnly"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "label.value",
            label: StiLocalizationService.get("PropertyMain", "Label"),
        });
        properties.push({ type: "labelAlignment", property: "label.alignment", label: "" });
        if (element.label.alignment != StiLabelAlignment.Top) {
            properties.push({
                type: "Number",
                property: "label.width",
                label: StiLocalizationService.get("PropertyMain", "Width"),
            });
        }
        properties.push({
            type: "FontEditor",
            property: "label",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "label.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "description.value",
            label: StiLocalizationService.get("PropertyMain", "Description"),
        });
        properties.push({
            type: "FontEditor",
            property: "description",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "description.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        return properties;
    }
}

class StiDateTimeBoxCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({ type: "enum", property: "valueType", label: StiLocalizationService.get("PropertyMain", "Type") });
        if (element.valueType == StiDateTimeBoxType.Date) {
            properties.push({
                type: "enum",
                property: "dateFormat",
                label: StiLocalizationService.get("PropertyMain", "Format"),
            });
        }
        else if (element.valueType == StiDateTimeBoxType.DateTime) {
            properties.push({
                type: "enum",
                property: "dateTimeFormat",
                label: StiLocalizationService.get("PropertyMain", "Format"),
            });
        }
        else {
            properties.push({
                type: "enum",
                property: "timeFormat",
                label: StiLocalizationService.get("PropertyMain", "Format"),
            });
        }
        properties.push({
            type: "enum",
            property: "initialState",
            label: StiLocalizationService.get("Dashboard", "InitialValue"),
        });
        properties.push({
            type: "FontEditor",
            property: "font",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "textColor",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({
            type: "color",
            property: "backgroundColor",
            label: StiLocalizationService.get("PropertyMain", "BackColor"),
        });
        properties.push({
            type: "color",
            property: "borderColor",
            label: StiLocalizationService.get("PropertyMain", "BorderColor"),
        });
        properties.push({
            type: "enum",
            property: "borderWeight",
            label: StiLocalizationService.get("PropertyMain", "BorderWidth"),
        });
        properties.push({ type: "horizontalAlignment", property: "contentAlignment", label: "" });
        properties.push({ type: "divider" });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "tooltip",
            label: StiLocalizationService.get("PropertyMain", "ToolTip"),
        });
        properties.push({
            type: "checkbox",
            property: "allowNull",
            checkbox: StiLocalizationService.get("PropertyMain", "AllowNull"),
        });
        properties.push({
            type: "checkbox",
            property: "required",
            checkbox: StiLocalizationService.get("PropertyMain", "Required"),
        });
        properties.push({
            type: "checkbox",
            property: "readOnly",
            checkbox: StiLocalizationService.get("PropertyMain", "ReadOnly"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "label.value",
            label: StiLocalizationService.get("PropertyMain", "Label"),
        });
        properties.push({ type: "labelAlignment", property: "label.alignment", label: "" });
        if (element.label.alignment != StiLabelAlignment.Top) {
            properties.push({
                type: "Number",
                property: "label.width",
                label: StiLocalizationService.get("PropertyMain", "Width"),
            });
        }
        properties.push({
            type: "FontEditor",
            property: "label",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "label.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "description.value",
            label: StiLocalizationService.get("PropertyMain", "Description"),
        });
        properties.push({
            type: "FontEditor",
            property: "description",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "description.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        return properties;
    }
}

class StiFormPageCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "image",
            property: "backgroundImage",
            label: StiLocalizationService.get("Cloud", "LabelPicture"),
        });
        properties.push({
            type: "paperKind",
            property: "paperKind",
            label: StiLocalizationService.get("FormPageSetup", "groupPaper"),
        });
        properties.push({
            type: "pageNumberEditor",
            property: "width",
            label: StiLocalizationService.get("PropertyMain", "Width"),
        });
        properties.push({
            type: "pageNumberEditor",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({ type: "color", property: "backgroundColor", label: "" });
        properties.push({ type: "divider" });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Margins"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        return properties;
    }
}

class StiImageCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "image",
            property: "image",
            label: StiLocalizationService.get("Cloud", "LabelPicture"),
        });
        properties.push({
            type: "TextEditor",
            property: "hyperlink",
            label: StiLocalizationService.get("PropertyMain", "Hyperlink"),
        });
        properties.push({ type: "divider" });
        properties.push({ type: "BooleanWithArrowEditor", property: "showBorderEditor", label: "" });
        properties.push({ type: "divider" });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "tooltip",
            label: StiLocalizationService.get("PropertyMain", "ToolTip"),
        });
        properties.push({
            type: "checkbox",
            property: "readOnly",
            checkbox: StiLocalizationService.get("PropertyMain", "ReadOnly"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "label.value",
            label: StiLocalizationService.get("PropertyMain", "Label"),
        });
        properties.push({ type: "labelAlignment", property: "label.alignment", label: "" });
        if (element.label.alignment != StiLabelAlignment.Top) {
            properties.push({
                type: "Number",
                property: "label.width",
                label: StiLocalizationService.get("PropertyMain", "Width"),
            });
        }
        properties.push({
            type: "FontEditor",
            property: "label",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "label.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "description.value",
            label: StiLocalizationService.get("PropertyMain", "Description"),
        });
        properties.push({
            type: "FontEditor",
            property: "description",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "description.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        return properties;
    }
}

class StiLabelCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "text.value",
            label: StiLocalizationService.get("PropertyMain", "Text"),
        });
        properties.push({ type: "FontEditor", property: "text", label: "" });
        properties.push({ type: "horizontalAlignment", property: "text.horizontalAlignment", label: "" });
        properties.push({ type: "verticalAlignment", property: "text.verticalAlignment", label: "" });
        properties.push({
            type: "TextEditor",
            property: "hyperlink",
            label: StiLocalizationService.get("PropertyMain", "Hyperlink"),
        });
        properties.push({ type: "BooleanWithArrowEditor", property: "showBorderEditor", label: "" });
        properties.push({ type: "divider" });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "color",
            property: "text.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({
            type: "color",
            property: "text.backgroundColor",
            label: StiLocalizationService.get("PropertyMain", "BackColor"),
        });
        properties.push({
            type: "ExceedMarginsEditor",
            property: "exceedMargins",
            label: StiLocalizationService.get("PropertyMain", "ExceedMargins"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        return properties;
    }
}

class StiLineCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "color",
            property: "lineColor",
            label: StiLocalizationService.get("PropertyMain", "LineColor"),
        });
        properties.push({
            type: "Number",
            property: "lineThickness",
            label: StiLocalizationService.get("PropertyMain", "LineWidth"),
        });
        properties.push({
            type: "verticalAlignment",
            property: "verticalAlignment",
            label: StiLocalizationService.get("PropertyMain", "VertAlignment"),
        });
        properties.push({ type: "enum", property: "style", label: StiLocalizationService.get("PropertyMain", "Style") });
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        /*properties.push({ type: "divider" });
        properties.push({
          type: "TextEditor",
          property: "description.value",
          label: StiLocalizationService.get("PropertyMain", "Description"),
        });
        properties.push({
          type: "FontEditor",
          property: "description",
          label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
          type: "color",
          property: "description.color",
          label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });*/
        return properties;
    }
}

class StiListBoxCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "MultilineEditor",
            property: "options",
            label: StiLocalizationService.get("PropertyMain", "Options"),
        });
        properties.push({
            type: "FontEditor",
            property: "font",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "checkbox",
            property: "allowMultiselection",
            checkbox: StiLocalizationService.get("Components", "StiMultipleSelection"),
        });
        properties.push({
            type: "color",
            property: "textColor",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({
            type: "color",
            property: "backgroundColor",
            label: StiLocalizationService.get("PropertyMain", "BackColor"),
        });
        properties.push({
            type: "color",
            property: "borderColor",
            label: StiLocalizationService.get("PropertyMain", "BorderColor"),
        });
        properties.push({
            type: "enum",
            property: "borderWeight",
            label: StiLocalizationService.get("PropertyMain", "BorderWidth"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "tooltip",
            label: StiLocalizationService.get("PropertyMain", "ToolTip"),
        });
        properties.push({
            type: "checkbox",
            property: "required",
            checkbox: StiLocalizationService.get("PropertyMain", "Required"),
        });
        properties.push({
            type: "checkbox",
            property: "readOnly",
            checkbox: StiLocalizationService.get("PropertyMain", "ReadOnly"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "label.value",
            label: StiLocalizationService.get("PropertyMain", "Label"),
        });
        properties.push({ type: "labelAlignment", property: "label.alignment", label: "" });
        if (element.label.alignment != StiLabelAlignment.Top) {
            properties.push({
                type: "Number",
                property: "label.width",
                label: StiLocalizationService.get("PropertyMain", "Width"),
            });
        }
        properties.push({
            type: "FontEditor",
            property: "label",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "label.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "description.value",
            label: StiLocalizationService.get("PropertyMain", "Description"),
        });
        properties.push({
            type: "FontEditor",
            property: "description",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "description.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        return properties;
    }
}

class StiMultipleSelectionCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "MultilineEditor",
            property: "options",
            label: StiLocalizationService.get("PropertyMain", "Options"),
        });
        properties.push({
            type: "FontEditor",
            property: "font",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "backgroundColor",
            label: StiLocalizationService.get("PropertyMain", "BackColor"),
        });
        properties.push({
            type: "color",
            property: "textColor",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({
            type: "color",
            property: "checkColor",
            label: StiLocalizationService.get("PropertyMain", "CheckColor"),
        });
        properties.push({
            type: "color",
            property: "borderColor",
            label: StiLocalizationService.get("PropertyMain", "BorderColor"),
        });
        properties.push({
            type: "Number",
            property: "columns",
            label: StiLocalizationService.get("PropertyMain", "Columns"),
        });
        properties.push({
            type: "checkbox",
            property: "useCustomOption",
            checkbox: StiLocalizationService.get("FormDictionaryDesigner", "CsvSeparatorOther"),
        });
        if (element.useCustomOption) {
            properties.push({
                type: "TextEditor",
                property: "customOptionText",
                label: StiLocalizationService.get("Components", "StiText"),
            });
            properties.push({
                type: "TextEditor",
                property: "prefix",
                label: StiLocalizationService.get("PropertyMain", "Prefix"),
            });
            properties.push({
                type: "TextEditor",
                property: "suffix",
                label: StiLocalizationService.get("PropertyMain", "Suffix"),
            });
        }
        properties.push({ type: "divider" });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "tooltip",
            label: StiLocalizationService.get("PropertyMain", "ToolTip"),
        });
        properties.push({
            type: "checkbox",
            property: "required",
            checkbox: StiLocalizationService.get("PropertyMain", "Required"),
        });
        properties.push({
            type: "checkbox",
            property: "readOnly",
            checkbox: StiLocalizationService.get("PropertyMain", "ReadOnly"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "label.value",
            label: StiLocalizationService.get("PropertyMain", "Label"),
        });
        properties.push({ type: "labelAlignment", property: "label.alignment", label: "" });
        if (element.label.alignment != StiLabelAlignment.Top) {
            properties.push({
                type: "Number",
                property: "label.width",
                label: StiLocalizationService.get("PropertyMain", "Width"),
            });
        }
        properties.push({
            type: "FontEditor",
            property: "label",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "label.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "description.value",
            label: StiLocalizationService.get("PropertyMain", "Description"),
        });
        properties.push({
            type: "FontEditor",
            property: "description",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "description.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        return properties;
    }
}

class StiNumberBoxCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "NumberEditor",
            property: "value",
            label: StiLocalizationService.get("Dashboard", "InitialValue"),
        });
        properties.push({ type: "horizontalAlignment", property: "contentAlignment", label: "" });
        properties.push({
            type: "enum",
            property: "numberType",
            label: StiLocalizationService.get("PropertyMain", "ValueType"),
        });
        properties.push({
            type: "FontEditor",
            property: "font",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        if (element.numberType == StiNumberType.Currency) {
            properties.push({
                type: "enum",
                property: "thousandSeparator",
                label: StiLocalizationService.get("Export", "Separator").replace(":", ""),
            });
            properties.push({
                type: "Number",
                property: "decimalDigits",
                label: StiLocalizationService.get("FormFormatEditor", "DecimalDigits"),
            });
            properties.push({
                type: "enum",
                property: "currency",
                label: StiLocalizationService.get("FormFormatEditor", "Currency"),
            });
            properties.push({
                type: "enum",
                property: "unitAlignment",
                label: StiLocalizationService.get("PropertyMain", "UnitAlignment"),
            });
            properties.push({
                type: "labelFormat",
                property: "currencyLabelFormat",
                label: StiLocalizationService.get("PropertyMain", "ShowAs"),
            });
        }
        if (element.numberType == StiNumberType.Decimal) {
            properties.push({
                type: "TextEditor",
                property: "unitLabel",
                label: StiLocalizationService.get("PropertyMain", "Unit"),
            });
            properties.push({
                type: "enum",
                property: "unitAlignment",
                label: StiLocalizationService.get("PropertyMain", "UnitAlignment"),
            });
            properties.push({
                type: "enum",
                property: "thousandSeparator",
                label: StiLocalizationService.get("Export", "Separator").replace(":", ""),
            });
            properties.push({
                type: "Number",
                property: "decimalDigits",
                label: StiLocalizationService.get("FormFormatEditor", "DecimalDigits"),
            });
        }
        properties.push({
            type: "color",
            property: "textColor",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({
            type: "color",
            property: "backgroundColor",
            label: StiLocalizationService.get("PropertyMain", "BackColor"),
        });
        properties.push({
            type: "color",
            property: "borderColor",
            label: StiLocalizationService.get("PropertyMain", "BorderColor"),
        });
        properties.push({
            type: "enum",
            property: "borderWeight",
            label: StiLocalizationService.get("PropertyMain", "BorderWidth"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "tooltip",
            label: StiLocalizationService.get("PropertyMain", "ToolTip"),
        });
        properties.push({
            type: "checkbox",
            property: "readOnly",
            checkbox: StiLocalizationService.get("PropertyMain", "ReadOnly"),
        });
        properties.push({
            type: "checkbox",
            property: "required",
            checkbox: StiLocalizationService.get("PropertyMain", "Required"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        properties.push({
            type: "checkbox",
            property: "useRange",
            checkbox: StiLocalizationService.get("Chart", "Range"),
        });
        if (element.useRange) {
            properties.push({
                type: "enum",
                property: "rangeFormat",
                label: StiLocalizationService.get("FormFormatEditor", "title"),
            });
            if (element.rangeFormat == StiNumberRangeFormat.Digits) {
                properties.push({
                    type: "Number",
                    property: "maximum",
                    label: StiLocalizationService.get("PropertyMain", "Maximum"),
                });
            }
            if (element.rangeFormat == StiNumberRangeFormat.Values) {
                properties.push({
                    type: "Number",
                    property: "minimum",
                    label: StiLocalizationService.get("PropertyMain", "Minimum"),
                });
                properties.push({
                    type: "Number",
                    property: "maximum",
                    label: StiLocalizationService.get("PropertyMain", "Maximum"),
                });
            }
        }
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "label.value",
            label: StiLocalizationService.get("PropertyMain", "Label"),
        });
        properties.push({ type: "labelAlignment", property: "label.alignment", label: "" });
        if (element.label.alignment != StiLabelAlignment.Top) {
            properties.push({
                type: "Number",
                property: "label.width",
                label: StiLocalizationService.get("PropertyMain", "Width"),
            });
        }
        properties.push({
            type: "FontEditor",
            property: "label",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "label.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "description.value",
            label: StiLocalizationService.get("PropertyMain", "Description"),
        });
        properties.push({
            type: "FontEditor",
            property: "description",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "description.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        return properties;
    }
}

class StiPDFSignatureCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        /* properties.push({
          type: "FontEditor",
          property: "font",
          label: StiLocalizationService.get("PropertyMain", "Font"),
        }); */
        properties.push({
            type: "TextEditor",
            property: "placeholder",
            label: StiLocalizationService.get("PropertyMain", "Placeholder"),
        });
        properties.push({
            type: "color",
            property: "placeholderBackColor",
            label: StiLocalizationService.get("PropertyMain", "BackColor"),
        });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        /* properties.push({
          type: "checkbox",
          property: "required",
          checkbox: StiLocalizationService.get("PropertyMain", "Required"),
        }); */
        properties.push({
            type: "checkbox",
            property: "readOnly",
            checkbox: StiLocalizationService.get("PropertyMain", "ReadOnly"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "label.value",
            label: StiLocalizationService.get("PropertyMain", "Label"),
        });
        properties.push({ type: "labelAlignment", property: "label.alignment", label: "" });
        if (element.label.alignment != StiLabelAlignment.Top) {
            properties.push({
                type: "Number",
                property: "label.width",
                label: StiLocalizationService.get("PropertyMain", "Width"),
            });
        }
        properties.push({
            type: "FontEditor",
            property: "label",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "label.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        /* properties.push({ type: "divider" });
        properties.push({
          type: "TextEditor",
          property: "description.value",
          label: StiLocalizationService.get("PropertyMain", "Description"),
        });
        properties.push({
          type: "FontEditor",
          property: "description",
          label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
          type: "color",
          property: "description.color",
          label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        }); */
        return properties;
    }
}

class StiPanelCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "color",
            property: "backgroundColor",
            label: StiLocalizationService.get("PropertyMain", "BackColor"),
        });
        properties.push({ type: "BooleanWithArrowEditor", property: "showBorderEditor", label: "" });
        properties.push({ type: "divider" });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({
            type: "checkbox",
            property: "readOnly",
            checkbox: StiLocalizationService.get("PropertyMain", "ReadOnly"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "label.value",
            label: StiLocalizationService.get("PropertyMain", "Label"),
        });
        properties.push({ type: "labelAlignment", property: "label.alignment", label: "" });
        if (element.label.alignment != StiLabelAlignment.Top) {
            properties.push({
                type: "Number",
                property: "label.width",
                label: StiLocalizationService.get("PropertyMain", "Width"),
            });
        }
        properties.push({
            type: "FontEditor",
            property: "label",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "label.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "description.value",
            label: StiLocalizationService.get("PropertyMain", "Description"),
        });
        properties.push({
            type: "FontEditor",
            property: "description",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "description.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        return properties;
    }
}

class StiSettingsCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "image",
            property: "reportImage",
            label: StiLocalizationService.get("Cloud", "LabelPicture"),
        });
        properties.push({
            type: "TextEditor",
            property: "formName",
            label: StiLocalizationService.get("PropertyMain", "FormName"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "Number",
            property: "gridColumns",
            label: StiLocalizationService.get("PropertyMain", "GridColumns"),
        });
        properties.push({
            type: "Number",
            property: "gridVerticalStep",
            label: StiLocalizationService.get("PropertyMain", "GridVerticalStep"),
        });
        properties.push({ type: "divider" });
        properties.push({ type: "defaultLabel" });
        properties.push({ type: "divider" });
        properties.push({
            type: "FontEditor",
            property: "label",
            label: StiLocalizationService.get("PropertyMain", "Label"),
        });
        properties.push({ type: "color", property: "label.color", label: "" });
        properties.push({ type: "labelAlignment", property: "label.alignment", label: "" });
        if (element.label.alignment != StiLabelAlignment.Top) {
            properties.push({
                type: "Number",
                property: "label.width",
                label: StiLocalizationService.get("PropertyMain", "Width"),
            });
        }
        properties.push({ type: "divider" });
        properties.push({
            type: "FontEditor",
            property: "innerText",
            label: StiLocalizationService.get("PropertyMain", "InnerText"),
        });
        properties.push({ type: "horizontalAlignment", property: "innerText.contentAlignment", label: "" });
        properties.push({
            type: "color",
            property: "innerText.backgroundColor",
            label: StiLocalizationService.get("PropertyMain", "BackColor"),
        });
        properties.push({
            type: "color",
            property: "innerText.borderColor",
            label: StiLocalizationService.get("PropertyMain", "BorderColor"),
        });
        properties.push({
            type: "color",
            property: "innerText.checkColor",
            label: StiLocalizationService.get("PropertyMain", "CheckColor"),
        });
        properties.push({
            type: "enum",
            property: "innerText.borderWeight",
            label: StiLocalizationService.get("PropertyMain", "BorderWidth"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "FontEditor",
            property: "description",
            label: StiLocalizationService.get("PropertyMain", "Description"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "enum",
            property: "culture",
            label: StiLocalizationService.get("PropertyMain", "Culture"),
        });
        properties.push({
            type: "enum",
            property: "dateTimeFormat",
            label: StiLocalizationService.get("FormFormatEditor", "DateTimeFormat"),
        });
        properties.push({
            type: "enum",
            property: "dateFormat",
            label: StiLocalizationService.get("FormFormatEditor", "Date") +
                " " +
                StiLocalizationService.get("PropertyMain", "Format"),
        });
        properties.push({
            type: "enum",
            property: "timeFormat",
            label: StiLocalizationService.get("FormFormatEditor", "Time") +
                " " +
                StiLocalizationService.get("PropertyMain", "Format"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "enum",
            property: "currency",
            label: StiLocalizationService.get("FormFormatEditor", "Currency"),
        });
        properties.push({
            type: "currencyFormat",
            property: "currencyFormat",
            label: StiLocalizationService.get("FormFormatEditor", "CurrencySymbol"),
        });
        properties.push({
            type: "enum",
            property: "unitAlignment",
            label: StiLocalizationService.get("PropertyMain", "UnitAlignment"),
        });
        properties.push({
            type: "enum",
            property: "thousandSeparator",
            label: StiLocalizationService.get("Export", "Separator").replace(":", ""),
        });
        properties.push({
            type: "Number",
            property: "decimalDigits",
            label: StiLocalizationService.get("FormFormatEditor", "DecimalDigits"),
        });
        return properties;
    }
}

class StiSignatureCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        properties.push({
            type: "checkbox",
            property: "readOnly",
            checkbox: StiLocalizationService.get("PropertyMain", "ReadOnly"),
        });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "enum",
            property: "currentSignatureMode",
            label: StiLocalizationService.get("PropertyMain", "Mode"),
        });
        if (element.currentSignatureMode == "Type") {
            properties.push({
                type: "TextEditor",
                property: "fullName",
                label: StiLocalizationService.get("PropertyMain", "FullName"),
            });
            properties.push({
                type: "TextEditor",
                property: "initials",
                label: StiLocalizationService.get("PropertyMain", "Initials"),
            });
            properties.push({
                type: "enum",
                property: "specialFont",
                label: StiLocalizationService.get("PropertyMain", "Style"),
            });
        }
        if (element.currentSignatureMode == "Draw") {
            properties.push({
                type: "TextEditor",
                property: "insertedText.value",
                label: StiLocalizationService.get("PropertyMain", "Text"),
            });
            properties.push({ type: "horizontalAlignment", property: "insertedText.horizontalAlignment", label: "" });
            properties.push({
                type: "FontEditor",
                property: "insertedText.font",
                label: StiLocalizationService.get("PropertyMain", "Font"),
            });
            properties.push({
                type: "TextEditor",
                property: "insertedImage.loadedImage",
                label: StiLocalizationService.get("PropertyCategory", "ImageCategory"),
            });
            properties.push({ type: "horizontalAlignment", property: "insertedImage.horizontalAlignment", label: "" });
            properties.push({ type: "verticalAlignment", property: "insertedImage.verticalAlignment", label: "" });
            properties.push({
                type: "checkbox",
                property: "insertedImage.aspectRatio",
                checkbox: StiLocalizationService.get("PropertyMain", "AspectRatio"),
            });
            properties.push({
                type: "checkbox",
                property: "insertedImage.stretch",
                checkbox: StiLocalizationService.get("PropertyMain", "Stretch"),
            });
        }
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "description.value",
            label: StiLocalizationService.get("PropertyMain", "Description"),
        });
        properties.push({
            type: "FontEditor",
            property: "description",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "description.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        return properties;
    }
}

class StiSingleSelectionCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "MultilineEditor",
            property: "options",
            label: StiLocalizationService.get("PropertyMain", "Options"),
        });
        properties.push({
            type: "FontEditor",
            property: "font",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "backgroundColor",
            label: StiLocalizationService.get("PropertyMain", "BackColor"),
        });
        properties.push({
            type: "color",
            property: "textColor",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({
            type: "color",
            property: "checkColor",
            label: StiLocalizationService.get("PropertyMain", "CheckColor"),
        });
        properties.push({
            type: "color",
            property: "borderColor",
            label: StiLocalizationService.get("PropertyMain", "BorderColor"),
        });
        properties.push({
            type: "Number",
            property: "columns",
            label: StiLocalizationService.get("PropertyMain", "Columns"),
        });
        properties.push({
            type: "checkbox",
            property: "useCustomOption",
            checkbox: StiLocalizationService.get("FormDictionaryDesigner", "CsvSeparatorOther"),
        });
        if (element.useCustomOption) {
            properties.push({
                type: "TextEditor",
                property: "customOptionText",
                label: StiLocalizationService.get("Components", "StiText"),
            });
            properties.push({
                type: "TextEditor",
                property: "prefix",
                label: StiLocalizationService.get("PropertyMain", "Prefix"),
            });
            properties.push({
                type: "TextEditor",
                property: "suffix",
                label: StiLocalizationService.get("PropertyMain", "Suffix"),
            });
        }
        properties.push({ type: "divider" });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "tooltip",
            label: StiLocalizationService.get("PropertyMain", "ToolTip"),
        });
        properties.push({
            type: "checkbox",
            property: "required",
            checkbox: StiLocalizationService.get("PropertyMain", "Required"),
        });
        properties.push({
            type: "checkbox",
            property: "readOnly",
            checkbox: StiLocalizationService.get("PropertyMain", "ReadOnly"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "label.value",
            label: StiLocalizationService.get("PropertyMain", "Label"),
        });
        properties.push({ type: "labelAlignment", property: "label.alignment", label: "" });
        if (element.label.alignment != StiLabelAlignment.Top) {
            properties.push({
                type: "Number",
                property: "label.width",
                label: StiLocalizationService.get("PropertyMain", "Width"),
            });
        }
        properties.push({
            type: "FontEditor",
            property: "label",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "label.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "description.value",
            label: StiLocalizationService.get("PropertyMain", "Description"),
        });
        properties.push({
            type: "FontEditor",
            property: "description",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "description.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        return properties;
    }
}

class StiTableCreator extends StiElementCreator {
    static createPropertyEditors(properties, element, model) {
        properties.push({ type: "divider" });
        properties.push({ type: "tableNavigations" });
        properties.push({ type: "divider" });
        if (element.showHeaderEditor) {
            model?.currentTablePropertyHeader.next("Main");
            properties.push({
                type: "TextEditor",
                property: "tableHeaderText",
                label: StiLocalizationService.get("PropertyMain", "Header"),
            });
            properties.push({
                type: "horizontalAlignment",
                property: "tableHeaderAlignment",
                label: "",
            });
            properties.push({
                type: "checkbox",
                property: "useWordWrap",
                checkbox: StiLocalizationService.get("PropertyEnum", "StiTextSizeModeWordWrap"),
            });
            properties.push({
                type: "color",
                property: "tableHeaderBackgroundColor",
                label: StiLocalizationService.get("PropertyMain", "BackColor"),
            });
            properties.push({
                type: "color",
                property: "tableHeaderColor",
                label: StiLocalizationService.get("PropertyMain", "ForeColor"),
            });
            properties.push({ type: "divider" });
            properties.push({
                type: "FontEditor",
                property: "font",
                label: StiLocalizationService.get("PropertyMain", "Font"),
            });
            properties.push({
                type: "color",
                property: "backgroundColor",
                label: StiLocalizationService.get("PropertyMain", "BackColor"),
            });
            properties.push({ type: "BooleanWithArrowEditor", property: "showBorderEditor", label: "" });
            properties.push({ type: "BooleanWithArrowEditor", property: "showGridLinesEditor", label: "" });
            properties.push({ type: "divider" });
            properties.push({
                type: "nameEditor",
                property: "name",
                label: StiLocalizationService.get("PropertyMain", "Name"),
            });
            properties.push({ type: "divider" });
            properties.push({
                type: "componentHeight",
                property: "height",
                label: StiLocalizationService.get("PropertyMain", "Height"),
            });
            properties.push({
                type: "PaddingEditor",
                property: "padding",
                label: StiLocalizationService.get("PropertyMain", "Padding"),
            });
            properties.push({
                type: "checkbox",
                property: "readOnly",
                checkbox: StiLocalizationService.get("PropertyMain", "ReadOnly"),
            });
            /* if (!element.readOnly) {
              properties.push({
                type: "checkbox",
                property: "dynamicRows",
                checkbox: StiLocalizationService.get("PropertyMain", "DynamicRows"),
              });
            } */
            properties.push({
                type: "checkbox",
                property: "visible",
                checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
            });
            properties.push({ type: "divider" });
            properties.push({
                type: "TextEditor",
                property: "label.value",
                label: StiLocalizationService.get("PropertyMain", "Label"),
            });
            properties.push({ type: "labelAlignment", property: "label.alignment", label: "" });
            if (element.label.alignment != StiLabelAlignment.Top) {
                properties.push({
                    type: "Number",
                    property: "label.width",
                    label: StiLocalizationService.get("PropertyMain", "Width"),
                });
            }
            properties.push({
                type: "FontEditor",
                property: "label",
                label: StiLocalizationService.get("PropertyMain", "Font"),
            });
            properties.push({
                type: "color",
                property: "label.color",
                label: StiLocalizationService.get("PropertyMain", "ForeColor"),
            });
            properties.push({ type: "divider" });
            properties.push({
                type: "TextEditor",
                property: "description.value",
                label: StiLocalizationService.get("PropertyMain", "Description"),
            });
            properties.push({
                type: "FontEditor",
                property: "description",
                label: StiLocalizationService.get("PropertyMain", "Font"),
            });
            properties.push({
                type: "color",
                property: "description.color",
                label: StiLocalizationService.get("PropertyMain", "ForeColor"),
            });
        }
        else if (element.showColumnsEditor) {
            model?.currentTablePropertyHeader.next("Columns");
            properties.push({ type: "BooleanWithArrowEditor", property: "showColumnsBorderEditor", label: "" });
            properties.push({ type: "divider" });
            properties.push({ type: "TableColumnsEditor", property: "columns", label: "" });
        }
        else if (element.showRowsEditor) {
            model?.currentTablePropertyHeader.next("Rows");
            properties.push({
                type: "checkbox",
                property: "showRowLabels",
                checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
            });
            properties.push({ type: "divider" });
            properties.push({
                type: "MultilineEditor",
                property: "rowLabels",
                label: StiLocalizationService.get("PropertyMain", "Labels"),
            });
            properties.push({ type: "divider" });
            properties.push({
                type: "horizontalAlignment",
                property: "rowLabelsHorizontalAlignment",
                label: StiLocalizationService.get("PropertyMain", "Alignment"),
            });
            properties.push({
                type: "checkbox",
                property: "alternateRowColors",
                checkbox: StiLocalizationService.get("PropertyMain", "AlternateRowColors"),
            });
            if (!element.alternateRowColors) {
                properties.push({
                    type: "color",
                    property: "rowHeadersBackground",
                    label: StiLocalizationService.get("PropertyMain", "BackColor"),
                });
                properties.push({
                    type: "color",
                    property: "rowHeadersColor",
                    label: StiLocalizationService.get("PropertyMain", "ForeColor"),
                });
            }
            else {
                properties.push({
                    type: "color",
                    property: "evenRowsStyle",
                    label: StiLocalizationService.get("PropertyMain", "EvenRowsStyle"),
                });
                properties.push({ type: "color", property: "evenRowsTextColor", label: "" });
                properties.push({
                    type: "color",
                    property: "oddRowsStyle",
                    label: StiLocalizationService.get("PropertyMain", "OddRowsStyle"),
                });
                properties.push({ type: "color", property: "oddRowsTextColor", label: "" });
            }
            properties.push({ type: "BooleanWithArrowEditor", property: "showRowsBorderEditor", label: "" });
        }
        else if (element.showTotalsEditor) {
            model?.currentTablePropertyHeader.next("Totals");
            properties.push({
                type: "checkbox",
                property: "useTotals",
                checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
            });
            properties.push({ type: "divider" });
            properties.push({
                type: "TextEditor",
                property: "totalsRowHeader",
                label: StiLocalizationService.get("PropertyMain", "Header"),
            });
            properties.push({ type: "horizontalAlignment", property: "totalsRowHeaderHorizontalAlignment", label: "" });
            properties.push({ type: "verticalAlignment", property: "totalsRowHeaderVerticalAlignment", label: "" });
            properties.push({ type: "color", property: "totalsRowHeaderColor", label: "" });
            properties.push({ type: "divider" });
            properties.push({ type: "TableColumnsEditor", property: "totalsFields", label: "" });
        }
        return properties;
    }
}

class StiTextBoxCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "value",
            label: StiLocalizationService.get("Dashboard", "InitialValue"),
        });
        properties.push({ type: "horizontalAlignment", property: "contentAlignment", label: "" });
        properties.push({
            type: "FontEditor",
            property: "font",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "textColor",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({
            type: "color",
            property: "backgroundColor",
            label: StiLocalizationService.get("PropertyMain", "BackColor"),
        });
        properties.push({
            type: "color",
            property: "borderColor",
            label: StiLocalizationService.get("PropertyMain", "BorderColor"),
        });
        properties.push({
            type: "enum",
            property: "borderWeight",
            label: StiLocalizationService.get("PropertyMain", "BorderWidth"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "mask",
            tooltip: "A - Accepts only letters (A–Z, a-z).\n X - Accepts spaces and most printable characters, \nincluding all characters available on a standard \nkeyboard and ANSI characters in 32–126 and 128–255.\n O - The letter “O” accepts alphanumeric characters \n(A–Z, a-z, and 0–9). \n9 - Accepts only numeric characters (0–9).",
            label: StiLocalizationService.get("FormFormatEditor", "FormatMask").replace(":", ""),
        });
        properties.push({
            type: "TextEditor",
            property: "tooltip",
            label: StiLocalizationService.get("PropertyMain", "ToolTip"),
        });
        properties.push({
            type: "checkbox",
            property: "readOnly",
            checkbox: StiLocalizationService.get("PropertyMain", "ReadOnly"),
        });
        properties.push({
            type: "checkbox",
            property: "required",
            checkbox: StiLocalizationService.get("PropertyMain", "Required"),
        });
        properties.push({
            type: "checkbox",
            property: "isPassword",
            checkbox: StiLocalizationService.get("Password", "StiSavePasswordForm"),
        });
        properties.push({
            type: "checkbox",
            property: "useRange",
            checkbox: StiLocalizationService.get("Chart", "Range"),
        });
        if (element.useRange) {
            properties.push({
                type: "Number",
                property: "maximum",
                label: StiLocalizationService.get("PropertyMain", "Maximum"),
            });
        }
        properties.push({
            type: "checkbox",
            property: "isMultiline",
            checkbox: StiLocalizationService.get("PropertyMain", "Multiline"),
        });
        if (element.isMultiline) {
            properties.push({
                type: "Number",
                property: "linesCount",
                label: StiLocalizationService.get("Shapes", "Lines"),
            });
        }
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "label.value",
            label: StiLocalizationService.get("PropertyMain", "Label"),
        });
        properties.push({ type: "labelAlignment", property: "label.alignment", label: "" });
        if (element.label.alignment != StiLabelAlignment.Top) {
            properties.push({
                type: "Number",
                property: "label.width",
                label: StiLocalizationService.get("PropertyMain", "Width"),
            });
        }
        properties.push({
            type: "FontEditor",
            property: "label",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "label.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "TextEditor",
            property: "description.value",
            label: StiLocalizationService.get("PropertyMain", "Description"),
        });
        properties.push({
            type: "FontEditor",
            property: "description",
            label: StiLocalizationService.get("PropertyMain", "Font"),
        });
        properties.push({
            type: "color",
            property: "description.color",
            label: StiLocalizationService.get("PropertyMain", "ForeColor"),
        });
        return properties;
    }
}

class StiTextCreator extends StiElementCreator {
    static createPropertyEditors(properties, element) {
        /* properties.push({ type: "divider" });
        properties.push({ type: "RichTextEditor", property: "text", label: "" }); */
        properties.push({ type: "divider" });
        properties.push({ type: "BooleanWithArrowEditor", property: "showBorderEditor", label: "" });
        properties.push({ type: "divider" });
        properties.push({
            type: "nameEditor",
            property: "name",
            label: StiLocalizationService.get("PropertyMain", "Name"),
        });
        properties.push({ type: "divider" });
        properties.push({
            type: "componentHeight",
            property: "height",
            label: StiLocalizationService.get("PropertyMain", "Height"),
        });
        properties.push({
            type: "PaddingEditor",
            property: "padding",
            label: StiLocalizationService.get("PropertyMain", "Padding"),
        });
        properties.push({
            type: "checkbox",
            property: "visible",
            checkbox: StiLocalizationService.get("PropertyMain", "Visible"),
        });
        return properties;
    }
}

class StiUniversalCheckboxComponent {
    constructor() {
        this.valueChange = new EventEmitter();
    }
    changeValue() {
        this.value = !this.value;
        this.valueChange.emit(this.value);
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiUniversalCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiUniversalCheckboxComponent, selector: "sti-checkbox", inputs: { value: "value", disabled: "disabled", label: "label" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: `<div class="bool-editor-container {{ disabled ? 'disabled' : '' }}">
    <div class="bool-editor" (click)="changeValue()">
      <span class="check" *ngIf="value"
        ><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 20 17" fill="none">
          <path
            class="check"
            d="M5 7.23529L8.15 12L14 3"
            [attr.stroke]="'rgb(69,69,69)'"
            fill="transparent"
            stroke-width="2"
            stroke-linecap="round"
            stroke-linejoin="round"
          /></svg
      ></span>
    </div>
    <span class="label" *ngIf="label">{{ label }}</span>
  </div>`, isInline: true, styles: [".disabled{opacity:.6;pointer-events:none}.bool-editor-container{display:flex;align-items:center;height:16px;max-width:inherit;margin:.8px 0}.bool-editor:hover{background-color:var(--hover-color);cursor:pointer}.bool-editor{border:1px solid var(--inputBorder-color);background:var(--input-color);width:16px;height:16px;color:var(--text-color);border-radius:3px}.label{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",Segoe UI Symbol;margin-left:4px;line-height:1;font-size:13px;color:var(--property-label-color);font-weight:400;-webkit-touch-callout:none;-webkit-user-select:none}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiUniversalCheckboxComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-checkbox", template: `<div class="bool-editor-container {{ disabled ? 'disabled' : '' }}">
    <div class="bool-editor" (click)="changeValue()">
      <span class="check" *ngIf="value"
        ><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 20 17" fill="none">
          <path
            class="check"
            d="M5 7.23529L8.15 12L14 3"
            [attr.stroke]="'rgb(69,69,69)'"
            fill="transparent"
            stroke-width="2"
            stroke-linecap="round"
            stroke-linejoin="round"
          /></svg
      ></span>
    </div>
    <span class="label" *ngIf="label">{{ label }}</span>
  </div>`, styles: [".disabled{opacity:.6;pointer-events:none}.bool-editor-container{display:flex;align-items:center;height:16px;max-width:inherit;margin:.8px 0}.bool-editor:hover{background-color:var(--hover-color);cursor:pointer}.bool-editor{border:1px solid var(--inputBorder-color);background:var(--input-color);width:16px;height:16px;color:var(--text-color);border-radius:3px}.label{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",Segoe UI Symbol;margin-left:4px;line-height:1;font-size:13px;color:var(--property-label-color);font-weight:400;-webkit-touch-callout:none;-webkit-user-select:none}\n"] }]
        }], ctorParameters: () => [], propDecorators: { value: [{
                type: Input
            }], disabled: [{
                type: Input
            }], label: [{
                type: Input
            }], valueChange: [{
                type: Output
            }] } });

class StiBoolEditorComponent {
    get value() {
        return this.helper.getProperty(this.object, this.property.property);
    }
    set value(value) {
        this.helper.setProperty(this.object, this.property.property, value);
        if (!(this.object instanceof StiColumnItem)) {
            this.model.needToRefresh.next(true);
            this.model.formEvents.next({ name: "ValueChanged" });
        }
    }
    constructor(model, helper) {
        this.model = model;
        this.helper = helper;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBoolEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiBoolEditorComponent, selector: "sti-bool-editor", inputs: { property: "property", object: "object" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <sti-checkbox
        [(value)]="value"
        [label]="property['checkbox']"
        *ngIf="property.type === 'checkbox'"
      ></sti-checkbox>
    </table>
  `, isInline: true, styles: [""], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiUniversalCheckboxComponent, selector: "sti-checkbox", inputs: ["value", "disabled", "label"], outputs: ["valueChange"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBoolEditorComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-bool-editor", template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <sti-checkbox
        [(value)]="value"
        [label]="property['checkbox']"
        *ngIf="property.type === 'checkbox'"
      ></sti-checkbox>
    </table>
  ` }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }], propDecorators: { property: [{
                type: Input
            }], object: [{
                type: Input
            }] } });

//import Color from "../../../system/Color";
class StiColorEditorComponent {
    showColorPicker(element, object) {
        this.colorService.openDialog(element, object);
    }
    constructor(model, helper, loc, colorService) {
        this.model = model;
        this.helper = helper;
        this.loc = loc;
        this.colorService = colorService;
    }
    ngOnInit() { }
    get color() {
        if (this.obj instanceof StiFormElement || this.obj instanceof StiFormSettings) {
            return this.helper.getProperty(this.obj, this.property.property);
        }
        else {
            return this.obj[this.property.property];
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiColorEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiLocalizationService }, { token: StiColorDialogService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiColorEditorComponent, selector: "sti-color-editor", inputs: { property: "property", textColor: "textColor", obj: "obj" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="2">
          <div
            class="custom-color-picker"
            [stiTooltip]="loc.getP('Color')"
            tooltipPosition="bottom"
            (click)="showColorPicker(colorEditor, color)"
            showDelay="500"
            #colorEditor
          >
            <div class="preview">
              <span class="custom-color-preview" [style.background-color]="color.toHtmlColor()"> </span>
              <span class="color-value">{{ color.getStringName() }}</span>
              <span class="select-button"><i class="pi pi-chevron-down"></i></span>
            </div>
          </div>
        </td>
      </tr>

      <tr></tr>
    </table>

    <style>
      td {
        padding: 0;
      }
      .custom-color-picker {
        width: 100%;
        background-color: var(--input-color);
        height: 24px;
        border: 1px solid var(--inputBorder-color);
        position: relative;
        border-radius: 3px;
      }
      .custom-color-picker:hover {
        background-color: var(--hover-color);
      }
      .custom-color-picker:focus {
        background-color: var(--input-color);
      }
      .preview {
        display: flex;
        position: relative;
        width: 100%;
        height: 100%;
      }
      .pick {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 22px;
      }
      .color-value {
        font-weight: 500;
        font-size: 12px;
        align-self: center;
        color: var(--text-color);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }
      .custom-color-preview {
        width: 24px;
        height: 14px;
        margin: 4px;
        background-color: black;
        border: 1px solid var(--inputBorder-color);
      }
      .select-button {
        float: right;
        margin-left: auto;
        margin-right: 5px;
        color: rgb(186, 185, 184);
        display: flex;
        align-items: center;
      }
      .i {
        height: 12px;
        width: 12px;
        right: 3px;
      }
    </style>
  `, isInline: true, styles: ["\n      td {\n        padding: 0;\n      }\n      .custom-color-picker {\n        width: 100%;\n        background-color: var(--input-color);\n        height: 24px;\n        border: 1px solid var(--inputBorder-color);\n        position: relative;\n        border-radius: 3px;\n      }\n      .custom-color-picker:hover {\n        background-color: var(--hover-color);\n      }\n      .custom-color-picker:focus {\n        background-color: var(--input-color);\n      }\n      .preview {\n        display: flex;\n        position: relative;\n        width: 100%;\n        height: 100%;\n      }\n      .pick {\n        position: absolute;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 22px;\n      }\n      .color-value {\n        font-weight: 500;\n        font-size: 12px;\n        align-self: center;\n        color: var(--text-color);\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n      }\n      .custom-color-preview {\n        width: 24px;\n        height: 14px;\n        margin: 4px;\n        background-color: black;\n        border: 1px solid var(--inputBorder-color);\n      }\n      .select-button {\n        float: right;\n        margin-left: auto;\n        margin-right: 5px;\n        color: rgb(186, 185, 184);\n        display: flex;\n        align-items: center;\n      }\n      .i {\n        height: 12px;\n        width: 12px;\n        right: 3px;\n      }\n    "], dependencies: [{ kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiColorEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-color-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="2">
          <div
            class="custom-color-picker"
            [stiTooltip]="loc.getP('Color')"
            tooltipPosition="bottom"
            (click)="showColorPicker(colorEditor, color)"
            showDelay="500"
            #colorEditor
          >
            <div class="preview">
              <span class="custom-color-preview" [style.background-color]="color.toHtmlColor()"> </span>
              <span class="color-value">{{ color.getStringName() }}</span>
              <span class="select-button"><i class="pi pi-chevron-down"></i></span>
            </div>
          </div>
        </td>
      </tr>

      <tr></tr>
    </table>

    <style>
      td {
        padding: 0;
      }
      .custom-color-picker {
        width: 100%;
        background-color: var(--input-color);
        height: 24px;
        border: 1px solid var(--inputBorder-color);
        position: relative;
        border-radius: 3px;
      }
      .custom-color-picker:hover {
        background-color: var(--hover-color);
      }
      .custom-color-picker:focus {
        background-color: var(--input-color);
      }
      .preview {
        display: flex;
        position: relative;
        width: 100%;
        height: 100%;
      }
      .pick {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 22px;
      }
      .color-value {
        font-weight: 500;
        font-size: 12px;
        align-self: center;
        color: var(--text-color);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }
      .custom-color-preview {
        width: 24px;
        height: 14px;
        margin: 4px;
        background-color: black;
        border: 1px solid var(--inputBorder-color);
      }
      .select-button {
        float: right;
        margin-left: auto;
        margin-right: 5px;
        color: rgb(186, 185, 184);
        display: flex;
        align-items: center;
      }
      .i {
        height: 12px;
        width: 12px;
        right: 3px;
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiLocalizationService }, { type: StiColorDialogService }], propDecorators: { property: [{
                type: Input
            }], textColor: [{
                type: Input
            }], obj: [{
                type: Input
            }] } });

class StiDropdownEditorComponent {
    constructor(model, cdr) {
        this.model = model;
        this.cdr = cdr;
        this.valueChange = new EventEmitter();
        this.isInitialized = false;
        this.showDropdownList = false;
    }
    ngOnDestroy() {
        this.hideDropdownSubscription.unsubscribe();
    }
    get currentPreviewIndex() {
        return this.options.findIndex((option) => option instanceof Object ? option[this.valueName] == this.value : option == this.value);
    }
    get label() {
        return this.optionLabel ? this.optionLabel : "name";
    }
    get valueName() {
        return this.optionValue ? this.optionValue : "value";
    }
    blur() {
        this.cdr.reattach();
        this.cdr.detectChanges();
    }
    setContent(innerText) {
        this.cdr.detach();
        this.value = innerText;
        this.valueChange.emit(this.value);
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    getLabel() {
        if (this.isInitialized) {
            return this.options[this.currentPreviewIndex] instanceof Object
                ? this.options[this.currentPreviewIndex][this.label]
                : this.currentPreviewIndex != -1
                    ? this.options[this.currentPreviewIndex]
                    : this.value;
        }
        else {
            return "";
        }
    }
    selectItem(index) {
        this.value = this.options[index] instanceof Object ? this.options[index][this.valueName] : this.options[index];
        this.valueChange.emit(this.value);
        setTimeout(() => {
            this.showDropdownList = false;
        });
    }
    ngOnInit() {
        this.isInitialized = true;
        this.hideDropdownSubscription = this.model.hideActiveDropdown.subscribe((event) => {
            if (this.showDropdownList) {
                this.showDropdownList = false;
            }
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDropdownEditorComponent, deps: [{ token: StiModelService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiDropdownEditorComponent, selector: "sti-dropdown-editor", inputs: { value: "value", options: "options", optionLabel: "optionLabel", optionValue: "optionValue", editable: "editable" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: `
    <div
      #editor
      class="sti-dropdown-editor"
      (click)="model.currentEditor = editor; editable ? '' : (showDropdownList = !showDropdownList)"
    >
      <span
        class="label"
        [attr.contenteditable]="editable ? 'plaintext-only' : false"
        (input)="setContent($event.target.textContent)"
        (blur)="blur()"
        [style.cursor]="editable ? 'text' : 'pointer'"
        [spellcheck]="false"
        >{{ getLabel() }}</span
      >
      <div
        class="button"
        [style.cursor]="'pointer'"
        (click)="model.currentEditor = editor; editable ? (showDropdownList = !showDropdownList) : ''"
      >
        <span><i class="pi pi-chevron-down"></i></span>
      </div>
      <div class="sti-dropdown-items" *ngIf="showDropdownList && model.currentEditor == editor"
      [style.maxWidth.px]="editor.offsetWidth">
        <div
          class="item {{ currentPreviewIndex == idx ? 'selected' : '' }}"
          *ngFor="let item of options; index as idx"
          (click)="selectItem(idx)"
        >
          <span class="item-label" [spellcheck]="false">{{ item[label] ? item[label] : item }}</span>
        </div>
      </div>
    </div>
  `, isInline: true, styles: [".item{cursor:pointer;font-weight:400;overflow:hidden;position:relative;white-space:nowrap;margin:0;padding:.429rem .857rem;border:0 none;color:var(--text-color);background:transparent;transition:background-color .2s,box-shadow .2s;border-radius:0}.item:hover{background-color:#dadada}.selected{background-color:#efefef}.sti-dropdown-editor{width:100%;display:flex;align-items:center;position:relative;height:24px;-webkit-user-select:none;user-select:none;background:var(--input-color);border:1px solid var(--inputBorder-color);border-radius:3px;font-size:12px;font-weight:500;color:var(--text-color)}.sti-dropdown-editor:hover{background-color:var(--hover-color)}.label{width:100%;height:100%;padding:3px 5px;min-width:22.4px}.label:focus{outline:none}.button{width:20px;height:100%;color:#bab9b8;display:flex;align-items:center;justify-content:center}.sti-dropdown-items{position:absolute;max-height:400px;overflow-y:auto;overflow-x:hidden;left:0;top:24px;background:var(--input-color);min-width:100%;z-index:1003;border:1px solid #c8c8c8;border-radius:3px;font-size:13px;box-shadow:0 3px 6px #00000029}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDropdownEditorComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-dropdown-editor", template: `
    <div
      #editor
      class="sti-dropdown-editor"
      (click)="model.currentEditor = editor; editable ? '' : (showDropdownList = !showDropdownList)"
    >
      <span
        class="label"
        [attr.contenteditable]="editable ? 'plaintext-only' : false"
        (input)="setContent($event.target.textContent)"
        (blur)="blur()"
        [style.cursor]="editable ? 'text' : 'pointer'"
        [spellcheck]="false"
        >{{ getLabel() }}</span
      >
      <div
        class="button"
        [style.cursor]="'pointer'"
        (click)="model.currentEditor = editor; editable ? (showDropdownList = !showDropdownList) : ''"
      >
        <span><i class="pi pi-chevron-down"></i></span>
      </div>
      <div class="sti-dropdown-items" *ngIf="showDropdownList && model.currentEditor == editor"
      [style.maxWidth.px]="editor.offsetWidth">
        <div
          class="item {{ currentPreviewIndex == idx ? 'selected' : '' }}"
          *ngFor="let item of options; index as idx"
          (click)="selectItem(idx)"
        >
          <span class="item-label" [spellcheck]="false">{{ item[label] ? item[label] : item }}</span>
        </div>
      </div>
    </div>
  `, styles: [".item{cursor:pointer;font-weight:400;overflow:hidden;position:relative;white-space:nowrap;margin:0;padding:.429rem .857rem;border:0 none;color:var(--text-color);background:transparent;transition:background-color .2s,box-shadow .2s;border-radius:0}.item:hover{background-color:#dadada}.selected{background-color:#efefef}.sti-dropdown-editor{width:100%;display:flex;align-items:center;position:relative;height:24px;-webkit-user-select:none;user-select:none;background:var(--input-color);border:1px solid var(--inputBorder-color);border-radius:3px;font-size:12px;font-weight:500;color:var(--text-color)}.sti-dropdown-editor:hover{background-color:var(--hover-color)}.label{width:100%;height:100%;padding:3px 5px;min-width:22.4px}.label:focus{outline:none}.button{width:20px;height:100%;color:#bab9b8;display:flex;align-items:center;justify-content:center}.sti-dropdown-items{position:absolute;max-height:400px;overflow-y:auto;overflow-x:hidden;left:0;top:24px;background:var(--input-color);min-width:100%;z-index:1003;border:1px solid #c8c8c8;border-radius:3px;font-size:13px;box-shadow:0 3px 6px #00000029}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: i0.ChangeDetectorRef }], propDecorators: { value: [{
                type: Input
            }], options: [{
                type: Input
            }], optionLabel: [{
                type: Input
            }], optionValue: [{
                type: Input
            }], editable: [{
                type: Input
            }], valueChange: [{
                type: Output
            }] } });

class StiEnumEditorComponent {
    constructor(model, helper) {
        this.model = model;
        this.helper = helper;
        this.items = [];
        this.today = new Date();
    }
    get columns() {
        let items = [];
        if (this.model.selectedComponent.element instanceof StiTableElement) {
            this.model.selectedComponent.element.columns.forEach((column, index) => {
                items.push({ name: column.label, value: index + 1 });
            });
        }
        if (this.items.length != items.length || !this.items.every((val, index) => val.name === items[index].name)) {
            this.items = items;
        }
        return this.items;
    }
    mouseOver(target) {
        if (this.property.property == "dateFormat" ||
            this.property.property == "timeFormat" ||
            this.property.property == "dateTimeFormat") {
            target.style.backgroundColor = "var(--input-color)";
            target.parentElement.style.backgroundColor = "var(--input-color)";
        }
    }
    formattedDateTime() {
        return StiStaticHelperService.formatDate(this.today, this.type, this.model.form.settings.culture);
    }
    get columnIndex() {
        if (this.model.selectedComponent.element instanceof StiTableElement) {
            return this.object.calculationAlgorithm.columntIndex;
        }
        return 0;
    }
    set columnIndex(value) {
        this.object.calculationAlgorithm.columntIndex = value;
    }
    get type() {
        if (this.property.property === "valueType") {
            return StiDateTimeBoxType[this.model.selectedComponent.element[this.property.property]];
        }
        else if (this.property.property === "signatureType") {
            return StiSignatureType[this.model.selectedComponent.element[this.property.property]];
        }
        else if (this.property.property === "initialState") {
            return StiDateTimeBoxValueChoise[this.model.selectedComponent.element[this.property.property]];
        }
        else if (this.property.property === "rangeFormat") {
            return StiNumberRangeFormat[this.helper.getProperty(this.object, this.property.property)];
        }
        else if (this.property.property === "numberType") {
            return StiNumberType[this.helper.getProperty(this.object, this.property.property)];
        }
        else if (this.property.property === "buttonType") {
            return StiButtonType[this.model.selectedComponent.element[this.property.property]];
        }
        else if (this.property.property === "buttonSendType") {
            return StiButtonSendType[this.model.selectedComponent.element[this.property.property]];
        }
        else if (this.property.property === "thousandSeparator") {
            return StiThousandSeparator[this.helper.getProperty(this.object, this.property.property)];
        }
        else if (this.property.property === "barcodeType") {
            return StiBarcodeType[this.model.selectedComponent.element[this.property.property]];
        }
        else if (this.property.property === "style") {
            return StiPenStyle[this.helper.getProperty(this.object, this.property.property)];
        }
        else if (this.property.property === "type") {
            return this.object.type.split("").reverse().slice(6, this.object.type.length).reverse().join("");
        }
        else if (this.property.property === "currency") {
            return (this.helper.getProperty(this.object, this.property.property) ??
                this.helper.getProperty(this.model.form.settings, this.property.property));
        }
        else if (this.property.property === "currentSignatureMode" || this.property.property === "specialFont") {
            return this.helper.getProperty(this.object, this.property.property);
        }
        else if (this.property.property === "calculationAlgorithm.expression") {
            return StiAlgorithmExpression[this.helper.getProperty(this.object, this.property.property)];
        }
        else if (this.property.property === "dateFormat" || this.property.property === "timeFormat" || this.property.property === "culture") {
            return this.helper.getProperty(this.object ?? this.model.form.settings, this.property.property);
        }
        else if (this.property.property === "dateTimeFormat") {
            return this.helper.getProperty(this.object, this.property.property);
        }
        else if (this.property.property === "innerText.borderWeight") {
            return StiLineWeight[this.model.form.settings.innerText.borderWeight];
        }
        else if (this.property.property === "unitAlignment") {
            return this.helper.getProperty(this.object, this.property.property) ?? this.model.form.settings.unitAlignment;
        }
        else if (this.property.property.includes("BrushHatchStyle")) {
            return this.helper.getProperty(this.object, this.property.property);
        }
        else {
            return StiLineWeight[this.model.selectedComponent.element[this.property.property]];
        }
    }
    set type(value) {
        if (this.property.property === "valueType") {
            this.model.selectedComponent.element[this.property.property] = Enum.parse(StiDateTimeBoxType, value);
        }
        else if (this.property.property === "signatureType") {
            this.model.selectedComponent.element[this.property.property] = Enum.parse(StiSignatureType, value);
        }
        else if (this.property.property === "initialState") {
            this.model.selectedComponent.element[this.property.property] = Enum.parse(StiDateTimeBoxValueChoise, value);
        }
        else if (this.property.property === "rangeFormat") {
            this.helper.setProperty(this.object, this.property.property, Enum.parse(StiNumberRangeFormat, value));
        }
        else if (this.property.property === "numberType") {
            this.helper.setProperty(this.object, this.property.property, Enum.parse(StiNumberType, value));
            if (this.object instanceof StiColumnItem) {
                this.model.needToRefreshInnerProperties.next(true);
            }
            else {
                this.model.needToRefresh.next(true);
            }
        }
        else if (this.property.property === "buttonType") {
            this.model.selectedComponent.element[this.property.property] = Enum.parse(StiButtonType, value);
        }
        else if (this.property.property === "buttonSendType") {
            this.model.selectedComponent.element[this.property.property] = Enum.parse(StiButtonSendType, value);
        }
        else if (this.property.property === "thousandSeparator") {
            this.helper.setProperty(this.object, this.property.property, Enum.parse(StiThousandSeparator, value));
        }
        else if (this.property.property === "barcodeType") {
            this.model.selectedComponent.element[this.property.property] = Enum.parse(StiBarcodeType, value);
        }
        else if (this.property.property.includes("BrushHatchStyle")) {
            this.helper.setProperty(this.object, this.property.property, Enum.parse(HatchStyle, value));
            this.model.needToRefreshInnerProperties.next(true);
        }
        else if (this.property.property === "style") {
            this.helper.setProperty(this.object, this.property.property, Enum.parse(StiPenStyle, value));
        }
        else if (this.property.property === "calculationAlgorithm.expression") {
            if (this.type != value && this.model.selectedComponent.element instanceof StiTableElement) {
                let slicedField = this.model.selectedComponent.element.totalsFields.splice(this.index, 1);
                this.model.selectedComponent.element.totalsFields.splice(this.index, 0, new StiTotalsFieldItem(StiLocalizationService.get("PropertyMain", "New Field"), "", this.model.form));
                this.setProperties(this.model.selectedComponent.element.totalsFields[this.index], slicedField[0], value);
            }
        }
        else if (this.property.property === "currency") {
            if (this.model.selectedComponent) {
                this.helper.setProperty(this.object, this.property.property, value);
            }
            else {
                this.model.form.settings.currency = value;
            }
        }
        else if (this.property.property === "currentSignatureMode" || this.property.property === "specialFont") {
            this.helper.setProperty(this.object, this.property.property, value);
        }
        else if (this.property.property === "type") {
            if (this.type != value && this.model.selectedComponent.element instanceof StiTableElement) {
                let table = this.model.selectedComponent.element;
                let slicedColumn = table.columns.splice(this.index, 1)[0];
                table.columns.splice(this.index, 0, table.createColumn(value, slicedColumn.label, slicedColumn));
            }
        }
        else if (this.property.property === "dateFormat" || this.property.property === "timeFormat" || this.property.property === "culture") {
            this.helper.setProperty(this.object ?? this.model.form.settings, this.property.property, value);
            this.model.formEvents.next({ name: "ValueChanged" });
        }
        else if (this.property.property === "dateTimeFormat") {
            this.helper.setProperty(this.object, this.property.property, value);
            this.model.formEvents.next({ name: "ValueChanged" });
        }
        else if (this.property.property === "innerText.borderWeight") {
            this.model.form.settings.innerText.borderWeight = Enum.parse(StiLineWeight, value);
        }
        else if (this.property.property === "unitAlignment") {
            if (this.object) {
                this.helper.setProperty(this.object, this.property.property, Enum.parse(StiUnitAlignment, value));
            }
            else {
                this.model.form.settings.unitAlignment = Enum.parse(StiUnitAlignment, value);
            }
            if (!(this.object instanceof StiColumnItem)) {
                this.model.needToRefresh.next(true);
            }
        }
        else {
            this.model.selectedComponent.element[this.property.property] = Enum.parse(StiLineWeight, value);
        }
        if (this.property.property != "type" &&
            this.property.property != "calculationAlgorithm.expression" &&
            this.property.property != "dateTimeFormat" &&
            this.property.property != "dateFormat" &&
            this.property.property != "timeFormat" &&
            this.property.property != "thousandSeparator" &&
            this.property.property != "numberType" &&
            this.property.property != "unitAlignment" &&
            this.property.property != "currency") {
            this.model.needToRefresh.next(true);
            this.model.needToRefreshInnerProperties.next(true);
        }
    }
    get enum() {
        if (this.property.property === "valueType") {
            return this.helper.dateTimeTypes;
        }
        else if (this.property.property === "signatureType") {
            return this.helper.signatureTypes;
        }
        else if (this.property.property === "initialState") {
            return this.helper.dateTimeValues;
        }
        else if (this.property.property === "numberType") {
            return this.helper.numberTypes;
        }
        else if (this.property.property === "rangeFormat") {
            return this.helper.rangeFormats;
        }
        else if (this.property.property === "buttonType") {
            return this.helper.buttonTypes;
        }
        else if (this.property.property === "buttonSendType") {
            return this.helper.buttonSendTypes;
        }
        else if (this.property.property === "thousandSeparator") {
            return this.helper.thousandSeparators;
        }
        else if (this.property.property === "barcodeType") {
            return this.helper.barcodeTypes;
        }
        else if (this.property.property === "style") {
            return this.helper.penStyles;
        }
        else if (this.property.property === "type") {
            return this.helper.columnTypes;
        }
        else if (this.property.property === "calculationAlgorithm.expression") {
            return this.helper.algorithmExpressions;
        }
        else if (this.property.property === "currency") {
            return this.helper.currencyInfo;
        }
        else if (this.property.property === "currentSignatureMode") {
            return this.helper.signatureEditorModes;
        }
        else if (this.property.property === "specialFont") {
            return this.helper.signatureSpecialFonts;
        }
        else if (this.property.property.includes("BrushHatchStyle")) {
            return this.helper.hatchStyle;
        }
        else if (this.property.property === "dateTimeFormat") {
            return this.helper.dateTimeFormats;
        }
        else if (this.property.property === "dateFormat") {
            return this.helper.dateFormats;
        }
        else if (this.property.property === "timeFormat") {
            return this.helper.timeFormats;
        }
        else if (this.property.property === "culture") {
            return this.helper.cultures;
        }
        else if (this.property.property === "unitAlignment") {
            return this.helper.unitAlignment;
        }
        else {
            return this.helper.borderWeights;
        }
    }
    setProperties(newColumn, changedColumn, expression) {
        if ((newColumn && changedColumn) instanceof StiTotalsFieldItem) {
            newColumn.header = changedColumn.header;
            newColumn.headerAlignment = changedColumn.headerAlignment;
            newColumn.headerColor = changedColumn.headerColor;
            newColumn.expression = "0";
        }
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiEnumEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiEnumEditorComponent, selector: "sti-enum-editor", inputs: { property: "property", object: "object", index: "index" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="2" *ngIf="property.property != 'calculationAlgorithm.columntIndex'">
          <sti-dropdown-editor
            [options]="enum"
            [(value)]="type"
            optionLabel="{{ property.property == 'currency' ? 'englishName' : 'name' }}"
            optionValue="{{ property.property == 'currency' ? 'code' : 'value' }}"
            [editable]="
              property.property == 'dateFormat' ||
              property.property == 'timeFormat' ||
              property.property == 'dateTimeFormat'
            "
            (mouseover)="mouseOver($event.target)"
            class="p-inputtext-sm"
            [style]="{ width: '100%' }"
          ></sti-dropdown-editor>
        </td>
        <td colspan="2" *ngIf="property.property == 'calculationAlgorithm.columntIndex'">
          <sti-dropdown-editor
            [options]="columns"
            [(value)]="columnIndex"
            optionLabel="name"
            optionValue="value"
            class="p-inputtext-sm"
            [style]="{ width: '100%' }"
          ></sti-dropdown-editor>
        </td>
      </tr>
      <tr *ngIf="property.property == 'dateFormat' ||
                 property.property == 'timeFormat' ||
                 property.property == 'dateTimeFormat'">
        <span>{{formattedDateTime()}}</span>
      </tr>
    </table>
    <style>
      td {
        padding: 0;
      }
      span {
        margin-left: 2px;
        color: var(--text-color);
        font-weight: normal;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }
    </style>
  `, isInline: true, styles: ["\n      td {\n        padding: 0;\n      }\n      span {\n        margin-left: 2px;\n        color: var(--text-color);\n        font-weight: normal;\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiDropdownEditorComponent, selector: "sti-dropdown-editor", inputs: ["value", "options", "optionLabel", "optionValue", "editable"], outputs: ["valueChange"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiEnumEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-enum-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="2" *ngIf="property.property != 'calculationAlgorithm.columntIndex'">
          <sti-dropdown-editor
            [options]="enum"
            [(value)]="type"
            optionLabel="{{ property.property == 'currency' ? 'englishName' : 'name' }}"
            optionValue="{{ property.property == 'currency' ? 'code' : 'value' }}"
            [editable]="
              property.property == 'dateFormat' ||
              property.property == 'timeFormat' ||
              property.property == 'dateTimeFormat'
            "
            (mouseover)="mouseOver($event.target)"
            class="p-inputtext-sm"
            [style]="{ width: '100%' }"
          ></sti-dropdown-editor>
        </td>
        <td colspan="2" *ngIf="property.property == 'calculationAlgorithm.columntIndex'">
          <sti-dropdown-editor
            [options]="columns"
            [(value)]="columnIndex"
            optionLabel="name"
            optionValue="value"
            class="p-inputtext-sm"
            [style]="{ width: '100%' }"
          ></sti-dropdown-editor>
        </td>
      </tr>
      <tr *ngIf="property.property == 'dateFormat' ||
                 property.property == 'timeFormat' ||
                 property.property == 'dateTimeFormat'">
        <span>{{formattedDateTime()}}</span>
      </tr>
    </table>
    <style>
      td {
        padding: 0;
      }
      span {
        margin-left: 2px;
        color: var(--text-color);
        font-weight: normal;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }], propDecorators: { property: [{
                type: Input
            }], object: [{
                type: Input
            }], index: [{
                type: Input
            }] } });

class StiFontEditorComponent {
    constructor(model, helper, theme, loc, colorService) {
        this.model = model;
        this.helper = helper;
        this.theme = theme;
        this.loc = loc;
        this.colorService = colorService;
    }
    ngOnInit() { }
    showColorPicker(element, object) {
        this.colorService.openDialog(element, object);
    }
    isSettings() {
        return !this.model.selectedComponent && !this.model.selectedPage;
    }
    get content() {
        return this.helper.getProperty(this.object ?? this.model.form.settings, this.property.property);
    }
    changeEvent() {
        if (this.content.eFont) {
            let currentChangableFont = new UsedFont(this.content.eFont.family, this.model.arrayOfStylesToString(this.content.eFont.style), this.content.eFont.size);
            this.model.form.formEvents.next({ name: "UpdateFonts", value: currentChangableFont });
        }
        else {
            let currentChangableFont = new UsedFont(this.content.family ? this.content.family : this.content.font.family, this.model.arrayOfStylesToString(this.content.style ? this.content.style : this.content.font.style), this.content.size ? this.content.size : this.content.font.size);
            this.model.form.formEvents.next({ name: "UpdateFonts", value: currentChangableFont });
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFontEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiThemeService }, { token: StiLocalizationService }, { token: StiColorDialogService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiFontEditorComponent, selector: "sti-font-editor", inputs: { property: "property", object: "object" }, ngImport: i0, template: `<table class="sti-clear" [style]="{ width: '100%' }">
      <tr *ngIf="property.property === 'this' || content.eValue?.length > 0 || isSettings()">
        <td colspan="5">
          <sti-dropdown-editor
            [options]="model.fontFamilies"
            [(value)]="content.font.family"
            optionLabel="name"
            optionValue="name"
            class="p-inputtext-sm"
            [style]="{ width: '100%' }"
            [stiTooltip]="fontFamilyTooltip"
            tooltipPosition="bottom"
            showDelay="500"
            (valueChange)="changeEvent()"
          ></sti-dropdown-editor>
        </td>
        <td colspan="2">
          <sti-dropdown-editor
            [options]="helper.fontSizes"
            [(value)]="content.font.size"
            class="p-inputtext-sm"
            [style]="{ width: '100%' }"
            [stiTooltip]="fontSizeTooltip"
            tooltipPosition="bottom"
            showDelay="500"
            (valueChange)="changeEvent()"
          ></sti-dropdown-editor>
        </td>
      </tr>
      <tr *ngIf="property.property === 'this' || content.eValue?.length > 0 || isSettings()">
        <td colspan="2" style="padding-top: 5px;">
          <sti-selectButton
            [options]="helper.styleOptions"
            [(value)]="content.font.style"
            [multiple]="true"
            optionValue="value"
            [style]="{ height: '24px', minWidth: '90px' }"
            (onChange)="changeEvent()"
          >
            <ng-template let-item>
              <img
                [src]="model.getImage(item.image)"
                [stiTooltip]="loc.getP(item.value)"
                tooltipPosition="bottom"
                showDelay="500"
                [style]="{ height: '16px', width: '16px' }"
              />
            </ng-template>
          </sti-selectButton>
        </td>
      </tr>
      <tr
        *ngIf="
          property.property === 'font' ||
          property.property === 'descriptionFont' ||
          property.property === 'insertedText.font'
        "
      >
        <td colspan="5">
          <sti-dropdown-editor
            [options]="model.fontFamilies"
            [(value)]="content.family"
            optionLabel="name"
            optionValue="name"
            class="p-inputtext-sm"
            [style]="{ width: '100%' }"
            [stiTooltip]="loc.get2('HelpDesigner', 'FontName')"
            tooltipPosition="bottom"
            showDelay="500"
            (valueChange)="changeEvent()"
          ></sti-dropdown-editor>
        </td>
        <td colspan="2">
          <sti-dropdown-editor
            [options]="helper.fontSizes"
            [(value)]="content.size"
            class="p-inputtext-sm"
            [style]="{ width: '100%' }"
            [stiTooltip]="loc.getP('FontSize')"
            tooltipPosition="bottom"
            showDelay="500"
            (valueChange)="changeEvent()"
          ></sti-dropdown-editor>
        </td>
      </tr>
      <tr
        *ngIf="
          property.property === 'font' ||
          property.property === 'descriptionFont' ||
          property.property === 'insertedText.font'
        "
      >
        <td colspan="2" style="padding-top: 5px;">
          <sti-selectButton
            [options]="helper.styleOptions"
            [(value)]="content.style"
            [multiple]="true"
            optionValue="value"
            [style]="{ height: '24px', minWidth: '90px' }"
            (onChange)="changeEvent()"
          >
            <ng-template let-item>
              <img
                [src]="model.getImage(item.image)"
                [stiTooltip]="loc.getP(item.value)"
                tooltipPosition="bottom"
                showDelay="500"
                [style]="{ height: '16px', width: '16px' }"
              />
            </ng-template>
          </sti-selectButton>
        </td>
      </tr>
      <tr *ngIf="property.property == 'innerText' && (content.eValue?.length > 0 || isSettings())">
        <td colspan="7">
          <div
            class="custom-color-picker"
            [stiTooltip]="loc.getP('Color')"
            tooltipPosition="bottom"
            (click)="showColorPicker(colorEditor, content.color)"
            showDelay="500"
            #colorEditor
          >
            <div class="preview">
              <span class="custom-color-preview" [style.background-color]="content.color.toHtmlColor()"></span>
              <span class="color-value">{{ content.color.getStringName() }}</span>
              <span class="select-button"><i class="pi pi-chevron-down"></i></span>
            </div>
          </div>
        </td>
      </tr>
    </table>
    <style>
      td {
        padding: 0;
      }
      .custom-color-picker {
        width: 100%;
        background-color: var(--input-color);
        height: 24px;
        border: 1px solid var(--inputBorder-color);
        position: relative;
        border-radius: 3px;
      }
      .custom-color-picker:hover {
        background-color: var(--hover-color);
      }
      .custom-color-picker:focus {
        background-color: var(--input-color);
      }
      .preview {
        display: flex;
        position: relative;
        width: 100%;
        height: 100%;
      }
      .pick {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 22px;
      }
      .color-value {
        font-weight: 500;
        font-size: 12px;
        align-self: center;
        color: var(--text-color);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }
      .custom-color-preview {
        width: 24px;
        height: 14px;
        margin: 4px;
        background-color: black;
        border: 1px solid var(--inputBorder-color);
      }
      .select-button {
        float: right;
        margin-left: auto;
        margin-right: 5px;
        color: rgb(186, 185, 184);
        display: flex;
        align-items: center;
      }
      .i {
        height: 12px;
        width: 12px;
        right: 3px;
      }
    </style>`, isInline: true, styles: ["\n      td {\n        padding: 0;\n      }\n      .custom-color-picker {\n        width: 100%;\n        background-color: var(--input-color);\n        height: 24px;\n        border: 1px solid var(--inputBorder-color);\n        position: relative;\n        border-radius: 3px;\n      }\n      .custom-color-picker:hover {\n        background-color: var(--hover-color);\n      }\n      .custom-color-picker:focus {\n        background-color: var(--input-color);\n      }\n      .preview {\n        display: flex;\n        position: relative;\n        width: 100%;\n        height: 100%;\n      }\n      .pick {\n        position: absolute;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 22px;\n      }\n      .color-value {\n        font-weight: 500;\n        font-size: 12px;\n        align-self: center;\n        color: var(--text-color);\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n      }\n      .custom-color-preview {\n        width: 24px;\n        height: 14px;\n        margin: 4px;\n        background-color: black;\n        border: 1px solid var(--inputBorder-color);\n      }\n      .select-button {\n        float: right;\n        margin-left: auto;\n        margin-right: 5px;\n        color: rgb(186, 185, 184);\n        display: flex;\n        align-items: center;\n      }\n      .i {\n        height: 12px;\n        width: 12px;\n        right: 3px;\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiDropdownEditorComponent, selector: "sti-dropdown-editor", inputs: ["value", "options", "optionLabel", "optionValue", "editable"], outputs: ["valueChange"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }, { kind: "component", type: StiSelectButtonComponent, selector: "sti-selectButton", inputs: ["options", "value", "optionLabel", "optionValue", "multiple", "disabled"], outputs: ["onOptionClick", "onChange", "valueChange"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFontEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-font-editor",
                    template: `<table class="sti-clear" [style]="{ width: '100%' }">
      <tr *ngIf="property.property === 'this' || content.eValue?.length > 0 || isSettings()">
        <td colspan="5">
          <sti-dropdown-editor
            [options]="model.fontFamilies"
            [(value)]="content.font.family"
            optionLabel="name"
            optionValue="name"
            class="p-inputtext-sm"
            [style]="{ width: '100%' }"
            [stiTooltip]="fontFamilyTooltip"
            tooltipPosition="bottom"
            showDelay="500"
            (valueChange)="changeEvent()"
          ></sti-dropdown-editor>
        </td>
        <td colspan="2">
          <sti-dropdown-editor
            [options]="helper.fontSizes"
            [(value)]="content.font.size"
            class="p-inputtext-sm"
            [style]="{ width: '100%' }"
            [stiTooltip]="fontSizeTooltip"
            tooltipPosition="bottom"
            showDelay="500"
            (valueChange)="changeEvent()"
          ></sti-dropdown-editor>
        </td>
      </tr>
      <tr *ngIf="property.property === 'this' || content.eValue?.length > 0 || isSettings()">
        <td colspan="2" style="padding-top: 5px;">
          <sti-selectButton
            [options]="helper.styleOptions"
            [(value)]="content.font.style"
            [multiple]="true"
            optionValue="value"
            [style]="{ height: '24px', minWidth: '90px' }"
            (onChange)="changeEvent()"
          >
            <ng-template let-item>
              <img
                [src]="model.getImage(item.image)"
                [stiTooltip]="loc.getP(item.value)"
                tooltipPosition="bottom"
                showDelay="500"
                [style]="{ height: '16px', width: '16px' }"
              />
            </ng-template>
          </sti-selectButton>
        </td>
      </tr>
      <tr
        *ngIf="
          property.property === 'font' ||
          property.property === 'descriptionFont' ||
          property.property === 'insertedText.font'
        "
      >
        <td colspan="5">
          <sti-dropdown-editor
            [options]="model.fontFamilies"
            [(value)]="content.family"
            optionLabel="name"
            optionValue="name"
            class="p-inputtext-sm"
            [style]="{ width: '100%' }"
            [stiTooltip]="loc.get2('HelpDesigner', 'FontName')"
            tooltipPosition="bottom"
            showDelay="500"
            (valueChange)="changeEvent()"
          ></sti-dropdown-editor>
        </td>
        <td colspan="2">
          <sti-dropdown-editor
            [options]="helper.fontSizes"
            [(value)]="content.size"
            class="p-inputtext-sm"
            [style]="{ width: '100%' }"
            [stiTooltip]="loc.getP('FontSize')"
            tooltipPosition="bottom"
            showDelay="500"
            (valueChange)="changeEvent()"
          ></sti-dropdown-editor>
        </td>
      </tr>
      <tr
        *ngIf="
          property.property === 'font' ||
          property.property === 'descriptionFont' ||
          property.property === 'insertedText.font'
        "
      >
        <td colspan="2" style="padding-top: 5px;">
          <sti-selectButton
            [options]="helper.styleOptions"
            [(value)]="content.style"
            [multiple]="true"
            optionValue="value"
            [style]="{ height: '24px', minWidth: '90px' }"
            (onChange)="changeEvent()"
          >
            <ng-template let-item>
              <img
                [src]="model.getImage(item.image)"
                [stiTooltip]="loc.getP(item.value)"
                tooltipPosition="bottom"
                showDelay="500"
                [style]="{ height: '16px', width: '16px' }"
              />
            </ng-template>
          </sti-selectButton>
        </td>
      </tr>
      <tr *ngIf="property.property == 'innerText' && (content.eValue?.length > 0 || isSettings())">
        <td colspan="7">
          <div
            class="custom-color-picker"
            [stiTooltip]="loc.getP('Color')"
            tooltipPosition="bottom"
            (click)="showColorPicker(colorEditor, content.color)"
            showDelay="500"
            #colorEditor
          >
            <div class="preview">
              <span class="custom-color-preview" [style.background-color]="content.color.toHtmlColor()"></span>
              <span class="color-value">{{ content.color.getStringName() }}</span>
              <span class="select-button"><i class="pi pi-chevron-down"></i></span>
            </div>
          </div>
        </td>
      </tr>
    </table>
    <style>
      td {
        padding: 0;
      }
      .custom-color-picker {
        width: 100%;
        background-color: var(--input-color);
        height: 24px;
        border: 1px solid var(--inputBorder-color);
        position: relative;
        border-radius: 3px;
      }
      .custom-color-picker:hover {
        background-color: var(--hover-color);
      }
      .custom-color-picker:focus {
        background-color: var(--input-color);
      }
      .preview {
        display: flex;
        position: relative;
        width: 100%;
        height: 100%;
      }
      .pick {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 22px;
      }
      .color-value {
        font-weight: 500;
        font-size: 12px;
        align-self: center;
        color: var(--text-color);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }
      .custom-color-preview {
        width: 24px;
        height: 14px;
        margin: 4px;
        background-color: black;
        border: 1px solid var(--inputBorder-color);
      }
      .select-button {
        float: right;
        margin-left: auto;
        margin-right: 5px;
        color: rgb(186, 185, 184);
        display: flex;
        align-items: center;
      }
      .i {
        height: 12px;
        width: 12px;
        right: 3px;
      }
    </style>`,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiThemeService }, { type: StiLocalizationService }, { type: StiColorDialogService }], propDecorators: { property: [{
                type: Input
            }], object: [{
                type: Input
            }] } });

class StiImageEditorComponent {
    constructor(model, loc, helper, changesService) {
        this.model = model;
        this.loc = loc;
        this.helper = helper;
        this.changesService = changesService;
    }
    ngOnInit() { }
    get imageUrl() {
        return this.helper.getProperty(this.object, this.property.property);
    }
    set imageUrl(value) {
        this.helper.setProperty(this.object, this.property.property, value);
        this.changesService.forceChanges();
    }
    clear() {
        this.imageUrl = "";
    }
    onFileSelected(event) {
        if (event.files && event.files[0]) {
            var reader = new FileReader();
            reader.onload = (e) => {
                if (this.property.property == "reportImage") {
                    this.imageUrl = e.target.result.slice(e.target.result.indexOf(",") + 1, e.target.result.length);
                }
                else {
                    this.imageUrl = e.target.result;
                }
            };
            reader.readAsDataURL(event.files[0]);
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiImageEditorComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }, { token: StiHelperService }, { token: StiChangesService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiImageEditorComponent, selector: "sti-image-editor", inputs: { property: "property", object: "object" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '95%' }">
      <tr *ngIf="property.type === 'image'" style="width: 100%;">
        <td style="width: 25px;" colspan="1">
          <div
            class="image-upload"
            [stiTooltip]="loc.get2('FormDesigner', 'LoadImage').replace('...', '')"
            tooltipPosition="bottom"
            showDelay="500"
          >
            <label (click)="imageInput.click()">
              <img [src]="model.getImage('images.Open.png')" />
            </label>
          </div>
          <input
            [style.display]="'none'"
            type="file"
            accept=".jpg, .jpeg, .png"
            (change)="onFileSelected($event.target)"
            #imageInput
          />
        </td>
        <td *ngIf="this.imageUrl" colspan="6">
          <div class="image-delete" [stiTooltip]="loc.getP('Clear')" tooltipPosition="bottom" showDelay="500">
            <label>
              <img [src]="model.getImage('images.StiSignatureClose.png')" (click)="clear()" />
            </label>
          </div>
        </td>
      </tr>
      <tr *ngIf="this.model.selectedComponent && this.imageUrl" style="width: 100%;">
        <td colspan="7">
          <sti-checkbox [(value)]="object.preserveAspectRatio" [label]="'Preserve Aspect Ratio'"></sti-checkbox>
        </td>
      </tr>
    </table>
    <style>
      td {
        padding: 0;
      }

      .image-upload {
        background-color: var(--input-color);
        width: 20px;
        height: 20px;
      }
      .image-upload:hover {
        background-color: var(--hover-color);
      }
      img {
        height: 16px;
        width: 16px;
      }
      label {
        height: 100%;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .image-delete {
        background-color: var(--input-color);
        width: 20px;
        height: 20px;
      }
      .image-delete:hover {
        background-color: var(--hover-color);
      }
    </style>
  `, isInline: true, styles: ["\n      td {\n        padding: 0;\n      }\n\n      .image-upload {\n        background-color: var(--input-color);\n        width: 20px;\n        height: 20px;\n      }\n      .image-upload:hover {\n        background-color: var(--hover-color);\n      }\n      img {\n        height: 16px;\n        width: 16px;\n      }\n      label {\n        height: 100%;\n        width: 100%;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n      }\n      .image-delete {\n        background-color: var(--input-color);\n        width: 20px;\n        height: 20px;\n      }\n      .image-delete:hover {\n        background-color: var(--hover-color);\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiUniversalCheckboxComponent, selector: "sti-checkbox", inputs: ["value", "disabled", "label"], outputs: ["valueChange"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiImageEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-image-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '95%' }">
      <tr *ngIf="property.type === 'image'" style="width: 100%;">
        <td style="width: 25px;" colspan="1">
          <div
            class="image-upload"
            [stiTooltip]="loc.get2('FormDesigner', 'LoadImage').replace('...', '')"
            tooltipPosition="bottom"
            showDelay="500"
          >
            <label (click)="imageInput.click()">
              <img [src]="model.getImage('images.Open.png')" />
            </label>
          </div>
          <input
            [style.display]="'none'"
            type="file"
            accept=".jpg, .jpeg, .png"
            (change)="onFileSelected($event.target)"
            #imageInput
          />
        </td>
        <td *ngIf="this.imageUrl" colspan="6">
          <div class="image-delete" [stiTooltip]="loc.getP('Clear')" tooltipPosition="bottom" showDelay="500">
            <label>
              <img [src]="model.getImage('images.StiSignatureClose.png')" (click)="clear()" />
            </label>
          </div>
        </td>
      </tr>
      <tr *ngIf="this.model.selectedComponent && this.imageUrl" style="width: 100%;">
        <td colspan="7">
          <sti-checkbox [(value)]="object.preserveAspectRatio" [label]="'Preserve Aspect Ratio'"></sti-checkbox>
        </td>
      </tr>
    </table>
    <style>
      td {
        padding: 0;
      }

      .image-upload {
        background-color: var(--input-color);
        width: 20px;
        height: 20px;
      }
      .image-upload:hover {
        background-color: var(--hover-color);
      }
      img {
        height: 16px;
        width: 16px;
      }
      label {
        height: 100%;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .image-delete {
        background-color: var(--input-color);
        width: 20px;
        height: 20px;
      }
      .image-delete:hover {
        background-color: var(--hover-color);
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }, { type: StiHelperService }, { type: StiChangesService }], propDecorators: { property: [{
                type: Input
            }], object: [{
                type: Input
            }] } });

class StiInputTextDirective {
    constructor(el) {
        this.el = el;
        el.nativeElement.classList.add("sti-inputtext");
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiInputTextDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: StiInputTextDirective, selector: "[stiInputText]", ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiInputTextDirective, decorators: [{
            type: Directive,
            args: [{ selector: "[stiInputText]" }]
        }], ctorParameters: () => [{ type: i0.ElementRef }] });

class StiPaddingEditorComponent {
    constructor(model) {
        this.model = model;
        this.PADDINGS = ["left", "top", "right", "bottom"];
        this.CLASSES = ["pi pi-arrow-left", "pi pi-arrow-up", "pi pi-arrow-right", "pi pi-arrow-down"];
    }
    get padding() {
        return (this.model.selectedComponent?.element[this.property.property] ??
            (this.model.selectedPage ? this.model.selectedPage[this.property.property] : this.model.form.settings.padding));
    }
    setPadding(str, padding) {
        let value = !isNaN(parseFloat(str)) ? parseFloat(str) : 0;
        if (this.isValid(value, padding)) {
            if (value <= 0) {
                this.padding[padding] = 0;
                this.model.previousPadding[padding] = 0;
            }
            else {
                this.padding[padding] = value;
                this.model.previousPadding[padding] = value;
            }
            if (padding == "left" || padding == "right") {
                this.model.previousContentAreaWidth = this.model.lastUsedPage?.contentAreaWidth;
            }
        }
    }
    isValid(value, padding) {
        let maxHeight = this.model.selectedPage
            ? this.model.selectedPage.height
            : this.model.getElementPage(this.model.selectedComponent?.element)
                ? this.model.getElementPage(this.model.selectedComponent?.element).contentAreaHeight
                : this.model.getElementPanel(this.model.selectedComponent?.element)
                    ? this.model.getElementPanel(this.model.selectedComponent?.element).contentAreaHeight
                    : null;
        let maxWidth = this.model.selectedPage
            ? this.model.selectedPage.width
            : this.model.getElementPage(this.model.selectedComponent?.element)
                ? this.model.getElementPage(this.model.selectedComponent?.element).contentAreaWidth
                : this.model.getElementPanel(this.model.selectedComponent?.element)
                    ? this.model.getElementPanel(this.model.selectedComponent?.element).contentAreaWidth
                    : null;
        if (!maxHeight || !maxWidth) {
            maxHeight = this.model?.form?.pages[0].contentAreaHeight;
            maxWidth = this.model?.form?.pages[0].contentAreaWidth;
        }
        if (maxHeight && maxWidth) {
            let isValid = false;
            switch (padding) {
                case "left":
                    isValid = value + this.padding["right"] < maxWidth;
                    break;
                case "right":
                    isValid = value + this.padding["left"] < maxWidth;
                    break;
                case "top":
                    isValid = value + this.padding["bottom"] < maxHeight;
                    break;
                case "bottom":
                    isValid = value + this.padding["top"] < maxHeight;
                    break;
            }
            return isValid;
        }
        else {
            return true;
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPaddingEditorComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiPaddingEditorComponent, selector: "sti-padding-editor", inputs: { property: "property" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr [style]="{ width: '100%' }">
        <td *ngFor="let p of PADDINGS; index as i" [style]="{ minWidth: '50px' }">
          <span class="p-input-icon-left">
            <i [class]="CLASSES[i]" [style]="{ position: 'absolute', left: '3px', top: '8px' }"></i>
            <input
              type="text"
              stiInputText
              [ngModel]="padding[p]"
              spellcheck="false"
              (input)="setPadding($event.target.value, p)"
              [style]="{ width: '100%', paddingLeft: '11px' }"
            />
          </span>
        </td>
      </tr>
    </table>

    <style>
      td {
        padding: 0;
      }
    </style>
  `, isInline: true, styles: ["\n      td {\n        padding: 0;\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: StiInputTextDirective, selector: "[stiInputText]" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPaddingEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-padding-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr [style]="{ width: '100%' }">
        <td *ngFor="let p of PADDINGS; index as i" [style]="{ minWidth: '50px' }">
          <span class="p-input-icon-left">
            <i [class]="CLASSES[i]" [style]="{ position: 'absolute', left: '3px', top: '8px' }"></i>
            <input
              type="text"
              stiInputText
              [ngModel]="padding[p]"
              spellcheck="false"
              (input)="setPadding($event.target.value, p)"
              [style]="{ width: '100%', paddingLeft: '11px' }"
            />
          </span>
        </td>
      </tr>
    </table>

    <style>
      td {
        padding: 0;
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { property: [{
                type: Input
            }] } });

class StiInputTextAreaDirective {
    constructor(el) {
        this.el = el;
        el.nativeElement.classList.add("sti-inputtext");
        el.nativeElement.classList.add("sti-inputtextarea");
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiInputTextAreaDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: StiInputTextAreaDirective, selector: "[stiInputTextArea]", ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiInputTextAreaDirective, decorators: [{
            type: Directive,
            args: [{ selector: "[stiInputTextArea]" }]
        }], ctorParameters: () => [{ type: i0.ElementRef }] });

class StiMultilineStringEditorComponent {
    constructor(model, helper, theme) {
        this.model = model;
        this.helper = helper;
        this.theme = theme;
    }
    ngOnInit() { }
    get options() {
        if (this.object) {
            return this.object.comboBoxOptions;
        }
        else {
            return this.optionsElement.options ? this.optionsElement.options : this.optionsElement.rowLabels;
        }
    }
    get values() {
        return this.options.join("\n");
    }
    get optionsElement() {
        return this.model.selectedComponent.element
            ? this.model.selectedComponent.element
            : this.helper.getProperty(this.model.selectedComponent.element, this.property.property);
    }
    onInput(value) {
        let rows = this.optionsElement.rowLabels;
        if (this.object) {
            this.object.comboBoxOptions = value.split("\n");
        }
        else {
            this.optionsElement.options
                ? (this.optionsElement.options = value.split("\n"))
                : this.helper.setProperty(this.model.selectedComponent.element, this.property.property, value.split("\n"));
            if ("selectedOption" in this.optionsElement) {
                try {
                    if (this.optionsElement.options.indexOf(this.optionsElement.selectedOption) < 0) {
                        this.optionsElement.selectedOption = null;
                    }
                }
                catch {
                    this.optionsElement.selectedOption = null;
                }
            }
        }
        if (rows &&
            rows != this.optionsElement.RowLabels &&
            this.model.selectedComponent.element instanceof StiTableElement) {
            let values = value.split("\n");
            values.forEach(() => {
                this.model.selectedComponent.element.columns.forEach((column) => {
                    if (column.type == "CheckBoxColumn" && column instanceof StiCheckBoxColumnItem) {
                        column.cells.push(new StiCheckBoxCellItem("", false));
                    }
                    else if (column.type == "ComboBoxColumn" && column instanceof StiComboBoxColumnItem) {
                        column.cells.push(new StiComboBoxCellItem("", 0));
                    }
                    else if (column.type == "RadioButtonColumn" && column instanceof StiRadioButtonColumnItem) {
                        column.cells.push(new StiRadioButtonCellItem("", false));
                    }
                    else if (column.type == "TextBoxColumn" && column instanceof StiTextBoxColumnItem) {
                        column.cells.push(new StiTextBoxCellItem("", ""));
                    }
                    else if (column.type == "NumberBoxColumn" && column instanceof StiNumberBoxColumnItem) {
                        column.cells.push(new StiNumberBoxCellItem("", 0));
                    }
                    else if (column.type == "LabelColumn" && column instanceof StiLabelColumnItem) {
                        column.cells.push("");
                    }
                });
            });
        }
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiMultilineStringEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiThemeService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiMultilineStringEditorComponent, selector: "sti-multiline-string-editor", inputs: { property: "property", object: "object" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr [style]="{ width: '100%' }">
        <td colspan="7">
          <textarea
            stiInputTextArea
            [ngModel]="values"
            (input)="onInput($event.target.value)"
            [style]="{ width: '100%', resize: 'none' }"
            [style.height]="object ? 'max-content' : '100px'"
          ></textarea>
        </td>
      </tr>
      <style>
        tr {
          padding: 3px 0px 3px 0px;
        }
        textarea {
          font-size: 13px;
          font-weight: 600;
          padding: 2px 4px;
        }
        td {
          padding: 0;
        }
      </style>
    </table>
  `, isInline: true, styles: ["\n        tr {\n          padding: 3px 0px 3px 0px;\n        }\n        textarea {\n          font-size: 13px;\n          font-weight: 600;\n          padding: 2px 4px;\n        }\n        td {\n          padding: 0;\n        }\n      "], dependencies: [{ kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: StiInputTextAreaDirective, selector: "[stiInputTextArea]" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiMultilineStringEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-multiline-string-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr [style]="{ width: '100%' }">
        <td colspan="7">
          <textarea
            stiInputTextArea
            [ngModel]="values"
            (input)="onInput($event.target.value)"
            [style]="{ width: '100%', resize: 'none' }"
            [style.height]="object ? 'max-content' : '100px'"
          ></textarea>
        </td>
      </tr>
      <style>
        tr {
          padding: 3px 0px 3px 0px;
        }
        textarea {
          font-size: 13px;
          font-weight: 600;
          padding: 2px 4px;
        }
        td {
          padding: 0;
        }
      </style>
    </table>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiThemeService }], propDecorators: { property: [{
                type: Input
            }], object: [{
                type: Input
            }] } });

class StiNumberEditorComponent {
    get gridCounter() {
        return this._gridCounter;
    }
    set gridCounter(value) {
        if (this.property.property == "gridColumns") {
            if (value <= 12) {
                this._gridCounter = 12;
            }
            else if (this.model.form?.pages.length > 0 && value > this.model.form.pages[this.model.form.pages.length - 1].contentAreaWidth) {
                this._gridCounter = this.model.form.pages[this.model.form.pages.length - 1].contentAreaWidth;
            }
            else {
                this._gridCounter = value;
            }
        }
        else {
            if (value <= 1) {
                this._gridCounter = 1;
            }
            else if (this.model.form?.pages.length > 0 && value > this.model.form.pages[this.model.form.pages.length - 1].contentAreaHeight) {
                this._gridCounter = this.model.form.pages[this.model.form.pages.length - 1].contentAreaHeight;
            }
            else {
                this._gridCounter = value;
            }
        }
    }
    constructor(model, helper, theme, loc, render) {
        this.model = model;
        this.helper = helper;
        this.theme = theme;
        this.loc = loc;
        this.render = render;
        this.isIncrement = false;
        this.isDecrement = false;
    }
    ngOnDestroy() {
        if (this.numberInput) {
            if (this.numberInput.nativeElement.value && Number(this.numberInput.nativeElement.value) != this.counter) {
                this.onLostFocus(this.numberInput.nativeElement.value);
            }
        }
    }
    ngOnInit() {
        if (this.property.property == "gridColumns" || this.property.property == "gridVerticalStep") {
            this.gridCounter = this.helper.getProperty(this.element, this.property.property)
                ? parseFloat(this.helper.getProperty(this.element, this.property.property))
                : this.helper.getProperty(this.element, this.property.property);
        }
    }
    onLostFocus(value) {
        if (this.property.property == "gridColumns" || this.property.property == "gridVerticalStep") {
            this.gridCounter = Number(value);
            return;
        }
        this.helper.setProperty(this.obj ?? this.element, this.property.property, Number(value));
        if (this.element instanceof StiNumberBoxElement && this.element.useRange && this.property.property == "value") {
            this.model.checkNumberRange(this.element);
        }
        else if (this.element instanceof StiNumberBoxElement && this.property.property == "decimalDigits") {
            this.model.needToRefresh.next(true);
        }
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    applySettings() {
        this.helper.setProperty(this.element, this.property.property, this.gridCounter);
        this.model.formEvents.next({ name: "ValueChanged" });
        setTimeout(() => {
            this.checkOutputs();
        }, 300);
    }
    checkOutputs() {
        this.model.form.pages.forEach((page) => {
            page.allElements.forEach((element) => {
                if (element.x + element.width > page.contentAreaWidth) {
                    element.x = 0;
                }
            });
        });
        this.checkOnOverlay();
        this.model.form.pages.forEach((page) => {
            this.render.checkOutputs(page);
        });
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    checkOnOverlay() {
        let hasOverlayedElements = false;
        this.model.form.pages.forEach((page) => {
            page.allElements.forEach((element) => {
                let overlayedElements = page.allElements.filter((elem) => elem.x == element.x && elem.y == element.x);
                if (overlayedElements.length > 1) {
                    overlayedElements.forEach((overlayedElement, index) => {
                        if (index != 0) {
                            hasOverlayedElements = true;
                            overlayedElement.y += index;
                        }
                    });
                }
            });
        });
        if (hasOverlayedElements) {
            this.model.form.allElements.forEach((element) => {
                let container = this.model.getElementPage(element) ?? this.model.getElementPanel(element);
                this.render.insertElement(element, container.contentAreaWidth);
            });
        }
    }
    clearTimers() {
        this.isIncrement = false;
        this.isDecrement = false;
        clearTimeout(this.timeout);
        clearInterval(this.interval);
    }
    iterate() {
        if (this.isIncrement) {
            if (this.model.selectedPage) {
                this.model.selectedPage[this.property.property] += 1;
            }
            else {
                this.counter += 1;
            }
        }
        else if (this.isDecrement) {
            if (this.model.selectedPage) {
                this.model.selectedPage[this.property.property] -= 1;
            }
            else {
                this.counter -= 1;
            }
        }
    }
    setIncrementInterval() {
        this.isIncrement = true;
        this.iterate();
        let this_ = this;
        this.timeout = setTimeout(function () {
            this_.interval = setInterval(function () {
                this_.iterate();
            }, 50);
        }, 300);
    }
    setDecrementInterval() {
        this.isDecrement = true;
        this.iterate();
        let this_ = this;
        this.timeout = setTimeout(function () {
            this_.interval = setInterval(function () {
                this_.iterate();
            }, 50);
        }, 300);
    }
    get element() {
        return this.model.selectedComponent?.element ?? this.model.form.settings;
    }
    get counter() {
        if (this.property.property != "gridColumns" && this.property.property != "gridVerticalStep") {
            if (this.obj) {
                return this.helper.getProperty(this.obj, this.property.property)
                    ? parseFloat(this.helper.getProperty(this.obj, this.property.property))
                    : this.helper.getProperty(this.obj, this.property.property);
            }
            return this.helper.getProperty(this.element, this.property.property);
        }
        else {
            return this.gridCounter;
        }
    }
    validNegativeValue() {
        if (this.obj instanceof StiNumberBoxElement) {
            if (this.property.property == "value" ||
                this.property.property == "minimum" ||
                this.property.property == "maximum") {
                return true;
            }
            else
                return false;
        }
        else {
            return false;
        }
    }
    set counter(value) {
        if (value < 0 && !this.validNegativeValue()) {
            return;
        }
        if (this.property.property != "gridColumns" && this.property.property != "gridVerticalStep") {
            if (this.obj) {
                this.helper.setProperty(this.obj, this.property.property, value);
            }
            else {
                this.helper.setProperty(this.element, this.property.property, value);
                if (this.element instanceof StiNumberBoxElement && this.element.useRange && this.property.property == "value") {
                    this.model.checkNumberRange(this.element);
                }
            }
        }
        else {
            this.gridCounter = value;
            this.model.formEvents.next({ name: "ValueChanged" });
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiNumberEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiThemeService }, { token: StiLocalizationService }, { token: StiRectangleGeometryLayout }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiNumberEditorComponent, selector: "sti-number-editor", inputs: { property: "property", obj: "obj" }, viewQueries: [{ propertyName: "numberInput", first: true, predicate: ["numberInput"], descendants: true }], ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr *ngIf="property.type === 'pageNumberEditor'">
        <td colspan="5" [style]="{ width: '100%' }">
          <div class="number-box">
            <div class="value">
              <input
                type="number"
                [(ngModel)]="model.selectedPage[property.property]"
                class="p-inputnumber-button"
                [style]="{
                  width: '100%',
                  height: '100%',
                  fontSize: '12px',
                  fontWeight: '500',
                  padding: '3px 5px',
                  borderRadius: '3px'
                }"
              />
            </div>
            <div class="buttons">
              <div
                class="button-up"
                (mousedown)="setIncrementInterval()"
                (mouseup)="clearTimers()"
                (mouseleave)="clearTimers()"
              >
                <i class="pi pi-angle-up"></i>
              </div>
              <div
                class="button-down"
                (mousedown)="setDecrementInterval()"
                (mouseup)="clearTimers()"
                (mouseleave)="clearTimers()"
              >
                <i class="pi pi-angle-down"></i>
              </div>
            </div>
          </div>
        </td>
      </tr>

      <tr *ngIf="property.type === 'NumberEditor' || property.type === 'Number'">
        <td [colSpan]="this.property.property == 'label.width' ? 5 : 7">
          <div class="number-box">
            <div class="value">
              <input
                type="number"
                #numberInput
                (blur)="onLostFocus($event.currentTarget.value)"
                (keyup.enter)="onLostFocus($event.currentTarget.value)"
                [value]="counter"
                class="p-inputnumber-button"
                [style]="{
                  width: '100%',
                  height: '100%',
                  fontSize: '12px',
                  fontWeight: '500',
                  padding: '3px 5px',
                  borderRadius: '3px'
                }"
              />
            </div>
            <div class="buttons">
              <div
                class="button-up"
                (mousedown)="setIncrementInterval()"
                (mouseup)="clearTimers()"
                (mouseleave)="clearTimers()"
              >
                <i class="pi pi-angle-up"></i>
              </div>
              <div
                class="button-down"
                (mousedown)="setDecrementInterval()"
                (mouseup)="clearTimers()"
                (mouseleave)="clearTimers()"
              >
                <i class="pi pi-angle-down"></i>
              </div>
            </div>
          </div>
        </td>
        <td
          *ngIf="
            property.type === 'Number' &&
            (property.property == 'gridColumns' || property.property == 'gridVerticalStep')
          "
        >
          <div class="apply-button" (click)="applySettings()">
            <label>{{ loc.getP("Apply") }}</label>
          </div>
        </td>
      </tr>
    </table>

    <style>
      td {
        padding: 1px;
      }
      label {
        margin: 0;
        font-size: 12px;
        font-weight: 500;
        color: var(--text-color);
        white-space: nowrap;
        outline: none;
        overflow: hidden;
        scroll-behavior: smooth;
      }
      .apply-button {
        height: 24px;
        width: 100%;
        min-width: 60px;
        border-radius: 3px;
        background-color: var(--hover-color);
        display: flex;
        align-items: center;
        justify-content: center;
        margin-left: 3px;
      }
      .apply-button:hover {
        background-color: var(--active-color);
      }
      .value:hover {
        cursor: text;
      }
      .image-upload > input {
        display: none;
      }
      .number-box {
        width: 100%;
        height: 24px;
        border: 1px solid var(--inputBorder-color);
        border-radius: 3px;
        background-color: var(--input-color);
        position: relative;
        display: flex;
      }
      .value {
        outline: none;
        width: 100%;
        height: 100%;
      }
      .value input {
        outline: none;
        background-color: var(--input-color);
        -moz-appearance: textfield;
        color: var(--text-color);
        border: 0px;
      }
      .value input[type="number"]::-webkit-inner-spin-button,
      .value input[type="number"]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
        opacity: 0;
      }

      .value:after {
        content: "";
        position: absolute;
        right: 22px;
        z-index: 100;
        top: 2px;
        width: 1px;
        height: 18px;
        background-color: var(--inputBorder-color);
      }
      .buttons {
        width: 22px;
        height: 100%;
        align-self: flex-end;
        display: flex;
        flex-direction: column;

        color: rgb(186, 185, 184);
      }
      .button-up {
        width: 22px;
        position: relative;
        height: 11px;
        border-bottom: 1px solid var(--inputBorder-color);
        text-align: center;
      }
      .button-up:hover {
        background-color: rgb(209, 208, 207);
      }
      .button-up:active {
        background-color: rgb(195, 195, 195);
      }
      .button-down {
        width: 22px;
        position: relative;
        height: 11px;
        text-align: center;
      }
      .button-down:hover {
        background-color: rgb(209, 208, 207);
      }
      .button-down:active {
        background-color: rgb(195, 195, 195);
      }
      i {
        position: absolute;
        left: 5px;
        height: 8px;
        width: 10px;
      }
    </style>
  `, isInline: true, styles: ["\n      td {\n        padding: 1px;\n      }\n      label {\n        margin: 0;\n        font-size: 12px;\n        font-weight: 500;\n        color: var(--text-color);\n        white-space: nowrap;\n        outline: none;\n        overflow: hidden;\n        scroll-behavior: smooth;\n      }\n      .apply-button {\n        height: 24px;\n        width: 100%;\n        min-width: 60px;\n        border-radius: 3px;\n        background-color: var(--hover-color);\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        margin-left: 3px;\n      }\n      .apply-button:hover {\n        background-color: var(--active-color);\n      }\n      .value:hover {\n        cursor: text;\n      }\n      .image-upload > input {\n        display: none;\n      }\n      .number-box {\n        width: 100%;\n        height: 24px;\n        border: 1px solid var(--inputBorder-color);\n        border-radius: 3px;\n        background-color: var(--input-color);\n        position: relative;\n        display: flex;\n      }\n      .value {\n        outline: none;\n        width: 100%;\n        height: 100%;\n      }\n      .value input {\n        outline: none;\n        background-color: var(--input-color);\n        -moz-appearance: textfield;\n        color: var(--text-color);\n        border: 0px;\n      }\n      .value input[type=\"number\"]::-webkit-inner-spin-button,\n      .value input[type=\"number\"]::-webkit-outer-spin-button {\n        -webkit-appearance: none;\n        margin: 0;\n        opacity: 0;\n      }\n\n      .value:after {\n        content: \"\";\n        position: absolute;\n        right: 22px;\n        z-index: 100;\n        top: 2px;\n        width: 1px;\n        height: 18px;\n        background-color: var(--inputBorder-color);\n      }\n      .buttons {\n        width: 22px;\n        height: 100%;\n        align-self: flex-end;\n        display: flex;\n        flex-direction: column;\n\n        color: rgb(186, 185, 184);\n      }\n      .button-up {\n        width: 22px;\n        position: relative;\n        height: 11px;\n        border-bottom: 1px solid var(--inputBorder-color);\n        text-align: center;\n      }\n      .button-up:hover {\n        background-color: rgb(209, 208, 207);\n      }\n      .button-up:active {\n        background-color: rgb(195, 195, 195);\n      }\n      .button-down {\n        width: 22px;\n        position: relative;\n        height: 11px;\n        text-align: center;\n      }\n      .button-down:hover {\n        background-color: rgb(209, 208, 207);\n      }\n      .button-down:active {\n        background-color: rgb(195, 195, 195);\n      }\n      i {\n        position: absolute;\n        left: 5px;\n        height: 8px;\n        width: 10px;\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiNumberEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-number-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr *ngIf="property.type === 'pageNumberEditor'">
        <td colspan="5" [style]="{ width: '100%' }">
          <div class="number-box">
            <div class="value">
              <input
                type="number"
                [(ngModel)]="model.selectedPage[property.property]"
                class="p-inputnumber-button"
                [style]="{
                  width: '100%',
                  height: '100%',
                  fontSize: '12px',
                  fontWeight: '500',
                  padding: '3px 5px',
                  borderRadius: '3px'
                }"
              />
            </div>
            <div class="buttons">
              <div
                class="button-up"
                (mousedown)="setIncrementInterval()"
                (mouseup)="clearTimers()"
                (mouseleave)="clearTimers()"
              >
                <i class="pi pi-angle-up"></i>
              </div>
              <div
                class="button-down"
                (mousedown)="setDecrementInterval()"
                (mouseup)="clearTimers()"
                (mouseleave)="clearTimers()"
              >
                <i class="pi pi-angle-down"></i>
              </div>
            </div>
          </div>
        </td>
      </tr>

      <tr *ngIf="property.type === 'NumberEditor' || property.type === 'Number'">
        <td [colSpan]="this.property.property == 'label.width' ? 5 : 7">
          <div class="number-box">
            <div class="value">
              <input
                type="number"
                #numberInput
                (blur)="onLostFocus($event.currentTarget.value)"
                (keyup.enter)="onLostFocus($event.currentTarget.value)"
                [value]="counter"
                class="p-inputnumber-button"
                [style]="{
                  width: '100%',
                  height: '100%',
                  fontSize: '12px',
                  fontWeight: '500',
                  padding: '3px 5px',
                  borderRadius: '3px'
                }"
              />
            </div>
            <div class="buttons">
              <div
                class="button-up"
                (mousedown)="setIncrementInterval()"
                (mouseup)="clearTimers()"
                (mouseleave)="clearTimers()"
              >
                <i class="pi pi-angle-up"></i>
              </div>
              <div
                class="button-down"
                (mousedown)="setDecrementInterval()"
                (mouseup)="clearTimers()"
                (mouseleave)="clearTimers()"
              >
                <i class="pi pi-angle-down"></i>
              </div>
            </div>
          </div>
        </td>
        <td
          *ngIf="
            property.type === 'Number' &&
            (property.property == 'gridColumns' || property.property == 'gridVerticalStep')
          "
        >
          <div class="apply-button" (click)="applySettings()">
            <label>{{ loc.getP("Apply") }}</label>
          </div>
        </td>
      </tr>
    </table>

    <style>
      td {
        padding: 1px;
      }
      label {
        margin: 0;
        font-size: 12px;
        font-weight: 500;
        color: var(--text-color);
        white-space: nowrap;
        outline: none;
        overflow: hidden;
        scroll-behavior: smooth;
      }
      .apply-button {
        height: 24px;
        width: 100%;
        min-width: 60px;
        border-radius: 3px;
        background-color: var(--hover-color);
        display: flex;
        align-items: center;
        justify-content: center;
        margin-left: 3px;
      }
      .apply-button:hover {
        background-color: var(--active-color);
      }
      .value:hover {
        cursor: text;
      }
      .image-upload > input {
        display: none;
      }
      .number-box {
        width: 100%;
        height: 24px;
        border: 1px solid var(--inputBorder-color);
        border-radius: 3px;
        background-color: var(--input-color);
        position: relative;
        display: flex;
      }
      .value {
        outline: none;
        width: 100%;
        height: 100%;
      }
      .value input {
        outline: none;
        background-color: var(--input-color);
        -moz-appearance: textfield;
        color: var(--text-color);
        border: 0px;
      }
      .value input[type="number"]::-webkit-inner-spin-button,
      .value input[type="number"]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
        opacity: 0;
      }

      .value:after {
        content: "";
        position: absolute;
        right: 22px;
        z-index: 100;
        top: 2px;
        width: 1px;
        height: 18px;
        background-color: var(--inputBorder-color);
      }
      .buttons {
        width: 22px;
        height: 100%;
        align-self: flex-end;
        display: flex;
        flex-direction: column;

        color: rgb(186, 185, 184);
      }
      .button-up {
        width: 22px;
        position: relative;
        height: 11px;
        border-bottom: 1px solid var(--inputBorder-color);
        text-align: center;
      }
      .button-up:hover {
        background-color: rgb(209, 208, 207);
      }
      .button-up:active {
        background-color: rgb(195, 195, 195);
      }
      .button-down {
        width: 22px;
        position: relative;
        height: 11px;
        text-align: center;
      }
      .button-down:hover {
        background-color: rgb(209, 208, 207);
      }
      .button-down:active {
        background-color: rgb(195, 195, 195);
      }
      i {
        position: absolute;
        left: 5px;
        height: 8px;
        width: 10px;
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiThemeService }, { type: StiLocalizationService }, { type: StiRectangleGeometryLayout }], propDecorators: { numberInput: [{
                type: ViewChild,
                args: ["numberInput"]
            }], property: [{
                type: Input
            }], obj: [{
                type: Input
            }] } });

function RenderComponentsGeometry(containers, model) {
    let currentRightPoint = 0;
    let currentBottomPoint = 0;
    let maxContainerWidth;
    let maxContainerHeight;
    let paddingLeft;
    let paddingTop;
    let paddingBot;
    let paddingRight;
    let previousElement;
    let currentColumnWidth;
    let previousColumnWidth;
    let maxContainerWidthInColumns = 12;
    let columns;
    containers.forEach((container) => {
        maxContainerHeight = container.height;
        maxContainerWidth = container.contentAreaWidth;
        currentRightPoint = 0;
        currentBottomPoint = 0;
        paddingLeft = container.padding.left;
        paddingTop = container.padding.top;
        paddingBot = container.padding.bottom;
        paddingRight = container.padding.right;
        previousColumnWidth = (model.previousContentAreaWidth - 2) / maxContainerWidthInColumns;
        currentColumnWidth = (container.contentAreaWidth - 2) / maxContainerWidthInColumns;
        container.elements.forEach((element) => {
            if (element.render) {
                if (!element.hasGeometry) {
                    if (currentRightPoint == 0 && currentBottomPoint == 0) {
                        element.x = currentRightPoint;
                        element.y = currentBottomPoint;
                        element.hasGeometry = true;
                        currentRightPoint += element.width;
                    }
                    else {
                        if (currentRightPoint + element.width <= maxContainerWidth) {
                            element.x = currentRightPoint;
                            element.y = currentBottomPoint;
                            element.hasGeometry = true;
                            currentRightPoint += element.width;
                        }
                        else {
                            currentBottomPoint += previousElement.computedHeight;
                            currentRightPoint = 0;
                            element.x = currentRightPoint;
                            element.y = currentBottomPoint;
                            element.hasGeometry = true;
                            currentRightPoint += element.width;
                        }
                    }
                }
                else if (element.hasGeometry) {
                    if (container.contentAreaWidth != model.previousContentAreaWidth) {
                        if (element.x > 0) {
                            columns = Math.round(element.x / previousColumnWidth);
                            element.x = columns * currentColumnWidth;
                            columns = Math.round(element.width / previousColumnWidth);
                            element.width = columns * currentColumnWidth;
                        }
                        else {
                            columns = Math.round(element.width / previousColumnWidth);
                            element.width = columns * currentColumnWidth;
                        }
                    }
                    else {
                        if (currentRightPoint == 0 && currentBottomPoint == 0) {
                            currentRightPoint = element.x;
                            element.y = currentBottomPoint;
                            currentRightPoint += element.width;
                        }
                        else {
                            if (currentRightPoint <= element.x && element.x + element.width <= maxContainerWidth) {
                                currentRightPoint = element.x;
                                element.y = currentBottomPoint;
                                currentRightPoint += element.width;
                            }
                            else {
                                currentBottomPoint += previousElement.computedHeight;
                                currentRightPoint = element.x;
                                element.y = currentBottomPoint;
                                currentRightPoint += element.width;
                            }
                        }
                    }
                }
                previousElement = element;
            }
        });
    });
}

class StiPaperKindEditorComponent {
    constructor(model) {
        this.model = model;
        this.enum = PaperKind;
        this.kinds = StiPagePaperKind.availableStandardKinds();
        this.values = Object.values(this.kinds);
        this.obj = this.values.map((it) => PaperKind[it.kind]);
    }
    ngOnInit() { }
    get paperKind() {
        StiPagePaperKind.fromStandardPaperKind(9);
        return this.model.selectedPage[this.property.property];
    }
    get kind() {
        return this.model.selectedPage.paperKind.kind;
    }
    set kind(value) {
        this.model.selectedPage.paperKind = StiPagePaperKind.fromStandardPaperKind(value);
        RenderComponentsGeometry(this.model.form.pages, this.model);
        this.model.previousContentAreaWidth = this.model.selectedPage.contentAreaWidth;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPaperKindEditorComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiPaperKindEditorComponent, selector: "sti-paper-kind-editor", inputs: { property: "property" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr *ngIf="property.type === 'paperKind'">
        <td colspan="5" [style]="{ width: '100%' }">
          <sti-dropdown-editor
            [options]="values"
            [(value)]="kind"
            class="p-inputtext-sm"
            optionValue="kind"
            optionLabel="name"
            [style]="{ width: '100%', height: '24px' }"
          ></sti-dropdown-editor>
        </td>
      </tr>
    </table>
    <style>
      td {
        padding: 0;
      }
    </style>
  `, isInline: true, styles: ["\n      td {\n        padding: 0;\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiDropdownEditorComponent, selector: "sti-dropdown-editor", inputs: ["value", "options", "optionLabel", "optionValue", "editable"], outputs: ["valueChange"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPaperKindEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-paper-kind-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr *ngIf="property.type === 'paperKind'">
        <td colspan="5" [style]="{ width: '100%' }">
          <sti-dropdown-editor
            [options]="values"
            [(value)]="kind"
            class="p-inputtext-sm"
            optionValue="kind"
            optionLabel="name"
            [style]="{ width: '100%', height: '24px' }"
          ></sti-dropdown-editor>
        </td>
      </tr>
    </table>
    <style>
      td {
        padding: 0;
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { property: [{
                type: Input
            }] } });

class StiVerticalAlignmentEditorComponent {
    constructor(model, helper, theme, loc) {
        this.model = model;
        this.helper = helper;
        this.theme = theme;
        this.loc = loc;
        this.hasName = false;
        this.required = false;
    }
    get object() {
        return this.model.selectedComponent?.element ?? this.model.form.settings;
    }
    get alignment() {
        return this.helper.getProperty(this.object, this.property.property);
    }
    set alignment(value) {
        this.helper.setProperty(this.object, this.property.property, value);
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiVerticalAlignmentEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiThemeService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiVerticalAlignmentEditorComponent, selector: "sti-vertical-alignment-editor", inputs: { property: "property" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="2" [style]="{ width: '38%' }">
          <sti-selectButton
            [options]="helper.verticalAlignment"
            [(value)]="alignment"
            optionValue="value"
            [style]="{ height: '24px', minWidth: '90px' }"
          >
            <ng-template let-item>
              <img
                [src]="model.getImage(item.image)"
                [stiTooltip]="loc.getP(item.name)"
                tooltipPosition="bottom"
                showDelay="500"
                [style]="{ height: '16px', width: '16px' }"
              />
            </ng-template>
          </sti-selectButton>
        </td>
      </tr>
    </table>

    <style>
      input {
        font-size: 13px;
        font-weight: 600;
        padding: 2px 4px;
      }
      .valid {
        border-color: rgb(0, 128, 0);
      }
      td {
        padding: 0;
      }
    </style>
  `, isInline: true, styles: ["\n      input {\n        font-size: 13px;\n        font-weight: 600;\n        padding: 2px 4px;\n      }\n      .valid {\n        border-color: rgb(0, 128, 0);\n      }\n      td {\n        padding: 0;\n      }\n    "], dependencies: [{ kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }, { kind: "component", type: StiSelectButtonComponent, selector: "sti-selectButton", inputs: ["options", "value", "optionLabel", "optionValue", "multiple", "disabled"], outputs: ["onOptionClick", "onChange", "valueChange"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiVerticalAlignmentEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-vertical-alignment-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="2" [style]="{ width: '38%' }">
          <sti-selectButton
            [options]="helper.verticalAlignment"
            [(value)]="alignment"
            optionValue="value"
            [style]="{ height: '24px', minWidth: '90px' }"
          >
            <ng-template let-item>
              <img
                [src]="model.getImage(item.image)"
                [stiTooltip]="loc.getP(item.name)"
                tooltipPosition="bottom"
                showDelay="500"
                [style]="{ height: '16px', width: '16px' }"
              />
            </ng-template>
          </sti-selectButton>
        </td>
      </tr>
    </table>

    <style>
      input {
        font-size: 13px;
        font-weight: 600;
        padding: 2px 4px;
      }
      .valid {
        border-color: rgb(0, 128, 0);
      }
      td {
        padding: 0;
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiThemeService }, { type: StiLocalizationService }], propDecorators: { property: [{
                type: Input
            }] } });

class StiTextEditorComponent {
    constructor(model, helper, theme, expressionService) {
        this.model = model;
        this.helper = helper;
        this.theme = theme;
        this.expressionService = expressionService;
    }
    ngOnInit() { }
    get haveExpression() {
        return (this.model.selectedComponent?.element instanceof StiLabelElement &&
            this.property.property == "text.value") ||
            (this.model.selectedComponent?.element instanceof StiTableElement && this.property.property == "expression")
            ? true
            : false;
    }
    setInfo() {
        if (this.object instanceof StiLabelElement) {
            this.model.currentExpressionInfo = 3;
        }
        else if (this.object instanceof StiTotalsFieldItem) {
            this.model.currentExpressionInfo = 2;
        }
        else {
            this.model.currentExpressionInfo = 1;
        }
        this.expressionService.currentSelectedObject = this.object;
        this.model.showExpressionEditor = true;
    }
    get content() {
        return this.helper.getProperty(this.object, this.property.property);
    }
    set content(value) {
        if (this.property.property == "customOptionText") {
            if (this.object instanceof StiSingleSelectionElement) {
                if (this.object.selectedOption == this.object.customOptionText) {
                    this.object.selectedOption = value;
                }
            }
            else if (this.object instanceof StiMultipleSelectionElement) {
                if (this.object.selectedOptions.indexOf(this.object?.customOptionText) >= 0) {
                    this.object.selectedOptions?.forEach((option) => {
                        if (this.object.options?.indexOf(option) == -1) {
                            this.object.selectedOptions?.splice(this.object.selectedOptions.indexOf(option), 1);
                        }
                    });
                    this.object.selectedOptions.push(value);
                }
            }
        }
        this.helper.setProperty(this.object, this.property.property, value);
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTextEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiThemeService }, { token: StiExpressionService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTextEditorComponent, selector: "sti-text-editor", inputs: { property: "property", object: "object", disabled: "disabled" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr *ngIf="property.property != 'font' && content?.length >= 0">
        <td colspan="7" [style.width]="'100%'">
          <input
            type="text"
            stiInputText
            [stiTooltip]="property.tooltip"
            [(ngModel)]="content"
            class="{{ disabled ? 'disabled' : '' }}"
            spellcheck="false"
            [style]="{ width: '100%' }"
            [attr.maxLength]="
              property.property == 'this' && this.model.selectedComponent.element.maximum
                ? this.model.selectedComponent.element.maximum
                : null
            "
          />
        </td>
        <td *ngIf="haveExpression">
          <div class="expression-image" (click)="setInfo()">
            <img [src]="model.getImage('images.Properties.Expression.png')" />
          </div>
        </td>
      </tr>
    </table>
    <style>
      tr {
        padding: 3px 0px 3px 0px;
      }
      td {
        padding: 0;
      }
      .disabled {
        background-color: lightgray;
        pointer-events: none;
      }
      .expression-image {
        height: 23.6px;
        width: 23.6px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        border: 1px solid var(--inputBorder-color);
        border-radius: 3px;
        margin-left: 3px;
        margin-right: 0px;
        float: right;
      }
      img {
        height: 16px;
        width: 16px;
      }
      .expression-image:hover {
        background-color: var(--hover-color);
      }
    </style>
  `, isInline: true, styles: ["\n      tr {\n        padding: 3px 0px 3px 0px;\n      }\n      td {\n        padding: 0;\n      }\n      .disabled {\n        background-color: lightgray;\n        pointer-events: none;\n      }\n      .expression-image {\n        height: 23.6px;\n        width: 23.6px;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        cursor: pointer;\n        border: 1px solid var(--inputBorder-color);\n        border-radius: 3px;\n        margin-left: 3px;\n        margin-right: 0px;\n        float: right;\n      }\n      img {\n        height: 16px;\n        width: 16px;\n      }\n      .expression-image:hover {\n        background-color: var(--hover-color);\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: StiInputTextDirective, selector: "[stiInputText]" }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTextEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-text-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr *ngIf="property.property != 'font' && content?.length >= 0">
        <td colspan="7" [style.width]="'100%'">
          <input
            type="text"
            stiInputText
            [stiTooltip]="property.tooltip"
            [(ngModel)]="content"
            class="{{ disabled ? 'disabled' : '' }}"
            spellcheck="false"
            [style]="{ width: '100%' }"
            [attr.maxLength]="
              property.property == 'this' && this.model.selectedComponent.element.maximum
                ? this.model.selectedComponent.element.maximum
                : null
            "
          />
        </td>
        <td *ngIf="haveExpression">
          <div class="expression-image" (click)="setInfo()">
            <img [src]="model.getImage('images.Properties.Expression.png')" />
          </div>
        </td>
      </tr>
    </table>
    <style>
      tr {
        padding: 3px 0px 3px 0px;
      }
      td {
        padding: 0;
      }
      .disabled {
        background-color: lightgray;
        pointer-events: none;
      }
      .expression-image {
        height: 23.6px;
        width: 23.6px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        border: 1px solid var(--inputBorder-color);
        border-radius: 3px;
        margin-left: 3px;
        margin-right: 0px;
        float: right;
      }
      img {
        height: 16px;
        width: 16px;
      }
      .expression-image:hover {
        background-color: var(--hover-color);
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiThemeService }, { type: StiExpressionService }], propDecorators: { property: [{
                type: Input
            }], object: [{
                type: Input
            }], disabled: [{
                type: Input
            }] } });

class StiNameEditorComponent {
    constructor(model) {
        this.model = model;
        this.hasName = false;
        this.required = false;
    }
    get name() {
        return (this.model.selectedComponent?.element[this.property.property] ?? (this.model.selectedPage ? this.model.selectedPage[this.property.property] : ""));
    }
    ngOnInit() { }
    onInput(name) {
        this.hasName = false;
        this.required = false;
        if (name) {
            this.nameEditor.nativeElement?.classList.remove("ng-invalid");
            this.model.form.pages.forEach((page) => {
                if (page.name == name && page != this.model.selectedPage) {
                    this.hasName = true;
                }
                page.allElements.forEach((element) => {
                    if (element.name == name && element != this.model.selectedComponent.element) {
                        this.hasName = true;
                    }
                });
            });
            if (this.hasName == false && this.isValid(name)) {
                if (this.model.selectedPage) {
                    this.model.selectedPage.name = name;
                }
                else {
                    this.model.selectedComponent.element.name = name;
                }
                this.nameEditor.nativeElement?.classList.remove("ng-invalid");
            }
            else {
                this.nameEditor.nativeElement?.classList.add("ng-invalid");
            }
        }
        else {
            this.required = true;
            this.nameEditor.nativeElement?.classList.add("ng-invalid");
        }
    }
    onFocus() {
        this.nameEditor.nativeElement?.classList.add("valid");
    }
    onBlur() {
        this.nameEditor.nativeElement?.classList.remove("valid");
    }
    isValid(name) {
        let valid = true;
        let chars = name.trim().split("");
        let isValid = true;
        chars.forEach((char) => {
            if (!this.isLetterOrDigit(char)) {
                valid = false;
            }
        });
        return valid;
    }
    isLetterOrDigit(char) {
        let numberPattern = new RegExp(/^\d+$/);
        let isNumber = numberPattern.test(char);
        let isDivider = char == "-" || char == "_";
        return char.toLowerCase() != char.toUpperCase() || isNumber || isDivider;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiNameEditorComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiNameEditorComponent, selector: "sti-name-editor", inputs: { property: "property" }, viewQueries: [{ propertyName: "nameEditor", first: true, predicate: ["nameEditor"], descendants: true }], ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr *ngIf="property.type === 'nameEditor'">
        <td colspan="7">
          <input
            type="text"
            #nameEditor
            stiInputText
            [ngModel]="name"
            spellcheck="false"
            (input)="onInput($event.target.value)"
            (focus)="onFocus()"
            (blur)="onBlur()"
            [style]="{ width: '100%' }"
          />
          <span style="color: #a80000; vertical-align:middle;" *ngIf="hasName">Name is used.</span>
          <span style="color: #a80000; vertical-align:middle;" *ngIf="required">This field is required.</span>
        </td>
      </tr>

      <tr></tr>
    </table>

    <style>
      input {
        font-size: 12px;
        font-weight: 500;
        padding: 3px 5px;
      }
      .valid {
        border-color: rgb(0, 128, 0);
      }
      td {
        padding: 0;
      }
    </style>
  `, isInline: true, styles: ["\n      input {\n        font-size: 12px;\n        font-weight: 500;\n        padding: 3px 5px;\n      }\n      .valid {\n        border-color: rgb(0, 128, 0);\n      }\n      td {\n        padding: 0;\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: StiInputTextDirective, selector: "[stiInputText]" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiNameEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-name-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr *ngIf="property.type === 'nameEditor'">
        <td colspan="7">
          <input
            type="text"
            #nameEditor
            stiInputText
            [ngModel]="name"
            spellcheck="false"
            (input)="onInput($event.target.value)"
            (focus)="onFocus()"
            (blur)="onBlur()"
            [style]="{ width: '100%' }"
          />
          <span style="color: #a80000; vertical-align:middle;" *ngIf="hasName">Name is used.</span>
          <span style="color: #a80000; vertical-align:middle;" *ngIf="required">This field is required.</span>
        </td>
      </tr>

      <tr></tr>
    </table>

    <style>
      input {
        font-size: 12px;
        font-weight: 500;
        padding: 3px 5px;
      }
      .valid {
        border-color: rgb(0, 128, 0);
      }
      td {
        padding: 0;
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { property: [{
                type: Input
            }], nameEditor: [{
                type: ViewChild,
                args: ["nameEditor"]
            }] } });

class StiHorizontalAlignmentEditorComponent {
    constructor(model, helper, theme, loc) {
        this.model = model;
        this.helper = helper;
        this.theme = theme;
        this.loc = loc;
        this.hasName = false;
        this.required = false;
    }
    get alignment() {
        return this.helper.getProperty(this.object, this.property.property);
    }
    set alignment(value) {
        this.helper.setProperty(this.object, this.property.property, value);
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiHorizontalAlignmentEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiThemeService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiHorizontalAlignmentEditorComponent, selector: "sti-horizontal-alignment-editor", inputs: { property: "property", object: "object" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="2" [style]="{ width: '38%' }">
          <sti-selectButton
            [options]="helper.justifyOptions"
            [(value)]="alignment"
            optionValue="value"
            [style]="{ height: '24px', minWidth: '90px' }"
          >
            <ng-template let-item>
              <img
                [src]="model.getImage(item.image)"
                [stiTooltip]="loc.getP(item.name)"
                tooltipPosition="bottom"
                showDelay="500"
                [style]="{ height: '16px', width: '16px' }"
              />
            </ng-template>
          </sti-selectButton>
        </td>
      </tr>
    </table>

    <style>
      td {
        padding: 0;
      }
      input {
        font-size: 13px;
        font-weight: 600;
        padding: 2px 4px;
      }
      .valid {
        border-color: rgb(0, 128, 0);
      }
    </style>
  `, isInline: true, styles: ["\n      td {\n        padding: 0;\n      }\n      input {\n        font-size: 13px;\n        font-weight: 600;\n        padding: 2px 4px;\n      }\n      .valid {\n        border-color: rgb(0, 128, 0);\n      }\n    "], dependencies: [{ kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }, { kind: "component", type: StiSelectButtonComponent, selector: "sti-selectButton", inputs: ["options", "value", "optionLabel", "optionValue", "multiple", "disabled"], outputs: ["onOptionClick", "onChange", "valueChange"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiHorizontalAlignmentEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-horizontal-alignment-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="2" [style]="{ width: '38%' }">
          <sti-selectButton
            [options]="helper.justifyOptions"
            [(value)]="alignment"
            optionValue="value"
            [style]="{ height: '24px', minWidth: '90px' }"
          >
            <ng-template let-item>
              <img
                [src]="model.getImage(item.image)"
                [stiTooltip]="loc.getP(item.name)"
                tooltipPosition="bottom"
                showDelay="500"
                [style]="{ height: '16px', width: '16px' }"
              />
            </ng-template>
          </sti-selectButton>
        </td>
      </tr>
    </table>

    <style>
      td {
        padding: 0;
      }
      input {
        font-size: 13px;
        font-weight: 600;
        padding: 2px 4px;
      }
      .valid {
        border-color: rgb(0, 128, 0);
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiThemeService }, { type: StiLocalizationService }], propDecorators: { property: [{
                type: Input
            }], object: [{
                type: Input
            }] } });

class StiLabelAlignmentEditorComponent {
    constructor(model, helper, theme, render, loc) {
        this.model = model;
        this.helper = helper;
        this.theme = theme;
        this.render = render;
        this.loc = loc;
        this.hasName = false;
        this.required = false;
        this.prop = { type: "verticalAlignment", property: "label.verticalAlignment", label: "verticalAlignment" };
    }
    get hasVerticalAlignment() {
        return !(this.obj instanceof StiFormSettings) && this.obj.label?.isUnchangedVAlign() ? false : true;
    }
    get obj() {
        return this.model.selectedComponent?.element ?? this.model.form.settings;
    }
    get verticalAlignment() {
        return this.helper.getProperty(this.obj, this.prop.property);
    }
    set verticalAlignment(value) {
        this.helper.setProperty(this.obj, this.prop.property, value);
    }
    get alignment() {
        return this.helper.getProperty(this.obj, this.property.property);
    }
    set alignment(value) {
        this.helper.setProperty(this.obj, this.property.property, value);
        this.model.needToRefresh.next(true);
    }
    get isTopAlignment() {
        return this.alignment && this.alignment == StiLabelAlignment.Top ? true : false;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiLabelAlignmentEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiThemeService }, { token: StiRectangleGeometryLayout }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiLabelAlignmentEditorComponent, selector: "sti-label-alignment-editor", inputs: { property: "property" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="2" [style]="{ width: '38%' }">
          <sti-selectButton
            [options]="helper.labelAlignment"
            [(value)]="alignment"
            optionValue="value"
            [style]="{ height: '24px', minWidth: '90px' }"
          >
            <ng-template let-item>
              <img
                [src]="model.getImage(item.image)"
                [stiTooltip]="loc.getP(item.name)"
                tooltipPosition="bottom"
                showDelay="500"
                [style]="{ height: '16px', width: '16px' }"
              />
            </ng-template>
          </sti-selectButton>
        </td>
      </tr>
    </table>
    <table
      [style.margin-top.px]="2"
      *ngIf="!isTopAlignment && hasVerticalAlignment"
      class="sti-clear"
      [style]="{ width: '100%' }"
    >
      <tr>
        <td colspan="2" [style]="{ width: '38%' }">
          <sti-selectButton
            [options]="helper.verticalAlignment"
            [(value)]="verticalAlignment"
            optionValue="value"
            [style]="{ height: '24px', minWidth: '90px' }"
          >
            <ng-template let-item>
              <img
                [src]="model.getImage(item.image)"
                [stiTooltip]="loc.getP(item.name)"
                tooltipPosition="bottom"
                showDelay="500"
                [style]="{ height: '16px', width: '16px' }"
              />
            </ng-template>
          </sti-selectButton>
        </td>
      </tr>
    </table>

    <style>
      td {
        padding: 0;
      }
      input {
        font-size: 13px;
        font-weight: 600;
        padding: 2px 4px;
      }
      .valid {
        border-color: rgb(0, 128, 0);
      }
    </style>
  `, isInline: true, styles: ["\n      td {\n        padding: 0;\n      }\n      input {\n        font-size: 13px;\n        font-weight: 600;\n        padding: 2px 4px;\n      }\n      .valid {\n        border-color: rgb(0, 128, 0);\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }, { kind: "component", type: StiSelectButtonComponent, selector: "sti-selectButton", inputs: ["options", "value", "optionLabel", "optionValue", "multiple", "disabled"], outputs: ["onOptionClick", "onChange", "valueChange"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiLabelAlignmentEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-label-alignment-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="2" [style]="{ width: '38%' }">
          <sti-selectButton
            [options]="helper.labelAlignment"
            [(value)]="alignment"
            optionValue="value"
            [style]="{ height: '24px', minWidth: '90px' }"
          >
            <ng-template let-item>
              <img
                [src]="model.getImage(item.image)"
                [stiTooltip]="loc.getP(item.name)"
                tooltipPosition="bottom"
                showDelay="500"
                [style]="{ height: '16px', width: '16px' }"
              />
            </ng-template>
          </sti-selectButton>
        </td>
      </tr>
    </table>
    <table
      [style.margin-top.px]="2"
      *ngIf="!isTopAlignment && hasVerticalAlignment"
      class="sti-clear"
      [style]="{ width: '100%' }"
    >
      <tr>
        <td colspan="2" [style]="{ width: '38%' }">
          <sti-selectButton
            [options]="helper.verticalAlignment"
            [(value)]="verticalAlignment"
            optionValue="value"
            [style]="{ height: '24px', minWidth: '90px' }"
          >
            <ng-template let-item>
              <img
                [src]="model.getImage(item.image)"
                [stiTooltip]="loc.getP(item.name)"
                tooltipPosition="bottom"
                showDelay="500"
                [style]="{ height: '16px', width: '16px' }"
              />
            </ng-template>
          </sti-selectButton>
        </td>
      </tr>
    </table>

    <style>
      td {
        padding: 0;
      }
      input {
        font-size: 13px;
        font-weight: 600;
        padding: 2px 4px;
      }
      .valid {
        border-color: rgb(0, 128, 0);
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiThemeService }, { type: StiRectangleGeometryLayout }, { type: StiLocalizationService }], propDecorators: { property: [{
                type: Input
            }] } });

const SlideInOutAnimation = [
    trigger("slideInOut", [
        state("in", style({
            "max-height": "600px",
            /* opacity: "1", */
            visibility: "visible",
            overflow: "initial",
        })),
        state("out", style({
            "max-height": "0px",
            /* opacity: "0", */
            visibility: "hidden",
            overflow: "hidden",
        })),
        transition("in => out", [
            group([
                /*  animate(
                  "500ms ease-in-out",
                  style({
                    opacity: "0",
                  })
                ), */
                animate("300ms ease-in-out", style({
                    "max-height": "0px",
                })),
                animate("200ms ease-in-out", style({
                    visibility: "hidden",
                    overflow: "hidden",
                })),
            ]),
        ]),
        transition("out => in", [
            group([
                animate("650ms ease-in-out", style({
                    visibility: "visible",
                    overflow: "initial",
                })),
                animate("450ms ease-in-out", style({
                    "max-height": 600,
                })),
                /* animate(
                  "500ms ease-in-out",
                  style({
                    opacity: "1",
                  })
                ), */
            ]),
        ]),
    ]),
];
const RotateAnimation = [
    trigger("rotatedState", [
        state("default", style({ transform: "rotate(0)" })),
        state("rotated", style({ transform: "rotate(90deg)" })),
        transition("rotated => default", animate("300ms linear")),
        transition("default => rotated", animate("300ms linear")),
    ]),
];
const fileNavigationAnimation = [
    trigger("fileNavigation", [
        state("in", style({
            width: "170px",
            visibility: "visible",
        })),
        state("out", style({
            width: "0px",
            visibility: "hidden",
        })),
        transition("* => in", [animate("100ms")]),
        transition("* => out", [animate("100ms")]),
    ]),
];

class StiBorderSidesEditorComponent {
    constructor(model, helper, theme, loc) {
        this.model = model;
        this.helper = helper;
        this.theme = theme;
        this.loc = loc;
    }
    get borderAlignments() {
        let alignments = this.helper.getProperty(this.model.selectedComponent.element, this.property.property);
        return alignments.values;
    }
    set borderAlignments(value) {
        this.helper.getProperty(this.model.selectedComponent.element, this.property.property).addValues(value);
    }
    setAll() {
        if (this.object instanceof StiBorder) {
            this.object.drawTop = true;
            this.object.drawLeft = true;
            this.object.drawBottom = true;
            this.object.drawRight = true;
        }
        else if (this.object instanceof StiInnerBorder) {
            this.object.drawHorizontal = true;
            this.object.drawVertical = true;
        }
    }
    setNone() {
        if (this.object instanceof StiBorder) {
            this.object.drawTop = false;
            this.object.drawLeft = false;
            this.object.drawBottom = false;
            this.object.drawRight = false;
        }
        else if (this.object instanceof StiInnerBorder) {
            this.object.drawHorizontal = false;
            this.object.drawVertical = false;
        }
    }
    changeState(value) {
        this.object[value] = !this.object[value];
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBorderSidesEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiThemeService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiBorderSidesEditorComponent, selector: "sti-border-sides-editor", inputs: { property: "property", object: "object" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="7" *ngIf="property.property != 'gridLines'">
          <div class="button-group">
            <div
              class="button {{
                object.drawTop && object.drawLeft && object.drawBottom && object.drawRight ? 'active' : ''
              }}"
              [stiTooltip]="loc.get2('PropertyEnum', 'ChartGridLinesAll')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="setAll()"
            >
              <img [src]="theme.getIcon('All')" alt="" />
            </div>
            <div
              class="button {{
                !object.drawTop && !object.drawLeft && !object.drawBottom && !object.drawRight ? 'active' : ''
              }}"
              [stiTooltip]="loc.get2('PropertyEnum', 'BorderStyleNone')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="setNone()"
            >
              <img [src]="theme.getIcon('None')" alt="" />
            </div>
            <div
              class="button {{ object.drawTop ? 'active' : '' }}"
              [stiTooltip]="loc.getP('Top')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawTop')"
            >
              <img [src]="theme.getIcon('Top')" alt="" />
            </div>
            <div
              class="button {{ object.drawLeft ? 'active' : '' }}"
              [stiTooltip]="loc.getP('Left')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawLeft')"
            >
              <img [src]="theme.getIcon('Left')" alt="" />
            </div>
            <div
              class="button {{ object.drawBottom ? 'active' : '' }}"
              [stiTooltip]="loc.getP('Bottom')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawBottom')"
            >
              <img [src]="theme.getIcon('Bottom')" alt="" />
            </div>
            <div
              class="button {{ object.drawRight ? 'active' : '' }}"
              [stiTooltip]="loc.getP('Right')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawRight')"
            >
              <img [src]="theme.getIcon('Right')" alt="" />
            </div>
          </div>
        </td>
        <td colspan="7" *ngIf="property.property == 'gridLines'">
          <div class="button-group">
            <div
              class="button {{ object.drawHorizontal && object.drawVertical ? 'active' : '' }}"
              [stiTooltip]="loc.get2('PropertyEnum', 'ChartGridLinesAll')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="setAll()"
            >
              <img [src]="theme.getIcon('GridAll')" alt="" />
            </div>
            <div
              class="button {{ !object.drawHorizontal && !object.drawVertical ? 'active' : '' }}"
              [stiTooltip]="loc.get2('PropertyEnum', 'BorderStyleNone')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="setNone()"
            >
              <img [src]="theme.getIcon('GridNone')" alt="" />
            </div>
            <div
              class="button {{ object.drawHorizontal ? 'active' : '' }}"
              [stiTooltip]="loc.get2('PropertyEnum', 'StiOrientationHorizontal')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawHorizontal')"
            >
              <img [src]="theme.getIcon('Horizontal')" alt="" />
            </div>
            <div
              class="button {{ object.drawVertical ? 'active' : '' }}"
              [stiTooltip]="loc.get2('PropertyEnum', 'StiOrientationVertical')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawVertical')"
            >
              <img [src]="theme.getIcon('Vertical')" alt="" />
            </div>
          </div>
        </td>
      </tr>
    </table>
    <style>
      td {
        text-align: end;
      }
      tr {
        padding: 3px 0px 3px 0px;
      }
      .active {
        background-color: var(--active-color) !important;
      }
      .active:hover {
        background-color: var(--active-color) !important;
      }
      .button-group {
        display: flex;
        width: 100%;
        flex-direction: row;
        justify-content: start;
      }
      .button {
        height: 22px;
        width: 28px;
        background-color: var(--back-color);
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .button img {
        height: 16px;
        width: 16px;
      }
      .button:hover {
        background-color: var(--hover-color);
      }
      .button:active {
        background-color: var(--active-color);
      }
      .draw-grid-all {
        background: var(--gridAll-icon);
      }
      .draw-grid-none {
        background: var(--gridNone-icon);
      }
      .draw-horizontal {
        background: var(--gridHorizontal-icon);
      }
      .draw-vertical {
        background: var(--gridVertical-icon);
      }
    </style>
  `, isInline: true, styles: ["\n      td {\n        text-align: end;\n      }\n      tr {\n        padding: 3px 0px 3px 0px;\n      }\n      .active {\n        background-color: var(--active-color) !important;\n      }\n      .active:hover {\n        background-color: var(--active-color) !important;\n      }\n      .button-group {\n        display: flex;\n        width: 100%;\n        flex-direction: row;\n        justify-content: start;\n      }\n      .button {\n        height: 22px;\n        width: 28px;\n        background-color: var(--back-color);\n        display: flex;\n        align-items: center;\n        justify-content: center;\n      }\n      .button img {\n        height: 16px;\n        width: 16px;\n      }\n      .button:hover {\n        background-color: var(--hover-color);\n      }\n      .button:active {\n        background-color: var(--active-color);\n      }\n      .draw-grid-all {\n        background: var(--gridAll-icon);\n      }\n      .draw-grid-none {\n        background: var(--gridNone-icon);\n      }\n      .draw-horizontal {\n        background: var(--gridHorizontal-icon);\n      }\n      .draw-vertical {\n        background: var(--gridVertical-icon);\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBorderSidesEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-border-sides-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="7" *ngIf="property.property != 'gridLines'">
          <div class="button-group">
            <div
              class="button {{
                object.drawTop && object.drawLeft && object.drawBottom && object.drawRight ? 'active' : ''
              }}"
              [stiTooltip]="loc.get2('PropertyEnum', 'ChartGridLinesAll')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="setAll()"
            >
              <img [src]="theme.getIcon('All')" alt="" />
            </div>
            <div
              class="button {{
                !object.drawTop && !object.drawLeft && !object.drawBottom && !object.drawRight ? 'active' : ''
              }}"
              [stiTooltip]="loc.get2('PropertyEnum', 'BorderStyleNone')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="setNone()"
            >
              <img [src]="theme.getIcon('None')" alt="" />
            </div>
            <div
              class="button {{ object.drawTop ? 'active' : '' }}"
              [stiTooltip]="loc.getP('Top')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawTop')"
            >
              <img [src]="theme.getIcon('Top')" alt="" />
            </div>
            <div
              class="button {{ object.drawLeft ? 'active' : '' }}"
              [stiTooltip]="loc.getP('Left')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawLeft')"
            >
              <img [src]="theme.getIcon('Left')" alt="" />
            </div>
            <div
              class="button {{ object.drawBottom ? 'active' : '' }}"
              [stiTooltip]="loc.getP('Bottom')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawBottom')"
            >
              <img [src]="theme.getIcon('Bottom')" alt="" />
            </div>
            <div
              class="button {{ object.drawRight ? 'active' : '' }}"
              [stiTooltip]="loc.getP('Right')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawRight')"
            >
              <img [src]="theme.getIcon('Right')" alt="" />
            </div>
          </div>
        </td>
        <td colspan="7" *ngIf="property.property == 'gridLines'">
          <div class="button-group">
            <div
              class="button {{ object.drawHorizontal && object.drawVertical ? 'active' : '' }}"
              [stiTooltip]="loc.get2('PropertyEnum', 'ChartGridLinesAll')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="setAll()"
            >
              <img [src]="theme.getIcon('GridAll')" alt="" />
            </div>
            <div
              class="button {{ !object.drawHorizontal && !object.drawVertical ? 'active' : '' }}"
              [stiTooltip]="loc.get2('PropertyEnum', 'BorderStyleNone')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="setNone()"
            >
              <img [src]="theme.getIcon('GridNone')" alt="" />
            </div>
            <div
              class="button {{ object.drawHorizontal ? 'active' : '' }}"
              [stiTooltip]="loc.get2('PropertyEnum', 'StiOrientationHorizontal')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawHorizontal')"
            >
              <img [src]="theme.getIcon('Horizontal')" alt="" />
            </div>
            <div
              class="button {{ object.drawVertical ? 'active' : '' }}"
              [stiTooltip]="loc.get2('PropertyEnum', 'StiOrientationVertical')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawVertical')"
            >
              <img [src]="theme.getIcon('Vertical')" alt="" />
            </div>
          </div>
        </td>
      </tr>
    </table>
    <style>
      td {
        text-align: end;
      }
      tr {
        padding: 3px 0px 3px 0px;
      }
      .active {
        background-color: var(--active-color) !important;
      }
      .active:hover {
        background-color: var(--active-color) !important;
      }
      .button-group {
        display: flex;
        width: 100%;
        flex-direction: row;
        justify-content: start;
      }
      .button {
        height: 22px;
        width: 28px;
        background-color: var(--back-color);
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .button img {
        height: 16px;
        width: 16px;
      }
      .button:hover {
        background-color: var(--hover-color);
      }
      .button:active {
        background-color: var(--active-color);
      }
      .draw-grid-all {
        background: var(--gridAll-icon);
      }
      .draw-grid-none {
        background: var(--gridNone-icon);
      }
      .draw-horizontal {
        background: var(--gridHorizontal-icon);
      }
      .draw-vertical {
        background: var(--gridVertical-icon);
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiThemeService }, { type: StiLocalizationService }], propDecorators: { property: [{
                type: Input
            }], object: [{
                type: Input
            }] } });

class StiTableBorderEditorComponent {
    constructor(model, helper, theme, loc) {
        this.model = model;
        this.helper = helper;
        this.theme = theme;
        this.loc = loc;
        this.properties = [];
    }
    ngOnInit() {
        this.properties = [];
        this.properties.push({
            type: "borderAlignment",
            property: this.getProperty(this.property.property),
            label: this.loc.getP("Sides"),
        });
        this.properties.push({ type: "color", property: "color", label: this.loc.getP("Color") });
        this.properties.push({ type: "Number", property: "width", label: this.loc.getP("LineWidth") });
        this.properties.push({ type: "enum", property: "style", label: this.loc.getP("Style") });
        //
    }
    getProperty(property) {
        if (property == "showBorderEditor") {
            return "border";
        }
        else if (property == "showColumnsBorderEditor") {
            return "columnHeadersBorder";
        }
        else if (property == "showRowsBorderEditor") {
            return "rowHeadersBorder";
        }
        else {
            return "gridLines";
        }
    }
    get content() {
        return this.helper.getProperty(this.model.selectedComponent.element, this.property.property);
    }
    set content(value) {
        this.helper.setProperty(this.model.selectedComponent.element, this.property.property, value);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableBorderEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiThemeService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTableBorderEditorComponent, selector: "sti-table-border-editor", inputs: { property: "property", state: "state", object: "object" }, ngImport: i0, template: `
    <div [@slideInOut]="state ? 'in' : 'out'" class="border-editor">
      <table class="sti-clear" [style]="{ width: '100%' }">
        <tr *ngFor="let prop of properties; index as i">
          <td *ngIf="prop.label">
            <div class="label" [style.margin-top.px]="i == '0' ? 5 : 0">
              {{ prop.label }}
            </div>
          </td>
          <td>
            <sti-border-sides-editor
              *ngIf="prop.type === 'borderAlignment'"
              [property]="prop"
              [object]="object"
              [style]="{ width: '95%' }"
            ></sti-border-sides-editor>
            <sti-color-editor
              *ngIf="prop.type === 'color'"
              [property]="prop"
              [style]="{ width: '95%' }"
              [obj]="object?.pen"
            ></sti-color-editor>
            <sti-enum-editor
              *ngIf="prop.type === 'enum'"
              [property]="prop"
              [style]="{ width: '95%' }"
              [object]="object?.pen"
            ></sti-enum-editor>
            <sti-number-editor *ngIf="prop.type === 'Number'" [obj]="object?.pen" [property]="prop"></sti-number-editor>
          </td>
        </tr>
      </table>
    </div>
    <style>
      tr {
        padding: 3px 0px 3px 0px;
      }
      .label {
        font-size: 13px;
        font-weight: normal;
        min-width: 150px;
        white-space: nowrap;
        color: var(--property-label-color);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }
      .border-editor {
        overflow: hidden;
      }
    </style>
  `, isInline: true, styles: ["\n      tr {\n        padding: 3px 0px 3px 0px;\n      }\n      .label {\n        font-size: 13px;\n        font-weight: normal;\n        min-width: 150px;\n        white-space: nowrap;\n        color: var(--property-label-color);\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n      }\n      .border-editor {\n        overflow: hidden;\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiColorEditorComponent, selector: "sti-color-editor", inputs: ["property", "textColor", "obj"] }, { kind: "component", type: StiEnumEditorComponent, selector: "sti-enum-editor", inputs: ["property", "object", "index"] }, { kind: "component", type: StiNumberEditorComponent, selector: "sti-number-editor", inputs: ["property", "obj"] }, { kind: "component", type: StiBorderSidesEditorComponent, selector: "sti-border-sides-editor", inputs: ["property", "object"] }], animations: [SlideInOutAnimation] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableBorderEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-table-border-editor",
                    template: `
    <div [@slideInOut]="state ? 'in' : 'out'" class="border-editor">
      <table class="sti-clear" [style]="{ width: '100%' }">
        <tr *ngFor="let prop of properties; index as i">
          <td *ngIf="prop.label">
            <div class="label" [style.margin-top.px]="i == '0' ? 5 : 0">
              {{ prop.label }}
            </div>
          </td>
          <td>
            <sti-border-sides-editor
              *ngIf="prop.type === 'borderAlignment'"
              [property]="prop"
              [object]="object"
              [style]="{ width: '95%' }"
            ></sti-border-sides-editor>
            <sti-color-editor
              *ngIf="prop.type === 'color'"
              [property]="prop"
              [style]="{ width: '95%' }"
              [obj]="object?.pen"
            ></sti-color-editor>
            <sti-enum-editor
              *ngIf="prop.type === 'enum'"
              [property]="prop"
              [style]="{ width: '95%' }"
              [object]="object?.pen"
            ></sti-enum-editor>
            <sti-number-editor *ngIf="prop.type === 'Number'" [obj]="object?.pen" [property]="prop"></sti-number-editor>
          </td>
        </tr>
      </table>
    </div>
    <style>
      tr {
        padding: 3px 0px 3px 0px;
      }
      .label {
        font-size: 13px;
        font-weight: normal;
        min-width: 150px;
        white-space: nowrap;
        color: var(--property-label-color);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }
      .border-editor {
        overflow: hidden;
      }
    </style>
  `,
                    animations: [SlideInOutAnimation],
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiThemeService }, { type: StiLocalizationService }], propDecorators: { property: [{
                type: Input
            }], state: [{
                type: Input
            }], object: [{
                type: Input
            }] } });

class StiSimpleEnumEditorComponent {
    get type() {
        if (this.property.property == "matrixSize") {
            return StiQRCodeSize[this.helper.getProperty(this.object, this.property.property)];
        }
        else if (this.property.property == "errorCorrectionLevel") {
            return StiQRCodeErrorCorrectionLevel[this.helper.getProperty(this.object, this.property.property)];
        }
        else if (this.property.property.includes("BrushType")) {
            return StiBodyBrush[this.helper.getProperty(this.object, this.property.property)];
        }
        else if (this.property.property == "bodyShapeType") {
            return StiQRCodeBodyShapeType[this.helper.getProperty(this.object, this.property.property)];
        }
        else if (this.property.property == "eyeBallShapeType") {
            return StiQRCodeEyeBallShapeType[this.helper.getProperty(this.object, this.property.property)];
        }
        else if (this.property.property == "eyeFrameShapeType") {
            return StiQRCodeEyeFrameShapeType[this.helper.getProperty(this.object, this.property.property)];
        }
    }
    set type(value) {
        if (this.property.property == "matrixSize") {
            this.helper.setProperty(this.object, this.property.property, Enum.parse(StiQRCodeSize, value, false));
        }
        else if (this.property.property == "errorCorrectionLevel") {
            this.helper.setProperty(this.object, this.property.property, Enum.parse(StiQRCodeErrorCorrectionLevel, value));
        }
        else if (this.property.property.includes("BrushType")) {
            this.helper.setProperty(this.object, this.property.property, Enum.parse(StiBodyBrush, value));
        }
        else if (this.property.property == "bodyShapeType") {
            this.helper.setProperty(this.object, this.property.property, Enum.parse(StiQRCodeBodyShapeType, value));
        }
        else if (this.property.property == "eyeBallShapeType") {
            this.helper.setProperty(this.object, this.property.property, Enum.parse(StiQRCodeEyeBallShapeType, value));
        }
        else if (this.property.property == "eyeFrameShapeType") {
            this.helper.setProperty(this.object, this.property.property, Enum.parse(StiQRCodeEyeFrameShapeType, value));
        }
        this.model.needToRefreshInnerProperties.next(true);
    }
    get enum() {
        if (this.property.property == "matrixSize") {
            return this.helper.dataMatrixSize;
        }
        else if (this.property.property == "errorCorrectionLevel") {
            return this.helper.errorCorrectionLevel;
        }
        else if (this.property.property.includes("BrushType")) {
            return this.helper.bodyBrush;
        }
        else if (this.property.property == "bodyShapeType") {
            return this.helper.bodyShapeType;
        }
        else if (this.property.property == "eyeBallShapeType") {
            return this.helper.eyeBallShapeType;
        }
        else if (this.property.property == "eyeFrameShapeType") {
            return this.helper.eyeFrameShapeType;
        }
    }
    constructor(model, helper) {
        this.model = model;
        this.helper = helper;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSimpleEnumEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiSimpleEnumEditorComponent, selector: "sti-simple-enum-editor", inputs: { property: "property", object: "object" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="2">
          <sti-dropdown-editor
            [options]="enum"
            [(value)]="type"
            class="p-inputtext-sm"
            [style]="{ width: '100%' }"
          ></sti-dropdown-editor>
        </td>
      </tr>
    </table>

    <style>
      td {
        padding: 0;
      }
      span {
        margin-left: 2px;
        color: var(--text-color);
        font-weight: normal;
      }
    </style>
  `, isInline: true, styles: ["\n      td {\n        padding: 0;\n      }\n      span {\n        margin-left: 2px;\n        color: var(--text-color);\n        font-weight: normal;\n      }\n    "], dependencies: [{ kind: "component", type: StiDropdownEditorComponent, selector: "sti-dropdown-editor", inputs: ["value", "options", "optionLabel", "optionValue", "editable"], outputs: ["valueChange"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSimpleEnumEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-simple-enum-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="2">
          <sti-dropdown-editor
            [options]="enum"
            [(value)]="type"
            class="p-inputtext-sm"
            [style]="{ width: '100%' }"
          ></sti-dropdown-editor>
        </td>
      </tr>
    </table>

    <style>
      td {
        padding: 0;
      }
      span {
        margin-left: 2px;
        color: var(--text-color);
        font-weight: normal;
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }], propDecorators: { property: [{
                type: Input
            }], object: [{
                type: Input
            }] } });

class StiBarcodeShapeEditorComponent {
    constructor(model, helper, theme, loc) {
        this.model = model;
        this.helper = helper;
        this.theme = theme;
        this.loc = loc;
        this.properties = [];
    }
    ngOnInit() {
        this.updateProperties();
        this.model.needToRefreshInnerProperties.subscribe(() => this.updateProperties());
        //
    }
    updateProperties() {
        this.properties = [];
        this.properties.push({
            type: "simpleEnum",
            property: `${this.getStartType(this.property.property)}BrushType`,
            label: this.loc.getP(`${this.getMiddleType(this.property.property)}Brush`),
        });
        if (this.object[`${this.getStartType(this.property.property)}BrushType`] == StiBodyBrush.Solid ||
            this.object[`${this.getStartType(this.property.property)}BrushType`] == StiBodyBrush.Glass) {
            this.properties.push({
                type: "color",
                property: `${this.getStartType(this.property.property)}BrushColor`,
                label: this.loc.getP("Color"),
            });
        }
        if (this.object[`${this.getStartType(this.property.property)}BrushType`] == StiBodyBrush.Hatch) {
            this.properties.push({
                type: "color",
                property: `${this.getStartType(this.property.property)}BrushForeColor`,
                label: this.loc.getP("ForeColor"),
            });
            this.properties.push({
                type: "color",
                property: `${this.getStartType(this.property.property)}BrushBackColor`,
                label: this.loc.getP("BackColor"),
            });
            this.properties.push({
                type: "enum",
                property: `${this.getStartType(this.property.property)}BrushHatchStyle`,
                label: this.loc.getP("Style"),
            });
        }
        if (this.object[`${this.getStartType(this.property.property)}BrushType`] == StiBodyBrush.Gradient ||
            this.object[`${this.getStartType(this.property.property)}BrushType`] == StiBodyBrush.Glare) {
            this.properties.push({
                type: "Number",
                property: `${this.getStartType(this.property.property)}BrushAngle`,
                label: this.loc.getP("Angle"),
            });
            this.properties.push({
                type: "color",
                property: `start${this.getMiddleType(this.property.property)}BrushColor`,
                label: this.loc.getP("StartColor"),
            });
            this.properties.push({
                type: "color",
                property: `end${this.getMiddleType(this.property.property)}BrushColor`,
                label: this.loc.getP("EndColor"),
            });
        }
        this.properties.push({
            type: "simpleEnum",
            property: `${this.getStartType(this.property.property)}ShapeType`,
            label: this.loc.getP(`${this.getMiddleType(this.property.property)}Shape`),
        });
        if (this.object[`${this.getStartType(this.property.property)}BrushType`] == StiBodyBrush.Glare) {
            this.properties.push({
                type: "Number",
                property: `${this.getStartType(this.property.property)}BrushFocus`,
                label: this.loc.getP("Focus"),
            });
        }
        if (this.object[`${this.getStartType(this.property.property)}BrushType`] == StiBodyBrush.Glass) {
            this.properties.push({
                type: "Number",
                property: `${this.getStartType(this.property.property)}BrushBlend`,
                label: this.loc.getP("Blend"),
            });
            this.properties.push({
                type: "checkbox",
                property: `${this.getStartType(this.property.property)}BrushDrawHatch`,
                label: this.loc.getP("DrawHatch"),
            });
        }
    }
    getMiddleType(property) {
        if (property == "showBodyBrushEditor") {
            return "Body";
        }
        else if (property == "showEyeBallBrushEditor") {
            return "EyeBall";
        }
        else {
            return "EyeFrame";
        }
    }
    getStartType(property) {
        if (property == "showBodyBrushEditor") {
            return "body";
        }
        else if (property == "showEyeBallBrushEditor") {
            return "eyeBall";
        }
        else {
            return "eyeFrame";
        }
    }
    get content() {
        return this.helper.getProperty(this.model.selectedComponent.element, this.property.property);
    }
    set content(value) {
        this.helper.setProperty(this.model.selectedComponent.element, this.property.property, value);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBarcodeShapeEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiThemeService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiBarcodeShapeEditorComponent, selector: "sti-barcode-shape-editor", inputs: { property: "property", state: "state", object: "object" }, ngImport: i0, template: `
    <div [@slideInOut]="state ? 'in' : 'out'" class="barcode-editor">
      <table class="sti-clear" [style]="{ width: '100%' }">
        <tr *ngFor="let prop of properties; index as i">
          <td *ngIf="prop.label">
            <div class="label" [style.margin-top.px]="i == '0' ? 5 : 0">
              {{ prop.label }}
            </div>
          </td>
          <td [style.width]="'100%'">
            <sti-color-editor
              *ngIf="prop.type === 'color'"
              [property]="prop"
              [style]="{ width: '95%' }"
              [obj]="object"
            ></sti-color-editor>
            <sti-simple-enum-editor
              *ngIf="prop.type === 'simpleEnum'"
              [property]="prop"
              [object]="object"
              [style]="{ width: '100%' }"
            ></sti-simple-enum-editor>
            <sti-enum-editor
              *ngIf="prop.type === 'enum'"
              [property]="prop"
              [style]="{ width: '95%' }"
              [object]="object"
            ></sti-enum-editor>
            <sti-bool-editor
              [property]="prop"
              *ngIf="prop.type === 'checkbox'"
              [style]="{ width: '95%' }"
            ></sti-bool-editor>
            <sti-number-editor *ngIf="prop.type === 'Number'" [obj]="object" [property]="prop"></sti-number-editor>
          </td>
        </tr>
      </table>
    </div>
    <style>
      tr {
        padding: 3px 0px 3px 0px;
      }
      .label {
        font-size: 13px;
        font-weight: normal;
        min-width: 120px;
        white-space: nowrap;
        color: var(--text-color);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }
      .barcode-editor {
        overflow: hidden;
      }
    </style>
  `, isInline: true, styles: ["\n      tr {\n        padding: 3px 0px 3px 0px;\n      }\n      .label {\n        font-size: 13px;\n        font-weight: normal;\n        min-width: 120px;\n        white-space: nowrap;\n        color: var(--text-color);\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n      }\n      .barcode-editor {\n        overflow: hidden;\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiBoolEditorComponent, selector: "sti-bool-editor", inputs: ["property", "object"] }, { kind: "component", type: StiColorEditorComponent, selector: "sti-color-editor", inputs: ["property", "textColor", "obj"] }, { kind: "component", type: StiEnumEditorComponent, selector: "sti-enum-editor", inputs: ["property", "object", "index"] }, { kind: "component", type: StiNumberEditorComponent, selector: "sti-number-editor", inputs: ["property", "obj"] }, { kind: "component", type: StiSimpleEnumEditorComponent, selector: "sti-simple-enum-editor", inputs: ["property", "object"] }], animations: [SlideInOutAnimation] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBarcodeShapeEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-barcode-shape-editor",
                    template: `
    <div [@slideInOut]="state ? 'in' : 'out'" class="barcode-editor">
      <table class="sti-clear" [style]="{ width: '100%' }">
        <tr *ngFor="let prop of properties; index as i">
          <td *ngIf="prop.label">
            <div class="label" [style.margin-top.px]="i == '0' ? 5 : 0">
              {{ prop.label }}
            </div>
          </td>
          <td [style.width]="'100%'">
            <sti-color-editor
              *ngIf="prop.type === 'color'"
              [property]="prop"
              [style]="{ width: '95%' }"
              [obj]="object"
            ></sti-color-editor>
            <sti-simple-enum-editor
              *ngIf="prop.type === 'simpleEnum'"
              [property]="prop"
              [object]="object"
              [style]="{ width: '100%' }"
            ></sti-simple-enum-editor>
            <sti-enum-editor
              *ngIf="prop.type === 'enum'"
              [property]="prop"
              [style]="{ width: '95%' }"
              [object]="object"
            ></sti-enum-editor>
            <sti-bool-editor
              [property]="prop"
              *ngIf="prop.type === 'checkbox'"
              [style]="{ width: '95%' }"
            ></sti-bool-editor>
            <sti-number-editor *ngIf="prop.type === 'Number'" [obj]="object" [property]="prop"></sti-number-editor>
          </td>
        </tr>
      </table>
    </div>
    <style>
      tr {
        padding: 3px 0px 3px 0px;
      }
      .label {
        font-size: 13px;
        font-weight: normal;
        min-width: 120px;
        white-space: nowrap;
        color: var(--text-color);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }
      .barcode-editor {
        overflow: hidden;
      }
    </style>
  `,
                    animations: [SlideInOutAnimation],
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiThemeService }, { type: StiLocalizationService }], propDecorators: { property: [{
                type: Input
            }], state: [{
                type: Input
            }], object: [{
                type: Input
            }] } });

class StiBooleanWithArrowEditorComponent {
    constructor(model, helper, theme, loc) {
        this.model = model;
        this.helper = helper;
        this.theme = theme;
        this.loc = loc;
    }
    ngOnInit() {
        this._state = this.model.selectedComponent.element[this.property.property] == true ? "rotated" : "default";
    }
    get isBarcodeShape() {
        return this.property.property == "showBodyBrushEditor" ||
            this.property.property == "showEyeBallBrushEditor" ||
            this.property.property == "showEyeFrameBrushEditor"
            ? true
            : false;
    }
    get content() {
        if (!this.isBarcodeShape) {
            return this.property.property == "showGridLinesEditor"
                ? this.loc.get2("Chart", "GridLines")
                : this.loc.getP("Border");
        }
        else {
            if (this.property.property == "showBodyBrushEditor") {
                return this.loc.getP("BodyBrush");
            }
            else if (this.property.property == "showEyeBallBrushEditor") {
                return this.loc.getP("EyeBallBrush");
            }
            else {
                return this.loc.getP("EyeFrameBrush");
            }
        }
    }
    getObject() {
        if (this.property.property == "showGridLinesEditor") {
            return this.helper.getProperty(this.model.selectedComponent.element, "gridLines");
        }
        else if (this.property.property == "showBorderEditor") {
            return this.helper.getProperty(this.model.selectedComponent.element, "border");
        }
        else if (this.property.property == "showColumnsBorderEditor") {
            return this.helper.getProperty(this.model.selectedComponent.element, "columnHeadersBorder");
        }
        else if (this.property.property == "showRowsBorderEditor") {
            return this.helper.getProperty(this.model.selectedComponent.element, "rowHeadersBorder");
        }
        else {
            return this.model.selectedComponent?.element;
        }
    }
    get state() {
        return this._state;
    }
    set state(value) {
        this._state = value;
    }
    changeState() {
        this.model.selectedComponent.element[this.property.property] =
            !this.model.selectedComponent.element[this.property.property];
        this.state = this.state == "default" ? "rotated" : "default";
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBooleanWithArrowEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiThemeService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiBooleanWithArrowEditorComponent, selector: "boolean-with-arrow-editor", inputs: { property: "property" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="7">
          <div class="boolean-button" (click)="changeState()">
            <div class="arrow" [@rotatedState]="state">
              <span class="select-button"><i class="pi pi-chevron-right"></i></span>
            </div>
            <div class="content">{{ content }}</div>
          </div>
          <sti-table-border-editor
            *ngIf="!isBarcodeShape"
            [property]="property"
            [state]="state == 'default' ? false : true"
            [object]="getObject()"
          ></sti-table-border-editor>
          <sti-barcode-shape-editor
            *ngIf="isBarcodeShape"
            [property]="property"
            [state]="state == 'default' ? false : true"
            [object]="getObject()"
          ></sti-barcode-shape-editor>
        </td>
      </tr>
    </table>
    <style>
      i {
        width: 10px;
        height: 10px;
      }
      .arrow {
        width: 20px;
        text-align: center;
        cursor: default;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }

      .content {
        cursor: default;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }
      .boolean-button {
        width: 100%;
        height: 22px;
        display: flex;
        flex-direction: row;
        color: var(--text-color);
        background-color: var(--hover-color);
        border-top: 2px solid var(--toolbarResizerBorder-color);
      }
    </style>
  `, isInline: true, styles: ["\n      i {\n        width: 10px;\n        height: 10px;\n      }\n      .arrow {\n        width: 20px;\n        text-align: center;\n        cursor: default;\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n      }\n\n      .content {\n        cursor: default;\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n      }\n      .boolean-button {\n        width: 100%;\n        height: 22px;\n        display: flex;\n        flex-direction: row;\n        color: var(--text-color);\n        background-color: var(--hover-color);\n        border-top: 2px solid var(--toolbarResizerBorder-color);\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiTableBorderEditorComponent, selector: "sti-table-border-editor", inputs: ["property", "state", "object"] }, { kind: "component", type: StiBarcodeShapeEditorComponent, selector: "sti-barcode-shape-editor", inputs: ["property", "state", "object"] }], animations: [RotateAnimation, SlideInOutAnimation] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBooleanWithArrowEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "boolean-with-arrow-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="7">
          <div class="boolean-button" (click)="changeState()">
            <div class="arrow" [@rotatedState]="state">
              <span class="select-button"><i class="pi pi-chevron-right"></i></span>
            </div>
            <div class="content">{{ content }}</div>
          </div>
          <sti-table-border-editor
            *ngIf="!isBarcodeShape"
            [property]="property"
            [state]="state == 'default' ? false : true"
            [object]="getObject()"
          ></sti-table-border-editor>
          <sti-barcode-shape-editor
            *ngIf="isBarcodeShape"
            [property]="property"
            [state]="state == 'default' ? false : true"
            [object]="getObject()"
          ></sti-barcode-shape-editor>
        </td>
      </tr>
    </table>
    <style>
      i {
        width: 10px;
        height: 10px;
      }
      .arrow {
        width: 20px;
        text-align: center;
        cursor: default;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }

      .content {
        cursor: default;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }
      .boolean-button {
        width: 100%;
        height: 22px;
        display: flex;
        flex-direction: row;
        color: var(--text-color);
        background-color: var(--hover-color);
        border-top: 2px solid var(--toolbarResizerBorder-color);
      }
    </style>
  `,
                    animations: [RotateAnimation, SlideInOutAnimation],
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiThemeService }, { type: StiLocalizationService }], propDecorators: { property: [{
                type: Input
            }] } });

class StiTableItemEditorComponent {
    constructor(model, helper, theme) {
        this.model = model;
        this.helper = helper;
        this.theme = theme;
    }
    ngOnInit() { }
    changeEditor() {
        this.model.selectedComponent.element[this.property.property] =
            !this.model.selectedComponent.element[this.property.property];
        this.model.needToRefresh.next(true);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableItemEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiThemeService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTableItemEditorComponent, selector: "sti-table-item-editor", inputs: { property: "property" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="7">
          <button (click)="changeEditor()">Edit</button>
        </td>
      </tr>
    </table>
    <style>
      td {
        text-align: end;
      }
      tr {
        padding: 3px 0px 3px 0px;
      }
      button {
        width: 45px;
        height: 22px;
        padding: 3px 6px;
        text-decoration: none;
        font-weight: 600;
        font-size: 12px;
        color: var(--text-color);
        text-align: center;
        justify-content: center;
        background-color: var(--input-color);
        border-top: 2px solid var(--toolbarResizerBorder-color);
        border-left: 1px solid var(--toolbarResizerBorder-color);
        border-right: 1px solid var(--toolbarResizerBorder-color);
        border-bottom: 1px solid var(--toolbarResizerBorder-color);
        border-radius: 3px;
      }
      button:hover {
        background-color: var(--hover-color);
      }
    </style>
  `, isInline: true, styles: ["\n      td {\n        text-align: end;\n      }\n      tr {\n        padding: 3px 0px 3px 0px;\n      }\n      button {\n        width: 45px;\n        height: 22px;\n        padding: 3px 6px;\n        text-decoration: none;\n        font-weight: 600;\n        font-size: 12px;\n        color: var(--text-color);\n        text-align: center;\n        justify-content: center;\n        background-color: var(--input-color);\n        border-top: 2px solid var(--toolbarResizerBorder-color);\n        border-left: 1px solid var(--toolbarResizerBorder-color);\n        border-right: 1px solid var(--toolbarResizerBorder-color);\n        border-bottom: 1px solid var(--toolbarResizerBorder-color);\n        border-radius: 3px;\n      }\n      button:hover {\n        background-color: var(--hover-color);\n      }\n    "] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableItemEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-table-item-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="7">
          <button (click)="changeEditor()">Edit</button>
        </td>
      </tr>
    </table>
    <style>
      td {
        text-align: end;
      }
      tr {
        padding: 3px 0px 3px 0px;
      }
      button {
        width: 45px;
        height: 22px;
        padding: 3px 6px;
        text-decoration: none;
        font-weight: 600;
        font-size: 12px;
        color: var(--text-color);
        text-align: center;
        justify-content: center;
        background-color: var(--input-color);
        border-top: 2px solid var(--toolbarResizerBorder-color);
        border-left: 1px solid var(--toolbarResizerBorder-color);
        border-right: 1px solid var(--toolbarResizerBorder-color);
        border-bottom: 1px solid var(--toolbarResizerBorder-color);
        border-radius: 3px;
      }
      button:hover {
        background-color: var(--hover-color);
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiThemeService }], propDecorators: { property: [{
                type: Input
            }] } });

class StiSelectButtonEditorComponent {
    constructor(model, helper) {
        this.model = model;
        this.helper = helper;
    }
    ngOnInit() { }
    set value(value) {
        if (this.object) {
            this.helper.setProperty(this.object, this.property, value);
        }
        else {
            this.model.form.settings[this.property] = value;
        }
    }
    get value() {
        return this.helper.getProperty(this.object, this.property) ?? this.model.form.settings[this.property];
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSelectButtonEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiSelectButtonEditorComponent, selector: "sti-select-button-editor", inputs: { propertyType: "propertyType", property: "property", object: "object" }, ngImport: i0, template: `
    <sti-selectButton
      [options]="helper.labelFormat"
      [(value)]="value"
      optionLabel="name"
      optionValue="value"
      [style]="{ height: '24px', width: '100%' }"
    >
    </sti-selectButton>
  `, isInline: true, dependencies: [{ kind: "component", type: StiSelectButtonComponent, selector: "sti-selectButton", inputs: ["options", "value", "optionLabel", "optionValue", "multiple", "disabled"], outputs: ["onOptionClick", "onChange", "valueChange"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSelectButtonEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-select-button-editor",
                    template: `
    <sti-selectButton
      [options]="helper.labelFormat"
      [(value)]="value"
      optionLabel="name"
      optionValue="value"
      [style]="{ height: '24px', width: '100%' }"
    >
    </sti-selectButton>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }], propDecorators: { propertyType: [{
                type: Input
            }], property: [{
                type: Input
            }], object: [{
                type: Input
            }] } });

class StiDividerComponent {
    constructor() { }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDividerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiDividerComponent, selector: "sti-divider", ngImport: i0, template: `<div class="divider"></div>`, isInline: true, styles: [".divider{width:100%;height:.9px;background-color:#abaaa94d;margin-bottom:1px}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDividerComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-divider", template: `<div class="divider"></div>`, styles: [".divider{width:100%;height:.9px;background-color:#abaaa94d;margin-bottom:1px}\n"] }]
        }], ctorParameters: () => [] });

class StiTableColumnEditorComponent {
    constructor(model, helper, theme, loc) {
        this.model = model;
        this.helper = helper;
        this.theme = theme;
        this.loc = loc;
        this.properties = [];
    }
    ngOnInit() {
        this.updateProperties();
        this.model.needToRefreshInnerProperties.subscribe(() => this.updateProperties());
    }
    needToDisable(property) {
        if (this.column instanceof StiLabelColumnItem || this.column instanceof StiTotalsFieldItem) {
            if (this.column.prefix.length > 0 && property.property == "suffix") {
                return true;
            }
            else if (this.column.suffix.length > 0 && property.property == "prefix") {
                return true;
            }
            else {
                return false;
            }
        }
        else {
            return false;
        }
    }
    updateProperties() {
        this.properties = [];
        if (this.column instanceof StiColumnItem) {
            this.properties.push({ type: "enum", property: "type", label: this.loc.getP("Type") });
            this.properties.push({ type: "TextEditor", property: "label", label: this.loc.getP("Label") });
            if (this.column instanceof StiLabelColumnItem) {
                this.properties.push({ type: "TextEditor", property: "expression", label: this.loc.getP("Expression") });
            }
            this.properties.push({ type: "divider" });
            this.properties.push({ type: "FontEditor", property: "font", label: this.loc.getP("Header") });
            this.properties.push({ type: "color", property: "headerBackColor", label: this.loc.getP("BackColor") });
            this.properties.push({ type: "color", property: "headerForeColor", label: this.loc.getP("ForeColor") });
            this.properties.push({
                type: "horizontalAlignment",
                property: "headerAlignment",
                label: this.loc.getP("Alignment"),
            });
            this.properties.push({
                type: "checkbox",
                property: "useWordWrap",
                checkbox: StiLocalizationService.get("PropertyEnum", "StiTextSizeModeWordWrap"),
                label: " ",
            });
            this.properties.push({ type: "divider" });
            if (!(this.column instanceof StiComboBoxColumnItem)) {
                this.properties.push({
                    type: "horizontalAlignment",
                    property: "cellAlignment",
                    label: this.loc.getP("Cell") + " " + this.loc.getP("Alignment"),
                });
            }
            if (this.column instanceof StiComboBoxColumnItem) {
                this.properties.push({
                    type: "MultilineEditor",
                    property: "comboBoxOptions",
                    label: this.loc.getP("Options"),
                });
            }
            if (this.column instanceof StiNumberBoxColumnItem || this.column instanceof StiLabelColumnItem) {
                if (this.column instanceof StiNumberBoxColumnItem) {
                    this.properties.push({
                        type: "enum",
                        property: "numberType",
                        label: StiLocalizationService.get("PropertyMain", "ValueType"),
                    });
                }
                this.properties.push({
                    type: "enum",
                    property: "thousandSeparator",
                    label: this.loc.get2("Export", "Separator").replace(":", ""),
                });
                this.properties.push({
                    type: "Number",
                    property: "decimalDigits",
                    label: this.loc.get2("FormFormatEditor", "DecimalDigits").replace(":", ""),
                });
                if (this.column instanceof StiLabelColumnItem) {
                    this.properties.push({
                        type: "TextEditor",
                        property: "prefix",
                        label: StiLocalizationService.get("PropertyMain", "Prefix"),
                    });
                    this.properties.push({
                        type: "TextEditor",
                        property: "suffix",
                        label: StiLocalizationService.get("PropertyMain", "Suffix"),
                    });
                }
                if (this.column instanceof StiNumberBoxColumnItem && this.column.numberType == StiNumberType.Decimal) {
                    this.properties.push({
                        type: "TextEditor",
                        property: "unitLabel",
                        label: StiLocalizationService.get("PropertyMain", "Unit"),
                    });
                    this.properties.push({
                        type: "enum",
                        property: "unitAlignment",
                        label: StiLocalizationService.get("PropertyMain", "UnitAlignment"),
                    });
                }
                else if (this.column instanceof StiNumberBoxColumnItem && this.column.numberType == StiNumberType.Currency) {
                    this.properties.push({
                        type: "enum",
                        property: "currency",
                        label: StiLocalizationService.get("FormFormatEditor", "Currency"),
                    });
                    this.properties.push({
                        type: "enum",
                        property: "unitAlignment",
                        label: StiLocalizationService.get("PropertyMain", "UnitAlignment"),
                    });
                    this.properties.push({
                        type: "labelFormat",
                        property: "currencyLabelFormat",
                        label: StiLocalizationService.get("PropertyMain", "ShowAs"),
                    });
                }
            }
            this.properties.push({ type: "color", property: "backgroundColor", label: this.loc.getP("BackColor") });
            this.properties.push({ type: "color", property: "cellBackColor", label: this.loc.getP("CellBackColor") });
            this.properties.push({ type: "color", property: "cellForeColor", label: this.loc.getP("CellForeColor") });
            if (!(this.column instanceof StiLabelColumnItem)) {
                this.properties.push({ type: "color", property: "cellBorderColor", label: this.loc.getP("BorderColor") });
            }
        }
        else if (this.column instanceof StiTotalsFieldItem) {
            this.properties.push({ type: "TextEditor", property: "header", label: this.loc.getP("Header") });
            this.properties.push({ type: "TextEditor", property: "expression", label: this.loc.getP("Expression") });
            this.properties.push({
                type: "horizontalAlignment",
                property: "headerAlignment",
                label: this.loc.getP("HeaderAlignment"),
            });
            this.properties.push({
                type: "horizontalAlignment",
                property: "valueAlignment",
                label: this.loc.getP("Value") + " " + this.loc.getP("Alignment"),
            });
            this.properties.push({ type: "color", property: "headerColor", label: " " });
            this.properties.push({
                type: "enum",
                property: "thousandSeparator",
                label: this.loc.get2("Export", "Separator").replace(":", ""),
            });
            this.properties.push({
                type: "Number",
                property: "decimalDigits",
                label: this.loc.get2("FormFormatEditor", "DecimalDigits").replace(":", ""),
            });
            this.properties.push({
                type: "TextEditor",
                property: "prefix",
                label: StiLocalizationService.get("PropertyMain", "Prefix"),
            });
            this.properties.push({
                type: "TextEditor",
                property: "suffix",
                label: StiLocalizationService.get("PropertyMain", "Suffix"),
            });
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableColumnEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiThemeService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTableColumnEditorComponent, selector: "sti-table-column-editor", inputs: { column: "column", state: "state", index: "index", expression: "expression" }, ngImport: i0, template: `
    <div [@slideInOut]="state ? 'in' : 'out'" class="column-editor">
      <table class="sti-clear" [style]="{ width: '100%' }">
        <tr *ngFor="let property of properties">
          <td *ngIf="property.label" [style.vertical-align]="property.type == 'FontEditor' ? 'top' : ''">
            <div class="label" [style.margin-top.px]="index == '0' ? 5 : 0">
              {{ property.label }}
            </div>
          </td>
          <td [colSpan]="property.type === 'divider' ? 8 : ''">
            <sti-font-editor
              *ngIf="property.type === 'FontEditor'"
              [object]="column"
              [property]="property"
            ></sti-font-editor>
            <sti-text-editor
              *ngIf="property.type === 'TextEditor'"
              [object]="column"
              [property]="property"
              [disabled]="needToDisable(property)"
            ></sti-text-editor>
            <sti-horizontal-alignment-editor
              [property]="property"
              *ngIf="property.type === 'horizontalAlignment'"
              [style]="{ width: '95%' }"
              [object]="column"
            ></sti-horizontal-alignment-editor>
            <sti-color-editor
              *ngIf="property.type === 'color'"
              [obj]="column"
              [property]="property"
              [style]="{ width: '95%' }"
            ></sti-color-editor>
            <sti-enum-editor
              *ngIf="property.type === 'enum'"
              [property]="property"
              [style]="{ width: '95%' }"
              [object]="column"
              [index]="index"
            ></sti-enum-editor>
            <sti-bool-editor
              [property]="property"
              *ngIf="property.type === 'checkbox'"
              [style]="{ width: '95%' }"
              [object]="column"
            ></sti-bool-editor>
            <sti-multiline-string-editor
              *ngIf="property.type === 'MultilineEditor'"
              [property]="property"
              [object]="column"
            ></sti-multiline-string-editor>
            <sti-number-editor
              *ngIf="property.type === 'Number'"
              [obj]="column"
              [property]="property"
            ></sti-number-editor>
            <sti-select-button-editor
              *ngIf="property.type === 'labelFormat'"
              [propertyType]="property.type"
              [object]="column"
              [property]="property.property"
            >
            </sti-select-button-editor>
            <sti-divider *ngIf="property.type === 'divider'"></sti-divider>
          </td>
        </tr>
      </table>
    </div>
    <style>
      tr {
        padding: 3px 0px 3px 0px;
      }
      .label {
        font-size: 13px;
        font-weight: normal;
        min-width: 150px;
        white-space: nowrap;
        color: var(--property-label-color);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }
      .column-editor {
        overflow: hidden;
      }
      img {
        height: 16px;
        width: 16px;
        vertical-align: bottom;
      }
    </style>
  `, isInline: true, styles: ["\n      tr {\n        padding: 3px 0px 3px 0px;\n      }\n      .label {\n        font-size: 13px;\n        font-weight: normal;\n        min-width: 150px;\n        white-space: nowrap;\n        color: var(--property-label-color);\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n      }\n      .column-editor {\n        overflow: hidden;\n      }\n      img {\n        height: 16px;\n        width: 16px;\n        vertical-align: bottom;\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiBoolEditorComponent, selector: "sti-bool-editor", inputs: ["property", "object"] }, { kind: "component", type: StiColorEditorComponent, selector: "sti-color-editor", inputs: ["property", "textColor", "obj"] }, { kind: "component", type: StiEnumEditorComponent, selector: "sti-enum-editor", inputs: ["property", "object", "index"] }, { kind: "component", type: StiFontEditorComponent, selector: "sti-font-editor", inputs: ["property", "object"] }, { kind: "component", type: StiMultilineStringEditorComponent, selector: "sti-multiline-string-editor", inputs: ["property", "object"] }, { kind: "component", type: StiNumberEditorComponent, selector: "sti-number-editor", inputs: ["property", "obj"] }, { kind: "component", type: StiTextEditorComponent, selector: "sti-text-editor", inputs: ["property", "object", "disabled"] }, { kind: "component", type: StiHorizontalAlignmentEditorComponent, selector: "sti-horizontal-alignment-editor", inputs: ["property", "object"] }, { kind: "component", type: StiSelectButtonEditorComponent, selector: "sti-select-button-editor", inputs: ["propertyType", "property", "object"] }, { kind: "component", type: StiDividerComponent, selector: "sti-divider" }], animations: [SlideInOutAnimation] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableColumnEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-table-column-editor",
                    template: `
    <div [@slideInOut]="state ? 'in' : 'out'" class="column-editor">
      <table class="sti-clear" [style]="{ width: '100%' }">
        <tr *ngFor="let property of properties">
          <td *ngIf="property.label" [style.vertical-align]="property.type == 'FontEditor' ? 'top' : ''">
            <div class="label" [style.margin-top.px]="index == '0' ? 5 : 0">
              {{ property.label }}
            </div>
          </td>
          <td [colSpan]="property.type === 'divider' ? 8 : ''">
            <sti-font-editor
              *ngIf="property.type === 'FontEditor'"
              [object]="column"
              [property]="property"
            ></sti-font-editor>
            <sti-text-editor
              *ngIf="property.type === 'TextEditor'"
              [object]="column"
              [property]="property"
              [disabled]="needToDisable(property)"
            ></sti-text-editor>
            <sti-horizontal-alignment-editor
              [property]="property"
              *ngIf="property.type === 'horizontalAlignment'"
              [style]="{ width: '95%' }"
              [object]="column"
            ></sti-horizontal-alignment-editor>
            <sti-color-editor
              *ngIf="property.type === 'color'"
              [obj]="column"
              [property]="property"
              [style]="{ width: '95%' }"
            ></sti-color-editor>
            <sti-enum-editor
              *ngIf="property.type === 'enum'"
              [property]="property"
              [style]="{ width: '95%' }"
              [object]="column"
              [index]="index"
            ></sti-enum-editor>
            <sti-bool-editor
              [property]="property"
              *ngIf="property.type === 'checkbox'"
              [style]="{ width: '95%' }"
              [object]="column"
            ></sti-bool-editor>
            <sti-multiline-string-editor
              *ngIf="property.type === 'MultilineEditor'"
              [property]="property"
              [object]="column"
            ></sti-multiline-string-editor>
            <sti-number-editor
              *ngIf="property.type === 'Number'"
              [obj]="column"
              [property]="property"
            ></sti-number-editor>
            <sti-select-button-editor
              *ngIf="property.type === 'labelFormat'"
              [propertyType]="property.type"
              [object]="column"
              [property]="property.property"
            >
            </sti-select-button-editor>
            <sti-divider *ngIf="property.type === 'divider'"></sti-divider>
          </td>
        </tr>
      </table>
    </div>
    <style>
      tr {
        padding: 3px 0px 3px 0px;
      }
      .label {
        font-size: 13px;
        font-weight: normal;
        min-width: 150px;
        white-space: nowrap;
        color: var(--property-label-color);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }
      .column-editor {
        overflow: hidden;
      }
      img {
        height: 16px;
        width: 16px;
        vertical-align: bottom;
      }
    </style>
  `,
                    animations: [SlideInOutAnimation],
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiThemeService }, { type: StiLocalizationService }], propDecorators: { column: [{
                type: Input
            }], state: [{
                type: Input
            }], index: [{
                type: Input
            }], expression: [{
                type: Input
            }] } });

class StiTableColumnsEditorComponent {
    getMaxWidth() {
        return this.model.propertyGridWidth - 20;
    }
    get disabled() {
        return this.property.property != "columns" &&
            this.model?.selectedComponent?.element instanceof StiTableElement &&
            this.model?.selectedComponent?.element.columns.length == 0
            ? true
            : false;
    }
    constructor(model, helper, theme, loc, draggableService, mouseService) {
        this.model = model;
        this.helper = helper;
        this.theme = theme;
        this.loc = loc;
        this.draggableService = draggableService;
        this.mouseService = mouseService;
        this.arrayOfStates = [];
        this.minWidth = 40;
        this.isDrag = false;
    }
    ngOnInit() {
        if (this.items.length != this.arrayOfStates.length) {
            this.items.forEach(() => {
                this.arrayOfStates.push("default");
            });
            this.model.currentContentEditableItem.subscribe((index) => this.refreshState(index));
        }
    }
    get items() {
        return this.helper.getProperty(this.model.selectedComponent.element, this.property.property);
    }
    onHeaderClick(event, item) {
        event.preventDefault();
        this.draggableService.startX = event["offsetX"];
        this.draggableService.startY = event["offsetY"];
        this.draggableService.containerWidth = this.booleanButton?.nativeElement.offsetWidth;
        this.draggableService.onHeaderClick(event, item, this.items);
    }
    refreshState(index) {
        if (this.arrayOfStates.length != this.items.length) {
            this.arrayOfStates = [];
            this.items.forEach(() => {
                this.arrayOfStates.push("default");
            });
        }
        this.arrayOfStates.forEach((state, i) => {
            if (i != index) {
                this.arrayOfStates[i] = "default";
            }
            else {
                this.arrayOfStates[i] = "rotated";
            }
        });
    }
    changeState(i) {
        if (!this.isDrag) {
            this.arrayOfStates[i] = this.arrayOfStates[i] == "default" ? "rotated" : "default";
        }
    }
    addItem(event, element) {
        if (this.model.selectedComponent.element instanceof StiTableElement) {
            if (this.property.property == "columns") {
                this.model.selectedComponent.element.addColumnLikeLast();
                this.model.showColumnPreview(this.items.length - 1);
            }
            else {
                this.helper.addTotalMenuItems = null;
                this.model.toggleTieredMenu(element);
            }
        }
    }
    deleteItem(i) {
        this.items.splice(i, 1);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableColumnsEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiThemeService }, { token: StiLocalizationService }, { token: StiColumnDraggableService }, { token: StiMouseService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTableColumnsEditorComponent, selector: "sti-table-columns-editor", inputs: { property: "property" }, viewQueries: [{ propertyName: "booleanButton", first: true, predicate: ["booleanButton"], descendants: true }], ngImport: i0, template: `
    <table class="sti-clear drop-area" [style]="{ width: '100%' }">
      <tr *ngIf="draggableService.isDragging && !draggableService.fromTable">
        <td [style]="{ height: '3px', width: '100%' }" (mousemove)="draggableService.insertIndex = 0">
          <div
            class="drag-preview"
            [style.margin-bottom]="'-5px'"
            [style.height.px]="draggableService.insertIndex == 0 ? 6 : 0"
          >
            <div class="middle-part" *ngIf="draggableService.insertIndex == 0"></div>
          </div>
        </td>
      </tr>

      <tr *ngFor="let item of items; index as i">
        <td
          colspan="7"
          *ngIf="(!draggableService.fromTable && draggableService.item != item) || draggableService.fromTable"
        >
          <div
            #booleanButton
            class="boolean-button"
            [style.max-width.px]="getMaxWidth()"
            (click)="changeState(i)"
            (mouseover)="overIndex = i"
            (mouseleave)="overIndex = null"
            (mousedown)="onHeaderClick($event, item)"
            (mousemove)="!draggableService.fromTable ? (draggableService.insertIndex = i + 1) : return"
          >
            <div class="arrow" [@rotatedState]="arrayOfStates[i]">
              <span class="select-button"><i class="pi pi-chevron-right"></i></span>
            </div>
            <div class="content">
              {{
                this.property.property == "columns"
                  ? item.label
                    ? item.label
                    : "Column " + (i + 1)
                  : item.header
                  ? item.header
                  : "Total Field " + (i + 1)
              }}
            </div>
            <div class="delete" *ngIf="draggableService.insertIndex == -1">
              <div class="delete-button" (click)="deleteItem(i)" *ngIf="overIndex == i">
                <img [src]="model.getImage('images.Ribbon.Delete.png')" />
              </div>
            </div>
          </div>
          <sti-table-column-editor
            [column]="item"
            [state]="arrayOfStates[i] == 'default' ? false : true"
            [index]="i"
            [expression]="item?.calculationAlgorithm?.expression"
          ></sti-table-column-editor>
          <div
            class="drag-preview"
            [style.height.px]="!draggableService.fromTable && draggableService.insertIndex == i + 1 ? 6 : 0"
          >
            <div class="middle-part" *ngIf="!draggableService.fromTable && draggableService.insertIndex == i + 1"></div>
          </div>
        </td>
      </tr>
      <tr [style.text-align]="'start'">
        <td>
          <button #addButton class="add-button" [disabled]="disabled" (click)="addItem($event, addButton)">
            <!--addItem()-->
            {{
              this.property.property == "columns"
                ? loc.get2("FormDictionaryDesigner", "ColumnNew")
                : loc.get2("FormDictionaryDesigner", "NewItem")
            }}
          </button>
        </td>
      </tr>
    </table>
    <style>
      .middle-part {
        position: absolute;
        width: 100%;
        left: 0;
        top: 50%;
        border-bottom: 3px solid rgb(198, 198, 198);
      }
      tr {
        padding: 3px 0px 3px 0px;
      }
      i {
        width: 10px;
        height: 10px;
      }
      .arrow {
        width: 20px;
        text-align: center;
        cursor: default;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }
      .content {
        cursor: default;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        flex: 1;
        overflow: hidden;
      }
      .delete {
        width: 45px;
        display: flex;
        height: 100%;
      }
      .delete-button {
        width: 22px;
        height: 100%;
        border-radius: 3px;
        background-color: var(--hover-color);
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .delete-button img {
        height: 16px;
        width: 16px;
      }
      .delete-button:hover {
        background-color: var(--columnDeleteHover-color);
      }
      .delete-button:active {
        background-color: var(--hover-color);
      }
      .boolean-button {
        width: 100%;
        height: 22px;
        margin-top: 2px;
        display: flex;
        flex-direction: row;
        color: var(--text-color);
        background-color: var(--hover-color);
        border-top: 2px solid var(--toolbarResizerBorder-color);
      }

      .drag-preview {
        width: 100%;
        margin-bottom: -3px;
        background-color: transparent;
        position: relative;
        transition: height 50ms ease-in-out;
      }
      .add-button {
        min-width: 100px;
        min-height: 22px;
        padding: 3px 6px;
        margin-top: 5px;
        text-decoration: none;
        font-weight: 600;
        font-size: 12px;
        color: var(--text-color);
        text-align: center;
        justify-content: center;
        background-color: var(--input-color);
        border-top: 2px solid var(--toolbarResizerBorder-color);
        border-left: 1px solid var(--toolbarResizerBorder-color);
        border-right: 1px solid var(--toolbarResizerBorder-color);
        border-bottom: 1px solid var(--toolbarResizerBorder-color);
        border-radius: 3px;
      }
      .add-button:not([disabled]):hover {
        background-color: var(--hover-color);
      }
      .add-button[disabled] {
        opacity: 0.7;
        pointer-events: none;
        background-color: var(--hover-color);
      }
      .add-button:active {
        background-color: var(--active-color);
      }
    </style>
  `, isInline: true, styles: ["\n      .middle-part {\n        position: absolute;\n        width: 100%;\n        left: 0;\n        top: 50%;\n        border-bottom: 3px solid rgb(198, 198, 198);\n      }\n      tr {\n        padding: 3px 0px 3px 0px;\n      }\n      i {\n        width: 10px;\n        height: 10px;\n      }\n      .arrow {\n        width: 20px;\n        text-align: center;\n        cursor: default;\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n      }\n      .content {\n        cursor: default;\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n        flex: 1;\n        overflow: hidden;\n      }\n      .delete {\n        width: 45px;\n        display: flex;\n        height: 100%;\n      }\n      .delete-button {\n        width: 22px;\n        height: 100%;\n        border-radius: 3px;\n        background-color: var(--hover-color);\n        display: flex;\n        align-items: center;\n        justify-content: center;\n      }\n      .delete-button img {\n        height: 16px;\n        width: 16px;\n      }\n      .delete-button:hover {\n        background-color: var(--columnDeleteHover-color);\n      }\n      .delete-button:active {\n        background-color: var(--hover-color);\n      }\n      .boolean-button {\n        width: 100%;\n        height: 22px;\n        margin-top: 2px;\n        display: flex;\n        flex-direction: row;\n        color: var(--text-color);\n        background-color: var(--hover-color);\n        border-top: 2px solid var(--toolbarResizerBorder-color);\n      }\n\n      .drag-preview {\n        width: 100%;\n        margin-bottom: -3px;\n        background-color: transparent;\n        position: relative;\n        transition: height 50ms ease-in-out;\n      }\n      .add-button {\n        min-width: 100px;\n        min-height: 22px;\n        padding: 3px 6px;\n        margin-top: 5px;\n        text-decoration: none;\n        font-weight: 600;\n        font-size: 12px;\n        color: var(--text-color);\n        text-align: center;\n        justify-content: center;\n        background-color: var(--input-color);\n        border-top: 2px solid var(--toolbarResizerBorder-color);\n        border-left: 1px solid var(--toolbarResizerBorder-color);\n        border-right: 1px solid var(--toolbarResizerBorder-color);\n        border-bottom: 1px solid var(--toolbarResizerBorder-color);\n        border-radius: 3px;\n      }\n      .add-button:not([disabled]):hover {\n        background-color: var(--hover-color);\n      }\n      .add-button[disabled] {\n        opacity: 0.7;\n        pointer-events: none;\n        background-color: var(--hover-color);\n      }\n      .add-button:active {\n        background-color: var(--active-color);\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiTableColumnEditorComponent, selector: "sti-table-column-editor", inputs: ["column", "state", "index", "expression"] }], animations: [RotateAnimation] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTableColumnsEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-table-columns-editor",
                    template: `
    <table class="sti-clear drop-area" [style]="{ width: '100%' }">
      <tr *ngIf="draggableService.isDragging && !draggableService.fromTable">
        <td [style]="{ height: '3px', width: '100%' }" (mousemove)="draggableService.insertIndex = 0">
          <div
            class="drag-preview"
            [style.margin-bottom]="'-5px'"
            [style.height.px]="draggableService.insertIndex == 0 ? 6 : 0"
          >
            <div class="middle-part" *ngIf="draggableService.insertIndex == 0"></div>
          </div>
        </td>
      </tr>

      <tr *ngFor="let item of items; index as i">
        <td
          colspan="7"
          *ngIf="(!draggableService.fromTable && draggableService.item != item) || draggableService.fromTable"
        >
          <div
            #booleanButton
            class="boolean-button"
            [style.max-width.px]="getMaxWidth()"
            (click)="changeState(i)"
            (mouseover)="overIndex = i"
            (mouseleave)="overIndex = null"
            (mousedown)="onHeaderClick($event, item)"
            (mousemove)="!draggableService.fromTable ? (draggableService.insertIndex = i + 1) : return"
          >
            <div class="arrow" [@rotatedState]="arrayOfStates[i]">
              <span class="select-button"><i class="pi pi-chevron-right"></i></span>
            </div>
            <div class="content">
              {{
                this.property.property == "columns"
                  ? item.label
                    ? item.label
                    : "Column " + (i + 1)
                  : item.header
                  ? item.header
                  : "Total Field " + (i + 1)
              }}
            </div>
            <div class="delete" *ngIf="draggableService.insertIndex == -1">
              <div class="delete-button" (click)="deleteItem(i)" *ngIf="overIndex == i">
                <img [src]="model.getImage('images.Ribbon.Delete.png')" />
              </div>
            </div>
          </div>
          <sti-table-column-editor
            [column]="item"
            [state]="arrayOfStates[i] == 'default' ? false : true"
            [index]="i"
            [expression]="item?.calculationAlgorithm?.expression"
          ></sti-table-column-editor>
          <div
            class="drag-preview"
            [style.height.px]="!draggableService.fromTable && draggableService.insertIndex == i + 1 ? 6 : 0"
          >
            <div class="middle-part" *ngIf="!draggableService.fromTable && draggableService.insertIndex == i + 1"></div>
          </div>
        </td>
      </tr>
      <tr [style.text-align]="'start'">
        <td>
          <button #addButton class="add-button" [disabled]="disabled" (click)="addItem($event, addButton)">
            <!--addItem()-->
            {{
              this.property.property == "columns"
                ? loc.get2("FormDictionaryDesigner", "ColumnNew")
                : loc.get2("FormDictionaryDesigner", "NewItem")
            }}
          </button>
        </td>
      </tr>
    </table>
    <style>
      .middle-part {
        position: absolute;
        width: 100%;
        left: 0;
        top: 50%;
        border-bottom: 3px solid rgb(198, 198, 198);
      }
      tr {
        padding: 3px 0px 3px 0px;
      }
      i {
        width: 10px;
        height: 10px;
      }
      .arrow {
        width: 20px;
        text-align: center;
        cursor: default;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
      }
      .content {
        cursor: default;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        flex: 1;
        overflow: hidden;
      }
      .delete {
        width: 45px;
        display: flex;
        height: 100%;
      }
      .delete-button {
        width: 22px;
        height: 100%;
        border-radius: 3px;
        background-color: var(--hover-color);
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .delete-button img {
        height: 16px;
        width: 16px;
      }
      .delete-button:hover {
        background-color: var(--columnDeleteHover-color);
      }
      .delete-button:active {
        background-color: var(--hover-color);
      }
      .boolean-button {
        width: 100%;
        height: 22px;
        margin-top: 2px;
        display: flex;
        flex-direction: row;
        color: var(--text-color);
        background-color: var(--hover-color);
        border-top: 2px solid var(--toolbarResizerBorder-color);
      }

      .drag-preview {
        width: 100%;
        margin-bottom: -3px;
        background-color: transparent;
        position: relative;
        transition: height 50ms ease-in-out;
      }
      .add-button {
        min-width: 100px;
        min-height: 22px;
        padding: 3px 6px;
        margin-top: 5px;
        text-decoration: none;
        font-weight: 600;
        font-size: 12px;
        color: var(--text-color);
        text-align: center;
        justify-content: center;
        background-color: var(--input-color);
        border-top: 2px solid var(--toolbarResizerBorder-color);
        border-left: 1px solid var(--toolbarResizerBorder-color);
        border-right: 1px solid var(--toolbarResizerBorder-color);
        border-bottom: 1px solid var(--toolbarResizerBorder-color);
        border-radius: 3px;
      }
      .add-button:not([disabled]):hover {
        background-color: var(--hover-color);
      }
      .add-button[disabled] {
        opacity: 0.7;
        pointer-events: none;
        background-color: var(--hover-color);
      }
      .add-button:active {
        background-color: var(--active-color);
      }
    </style>
  `,
                    animations: [RotateAnimation],
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiThemeService }, { type: StiLocalizationService }, { type: StiColumnDraggableService }, { type: StiMouseService }], propDecorators: { property: [{
                type: Input
            }], booleanButton: [{
                type: ViewChild,
                args: ["booleanButton"]
            }] } });

class StiExceedMarginsEditorComponent {
    constructor(model, helper, theme, loc) {
        this.model = model;
        this.helper = helper;
        this.theme = theme;
        this.loc = loc;
    }
    get margins() {
        return this.helper.getProperty(this.object, this.property.property);
    }
    setAll() {
        this.margins.drawTop = true;
        this.margins.drawLeft = true;
        this.margins.drawBottom = true;
        this.margins.drawRight = true;
    }
    setNone() {
        this.margins.drawTop = false;
        this.margins.drawLeft = false;
        this.margins.drawBottom = false;
        this.margins.drawRight = false;
    }
    changeState(value) {
        this.margins[value] = !this.margins[value];
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiExceedMarginsEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiThemeService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiExceedMarginsEditorComponent, selector: "sti-exceed-margins-editor", inputs: { property: "property", object: "object" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="7" *ngIf="property.property != 'gridLines'">
          <div class="button-group">
            <div
              class="button {{
                margins.drawTop && margins.drawLeft && margins.drawBottom && margins.drawRight ? 'active' : ''
              }}"
              [stiTooltip]="loc.get2('PropertyEnum', 'ChartGridLinesAll')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="setAll()"
            >
              <img [src]="theme.getIcon('All')" alt="" />
            </div>
            <div
              class="button {{
                !margins.drawTop && !margins.drawLeft && !margins.drawBottom && !margins.drawRight ? 'active' : ''
              }}"
              [stiTooltip]="loc.get2('PropertyEnum', 'BorderStyleNone')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="setNone()"
            >
              <img [src]="theme.getIcon('None')" alt="" />
            </div>
            <div
              class="button {{ margins.drawTop ? 'active' : '' }}"
              [stiTooltip]="loc.getP('Top')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawTop')"
            >
              <img [src]="theme.getIcon('Top')" alt="" />
            </div>
            <div
              class="button {{ margins.drawLeft ? 'active' : '' }}"
              [stiTooltip]="loc.getP('Left')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawLeft')"
            >
              <img [src]="theme.getIcon('Left')" alt="" />
            </div>
            <div
              class="button {{ margins.drawBottom ? 'active' : '' }}"
              [stiTooltip]="loc.getP('Bottom')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawBottom')"
            >
              <img [src]="theme.getIcon('Bottom')" alt="" />
            </div>
            <div
              class="button {{ margins.drawRight ? 'active' : '' }}"
              [stiTooltip]="loc.getP('Right')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawRight')"
            >
              <img [src]="theme.getIcon('Right')" alt="" />
            </div>
          </div>
        </td>
      </tr>
    </table>
    <style>
      td {
        text-align: end;
      }
      tr {
        padding: 3px 0px 3px 0px;
      }
      .active {
        background-color: var(--active-color) !important;
      }
      .active:hover {
        background-color: var(--active-color) !important;
      }
      .button-group {
        display: flex;
        width: 100%;
        flex-direction: row;
        justify-content: start;
      }
      .button {
        height: 22px;
        width: 28px;
        background-color: var(--back-color);
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .button img {
        height: 16px;
        width: 16px;
      }
      .button:hover {
        background-color: var(--hover-color);
      }
      .button:active {
        background-color: var(--active-color);
      }
    </style>
  `, isInline: true, styles: ["\n      td {\n        text-align: end;\n      }\n      tr {\n        padding: 3px 0px 3px 0px;\n      }\n      .active {\n        background-color: var(--active-color) !important;\n      }\n      .active:hover {\n        background-color: var(--active-color) !important;\n      }\n      .button-group {\n        display: flex;\n        width: 100%;\n        flex-direction: row;\n        justify-content: start;\n      }\n      .button {\n        height: 22px;\n        width: 28px;\n        background-color: var(--back-color);\n        display: flex;\n        align-items: center;\n        justify-content: center;\n      }\n      .button img {\n        height: 16px;\n        width: 16px;\n      }\n      .button:hover {\n        background-color: var(--hover-color);\n      }\n      .button:active {\n        background-color: var(--active-color);\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiExceedMarginsEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-exceed-margins-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr>
        <td colspan="7" *ngIf="property.property != 'gridLines'">
          <div class="button-group">
            <div
              class="button {{
                margins.drawTop && margins.drawLeft && margins.drawBottom && margins.drawRight ? 'active' : ''
              }}"
              [stiTooltip]="loc.get2('PropertyEnum', 'ChartGridLinesAll')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="setAll()"
            >
              <img [src]="theme.getIcon('All')" alt="" />
            </div>
            <div
              class="button {{
                !margins.drawTop && !margins.drawLeft && !margins.drawBottom && !margins.drawRight ? 'active' : ''
              }}"
              [stiTooltip]="loc.get2('PropertyEnum', 'BorderStyleNone')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="setNone()"
            >
              <img [src]="theme.getIcon('None')" alt="" />
            </div>
            <div
              class="button {{ margins.drawTop ? 'active' : '' }}"
              [stiTooltip]="loc.getP('Top')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawTop')"
            >
              <img [src]="theme.getIcon('Top')" alt="" />
            </div>
            <div
              class="button {{ margins.drawLeft ? 'active' : '' }}"
              [stiTooltip]="loc.getP('Left')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawLeft')"
            >
              <img [src]="theme.getIcon('Left')" alt="" />
            </div>
            <div
              class="button {{ margins.drawBottom ? 'active' : '' }}"
              [stiTooltip]="loc.getP('Bottom')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawBottom')"
            >
              <img [src]="theme.getIcon('Bottom')" alt="" />
            </div>
            <div
              class="button {{ margins.drawRight ? 'active' : '' }}"
              [stiTooltip]="loc.getP('Right')"
              tooltipPosition="bottom"
              showDelay="500"
              (click)="changeState('drawRight')"
            >
              <img [src]="theme.getIcon('Right')" alt="" />
            </div>
          </div>
        </td>
      </tr>
    </table>
    <style>
      td {
        text-align: end;
      }
      tr {
        padding: 3px 0px 3px 0px;
      }
      .active {
        background-color: var(--active-color) !important;
      }
      .active:hover {
        background-color: var(--active-color) !important;
      }
      .button-group {
        display: flex;
        width: 100%;
        flex-direction: row;
        justify-content: start;
      }
      .button {
        height: 22px;
        width: 28px;
        background-color: var(--back-color);
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .button img {
        height: 16px;
        width: 16px;
      }
      .button:hover {
        background-color: var(--hover-color);
      }
      .button:active {
        background-color: var(--active-color);
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiThemeService }, { type: StiLocalizationService }], propDecorators: { property: [{
                type: Input
            }], object: [{
                type: Input
            }] } });

class StiSvgImageComponent {
    constructor(barcodeService) {
        this.barcodeService = barcodeService;
    }
    ngOnChanges(changes) {
        if (this.content) {
            this.content.nativeElement.innerHTML = this.svg;
        }
    }
    ngAfterViewInit() {
        this.content.nativeElement.innerHTML = this.svg;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSvgImageComponent, deps: [{ token: StiBarcodeService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiSvgImageComponent, selector: "sti-svg-image", inputs: { svg: "svg" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 168 168" width="50" height="50" x="0" y="0">
      <g #content></g>
    </svg>
  `, isInline: true }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSvgImageComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-svg-image",
                    template: `
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 168 168" width="50" height="50" x="0" y="0">
      <g #content></g>
    </svg>
  `,
                }]
        }], ctorParameters: () => [{ type: StiBarcodeService }], propDecorators: { content: [{
                type: ViewChild,
                args: ["content"]
            }], svg: [{
                type: Input
            }] } });

class StiBarcodeStyleEditorComponent {
    get currentBarcode() {
        return this.barcodeService.barcodeStyles.find((element) => element.value == this.element?.style).innerHtml;
    }
    constructor(model, barcodeService) {
        this.model = model;
        this.barcodeService = barcodeService;
    }
    showPreview(event) {
        let element = document.querySelector(".current-barcode");
        let elementRect = this.model.getPositionRelativeToForm(element);
        let propertyGrid = document.querySelector(".properties");
        let propertyGridRect = this.model.getPositionRelativeToForm(propertyGrid);
        this.barcodeService.previewWidth = propertyGridRect.width - (elementRect.left - propertyGridRect.left);
        this.barcodeService.previewY = elementRect.bottom;
        this.barcodeService.previewX = elementRect.left;
        this.barcodeService.showBarcodePreview = true;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBarcodeStyleEditorComponent, deps: [{ token: StiModelService }, { token: StiBarcodeService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiBarcodeStyleEditorComponent, selector: "sti-barcode-style-editor", inputs: { property: "property", element: "element" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <div class="current-barcode" (click)="showPreview($event)">
        <sti-svg-image [svg]="currentBarcode"></sti-svg-image>
      </div>
    </table>
    <style>
      .current-barcode {
        height: min-content;
        width: min-content;
        padding: 3px 3px 0 3px;
      }
      .current-barcode:hover {
        background-color: var(--hover-color);
      }
      .current-barcode:active {
        background-color: var(--active-color);
      }
    </style>
  `, isInline: true, styles: ["\n      .current-barcode {\n        height: min-content;\n        width: min-content;\n        padding: 3px 3px 0 3px;\n      }\n      .current-barcode:hover {\n        background-color: var(--hover-color);\n      }\n      .current-barcode:active {\n        background-color: var(--active-color);\n      }\n    "], dependencies: [{ kind: "component", type: StiSvgImageComponent, selector: "sti-svg-image", inputs: ["svg"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBarcodeStyleEditorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-barcode-style-editor",
                    template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <div class="current-barcode" (click)="showPreview($event)">
        <sti-svg-image [svg]="currentBarcode"></sti-svg-image>
      </div>
    </table>
    <style>
      .current-barcode {
        height: min-content;
        width: min-content;
        padding: 3px 3px 0 3px;
      }
      .current-barcode:hover {
        background-color: var(--hover-color);
      }
      .current-barcode:active {
        background-color: var(--active-color);
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiBarcodeService }], propDecorators: { property: [{
                type: Input
            }], element: [{
                type: Input
            }] } });

class TableNavigationComponent {
    constructor(loc, model) {
        this.loc = loc;
        this.model = model;
        model.currentTablePropertyHeader.subscribe((header) => {
            this.model.currentTableHeader = header;
        });
    }
    setTablePropertyHeader(header) {
        this.model.currentTableHeader = header;
        if (this.model.selectedComponent.element instanceof StiTableElement) {
            if (header == "Columns") {
                this.model.selectedComponent.element.showColumnsEditor = true;
            }
            else if (header == "Rows") {
                this.model.selectedComponent.element.showRowsEditor = true;
            }
            else if (header == "Totals") {
                this.model.selectedComponent.element.showTotalsEditor = true;
            }
            else {
                this.model.selectedComponent.element.showHeaderEditor = true;
            }
        }
        this.model.needToRefresh.next(true);
    }
    getClass(header) {
        return this.model.currentTableHeader == header ? "current" : "other";
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TableNavigationComponent, deps: [{ token: StiLocalizationService }, { token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: TableNavigationComponent, selector: "table-navigation", ngImport: i0, template: `
    <div class="table-property-header">
      <a (click)="setTablePropertyHeader('Main')"
        ><span [class]="getClass('Main')">{{ loc.get2("FormOptions", "Main") }}</span></a
      >
      <a (click)="setTablePropertyHeader('Columns')"
        ><span [class]="getClass('Columns')">{{ loc.getP("Columns") }}</span></a
      >
      <a (click)="setTablePropertyHeader('Rows')"
        ><span [class]="getClass('Rows')">{{ loc.getP("Rows") }}</span></a
      >
      <a (click)="setTablePropertyHeader('Totals')"
        ><span [class]="getClass('Totals')" (click)="setTablePropertyHeader('Totals')">{{
          loc.getP("Totals")
        }}</span></a
      >
    </div>
  `, isInline: true, styles: [".table-property-header{display:flex;height:30px;align-items:center;background-color:var(--back-color);width:100%;-webkit-touch-callout:none;-webkit-user-select:none;font-family:Segoe UI;font-size:13px}a span{height:100%;padding:6px 3px 3px;align-items:center;justify-items:center}.table-property-header a{height:100%;width:100%;text-decoration:none;text-align:center;font-size:13px;cursor:default;display:flex;align-items:center;justify-content:center}.table-property-header a:hover{background-color:var(--hover-color)}a:hover span{width:100%}.current{color:var(--text-color);font-weight:700;border-bottom:2px solid rgb(42,115,197)}.other{color:var(--text-color)}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TableNavigationComponent, decorators: [{
            type: Component,
            args: [{ selector: "table-navigation", template: `
    <div class="table-property-header">
      <a (click)="setTablePropertyHeader('Main')"
        ><span [class]="getClass('Main')">{{ loc.get2("FormOptions", "Main") }}</span></a
      >
      <a (click)="setTablePropertyHeader('Columns')"
        ><span [class]="getClass('Columns')">{{ loc.getP("Columns") }}</span></a
      >
      <a (click)="setTablePropertyHeader('Rows')"
        ><span [class]="getClass('Rows')">{{ loc.getP("Rows") }}</span></a
      >
      <a (click)="setTablePropertyHeader('Totals')"
        ><span [class]="getClass('Totals')" (click)="setTablePropertyHeader('Totals')">{{
          loc.getP("Totals")
        }}</span></a
      >
    </div>
  `, styles: [".table-property-header{display:flex;height:30px;align-items:center;background-color:var(--back-color);width:100%;-webkit-touch-callout:none;-webkit-user-select:none;font-family:Segoe UI;font-size:13px}a span{height:100%;padding:6px 3px 3px;align-items:center;justify-items:center}.table-property-header a{height:100%;width:100%;text-decoration:none;text-align:center;font-size:13px;cursor:default;display:flex;align-items:center;justify-content:center}.table-property-header a:hover{background-color:var(--hover-color)}a:hover span{width:100%}.current{color:var(--text-color);font-weight:700;border-bottom:2px solid rgb(42,115,197)}.other{color:var(--text-color)}\n"] }]
        }], ctorParameters: () => [{ type: StiLocalizationService }, { type: StiModelService }] });

class StiComponentHeightEditorComponent {
    constructor(model, helper, render, mouseService) {
        this.model = model;
        this.helper = helper;
        this.render = render;
        this.mouseService = mouseService;
        this.buttonDown = 0;
        this.mouseOver = false;
        this.focused = false;
    }
    ngOnDestroy() {
        this.mouseUpSubscription?.unsubscribe();
    }
    get value() {
        return this.helper.getProperty(this.element, this.property.property);
    }
    set value(val) {
        this.helper.setProperty(this.element, this.property.property, this.checkValue(val));
        let container = this.model.getElementPage(this.element) ?? this.model.getElementPanel(this.element);
        this.render.insertElement(this.element, container.contentAreaWidth);
    }
    onLostFocus(object) {
        if (this.checkValue(Number(object.currentTarget.value)) != this.value) {
            this.value = Number(object.currentTarget.value);
        }
        else {
            this.model.needToRefresh.next(true);
            this.clear();
        }
        this.model.formEvents.next({ name: "ValueChanged" });
    }
    checkValue(value) {
        let container = this.model.getElementPage(this.element) ?? this.model.getElementPanel(this.element);
        let otherElements = Array.from(container.elements);
        otherElements.splice(otherElements.indexOf(this.element), 1);
        let freeAreaHeight = this.render.getFreeToBottomResizeArea(this.element, otherElements);
        let oldValue = this.helper.getProperty(this.element, this.property.property);
        let roundValue = Math.round(value / this.model.form.settings.gridVerticalStep) * this.model.form.settings.gridVerticalStep;
        if (roundValue <= this.element.geometry.minHeight) {
            return this.element.geometry.minHeight;
        }
        else if (roundValue >= oldValue + freeAreaHeight) {
            return oldValue + freeAreaHeight;
        }
        else {
            return roundValue;
        }
    }
    clear() {
        setTimeout(() => {
            this.buttonDown = 0;
        }, 0);
    }
    setIncDec(value) {
        if (this.incTimeout) {
            clearTimeout(this.incTimeout);
            this.incTimeout = null;
        }
        setTimeout(() => {
            this.value += value;
            this.buttonDown = value;
            this.incDecTimer();
            this.model.formEvents.next({ name: "ValueChanged" });
        }, 0);
    }
    incDecTimer(first = true) {
        let this_ = this;
        this.incTimeout = setTimeout(() => {
            if (this_.buttonDown != 0) {
                this_.value += this_.buttonDown;
                this_.incDecTimer(false);
                this.model.formEvents.next({ name: "ValueChanged" });
            }
        }, first ? 400 : 50);
    }
    ngOnInit() {
        this.mouseUpSubscription = this.mouseService.getDocumentMouseUp().subscribe(() => {
            this.buttonDown = 0;
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiComponentHeightEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiRectangleGeometryLayout }, { token: StiMouseService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiComponentHeightEditorComponent, selector: "sti-component-height-editor", inputs: { property: "property", element: "element" }, ngImport: i0, template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr *ngIf="property.type === 'componentHeight'">
        <td colspan="5" [style]="{ width: '100%' }">
          <div class="number-box">
            <div class="value">
              <input
                type="number"
                (blur)="onLostFocus($event)"
                (keyup.enter)="onLostFocus($event)"
                [value]="value"
                class="p-inputnumber-button"
                [style]="{
                  width: '100%',
                  height: '100%',
                  fontSize: '12px',
                  fontWeight: '500',
                  padding: '3px 5px',
                  borderRadius: '3px'
                }"
              />
            </div>
            <div class="buttons">
              <div
                class="button-up"
                (mousedown)="setIncDec(model.form.settings.gridVerticalStep)"
                (mouseup)="clear()"
                (mouseleave)="clear()"
              >
                <i class="pi pi-angle-up"></i>
              </div>
              <div
                class="button-down"
                (mousedown)="setIncDec(-model.form.settings.gridVerticalStep)"
                (mouseup)="clear()"
                (mouseleave)="clear()"
              >
                <i class="pi pi-angle-down"></i>
              </div>
            </div>
          </div>
        </td>
      </tr>
    </table>
  `, isInline: true, styles: [".value:hover{cursor:text}.image-upload>input{display:none}.number-box{width:100%;height:24px;border:1px solid var(--inputBorder-color);border-radius:3px;background-color:var(--input-color);position:relative;display:flex}.value{outline:none;width:100%;height:100%}.value input{outline:none;background-color:var(--input-color);-moz-appearance:textfield;color:var(--text-color);border:0px}.value input[type=number]::-webkit-inner-spin-button,.value input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0;opacity:0}.value:after{content:\"\";position:absolute;right:22px;z-index:100;top:2px;width:1px;height:18px;background-color:var(--inputBorder-color)}.buttons{width:22px;height:100%;align-self:flex-end;display:flex;flex-direction:column;color:#bab9b8}.button-up{width:22px;position:relative;height:11px;border-bottom:1px solid var(--inputBorder-color);text-align:center}.button-up:hover{background-color:#d1d0cf}.button-up:active{background-color:#c3c3c3}.button-down{width:22px;position:relative;height:11px;text-align:center}.button-down:hover{background-color:#d1d0cf}.button-down:active{background-color:#c3c3c3}i{position:absolute;left:5px;height:8px;width:9px}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiComponentHeightEditorComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-component-height-editor", template: `
    <table class="sti-clear" [style]="{ width: '100%' }">
      <tr *ngIf="property.type === 'componentHeight'">
        <td colspan="5" [style]="{ width: '100%' }">
          <div class="number-box">
            <div class="value">
              <input
                type="number"
                (blur)="onLostFocus($event)"
                (keyup.enter)="onLostFocus($event)"
                [value]="value"
                class="p-inputnumber-button"
                [style]="{
                  width: '100%',
                  height: '100%',
                  fontSize: '12px',
                  fontWeight: '500',
                  padding: '3px 5px',
                  borderRadius: '3px'
                }"
              />
            </div>
            <div class="buttons">
              <div
                class="button-up"
                (mousedown)="setIncDec(model.form.settings.gridVerticalStep)"
                (mouseup)="clear()"
                (mouseleave)="clear()"
              >
                <i class="pi pi-angle-up"></i>
              </div>
              <div
                class="button-down"
                (mousedown)="setIncDec(-model.form.settings.gridVerticalStep)"
                (mouseup)="clear()"
                (mouseleave)="clear()"
              >
                <i class="pi pi-angle-down"></i>
              </div>
            </div>
          </div>
        </td>
      </tr>
    </table>
  `, styles: [".value:hover{cursor:text}.image-upload>input{display:none}.number-box{width:100%;height:24px;border:1px solid var(--inputBorder-color);border-radius:3px;background-color:var(--input-color);position:relative;display:flex}.value{outline:none;width:100%;height:100%}.value input{outline:none;background-color:var(--input-color);-moz-appearance:textfield;color:var(--text-color);border:0px}.value input[type=number]::-webkit-inner-spin-button,.value input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0;opacity:0}.value:after{content:\"\";position:absolute;right:22px;z-index:100;top:2px;width:1px;height:18px;background-color:var(--inputBorder-color)}.buttons{width:22px;height:100%;align-self:flex-end;display:flex;flex-direction:column;color:#bab9b8}.button-up{width:22px;position:relative;height:11px;border-bottom:1px solid var(--inputBorder-color);text-align:center}.button-up:hover{background-color:#d1d0cf}.button-up:active{background-color:#c3c3c3}.button-down{width:22px;position:relative;height:11px;text-align:center}.button-down:hover{background-color:#d1d0cf}.button-down:active{background-color:#c3c3c3}i{position:absolute;left:5px;height:8px;width:9px}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiRectangleGeometryLayout }, { type: StiMouseService }], propDecorators: { property: [{
                type: Input
            }], element: [{
                type: Input
            }] } });

class StiAutoCompleteComponent {
    constructor(model) {
        this.model = model;
        this.valueChange = new EventEmitter();
        this.completeItems = [];
        this.isSearching = false;
        this.delay = 300;
    }
    ngOnDestroy() {
        this.hideSubscription.unsubscribe();
        this.checkUpdates();
    }
    blurEvent(event) {
        this.checkUpdates();
    }
    selectItem(item) {
        this.value = item;
        this.valueChange.emit(this.value);
        this.showItemsList = false;
        this.showCompleteItemsList = false;
    }
    inputEvent(value) {
        this.showItemsList = false;
        this.isSearching = true;
        this.showCompleteItemsList = false;
        this.value = value;
        this.valueChange.emit(this.value);
        this.filterItems(value);
        setTimeout(() => {
            this.isSearching = false;
        });
    }
    clearTimeout() {
        if (this.timeout) {
            clearTimeout(this.timeout);
            this.timeout = null;
        }
    }
    removeItem(url, event) {
        event.stopPropagation();
        if (url == this.value && this.model.isCloudMode) {
            this.value = "cloud.stimulsoft.com";
        }
        this.model.enteredUrls.splice(this.model.enteredUrls.indexOf(url), 1);
        this.updateStore();
    }
    checkUpdates() {
        if (this.value.length > 0 && !this.items.find((item) => item == this.value)) {
            if (this.model.enteredUrls.length == 20) {
                this.model.enteredUrls.splice(19, 1);
            }
            this.model.enteredUrls.splice(0, 0, this.value);
            this.updateStore();
        }
    }
    filterItems(query) {
        this.completeItems = [];
        let filtered = [];
        for (let i = 0; i < this.items.length; i++) {
            let item = this.items[i];
            if (item.toLowerCase().indexOf(query.toLowerCase()) == 0) {
                filtered.push(item);
            }
        }
        this.completeItems = filtered;
        if (query && filtered) {
            setTimeout(() => {
                if (!this.isSearching) {
                    this.showCompleteItemsList = true;
                }
            }, this.delay);
        }
    }
    updateStore() {
        localStorage.removeItem("StiButtonLinks");
        localStorage.setItem("StiButtonLinks", this.model.enteredUrls.toString());
    }
    ngOnInit() {
        this.hideSubscription = this.model.hideActiveAutocompleteList.subscribe(() => {
            if (this.showItemsList || this.showCompleteItemsList) {
                this.showCompleteItemsList = false;
                this.showItemsList = false;
            }
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiAutoCompleteComponent, deps: [{ token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiAutoCompleteComponent, selector: "sti-autoComplete", inputs: { value: "value", items: "items" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: `
    <div class="autoComplete-container">
      <div class="autoComplete-input">
        <input type="text" [value]="value" (input)="inputEvent($event.target.value)" (blur)="blurEvent($event)" />
        <div class="autoComplete-select-button" (click)="showItemsList = !showItemsList; showCompleteItemsList = false">
          <i class="pi pi-chevron-down"></i>
        </div>
      </div>
      <div
        class="autoComplete-list-container"
        *ngIf="showItemsList"
        [style.border]="items.length == 0 ? 'none' : '1px solid #c8c8c8'"
      >
        <div class="list-item" *ngFor="let item of items" (click)="selectItem(item)">
          <span class="label">{{ item }}</span>
          <span *ngIf="item != 'cloud.stimulsoft.com'" class="delete-button" (click)="removeItem(item, $event)"
            ><img [src]="model.getImage('images.Other.CloseForm.png')"
          /></span>
        </div>
      </div>
      <div
        class="autoComplete-list-container"
        *ngIf="showCompleteItemsList"
        [style.border]="completeItems.length == 0 ? 'none' : '1px solid #c8c8c8'"
      >
        <div class="list-item" *ngFor="let option of completeItems" (click)="selectItem(option)">
          <span class="label">{{ option }}</span>
        </div>
      </div>
    </div>
  `, isInline: true, styles: [".list-item{display:flex;align-items:center;font-weight:400;font-size:12px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",Segoe UI Symbol;width:100%;color:#333;padding:.429rem .857rem}.list-item:hover{background:#eaeaea;cursor:pointer}.label{width:100%}.autoComplete-container{position:relative}.autoComplete-list-container{position:absolute;top:24px;z-index:1001;width:100%;border-radius:3px;border:1px solid #c8c8c8;background-color:#fff;overflow:auto;max-height:400px;box-shadow:0 3px 6px #00000029}.autoComplete-container{height:24px;width:100%;border-radius:3px;border:1px solid rgb(107,107,107);margin-top:1px}.autoComplete-input{width:100%;display:flex;align-items:center}.autoComplete-input input{width:100%;outline:none;border:0;height:100%;border-radius:3px;font-size:12px;font-weight:500;padding:3px 5px}.autoComplete-select-button{width:22px;height:24px;display:flex;justify-content:center;align-items:center;color:#d3d3d3}.autoComplete-select-button:hover{cursor:pointer}img{height:16px;width:16px}.delete-button:hover img{filter:saturate(500%) contrast(100%) brightness(900%) invert(900%) sepia(50%)}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiAutoCompleteComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-autoComplete", template: `
    <div class="autoComplete-container">
      <div class="autoComplete-input">
        <input type="text" [value]="value" (input)="inputEvent($event.target.value)" (blur)="blurEvent($event)" />
        <div class="autoComplete-select-button" (click)="showItemsList = !showItemsList; showCompleteItemsList = false">
          <i class="pi pi-chevron-down"></i>
        </div>
      </div>
      <div
        class="autoComplete-list-container"
        *ngIf="showItemsList"
        [style.border]="items.length == 0 ? 'none' : '1px solid #c8c8c8'"
      >
        <div class="list-item" *ngFor="let item of items" (click)="selectItem(item)">
          <span class="label">{{ item }}</span>
          <span *ngIf="item != 'cloud.stimulsoft.com'" class="delete-button" (click)="removeItem(item, $event)"
            ><img [src]="model.getImage('images.Other.CloseForm.png')"
          /></span>
        </div>
      </div>
      <div
        class="autoComplete-list-container"
        *ngIf="showCompleteItemsList"
        [style.border]="completeItems.length == 0 ? 'none' : '1px solid #c8c8c8'"
      >
        <div class="list-item" *ngFor="let option of completeItems" (click)="selectItem(option)">
          <span class="label">{{ option }}</span>
        </div>
      </div>
    </div>
  `, styles: [".list-item{display:flex;align-items:center;font-weight:400;font-size:12px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",Segoe UI Symbol;width:100%;color:#333;padding:.429rem .857rem}.list-item:hover{background:#eaeaea;cursor:pointer}.label{width:100%}.autoComplete-container{position:relative}.autoComplete-list-container{position:absolute;top:24px;z-index:1001;width:100%;border-radius:3px;border:1px solid #c8c8c8;background-color:#fff;overflow:auto;max-height:400px;box-shadow:0 3px 6px #00000029}.autoComplete-container{height:24px;width:100%;border-radius:3px;border:1px solid rgb(107,107,107);margin-top:1px}.autoComplete-input{width:100%;display:flex;align-items:center}.autoComplete-input input{width:100%;outline:none;border:0;height:100%;border-radius:3px;font-size:12px;font-weight:500;padding:3px 5px}.autoComplete-select-button{width:22px;height:24px;display:flex;justify-content:center;align-items:center;color:#d3d3d3}.autoComplete-select-button:hover{cursor:pointer}img{height:16px;width:16px}.delete-button:hover img{filter:saturate(500%) contrast(100%) brightness(900%) invert(900%) sepia(50%)}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }], propDecorators: { value: [{
                type: Input
            }], items: [{
                type: Input
            }], valueChange: [{
                type: Output
            }] } });

class AutoCompleteEditorComponent {
    constructor(model, helper) {
        this.model = model;
        this.helper = helper;
    }
    get items() {
        return this.model.enteredUrls;
    }
    get value() {
        return this.helper.getProperty(this.obj, this.property.property);
    }
    set value(val) {
        let endValue;
        if (val.indexOf(",") != -1) {
            endValue = val.replace(/[\s,]/g, "");
        }
        this.helper.setProperty(this.obj, this.property.property, endValue ?? val);
    }
    ngOnInit() {
        if (this.value && !this.items.find((item) => item == this.value)) {
            this.model.enteredUrls.push(this.value);
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AutoCompleteEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: AutoCompleteEditorComponent, selector: "auto-complete-editor", inputs: { property: "property", obj: "obj" }, viewQueries: [{ propertyName: "autoComplete", first: true, predicate: ["autoComplete"], descendants: true }], ngImport: i0, template: `<table class="sti-clear" [style]="{ width: '100%' }">
    <tr>
      <td colspan="2">
        <sti-autoComplete [(value)]="value" [items]="items"></sti-autoComplete>
      </td>
    </tr>

    <tr></tr>
  </table>`, isInline: true, styles: ["td{padding:0}\n"], dependencies: [{ kind: "component", type: StiAutoCompleteComponent, selector: "sti-autoComplete", inputs: ["value", "items"], outputs: ["valueChange"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AutoCompleteEditorComponent, decorators: [{
            type: Component,
            args: [{ selector: "auto-complete-editor", template: `<table class="sti-clear" [style]="{ width: '100%' }">
    <tr>
      <td colspan="2">
        <sti-autoComplete [(value)]="value" [items]="items"></sti-autoComplete>
      </td>
    </tr>

    <tr></tr>
  </table>`, styles: ["td{padding:0}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }], propDecorators: { autoComplete: [{
                type: ViewChild,
                args: ["autoComplete"]
            }], property: [{
                type: Input
            }], obj: [{
                type: Input
            }] } });

class StiFormElementsDropdownComponent {
    constructor(model, toolboxService, loc) {
        this.model = model;
        this.toolboxService = toolboxService;
        this.loc = loc;
        this.items = [
            { name: "Form", label: "Form" },
            { name: "Page", label: "Page" },
        ];
    }
    ngOnDestroy() {
        this.changeSubscription.unsubscribe();
    }
    selectItem(item) {
        if (item?.label == "Form") {
            this.model.selectedPage = null;
            this.model.selectedComponent = null;
            setTimeout(() => {
                this.model.needToRefresh.next(true);
            });
        }
        else if (item?.element instanceof StiFormPageElement) {
            this.model.selectedPage = item.element;
            setTimeout(() => {
                this.model.needToRefresh.next(true);
            });
        }
        else {
            this.model.needToSelectedComponent.next(item.element);
            setTimeout(() => {
                this.model.needToRefresh.next(true);
            });
        }
    }
    getItemText(item) {
        return item ? `${item?.name} : ${item?.label}` : "";
    }
    getCurrentItemText() {
        if (this.items) {
            if (this.model?.selectedComponent) {
                let item = this.items?.find((item) => item?.element == this.model.selectedComponent?.element);
                return this.getItemText(item);
            }
            else if (this.model?.selectedPage) {
                let item = this.items?.find((item) => item?.element == this.model.selectedPage);
                return this.getItemText(item);
            }
            else {
                let item = this.items?.find((item) => item?.label == "Form");
                return this.getItemText(item);
            }
        }
    }
    fillItems() {
        this.items = [];
        this.items.push({ name: this.model.form?.formName ? this.model.form?.formName : "Form", label: "Form" });
        this.model.form?.pages?.forEach((page) => {
            this.items.push({ name: page.name, label: this.getLabel(page), element: page });
            page.allElements.forEach((elem) => {
                this.items.push({ name: elem.name, label: this.getLabel(elem), element: elem });
            });
        });
    }
    showDropdown() {
        if (!this.model.showFormElementsList) {
            this.fillItems();
            this.model.showFormElementsList = true;
        }
        else {
            this.model.showFormElementsList = false;
        }
    }
    getLabel(element) {
        let toolboxElement = this.toolboxService?.elements?.find((elem) => elem.id == this.toolboxService.getToolboxId(element.type));
        return element.type == "StiPageElement"
            ? this.loc.get2("Components", "StiPage")
            : this.loc.get2(toolboxElement?.category ? toolboxElement?.category : "Components", toolboxElement?.caption) ??
                element.type;
    }
    isSelected(item) {
        if (this.model.selectedComponent) {
            return item.element == this.model.selectedComponent.element;
        }
        else if (this.model.selectedPage) {
            return item.element == this.model.selectedPage;
        }
        else {
            return item.label == "Form";
        }
    }
    sortItems(items) {
        let sortedItems = [];
        items.forEach((item) => {
            sortedItems.push(item);
        });
        return sortedItems.sort(function (a, b) {
            const nameA = a.name.toUpperCase();
            const nameB = b.name.toUpperCase();
            if (nameA < nameB) {
                return -1;
            }
            if (nameA > nameB) {
                return 1;
            }
            return 0;
        });
    }
    ngOnInit() {
        this.fillItems();
        this.changeSubscription = this.model.formEvents.subscribe((e) => {
            if (e.name == "FormChanged" || e.name == "SelectedComponentChanged" || e.name == "SelectedPageChanged") {
                this.fillItems();
            }
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFormElementsDropdownComponent, deps: [{ token: StiModelService }, { token: StiToolboxService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiFormElementsDropdownComponent, selector: "sti-form-elements-dropdown", ngImport: i0, template: `
    <div class="form-elements-dropdown-container">
      <div class="form-elements-dropdown" #dropdown (click)="showDropdown()">
        <span>{{ getCurrentItemText() }}</span>
        <i class="pi pi-chevron-down"></i>
        <div
          class="form-elements-list-container"
          *ngIf="items && model.showFormElementsList"
          [style.width.px]="dropdown.offsetWidth"
        >
          <div
            class="form-elements-list-item {{ isSelected(item) ? 'selected' : '' }}"
            *ngFor="let item of model.sortFormElementsList ? sortItems(items) : items"
            (click)="selectItem(item)"
          >
            <span>{{ getItemText(item) }}</span>
          </div>
        </div>
      </div>
      <div
        class="sort-button {{ model.sortFormElementsList ? 'selected' : '' }}"
        (click)="model.sortFormElementsList = !model.sortFormElementsList"
      >
        <img [src]="model.getImage('images.Other.Alphabetical.png')" />
      </div>
    </div>
  `, isInline: true, styles: ["i{margin-top:2px}.selected{background-color:#eee}.form-elements-list-item{font-size:13px;padding-left:5px;height:28px;display:flex;align-items:center;border-radius:3px}.form-elements-dropdown-container{display:flex;width:100%;margin:5px 0 4px}.form-elements-list-container{position:absolute;max-height:300px;background-color:#fff;padding:1px;top:24px;left:0;width:250px;z-index:99999;border:1px solid #c8c8c8;overflow-y:auto;overflow-x:hidden;border-radius:3px;font-size:13px;box-shadow:0 3px 6px #00000029}.form-elements-dropdown{width:100%;position:relative;display:flex;min-width:300px;height:24px;-webkit-user-select:none;align-items:center;background-color:#fff;margin-left:5px;border-radius:3px;border:1px solid var(--inputBorder-color)}.form-elements-dropdown:hover,.form-elements-list-item:hover{background-color:var(--hover-color);cursor:pointer}.form-elements-dropdown span{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",Segoe UI Symbol;font-size:12px;font-weight:500;color:var(--text-color);flex:1;padding-left:5px}i{color:#bab9b8;margin-right:5px}img{width:16px;height:16px;margin:0 4px}.sort-button{border-radius:3px;display:flex;align-items:center;justify-content:center;margin:0 5px}.sort-button:hover{background-color:var(--hover-color)}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFormElementsDropdownComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-form-elements-dropdown", template: `
    <div class="form-elements-dropdown-container">
      <div class="form-elements-dropdown" #dropdown (click)="showDropdown()">
        <span>{{ getCurrentItemText() }}</span>
        <i class="pi pi-chevron-down"></i>
        <div
          class="form-elements-list-container"
          *ngIf="items && model.showFormElementsList"
          [style.width.px]="dropdown.offsetWidth"
        >
          <div
            class="form-elements-list-item {{ isSelected(item) ? 'selected' : '' }}"
            *ngFor="let item of model.sortFormElementsList ? sortItems(items) : items"
            (click)="selectItem(item)"
          >
            <span>{{ getItemText(item) }}</span>
          </div>
        </div>
      </div>
      <div
        class="sort-button {{ model.sortFormElementsList ? 'selected' : '' }}"
        (click)="model.sortFormElementsList = !model.sortFormElementsList"
      >
        <img [src]="model.getImage('images.Other.Alphabetical.png')" />
      </div>
    </div>
  `, styles: ["i{margin-top:2px}.selected{background-color:#eee}.form-elements-list-item{font-size:13px;padding-left:5px;height:28px;display:flex;align-items:center;border-radius:3px}.form-elements-dropdown-container{display:flex;width:100%;margin:5px 0 4px}.form-elements-list-container{position:absolute;max-height:300px;background-color:#fff;padding:1px;top:24px;left:0;width:250px;z-index:99999;border:1px solid #c8c8c8;overflow-y:auto;overflow-x:hidden;border-radius:3px;font-size:13px;box-shadow:0 3px 6px #00000029}.form-elements-dropdown{width:100%;position:relative;display:flex;min-width:300px;height:24px;-webkit-user-select:none;align-items:center;background-color:#fff;margin-left:5px;border-radius:3px;border:1px solid var(--inputBorder-color)}.form-elements-dropdown:hover,.form-elements-list-item:hover{background-color:var(--hover-color);cursor:pointer}.form-elements-dropdown span{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",Segoe UI Symbol;font-size:12px;font-weight:500;color:var(--text-color);flex:1;padding-left:5px}i{color:#bab9b8;margin-right:5px}img{width:16px;height:16px;margin:0 4px}.sort-button{border-radius:3px;display:flex;align-items:center;justify-content:center;margin:0 5px}.sort-button:hover{background-color:var(--hover-color)}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiToolboxService }, { type: StiLocalizationService }] });

class StiPropertyGridComponent {
    get isTable() {
        return this.model?.selectedComponent?.element instanceof StiTableElement ? true : false;
    }
    get object() {
        if (this.model.selectedComponent) {
            return this.model.selectedComponent.element;
        }
        else if (this.model.selectedPage) {
            return this.model.selectedPage;
        }
        else {
            return this.model.form.settings;
        }
    }
    hasValue(property) {
        if ((property?.includes("label") || property?.includes("description")) &&
            !property?.includes("value") &&
            this.object != this.model.form.settings) {
            if (property.includes("label")) {
                let value = this.helper.getProperty(this.object, "label.value");
                if (value) {
                    return true;
                }
                else
                    return false;
            }
            else {
                if (this.object instanceof StiAddressElement) {
                    return true;
                }
                let value = this.helper.getProperty(this.object, "description.value");
                if (value) {
                    return true;
                }
                else
                    return false;
            }
        }
        else {
            return true;
        }
    }
    constructor(model, helper, loc) {
        this.model = model;
        this.helper = helper;
        this.loc = loc;
        this.isDrag = false;
        this.properties = [];
    }
    ngOnDestroy() {
        this.refreshSubscription?.unsubscribe();
        this.refreshFromLocalizationSubscription?.unsubscribe();
    }
    ngOnInit() {
        this.refreshSubscription = this.model.needToRefresh.subscribe(() => this.updateProperties());
        this.refreshFromLocalizationSubscription = StiLocalizationService.needToRefresh.subscribe(() => {
            this.updateProperties();
        });
    }
    needToDisable(property) {
        if (this.object instanceof StiSingleSelectionElement || this.object instanceof StiMultipleSelectionElement) {
            if (this.object.prefix.length > 0 && property.property == "suffix") {
                return true;
            }
            else if (this.object.suffix.length > 0 && property.property == "prefix") {
                return true;
            }
            else {
                return false;
            }
        }
        else {
            return false;
        }
    }
    back() {
        if (this.model.selectedComponent.element instanceof StiTableElement) {
            this.model.selectedComponent.element.showHeaderEditor = false;
            this.model.selectedComponent.element.showColumnsEditor = false;
            this.model.selectedComponent.element.showRowsEditor = false;
            this.model.selectedComponent.element.showTotalsEditor = false;
            this.model.needToRefresh.next(true);
        }
    }
    checkTableProperties() {
        if (this.model.selectedComponent?.element instanceof StiTableElement) {
            let tableJson = (this.model.selectedComponent?.element).saveToJsonObject({}).serialize();
            if (tableJson != this.savedTableJson) {
                this.savedTableJson = tableJson;
                this.model.form.formEvents.next({ name: "ValueChanged" });
            }
            setTimeout(() => {
                this.checkTableProperties();
            }, 500);
        }
        else {
            this.savedTableJson = null;
        }
    }
    updateProperties() {
        this.properties = [];
        this.checkTableProperties();
        if (this.model.selectedComponent?.element instanceof StiCheckBoxElement) {
            StiCheckBoxCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiTextBoxElement) {
            StiTextBoxCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiNumberBoxElement) {
            StiNumberBoxCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiComboBoxElement) {
            StiComboBoxCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiListBoxElement) {
            StiListBoxCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiSingleSelectionElement) {
            StiSingleSelectionCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiMultipleSelectionElement) {
            StiMultipleSelectionCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiLineElement) {
            StiLineCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiSignatureElement) {
            StiSignatureCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiPDFSignatureElement) {
            StiPDFSignatureCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiPanelElement) {
            StiPanelCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiDateTimeBoxElement) {
            StiDateTimeBoxCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiTableElement) {
            StiTableCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element, this.model);
        }
        else if (this.model.selectedComponent?.element instanceof StiImageElement) {
            StiImageCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiButtonElement) {
            StiButtonCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiBarcodeElement) {
            StiBarcodeCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiTextElement) {
            StiTextCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiLabelElement) {
            StiLabelCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedComponent?.element instanceof StiAddressElement) {
            StiAddressCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedPage instanceof StiFormPageElement) {
            StiFormPageCreator.createPropertyEditors(this.properties, this.model.selectedComponent?.element);
        }
        else if (this.model.selectedPage == null && this.model.selectedComponent == null && this.model.form) {
            StiSettingsCreator.createPropertyEditors(this.properties, this.model.form.settings);
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPropertyGridComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiPropertyGridComponent, selector: "property-grid", ngImport: i0, template: ` <div style="width: 100%;">
    <!--   <span *ngIf="this.model.selectedComponent">{{
      loc.get2(
        helper.getLocalizationCategory(model.selectedComponent?.element.type),
        helper.getLocalizationKey(model.selectedComponent?.element.type)
      )
    }}</span>
    <span *ngIf="this.model.selectedPage">{{
      loc.get2("Components", helper.getLocalizationKey(model.selectedPage?.type))
    }}</span>
    <span *ngIf="model.selectedComponent == null && model.selectedPage == null">{{ loc.getP("FormSettings") }}</span> -->
    <sti-form-elements-dropdown></sti-form-elements-dropdown>
    <table class="sti-clear p-component property-grid">
      <tr *ngFor="let property of properties">
        <td
          *ngIf="
            property.type != 'BooleanWithArrowEditor' &&
            property.type != 'TableColumnsEditor' &&
            property.type != 'tableNavigations' &&
            hasValue(property.property)
          "
          [colSpan]="property.type != 'divider' && property.type != 'defaultLabel' ? 1 : 2"
          [style]="{
            padding: property.type != 'divider' && property.type != 'defaultLabel' ? '5px 0px 0px 5px' : '0px',
            verticalAlign: 'top'
          }"
        >
          <sti-divider *ngIf="property.type === 'divider'"></sti-divider>
          <span *ngIf="property.type === 'defaultLabel'">{{ loc.getP("DefaultSettings") }}</span>
          <div class="label" *ngIf="property.label">
            {{ property.label.replace(":", "") }}
          </div>
        </td>
        <td
          *ngIf="property.type != 'divider' && hasValue(property.property)"
          [colSpan]="
            property.type == 'BooleanWithArrowEditor' ||
            property.type == 'TableColumnsEditor' ||
            property.type == 'tableNavigations'
              ? 8
              : ''
          "
          [style]="{ width: '100%', padding: '0px 2px 0 px 2 px' }"
        >
          <table-navigation *ngIf="property.type === 'tableNavigations'" [style]="{ width: '100%' }"></table-navigation>
          <auto-complete-editor
            [property]="property"
            [obj]="object"
            *ngIf="property.type === 'autoCompleteEditor'"
            [style]="{ width: '95%' }"
          ></auto-complete-editor>
          <sti-bool-editor
            [property]="property"
            *ngIf="property.type === 'checkbox'"
            [style]="{ width: '95%' }"
            [object]="object"
          ></sti-bool-editor>
          <sti-name-editor
            *ngIf="property.type === 'nameEditor'"
            [property]="property"
            [style]="{ width: '95%' }"
          ></sti-name-editor>
          <sti-color-editor
            *ngIf="property.type === 'color'"
            [property]="property"
            [obj]="object"
            [style]="{ width: '95%' }"
          ></sti-color-editor>
          <sti-horizontal-alignment-editor
            [property]="property"
            *ngIf="property.type === 'horizontalAlignment'"
            [object]="object"
            [style]="{ width: '95%' }"
          ></sti-horizontal-alignment-editor>
          <sti-vertical-alignment-editor
            [property]="property"
            *ngIf="property.type === 'verticalAlignment'"
            [style]="{ width: '95%' }"
          ></sti-vertical-alignment-editor>
          <sti-component-height-editor
            [property]="property"
            *ngIf="property.type === 'componentHeight'"
            [style]="{ width: '95%' }"
            [element]="object"
          >
          </sti-component-height-editor>
          <sti-label-alignment-editor
            [property]="property"
            *ngIf="property.type === 'labelAlignment'"
            [style]="{ width: '95%' }"
          >
          </sti-label-alignment-editor>
          <sti-enum-editor
            *ngIf="property.type === 'enum'"
            [property]="property"
            [object]="object"
            [style]="{ width: '95%' }"
          ></sti-enum-editor>
          <sti-simple-enum-editor
            *ngIf="property.type === 'simpleEnum'"
            [property]="property"
            [object]="object"
            [style]="{ width: '95%' }"
          ></sti-simple-enum-editor>
          <sti-font-editor
            *ngIf="property.type === 'FontEditor'"
            [object]="object"
            [property]="property"
          ></sti-font-editor>
          <sti-image-editor
            *ngIf="property.type === 'image'"
            [object]="object"
            [property]="property"
          ></sti-image-editor>
          <sti-initial-value-datetime-box-editor
            *ngIf="property.type === 'customDate'"
            [property]="property"
            [object]="object"
          ></sti-initial-value-datetime-box-editor>
          <sti-barcode-style-editor
            *ngIf="property.type === 'barcodeStyles'"
            [property]="property"
            [element]="object"
          ></sti-barcode-style-editor>
          <sti-padding-editor *ngIf="property.type === 'PaddingEditor'" [property]="property"></sti-padding-editor>
          <sti-multiline-string-editor
            *ngIf="property.type === 'MultilineEditor'"
            [property]="property"
          ></sti-multiline-string-editor>
          <sti-number-editor
            *ngIf="
              property.type === 'NumberEditor' || property.type === 'pageNumberEditor' || property.type === 'Number'
            "
            [property]="property"
            [obj]="object"
          ></sti-number-editor>
          <sti-paper-kind-editor
            *ngIf="property.type === 'paperKind' && this.model.selectedPage"
            [property]="property"
          ></sti-paper-kind-editor>
          <sti-text-editor
            *ngIf="property.type === 'TextEditor'"
            [object]="object"
            [property]="property"
            [disabled]="needToDisable(property)"
          ></sti-text-editor>
          <sti-table-item-editor
            *ngIf="property.type === 'TableItemEditor'"
            [property]="property"
          ></sti-table-item-editor>
          <sti-table-border-editor
            *ngIf="property.type === 'TableBorderEditor'"
            [property]="property"
          ></sti-table-border-editor>
          <boolean-with-arrow-editor
            *ngIf="property.type === 'BooleanWithArrowEditor'"
            [property]="property"
            [style]="{ width: '100%' }"
          ></boolean-with-arrow-editor>
          <sti-table-columns-editor
            *ngIf="property.type === 'TableColumnsEditor'"
            [property]="property"
            [style]="{ width: '100%' }"
          ></sti-table-columns-editor>
          <sti-exceed-margins-editor
            *ngIf="property.type === 'ExceedMarginsEditor'"
            [property]="property"
            [object]="object"
            [style]="{ width: '100%' }"
          ></sti-exceed-margins-editor>
          <sti-select-button-editor
            *ngIf="property.type === 'labelFormat' || property.type === 'currencyFormat'"
            [propertyType]="property.type"
            [property]="property.property"
            [object]="object"
            [style.height.px]="24"
            [style.display]="'flex'"
          >
          </sti-select-button-editor>
        </td>
      </tr>
    </table>
  </div>`, isInline: true, styles: [".table-property-header{width:100%;display:flex;margin-bottom:-3px}.table-property-header span{flex:1;display:flex;font-size:13px;justify-content:center;align-items:center;margin:0;font-weight:400;border-bottom:3px solid transparent}.table-property-header span:hover{background-color:var(--hover-color);color:#5579ae}.table-property-header .current{color:#767676;font-weight:600;border-color:var(--text-color);z-index:1}.table-property-header .other{color:var(--text-color)}.property-grid{position:relative}.property-grid-resizer{height:100%;min-width:8px}.property-grid-resizer:hover{cursor:ew-resize}table{width:100%;font-size:13px;font-weight:600;-webkit-user-select:none}span{color:#767676;font-size:13px;font-weight:700;margin-left:5px;margin-top:15px;-webkit-touch-callout:none;-webkit-user-select:none}.label{font-size:13px;font-weight:400;min-width:120px;color:var(--property-label-color);white-space:nowrap;-webkit-touch-callout:none;-webkit-user-select:none}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiBoolEditorComponent, selector: "sti-bool-editor", inputs: ["property", "object"] }, { kind: "component", type: StiColorEditorComponent, selector: "sti-color-editor", inputs: ["property", "textColor", "obj"] }, { kind: "component", type: StiEnumEditorComponent, selector: "sti-enum-editor", inputs: ["property", "object", "index"] }, { kind: "component", type: StiFontEditorComponent, selector: "sti-font-editor", inputs: ["property", "object"] }, { kind: "component", type: StiImageEditorComponent, selector: "sti-image-editor", inputs: ["property", "object"] }, { kind: "component", type: StiPaddingEditorComponent, selector: "sti-padding-editor", inputs: ["property"] }, { kind: "component", type: StiMultilineStringEditorComponent, selector: "sti-multiline-string-editor", inputs: ["property", "object"] }, { kind: "component", type: StiNumberEditorComponent, selector: "sti-number-editor", inputs: ["property", "obj"] }, { kind: "component", type: StiPaperKindEditorComponent, selector: "sti-paper-kind-editor", inputs: ["property"] }, { kind: "component", type: StiVerticalAlignmentEditorComponent, selector: "sti-vertical-alignment-editor", inputs: ["property"] }, { kind: "component", type: StiTextEditorComponent, selector: "sti-text-editor", inputs: ["property", "object", "disabled"] }, { kind: "component", type: StiNameEditorComponent, selector: "sti-name-editor", inputs: ["property"] }, { kind: "component", type: StiHorizontalAlignmentEditorComponent, selector: "sti-horizontal-alignment-editor", inputs: ["property", "object"] }, { kind: "component", type: StiLabelAlignmentEditorComponent, selector: "sti-label-alignment-editor", inputs: ["property"] }, { kind: "component", type: StiBooleanWithArrowEditorComponent, selector: "boolean-with-arrow-editor", inputs: ["property"] }, { kind: "component", type: StiTableItemEditorComponent, selector: "sti-table-item-editor", inputs: ["property"] }, { kind: "component", type: StiTableBorderEditorComponent, selector: "sti-table-border-editor", inputs: ["property", "state", "object"] }, { kind: "component", type: StiTableColumnsEditorComponent, selector: "sti-table-columns-editor", inputs: ["property"] }, { kind: "component", type: StiExceedMarginsEditorComponent, selector: "sti-exceed-margins-editor", inputs: ["property", "object"] }, { kind: "component", type: StiSelectButtonEditorComponent, selector: "sti-select-button-editor", inputs: ["propertyType", "property", "object"] }, { kind: "component", type: StiBarcodeStyleEditorComponent, selector: "sti-barcode-style-editor", inputs: ["property", "element"] }, { kind: "component", type: StiSimpleEnumEditorComponent, selector: "sti-simple-enum-editor", inputs: ["property", "object"] }, { kind: "component", type: TableNavigationComponent, selector: "table-navigation" }, { kind: "component", type: StiComponentHeightEditorComponent, selector: "sti-component-height-editor", inputs: ["property", "element"] }, { kind: "component", type: AutoCompleteEditorComponent, selector: "auto-complete-editor", inputs: ["property", "obj"] }, { kind: "component", type: StiDividerComponent, selector: "sti-divider" }, { kind: "component", type: StiFormElementsDropdownComponent, selector: "sti-form-elements-dropdown" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPropertyGridComponent, decorators: [{
            type: Component,
            args: [{ selector: "property-grid", template: ` <div style="width: 100%;">
    <!--   <span *ngIf="this.model.selectedComponent">{{
      loc.get2(
        helper.getLocalizationCategory(model.selectedComponent?.element.type),
        helper.getLocalizationKey(model.selectedComponent?.element.type)
      )
    }}</span>
    <span *ngIf="this.model.selectedPage">{{
      loc.get2("Components", helper.getLocalizationKey(model.selectedPage?.type))
    }}</span>
    <span *ngIf="model.selectedComponent == null && model.selectedPage == null">{{ loc.getP("FormSettings") }}</span> -->
    <sti-form-elements-dropdown></sti-form-elements-dropdown>
    <table class="sti-clear p-component property-grid">
      <tr *ngFor="let property of properties">
        <td
          *ngIf="
            property.type != 'BooleanWithArrowEditor' &&
            property.type != 'TableColumnsEditor' &&
            property.type != 'tableNavigations' &&
            hasValue(property.property)
          "
          [colSpan]="property.type != 'divider' && property.type != 'defaultLabel' ? 1 : 2"
          [style]="{
            padding: property.type != 'divider' && property.type != 'defaultLabel' ? '5px 0px 0px 5px' : '0px',
            verticalAlign: 'top'
          }"
        >
          <sti-divider *ngIf="property.type === 'divider'"></sti-divider>
          <span *ngIf="property.type === 'defaultLabel'">{{ loc.getP("DefaultSettings") }}</span>
          <div class="label" *ngIf="property.label">
            {{ property.label.replace(":", "") }}
          </div>
        </td>
        <td
          *ngIf="property.type != 'divider' && hasValue(property.property)"
          [colSpan]="
            property.type == 'BooleanWithArrowEditor' ||
            property.type == 'TableColumnsEditor' ||
            property.type == 'tableNavigations'
              ? 8
              : ''
          "
          [style]="{ width: '100%', padding: '0px 2px 0 px 2 px' }"
        >
          <table-navigation *ngIf="property.type === 'tableNavigations'" [style]="{ width: '100%' }"></table-navigation>
          <auto-complete-editor
            [property]="property"
            [obj]="object"
            *ngIf="property.type === 'autoCompleteEditor'"
            [style]="{ width: '95%' }"
          ></auto-complete-editor>
          <sti-bool-editor
            [property]="property"
            *ngIf="property.type === 'checkbox'"
            [style]="{ width: '95%' }"
            [object]="object"
          ></sti-bool-editor>
          <sti-name-editor
            *ngIf="property.type === 'nameEditor'"
            [property]="property"
            [style]="{ width: '95%' }"
          ></sti-name-editor>
          <sti-color-editor
            *ngIf="property.type === 'color'"
            [property]="property"
            [obj]="object"
            [style]="{ width: '95%' }"
          ></sti-color-editor>
          <sti-horizontal-alignment-editor
            [property]="property"
            *ngIf="property.type === 'horizontalAlignment'"
            [object]="object"
            [style]="{ width: '95%' }"
          ></sti-horizontal-alignment-editor>
          <sti-vertical-alignment-editor
            [property]="property"
            *ngIf="property.type === 'verticalAlignment'"
            [style]="{ width: '95%' }"
          ></sti-vertical-alignment-editor>
          <sti-component-height-editor
            [property]="property"
            *ngIf="property.type === 'componentHeight'"
            [style]="{ width: '95%' }"
            [element]="object"
          >
          </sti-component-height-editor>
          <sti-label-alignment-editor
            [property]="property"
            *ngIf="property.type === 'labelAlignment'"
            [style]="{ width: '95%' }"
          >
          </sti-label-alignment-editor>
          <sti-enum-editor
            *ngIf="property.type === 'enum'"
            [property]="property"
            [object]="object"
            [style]="{ width: '95%' }"
          ></sti-enum-editor>
          <sti-simple-enum-editor
            *ngIf="property.type === 'simpleEnum'"
            [property]="property"
            [object]="object"
            [style]="{ width: '95%' }"
          ></sti-simple-enum-editor>
          <sti-font-editor
            *ngIf="property.type === 'FontEditor'"
            [object]="object"
            [property]="property"
          ></sti-font-editor>
          <sti-image-editor
            *ngIf="property.type === 'image'"
            [object]="object"
            [property]="property"
          ></sti-image-editor>
          <sti-initial-value-datetime-box-editor
            *ngIf="property.type === 'customDate'"
            [property]="property"
            [object]="object"
          ></sti-initial-value-datetime-box-editor>
          <sti-barcode-style-editor
            *ngIf="property.type === 'barcodeStyles'"
            [property]="property"
            [element]="object"
          ></sti-barcode-style-editor>
          <sti-padding-editor *ngIf="property.type === 'PaddingEditor'" [property]="property"></sti-padding-editor>
          <sti-multiline-string-editor
            *ngIf="property.type === 'MultilineEditor'"
            [property]="property"
          ></sti-multiline-string-editor>
          <sti-number-editor
            *ngIf="
              property.type === 'NumberEditor' || property.type === 'pageNumberEditor' || property.type === 'Number'
            "
            [property]="property"
            [obj]="object"
          ></sti-number-editor>
          <sti-paper-kind-editor
            *ngIf="property.type === 'paperKind' && this.model.selectedPage"
            [property]="property"
          ></sti-paper-kind-editor>
          <sti-text-editor
            *ngIf="property.type === 'TextEditor'"
            [object]="object"
            [property]="property"
            [disabled]="needToDisable(property)"
          ></sti-text-editor>
          <sti-table-item-editor
            *ngIf="property.type === 'TableItemEditor'"
            [property]="property"
          ></sti-table-item-editor>
          <sti-table-border-editor
            *ngIf="property.type === 'TableBorderEditor'"
            [property]="property"
          ></sti-table-border-editor>
          <boolean-with-arrow-editor
            *ngIf="property.type === 'BooleanWithArrowEditor'"
            [property]="property"
            [style]="{ width: '100%' }"
          ></boolean-with-arrow-editor>
          <sti-table-columns-editor
            *ngIf="property.type === 'TableColumnsEditor'"
            [property]="property"
            [style]="{ width: '100%' }"
          ></sti-table-columns-editor>
          <sti-exceed-margins-editor
            *ngIf="property.type === 'ExceedMarginsEditor'"
            [property]="property"
            [object]="object"
            [style]="{ width: '100%' }"
          ></sti-exceed-margins-editor>
          <sti-select-button-editor
            *ngIf="property.type === 'labelFormat' || property.type === 'currencyFormat'"
            [propertyType]="property.type"
            [property]="property.property"
            [object]="object"
            [style.height.px]="24"
            [style.display]="'flex'"
          >
          </sti-select-button-editor>
        </td>
      </tr>
    </table>
  </div>`, styles: [".table-property-header{width:100%;display:flex;margin-bottom:-3px}.table-property-header span{flex:1;display:flex;font-size:13px;justify-content:center;align-items:center;margin:0;font-weight:400;border-bottom:3px solid transparent}.table-property-header span:hover{background-color:var(--hover-color);color:#5579ae}.table-property-header .current{color:#767676;font-weight:600;border-color:var(--text-color);z-index:1}.table-property-header .other{color:var(--text-color)}.property-grid{position:relative}.property-grid-resizer{height:100%;min-width:8px}.property-grid-resizer:hover{cursor:ew-resize}table{width:100%;font-size:13px;font-weight:600;-webkit-user-select:none}span{color:#767676;font-size:13px;font-weight:700;margin-left:5px;margin-top:15px;-webkit-touch-callout:none;-webkit-user-select:none}.label{font-size:13px;font-weight:400;min-width:120px;color:var(--property-label-color);white-space:nowrap;-webkit-touch-callout:none;-webkit-user-select:none}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiLocalizationService }] });

class PropertiesComponent {
    constructor(model, mouseService, helper, loc) {
        this.model = model;
        this.mouseService = mouseService;
        this.helper = helper;
        this.loc = loc;
        this.isDrag = false;
    }
    ngOnDestroy() {
        this.mouseUpSubscription?.unsubscribe();
        this.mouseMoveSubscription?.unsubscribe();
    }
    ngOnInit() {
        this.mouseMoveSubscription = this.mouseService.getDocumentMouseMove().subscribe((event) => {
            this.drag(event);
        });
        this.mouseUpSubscription = this.mouseService.getDocumentMouseUp().subscribe((event) => {
            this.endDrag(event);
        });
    }
    onMouseDown(event) {
        event.preventDefault();
        this.startWidth = this.model.propertyGridWidth;
        this.startX = event.clientX;
        this.isDrag = true;
    }
    drag(event) {
        if (this.isDrag) {
            let delta = event.clientX - this.startX;
            if (this.startWidth - delta >= 500) {
                this.model.propertyGridWidth = 500;
            }
            else if (this.startWidth - delta <= 220) {
                this.model.propertyGridWidth = 220;
            }
            else {
                this.model.propertyGridWidth = this.startWidth - delta;
            }
        }
    }
    endDrag(event) {
        this.isDrag = false;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PropertiesComponent, deps: [{ token: StiModelService }, { token: StiMouseService }, { token: StiHelperService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: PropertiesComponent, selector: "app-properties", ngImport: i0, template: `
    <div class="property-grid-resizer" (mousedown)="onMouseDown($event)"></div>
    <div class="property-grid-container">
      <div class="property-grid-components">
        <forms-tree *ngIf="model.currentPropertyGridMode == 'Tree'"></forms-tree>
        <property-grid *ngIf="model.currentPropertyGridMode == 'Properties'"></property-grid>
      </div>
      <div class="property-grid-navigation">
        <property-grid-navigation></property-grid-navigation>
      </div>
    </div>
  `, isInline: true, styles: [".property-grid-resizer{height:100%;min-width:8px}.property-grid-resizer:hover{cursor:ew-resize}.property-grid-container{display:flex;flex-direction:column;width:100%}.property-grid-components{flex:1;overflow-y:scroll;scroll-behavior:smooth}*{scrollbar-width:thin;scrollbar-color:var(--thumb-color),var(--back-color)}*::-webkit-scrollbar{-webkit-appearance:none;background-color:var(--back-color);height:10px;width:10px;outline:none}*::-webkit-scrollbar-button{-webkit-appearance:none;height:3px;width:3px}*::-webkit-scrollbar-thumb{-webkit-appearance:none;background-color:var(--thumb-color);height:10px;min-width:25px;max-width:80%;border-radius:4px;border:2px solid var(--back-color)}*::-webkit-scrollbar-thumb:hover{background-color:var(--trackHover-color);height:10px}*::-webkit-scrollbar-track{-webkit-appearance:none;background-color:var(--back-color);border:1px solid var(--back-color)}*::-webkit-scrollbar-corner{background-color:var(--back-color)}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiPropertyGridNavigationComponent, selector: "property-grid-navigation" }, { kind: "component", type: StiFormsTreeComponent, selector: "forms-tree" }, { kind: "component", type: StiPropertyGridComponent, selector: "property-grid" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PropertiesComponent, decorators: [{
            type: Component,
            args: [{ selector: "app-properties", template: `
    <div class="property-grid-resizer" (mousedown)="onMouseDown($event)"></div>
    <div class="property-grid-container">
      <div class="property-grid-components">
        <forms-tree *ngIf="model.currentPropertyGridMode == 'Tree'"></forms-tree>
        <property-grid *ngIf="model.currentPropertyGridMode == 'Properties'"></property-grid>
      </div>
      <div class="property-grid-navigation">
        <property-grid-navigation></property-grid-navigation>
      </div>
    </div>
  `, styles: [".property-grid-resizer{height:100%;min-width:8px}.property-grid-resizer:hover{cursor:ew-resize}.property-grid-container{display:flex;flex-direction:column;width:100%}.property-grid-components{flex:1;overflow-y:scroll;scroll-behavior:smooth}*{scrollbar-width:thin;scrollbar-color:var(--thumb-color),var(--back-color)}*::-webkit-scrollbar{-webkit-appearance:none;background-color:var(--back-color);height:10px;width:10px;outline:none}*::-webkit-scrollbar-button{-webkit-appearance:none;height:3px;width:3px}*::-webkit-scrollbar-thumb{-webkit-appearance:none;background-color:var(--thumb-color);height:10px;min-width:25px;max-width:80%;border-radius:4px;border:2px solid var(--back-color)}*::-webkit-scrollbar-thumb:hover{background-color:var(--trackHover-color);height:10px}*::-webkit-scrollbar-track{-webkit-appearance:none;background-color:var(--back-color);border:1px solid var(--back-color)}*::-webkit-scrollbar-corner{background-color:var(--back-color)}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiMouseService }, { type: StiHelperService }, { type: StiLocalizationService }] });

class StiDraggableElementContainerComponent {
    constructor(draggableService, model) {
        this.draggableService = draggableService;
        this.model = model;
    }
    ngOnInit() { }
    ngAfterViewChecked() { }
    ngAfterViewInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDraggableElementContainerComponent, deps: [{ token: StiDraggableService }, { token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiDraggableElementContainerComponent, selector: "sti-draggable-element-container", viewQueries: [{ propertyName: "container", first: true, predicate: ["element"], descendants: true }], ngImport: i0, template: `
    <div
      #element
      style="position: absolute; z-index: 999; background-color:rgb(226,226,226); opacity:0.7; userSelect:none;"
      [style.visibility]="model.draggingElement ? 'visible' : 'hidden'"
      [style.left.px]="draggableService.left"
      [style.top.px]="draggableService.top"
      [style.width.px]="model.draggingElement?.width"
      [style.height.px]="model.draggingElement?.height"
      [style.transform]="model.getScale()"
      [style.transform-origin]="'left top'"
    >
      <sti-component-holder [element]="model.draggingElement"></sti-component-holder>
    </div>
  `, isInline: true, dependencies: [{ kind: "component", type: StiComponentHolderComponent, selector: "sti-component-holder", inputs: ["element", "isClone"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDraggableElementContainerComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-draggable-element-container",
                    template: `
    <div
      #element
      style="position: absolute; z-index: 999; background-color:rgb(226,226,226); opacity:0.7; userSelect:none;"
      [style.visibility]="model.draggingElement ? 'visible' : 'hidden'"
      [style.left.px]="draggableService.left"
      [style.top.px]="draggableService.top"
      [style.width.px]="model.draggingElement?.width"
      [style.height.px]="model.draggingElement?.height"
      [style.transform]="model.getScale()"
      [style.transform-origin]="'left top'"
    >
      <sti-component-holder [element]="model.draggingElement"></sti-component-holder>
    </div>
  `,
                }]
        }], ctorParameters: () => [{ type: StiDraggableService }, { type: StiModelService }], propDecorators: { container: [{
                type: ViewChild,
                args: ["element"]
            }] } });

class StiToolboxComponent {
    get isMaximize() {
        return this.toolbarResizerService.isMaximizeMode;
    }
    constructor(resolver, model, toolboxService, toolbarResizerService, loc) {
        this.resolver = resolver;
        this.model = model;
        this.toolboxService = toolboxService;
        this.toolbarResizerService = toolbarResizerService;
        this.loc = loc;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiToolboxComponent, deps: [{ token: i0.ComponentFactoryResolver }, { token: StiModelService }, { token: StiToolboxService }, { token: StiToolbarResizerService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiToolboxComponent, selector: "sti-toolbox", ngImport: i0, template: `
    <div class="elements" id="Elements" hidden="false">
      <p *ngIf="this.isMaximize">Elements</p>
      <sti-toolbox-element *ngFor="let element of toolboxService.elements" [element]="element"></sti-toolbox-element>
      <!-- <sti-draggable-element-container></sti-draggable-element-container> -->
      <div
        *ngIf="toolboxService.isToolboxOutlineElementsDividerEnabled() && model.getBooleanSetting('showSetupToolbox')"
        class="divider"
        [style.height.px]="4"
        [style.width.px]="28"
      >
        <div [style.height.px]="1" [style.width.px]="22" [style.border-bottom]="'1px solid rgb(170,170,170)'"></div>
      </div>
      <div
        class="element"
        *ngIf="model.getBooleanSetting('showSetupToolbox')"
        (click)="model.showToolboxSetup = true"
        [stiTooltip]="loc.get2('FormDesigner', 'SetupToolbox')"
        tooltipPosition="right"
        showDelay="500"
      >
        <img [src]="model.getImage('images.Other.SmallSetupToolbox.png')" style="pointer-events: none" />
      </div>
    </div>
    <!-- <sti-toolbar-resizer [style.visibility]="this.model.previewMode ? 'hidden' : ''"></sti-toolbar-resizer> -->
  `, isInline: true, styles: [".elements{width:100%;display:flex;flex-direction:column;font-size:18px;justify-content:flex-start;-webkit-touch-callout:none;-webkit-user-select:none}.divider{display:flex;align-items:center;justify-content:center}p{margin-top:1px;margin-bottom:3px;margin-left:5px;font-weight:500;color:var(--text-color)}.element{width:28px;height:28px;background-color:inherit;color:var(--text-color);border-radius:3px;display:flex;flex-wrap:nowrap;font-size:13px;font-weight:500;-webkit-touch-callout:none;-webkit-user-select:none;align-items:center;justify-content:center}.element:hover{background-color:var(--hover-color)}.element.active{background-color:var(--active-color)}img{vertical-align:sub;width:16px;height:16px}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiToolboxElementComponent, selector: "sti-toolbox-element", inputs: ["element", "forRibbon", "forGroup"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiToolboxComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-toolbox", template: `
    <div class="elements" id="Elements" hidden="false">
      <p *ngIf="this.isMaximize">Elements</p>
      <sti-toolbox-element *ngFor="let element of toolboxService.elements" [element]="element"></sti-toolbox-element>
      <!-- <sti-draggable-element-container></sti-draggable-element-container> -->
      <div
        *ngIf="toolboxService.isToolboxOutlineElementsDividerEnabled() && model.getBooleanSetting('showSetupToolbox')"
        class="divider"
        [style.height.px]="4"
        [style.width.px]="28"
      >
        <div [style.height.px]="1" [style.width.px]="22" [style.border-bottom]="'1px solid rgb(170,170,170)'"></div>
      </div>
      <div
        class="element"
        *ngIf="model.getBooleanSetting('showSetupToolbox')"
        (click)="model.showToolboxSetup = true"
        [stiTooltip]="loc.get2('FormDesigner', 'SetupToolbox')"
        tooltipPosition="right"
        showDelay="500"
      >
        <img [src]="model.getImage('images.Other.SmallSetupToolbox.png')" style="pointer-events: none" />
      </div>
    </div>
    <!-- <sti-toolbar-resizer [style.visibility]="this.model.previewMode ? 'hidden' : ''"></sti-toolbar-resizer> -->
  `, styles: [".elements{width:100%;display:flex;flex-direction:column;font-size:18px;justify-content:flex-start;-webkit-touch-callout:none;-webkit-user-select:none}.divider{display:flex;align-items:center;justify-content:center}p{margin-top:1px;margin-bottom:3px;margin-left:5px;font-weight:500;color:var(--text-color)}.element{width:28px;height:28px;background-color:inherit;color:var(--text-color);border-radius:3px;display:flex;flex-wrap:nowrap;font-size:13px;font-weight:500;-webkit-touch-callout:none;-webkit-user-select:none;align-items:center;justify-content:center}.element:hover{background-color:var(--hover-color)}.element.active{background-color:var(--active-color)}img{vertical-align:sub;width:16px;height:16px}\n"] }]
        }], ctorParameters: () => [{ type: i0.ComponentFactoryResolver }, { type: StiModelService }, { type: StiToolboxService }, { type: StiToolbarResizerService }, { type: StiLocalizationService }] });

class StiFooterComponent {
    get themes() {
        return StiModelService.THEMES;
    }
    get cloud() {
        return this.loc.getP("StimulsoftCloud");
    }
    get size() {
        return this.model.zoom <= 1
            ? (this.model.zoom * 100).toFixed(0)
            : (100 + ((this.model.zoom - 1) / 3) * 100).toFixed(0);
    }
    get calculatedSize() {
        return (this.model.zoom * 100).toFixed(0);
    }
    get isMobileViewer() {
        return this.model.isMobile() && this.model.viewerMode;
    }
    get step() {
        return this.model.zoom <= 1 ? 10 : 1;
    }
    setSize(value) {
        if (value <= 100) {
            (this.model.zoom = value / 100).toFixed(1);
        }
        else {
            setTimeout(() => {
                this.model.zoom = Number((1 + ((value - 100) / 100) * 3).toFixed(1));
            });
        }
    }
    constructor(model, helper, theme, loc, formCheckerService) {
        this.model = model;
        this.helper = helper;
        this.theme = theme;
        this.loc = loc;
        this.formCheckerService = formCheckerService;
        this.isIncrement = false;
        this.isDecrement = false;
        this.model.isMobileViewer.subscribe(() => {
            setTimeout(() => {
                this.zoomByWidth();
            });
        });
        this.model.formEvents.subscribe((e) => {
            if (e.name == "SetZoomByPageWidth") {
                this.zoomByWidth();
            }
            else if (e.name == "SetZoomByOnePage") {
                this.zoomByOnePage();
            }
            else if (e.name == "SetDefaultZoom") {
                this.setDefaultZoom();
            }
        });
    }
    zoomByWidth() {
        let workspace = document.getElementsByTagName("sti-workspace")[0];
        let width = workspace["offsetWidth"];
        let pageElem = document.querySelectorAll(".page-container")[0];
        let pagetWithMaxWidth = this.model.form.pages.reduce((acc, curr) => (acc.width > curr.width ? acc : curr));
        this.model.zoom = width / (pagetWithMaxWidth.width + 30);
        setTimeout(() => {
            let rect = this.model.getPositionRelativeToForm(pageElem);
            if (this.isMobileViewer) {
                if (workspace.scrollLeft != workspace.scrollWidth - rect.width - 6) {
                    workspace.scrollLeft = workspace.scrollWidth - rect.width - 6;
                }
            }
            else {
                if (workspace.scrollLeft != (workspace.scrollWidth - rect.width) / 2) {
                    workspace.scrollLeft = (workspace.scrollWidth - rect.width) / 2;
                }
            }
        }, 0);
    }
    setDefaultZoom() {
        this.model.zoom = 1;
    }
    zoomByOnePage() {
        let workspace = document.getElementsByTagName("sti-workspace")[0];
        let height = workspace["offsetHeight"];
        let elementWithMaxHeight = this.model.form.pages.reduce((acc, curr) => (acc.height > curr.height ? acc : curr));
        let width = workspace["offsetWidth"];
        let elementWithMaxWidth = this.model.form.pages.reduce((acc, curr) => (acc.width > curr.width ? acc : curr));
        let currentCoef = height / (elementWithMaxHeight.height + 25) >
            width / (elementWithMaxWidth.width + (this.model.previewMode ? 0 : 60))
            ? width / (elementWithMaxWidth.width + (this.model.previewMode ? 0 : 60))
            : height / (elementWithMaxHeight.height + 25);
        this.model.zoom = currentCoef;
    }
    changeTheme() {
        this.theme.currentTheme = this.currentTheme;
    }
    clearTimers() {
        this.isIncrement = false;
        this.isDecrement = false;
        clearTimeout(this.timeout);
        clearInterval(this.interval);
    }
    iterate() {
        if (this.isIncrement) {
            this.model.zoom += 0.1;
        }
        else if (this.isDecrement) {
            this.model.zoom -= 0.1;
        }
    }
    setIncrementInterval() {
        this.isIncrement = true;
        this.iterate();
        let this_ = this;
        this.timeout = setTimeout(function () {
            this_.interval = setInterval(function () {
                this_.iterate();
            }, 50);
        }, 300);
    }
    setDecrementInterval() {
        this.isDecrement = true;
        this.iterate();
        let this_ = this;
        this.timeout = setTimeout(function () {
            this_.interval = setInterval(function () {
                this_.iterate();
            }, 50);
        }, 300);
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFooterComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiThemeService }, { token: StiLocalizationService }, { token: StiFormCheckerService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiFooterComponent, selector: "sti-footer", ngImport: i0, template: "<div class=\"sti-footer\">\r\n  <div class=\"cloud-content\">\r\n    <div\r\n      class=\"warnings-container\"\r\n      *ngIf=\"formCheckerService.hasIssue\"\r\n      (click)=\"formCheckerService.displayFormsChecker()\"\r\n    >\r\n      <div class=\"vertical-line\"></div>\r\n      <div class=\"warning-panel\">\r\n        <img [src]=\"model.getImage('images.Form_Checker.Warning.png')\" />\r\n        <span class=\"warnings-count\">{{ formCheckerService.issuesCount }}</span>\r\n      </div>\r\n    </div>\r\n    <a\r\n      *ngIf=\"model.isCloudMode && model.viewerMode && model.basePlanIsTrial\"\r\n      href=\"https://cloud.stimulsoft.com/\"\r\n      target=\"_blank\"\r\n      >{{ cloud }}</a\r\n    >\r\n  </div>\r\n  <div class=\"zoom-buttons\" *ngIf=\"model.getBooleanSetting('showZoomButtons')\">\r\n    <div *ngIf=\"!isMobileViewer\" class=\"vertical-line\"></div>\r\n    <div\r\n      class=\"button\"\r\n      [stiTooltip]=\"loc.get2('Zoom', 'PageWidth')\"\r\n      tooltipPosition=\"top\"\r\n      showDelay=\"500\"\r\n      (click)=\"zoomByWidth()\"\r\n    >\r\n      <img [src]=\"model.getImage('images.Other.ZoomWidth.png')\" alt=\"\" />\r\n    </div>\r\n    <div\r\n      class=\"button\"\r\n      [stiTooltip]=\"loc.get2('Zoom', 'OnePage')\"\r\n      tooltipPosition=\"top\"\r\n      showDelay=\"500\"\r\n      (click)=\"zoomByOnePage()\"\r\n    >\r\n      <img [src]=\"model.getImage('images.Other.ZoomSize.png')\" alt=\"\" />\r\n    </div>\r\n    <div\r\n      class=\"button\"\r\n      [stiTooltip]=\"loc.get2('Zoom', 'ZoomTo100')\"\r\n      tooltipPosition=\"top\"\r\n      showDelay=\"500\"\r\n      (click)=\"setDefaultZoom()\"\r\n    >\r\n      <img [src]=\"model.getImage('images.Other.Zoom100.png')\" alt=\"\" />\r\n    </div>\r\n    <div *ngIf=\"!isMobileViewer\" class=\"vertical-line\"></div>\r\n    <label *ngIf=\"!isMobileViewer\"> {{ calculatedSize }}%</label>\r\n    <div\r\n      *ngIf=\"!isMobileViewer\"\r\n      class=\"button\"\r\n      [stiTooltip]=\"loc.get2('FormViewer', 'Zoom') + ' -'\"\r\n      tooltipPosition=\"top\"\r\n      showDelay=\"500\"\r\n      (mousedown)=\"setDecrementInterval()\"\r\n      (mouseup)=\"clearTimers()\"\r\n      (mouseleave)=\"clearTimers()\"\r\n    >\r\n      <img [src]=\"model.getImage('images.Other.ZoomMinus.png')\" alt=\"\" />\r\n    </div>\r\n    <input\r\n      *ngIf=\"!isMobileViewer\"\r\n      type=\"range\"\r\n      min=\"10\"\r\n      max=\"200\"\r\n      [step]=\"step\"\r\n      [value]=\"size\"\r\n      (input)=\"setSize($event.target.value)\"\r\n    />\r\n    <div *ngIf=\"!isMobileViewer\" class=\"slider-vertical-line\"></div>\r\n    <div\r\n      *ngIf=\"!isMobileViewer\"\r\n      class=\"button\"\r\n      [stiTooltip]=\"loc.get2('FormViewer', 'Zoom') + ' +'\"\r\n      tooltipPosition=\"left\"\r\n      showDelay=\"500\"\r\n      (mousedown)=\"setIncrementInterval()\"\r\n      (mouseup)=\"clearTimers()\"\r\n      (mouseleave)=\"clearTimers()\"\r\n    >\r\n      <img [src]=\"model.getImage('images.Other.ZoomPlus.png')\" alt=\"\" />\r\n    </div>\r\n  </div>\r\n\r\n  <!-- <p-dropdown\r\n        [options]=\"helper.themes\"\r\n        [(ngModel)]=\"currentTheme\"\r\n        optionLabel=\"name\"\r\n        optionValue=\"name\"\r\n        [style]=\"{ width: '100px',marginTop:'3px',marginRight:'5px' }\"\r\n        (onChange)=\"changeTheme()\"\r\n      ></p-dropdown> -->\r\n</div>\r\n<style>\r\n  .zoom-buttons {\r\n    width: fit-content;\r\n    display: flex;\r\n    position: relative;\r\n  }\r\n  .warnings-count {\r\n    margin-left: 5px;\r\n    font-size: 12px;\r\n  }\r\n  .warning-panel {\r\n    display: flex;\r\n    align-items: center;\r\n    padding: 0px 10px;\r\n    border-radius: 3px;\r\n    height: 100%;\r\n  }\r\n  .warnings-container {\r\n    display: flex;\r\n    position: absolute;\r\n    align-items: center;\r\n    top: 0;\r\n    right: 0;\r\n    height: 100%;\r\n  }\r\n  .warning-panel:hover {\r\n    background-color: rgb(18, 64, 120);\r\n  }\r\n  img {\r\n    height: 16px;\r\n    width: 16px;\r\n  }\r\n  .cloud-content {\r\n    flex: 1;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    position: relative;\r\n  }\r\n  .vertical-line {\r\n    height: 32px;\r\n    width: 1px;\r\n    margin-left: 3px;\r\n    margin-right: 3px;\r\n    border-right: 1px solid rgb(149, 171, 205);\r\n  }\r\n  .slider-vertical-line {\r\n    position: absolute;\r\n    height: 11px;\r\n    width: 1px;\r\n    margin-left: 3px;\r\n    margin-right: 3px;\r\n    top: 11px;\r\n    right: 84px;\r\n    background-color: white;\r\n    pointer-events: none;\r\n  }\r\n  a {\r\n    font-size: 16px;\r\n    font-family: Arial;\r\n    cursor: pointer;\r\n    color: white;\r\n    text-decoration: none;\r\n  }\r\n  span {\r\n    font-size: 18px;\r\n    font-weight: bold;\r\n    color: rgb(255, 255, 255);\r\n  }\r\n  .button {\r\n    height: 31px;\r\n    width: 32px;\r\n    background-color: rgb(25, 71, 138);\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n  }\r\n  .button:hover {\r\n    background-color: rgb(18, 64, 120);\r\n  }\r\n  .button:active {\r\n    background-color: rgb(0, 32, 80);\r\n  }\r\n  .sti-footer {\r\n    width: 100%;\r\n    height: 32px;\r\n    display: flex;\r\n    justify-content: flex-end;\r\n    border-top: 1px solid var(--formBorder-color);\r\n    -webkit-touch-callout: none;\r\n    -webkit-user-select: none;\r\n    background-color: rgb(25, 71, 138);\r\n    font-family: \"Segoe UI\";\r\n    position: relative;\r\n  }\r\n\r\n  .sti-footer input[type=\"range\"] {\r\n    margin-top: 3px;\r\n    margin-right: 3px;\r\n    margin-left: 3px;\r\n    width: 100px;\r\n    -webkit-appearance: none;\r\n    background-color: rgb(25, 71, 138);\r\n  }\r\n\r\n  .sti-footer input[type=\"range\"]:focus {\r\n    outline: none;\r\n  }\r\n\r\n  input[type=\"range\"]::-webkit-slider-runnable-track {\r\n    width: 100%;\r\n    height: 2px;\r\n    cursor: default;\r\n    box-shadow: 0px 0px 0px rgb(255, 255, 255);\r\n    background: linear-gradient(to bottom, rgb(38, 87, 170) 0%, rgb(98, 135, 199) 50%);\r\n    border-radius: 0px;\r\n    border: 0px solid rgb(255, 255, 255);\r\n  }\r\n  input[type=\"range\"]::-moz-range-track {\r\n    width: 100%;\r\n    height: 2px;\r\n    cursor: default;\r\n    box-shadow: 0px 0px 0px rgb(255, 255, 255);\r\n    background: linear-gradient(to bottom, rgb(38, 87, 170) 0%, rgb(98, 135, 199) 50%);\r\n    border-radius: 0px;\r\n    border: 0px solid rgb(255, 255, 255);\r\n  }\r\n\r\n  input[type=\"range\"]::-webkit-slider-thumb {\r\n    height: 15px;\r\n    width: 15px;\r\n    background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAKCAYAAAB4zEQNAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABESURBVHgBxY/dCQAgCIStCRyhUdukNmmERrKTfsAHe/WD4/BOBJMAcsj0IaqsTrdzfNPF0t4KBobmKdTZ3EBQoKF+swXwnjPbHIqL4gAAAABJRU5ErkJggg==\");\r\n    background-repeat: no-repeat;\r\n    background-position: center;\r\n    cursor: default;\r\n    -webkit-appearance: none;\r\n    margin-top: -6px;\r\n    z-index: 11;\r\n  }\r\n  input[type=\"range\"]::-moz-range-thumb {\r\n    height: 15px;\r\n    width: 15px;\r\n    background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAKCAYAAAB4zEQNAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABESURBVHgBxY/dCQAgCIStCRyhUdukNmmERrKTfsAHe/WD4/BOBJMAcsj0IaqsTrdzfNPF0t4KBobmKdTZ3EBQoKF+swXwnjPbHIqL4gAAAABJRU5ErkJggg==\");\r\n    background-repeat: no-repeat;\r\n    background-position: center;\r\n    cursor: default;\r\n    -webkit-appearance: none;\r\n    margin-top: -6px;\r\n    border: 0;\r\n    background-color: transparent;\r\n  }\r\n\r\n  input[type=\"range\"]:focus::-webkit-slider-runnable-track {\r\n  }\r\n\r\n  input[type=\"range\"]:-webkit-slider-thumb:focus {\r\n  }\r\n\r\n  .sti-footer label {\r\n    margin-top: 7px;\r\n    margin-left: 5px;\r\n    width: 35px;\r\n    vertical-align: sub;\r\n    font-size: 12px;\r\n    font-weight: bold;\r\n    color: rgb(255, 255, 255);\r\n  }\r\n</style>\r\n", styles: ["\n  .zoom-buttons {\n    width: fit-content;\n    display: flex;\n    position: relative;\n  }\n  .warnings-count {\n    margin-left: 5px;\n    font-size: 12px;\n  }\n  .warning-panel {\n    display: flex;\n    align-items: center;\n    padding: 0px 10px;\n    border-radius: 3px;\n    height: 100%;\n  }\n  .warnings-container {\n    display: flex;\n    position: absolute;\n    align-items: center;\n    top: 0;\n    right: 0;\n    height: 100%;\n  }\n  .warning-panel:hover {\n    background-color: rgb(18, 64, 120);\n  }\n  img {\n    height: 16px;\n    width: 16px;\n  }\n  .cloud-content {\n    flex: 1;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n  }\n  .vertical-line {\n    height: 32px;\n    width: 1px;\n    margin-left: 3px;\n    margin-right: 3px;\n    border-right: 1px solid rgb(149, 171, 205);\n  }\n  .slider-vertical-line {\n    position: absolute;\n    height: 11px;\n    width: 1px;\n    margin-left: 3px;\n    margin-right: 3px;\n    top: 11px;\n    right: 84px;\n    background-color: white;\n    pointer-events: none;\n  }\n  a {\n    font-size: 16px;\n    font-family: Arial;\n    cursor: pointer;\n    color: white;\n    text-decoration: none;\n  }\n  span {\n    font-size: 18px;\n    font-weight: bold;\n    color: rgb(255, 255, 255);\n  }\n  .button {\n    height: 31px;\n    width: 32px;\n    background-color: rgb(25, 71, 138);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  .button:hover {\n    background-color: rgb(18, 64, 120);\n  }\n  .button:active {\n    background-color: rgb(0, 32, 80);\n  }\n  .sti-footer {\n    width: 100%;\n    height: 32px;\n    display: flex;\n    justify-content: flex-end;\n    border-top: 1px solid var(--formBorder-color);\n    -webkit-touch-callout: none;\n    -webkit-user-select: none;\n    background-color: rgb(25, 71, 138);\n    font-family: \"Segoe UI\";\n    position: relative;\n  }\n\n  .sti-footer input[type=\"range\"] {\n    margin-top: 3px;\n    margin-right: 3px;\n    margin-left: 3px;\n    width: 100px;\n    -webkit-appearance: none;\n    background-color: rgb(25, 71, 138);\n  }\n\n  .sti-footer input[type=\"range\"]:focus {\n    outline: none;\n  }\n\n  input[type=\"range\"]::-webkit-slider-runnable-track {\n    width: 100%;\n    height: 2px;\n    cursor: default;\n    box-shadow: 0px 0px 0px rgb(255, 255, 255);\n    background: linear-gradient(to bottom, rgb(38, 87, 170) 0%, rgb(98, 135, 199) 50%);\n    border-radius: 0px;\n    border: 0px solid rgb(255, 255, 255);\n  }\n  input[type=\"range\"]::-moz-range-track {\n    width: 100%;\n    height: 2px;\n    cursor: default;\n    box-shadow: 0px 0px 0px rgb(255, 255, 255);\n    background: linear-gradient(to bottom, rgb(38, 87, 170) 0%, rgb(98, 135, 199) 50%);\n    border-radius: 0px;\n    border: 0px solid rgb(255, 255, 255);\n  }\n\n  input[type=\"range\"]::-webkit-slider-thumb {\n    height: 15px;\n    width: 15px;\n    background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAKCAYAAAB4zEQNAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABESURBVHgBxY/dCQAgCIStCRyhUdukNmmERrKTfsAHe/WD4/BOBJMAcsj0IaqsTrdzfNPF0t4KBobmKdTZ3EBQoKF+swXwnjPbHIqL4gAAAABJRU5ErkJggg==\");\n    background-repeat: no-repeat;\n    background-position: center;\n    cursor: default;\n    -webkit-appearance: none;\n    margin-top: -6px;\n    z-index: 11;\n  }\n  input[type=\"range\"]::-moz-range-thumb {\n    height: 15px;\n    width: 15px;\n    background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAKCAYAAAB4zEQNAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABESURBVHgBxY/dCQAgCIStCRyhUdukNmmERrKTfsAHe/WD4/BOBJMAcsj0IaqsTrdzfNPF0t4KBobmKdTZ3EBQoKF+swXwnjPbHIqL4gAAAABJRU5ErkJggg==\");\n    background-repeat: no-repeat;\n    background-position: center;\n    cursor: default;\n    -webkit-appearance: none;\n    margin-top: -6px;\n    border: 0;\n    background-color: transparent;\n  }\n\n  input[type=\"range\"]:focus::-webkit-slider-runnable-track {\n  }\n\n  input[type=\"range\"]:-webkit-slider-thumb:focus {\n  }\n\n  .sti-footer label {\n    margin-top: 7px;\n    margin-left: 5px;\n    width: 35px;\n    vertical-align: sub;\n    font-size: 12px;\n    font-weight: bold;\n    color: rgb(255, 255, 255);\n  }\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFooterComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-footer", template: "<div class=\"sti-footer\">\r\n  <div class=\"cloud-content\">\r\n    <div\r\n      class=\"warnings-container\"\r\n      *ngIf=\"formCheckerService.hasIssue\"\r\n      (click)=\"formCheckerService.displayFormsChecker()\"\r\n    >\r\n      <div class=\"vertical-line\"></div>\r\n      <div class=\"warning-panel\">\r\n        <img [src]=\"model.getImage('images.Form_Checker.Warning.png')\" />\r\n        <span class=\"warnings-count\">{{ formCheckerService.issuesCount }}</span>\r\n      </div>\r\n    </div>\r\n    <a\r\n      *ngIf=\"model.isCloudMode && model.viewerMode && model.basePlanIsTrial\"\r\n      href=\"https://cloud.stimulsoft.com/\"\r\n      target=\"_blank\"\r\n      >{{ cloud }}</a\r\n    >\r\n  </div>\r\n  <div class=\"zoom-buttons\" *ngIf=\"model.getBooleanSetting('showZoomButtons')\">\r\n    <div *ngIf=\"!isMobileViewer\" class=\"vertical-line\"></div>\r\n    <div\r\n      class=\"button\"\r\n      [stiTooltip]=\"loc.get2('Zoom', 'PageWidth')\"\r\n      tooltipPosition=\"top\"\r\n      showDelay=\"500\"\r\n      (click)=\"zoomByWidth()\"\r\n    >\r\n      <img [src]=\"model.getImage('images.Other.ZoomWidth.png')\" alt=\"\" />\r\n    </div>\r\n    <div\r\n      class=\"button\"\r\n      [stiTooltip]=\"loc.get2('Zoom', 'OnePage')\"\r\n      tooltipPosition=\"top\"\r\n      showDelay=\"500\"\r\n      (click)=\"zoomByOnePage()\"\r\n    >\r\n      <img [src]=\"model.getImage('images.Other.ZoomSize.png')\" alt=\"\" />\r\n    </div>\r\n    <div\r\n      class=\"button\"\r\n      [stiTooltip]=\"loc.get2('Zoom', 'ZoomTo100')\"\r\n      tooltipPosition=\"top\"\r\n      showDelay=\"500\"\r\n      (click)=\"setDefaultZoom()\"\r\n    >\r\n      <img [src]=\"model.getImage('images.Other.Zoom100.png')\" alt=\"\" />\r\n    </div>\r\n    <div *ngIf=\"!isMobileViewer\" class=\"vertical-line\"></div>\r\n    <label *ngIf=\"!isMobileViewer\"> {{ calculatedSize }}%</label>\r\n    <div\r\n      *ngIf=\"!isMobileViewer\"\r\n      class=\"button\"\r\n      [stiTooltip]=\"loc.get2('FormViewer', 'Zoom') + ' -'\"\r\n      tooltipPosition=\"top\"\r\n      showDelay=\"500\"\r\n      (mousedown)=\"setDecrementInterval()\"\r\n      (mouseup)=\"clearTimers()\"\r\n      (mouseleave)=\"clearTimers()\"\r\n    >\r\n      <img [src]=\"model.getImage('images.Other.ZoomMinus.png')\" alt=\"\" />\r\n    </div>\r\n    <input\r\n      *ngIf=\"!isMobileViewer\"\r\n      type=\"range\"\r\n      min=\"10\"\r\n      max=\"200\"\r\n      [step]=\"step\"\r\n      [value]=\"size\"\r\n      (input)=\"setSize($event.target.value)\"\r\n    />\r\n    <div *ngIf=\"!isMobileViewer\" class=\"slider-vertical-line\"></div>\r\n    <div\r\n      *ngIf=\"!isMobileViewer\"\r\n      class=\"button\"\r\n      [stiTooltip]=\"loc.get2('FormViewer', 'Zoom') + ' +'\"\r\n      tooltipPosition=\"left\"\r\n      showDelay=\"500\"\r\n      (mousedown)=\"setIncrementInterval()\"\r\n      (mouseup)=\"clearTimers()\"\r\n      (mouseleave)=\"clearTimers()\"\r\n    >\r\n      <img [src]=\"model.getImage('images.Other.ZoomPlus.png')\" alt=\"\" />\r\n    </div>\r\n  </div>\r\n\r\n  <!-- <p-dropdown\r\n        [options]=\"helper.themes\"\r\n        [(ngModel)]=\"currentTheme\"\r\n        optionLabel=\"name\"\r\n        optionValue=\"name\"\r\n        [style]=\"{ width: '100px',marginTop:'3px',marginRight:'5px' }\"\r\n        (onChange)=\"changeTheme()\"\r\n      ></p-dropdown> -->\r\n</div>\r\n<style>\r\n  .zoom-buttons {\r\n    width: fit-content;\r\n    display: flex;\r\n    position: relative;\r\n  }\r\n  .warnings-count {\r\n    margin-left: 5px;\r\n    font-size: 12px;\r\n  }\r\n  .warning-panel {\r\n    display: flex;\r\n    align-items: center;\r\n    padding: 0px 10px;\r\n    border-radius: 3px;\r\n    height: 100%;\r\n  }\r\n  .warnings-container {\r\n    display: flex;\r\n    position: absolute;\r\n    align-items: center;\r\n    top: 0;\r\n    right: 0;\r\n    height: 100%;\r\n  }\r\n  .warning-panel:hover {\r\n    background-color: rgb(18, 64, 120);\r\n  }\r\n  img {\r\n    height: 16px;\r\n    width: 16px;\r\n  }\r\n  .cloud-content {\r\n    flex: 1;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    position: relative;\r\n  }\r\n  .vertical-line {\r\n    height: 32px;\r\n    width: 1px;\r\n    margin-left: 3px;\r\n    margin-right: 3px;\r\n    border-right: 1px solid rgb(149, 171, 205);\r\n  }\r\n  .slider-vertical-line {\r\n    position: absolute;\r\n    height: 11px;\r\n    width: 1px;\r\n    margin-left: 3px;\r\n    margin-right: 3px;\r\n    top: 11px;\r\n    right: 84px;\r\n    background-color: white;\r\n    pointer-events: none;\r\n  }\r\n  a {\r\n    font-size: 16px;\r\n    font-family: Arial;\r\n    cursor: pointer;\r\n    color: white;\r\n    text-decoration: none;\r\n  }\r\n  span {\r\n    font-size: 18px;\r\n    font-weight: bold;\r\n    color: rgb(255, 255, 255);\r\n  }\r\n  .button {\r\n    height: 31px;\r\n    width: 32px;\r\n    background-color: rgb(25, 71, 138);\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n  }\r\n  .button:hover {\r\n    background-color: rgb(18, 64, 120);\r\n  }\r\n  .button:active {\r\n    background-color: rgb(0, 32, 80);\r\n  }\r\n  .sti-footer {\r\n    width: 100%;\r\n    height: 32px;\r\n    display: flex;\r\n    justify-content: flex-end;\r\n    border-top: 1px solid var(--formBorder-color);\r\n    -webkit-touch-callout: none;\r\n    -webkit-user-select: none;\r\n    background-color: rgb(25, 71, 138);\r\n    font-family: \"Segoe UI\";\r\n    position: relative;\r\n  }\r\n\r\n  .sti-footer input[type=\"range\"] {\r\n    margin-top: 3px;\r\n    margin-right: 3px;\r\n    margin-left: 3px;\r\n    width: 100px;\r\n    -webkit-appearance: none;\r\n    background-color: rgb(25, 71, 138);\r\n  }\r\n\r\n  .sti-footer input[type=\"range\"]:focus {\r\n    outline: none;\r\n  }\r\n\r\n  input[type=\"range\"]::-webkit-slider-runnable-track {\r\n    width: 100%;\r\n    height: 2px;\r\n    cursor: default;\r\n    box-shadow: 0px 0px 0px rgb(255, 255, 255);\r\n    background: linear-gradient(to bottom, rgb(38, 87, 170) 0%, rgb(98, 135, 199) 50%);\r\n    border-radius: 0px;\r\n    border: 0px solid rgb(255, 255, 255);\r\n  }\r\n  input[type=\"range\"]::-moz-range-track {\r\n    width: 100%;\r\n    height: 2px;\r\n    cursor: default;\r\n    box-shadow: 0px 0px 0px rgb(255, 255, 255);\r\n    background: linear-gradient(to bottom, rgb(38, 87, 170) 0%, rgb(98, 135, 199) 50%);\r\n    border-radius: 0px;\r\n    border: 0px solid rgb(255, 255, 255);\r\n  }\r\n\r\n  input[type=\"range\"]::-webkit-slider-thumb {\r\n    height: 15px;\r\n    width: 15px;\r\n    background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAKCAYAAAB4zEQNAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABESURBVHgBxY/dCQAgCIStCRyhUdukNmmERrKTfsAHe/WD4/BOBJMAcsj0IaqsTrdzfNPF0t4KBobmKdTZ3EBQoKF+swXwnjPbHIqL4gAAAABJRU5ErkJggg==\");\r\n    background-repeat: no-repeat;\r\n    background-position: center;\r\n    cursor: default;\r\n    -webkit-appearance: none;\r\n    margin-top: -6px;\r\n    z-index: 11;\r\n  }\r\n  input[type=\"range\"]::-moz-range-thumb {\r\n    height: 15px;\r\n    width: 15px;\r\n    background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAKCAYAAAB4zEQNAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABESURBVHgBxY/dCQAgCIStCRyhUdukNmmERrKTfsAHe/WD4/BOBJMAcsj0IaqsTrdzfNPF0t4KBobmKdTZ3EBQoKF+swXwnjPbHIqL4gAAAABJRU5ErkJggg==\");\r\n    background-repeat: no-repeat;\r\n    background-position: center;\r\n    cursor: default;\r\n    -webkit-appearance: none;\r\n    margin-top: -6px;\r\n    border: 0;\r\n    background-color: transparent;\r\n  }\r\n\r\n  input[type=\"range\"]:focus::-webkit-slider-runnable-track {\r\n  }\r\n\r\n  input[type=\"range\"]:-webkit-slider-thumb:focus {\r\n  }\r\n\r\n  .sti-footer label {\r\n    margin-top: 7px;\r\n    margin-left: 5px;\r\n    width: 35px;\r\n    vertical-align: sub;\r\n    font-size: 12px;\r\n    font-weight: bold;\r\n    color: rgb(255, 255, 255);\r\n  }\r\n</style>\r\n" }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiThemeService }, { type: StiLocalizationService }, { type: StiFormCheckerService }] });

class StiCloneElementContainerComponent {
    constructor(model, zone, render) {
        this.model = model;
        this.zone = zone;
        this.render = render;
        this.isClone = true;
        model.formEvents.subscribe((e) => {
            if (e.name == "ElementToUpdateChanged" || e.name == "SelectedComponentChanged") {
                this.updateObservable();
            }
        });
    }
    ngOnInit() { }
    ngAfterViewInit() {
        this.observer = new ResizeObserver((entries) => {
            for (let entry of entries) {
                const cr = entry.contentRect;
                let element;
                if (this.model.draggingElement && this.model.draggingElement != this.lastUpdatedElement) {
                    element = this.model.draggingElement;
                }
                else if (this.model.elementToUpdate != null) {
                    element = this.model.elementToUpdate;
                }
                else {
                    this.model.form?.pages.forEach((page) => {
                        page.allElements.forEach((component) => {
                            if (component === this.element) {
                                element = component;
                            }
                        });
                    });
                }
                this.zone.run(() => {
                    this.updateElement(element, cr);
                });
            }
        });
        this.observer?.observe(this.clone?.nativeElement);
    }
    updateElement(component, cr) {
        if (!component || component.type == "TextElement") {
            return;
        }
        if (this.model.draggingElement && this.model.draggingElement == this.lastUpdatedElement) {
            return;
        }
        if (this.lastUpdatedElement != component) {
            this.lastUpdatedElement = component;
        }
        if (this.model.elementToUpdate == null) {
            let bottomElements = [];
            let freeAreaHeight;
            let currentPage = this.model.getElementPage(this.model.selectedComponent?.element);
            let currentPanel = this.model.getElementPanel(this.model.selectedComponent?.element);
            currentPage?.elements?.forEach((elem) => {
                if (elem.y >= this.model.selectedComponent.element.geometry.bottom) {
                    bottomElements.push(elem);
                }
            });
            if (bottomElements.length > 0) {
                let maxBottomPoint = Math.max(...bottomElements.map((elem) => elem.geometry.bottom));
                freeAreaHeight = (currentPage?.contentAreaHeight || currentPanel?.height) - maxBottomPoint;
            }
            else {
                freeAreaHeight =
                    (currentPage?.contentAreaHeight || currentPanel?.height) -
                        this.model.selectedComponent?.element.geometry.bottom;
            }
        }
        let parentContainer = component.getParent(this.model.form) ?? this.model.form.pages[0];
        let sizeChanged = false;
        let minHeight = Number(((Math.round(cr.height) / this.currentVerticalStep) % 1).toFixed(2)) <= 0.5 &&
            Math.round(cr.height) != parentContainer["contentAreaHeight"]
            ? Math.floor(cr.height / this.currentVerticalStep) * this.currentVerticalStep
            : Math.ceil(cr.height / this.currentVerticalStep) * this.currentVerticalStep;
        if (component.geometry.minHeight != minHeight &&
            minHeight <= parentContainer["contentAreaHeight"] &&
            minHeight != 0 &&
            Math.abs(component.geometry.minHeight - minHeight) > 1) {
            component.geometry.minHeight = minHeight;
            sizeChanged = true;
        }
        else if (minHeight >= parentContainer["contentAreaHeight"] - component.geometry.y) {
            component.geometry.minHeight = parentContainer["contentAreaHeight"] - component.geometry.y;
            sizeChanged = true;
        }
        if (parentContainer) {
            let columnWidth = parentContainer.getColumnWidth(this.model.form.settings.gridColumns);
            let minWidth = Math.max(Math.min(Math.ceil(Number(cr.width.toFixed(2)) / columnWidth) * columnWidth, this.maxWidth), columnWidth);
            if (minWidth != component.geometry.minWidth) {
                component.geometry.minWidth = minWidth;
                sizeChanged = true;
            }
            if (sizeChanged && this.model.draggingElement != component) {
                this.render.insertElement(component);
                this.render.checkOutputs(this.model.getElementPage(component));
            }
        }
        else {
            component.geometry.minWidth = Math.max(cr.width, 2);
        }
        this.model.elementToUpdate = null;
    }
    updateObservable() {
        this.observer?.unobserve(this.clone?.nativeElement);
        this.observer?.observe(this.clone?.nativeElement);
    }
    ngOnDestroy() {
        this.observer?.unobserve(this.clone?.nativeElement);
    }
    get element() {
        return this.model.draggingElement
            ? this.model.draggingElement
            : this.model.elementToUpdate ?? this.model.selectedComponent?.element;
    }
    get maxWidth() {
        return this.model?.draggingElement
            ? this.model?.form?.pages[0].contentAreaWidth - this.element?.x
            : this.element?.getParent(this.model.form)?.contentAreaWidth - this.element?.x;
    }
    get currentVerticalStep() {
        return this.model.form?.settings?.gridVerticalStep != 1 ? this.model.form?.settings?.gridVerticalStep : 5;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiCloneElementContainerComponent, deps: [{ token: StiModelService }, { token: i0.NgZone }, { token: StiRectangleGeometryLayout }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiCloneElementContainerComponent, selector: "sti-clone-element-container", viewQueries: [{ propertyName: "clone", first: true, predicate: ["clone"], descendants: true }], ngImport: i0, template: `
    <div
      #clone
      style="position: absolute; top:-9999px; left:-9999px; z-index: -1; opacity:0;white-space:nowrap; userSelect:none;"
      [style.width]="'min-content'"
      [style.height]="'auto'"
      [style.max-width.px]="maxWidth"
    >
      <sti-component-holder [element]="element" [isClone]="this.isClone"></sti-component-holder>
    </div>
  `, isInline: true, dependencies: [{ kind: "component", type: StiComponentHolderComponent, selector: "sti-component-holder", inputs: ["element", "isClone"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiCloneElementContainerComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-clone-element-container",
                    template: `
    <div
      #clone
      style="position: absolute; top:-9999px; left:-9999px; z-index: -1; opacity:0;white-space:nowrap; userSelect:none;"
      [style.width]="'min-content'"
      [style.height]="'auto'"
      [style.max-width.px]="maxWidth"
    >
      <sti-component-holder [element]="element" [isClone]="this.isClone"></sti-component-holder>
    </div>
  `,
                }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: i0.NgZone }, { type: StiRectangleGeometryLayout }], propDecorators: { clone: [{
                type: ViewChild,
                args: ["clone"]
            }] } });

class StiModalAgreeWindowComponent {
    handleKeyboardEvent(e) {
        if (e.code === "Enter") {
            this.delete();
        }
        else if (e.code === "Escape") {
            this.cancel();
        }
    }
    constructor(model, exportService, loc) {
        this.model = model;
        this.exportService = exportService;
        this.loc = loc;
    }
    delete() {
        this.model.form.pages.forEach((page) => {
            if (page === this.model.selectedPage) {
                this.model.form.pages.splice(this.model.form.pages.indexOf(page), 1);
                this.model.selectedPage = null;
            }
        });
        if (this.model.form.pages.length == 0) {
            let page1 = new StiFormPageElement(this.model.form);
            this.model.form.pages.push(page1);
            this.model.lastUsedPage = page1;
        }
        this.model.showModalWindow = false;
    }
    accept() {
        if (this.model.showModalWindow) {
            this.delete();
        }
        else {
            this.exportService.exportToPdf();
            this.exportService.showModalWindow = false;
        }
    }
    cancel() {
        this.model.showModalWindow = false;
        this.exportService.showModalWindow = false;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiModalAgreeWindowComponent, deps: [{ token: StiModelService }, { token: StiExportService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiModalAgreeWindowComponent, selector: "sti-modal-agree-window", host: { listeners: { "document:keydown": "handleKeyboardEvent($event)" } }, ngImport: i0, template: `
    <div class="modal-window" [style.height]="'150px'">
      <div class="nav">
        <span>{{
          model.showModalWindow ? loc.get2("Permissions", "ItemForms") : loc.get2("MainMenu", "menuViewOptions")
        }}</span>
      </div>
      <div class="content">
        <img *ngIf="model.showModalWindow" [src]="model.getImage('images.Other.Question.png')" />
        <p *ngIf="model.showModalWindow">{{ loc.get2("Questions", "qnPageDelete") }}</p>
        <div class="options" *ngIf="exportService.showModalWindow">
          <sti-checkbox [(value)]="exportService.useReadOnly" [label]="loc.getP('ReadOnly')"></sti-checkbox>
          <sti-checkbox [(value)]="exportService.usePdfA" [label]="loc.get2('Export', 'PdfACompliance')"></sti-checkbox>
        </div>
      </div>
      <div class="buttons" [style.padding-right.px]="3" [style.align-self]="'flex-end'">
        <div class="button accept" (click)="accept()">
          <span>
            {{
              model.showModalWindow
                ? loc.get2("Buttons", "Yes").replace("&amp", "").replace(";", "")
                : loc.get2("Gui", "barname_ok")
            }}
          </span>
        </div>
        <div class="button cancel" (click)="cancel()">
          <span>
            {{
              model.showModalWindow
                ? loc.get2("Buttons", "No").replace("&amp", "").replace(";", "")
                : loc.getP("Cancel")
            }}
          </span>
        </div>
      </div>
    </div>
  `, isInline: true, styles: [".options{display:flex;flex-direction:column;justify-content:center;width:100%;padding-left:10px}sti-checkbox{margin-top:5px;margin-bottom:5px}.modal-window{-webkit-touch-callout:none;-webkit-user-select:none;position:absolute;top:calc(50% - 75px);left:calc(50% - 150px);padding:0;font-family:Segoe UI;background-color:var(--back-color);width:300px;height:110px;z-index:9999999;border-radius:5px;display:flex;flex-direction:column;outline:1px solid rgb(81,92,106);-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d}.nav{width:100%;height:30px;background-color:#515c6a;border-top-left-radius:4px;border-top-right-radius:4px;display:flex;align-items:center}.nav span{width:100%;margin-left:10px;color:#fff;font-size:13px;font-family:Arial}.close{height:100%;width:40px;border-top-right-radius:5px;display:flex;align-items:center;justify-content:center}.close:hover{background-color:#c83c31}.close:active{background-color:#c42b1c}.close img{height:16px;width:16px}.content{width:100%;display:flex;align-items:center;flex:1;padding:10px}.content img{margin-left:10px;margin-right:10px;width:32px;height:32px}p{font-size:12px;font-family:Arial;color:var(--text-color)}.buttons{align-self:flex-end;padding-bottom:5px;height:32px;display:flex;padding-right:3px}.button{width:80px;height:24px;border-radius:3px;display:flex;align-items:center;justify-content:center;margin:0 5px}.button span{font-size:12px;font-family:Arial;cursor:default;margin:0;padding:0}.accept{background-color:#19478a;color:#fff}.accept:hover{background-color:#3d6298}.cancel{background-color:#ddd;color:#444}.cancel:hover{background-color:#d5d5d5}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiUniversalCheckboxComponent, selector: "sti-checkbox", inputs: ["value", "disabled", "label"], outputs: ["valueChange"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiModalAgreeWindowComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-modal-agree-window", template: `
    <div class="modal-window" [style.height]="'150px'">
      <div class="nav">
        <span>{{
          model.showModalWindow ? loc.get2("Permissions", "ItemForms") : loc.get2("MainMenu", "menuViewOptions")
        }}</span>
      </div>
      <div class="content">
        <img *ngIf="model.showModalWindow" [src]="model.getImage('images.Other.Question.png')" />
        <p *ngIf="model.showModalWindow">{{ loc.get2("Questions", "qnPageDelete") }}</p>
        <div class="options" *ngIf="exportService.showModalWindow">
          <sti-checkbox [(value)]="exportService.useReadOnly" [label]="loc.getP('ReadOnly')"></sti-checkbox>
          <sti-checkbox [(value)]="exportService.usePdfA" [label]="loc.get2('Export', 'PdfACompliance')"></sti-checkbox>
        </div>
      </div>
      <div class="buttons" [style.padding-right.px]="3" [style.align-self]="'flex-end'">
        <div class="button accept" (click)="accept()">
          <span>
            {{
              model.showModalWindow
                ? loc.get2("Buttons", "Yes").replace("&amp", "").replace(";", "")
                : loc.get2("Gui", "barname_ok")
            }}
          </span>
        </div>
        <div class="button cancel" (click)="cancel()">
          <span>
            {{
              model.showModalWindow
                ? loc.get2("Buttons", "No").replace("&amp", "").replace(";", "")
                : loc.getP("Cancel")
            }}
          </span>
        </div>
      </div>
    </div>
  `, styles: [".options{display:flex;flex-direction:column;justify-content:center;width:100%;padding-left:10px}sti-checkbox{margin-top:5px;margin-bottom:5px}.modal-window{-webkit-touch-callout:none;-webkit-user-select:none;position:absolute;top:calc(50% - 75px);left:calc(50% - 150px);padding:0;font-family:Segoe UI;background-color:var(--back-color);width:300px;height:110px;z-index:9999999;border-radius:5px;display:flex;flex-direction:column;outline:1px solid rgb(81,92,106);-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d}.nav{width:100%;height:30px;background-color:#515c6a;border-top-left-radius:4px;border-top-right-radius:4px;display:flex;align-items:center}.nav span{width:100%;margin-left:10px;color:#fff;font-size:13px;font-family:Arial}.close{height:100%;width:40px;border-top-right-radius:5px;display:flex;align-items:center;justify-content:center}.close:hover{background-color:#c83c31}.close:active{background-color:#c42b1c}.close img{height:16px;width:16px}.content{width:100%;display:flex;align-items:center;flex:1;padding:10px}.content img{margin-left:10px;margin-right:10px;width:32px;height:32px}p{font-size:12px;font-family:Arial;color:var(--text-color)}.buttons{align-self:flex-end;padding-bottom:5px;height:32px;display:flex;padding-right:3px}.button{width:80px;height:24px;border-radius:3px;display:flex;align-items:center;justify-content:center;margin:0 5px}.button span{font-size:12px;font-family:Arial;cursor:default;margin:0;padding:0}.accept{background-color:#19478a;color:#fff}.accept:hover{background-color:#3d6298}.cancel{background-color:#ddd;color:#444}.cancel:hover{background-color:#d5d5d5}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiExportService }, { type: StiLocalizationService }], propDecorators: { handleKeyboardEvent: [{
                type: HostListener,
                args: ["document:keydown", ["$event"]]
            }] } });

class StiDraggableColumnContainerComponent {
    constructor(draggableService, model, cdref) {
        this.draggableService = draggableService;
        this.model = model;
        this.cdref = cdref;
    }
    ngOnInit() { }
    getBorder(pen) {
        return pen.toHtmlBorder();
    }
    get columnWidth() {
        let booleanButton = document.querySelector(".boolean-button");
        return booleanButton ? booleanButton.clientWidth : "max-content";
    }
    getColumnHeight(type) {
        if (this.draggableService?.fromTable) {
            if (type == "td") {
                let parentElement = document.getElementById(this.draggableService.parentElement.guid);
                let tdElements = parentElement.getElementsByClassName("sti-table-td");
                return tdElements[0].clientHeight;
            }
            else {
                let parentElement = document.getElementById(this.draggableService.parentElement.guid);
                let thElements = parentElement.getElementsByClassName("sti-table-th");
                return thElements[0].clientHeight;
            }
        }
        else {
            return;
        }
    }
    ngAfterViewChecked() {
        // setTimeout(() => {
        this.draggableService.containerHeight = this.container?.nativeElement.offsetHeight;
        this.draggableService.containerWidth = this.container?.nativeElement.offsetWidth;
        this.cdref.detectChanges();
        // }, 0);
    }
    ngAfterViewInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDraggableColumnContainerComponent, deps: [{ token: StiColumnDraggableService }, { token: StiModelService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiDraggableColumnContainerComponent, selector: "sti-draggable-column-container", viewQueries: [{ propertyName: "container", first: true, predicate: ["element"], descendants: true }], ngImport: i0, template: `
    <div
      #element
      style="position: absolute; z-index: 999; background-color:rgb(226,226,226); opacity:0.7; userSelect:none;"
      *ngIf="draggableService.isDragging"
      [style.visibility]="draggableService.isDragging ? 'visible' : 'hidden'"
      [style.transform]="model.getScale()"
      [style.transform-origin]="'left top'"
      [style.left]="draggableService.left"
      [style.top]="draggableService.top"
      [style.width.px]="draggableService.fromTable ? draggableService?.item?.width : columnWidth"
      [style.height]="draggableService.fromTable ? 'auto' : '22px'"
      [style.pointer-events]="'none'"
    >
      <div *ngIf="draggableService.fromTable">
        <table [style.border]="getBorder(draggableService?.parentElement?.gridLines?.pen)">
          <tr>
            <th
              [style.border]="getBorder(draggableService?.parentElement?.gridLines?.pen)"
              [style]="draggableService.parentElement.font.htmlStyle()"
              [style.height.px]="getColumnHeight('th')"
            >
              {{ draggableService.itemLabel }}
            </th>
          </tr>
          <tr *ngFor="let row of draggableService.parentElement.rowLabelsContentEditable; index as i">
            <td
              [style]="draggableService.parentElement.font.htmlStyle()"
              [style.border]="getBorder(draggableService?.parentElement?.gridLines?.pen)"
              [style.height.px]="getColumnHeight('td')"
            >
              <sti-table-column-component
                [column]="draggableService.item"
                [index]="i"
                [element]="draggableService.parentElement"
              ></sti-table-column-component>
            </td>
          </tr>
        </table>
      </div>
      <div *ngIf="!draggableService.fromTable" class="boolean-button">
        <div class="arrow">></div>
        <div class="content">
          {{ draggableService.itemLabel }}
        </div>
      </div>
    </div>
  `, isInline: true, styles: ["table{width:100%;border-collapse:collapse}th{padding:5px}td{padding:4px}.arrow{width:30px;text-align:center;cursor:default;-webkit-touch-callout:none;-webkit-user-select:none}.content{cursor:default;-webkit-touch-callout:none;-webkit-user-select:none;flex:1}.boolean-button{width:100%;font-size:12px;height:100%;font-weight:600;display:flex;padding-top:2px;flex-direction:row;color:var(--text-color);background-color:var(--hover-color)}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiTableColumnComponent, selector: "sti-table-column-component", inputs: ["column", "index", "element"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDraggableColumnContainerComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-draggable-column-container", template: `
    <div
      #element
      style="position: absolute; z-index: 999; background-color:rgb(226,226,226); opacity:0.7; userSelect:none;"
      *ngIf="draggableService.isDragging"
      [style.visibility]="draggableService.isDragging ? 'visible' : 'hidden'"
      [style.transform]="model.getScale()"
      [style.transform-origin]="'left top'"
      [style.left]="draggableService.left"
      [style.top]="draggableService.top"
      [style.width.px]="draggableService.fromTable ? draggableService?.item?.width : columnWidth"
      [style.height]="draggableService.fromTable ? 'auto' : '22px'"
      [style.pointer-events]="'none'"
    >
      <div *ngIf="draggableService.fromTable">
        <table [style.border]="getBorder(draggableService?.parentElement?.gridLines?.pen)">
          <tr>
            <th
              [style.border]="getBorder(draggableService?.parentElement?.gridLines?.pen)"
              [style]="draggableService.parentElement.font.htmlStyle()"
              [style.height.px]="getColumnHeight('th')"
            >
              {{ draggableService.itemLabel }}
            </th>
          </tr>
          <tr *ngFor="let row of draggableService.parentElement.rowLabelsContentEditable; index as i">
            <td
              [style]="draggableService.parentElement.font.htmlStyle()"
              [style.border]="getBorder(draggableService?.parentElement?.gridLines?.pen)"
              [style.height.px]="getColumnHeight('td')"
            >
              <sti-table-column-component
                [column]="draggableService.item"
                [index]="i"
                [element]="draggableService.parentElement"
              ></sti-table-column-component>
            </td>
          </tr>
        </table>
      </div>
      <div *ngIf="!draggableService.fromTable" class="boolean-button">
        <div class="arrow">></div>
        <div class="content">
          {{ draggableService.itemLabel }}
        </div>
      </div>
    </div>
  `, styles: ["table{width:100%;border-collapse:collapse}th{padding:5px}td{padding:4px}.arrow{width:30px;text-align:center;cursor:default;-webkit-touch-callout:none;-webkit-user-select:none}.content{cursor:default;-webkit-touch-callout:none;-webkit-user-select:none;flex:1}.boolean-button{width:100%;font-size:12px;height:100%;font-weight:600;display:flex;padding-top:2px;flex-direction:row;color:var(--text-color);background-color:var(--hover-color)}\n"] }]
        }], ctorParameters: () => [{ type: StiColumnDraggableService }, { type: StiModelService }, { type: i0.ChangeDetectorRef }], propDecorators: { container: [{
                type: ViewChild,
                args: ["element"]
            }] } });

class StiAboutWindowComponent {
    get align() {
        return "start";
    }
    get version() {
        return this.model.assemblyInfo
            ? this.model.assemblyInfo["version"].slice(0, this.model.assemblyInfo["version"].lastIndexOf("."))
            : "2022.4.1";
    }
    get releaseDate() {
        return this.model.assemblyInfo ? this.model.assemblyInfo["creationDate"] : " 27 Semptember 2022";
    }
    get copyright() {
        return this.model.assemblyInfo ? this.model.assemblyInfo["copyright"] : "";
    }
    get userMail() {
        return this.userService.currentUser
            ? this.userService.currentUser.userName
            : this.model.userName
                ? this.model.userName
                : "";
    }
    get hasLicense() {
        return this.userService.licenseProducts.find((product) => product.ident == "Ultimate" ||
            product.ident == "FormsWeb" ||
            product.ident == 1 ||
            product.ident == 4 ||
            product.ident == "BICloud" ||
            product.ident == 18);
    }
    constructor(model, userService) {
        this.model = model;
        this.userService = userService;
    }
    close() {
        this.model.showAboutWindow = false;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiAboutWindowComponent, deps: [{ token: StiModelService }, { token: StiUserService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiAboutWindowComponent, selector: "sti-about-window-component", ngImport: i0, template: `
    <div class="about-window">
      <div class="close-bar">
        <div class="close-button" (click)="close()"><img [src]="model.getImage('images.Other.CloseForm.png')" /></div>
      </div>
      <div class="content">
        <span [style.margin-bottom]="'20px'" [style.color]="'rgb(0,112,184)'" [style.font-size]="'24px'"
          >Stimulsoft PDF Forms</span
        >
        <img [src]="model.getImage('images.Other.About.png')" alt="" />
        <span [style.margin-top]="'20px'">{{ copyright }}</span>
        <span>Version: {{ version }} from {{ releaseDate }}, Angular</span>
        <span> All rights reserved</span>
        <span [style.font-weight]="'bold'" [style.color]="!hasLicense ? 'red' : ''">{{
          userMail + (userMail && !hasLicense ? ", " : "") + (!hasLicense ? "Trial Version" : "")
        }}</span>
        <a href="http://stimulsoft.com" target="_blank">www.stimulsoft.com</a>
      </div>
    </div>
  `, isInline: true, styles: ["a{margin-top:15px;font-size:12px;color:#3a90ff}span{margin:10px;font-size:12px}.about-window{-webkit-touch-callout:none;-webkit-user-select:none;font-family:Arial;position:absolute;z-index:1000;left:calc(50% - 275px);top:calc(50% - 190px);background-color:#fff;width:550px;height:380px;border-radius:5px;border:1px solid rgb(25,71,138);-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;padding:0}.close-bar{height:30px;width:100%;display:flex;flex-direction:row-reverse}.close-button{padding:0;margin:0;border-top-right-radius:5px;height:30px;width:30px;background-color:#fff;display:flex;align-items:center;justify-content:center}.close-button img{height:16px;width:16px}.close-button:hover{background-color:#e81123}.close-button:hover img{filter:brightness(0) invert(1)}.content{display:flex;flex-direction:column;height:100%;align-items:center}img{height:100px;width:100px}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiAboutWindowComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-about-window-component", template: `
    <div class="about-window">
      <div class="close-bar">
        <div class="close-button" (click)="close()"><img [src]="model.getImage('images.Other.CloseForm.png')" /></div>
      </div>
      <div class="content">
        <span [style.margin-bottom]="'20px'" [style.color]="'rgb(0,112,184)'" [style.font-size]="'24px'"
          >Stimulsoft PDF Forms</span
        >
        <img [src]="model.getImage('images.Other.About.png')" alt="" />
        <span [style.margin-top]="'20px'">{{ copyright }}</span>
        <span>Version: {{ version }} from {{ releaseDate }}, Angular</span>
        <span> All rights reserved</span>
        <span [style.font-weight]="'bold'" [style.color]="!hasLicense ? 'red' : ''">{{
          userMail + (userMail && !hasLicense ? ", " : "") + (!hasLicense ? "Trial Version" : "")
        }}</span>
        <a href="http://stimulsoft.com" target="_blank">www.stimulsoft.com</a>
      </div>
    </div>
  `, styles: ["a{margin-top:15px;font-size:12px;color:#3a90ff}span{margin:10px;font-size:12px}.about-window{-webkit-touch-callout:none;-webkit-user-select:none;font-family:Arial;position:absolute;z-index:1000;left:calc(50% - 275px);top:calc(50% - 190px);background-color:#fff;width:550px;height:380px;border-radius:5px;border:1px solid rgb(25,71,138);-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;padding:0}.close-bar{height:30px;width:100%;display:flex;flex-direction:row-reverse}.close-button{padding:0;margin:0;border-top-right-radius:5px;height:30px;width:30px;background-color:#fff;display:flex;align-items:center;justify-content:center}.close-button img{height:16px;width:16px}.close-button:hover{background-color:#e81123}.close-button:hover img{filter:brightness(0) invert(1)}.content{display:flex;flex-direction:column;height:100%;align-items:center}img{height:100px;width:100px}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiUserService }] });

class StiBarcodeStylesPreviewComponent {
    get items() {
        return this.barcodeService.barcodeStyles;
    }
    get itemsInRows() {
        let items = new Array(Math.floor((this.barcodeService.previewWidth - 10) / this.itemWidth)).fill(1);
        return items.length >= 1 ? items : new Array(1).fill(1);
    }
    get rows() {
        return new Array(Math.ceil(this.items.length / this.itemsInRows.length)).fill(2);
    }
    get currentItem() {
        return this.model.selectedComponent?.element && this.model.selectedComponent?.element instanceof StiBarcodeElement
            ? this.model.selectedComponent?.element
            : null;
    }
    constructor(barcodeService, model) {
        this.barcodeService = barcodeService;
        this.model = model;
        this.itemWidth = 57;
    }
    selectStyle(index) {
        this.currentItem.style = index;
        this.barcodeService.showBarcodePreview = false;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBarcodeStylesPreviewComponent, deps: [{ token: StiBarcodeService }, { token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiBarcodeStylesPreviewComponent, selector: "sti-barcode-styles-preview", ngImport: i0, template: `
    <div
      #element
      class="container"
      [style.visibility]="barcodeService.showBarcodePreview ? 'visible' : 'hidden'"
      [style.left.px]="barcodeService.previewX"
      [style.top.px]="barcodeService.previewY"
      [style.width.px]="barcodeService.previewWidth ? barcodeService.previewWidth : 192"
    >
      <table class="sti-clear" [style.width]="'100%'">
        <tr *ngFor="let row of rows; index as i" class="row-container">
          <td
            *ngFor="let item of itemsInRows; index as ind"
            class="{{ items[i * itemsInRows.length + ind] ? '' : 'disabled' }} {{
              currentItem && i * itemsInRows.length + ind + 1 == currentItem.style ? 'active' : ''
            }}"
            (click)="selectStyle(i * itemsInRows.length + ind + 1)"
          >
            <sti-svg-image
              *ngIf="items[i * itemsInRows.length + ind]"
              [svg]="items[i * itemsInRows.length + ind].innerHtml"
            ></sti-svg-image>
          </td>
        </tr>
      </table>
    </div>
    <style>
      .container {
        position: absolute;
        z-index: 999;
        background-color: var(--back-color);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        width: 192px;
        height: 233px;
        border: 1px solid lightgray;
        border-radius: 3px;
        overflow-y: scroll;
        overflow-x: hidden;
        box-shadow: 0 3px 6px 0 rgb(0 0 0 / 16%);
      }
      .row-container {
        display: flex;
        width: 100%;
      }

      td {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 3px 3px 0 3px;
      }
      td:hover {
        background-color: var(--hover-color);
      }
      td:active {
        background-color: var(--active-color);
      }
      .active {
        background-color: rgb(190, 230, 253);
      }
      .disabled {
        pointer-events: none;
      }
    </style>
  `, isInline: true, styles: ["\n      .container {\n        position: absolute;\n        z-index: 999;\n        background-color: var(--back-color);\n        -webkit-touch-callout: none;\n        -webkit-user-select: none;\n        width: 192px;\n        height: 233px;\n        border: 1px solid lightgray;\n        border-radius: 3px;\n        overflow-y: scroll;\n        overflow-x: hidden;\n        box-shadow: 0 3px 6px 0 rgb(0 0 0 / 16%);\n      }\n      .row-container {\n        display: flex;\n        width: 100%;\n      }\n\n      td {\n        flex: 1;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        padding: 3px 3px 0 3px;\n      }\n      td:hover {\n        background-color: var(--hover-color);\n      }\n      td:active {\n        background-color: var(--active-color);\n      }\n      .active {\n        background-color: rgb(190, 230, 253);\n      }\n      .disabled {\n        pointer-events: none;\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiSvgImageComponent, selector: "sti-svg-image", inputs: ["svg"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiBarcodeStylesPreviewComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-barcode-styles-preview",
                    template: `
    <div
      #element
      class="container"
      [style.visibility]="barcodeService.showBarcodePreview ? 'visible' : 'hidden'"
      [style.left.px]="barcodeService.previewX"
      [style.top.px]="barcodeService.previewY"
      [style.width.px]="barcodeService.previewWidth ? barcodeService.previewWidth : 192"
    >
      <table class="sti-clear" [style.width]="'100%'">
        <tr *ngFor="let row of rows; index as i" class="row-container">
          <td
            *ngFor="let item of itemsInRows; index as ind"
            class="{{ items[i * itemsInRows.length + ind] ? '' : 'disabled' }} {{
              currentItem && i * itemsInRows.length + ind + 1 == currentItem.style ? 'active' : ''
            }}"
            (click)="selectStyle(i * itemsInRows.length + ind + 1)"
          >
            <sti-svg-image
              *ngIf="items[i * itemsInRows.length + ind]"
              [svg]="items[i * itemsInRows.length + ind].innerHtml"
            ></sti-svg-image>
          </td>
        </tr>
      </table>
    </div>
    <style>
      .container {
        position: absolute;
        z-index: 999;
        background-color: var(--back-color);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        width: 192px;
        height: 233px;
        border: 1px solid lightgray;
        border-radius: 3px;
        overflow-y: scroll;
        overflow-x: hidden;
        box-shadow: 0 3px 6px 0 rgb(0 0 0 / 16%);
      }
      .row-container {
        display: flex;
        width: 100%;
      }

      td {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 3px 3px 0 3px;
      }
      td:hover {
        background-color: var(--hover-color);
      }
      td:active {
        background-color: var(--active-color);
      }
      .active {
        background-color: rgb(190, 230, 253);
      }
      .disabled {
        pointer-events: none;
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiBarcodeService }, { type: StiModelService }] });

class StiPdfPreviewComponent {
    constructor(model, sanitizer, httpService) {
        this.model = model;
        this.sanitizer = sanitizer;
        this.httpService = httpService;
    }
    ngOnDestroy() {
        if (this.model.selectedComponent) {
            this.model.selectedComponent.element.needToSelectComponent = true;
        }
    }
    ngAfterViewInit() {
        setTimeout(() => {
            let currentForm = this.model.currentFormState;
            let data = {
                action: "GeneratePDF",
                form: currentForm,
                settings: {
                    usePdfA: false,
                    readOnly: false,
                },
            };
            this.httpService.post(this.model.requestUrl, data, "byteArray", { showProgress: true }).subscribe((data) => {
                let pdfBytes = new Int8Array(data);
                this.model.showProgress = false;
                let blob = new Blob([pdfBytes], { type: "application/pdf" });
                let toolbar = this.model.isWebView ? "#toolbar=0" : "";
                this.src = this.sanitizer.bypassSecurityTrustResourceUrl(URL.createObjectURL(blob) + toolbar);
            });
        }, 0);
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPdfPreviewComponent, deps: [{ token: StiModelService }, { token: i2.DomSanitizer }, { token: StiHttpClientService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiPdfPreviewComponent, selector: "sti-pdf-preview", ngImport: i0, template: ` <embed *ngIf="src" [src]="src" style="width: 100%;height: 100%" type="application/pdf" /> `, isInline: true, styles: [""], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPdfPreviewComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-pdf-preview", template: ` <embed *ngIf="src" [src]="src" style="width: 100%;height: 100%" type="application/pdf" /> ` }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: i2.DomSanitizer }, { type: StiHttpClientService }] });

class NavbarGroupPreviewComponent {
    constructor(toolboxService, model, loc) {
        this.toolboxService = toolboxService;
        this.model = model;
        this.loc = loc;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: NavbarGroupPreviewComponent, deps: [{ token: StiToolboxService }, { token: StiModelService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: NavbarGroupPreviewComponent, selector: "sti-navbar-group-preview-component", ngImport: i0, template: `<div
    class="parent-group-container"
    [style.visibility]="model.showGroupPreview ? 'visible' : 'hidden'"
    [style.left.px]="toolboxService.previewX"
    [style.top.px]="toolboxService.previewY"
    [style.width]="'max-content'"
  >
    <div class="toolbox-content" *ngIf="toolboxService.currentGroup == 'Others'">
      <sti-toolbox-element
        [forGroup]="true"
        *ngFor="let element of toolboxService.otherGroup"
        [element]="element"
      ></sti-toolbox-element>
    </div>
    <div class="toolbox-content" *ngIf="toolboxService.currentGroup == 'Input'">
      <sti-toolbox-element
        [forGroup]="true"
        *ngFor="let element of toolboxService.inputGroup"
        [element]="element"
      ></sti-toolbox-element>
    </div>
    <div class="toolbox-content" *ngIf="toolboxService.currentGroup == 'Selection'">
      <sti-toolbox-element
        [forGroup]="true"
        *ngFor="let element of toolboxService.selectionGroup"
        [element]="element"
      ></sti-toolbox-element>
    </div>
  </div>`, isInline: true, styles: [".parent-group-container{position:absolute;z-index:999;background-color:var(--back-color);-webkit-touch-callout:none;-webkit-user-select:none;height:max-content;padding:1px 2px;border:1px solid lightgray;border-radius:3px;overflow:hidden;box-shadow:0 3px 6px #00000029}.toolbox-content{height:max-content;width:max-content}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiToolboxElementComponent, selector: "sti-toolbox-element", inputs: ["element", "forRibbon", "forGroup"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: NavbarGroupPreviewComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-navbar-group-preview-component", template: `<div
    class="parent-group-container"
    [style.visibility]="model.showGroupPreview ? 'visible' : 'hidden'"
    [style.left.px]="toolboxService.previewX"
    [style.top.px]="toolboxService.previewY"
    [style.width]="'max-content'"
  >
    <div class="toolbox-content" *ngIf="toolboxService.currentGroup == 'Others'">
      <sti-toolbox-element
        [forGroup]="true"
        *ngFor="let element of toolboxService.otherGroup"
        [element]="element"
      ></sti-toolbox-element>
    </div>
    <div class="toolbox-content" *ngIf="toolboxService.currentGroup == 'Input'">
      <sti-toolbox-element
        [forGroup]="true"
        *ngFor="let element of toolboxService.inputGroup"
        [element]="element"
      ></sti-toolbox-element>
    </div>
    <div class="toolbox-content" *ngIf="toolboxService.currentGroup == 'Selection'">
      <sti-toolbox-element
        [forGroup]="true"
        *ngFor="let element of toolboxService.selectionGroup"
        [element]="element"
      ></sti-toolbox-element>
    </div>
  </div>`, styles: [".parent-group-container{position:absolute;z-index:999;background-color:var(--back-color);-webkit-touch-callout:none;-webkit-user-select:none;height:max-content;padding:1px 2px;border:1px solid lightgray;border-radius:3px;overflow:hidden;box-shadow:0 3px 6px #00000029}.toolbox-content{height:max-content;width:max-content}\n"] }]
        }], ctorParameters: () => [{ type: StiToolboxService }, { type: StiModelService }, { type: StiLocalizationService }] });

class StiSetupToolboxComponent {
    get showToolbox() {
        return this._showToolbox;
    }
    set showToolbox(value) {
        if (value == false && !this.showInsertTab) {
            this._showInsertTab = true;
            this._showToolbox = value;
        }
        else {
            this._showToolbox = value;
        }
    }
    get showInsertTab() {
        return this._showInsertTab;
    }
    set showInsertTab(value) {
        if (value == false && !this.showToolbox) {
            this._showToolbox = true;
            this._showInsertTab = value;
        }
        else {
            this._showInsertTab = value;
        }
    }
    constructor(model, loc, toolboxService, stiLocalStorage) {
        this.model = model;
        this.loc = loc;
        this.toolboxService = toolboxService;
        this.stiLocalStorage = stiLocalStorage;
    }
    acceptChanges() {
        this.toolboxService.unusedElements = [];
        this.toolboxService.elements.forEach((element) => {
            if (!element.enabled && element.caption != "Divider") {
                this.toolboxService.unusedElements.push(element.id);
            }
        });
        this.stiLocalStorage.setItem("StiToolboxSetup", JSON.stringify(this.toolboxService.unusedElements));
        this.stiLocalStorage.setItem("StiShowInsertTab", JSON.stringify(this.showInsertTab));
        this.stiLocalStorage.setItem("StiShowToolbox", JSON.stringify(this.showToolbox));
        // document.cookie = "StiToolboxSetup=" + this.toolboxService.unusedElements.join();
        this.model.showInsertTab = this.showInsertTab;
        this.toolboxService.showToolbox = this.showToolbox;
        this.model.showToolboxSetup = false;
    }
    ngOnInit() {
        this._showInsertTab = this.model.showInsertTab;
        this._showToolbox = this.toolboxService.showToolbox;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSetupToolboxComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }, { token: StiToolboxService }, { token: StiLocalStorageService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiSetupToolboxComponent, selector: "sti-setup-toolbox-component", ngImport: i0, template: `
    <div class="modal-window">
      <div class="modal-window-navbar">
        <span [style.flex]="1">{{ loc.get2("FormDesigner", "SetupToolbox") }}</span>
        <div class="close-button" (click)="model.showToolboxSetup = false">
          <img [src]="model.getImage('images.Other.CloseForm.png')" />
        </div>
      </div>
      <div class="toolbox-elements-preview">
        <ul>
          <li
            *ngFor="let element of toolboxService.elements"
            [style.display]="element.caption == 'Divider' ? 'none' : ''"
            [style.padding.px]="toolboxService.isEnabledFromSettings(element) ? 3 : 0"
          >
            <div class="setup-toolbox-item" *ngIf="toolboxService.isEnabledFromSettings(element)">
              <sti-checkbox [(value)]="element.enabled" [label]=""></sti-checkbox>
              <img [src]="model.getImage(element.image)" alt="" />
              <span>{{
                element.caption != "Input" || element.caption != "Other" || element.caption != "Selection"
                  ? loc.get2(element.category ? element.category : "Components", element.caption)
                  : loc.getP(element.caption)
              }}</span>
            </div>
          </li>
        </ul>
      </div>
      <div class="setup-options">
        <sti-checkbox
          [(value)]="showToolbox"
          [label]="loc.get2('MainMenu', 'menuViewShowToolbox').replace('.', '')"
          [style.margin-bottom.px]="15"
          [style.color]="'var(--text-color)'"
        ></sti-checkbox>
        <sti-checkbox
          [(value)]="showInsertTab"
          [label]="loc.get2('MainMenu', 'menuViewShowInsertTab').replace('.', '')"
          [style.color]="'var(--text-color)'"
        ></sti-checkbox>
      </div>
      <div class="setup-accept">
        <div class="accept button" (click)="acceptChanges()">
          <span [style.margin-left.px]="0">{{ loc.get2("Buttons", "Ok").replace("&amp", "").replace(";", "") }}</span>
        </div>
        <div class="cancel button" (click)="model.showToolboxSetup = false">
          <span [style.margin-left.px]="0">{{ loc.getP("Cancel") }}</span>
        </div>
      </div>
    </div>
  `, isInline: true, styles: [".setup-toolbox-item{display:flex;position:relative;align-items:center}.pi{font-size:.825rem;color:var(--text-color)}.modal-window-navbar{display:flex;height:30px;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a;-webkit-user-select:none;color:#fff;align-items:center}.modal-window-navbar span{font-size:13px}.close-button{height:30px;width:30px;border-radius:3px;display:flex;align-items:center;justify-content:center}.close-button:hover{background-color:#dadada}.close-button img{height:16px;width:16px;filter:brightness(0) invert(1)}.modal-window{background-color:var(--back-color);position:absolute;left:calc(50% - 150px);top:calc(50% - 222px);z-index:999;width:300px;height:444px;overflow:hidden;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;border:1px solid rgb(25,71,138);color:var(--text-color);font-size:13px;border-radius:5px;font-family:Arial;-webkit-user-select:none}ul{list-style:none;margin:0;padding-left:6px;padding-top:3px}li{display:flex;position:relative;padding:3px;align-items:center}.toolbox-elements-preview{margin:10px;border:1px solid lightgray;border-radius:3px;height:300px;overflow-y:scroll}.setup-options{padding-left:10px;display:flex;flex-direction:column}img{margin-left:3px;height:16px;width:15px}span{margin-left:5px;font-size:12px}.button{height:24px;width:80px;border-radius:3px;margin:3px 5px;display:flex;align-items:center;justify-content:center;border:1px solid transparent}.accept:active{background-color:#355da0;border-color:#264c7d}.cancel:active{background-color:#e2e2e2;border-color:#838383}.accept{background-color:#19478a;color:#fff}.accept:hover{background-color:#3d6298}.cancel{background-color:#ddd;color:#444}.cancel:hover{background-color:#d5d5d5}.setup-accept{padding:8px;display:flex;align-items:flex-end;justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiUniversalCheckboxComponent, selector: "sti-checkbox", inputs: ["value", "disabled", "label"], outputs: ["valueChange"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiSetupToolboxComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-setup-toolbox-component", template: `
    <div class="modal-window">
      <div class="modal-window-navbar">
        <span [style.flex]="1">{{ loc.get2("FormDesigner", "SetupToolbox") }}</span>
        <div class="close-button" (click)="model.showToolboxSetup = false">
          <img [src]="model.getImage('images.Other.CloseForm.png')" />
        </div>
      </div>
      <div class="toolbox-elements-preview">
        <ul>
          <li
            *ngFor="let element of toolboxService.elements"
            [style.display]="element.caption == 'Divider' ? 'none' : ''"
            [style.padding.px]="toolboxService.isEnabledFromSettings(element) ? 3 : 0"
          >
            <div class="setup-toolbox-item" *ngIf="toolboxService.isEnabledFromSettings(element)">
              <sti-checkbox [(value)]="element.enabled" [label]=""></sti-checkbox>
              <img [src]="model.getImage(element.image)" alt="" />
              <span>{{
                element.caption != "Input" || element.caption != "Other" || element.caption != "Selection"
                  ? loc.get2(element.category ? element.category : "Components", element.caption)
                  : loc.getP(element.caption)
              }}</span>
            </div>
          </li>
        </ul>
      </div>
      <div class="setup-options">
        <sti-checkbox
          [(value)]="showToolbox"
          [label]="loc.get2('MainMenu', 'menuViewShowToolbox').replace('.', '')"
          [style.margin-bottom.px]="15"
          [style.color]="'var(--text-color)'"
        ></sti-checkbox>
        <sti-checkbox
          [(value)]="showInsertTab"
          [label]="loc.get2('MainMenu', 'menuViewShowInsertTab').replace('.', '')"
          [style.color]="'var(--text-color)'"
        ></sti-checkbox>
      </div>
      <div class="setup-accept">
        <div class="accept button" (click)="acceptChanges()">
          <span [style.margin-left.px]="0">{{ loc.get2("Buttons", "Ok").replace("&amp", "").replace(";", "") }}</span>
        </div>
        <div class="cancel button" (click)="model.showToolboxSetup = false">
          <span [style.margin-left.px]="0">{{ loc.getP("Cancel") }}</span>
        </div>
      </div>
    </div>
  `, styles: [".setup-toolbox-item{display:flex;position:relative;align-items:center}.pi{font-size:.825rem;color:var(--text-color)}.modal-window-navbar{display:flex;height:30px;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a;-webkit-user-select:none;color:#fff;align-items:center}.modal-window-navbar span{font-size:13px}.close-button{height:30px;width:30px;border-radius:3px;display:flex;align-items:center;justify-content:center}.close-button:hover{background-color:#dadada}.close-button img{height:16px;width:16px;filter:brightness(0) invert(1)}.modal-window{background-color:var(--back-color);position:absolute;left:calc(50% - 150px);top:calc(50% - 222px);z-index:999;width:300px;height:444px;overflow:hidden;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;border:1px solid rgb(25,71,138);color:var(--text-color);font-size:13px;border-radius:5px;font-family:Arial;-webkit-user-select:none}ul{list-style:none;margin:0;padding-left:6px;padding-top:3px}li{display:flex;position:relative;padding:3px;align-items:center}.toolbox-elements-preview{margin:10px;border:1px solid lightgray;border-radius:3px;height:300px;overflow-y:scroll}.setup-options{padding-left:10px;display:flex;flex-direction:column}img{margin-left:3px;height:16px;width:15px}span{margin-left:5px;font-size:12px}.button{height:24px;width:80px;border-radius:3px;margin:3px 5px;display:flex;align-items:center;justify-content:center;border:1px solid transparent}.accept:active{background-color:#355da0;border-color:#264c7d}.cancel:active{background-color:#e2e2e2;border-color:#838383}.accept{background-color:#19478a;color:#fff}.accept:hover{background-color:#3d6298}.cancel{background-color:#ddd;color:#444}.cancel:hover{background-color:#d5d5d5}.setup-accept{padding:8px;display:flex;align-items:flex-end;justify-content:flex-end}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }, { type: StiToolboxService }, { type: StiLocalStorageService }] });

class StiLocalizationPreviewComponent {
    constructor(model, httpService, userService, loc, helper, stiLocalStorage) {
        this.model = model;
        this.httpService = httpService;
        this.userService = userService;
        this.loc = loc;
        this.helper = helper;
        this.stiLocalStorage = stiLocalStorage;
        this.itemWidth = 150;
    }
    get items() {
        return this.loc.localizationList ? this.loc.localizationList : [];
    }
    get itemsInRow() {
        return new Array(3).fill(1);
    }
    get rows() {
        return this.items ? new Array(Math.ceil(this.items.length / this.itemsInRow.length)).fill(2) : new Array(0).fill(0);
    }
    setEvent(event) {
        let localization;
        if (event != "Default") {
            localization = this.loc.localizationList?.find((item) => this.model.isWebView ? item.language == event : item.fileName == event);
        }
        else {
            localization = this.loc.defaultLocalization;
        }
        this.loc.currentLocalization = localization;
        if (event == "Default") {
            this.httpService
                .post("", {
                action: "InterfaceEvent",
                event: "LocalizationButtonClick",
                localization: this.model.isWebView
                    ? this.loc.defaultLocalization.language
                    : this.loc.defaultLocalization.fileName,
            })
                .subscribe(() => { });
            this.loc.currentLocalization = this.loc.defaultLocalization;
        }
        else {
            this.httpService
                .post("", { action: "InterfaceEvent", event: "LocalizationButtonClick", localization: event })
                .subscribe(() => { });
            this.loc.currentLocalization = this.loc.localizationList?.find((item) => this.model.isWebView ? item.language == event : item.fileName == event);
        }
        this.stiLocalStorage.setItem("StiFormsLocalization", JSON.stringify(this.loc.currentLocalization));
        this.httpService
            .post(this.model.requestUrl, { action: "GetLocalization", localization: localization.cultureName })
            .subscribe((data) => {
            StiLocalizationService.setLocalization(data.localization);
            this.model.needToRefresh.next(true);
            this.helper.updateHelper();
        });
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiLocalizationPreviewComponent, deps: [{ token: StiModelService }, { token: StiHttpClientService }, { token: StiUserService }, { token: StiLocalizationService }, { token: StiHelperService }, { token: StiLocalStorageService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiLocalizationPreviewComponent, selector: "sti-localization-preview", ngImport: i0, template: `
    <div
      class="parent-localization-container"
      [style.visibility]="userService.showLocalizationPreview ? 'visible' : 'hidden'"
      [style.left.px]="userService.previewX"
      [style.top.px]="userService.previewY"
      [style.width.px]="loc.localizationList?.length > 0 ? 465 : 155"
    >
      <div class="default" [style.width.px]="loc.localizationList?.length > 0 ? 460 : 155">
        <div class="item" (click)="setEvent('Default')" [style.margin.px]="1">
          <span>{{ loc.getP("Default") }}</span>
        </div>
        <div
          *ngIf="loc.localizationList?.length > 0"
          class="item {{ loc.defaultLocalization?.language == loc.currentLocalization?.language ? 'current' : '' }}"
          [style.margin.px]="1"
          (click)="setEvent('Default')"
        >
          <span>{{ loc.defaultLocalization?.description }}</span>
        </div>
      </div>
      <div *ngIf="loc.localizationList?.length > 0" class="localization-list">
        <table class="sti-clear" [style.width]="'100%'">
          <tr *ngFor="let row of rows; index as i" class="row-container">
            <td *ngFor="let item of itemsInRow; index as ind">
              <div
                *ngIf="items[i * itemsInRow.length + ind]"
                (click)="
                  model.isWebView
                    ? setEvent(items[i * itemsInRow.length + ind]?.language)
                    : setEvent(items[i * itemsInRow.length + ind]?.fileName)
                "
                class="item {{
                  items[i * itemsInRow.length + ind]?.language == loc.currentLocalization?.language ? 'current' : ''
                }}"
              >
                <span>{{ items[i * itemsInRow.length + ind]?.description }}</span>
              </div>
            </td>
          </tr>
        </table>
      </div>
    </div>
  `, isInline: true, styles: ["table{border-spacing:2px}td{padding:0;max-width:150px;height:32px}.parent-localization-container{position:absolute;z-index:999;background-color:var(--back-color);-webkit-touch-callout:none;-webkit-user-select:none;height:max-content;padding:1px;border:1px solid #c6c6c6;border-radius:3px;font-size:12px;font-family:Arial;color:#444;overflow:hidden;max-height:600px;box-shadow:0 0 7px #0000004d}.localization-list{width:460px;display:flex;flex-wrap:wrap;padding-top:1px}.default{width:460px;display:flex;flex-wrap:wrap;padding-bottom:1px;border-bottom:1px dotted #c6c6c6}.item{width:151.2px;border-radius:3px;height:32px;display:flex;align-items:center;justify-content:center;background-color:var(--back-color);border:1px solid #c6c6c6}.item:hover{background-color:#dadada;border-color:#c6c6c6}.current{background-color:#e5e5e5}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiLocalizationPreviewComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-localization-preview", template: `
    <div
      class="parent-localization-container"
      [style.visibility]="userService.showLocalizationPreview ? 'visible' : 'hidden'"
      [style.left.px]="userService.previewX"
      [style.top.px]="userService.previewY"
      [style.width.px]="loc.localizationList?.length > 0 ? 465 : 155"
    >
      <div class="default" [style.width.px]="loc.localizationList?.length > 0 ? 460 : 155">
        <div class="item" (click)="setEvent('Default')" [style.margin.px]="1">
          <span>{{ loc.getP("Default") }}</span>
        </div>
        <div
          *ngIf="loc.localizationList?.length > 0"
          class="item {{ loc.defaultLocalization?.language == loc.currentLocalization?.language ? 'current' : '' }}"
          [style.margin.px]="1"
          (click)="setEvent('Default')"
        >
          <span>{{ loc.defaultLocalization?.description }}</span>
        </div>
      </div>
      <div *ngIf="loc.localizationList?.length > 0" class="localization-list">
        <table class="sti-clear" [style.width]="'100%'">
          <tr *ngFor="let row of rows; index as i" class="row-container">
            <td *ngFor="let item of itemsInRow; index as ind">
              <div
                *ngIf="items[i * itemsInRow.length + ind]"
                (click)="
                  model.isWebView
                    ? setEvent(items[i * itemsInRow.length + ind]?.language)
                    : setEvent(items[i * itemsInRow.length + ind]?.fileName)
                "
                class="item {{
                  items[i * itemsInRow.length + ind]?.language == loc.currentLocalization?.language ? 'current' : ''
                }}"
              >
                <span>{{ items[i * itemsInRow.length + ind]?.description }}</span>
              </div>
            </td>
          </tr>
        </table>
      </div>
    </div>
  `, styles: ["table{border-spacing:2px}td{padding:0;max-width:150px;height:32px}.parent-localization-container{position:absolute;z-index:999;background-color:var(--back-color);-webkit-touch-callout:none;-webkit-user-select:none;height:max-content;padding:1px;border:1px solid #c6c6c6;border-radius:3px;font-size:12px;font-family:Arial;color:#444;overflow:hidden;max-height:600px;box-shadow:0 0 7px #0000004d}.localization-list{width:460px;display:flex;flex-wrap:wrap;padding-top:1px}.default{width:460px;display:flex;flex-wrap:wrap;padding-bottom:1px;border-bottom:1px dotted #c6c6c6}.item{width:151.2px;border-radius:3px;height:32px;display:flex;align-items:center;justify-content:center;background-color:var(--back-color);border:1px solid #c6c6c6}.item:hover{background-color:#dadada;border-color:#c6c6c6}.current{background-color:#e5e5e5}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHttpClientService }, { type: StiUserService }, { type: StiLocalizationService }, { type: StiHelperService }, { type: StiLocalStorageService }] });

class StiUserInfoComponent {
    constructor(model, httpService, userService, loc) {
        this.model = model;
        this.httpService = httpService;
        this.userService = userService;
        this.loc = loc;
    }
    get userInfo() {
        return { name: "My1 Company", mail: "Stimulsoft130@gmail.com" };
    }
    setEvent(event) {
        if (event == "Logout") {
            this.httpService.post("", { action: "InterfaceEvent", event: "LogoutButtonClick" }).subscribe(() => {
                if (!this.model.isWebView) {
                    this.model.userIsAuthorized = false;
                    this.userService.licenseProducts = [];
                    this.userService.currentUser = "empty";
                    this.userService.checkLicense();
                }
            });
        }
        else if (event == "Account") {
            this.httpService.post("", { action: "InterfaceEvent", event: "AccountButtonClick" }).subscribe(() => { });
        }
        else if (event == "Cloud") {
            this.httpService.post("", { action: "InterfaceEvent", event: "CloudButtonClick" }).subscribe(() => { });
        }
        this.userService.showUserInfo = false;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiUserInfoComponent, deps: [{ token: StiModelService }, { token: StiHttpClientService }, { token: StiUserService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiUserInfoComponent, selector: "sti-user-info", ngImport: i0, template: `
    <div
      class="parent-user-info-container"
      [style.visibility]="userService.showUserInfo ? 'visible' : 'hidden'"
      [style.left.px]="userService.previewX"
      [style.top.px]="userService.previewY"
      [style.width.px]="350"
    >
      <div class="user-info">
        <div class="user-image">
          <img
            [style.width.px]="82"
            [style.height.px]="82"
            *ngIf="userService?.currentUser?.picture"
            src="data:image/jpeg;base64,{{ userService?.currentUser?.picture }}"
            alt=""
          />
          <div
            *ngIf="!userService?.currentUser?.picture"
            class="custom-image"
            [style.background-color]="userService.getBackground(userService.currentUser)"
          >
            <span [style.margin-top.px]="11">{{
              userService.currentUser
                ? (userService.currentUser.firstName ? userService.currentUser.firstName[0] : "") +
                  (userService.currentUser.lastName ? userService.currentUser.lastName[0] : "")
                : "MC"
            }}</span>
          </div>
        </div>
        <div class="info">
          <span [style.font-size.px]="18" [style.font-weight]="'bold'">{{
            userService.currentUser
              ? (userService.currentUser.firstName ? userService.currentUser.firstName : "") +
                " " +
                (userService.currentUser.lastName ? userService.currentUser.lastName : "")
              : "My1 Company"
          }}</span>
          <span>{{
            userService.currentUser
              ? userService.currentUser.userName
                ? userService.currentUser.userName
                : ""
              : userInfo.mail
          }}</span>
          <span class="link" (click)="setEvent('Cloud')">{{ loc.get2("Cloud", "Cloud") }}</span>
          <span class="link" (click)="setEvent('Account')">{{ loc.get2("Cloud", "Account") }}</span>
        </div>
      </div>
      <div class="logout">
        <div class="logout-button" (click)="setEvent('Logout')">
          <span>{{ loc.get2("Cloud", "ButtonLogout") }}</span>
        </div>
      </div>
    </div>
  `, isInline: true, styles: [".parent-user-info-container{position:absolute;z-index:999;background-color:var(--back-color);-webkit-touch-callout:none;-webkit-user-select:none;height:max-content;padding:1px;border:1px solid #c6c6c6;border-radius:3px;overflow:hidden;font-family:Segoe UI;box-shadow:0 0 7px #0000004d}.user-info{height:100%;width:100%;display:flex;overflow:hidden}.info{display:flex;flex-direction:column;font-size:13px;align-items:start;justify-content:center}.info span{margin:3px}.user-image{padding:15px}.user-image img{border-radius:40px}.logout{width:100%;height:60px;display:flex;justify-content:flex-end;align-items:flex-end;padding:10px}.logout-button{height:24px;min-width:60px;background-color:#3d6bba;display:flex;align-items:center;justify-content:center;font-size:13px;padding:0 10px;color:#fff}.logout-button:hover{background-color:#4377d0}.link{color:#5a83ad;border-bottom:1px solid transparent}.link:hover{border-color:#5a83ad}span{width:max-content}.custom-image{height:82px;width:82px;border-radius:40px;margin:0 5px;color:#fff;font-size:42px;display:flex;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiUserInfoComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-user-info", template: `
    <div
      class="parent-user-info-container"
      [style.visibility]="userService.showUserInfo ? 'visible' : 'hidden'"
      [style.left.px]="userService.previewX"
      [style.top.px]="userService.previewY"
      [style.width.px]="350"
    >
      <div class="user-info">
        <div class="user-image">
          <img
            [style.width.px]="82"
            [style.height.px]="82"
            *ngIf="userService?.currentUser?.picture"
            src="data:image/jpeg;base64,{{ userService?.currentUser?.picture }}"
            alt=""
          />
          <div
            *ngIf="!userService?.currentUser?.picture"
            class="custom-image"
            [style.background-color]="userService.getBackground(userService.currentUser)"
          >
            <span [style.margin-top.px]="11">{{
              userService.currentUser
                ? (userService.currentUser.firstName ? userService.currentUser.firstName[0] : "") +
                  (userService.currentUser.lastName ? userService.currentUser.lastName[0] : "")
                : "MC"
            }}</span>
          </div>
        </div>
        <div class="info">
          <span [style.font-size.px]="18" [style.font-weight]="'bold'">{{
            userService.currentUser
              ? (userService.currentUser.firstName ? userService.currentUser.firstName : "") +
                " " +
                (userService.currentUser.lastName ? userService.currentUser.lastName : "")
              : "My1 Company"
          }}</span>
          <span>{{
            userService.currentUser
              ? userService.currentUser.userName
                ? userService.currentUser.userName
                : ""
              : userInfo.mail
          }}</span>
          <span class="link" (click)="setEvent('Cloud')">{{ loc.get2("Cloud", "Cloud") }}</span>
          <span class="link" (click)="setEvent('Account')">{{ loc.get2("Cloud", "Account") }}</span>
        </div>
      </div>
      <div class="logout">
        <div class="logout-button" (click)="setEvent('Logout')">
          <span>{{ loc.get2("Cloud", "ButtonLogout") }}</span>
        </div>
      </div>
    </div>
  `, styles: [".parent-user-info-container{position:absolute;z-index:999;background-color:var(--back-color);-webkit-touch-callout:none;-webkit-user-select:none;height:max-content;padding:1px;border:1px solid #c6c6c6;border-radius:3px;overflow:hidden;font-family:Segoe UI;box-shadow:0 0 7px #0000004d}.user-info{height:100%;width:100%;display:flex;overflow:hidden}.info{display:flex;flex-direction:column;font-size:13px;align-items:start;justify-content:center}.info span{margin:3px}.user-image{padding:15px}.user-image img{border-radius:40px}.logout{width:100%;height:60px;display:flex;justify-content:flex-end;align-items:flex-end;padding:10px}.logout-button{height:24px;min-width:60px;background-color:#3d6bba;display:flex;align-items:center;justify-content:center;font-size:13px;padding:0 10px;color:#fff}.logout-button:hover{background-color:#4377d0}.link{color:#5a83ad;border-bottom:1px solid transparent}.link:hover{border-color:#5a83ad}span{width:max-content}.custom-image{height:82px;width:82px;border-radius:40px;margin:0 5px;color:#fff;font-size:42px;display:flex;justify-content:center}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHttpClientService }, { type: StiUserService }, { type: StiLocalizationService }] });

class StiTrialBarComponent {
    constructor(loc, model) {
        this.loc = loc;
        this.model = model;
    }
    ngOnInit() { }
    upgradeClick() {
        window.open("https://www.stimulsoft.com/en/online-store#embedded/forms/web", "_blank");
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTrialBarComponent, deps: [{ token: StiLocalizationService }, { token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTrialBarComponent, selector: "sti-trial-bar", ngImport: i0, template: `
    <div class="trial-bar">
      <div class="close-button" *ngIf="!model.disableCloseButton" (click)="model.showTrialBar = !model.showTrialBar">
        <img [style.width.px]="16" [style.height.px]="16" [src]="model.getImage('images.Other.CloseForm.png')" alt="" />
      </div>
      <div class="trial-info">
        <span>{{
          "You are using the trial version of Stimulsoft PDF Forms. To use the software in production you should purchase a license."
        }}</span>
      </div>
      <div class="trial-update-button" (click)="upgradeClick()">
        <span>{{ loc.getP("Upgrade") }}</span>
      </div>
    </div>
  `, isInline: true, styles: [".trial-bar{width:100%;height:30px;background-color:#fbf4e1;display:flex;align-items:center;font-size:12px;font-family:Arial}.trial-info{width:100%;padding-left:12px}.close-button{margin-left:12px;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:3px}.close-button:hover{background-color:#dadada}.trial-update-button{display:flex;align-items:center;justify-content:center;border-radius:3px;margin:0 12px;height:24px;width:80px;background-color:#ddd}.trial-update-button:hover{background-color:#d5d5d5}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTrialBarComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-trial-bar", template: `
    <div class="trial-bar">
      <div class="close-button" *ngIf="!model.disableCloseButton" (click)="model.showTrialBar = !model.showTrialBar">
        <img [style.width.px]="16" [style.height.px]="16" [src]="model.getImage('images.Other.CloseForm.png')" alt="" />
      </div>
      <div class="trial-info">
        <span>{{
          "You are using the trial version of Stimulsoft PDF Forms. To use the software in production you should purchase a license."
        }}</span>
      </div>
      <div class="trial-update-button" (click)="upgradeClick()">
        <span>{{ loc.getP("Upgrade") }}</span>
      </div>
    </div>
  `, styles: [".trial-bar{width:100%;height:30px;background-color:#fbf4e1;display:flex;align-items:center;font-size:12px;font-family:Arial}.trial-info{width:100%;padding-left:12px}.close-button{margin-left:12px;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:3px}.close-button:hover{background-color:#dadada}.trial-update-button{display:flex;align-items:center;justify-content:center;border-radius:3px;margin:0 12px;height:24px;width:80px;background-color:#ddd}.trial-update-button:hover{background-color:#d5d5d5}\n"] }]
        }], ctorParameters: () => [{ type: StiLocalizationService }, { type: StiModelService }] });

class StiTrialModalWindowComponent {
    constructor(loc, model, userService, httpService) {
        this.loc = loc;
        this.model = model;
        this.userService = userService;
        this.httpService = httpService;
    }
    upgradeClick() {
        if (this.model.canCloseTrialWindow) {
            this.model.showTrialModalWindow = !this.model.showTrialModalWindow;
        }
        else {
            if (this.model.isWebView) {
                this.httpService
                    .post("", {
                    action: "InterfaceEvent",
                    event: "ExpiredTrialButtonClick",
                    data: { message: this.userService.trialMessage },
                })
                    .subscribe(() => { });
            }
            else {
                window.location.href = "https://www.stimulsoft.com/en/online-store#embedded/forms/ultimate";
            }
        }
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTrialModalWindowComponent, deps: [{ token: StiLocalizationService }, { token: StiModelService }, { token: StiUserService }, { token: StiHttpClientService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTrialModalWindowComponent, selector: "sti-trial-modal-window", ngImport: i0, template: `
    <div class="trial-modal">
      <div class="trial-navigation">
        <div class="designer-info">
          <span>{{ loc.getP("Designer") }}</span>
        </div>
        <div class="close-button" (click)="upgradeClick()">
          <i class="pi pi-times"></i>
        </div>
      </div>
      <div class="trial-info">
        <div class="trial-image">
          <img class="warning-image" [src]="model.getImage('images.Other.Warning.png')" alt="" />
        </div>
        <div class="trial-alert">
          <span>{{ loc.getP(userService.trialMessage) }}</span>
        </div>
      </div>
      <div class="close-container">
        <div class="agree-button" (click)="upgradeClick()">
          <span>{{ loc.get2("Buttons", "Ok").replace("&amp", "").replace(";", "") }}</span>
        </div>
      </div>
    </div>
  `, isInline: true, styles: [".pi{font-size:.825rem;color:var(--text-color)}.trial-modal{cursor:default;z-index:9999;width:550px;height:290px;position:absolute;left:calc(50% - 225px);top:calc(50% - 145px);display:flex;flex-direction:column;border:1px solid rgb(28,71,134);background-color:#fff;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d}.trial-navigation{width:100%;height:31px;display:flex}.designer-info{padding-left:15px;width:100%;height:100%;display:flex;align-items:center;justify-content:start}.designer-info span{font-size:15px;font-weight:700;color:#1c4786}.close-button{height:24px;width:28px;display:flex;align-items:center;justify-content:center}.close-button img{height:16px;width:16px}.close-button:hover{background-color:#dadada}.trial-info{height:173px;width:100%;display:flex;flex-direction:column}.trial-image{height:132px;display:flex;align-items:center;justify-content:center}.warning-image{width:112px;height:112px}.trial-alert{display:flex;align-items:center;justify-content:center;flex:1}.trial-alert span{font-size:16px;color:#1c4786}.close-container{display:flex;width:100%;justify-content:center;flex:1;padding-top:20px}.agree-button{width:200px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:3px;background-color:#1c4786}.agree-button:hover{background-color:#3b629b}.agree-button span{color:#fff;font-size:14px}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTrialModalWindowComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-trial-modal-window", template: `
    <div class="trial-modal">
      <div class="trial-navigation">
        <div class="designer-info">
          <span>{{ loc.getP("Designer") }}</span>
        </div>
        <div class="close-button" (click)="upgradeClick()">
          <i class="pi pi-times"></i>
        </div>
      </div>
      <div class="trial-info">
        <div class="trial-image">
          <img class="warning-image" [src]="model.getImage('images.Other.Warning.png')" alt="" />
        </div>
        <div class="trial-alert">
          <span>{{ loc.getP(userService.trialMessage) }}</span>
        </div>
      </div>
      <div class="close-container">
        <div class="agree-button" (click)="upgradeClick()">
          <span>{{ loc.get2("Buttons", "Ok").replace("&amp", "").replace(";", "") }}</span>
        </div>
      </div>
    </div>
  `, styles: [".pi{font-size:.825rem;color:var(--text-color)}.trial-modal{cursor:default;z-index:9999;width:550px;height:290px;position:absolute;left:calc(50% - 225px);top:calc(50% - 145px);display:flex;flex-direction:column;border:1px solid rgb(28,71,134);background-color:#fff;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d}.trial-navigation{width:100%;height:31px;display:flex}.designer-info{padding-left:15px;width:100%;height:100%;display:flex;align-items:center;justify-content:start}.designer-info span{font-size:15px;font-weight:700;color:#1c4786}.close-button{height:24px;width:28px;display:flex;align-items:center;justify-content:center}.close-button img{height:16px;width:16px}.close-button:hover{background-color:#dadada}.trial-info{height:173px;width:100%;display:flex;flex-direction:column}.trial-image{height:132px;display:flex;align-items:center;justify-content:center}.warning-image{width:112px;height:112px}.trial-alert{display:flex;align-items:center;justify-content:center;flex:1}.trial-alert span{font-size:16px;color:#1c4786}.close-container{display:flex;width:100%;justify-content:center;flex:1;padding-top:20px}.agree-button{width:200px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:3px;background-color:#1c4786}.agree-button:hover{background-color:#3b629b}.agree-button span{color:#fff;font-size:14px}\n"] }]
        }], ctorParameters: () => [{ type: StiLocalizationService }, { type: StiModelService }, { type: StiUserService }, { type: StiHttpClientService }] });

class StiFileNewContentComponent {
    constructor(model, undoService) {
        this.model = model;
        this.undoService = undoService;
        this.blankForm = "Blank Form";
    }
    createNew() {
        this.model.form.attachedFiles = [];
        this.model.ribbon = "Home";
        if (this.model.currentFormState &&
            this.model.currentFormState !== this.model.lastSavedFormState &&
            this.undoService.undos.length > 1) {
            this.model.showSaveDialog = true;
            this.model.saveDialogFromNew = true;
            this.model.saveDialogFromOpen = false;
        }
        else {
            let form = new StiForm();
            this.model.form = form;
        }
        this.model.formEvents.next({ name: "New" });
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFileNewContentComponent, deps: [{ token: StiModelService }, { token: StiUndoService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiFileNewContentComponent, selector: "sti-file-new-content", ngImport: i0, template: `
    <div class="file-new-container">
      <div class="file-new-navigation" (click)="createNew()">
        <div>
          <img [src]="model.getImage('images.Other.BlankReport.png')" alt="" />
        </div>
        <span>{{ blankForm }} </span>
      </div>
      <div class="divider"></div>
    </div>
  `, isInline: true, styles: [".file-new-container{width:100%;height:100%;padding-left:20px;background-color:#fff;-webkit-user-select:none}.file-new-navigation{height:250px;width:200px;display:flex;flex-direction:column;justify-content:center;align-items:center}.file-new-navigation:hover{background-color:#dadada}.file-new-navigation img{height:203px;width:144px}.divider{margin:20px 0;height:1px;width:calc(100% - 20px);background-color:#c6c6c6}img{margin:12px 12px 0}span{height:25px;font-family:Arial;font-size:12px;display:flex;align-items:flex-end}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFileNewContentComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-file-new-content", template: `
    <div class="file-new-container">
      <div class="file-new-navigation" (click)="createNew()">
        <div>
          <img [src]="model.getImage('images.Other.BlankReport.png')" alt="" />
        </div>
        <span>{{ blankForm }} </span>
      </div>
      <div class="divider"></div>
    </div>
  `, styles: [".file-new-container{width:100%;height:100%;padding-left:20px;background-color:#fff;-webkit-user-select:none}.file-new-navigation{height:250px;width:200px;display:flex;flex-direction:column;justify-content:center;align-items:center}.file-new-navigation:hover{background-color:#dadada}.file-new-navigation img{height:203px;width:144px}.divider{margin:20px 0;height:1px;width:calc(100% - 20px);background-color:#c6c6c6}img{margin:12px 12px 0}span{height:25px;font-family:Arial;font-size:12px;display:flex;align-items:flex-end}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiUndoService }] });

class StiFileOpenContentComponent {
    constructor(model, undoService) {
        this.model = model;
        this.undoService = undoService;
        this.browse = StiLocalizationService.get("ReportOpen", "Browse");
    }
    open() {
        this.model.form.attachedFiles = [];
        this.model.ribbon = "Home";
        if (this.model.currentFormState &&
            this.model.currentFormState !== this.model.lastSavedFormState &&
            this.undoService.undos.length >= 2) {
            this.model.showSaveDialog = true;
            this.model.saveDialogFromNew = false;
            this.model.saveDialogFromOpen = true;
        }
        else {
            this.model.interfaceEvent.next({ name: "FormOpen" });
        }
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFileOpenContentComponent, deps: [{ token: StiModelService }, { token: StiUndoService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiFileOpenContentComponent, selector: "sti-file-open-content", ngImport: i0, template: `
    <div class="file-open-container">
      <div class="file-open-navigation">
        <div class="navigation-item" (click)="open()">
          <div class="navigation-icon">
            <img [src]="model.getImage('images.Other.FileMenu.Open.png')" alt="" />
          </div>
          <span>{{ browse }}</span>
        </div>
      </div>
    </div>
  `, isInline: true, styles: [".file-open-container{height:100%;width:100%;display:flex;padding:10px 30px}.file-open-navigation{width:260px;border-right:1px solid rgb(218,218,218)}.navigation-item{display:flex;height:50px;width:250px;background-color:#fff;border-radius:3px}.navigation-item:hover{background-color:#dadada}.navigation-icon{padding:0 10px;display:flex;align-items:center;justify-content:center}img{width:32px;height:32px}span{height:100%;padding:0 20px 0 10px;display:flex;align-items:center;font-size:12px;font-family:Arial;cursor:default}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFileOpenContentComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-file-open-content", template: `
    <div class="file-open-container">
      <div class="file-open-navigation">
        <div class="navigation-item" (click)="open()">
          <div class="navigation-icon">
            <img [src]="model.getImage('images.Other.FileMenu.Open.png')" alt="" />
          </div>
          <span>{{ browse }}</span>
        </div>
      </div>
    </div>
  `, styles: [".file-open-container{height:100%;width:100%;display:flex;padding:10px 30px}.file-open-navigation{width:260px;border-right:1px solid rgb(218,218,218)}.navigation-item{display:flex;height:50px;width:250px;background-color:#fff;border-radius:3px}.navigation-item:hover{background-color:#dadada}.navigation-icon{padding:0 10px;display:flex;align-items:center;justify-content:center}img{width:32px;height:32px}span{height:100%;padding:0 20px 0 10px;display:flex;align-items:center;font-size:12px;font-family:Arial;cursor:default}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiUndoService }] });

class StiFileSaveContentComponent {
    constructor(model, helper, loc, cdr) {
        this.model = model;
        this.helper = helper;
        this.loc = loc;
        this.cdr = cdr;
        this.name = StiLocalizationService.get("PropertyMain", "Name");
        this.save = StiLocalizationService.get("PropertyMain", "Save");
        this.cancel = StiLocalizationService.get("PropertyMain", "Cancel");
        this.browse = StiLocalizationService.get("ReportOpen", "Browse");
        this.isSmallWindow = false;
    }
    ngAfterViewInit() {
        let element = document.getElementsByClassName("file-save-container")[0];
        let isSmall = element ? element.clientWidth < 450 : window.innerWidth < 450 + 170;
        if (isSmall != this.isSmallWindow) {
            this.isSmallWindow = isSmall;
            this.cdr.detach();
            setTimeout(() => {
                this.cdr.reattach();
            });
        }
    }
    close() {
        this.model.ribbon = "Home";
    }
    saveFile() {
        this.model.saveLastFormState();
        this.model.ribbon = "Home";
        this.model.interfaceEvent.next({ name: "FormSaveAs", data: { form: this.model.form, name: this.model.fileName } });
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFileSaveContentComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiLocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiFileSaveContentComponent, selector: "sti-file-save-content", ngImport: i0, template: `
    <div class="{{ isSmallWindow ? 'small-file-save-container' : 'file-save-container' }}">
      <div class="{{ isSmallWindow ? 'small-file-save-navigation' : 'file-save-navigation' }}">
        <div class="navigation-item">
          <div class="navigation-icon">
            <img [src]="model.getImage('images.Other.FileMenu.Open.png')" alt="" />
          </div>
          <span>{{ browse }}</span>
        </div>
      </div>
      <div class="content">
        <div class="{{ isSmallWindow ? 'small-save-container' : 'save-container' }}">
          <!-- <div class="save-container-navigation">
            <label>{{
              model.currentSelectedFileOption != "SaveAs"
                ? loc.getP(model.currentSelectedFileOption)
                : loc.get2("MainMenu", "menuFileSaveAs").replace("...", "")
            }}</label>
            <div class="close-button" (click)="close()">
              <img [src]="model.getImage('images.Other.ClosePanel.png')" alt="" />
            </div>
          </div> -->
          <div class="save-input">
            <span>{{ name }}</span>
            <input type="text" spellcheck="false" [(ngModel)]="model.fileName" />
          </div>
          <div class="save-buttons-container">
            <div class="button accept" (click)="saveFile()">
              <span>{{ save }}</span>
            </div>
            <!-- <div class="button cancel" (click)="close()">
              <span>{{ cancel }}</span>
            </div> -->
          </div>
        </div>
      </div>
    </div>
  `, isInline: true, styles: [".content{width:100%}.file-save-container{height:100%;width:100%;display:flex;padding:10px 30px}.small-file-save-container{height:100%;width:100%;display:flex;padding:10px 30px;flex-direction:column;align-items:center;border-right:1px solid rgb(218,218,218)}.file-save-navigation{min-width:150px;width:50%;max-width:260px;padding-right:10px;border-right:1px solid rgb(218,218,218)}.small-file-save-navigation{min-width:150px;width:100%;max-width:260px}.navigation-item{display:flex;height:50px;min-width:130px;background-color:#e5e5e5;border-radius:3px}.navigation-item:hover{background-color:#dadada}.navigation-icon{padding:0 10px;display:flex;align-items:center;justify-content:center}.save-container{max-width:500px;height:50px;background-color:#fff;margin-left:10px;display:flex;align-items:center}.small-save-container{max-width:500px;height:50px;background-color:#fff;margin-top:20px;display:flex;align-items:center}img{width:32px;height:32px}span{height:100%;padding:0 20px 0 10px;display:flex;align-items:center;font-size:12px;font-family:Arial;cursor:default}label{font-size:13px;font-weight:700;color:#19478a;font-family:Arial;flex:1;padding-left:15px}.save-container-navigation{height:30px;width:100%;display:flex;align-items:center}.close-button{width:28px;height:28px;border-radius:3px;display:flex;align-items:center;justify-content:center}.close-button:hover{background-color:#dadada}.close-button img{width:16px;height:16px}.save-input{display:flex;align-items:center;flex:1;padding:0 10px}.save-input input{width:100%;height:24px;border:1px solid rgb(171,171,171);background-color:#fff;color:#444;font-size:12px;border-radius:3px;padding:0 0 0 4px;outline:none}.save-buttons-container{height:58px;width:fit-content;display:flex;align-items:center;justify-content:flex-end}.button{width:80px;height:24px;border-radius:3px;display:flex;align-items:center;justify-content:center;margin:0 10px}.button span{margin:0;padding:0}.accept{background-color:#19478a;color:#fff;margin-right:0}.accept:hover{background-color:#3d6298}.cancel{background-color:#ddd;color:#444}.cancel:hover{background-color:#d5d5d5}\n"], dependencies: [{ kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFileSaveContentComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-file-save-content", template: `
    <div class="{{ isSmallWindow ? 'small-file-save-container' : 'file-save-container' }}">
      <div class="{{ isSmallWindow ? 'small-file-save-navigation' : 'file-save-navigation' }}">
        <div class="navigation-item">
          <div class="navigation-icon">
            <img [src]="model.getImage('images.Other.FileMenu.Open.png')" alt="" />
          </div>
          <span>{{ browse }}</span>
        </div>
      </div>
      <div class="content">
        <div class="{{ isSmallWindow ? 'small-save-container' : 'save-container' }}">
          <!-- <div class="save-container-navigation">
            <label>{{
              model.currentSelectedFileOption != "SaveAs"
                ? loc.getP(model.currentSelectedFileOption)
                : loc.get2("MainMenu", "menuFileSaveAs").replace("...", "")
            }}</label>
            <div class="close-button" (click)="close()">
              <img [src]="model.getImage('images.Other.ClosePanel.png')" alt="" />
            </div>
          </div> -->
          <div class="save-input">
            <span>{{ name }}</span>
            <input type="text" spellcheck="false" [(ngModel)]="model.fileName" />
          </div>
          <div class="save-buttons-container">
            <div class="button accept" (click)="saveFile()">
              <span>{{ save }}</span>
            </div>
            <!-- <div class="button cancel" (click)="close()">
              <span>{{ cancel }}</span>
            </div> -->
          </div>
        </div>
      </div>
    </div>
  `, styles: [".content{width:100%}.file-save-container{height:100%;width:100%;display:flex;padding:10px 30px}.small-file-save-container{height:100%;width:100%;display:flex;padding:10px 30px;flex-direction:column;align-items:center;border-right:1px solid rgb(218,218,218)}.file-save-navigation{min-width:150px;width:50%;max-width:260px;padding-right:10px;border-right:1px solid rgb(218,218,218)}.small-file-save-navigation{min-width:150px;width:100%;max-width:260px}.navigation-item{display:flex;height:50px;min-width:130px;background-color:#e5e5e5;border-radius:3px}.navigation-item:hover{background-color:#dadada}.navigation-icon{padding:0 10px;display:flex;align-items:center;justify-content:center}.save-container{max-width:500px;height:50px;background-color:#fff;margin-left:10px;display:flex;align-items:center}.small-save-container{max-width:500px;height:50px;background-color:#fff;margin-top:20px;display:flex;align-items:center}img{width:32px;height:32px}span{height:100%;padding:0 20px 0 10px;display:flex;align-items:center;font-size:12px;font-family:Arial;cursor:default}label{font-size:13px;font-weight:700;color:#19478a;font-family:Arial;flex:1;padding-left:15px}.save-container-navigation{height:30px;width:100%;display:flex;align-items:center}.close-button{width:28px;height:28px;border-radius:3px;display:flex;align-items:center;justify-content:center}.close-button:hover{background-color:#dadada}.close-button img{width:16px;height:16px}.save-input{display:flex;align-items:center;flex:1;padding:0 10px}.save-input input{width:100%;height:24px;border:1px solid rgb(171,171,171);background-color:#fff;color:#444;font-size:12px;border-radius:3px;padding:0 0 0 4px;outline:none}.save-buttons-container{height:58px;width:fit-content;display:flex;align-items:center;justify-content:flex-end}.button{width:80px;height:24px;border-radius:3px;display:flex;align-items:center;justify-content:center;margin:0 10px}.button span{margin:0;padding:0}.accept{background-color:#19478a;color:#fff;margin-right:0}.accept:hover{background-color:#3d6298}.cancel{background-color:#ddd;color:#444}.cancel:hover{background-color:#d5d5d5}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiLocalizationService }, { type: i0.ChangeDetectorRef }] });

class StiFileMenuContentComponent {
    constructor(model, loc) {
        this.model = model;
        this.loc = loc;
    }
    isCurrent(content) {
        return content == this.model.currentSelectedFileOption ? true : false;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFileMenuContentComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiFileMenuContentComponent, selector: "sti-file-menu-content", ngImport: i0, template: ` <div class="file-menu-container">
    <div class="current-option-label">
      <span>{{
        model.currentSelectedFileOption != "SaveAs"
          ? loc.getP(model.currentSelectedFileOption)
          : loc.get2("MainMenu", "menuFileSaveAs").replace("...", "")
      }}</span>
    </div>
    <sti-file-new-content *ngIf="isCurrent('New')"></sti-file-new-content>
    <sti-file-open-content *ngIf="isCurrent('Open')"></sti-file-open-content>
    <sti-file-save-content *ngIf="isCurrent('SaveAs')"></sti-file-save-content>
  </div>`, isInline: true, styles: ["sti-file-new-content,sti-file-open-content,sti-file-save-content{height:100%;width:100%}.file-menu-container{height:100%;width:100%;background-color:#fff;display:flex;flex-direction:column}.current-option-label{padding:30px;width:100%}.current-option-label span{font-size:36px;font-family:Arial;color:#8f8f8f}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiFileNewContentComponent, selector: "sti-file-new-content" }, { kind: "component", type: StiFileOpenContentComponent, selector: "sti-file-open-content" }, { kind: "component", type: StiFileSaveContentComponent, selector: "sti-file-save-content" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFileMenuContentComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-file-menu-content", template: ` <div class="file-menu-container">
    <div class="current-option-label">
      <span>{{
        model.currentSelectedFileOption != "SaveAs"
          ? loc.getP(model.currentSelectedFileOption)
          : loc.get2("MainMenu", "menuFileSaveAs").replace("...", "")
      }}</span>
    </div>
    <sti-file-new-content *ngIf="isCurrent('New')"></sti-file-new-content>
    <sti-file-open-content *ngIf="isCurrent('Open')"></sti-file-open-content>
    <sti-file-save-content *ngIf="isCurrent('SaveAs')"></sti-file-save-content>
  </div>`, styles: ["sti-file-new-content,sti-file-open-content,sti-file-save-content{height:100%;width:100%}.file-menu-container{height:100%;width:100%;background-color:#fff;display:flex;flex-direction:column}.current-option-label{padding:30px;width:100%}.current-option-label span{font-size:36px;font-family:Arial;color:#8f8f8f}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }] });

class StiFileMenuComponent {
    constructor() { }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFileMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiFileMenuComponent, selector: "sti-file-menu", ngImport: i0, template: `
    <div class="file-menu">
      <div class="shadow-file-menu"></div>
      <sti-file-menu-content></sti-file-menu-content>
    </div>
  `, isInline: true, styles: [".file-menu{position:absolute;left:0;top:0;height:inherit;width:inherit;z-index:9999999;background-color:#fff;display:flex;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none}.shadow-file-menu{min-width:170px;height:100%}sti-file-menu-content{width:100%}\n"], dependencies: [{ kind: "component", type: StiFileMenuContentComponent, selector: "sti-file-menu-content" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFileMenuComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-file-menu", template: `
    <div class="file-menu">
      <div class="shadow-file-menu"></div>
      <sti-file-menu-content></sti-file-menu-content>
    </div>
  `, styles: [".file-menu{position:absolute;left:0;top:0;height:inherit;width:inherit;z-index:9999999;background-color:#fff;display:flex;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none}.shadow-file-menu{min-width:170px;height:100%}sti-file-menu-content{width:100%}\n"] }]
        }], ctorParameters: () => [] });

class StiFileMenuNavigationComponent {
    constructor(model, helper) {
        this.model = model;
        this.helper = helper;
    }
    setEvent(name) {
        if (name == "About") {
            this.model.ribbon = "Home";
            this.model.showAboutWindow = true;
        }
        else if (name == "Save") {
            this.model.saveLastFormState();
            this.model.ribbon = "Home";
            this.model.interfaceEvent.next({ name: "FormSave", data: { form: this.model.form, name: this.model.fileName } });
        }
        else if (name == "SaveAs" || name == "Open" || name == "New") {
            this.model.currentSelectedFileOption = name;
        }
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFileMenuNavigationComponent, deps: [{ token: StiModelService }, { token: StiHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiFileMenuNavigationComponent, selector: "sti-file-menu-navigation", ngImport: i0, template: `<div [@fileNavigation]="model.fileMenuMode ? 'in' : 'out'" class="file-navigation">
    <div class="back-button-container">
      <div class="back-button" (click)="model.ribbon = 'Home'">
        <img [src]="model.getImage('images.Other.Back.png')" />
      </div>
    </div>
    <div class="option {{ item.name == 'Divider' ? 'divider-container' : '' }} {{item.name == model.currentSelectedFileOption ? 'current' : ''}}"
      *ngFor="let item of helper.fileMenuItems"
      (click)="setEvent(item.name)">
      <div class="item" *ngIf="item.name != 'Divider'">
        <div class="image-container" [style.min-height.px]="36">
          <img *ngIf="item.image" [src]="model.getImage(item.image)" />
        </div>
        <span>{{ item.caption }}</span>
      </div>
      <div class="divider" *ngIf="item.name == 'Divider'"></div>
    </div>
  </div>`, isInline: true, styles: [".file-navigation{-webkit-user-select:none;width:0px;height:inherit;background-color:#19478a;z-index:99999999;position:absolute;top:0;left:0}.back-button{padding:20px 0 0 9px}.back-button img{width:32px;height:32px;opacity:1}.back-button img:hover{opacity:.7}.divider{height:1px;width:100%;border:0;background-color:#fff}.divider-container{padding:5px 25px!important;pointer-events:none}.option{width:100%;height:max-content;padding:3px 0}.option:hover{background-color:#3d6298}.item{display:flex;width:100%;align-items:center}.image-container{width:50px;text-align:center}.current{background-color:#11315f}img{height:32px;width:32px}span{color:#fff;font-size:12px;font-family:Arial;cursor:default;white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [fileNavigationAnimation] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFileMenuNavigationComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-file-menu-navigation", template: `<div [@fileNavigation]="model.fileMenuMode ? 'in' : 'out'" class="file-navigation">
    <div class="back-button-container">
      <div class="back-button" (click)="model.ribbon = 'Home'">
        <img [src]="model.getImage('images.Other.Back.png')" />
      </div>
    </div>
    <div class="option {{ item.name == 'Divider' ? 'divider-container' : '' }} {{item.name == model.currentSelectedFileOption ? 'current' : ''}}"
      *ngFor="let item of helper.fileMenuItems"
      (click)="setEvent(item.name)">
      <div class="item" *ngIf="item.name != 'Divider'">
        <div class="image-container" [style.min-height.px]="36">
          <img *ngIf="item.image" [src]="model.getImage(item.image)" />
        </div>
        <span>{{ item.caption }}</span>
      </div>
      <div class="divider" *ngIf="item.name == 'Divider'"></div>
    </div>
  </div>`, animations: [fileNavigationAnimation], styles: [".file-navigation{-webkit-user-select:none;width:0px;height:inherit;background-color:#19478a;z-index:99999999;position:absolute;top:0;left:0}.back-button{padding:20px 0 0 9px}.back-button img{width:32px;height:32px;opacity:1}.back-button img:hover{opacity:.7}.divider{height:1px;width:100%;border:0;background-color:#fff}.divider-container{padding:5px 25px!important;pointer-events:none}.option{width:100%;height:max-content;padding:3px 0}.option:hover{background-color:#3d6298}.item{display:flex;width:100%;align-items:center}.image-container{width:50px;text-align:center}.current{background-color:#11315f}img{height:32px;width:32px}span{color:#fff;font-size:12px;font-family:Arial;cursor:default;white-space:nowrap}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }] });

class StiFileSaveDialogComponent {
    get question() {
        return this.model.showSaveDialog
            ? StiLocalizationService.get("Questions", "qnSaveChanges").replace("{0}", StiLocalizationService.get("Dialogs", "StiForm"))
            : "Would you like to save the form to Stimulsoft Cloud?";
    }
    constructor(model, httpService, exportService) {
        this.model = model;
        this.httpService = httpService;
        this.exportService = exportService;
        this.designer = StiLocalizationService.get("Permissions", "ItemForms");
        this.yes = StiLocalizationService.get("PropertyMain", "Yes");
        this.no = StiLocalizationService.get("PropertyMain", "No");
        this.cancel = StiLocalizationService.get("PropertyMain", "Cancel");
    }
    close(option) {
        if (this.model.showSaveDialog) {
            this.model.showSaveDialog = false;
            if (option === "No") {
                if (this.model.saveDialogFromNew) {
                    this.model.interfaceEvent.next({ name: "FormNew" });
                }
                else if (this.model.saveDialogFromOpen) {
                    this.model.interfaceEvent.next({ name: "FormOpen" });
                }
            }
        }
        else {
            this.model.showSaveDialogFromCloud = false;
            if (option === "No") {
                this.exportService.showModalWindow = !this.exportService.showModalWindow;
            }
        }
    }
    save() {
        if (this.model.showSaveDialog) {
            this.model.form.attachedFiles = [];
            this.model.saveLastFormState();
            this.model.interfaceEvent.next({ name: "FormSave", data: { form: this.model.form, name: this.model.fileName } });
            this.model.showSaveDialog = false;
            if (this.model.saveDialogFromNew) {
                this.model.interfaceEvent.next({ name: "FormNew" });
            }
            else if (this.model.saveDialogFromOpen) {
                this.model.interfaceEvent.next({ name: "FormOpen" });
            }
        }
        else {
            let currentForm = this.model.form.saveToReportJsonObject().serialize();
            this.httpService
                .post("", { action: "InterfaceEvent", event: "SaveToCloudButtonClick", data: { form: currentForm } })
                .subscribe(() => { });
            this.model.showSaveDialogFromCloud = false;
        }
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFileSaveDialogComponent, deps: [{ token: StiModelService }, { token: StiHttpClientService }, { token: StiExportService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiFileSaveDialogComponent, selector: "sti-file-save-dialog", ngImport: i0, template: `<div class="save-dialog">
    <div class="save-dialog-navigation">
      <label>{{ designer }}</label>
      <div class="close-button" (click)="close('Cancel')">
        <img [src]="model.getImage('images.Other.CloseForm.png')" alt="" />
      </div>
    </div>
    <div class="text-content">
      <img [src]="model.getImage('images.Other.Question.png')" />
      <span>{{ question }}</span>
    </div>
    <div class="buttons-container">
      <div class="button accept" (click)="save()">
        <span>{{ yes }}</span>
      </div>
      <div class="button cancel" (click)="close('No')">
        <span>{{ no }}</span>
      </div>
      <div class="button cancel" (click)="close('Cancel')" [style.margin-right.px]="10">
        <span>{{ cancel }}</span>
      </div>
    </div>
  </div>`, isInline: true, styles: [".save-dialog{width:500px;height:150px;position:absolute;z-index:9999999;left:calc(50% - 250px);top:calc(50% - 70px);background-color:#fff;cursor:default;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;border:1px solid rgb(25,71,138);display:flex;border-top-right-radius:5px;border-top-left-radius:5px;flex-direction:column;color:#444}.save-dialog-navigation{height:30px;width:100%;display:flex;align-items:center;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a;-webkit-user-select:none}.text-content{flex:1;padding:20px 10px;display:flex;align-items:center}.text-content span{font-size:13px;margin:12px 0}.text-content img{margin-left:10px;margin-right:10px;width:32px;height:32px}.close-button{width:28px;height:28px;border-radius:3px;display:flex;align-items:center;justify-content:center}.close-button:hover{background-color:#dadada}.close-button img{height:16px;width:16px;filter:brightness(0) invert(1)}label{font-size:13px;color:#fff;font-family:Arial;flex:1;display:flex;align-items:center;margin-left:10px}.buttons-container{height:50px;width:100%;display:flex;align-items:center;justify-content:flex-end}.button{width:80px;height:24px;border-radius:3px;display:flex;align-items:center;justify-content:center;margin:0 5px}span{height:100%;display:flex;align-items:center;font-size:12px;font-family:Arial;cursor:default}.accept{background-color:#19478a;color:#fff}.accept:hover{background-color:#3d6298}.cancel{background-color:#ddd;color:#444}.cancel:hover{background-color:#d5d5d5}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFileSaveDialogComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-file-save-dialog", template: `<div class="save-dialog">
    <div class="save-dialog-navigation">
      <label>{{ designer }}</label>
      <div class="close-button" (click)="close('Cancel')">
        <img [src]="model.getImage('images.Other.CloseForm.png')" alt="" />
      </div>
    </div>
    <div class="text-content">
      <img [src]="model.getImage('images.Other.Question.png')" />
      <span>{{ question }}</span>
    </div>
    <div class="buttons-container">
      <div class="button accept" (click)="save()">
        <span>{{ yes }}</span>
      </div>
      <div class="button cancel" (click)="close('No')">
        <span>{{ no }}</span>
      </div>
      <div class="button cancel" (click)="close('Cancel')" [style.margin-right.px]="10">
        <span>{{ cancel }}</span>
      </div>
    </div>
  </div>`, styles: [".save-dialog{width:500px;height:150px;position:absolute;z-index:9999999;left:calc(50% - 250px);top:calc(50% - 70px);background-color:#fff;cursor:default;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;border:1px solid rgb(25,71,138);display:flex;border-top-right-radius:5px;border-top-left-radius:5px;flex-direction:column;color:#444}.save-dialog-navigation{height:30px;width:100%;display:flex;align-items:center;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a;-webkit-user-select:none}.text-content{flex:1;padding:20px 10px;display:flex;align-items:center}.text-content span{font-size:13px;margin:12px 0}.text-content img{margin-left:10px;margin-right:10px;width:32px;height:32px}.close-button{width:28px;height:28px;border-radius:3px;display:flex;align-items:center;justify-content:center}.close-button:hover{background-color:#dadada}.close-button img{height:16px;width:16px;filter:brightness(0) invert(1)}label{font-size:13px;color:#fff;font-family:Arial;flex:1;display:flex;align-items:center;margin-left:10px}.buttons-container{height:50px;width:100%;display:flex;align-items:center;justify-content:flex-end}.button{width:80px;height:24px;border-radius:3px;display:flex;align-items:center;justify-content:center;margin:0 5px}span{height:100%;display:flex;align-items:center;font-size:12px;font-family:Arial;cursor:default}.accept{background-color:#19478a;color:#fff}.accept:hover{background-color:#3d6298}.cancel{background-color:#ddd;color:#444}.cancel:hover{background-color:#d5d5d5}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHttpClientService }, { type: StiExportService }] });

class StiButtonMessageWindowComponent {
    get left() {
        if (this.messageWindow) {
            return `calc(50% - ${this.windowWidth / 2}px)`;
        }
        else {
            return `calc(50% - 125px)`;
        }
    }
    get top() {
        if (this.messageWindow) {
            return `calc(50% - ${this.windowHeight / 2}px)`;
        }
        else {
            return `calc(50% - 65px)`;
        }
    }
    constructor(model, loc) {
        this.model = model;
        this.loc = loc;
        this.windowWidth = 250;
        this.windowHeight = 130;
    }
    retry() {
        this.model.showButtonMessageWindow = false;
        this.model.showErrorWindow = false;
        this.model.sendedFromButton = false;
        this.model.retryButtonRequest.next(this.model.currentUsedButtonElement);
    }
    ngAfterViewInit() {
        if (this.messageWindow) {
            this.windowWidth = this.messageWindow.nativeElement.offsetWidth;
            this.windowHeight = this.messageWindow.nativeElement.offsetHeight;
        }
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiButtonMessageWindowComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiButtonMessageWindowComponent, selector: "button-message-window", viewQueries: [{ propertyName: "messageWindow", first: true, predicate: ["messageWindow"], descendants: true }], ngImport: i0, template: `
    <div #messageWindow [style.left]="left" [style.top]="top" class="message-window">
      <div class="navigation">
        <div class="navigation-title">
          <span>{{ loc.get2("Permissions", "ItemForms") }}</span>
        </div>
        <div
          class="close-button"
          *ngIf="!model.showErrorWindow"
          (click)="model.showButtonMessageWindow = !model.showButtonMessageWindow"
        >
          <img [src]="model.getImage('images.Other.CloseForm.png')" />
        </div>
      </div>
      <div class="content">
        <span>{{ model.errorWindowMessage }}</span>
      </div>
      <div class="accept-container">
        <div
          class="accept button"
          *ngIf="!model.sendedFromButton"
          (click)="model.showButtonMessageWindow = false; model.showErrorWindow = false"
        >
          <span>{{ loc.get2("Buttons", "Ok").replace("&amp", "").replace(";", "") }}</span>
        </div>
        <div class="error button" *ngIf="model.sendedFromButton" (click)="retry()">
          <span>{{ loc.get2("PropertyEnum", "DialogResultRetry") }}</span>
        </div>
        <div
          class="error button"
          *ngIf="model.sendedFromButton"
          (click)="model.showButtonMessageWindow = false; model.showErrorWindow = false; model.sendedFromButton = false"
        >
          <span>{{ loc.get2("PropertyMain", "Cancel") }}</span>
        </div>
      </div>
    </div>
  `, isInline: true, styles: [".message-window{position:absolute;z-index:99999999;background-color:var(--back-color);border:1px solid rgb(25,71,138);min-width:250px;max-width:1000px;min-height:130px;max-height:1000px;top:calc(50% - 65px);display:flex;flex-direction:column;overflow:hidden;border-radius:5px;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d}.navigation{height:30px;width:100%;display:flex;justify-content:flex-end;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a}.navigation-title{flex:1;color:#fff;font-family:Arial;font-size:13px;display:flex;align-items:center;padding-left:10px;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none}.close-button{width:30px;height:100%;display:flex;align-items:center;justify-content:center}.close-button:hover{background-color:#d3d3d3}.close-button:active{background-color:var(--active-color)}.close-button img{height:16px;width:16px;filter:brightness(0) invert(1)}.content{width:100%;height:100%;flex:1;display:flex;align-items:center;justify-content:center;padding:10px}.content span{color:var(--text-color);font-size:12px;font-family:Segoe UI;word-wrap:break-word;cursor:default;-webkit-user-select:none;user-select:none}.accept-container{height:50px;width:100%;display:flex;justify-content:center;align-items:center}.accept{width:80px;height:30px}.error{width:70px;height:30px;margin:5px}.button{background-color:#19478a;color:#fff;border-radius:3px;display:flex;align-items:center;justify-content:center}.button:hover{background-color:#3d6298}.button span{font-size:12px;font-family:Segoe UI;cursor:default;-webkit-user-select:none;user-select:none}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiButtonMessageWindowComponent, decorators: [{
            type: Component,
            args: [{ selector: "button-message-window", template: `
    <div #messageWindow [style.left]="left" [style.top]="top" class="message-window">
      <div class="navigation">
        <div class="navigation-title">
          <span>{{ loc.get2("Permissions", "ItemForms") }}</span>
        </div>
        <div
          class="close-button"
          *ngIf="!model.showErrorWindow"
          (click)="model.showButtonMessageWindow = !model.showButtonMessageWindow"
        >
          <img [src]="model.getImage('images.Other.CloseForm.png')" />
        </div>
      </div>
      <div class="content">
        <span>{{ model.errorWindowMessage }}</span>
      </div>
      <div class="accept-container">
        <div
          class="accept button"
          *ngIf="!model.sendedFromButton"
          (click)="model.showButtonMessageWindow = false; model.showErrorWindow = false"
        >
          <span>{{ loc.get2("Buttons", "Ok").replace("&amp", "").replace(";", "") }}</span>
        </div>
        <div class="error button" *ngIf="model.sendedFromButton" (click)="retry()">
          <span>{{ loc.get2("PropertyEnum", "DialogResultRetry") }}</span>
        </div>
        <div
          class="error button"
          *ngIf="model.sendedFromButton"
          (click)="model.showButtonMessageWindow = false; model.showErrorWindow = false; model.sendedFromButton = false"
        >
          <span>{{ loc.get2("PropertyMain", "Cancel") }}</span>
        </div>
      </div>
    </div>
  `, styles: [".message-window{position:absolute;z-index:99999999;background-color:var(--back-color);border:1px solid rgb(25,71,138);min-width:250px;max-width:1000px;min-height:130px;max-height:1000px;top:calc(50% - 65px);display:flex;flex-direction:column;overflow:hidden;border-radius:5px;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d}.navigation{height:30px;width:100%;display:flex;justify-content:flex-end;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a}.navigation-title{flex:1;color:#fff;font-family:Arial;font-size:13px;display:flex;align-items:center;padding-left:10px;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none}.close-button{width:30px;height:100%;display:flex;align-items:center;justify-content:center}.close-button:hover{background-color:#d3d3d3}.close-button:active{background-color:var(--active-color)}.close-button img{height:16px;width:16px;filter:brightness(0) invert(1)}.content{width:100%;height:100%;flex:1;display:flex;align-items:center;justify-content:center;padding:10px}.content span{color:var(--text-color);font-size:12px;font-family:Segoe UI;word-wrap:break-word;cursor:default;-webkit-user-select:none;user-select:none}.accept-container{height:50px;width:100%;display:flex;justify-content:center;align-items:center}.accept{width:80px;height:30px}.error{width:70px;height:30px;margin:5px}.button{background-color:#19478a;color:#fff;border-radius:3px;display:flex;align-items:center;justify-content:center}.button:hover{background-color:#3d6298}.button span{font-size:12px;font-family:Segoe UI;cursor:default;-webkit-user-select:none;user-select:none}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }], propDecorators: { messageWindow: [{
                type: ViewChild,
                args: ["messageWindow"]
            }] } });

class StiCloudNavbarComponent {
    constructor() { }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiCloudNavbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiCloudNavbarComponent, selector: "sti-cloud-navbar", ngImport: i0, template: `<div class="cloud-navbar">
    <div [style.height]="'100%'" [style.width.px]="100">
      <svg
        version="1.1"
        id="Layer_1"
        xmlns="http://www.w3.org/2000/svg"
        xmlns:xlink="http://www.w3.org/1999/xlink"
        x="0px"
        y="0px"
        viewBox="0 0 2171 800"
        style="enable-background:new 0 0 2171 800;"
        xml:space="preserve"
      >
        <style type="text/css">
          .st0 {
            opacity: 0.9;
            fill: #5d7bae;
          }
          .st1 {
            opacity: 0.8;
            fill: #5da0df;
          }
          .st2 {
            fill: none;
          }
        </style>
        <title>logo_800</title>
        <polyline class="st0" points="1072.6,224.9 1424.1,224.9 1124.4,686 773.1,686 1072.6,224.9 1072.6,224.9 " />
        <polyline class="st1" points="1025.8,122.6 1377.3,122.6 1077.7,583.7 726.3,583.7 1025.8,122.6 1025.8,122.6 " />
        <g>
          <polyline points="352,333 316,333 316,440.8 269,511.9 269,333 211.2,333 211.2,297 375.8,297 	" />
          <line class="st2" x1="211.2" y1="404" x2="375.8" y2="404" />
          <polygon points="485.9,297.1 438.1,368 438.1,511.8 485.9,511.8 	" />
          <polygon
            points="562,510.9 562,297.1 622,297.1 682,428 743,297.1 803,297.1 803,511.8 755.1,511.8 755.1,369 682.1,500
		610.1,368.9 610.1,439.8 	"
          />
          <path
            d="M865,369l48-72v131.3c0,0,0,47.7,48.4,47.7s48.6-48.3,48.6-48.3V297h48v131.2c0,0,1.6,83.7-96.5,83.7S865,428.3,865,428.3
		V369z"
          />
          <polygon points="1127,297 1175,297 1175,476.9 1260.8,476.9 1237.1,511.9 1127,511.9 	" />
          <polygon
            points="1950.1,297.1 1950.1,332.9 1854,332.9 1854,381.1 1939.1,381.1 1914.3,415.9 1854,415.9 1854,512 1806.1,512
		1806.1,297.1 	"
          />
          <polygon
            points="2064.9,333 2006.1,333 2006.1,297.1 2171,297.1 2147.1,333 2111.9,333 2111.9,512 2065.1,512 	"
          />
          <path
            d="M1478.9,321.3l-24.5,35.8l-58.5-24l-2,0.1c0,0-21.8,1.5-21.8,22.5s33.9,32.5,33.9,32.5s30.8,7.9,50,24s22.1,27.5,22.1,39.8
		s-1.3,28.9-23,44.3s-53.3,15.8-59.4,15.8c-17.8,0.2-35.4-3.2-51.9-9.9c-25.1-10.1-30.9-13.8-30.9-13.8l23.9-36.1l58.5,23.9h6.3
		c0,0,29.5-1.1,29.5-23.1s-36.3-33-36.3-33s-42.6-10-59-32.6c-6.3-8.6-11-15.4-11-29.5s5.5-38.8,35.1-51.6c8.4-3.6,18.4-9,34.8-9
		s42.5,9.4,48.4,11.1S1478.9,321.3,1478.9,321.3z"
          />
          <path
            d="M141,356.8L82.5,333h-2.9c0,0-20.6,3.3-20.6,22.3s21.9,29.5,41.8,35.9s31.8,11.4,48.3,26s16,29.6,16,34.1
		s0.8,31.5-25.1,45.9c-25.9,14.4-47.8,14.8-56.4,14.8s-35.8-2.8-52.8-9.9S0,488.3,0,488.3l24.3-36l61.3,24.5h5.6
		c0,0,27.1-2.9,27.1-22.3s-18.1-28.9-42.4-36.5S12,393.1,12,357.9S45.1,297,82.5,297c25,0,82.5,23.9,82.5,23.9L141,356.8z"
          />
          <path
            d="M1642,299h-7.3c0,0-97.8,1.8-97.8,99.3v11.8c0,0-3.8,85.9,91.7,97.8c1.3,0.2,19.2,0,19.2,0s92.2-6.5,92.2-95.8
		S1693.7,304.7,1642,299z M1638.4,474c-31.3,0-56.6-31.3-56.6-70s25.3-70,56.6-70s56.6,31.3,56.6,70S1669.7,474,1638.4,474z"
          />
        </g>
      </svg>
    </div>
  </div>`, isInline: true, styles: [".cloud-navbar{height:38px;width:100%;z-index:99999999999;background:#fff;border-bottom:1px solid rgb(198,198,198);display:flex;align-items:center;justify-content:center}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiCloudNavbarComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-cloud-navbar", template: `<div class="cloud-navbar">
    <div [style.height]="'100%'" [style.width.px]="100">
      <svg
        version="1.1"
        id="Layer_1"
        xmlns="http://www.w3.org/2000/svg"
        xmlns:xlink="http://www.w3.org/1999/xlink"
        x="0px"
        y="0px"
        viewBox="0 0 2171 800"
        style="enable-background:new 0 0 2171 800;"
        xml:space="preserve"
      >
        <style type="text/css">
          .st0 {
            opacity: 0.9;
            fill: #5d7bae;
          }
          .st1 {
            opacity: 0.8;
            fill: #5da0df;
          }
          .st2 {
            fill: none;
          }
        </style>
        <title>logo_800</title>
        <polyline class="st0" points="1072.6,224.9 1424.1,224.9 1124.4,686 773.1,686 1072.6,224.9 1072.6,224.9 " />
        <polyline class="st1" points="1025.8,122.6 1377.3,122.6 1077.7,583.7 726.3,583.7 1025.8,122.6 1025.8,122.6 " />
        <g>
          <polyline points="352,333 316,333 316,440.8 269,511.9 269,333 211.2,333 211.2,297 375.8,297 	" />
          <line class="st2" x1="211.2" y1="404" x2="375.8" y2="404" />
          <polygon points="485.9,297.1 438.1,368 438.1,511.8 485.9,511.8 	" />
          <polygon
            points="562,510.9 562,297.1 622,297.1 682,428 743,297.1 803,297.1 803,511.8 755.1,511.8 755.1,369 682.1,500
		610.1,368.9 610.1,439.8 	"
          />
          <path
            d="M865,369l48-72v131.3c0,0,0,47.7,48.4,47.7s48.6-48.3,48.6-48.3V297h48v131.2c0,0,1.6,83.7-96.5,83.7S865,428.3,865,428.3
		V369z"
          />
          <polygon points="1127,297 1175,297 1175,476.9 1260.8,476.9 1237.1,511.9 1127,511.9 	" />
          <polygon
            points="1950.1,297.1 1950.1,332.9 1854,332.9 1854,381.1 1939.1,381.1 1914.3,415.9 1854,415.9 1854,512 1806.1,512
		1806.1,297.1 	"
          />
          <polygon
            points="2064.9,333 2006.1,333 2006.1,297.1 2171,297.1 2147.1,333 2111.9,333 2111.9,512 2065.1,512 	"
          />
          <path
            d="M1478.9,321.3l-24.5,35.8l-58.5-24l-2,0.1c0,0-21.8,1.5-21.8,22.5s33.9,32.5,33.9,32.5s30.8,7.9,50,24s22.1,27.5,22.1,39.8
		s-1.3,28.9-23,44.3s-53.3,15.8-59.4,15.8c-17.8,0.2-35.4-3.2-51.9-9.9c-25.1-10.1-30.9-13.8-30.9-13.8l23.9-36.1l58.5,23.9h6.3
		c0,0,29.5-1.1,29.5-23.1s-36.3-33-36.3-33s-42.6-10-59-32.6c-6.3-8.6-11-15.4-11-29.5s5.5-38.8,35.1-51.6c8.4-3.6,18.4-9,34.8-9
		s42.5,9.4,48.4,11.1S1478.9,321.3,1478.9,321.3z"
          />
          <path
            d="M141,356.8L82.5,333h-2.9c0,0-20.6,3.3-20.6,22.3s21.9,29.5,41.8,35.9s31.8,11.4,48.3,26s16,29.6,16,34.1
		s0.8,31.5-25.1,45.9c-25.9,14.4-47.8,14.8-56.4,14.8s-35.8-2.8-52.8-9.9S0,488.3,0,488.3l24.3-36l61.3,24.5h5.6
		c0,0,27.1-2.9,27.1-22.3s-18.1-28.9-42.4-36.5S12,393.1,12,357.9S45.1,297,82.5,297c25,0,82.5,23.9,82.5,23.9L141,356.8z"
          />
          <path
            d="M1642,299h-7.3c0,0-97.8,1.8-97.8,99.3v11.8c0,0-3.8,85.9,91.7,97.8c1.3,0.2,19.2,0,19.2,0s92.2-6.5,92.2-95.8
		S1693.7,304.7,1642,299z M1638.4,474c-31.3,0-56.6-31.3-56.6-70s25.3-70,56.6-70s56.6,31.3,56.6,70S1669.7,474,1638.4,474z"
          />
        </g>
      </svg>
    </div>
  </div>`, styles: [".cloud-navbar{height:38px;width:100%;z-index:99999999999;background:#fff;border-bottom:1px solid rgb(198,198,198);display:flex;align-items:center;justify-content:center}\n"] }]
        }], ctorParameters: () => [] });

class ContextMenuWindowComponent {
    constructor(model, helper, formEvents, loc, undoService, clipboardService) {
        this.model = model;
        this.helper = helper;
        this.formEvents = formEvents;
        this.loc = loc;
        this.undoService = undoService;
        this.clipboardService = clipboardService;
    }
    ngOnInit() { }
    pasteElement(event) {
        this.model.showContextMenu = false;
        this.clipboardService.pasteElement(event);
    }
    copyElement() {
        this.model.showContextMenu = false;
        this.clipboardService.copyElement();
    }
    cutElement() {
        this.model.showContextMenu = false;
        this.clipboardService.cutElement();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ContextMenuWindowComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: FormEventsService }, { token: StiLocalizationService }, { token: StiUndoService }, { token: StiClipboardService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: ContextMenuWindowComponent, selector: "sti-context-menu-window", ngImport: i0, template: `
    <div [style.left.px]="model.contextMenuX" [style.top.px]="model.contextMenuY" class="context-menu">
      <div
        *ngIf="(model.selectedComponent || clipboardService.hasCopy) && !model.selectedPage"
        class="context-menu-container"
      >
        <div
          class="context-menu-item {{ undoService.undos.length < 2 ? 'disabled' : '' }}"
          (click)="undoService.undo(); model.showContextMenu = false"
        >
          <img [src]="model.getImage('images.Ribbon.Undo.png')" /><span>{{
            loc.get2("MainMenu", "menuEditUndo").replace("&amp", "").replace(";", "")
          }}</span>
        </div>
        <div
          class="context-menu-item {{ undoService.redos.length < 1 ? 'disabled' : '' }}"
          (click)="undoService.redo(); model.showContextMenu = false"
        >
          <img [src]="model.getImage('images.Ribbon.Redo.png')" /><span>{{
            loc.get2("MainMenu", "menuEditRedo").replace("&amp", "").replace(";", "")
          }}</span>
        </div>
        <div
          class="context-menu-item {{ !clipboardService.hasCopy ? 'disabled' : '' }}"
          (click)="pasteElement($event)"
        >
          <img [src]="model.getImage('images.Ribbon.Paste.png')" /><span>{{
            loc.get2("MainMenu", "menuEditPaste").replace("&amp", "").replace(";", "")
          }}</span>
        </div>
        <div class="context-menu-item {{ clipboardService.canCopy ? 'disabled' : '' }}" (click)="copyElement()">
          <img [src]="model.getImage('images.Ribbon.Copy.png')" /><span>{{
            loc.get2("MainMenu", "menuEditCopy").replace("&amp", "").replace(";", "")
          }}</span>
        </div>
        <div class="context-menu-item {{ clipboardService.canCopy ? 'disabled' : '' }}" (click)="cutElement()">
          <img [src]="model.getImage('images.Ribbon.Cut.png')" /><span>{{
            loc.get2("MainMenu", "menuEditCut").replace("&amp", "").replace(";", "")
          }}</span>
        </div>
        <div class="context-menu-item" (click)="formEvents.deleteComponent()">
          <img [src]="model.getImage('images.Ribbon.Delete.png')" /><span>{{ loc.get2("Buttons", "Delete") }}</span>
        </div>
      </div>

      <!-- //////////////////////////////////////////////////////////////////// -->

      <div *ngIf="model.selectedPage" class="context-menu-container">
        <div *ngIf="clipboardService.hasCopy" class="context-menu-item" (click)="pasteElement($event)">
          <img [src]="model.getImage('images.Ribbon.Paste.png')" /><span>{{
            loc.get2("MainMenu", "menuEditPaste").replace("&amp", "").replace(";", "")
          }}</span>
        </div>
        <div class="context-menu-item {{ !formEvents.canMoveUp ? 'disabled' : '' }}" (click)="formEvents.moveUp()">
          <img [src]="model.getImage('images.Page.MovePageUp.png')" /><span>{{
            loc.get2("QueryBuilder", "MoveUp")
          }}</span>
        </div>
        <div class="context-menu-item {{ !formEvents.canMoveDown ? 'disabled' : '' }}" (click)="formEvents.moveDown()">
          <img [src]="model.getImage('images.Page.MovePageDown.png')" /><span>{{
            loc.get2("QueryBuilder", "MoveDown")
          }}</span>
        </div>
        <div class="context-menu-item" (click)="formEvents.insertBefore()">
          <img [src]="model.getImage('images.Page.InsertPageBefore.png')" /><span>{{
            loc.get2("TableRibbon", "InsertAbove")
          }}</span>
        </div>
        <div class="context-menu-item" (click)="formEvents.insertAfter()">
          <img [src]="model.getImage('images.Page.InsertPageAfter.png')" /><span>{{
            loc.get2("TableRibbon", "InsertBelow")
          }}</span>
        </div>
        <div class="context-menu-item {{ !formEvents.canClear ? 'disabled' : '' }}" (click)="formEvents.clear()">
          <img [src]="model.getImage('images.Page.ClearContent.png')" /><span>{{
            loc.get2("MainMenu", "menuEditClearContents")
          }}</span>
        </div>
        <div class="context-menu-item {{ !formEvents.canDelete ? 'disabled' : '' }}" (click)="formEvents.delete()">
          <img [src]="model.getImage('images.Page.DeletePage.png')" /><span>{{
            loc.get2("FormViewer", "PageDelete")
          }}</span>
        </div>
      </div>
    </div>
  `, isInline: true, styles: [".context-menu{position:absolute;z-index:999999999999999;background-color:var(--back-color);min-height:20px;max-height:380px;min-width:200px;display:flex;border:1px solid #c6c6c6;color:#444;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;cursor:default;font-family:Arial;font-size:12px;padding:1px}.context-menu-container{height:100%;width:100%;display:flex;flex-direction:column;-webkit-user-select:none}.context-menu-item{display:flex;width:100%;height:26px;align-items:center;border-radius:3px}.context-menu-item:hover{background-color:#dadada}.context-menu-item img{height:16px;width:16px;margin-left:10px;margin-right:10px}.context-menu-item span{margin-right:10px}.disabled{opacity:.5;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ContextMenuWindowComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-context-menu-window", template: `
    <div [style.left.px]="model.contextMenuX" [style.top.px]="model.contextMenuY" class="context-menu">
      <div
        *ngIf="(model.selectedComponent || clipboardService.hasCopy) && !model.selectedPage"
        class="context-menu-container"
      >
        <div
          class="context-menu-item {{ undoService.undos.length < 2 ? 'disabled' : '' }}"
          (click)="undoService.undo(); model.showContextMenu = false"
        >
          <img [src]="model.getImage('images.Ribbon.Undo.png')" /><span>{{
            loc.get2("MainMenu", "menuEditUndo").replace("&amp", "").replace(";", "")
          }}</span>
        </div>
        <div
          class="context-menu-item {{ undoService.redos.length < 1 ? 'disabled' : '' }}"
          (click)="undoService.redo(); model.showContextMenu = false"
        >
          <img [src]="model.getImage('images.Ribbon.Redo.png')" /><span>{{
            loc.get2("MainMenu", "menuEditRedo").replace("&amp", "").replace(";", "")
          }}</span>
        </div>
        <div
          class="context-menu-item {{ !clipboardService.hasCopy ? 'disabled' : '' }}"
          (click)="pasteElement($event)"
        >
          <img [src]="model.getImage('images.Ribbon.Paste.png')" /><span>{{
            loc.get2("MainMenu", "menuEditPaste").replace("&amp", "").replace(";", "")
          }}</span>
        </div>
        <div class="context-menu-item {{ clipboardService.canCopy ? 'disabled' : '' }}" (click)="copyElement()">
          <img [src]="model.getImage('images.Ribbon.Copy.png')" /><span>{{
            loc.get2("MainMenu", "menuEditCopy").replace("&amp", "").replace(";", "")
          }}</span>
        </div>
        <div class="context-menu-item {{ clipboardService.canCopy ? 'disabled' : '' }}" (click)="cutElement()">
          <img [src]="model.getImage('images.Ribbon.Cut.png')" /><span>{{
            loc.get2("MainMenu", "menuEditCut").replace("&amp", "").replace(";", "")
          }}</span>
        </div>
        <div class="context-menu-item" (click)="formEvents.deleteComponent()">
          <img [src]="model.getImage('images.Ribbon.Delete.png')" /><span>{{ loc.get2("Buttons", "Delete") }}</span>
        </div>
      </div>

      <!-- //////////////////////////////////////////////////////////////////// -->

      <div *ngIf="model.selectedPage" class="context-menu-container">
        <div *ngIf="clipboardService.hasCopy" class="context-menu-item" (click)="pasteElement($event)">
          <img [src]="model.getImage('images.Ribbon.Paste.png')" /><span>{{
            loc.get2("MainMenu", "menuEditPaste").replace("&amp", "").replace(";", "")
          }}</span>
        </div>
        <div class="context-menu-item {{ !formEvents.canMoveUp ? 'disabled' : '' }}" (click)="formEvents.moveUp()">
          <img [src]="model.getImage('images.Page.MovePageUp.png')" /><span>{{
            loc.get2("QueryBuilder", "MoveUp")
          }}</span>
        </div>
        <div class="context-menu-item {{ !formEvents.canMoveDown ? 'disabled' : '' }}" (click)="formEvents.moveDown()">
          <img [src]="model.getImage('images.Page.MovePageDown.png')" /><span>{{
            loc.get2("QueryBuilder", "MoveDown")
          }}</span>
        </div>
        <div class="context-menu-item" (click)="formEvents.insertBefore()">
          <img [src]="model.getImage('images.Page.InsertPageBefore.png')" /><span>{{
            loc.get2("TableRibbon", "InsertAbove")
          }}</span>
        </div>
        <div class="context-menu-item" (click)="formEvents.insertAfter()">
          <img [src]="model.getImage('images.Page.InsertPageAfter.png')" /><span>{{
            loc.get2("TableRibbon", "InsertBelow")
          }}</span>
        </div>
        <div class="context-menu-item {{ !formEvents.canClear ? 'disabled' : '' }}" (click)="formEvents.clear()">
          <img [src]="model.getImage('images.Page.ClearContent.png')" /><span>{{
            loc.get2("MainMenu", "menuEditClearContents")
          }}</span>
        </div>
        <div class="context-menu-item {{ !formEvents.canDelete ? 'disabled' : '' }}" (click)="formEvents.delete()">
          <img [src]="model.getImage('images.Page.DeletePage.png')" /><span>{{
            loc.get2("FormViewer", "PageDelete")
          }}</span>
        </div>
      </div>
    </div>
  `, styles: [".context-menu{position:absolute;z-index:999999999999999;background-color:var(--back-color);min-height:20px;max-height:380px;min-width:200px;display:flex;border:1px solid #c6c6c6;color:#444;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;cursor:default;font-family:Arial;font-size:12px;padding:1px}.context-menu-container{height:100%;width:100%;display:flex;flex-direction:column;-webkit-user-select:none}.context-menu-item{display:flex;width:100%;height:26px;align-items:center;border-radius:3px}.context-menu-item:hover{background-color:#dadada}.context-menu-item img{height:16px;width:16px;margin-left:10px;margin-right:10px}.context-menu-item span{margin-right:10px}.disabled{opacity:.5;pointer-events:none}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: FormEventsService }, { type: StiLocalizationService }, { type: StiUndoService }, { type: StiClipboardService }] });

class StiExpressionHelpWindowComponent {
    constructor(model, loc) {
        this.model = model;
        this.loc = loc;
    }
    get itemInfo() {
        if (this.model.currentExpressionInfo == 1) {
            return `Supports list operations: adding, subtracting and multiplying lists, list and value.
Example:
    { Col( 'Qty' ) * Col( 'Price' ) }
    { ( Col( 'Fahrenheit degrees' ) - 32 ) * 5 / 9 }
Available functions:
    Count,
    Min,
    Max,
    Sum,
    Value,
    Cell,
    Total,
    Col`;
        }
        else if (this.model.currentExpressionInfo == 2) {
            return `Example:
  { Sum( Col( 'Final price' ) ) }
  { ( Total( 'Tax' ) + 1 ) * Total( 'Price' ) }
Available functions:
  Count,
  Min,
  Max,
  Sum,
  Value,
  Cell,
  Total,
  Col,
  Row`;
        }
        else if (this.model.currentExpressionInfo == 3) {
            return `Multiple expressions, enclosed in { and }, are supported.
Example:
    "Tax is { Value( 'Tax' ) * 100}%, total is { Value( 'Tax' ) * Value( 'Subtotal' ) } dollars",
    evaluates to "Tax is 15%, total is 230 dollars"
Available functions:
    Count,
    Min,
    Max,
    Sum,
    Value,
    Cell,
    Total,
    Col,
    Row`;
        }
        else {
            return "";
        }
    }
    get generalInfo() {
        return `Expressions : used in Label element, Labels column and Totals fields of Table element.
|
|- Values: numbers: 1, 2.3, -4.5.
|          strings: 'text'.
|          lists: returned from some functions.
|
|- Operators: JS-style type casting is applied when possible.
|   |
|   |- "+" : when applied to numbers:            2 + 3 = 5
|   |        when applied to strings:            'abc' + 'def' = 'abcdef'
|   |        in Labels column expressions, when applied to lists of same size: [ 1, 2, 3 ] + [ 4, 5, 6 ] = [ 5, 7, 9 ].
|   |        in Labels column expressions, when applied to list and number:    [ 1, 2, 3 ] + 8 = [ 9, 10, 11 ].
|   |
|   |- "-" : when applied to numbers:            2 - 3 = 5
|   |        in Labels column expressions, when applied to lists of same size: [ 1, 2, 3 ] - [ 4, 5, 6 ] = [ -3, -3, -3 ].
|   |        in Labels column expressions, when applied to list and number:    [ 1, 2, 3 ] - 8 = [ -7, -6, -5 ].
|   |
|   |- "*" : when applied to numbers:            2 * 3 = 6
|   |        in Labels column expressions, when applied to lists of same size: [ 1, 2, 3 ] * [ 4, 5, 6 ] = [ 4, 10, 18 ].
|   |        in Labels column expressions, when applied to list and number:    [ 1, 2, 3 ] * 8 = [ 8, 16, 24 ].
|   |
|   |- "/" : when applied to numbers: 2 / 3 = 0.666667.
|   |
|   |- "(" and ")" : operations order.
|
|- Functions:
    |
    |- Value( name ) - value of NumberBox, TextBox or Label element.
    |                  For Label element - value of the last expression,
    |                  for ex., value of Label with text "Price: {2 * 100} dollars" is 200.
    |
    |- Count( list ) - number of items in the list.
    |
    |- Min( list ) - the smallest number in list.
    |
    |- Max( list ) - the largest number in list.
    |
    |- Sum( list ) - sum of all numbers in list.
    |
    |- Cell( oneBasedColumnIndex, oneBasedRowIndex, 'tableName' ) - number value of specified cell.
    |                                                               Cell must be from either NumberBox column or Label column.
    |                                                               Parameter 'tableName' can be omitted if function is used
    |                                                               in the same table (for ex., in Totals field's expression)
    |                                                               as the specified cell.
    |
    |- Total( totalsFieldID, 'tableName' ) - value of Table's Totals field.
    |                                        totalsFieldID - either one-based index or header text of desired totals field.
    |                                        Parameter 'tableName' can be omitted if function is used
    |                                        in the same table (for ex., in Totals field's expression)
    |                                        as the specified totals field.
    |
    |- Col( columnID, 'tableName' ) - list of numbers which are cell values from specified column.
    |                                 columnID - either one-based index or label text of desired column.
    |                                 Only NumberBox and Label columns are supported.
    |                                 Parameter 'tableName' can be omitted if function is used
    |                                 in the same table (for ex., in Totals field's expression)
    |                                 as the specified column.
    |
    |
    |- Row( rowID, 'tableName' ) - list of numbers which are cell values from specified row.
                                  rowID - either one-based index or label text of desired row.
                                  Only cells from NumberBox or Label columns are included.
                                  Parameter 'tableName' can be omitted if function is used
                                  in the same table (for ex., in Totals field's expression)
                                  as the specified row.
                                  Not available in Label column expressions.
  `;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiExpressionHelpWindowComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiExpressionHelpWindowComponent, selector: "expression-help-window", ngImport: i0, template: `<div class="help-window">
    <div class="navigation">
      <span>{{ loc.get2("HelpDesigner", "StimulsoftHelp") }}</span>
      <div class="close-button" (click)="model.showHelpWindow = false">
        <img [src]="model.getImage('images.Other.CloseForm.png')" alt="" />
      </div>
    </div>
    <div class="content">
      <div class="item-info">{{ itemInfo }}</div>
      <div class="general-info">{{ generalInfo }}</div>
    </div>
  </div>`, isInline: true, styles: [".pi{font-size:.825rem;color:var(--text-color)}.help-window{position:absolute;height:500px;width:620px;display:flex;flex-direction:column;left:calc(50% - 310px);top:calc(50% - 250px);z-index:9999999;background:var(--back-color);border:1px solid rgb(25,71,138);-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;font-family:Arial;border-radius:5px;font-size:12px}.navigation{height:30px;width:100%;display:flex;align-items:center;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a}.navigation span{padding-left:10px;color:#fff;flex:1}.item-info{margin-bottom:10px}.close-button{height:30px;width:30px;display:flex;align-items:center;justify-content:center}.close-button img{height:16px;width:16px;filter:brightness(0) invert(1)}.close-button:hover{background-color:#dadada}.content{height:100%;width:100%;overflow-y:scroll;padding:0 10px;word-wrap:auto;white-space:pre-wrap}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiExpressionHelpWindowComponent, decorators: [{
            type: Component,
            args: [{ selector: "expression-help-window", template: `<div class="help-window">
    <div class="navigation">
      <span>{{ loc.get2("HelpDesigner", "StimulsoftHelp") }}</span>
      <div class="close-button" (click)="model.showHelpWindow = false">
        <img [src]="model.getImage('images.Other.CloseForm.png')" alt="" />
      </div>
    </div>
    <div class="content">
      <div class="item-info">{{ itemInfo }}</div>
      <div class="general-info">{{ generalInfo }}</div>
    </div>
  </div>`, styles: [".pi{font-size:.825rem;color:var(--text-color)}.help-window{position:absolute;height:500px;width:620px;display:flex;flex-direction:column;left:calc(50% - 310px);top:calc(50% - 250px);z-index:9999999;background:var(--back-color);border:1px solid rgb(25,71,138);-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;font-family:Arial;border-radius:5px;font-size:12px}.navigation{height:30px;width:100%;display:flex;align-items:center;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a}.navigation span{padding-left:10px;color:#fff;flex:1}.item-info{margin-bottom:10px}.close-button{height:30px;width:30px;display:flex;align-items:center;justify-content:center}.close-button img{height:16px;width:16px;filter:brightness(0) invert(1)}.close-button:hover{background-color:#dadada}.content{height:100%;width:100%;overflow-y:scroll;padding:0 10px;word-wrap:auto;white-space:pre-wrap}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }] });

class StiLoginComponent {
    constructor() {
        this.onLogin = new EventEmitter();
    }
    ngOnInit() { }
    get window() {
        return window;
    }
    doLogin() {
        if (this.login?.length > 0 && this.password?.length > 0) {
            this.onLogin.emit({ login: this.login, password: this.password });
        }
    }
    keydown(event) {
        if (event.key === 'Enter') {
            this.doLogin();
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiLoginComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiLoginComponent, selector: "sti-login", inputs: { loginInfo: "loginInfo" }, outputs: { onLogin: "onLogin" }, ngImport: i0, template: `
  <div id="cd334261b95f4a98802f0b2b478f726e" class="stiJsViewerForm"
	style="z-index: 21; width: 380px; background-color: white; left: 0px; opacity: 1;"
  [style.left.px]="window.innerWidth / 2 - 140"
  [style.top.px]="window.innerHeight / 2 - 200">
	<div class="stiJsViewerAuthFormHeader" style="position: relative;">
		<table class="stiJsViewerClearAllStyles" cellpadding="0"
			cellspacing="0" style="width: 100%;">
			<tbody>
				<tr class="stiJsViewerClearAllStyles">
					<td class="stiJsViewerAuthFormCaption"
						style="text-align: left; padding: 45px 133px 45px 33px;">{{loginInfo.AuthorizationWindowTitleLogin.toUpperCase()}}</td>
					<td class="stiJsViewerClearAllStyles"
						style="vertical-align: top; width: 30px; text-align: right; padding: 2px 2px 1px 1px;"><div
							class="stiJsViewerStandartSmallButton stiJsViewerStandartSmallButtonDefault"
							style="font-family: Arial; height: 23px; box-sizing: content-box; display: none;">
							<table class="stiJsViewerClearAllStyles" cellpadding="0"
								cellspacing="0" style="width: 100%; height: 100%;">
								<tbody>
									<tr class="stiJsViewerClearAllStyles">
										<td class="stiJsViewerClearAllStyles"
											style="line-height: 0; text-align: center; padding: 0px 4px;"><img
											src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAFHGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDIgNzkuMTYwOTI0LCAyMDE3LzA3LzEzLTAxOjA2OjM5ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxOCAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDE5LTA2LTI0VDA4OjQ2OjI5KzAzOjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAxOS0wNy0wMVQxMDozNTowNyswMzowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAxOS0wNy0wMVQxMDozNTowNyswMzowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJzUkdCIElFQzYxOTY2LTIuMSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo0YjZhYjUxMi05NWZlLWNlNDQtYmRhMC02OTk3M2JhMzRiYTMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NGI2YWI1MTItOTVmZS1jZTQ0LWJkYTAtNjk5NzNiYTM0YmEzIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6NGI2YWI1MTItOTVmZS1jZTQ0LWJkYTAtNjk5NzNiYTM0YmEzIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDo0YjZhYjUxMi05NWZlLWNlNDQtYmRhMC02OTk3M2JhMzRiYTMiIHN0RXZ0OndoZW49IjIwMTktMDYtMjRUMDg6NDY6MjkrMDM6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE4IChXaW5kb3dzKSIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz51X1j6AAAAq0lEQVQ4jc1SsREDIQyTswMLQOmZKNmBUThaz+QSjk2cKp/8QT75++ZV+mSdJJvMDFfwuLR9T4Gcs5VSpmJKKZZznuaTADNjjAER2cgiYmMMMPPkgFZXEBFTVXjvQURorYGZEWOkvwQAoNZqvXcAQAgBKaVpeRlhU6Y3/+hXlgIiYq01hBDgvUfvfdfJYYRX/s/Mq9lXB6oK59yOGGMk5xxU9beDs7jhK5/FE4xzWvcg3Y20AAAAAElFTkSuQmCC"
											style="width: 16px; height: 16px; margin: 0px 2px;"></td>
									</tr>
								</tbody>
							</table>
						</div></td>
				</tr>
			</tbody>
		</table>
		<img
			src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAK4AAAAqCAYAAAAqLWAgAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDplNzEwYmIyZC01NmUyLTc2NDItOGUyMi01YmE3MjYwOWZiZTMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RjY0N0Q0REE5RTA2MTFFN0EwMEY4MTlBNDU0RjlFNjMiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RjY0N0Q0RDk5RTA2MTFFN0EwMEY4MTlBNDU0RjlFNjMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NTYxZDc3OWMtYjFkYS00NDQyLTgxZWYtMzU2ZDQ0Nzk0N2IyIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOmU3MTBiYjJkLTU2ZTItNzY0Mi04ZTIyLTViYTcyNjA5ZmJlMyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvXpS+8AAAedSURBVHja7Fxdrqs2ECbV2UC2wF1CIrVS+1ZYAmcJyXv7AOrtY28FD+17WEKyhNC3VmqlsISTLbCE0xnumE4cG8xfYm49EuIcMI7t+Tz+Zhi8en9/97j88dc/GzjFcETevZzgyL//9utCXFitVvW5+PNvfCb1+ksYfPdNwS9AXe+6e4oyOZTZm/4YPHeA0w7/hudWivsBnM66+5o6sXygay8bmwLuh95AgXo6daMbL0VdEdW1kW6VcCQm9fTU+U3fx+AF8feVBFpU6IUNDHYCO1DR/3j9DOVSzx7ZwSD4hsryBWiXJtB2I91AudRw8h4ZaK90eHTtTGWslRcG2jWbATnOOkB2xe77NDipYpaidcrglLVYo4TKzCHYpleDcoeFgvZONzCWlTQhtbqR6joy8CdkpStFPWgQPMPVrPdKIvCiWPEbvAD+sk7gkiXCAbrCA3eNhWs4IzOouLBQtxEu8W3LG1GAwFumNLpRAQmu1bqBPhYGS3tEVhppTampp6JJjuAt4Xpu24BwquAzrqQVAHCJh00Gic5xR7lYKr8kMdINAlEGo2S1xRhkunJUT07W2BvIQx8K3LU0SEuRnCxIQFa1zdpWVH5pMoVuuNXupGxUBi3wmvi1tcAVMzACOhAtSKkV49Zxh7XNmDOzJCkZJRqqm4BNdFM5Sc9aCdycKfUI4L3AEVN4bElWN1J44wFZjyVa2zvdQJ8uyFcpPNYXuOWACWMdBl4Yd60ApCFxmoAauyFPryJuWEA565SPXjEoMSGHIpW4IOd1WG5xqKV2K3VDjlRBnr2JbvqsOJUhRQlYXF0loWl8eYjFFY4XDlBIy+qVcSy0ZAcA8ZuNVpiUhu31BSejs0+8bqnWljterbqB/r71tMKLlRdN5KCgWZyw+G1Esxz/x5cQWwqR2SQZWd2YllfObU1lSJ+CBwK40Q2Lu97oBq5vKbTV5uj1cQq7xmTUG8HRFlcDYozrZnBs4d8961BsoVXiVvdMiuwVh+QKN7FeFGYaA/ox/a0jBHCY6KYYMMk2A3ixHcCVQJwzB8fWsNleUlAywos3UbIoU7VYuUdN2jbdCOAaRSVoQu6kZ+0DLr3ynWspfaQCCzbQxUCnQDxjEr/cSaGjyUWy6kN1IyITPr1BM+nX2lb/gFtcDIEdDAAcDPBOn8F1i57cVlay16VkFmqbFbje5xDYwQDAWt1QPoIYj7TtpQLdS0esWI9xzsgBE53GFxC14vmrXSoTe8MC2c+0uoO4I4XXUlIycr1EUAEpGaWeKFOHexiIbnQD/2e0kpRSmU7dIB9mGXIH6lcm9Stmqwgm4JysBS46YBTDPRA/SgmsWovEc3K/RJGUHBFolGMBZU2tUle8U0gT96RJdKeblnh0a04uJulQ7FcAdKepa85svumoAgIRjg/k3JxauN+rKnvsCwUv9jPUjAdavH2fJPYxKwgcRroxaQ9NNFW/RC7H1mbQoqzkfEguRA/wqHQZYeILiP+DCI7Jc2Gf2JZGN22ZXrb3qw1/g4HrxIn1VMGJEwdcJ04ccJ04uZcXNwSPkR8//drkw/728afqWc7tD798wtgtOmPV7z9/fHoOgnPO7ARrHSf17hOx66R2AHCmAy4ArNl3AAC2GglW8ZVw5N1mh+EEwpBYBr9x7ahDfH1bQNnQ4DdFeWX7ef800rQNxunqqMJjALuGAxV38NRfD9QvEqDMhUA1p4VFsL55/+UecBGJNBcqZ5OItr3BOKUOuA8Arfd5JxyeN4DB/IQO/t3bhsrOCdojA2xJbdjTuWQgOT4RvIni4DQmhnE9OI47r/BtjXDwQ85pCdwZAbb+BAeXTVhOs4lBu/ZuN0BJFL+RSUv2Af4vu2jD1IKUSXE5I79ATLwd/F9A2ZOzuNNbW5GkInjsHWhJUfWGHFQmmRq0JCmztNrfoOsJs7zWfCAA41S/xpb65KjCTNa2sRgq0Erg3c4BWrK2IsPr2vUbdF9Y2d3cvHsAeJs0UzAOkQPu9NLwWhjw3EApc+UGcK5qmn6aa563QQrJsXXAnVh8xm2f7ZF7PdtSap63DbiBA+60/DbQDPQzLT/SAKO2SOWs2rlGtTI54E4nlUUWq5L4rikv7rOqDBmXycQBdzqrwJfaZ2/KMaQtG8MVw+9Z32jaRLFxB9wHACZQDfYD5ToSuFVbnWCdfQPrPWX/72iYA+60wj+F6fy0HcA9l2XmW+ybbhG60/RDNRm6OHA0Md/fOeDOK3xXxbgNmGSR8TXrGxyTOkPgaFUMfD69HWuzkDGjADk93zYp475AG0ET+BYAV0HJHHCn934z5qCdVeBl+Qziu7E5vPiETaJUB17plW/lafZRoNfABZsMB019PLGoGJM6CeOEbeO/03wI6tIaZxBKCJGX3pI5Nzy9sM5nkK2cBCiTz99Pco4B5d6evdvN604EULHLo89AG7YBjbjtRVOfsLRG9XX0T0xmzqXxTWTigDs/eFODJbV+F69amg3yVWUJVTFbBXh1ztyriXU0rA/7s4f6Th30xKR/FYE2c1GFx9AG3d4FwgLvoUyo4ZNT8l0E4weyalcFYPH61nRJZ/XliuhDsy9DG2h7OJh121TZY/8KMAD0W9tx3mWyBAAAAABJRU5ErkJggg=="
			style="position: absolute; top: 50px; right: 42px; width: 87px; height: 21px;">
	</div>
	<div class="stiJsViewerAuthFormContainer"
		style="overflow: hidden; padding: 0px;">
		<div>
			<table class="stiJsViewerClearAllStyles" cellpadding="0"
				cellspacing="0" style="width: 100%;">
				<tbody>
					<tr class="stiJsViewerClearAllStyles">
						<td class="stiJsViewerClearAllStyles" style="width: 50%;"><table
								class="stiJsViewerClearAllStyles" cellpadding="0"
								cellspacing="0" style="margin: 0px auto;">
								<tbody>
									<tr class="stiJsViewerClearAllStyles"></tr>
									<tr class="stiJsViewerClearAllStyles">
										<td class="stiJsViewerClearAllStyles"><table
												class="stiJsViewerClearAllStyles" cellpadding="0"
												cellspacing="0">
												<tbody>
													<tr class="stiJsViewerClearAllStyles">
														<td class="stiJsViewerClearAllStyles"
															style="line-height: 0; background-color: rgb(242, 241, 241); width: 30px; text-align: center;"><img
															src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDAyIDc5LjE2NDM1MiwgMjAyMC8wMS8zMC0xNTo1MDozOCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjEgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkNGQzNFQTREQTQ2OTExRUFBQzFBQjcwQUVCQUVFNURFIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkNGQzNFQTRFQTQ2OTExRUFBQzFBQjcwQUVCQUVFNURFIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6Q0ZDM0VBNEJBNDY5MTFFQUFDMUFCNzBBRUJBRUU1REUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6Q0ZDM0VBNENBNDY5MTFFQUFDMUFCNzBBRUJBRUU1REUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7qFruUAAAApUlEQVR42mL8//8/AwhIeXQzIAFXIE4FYlkgfgzEs4F4N0zy2Y5SuEIWBkzgDMTtSHwlJP5udMVMWAxIZ8AOUrEJYjNAFocBssQa8BiHAY+JNWAWDgPmEGvAHiCuAuL7QPwHSoP4u7AZwILDtl24NBBywRkojkMTj0OSI+gFEMgF4iAoOwjKZyDFC4xAXAHEmkDsD+WTZADMdYGkhgHJYBgYABBgAAcgHJxJDtSoAAAAAElFTkSuQmCC"
															style="vertical-align: middle; opacity: 0.8; width: 16px; height: 16px;"></td>
														<td class="stiJsViewerClearAllStyles"><input
                              [(ngModel)]="login"
															name="null" title="{{loginInfo.AuthorizationTextUserName}}"
															class="stiJsViewerTextBox stiJsViewerTextBoxDefault"
															placeholder="{{loginInfo.AuthorizationTextUserName}}"
															style="font-family: Arial; width: 280px; height: 30px; line-height: 21px; box-sizing: content-box; background-color: rgb(242, 241, 241); border: none;"></td>
													</tr>
												</tbody>
											</table></td>
									</tr>
									<tr class="stiJsViewerClearAllStyles">
										<td class="stiJsViewerClearAllStyles"
											style="padding-top: 17px;"><table
												class="stiJsViewerClearAllStyles" cellpadding="0"
												cellspacing="0">
												<tbody>
													<tr class="stiJsViewerClearAllStyles">
														<td class="stiJsViewerClearAllStyles"
															style="line-height: 0; background-color: rgb(242, 241, 241); width: 30px; text-align: center;"><img
															src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDAyIDc5LjE2NDM1MiwgMjAyMC8wMS8zMC0xNTo1MDozOCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjEgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkNBNjE4NDExQTQ2OTExRUE4Qjg4OUQyMDc0MzI4QjQzIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkNBNjE4NDEyQTQ2OTExRUE4Qjg4OUQyMDc0MzI4QjQzIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6Q0E2MTg0MEZBNDY5MTFFQThCODg5RDIwNzQzMjhCNDMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6Q0E2MTg0MTBBNDY5MTFFQThCODg5RDIwNzQzMjhCNDMiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6i/NOXAAAA5UlEQVR42mKUdO9igAI7II4CYi0o/xoQLwXiwwx4AAuUzgLiJDQ5EyieB8TTcBnABMS2UM0TgNgSiPvQ1CRBXYfTgGgoex0Q/wbijVjUReEzAObnQCDmBGJ/LOq0CIUBCBRCMUmACRrahMBbfAYsI8IAWVzhwMyr4voQ6hVDAoZYQsPCAYiPAPEfmAsYoPFcBMRngPg7FD/GYogNELsghx1yIB6CYmQQjSNgQd5+AMR5LAScvRQphpCBFBD/gIUBoQC8DMRfoGGADASB+BsxBuAzxIKJhDSzDEs+YWAiMeFhGAIQYABSSCj4eeytwAAAAABJRU5ErkJggg=="
															style="vertical-align: middle; opacity: 0.8; width: 16px; height: 16px;"></td>
														<td class="stiJsViewerClearAllStyles"><input
                              [(ngModel)]="password"
                              (keydown)="keydown($event)"
															name="null" title="{{loginInfo.AuthorizationTextPassword}}"
															class="stiJsViewerTextBox stiJsViewerTextBoxDefault"
															placeholder="{{loginInfo.AuthorizationTextPassword}}" type="password"
															style="font-family: Arial; width: 280px; height: 30px; line-height: 21px; box-sizing: content-box; background-color: rgb(242, 241, 241); border: none;"></td>
													</tr>
												</tbody>
											</table></td>
									</tr>
									<tr class="stiJsViewerClearAllStyles">
										<td class="stiJsViewerClearAllStyles"><table
												class="stiJsViewerClearAllStyles" cellpadding="0"
												cellspacing="0" style="width: 100%;">
												<tbody>
													<tr class="stiJsViewerClearAllStyles">
														<td class="stiJsViewerClearAllStyles"
															style="padding-top: 20px;"><div
																class="stiJsViewerLoginButton stiJsViewerLoginButtonDefault"
																style="font-family: Arial; height: 40px; box-sizing: content-box; min-width: 80px; cursor: pointer; margin: 8px 0px 80px; display: inline-block;">
																<table class="stiJsViewerClearAllStyles" cellpadding="0"
                                (click)="doLogin()"
																	cellspacing="0" style="width: 100%; height: 100%;">
																	<tbody>
																		<tr class="stiJsViewerClearAllStyles">
																			<td class="stiJsViewerClearAllStyles"
																				style="padding: 0px 10px; white-space: nowrap; text-align: center;">{{loginInfo.AuthorizationWindowTitleLogin}}</td>
																		</tr>
																	</tbody>
																</table>
															</div></td>
													</tr>
												</tbody>
											</table></td>
									</tr>
								</tbody>
							</table></td>
					</tr>
					<tr class="stiJsViewerClearAllStyles">
						<td class="stiJsViewerClearAllStyles" colspan="2"
							style="text-align: center;"><div
								style="width: 380px; margin: 0px auto;"></div></td>
					</tr>
				</tbody>
			</table>
		</div>
	</div>
	<div class="stiJsViewerFormButtonsPanel" style="display: none;">
		<table class="stiJsViewerClearAllStyles" cellpadding="0"
			cellspacing="0">
			<tbody>
				<tr class="stiJsViewerClearAllStyles">
					<td class="stiJsViewerClearAllStyles" style="padding: 12px;"><div
							class="stiJsViewerFormButtonTheme stiJsViewerFormButtonThemeDefault"
							style="font-family: Arial; height: 23px; box-sizing: content-box; min-width: 80px;">
							<table class="stiJsViewerClearAllStyles" cellpadding="0"
								cellspacing="0" style="width: 100%; height: 100%;">
								<tbody>
									<tr class="stiJsViewerClearAllStyles">
										<td class="stiJsViewerClearAllStyles"
											style="padding: 0px 10px; white-space: nowrap; text-align: center; width: 100%;">OK</td>
									</tr>
								</tbody>
							</table>
						</div></td>
					<td class="stiJsViewerClearAllStyles"
						style="padding: 12px 12px 12px 0px;"><div
							class="stiJsViewerFormButton stiJsViewerFormButtonDefault"
							style="font-family: Arial; height: 23px; box-sizing: content-box; min-width: 80px;">
							<table class="stiJsViewerClearAllStyles" cellpadding="0"
								cellspacing="0" style="width: 100%; height: 100%;">
								<tbody>
									<tr class="stiJsViewerClearAllStyles">
										<td class="stiJsViewerClearAllStyles"
											style="padding: 0px 10px; white-space: nowrap; text-align: center; width: 100%;">Cancel</td>
									</tr>
								</tbody>
							</table>
						</div></td>
				</tr>
			</tbody>
		</table>
	</div>
</div>
<style>
  .stiJsViewerMainPanel *, .stiJsViewerMainPanel *:before, .stiJsViewerMainPanel *:after {
    box-sizing: content-box;
    border-collapse: initial;
}

.stiJsViewerForm {
    position: absolute;
    border: 1px solid #19478a;
    background: #ffffff;
    -moz-box-shadow: 0px 0px 7px rgba(0,0,0,0.6);
    -webkit-box-shadow: 0px 0px 7px rgb(0 0 0 / 60%);
    box-shadow: 0 0 7px rgb(0 0 0 / 30%);
    cursor: default;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    text-align: left;
    color: #202020;
}

.stiJsViewerClearAllStyles {
    padding: 0px;
    margin: 0px;
    border: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    line-height: normal;
}

.stiJsViewerAuthFormCaption {
    font-family: Arial;
    color: #7a8d8e;
    font-size: 28px;
}

.stiJsViewerAuthFormContainer {
    padding: 5px 10px 0px 10px;
    background: #ffffff;
    overflow-y: auto;
    overflow-x: hidden;
}

.stiJsViewerTextBoxDefault {
    border-radius: 3px;
    border: 1px solid #ababab;
}

.stiJsViewerTextBox {
    font-size: 12px;
    margin: 0px;
    padding: 0px 0px 0px 4px;
    -webkit-border-radius: 0px;
    outline: none;
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(hsla(0,0%,100%,0)), to(hsla(0,0%,100%,0)));
    background-image: -webkit-linear-gradient(hsla(0,0%,100%,0), hsla(0,0%,100%,0));
    background: #ffffff;
    color: #202020;
}

.stiJsViewerLoginButtonDefault {
    background: #19478a;
}

.stiJsViewerLoginButton {
    border: none;
    border-radius: 3px;
    height: 40px;
    color: white;
    cursor: default;
    font-family: Arial;
    font-size: 19px;
    width: 100%;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

.stiJsViewerLoginButton:hover {
    background: #3b629b;
}
</style>
  `, isInline: true, styles: ["\n  .stiJsViewerMainPanel *, .stiJsViewerMainPanel *:before, .stiJsViewerMainPanel *:after {\n    box-sizing: content-box;\n    border-collapse: initial;\n}\n\n.stiJsViewerForm {\n    position: absolute;\n    border: 1px solid #19478a;\n    background: #ffffff;\n    -moz-box-shadow: 0px 0px 7px rgba(0,0,0,0.6);\n    -webkit-box-shadow: 0px 0px 7px rgb(0 0 0 / 60%);\n    box-shadow: 0 0 7px rgb(0 0 0 / 30%);\n    cursor: default;\n    -moz-user-select: none;\n    -khtml-user-select: none;\n    -webkit-user-select: none;\n    -ms-user-select: none;\n    text-align: left;\n    color: #202020;\n}\n\n.stiJsViewerClearAllStyles {\n    padding: 0px;\n    margin: 0px;\n    border: 0px;\n    margin-top: 0px;\n    margin-bottom: 0px;\n    margin-left: 0px;\n    margin-right: 0px;\n    line-height: normal;\n}\n\n.stiJsViewerAuthFormCaption {\n    font-family: Arial;\n    color: #7a8d8e;\n    font-size: 28px;\n}\n\n.stiJsViewerAuthFormContainer {\n    padding: 5px 10px 0px 10px;\n    background: #ffffff;\n    overflow-y: auto;\n    overflow-x: hidden;\n}\n\n.stiJsViewerTextBoxDefault {\n    border-radius: 3px;\n    border: 1px solid #ababab;\n}\n\n.stiJsViewerTextBox {\n    font-size: 12px;\n    margin: 0px;\n    padding: 0px 0px 0px 4px;\n    -webkit-border-radius: 0px;\n    outline: none;\n    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(hsla(0,0%,100%,0)), to(hsla(0,0%,100%,0)));\n    background-image: -webkit-linear-gradient(hsla(0,0%,100%,0), hsla(0,0%,100%,0));\n    background: #ffffff;\n    color: #202020;\n}\n\n.stiJsViewerLoginButtonDefault {\n    background: #19478a;\n}\n\n.stiJsViewerLoginButton {\n    border: none;\n    border-radius: 3px;\n    height: 40px;\n    color: white;\n    cursor: default;\n    font-family: Arial;\n    font-size: 19px;\n    width: 100%;\n    -moz-user-select: none;\n    -khtml-user-select: none;\n    -webkit-user-select: none;\n    -ms-user-select: none;\n}\n\n.stiJsViewerLoginButton:hover {\n    background: #3b629b;\n}\n"], dependencies: [{ kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiLoginComponent, decorators: [{
            type: Component,
            args: [{
                    selector: 'sti-login',
                    template: `
  <div id="cd334261b95f4a98802f0b2b478f726e" class="stiJsViewerForm"
	style="z-index: 21; width: 380px; background-color: white; left: 0px; opacity: 1;"
  [style.left.px]="window.innerWidth / 2 - 140"
  [style.top.px]="window.innerHeight / 2 - 200">
	<div class="stiJsViewerAuthFormHeader" style="position: relative;">
		<table class="stiJsViewerClearAllStyles" cellpadding="0"
			cellspacing="0" style="width: 100%;">
			<tbody>
				<tr class="stiJsViewerClearAllStyles">
					<td class="stiJsViewerAuthFormCaption"
						style="text-align: left; padding: 45px 133px 45px 33px;">{{loginInfo.AuthorizationWindowTitleLogin.toUpperCase()}}</td>
					<td class="stiJsViewerClearAllStyles"
						style="vertical-align: top; width: 30px; text-align: right; padding: 2px 2px 1px 1px;"><div
							class="stiJsViewerStandartSmallButton stiJsViewerStandartSmallButtonDefault"
							style="font-family: Arial; height: 23px; box-sizing: content-box; display: none;">
							<table class="stiJsViewerClearAllStyles" cellpadding="0"
								cellspacing="0" style="width: 100%; height: 100%;">
								<tbody>
									<tr class="stiJsViewerClearAllStyles">
										<td class="stiJsViewerClearAllStyles"
											style="line-height: 0; text-align: center; padding: 0px 4px;"><img
											src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAFHGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDIgNzkuMTYwOTI0LCAyMDE3LzA3LzEzLTAxOjA2OjM5ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxOCAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDE5LTA2LTI0VDA4OjQ2OjI5KzAzOjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAxOS0wNy0wMVQxMDozNTowNyswMzowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAxOS0wNy0wMVQxMDozNTowNyswMzowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJzUkdCIElFQzYxOTY2LTIuMSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo0YjZhYjUxMi05NWZlLWNlNDQtYmRhMC02OTk3M2JhMzRiYTMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NGI2YWI1MTItOTVmZS1jZTQ0LWJkYTAtNjk5NzNiYTM0YmEzIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6NGI2YWI1MTItOTVmZS1jZTQ0LWJkYTAtNjk5NzNiYTM0YmEzIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDo0YjZhYjUxMi05NWZlLWNlNDQtYmRhMC02OTk3M2JhMzRiYTMiIHN0RXZ0OndoZW49IjIwMTktMDYtMjRUMDg6NDY6MjkrMDM6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE4IChXaW5kb3dzKSIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz51X1j6AAAAq0lEQVQ4jc1SsREDIQyTswMLQOmZKNmBUThaz+QSjk2cKp/8QT75++ZV+mSdJJvMDFfwuLR9T4Gcs5VSpmJKKZZznuaTADNjjAER2cgiYmMMMPPkgFZXEBFTVXjvQURorYGZEWOkvwQAoNZqvXcAQAgBKaVpeRlhU6Y3/+hXlgIiYq01hBDgvUfvfdfJYYRX/s/Mq9lXB6oK59yOGGMk5xxU9beDs7jhK5/FE4xzWvcg3Y20AAAAAElFTkSuQmCC"
											style="width: 16px; height: 16px; margin: 0px 2px;"></td>
									</tr>
								</tbody>
							</table>
						</div></td>
				</tr>
			</tbody>
		</table>
		<img
			src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAK4AAAAqCAYAAAAqLWAgAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDplNzEwYmIyZC01NmUyLTc2NDItOGUyMi01YmE3MjYwOWZiZTMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RjY0N0Q0REE5RTA2MTFFN0EwMEY4MTlBNDU0RjlFNjMiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RjY0N0Q0RDk5RTA2MTFFN0EwMEY4MTlBNDU0RjlFNjMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NTYxZDc3OWMtYjFkYS00NDQyLTgxZWYtMzU2ZDQ0Nzk0N2IyIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOmU3MTBiYjJkLTU2ZTItNzY0Mi04ZTIyLTViYTcyNjA5ZmJlMyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvXpS+8AAAedSURBVHja7Fxdrqs2ECbV2UC2wF1CIrVS+1ZYAmcJyXv7AOrtY28FD+17WEKyhNC3VmqlsISTLbCE0xnumE4cG8xfYm49EuIcMI7t+Tz+Zhi8en9/97j88dc/GzjFcETevZzgyL//9utCXFitVvW5+PNvfCb1+ksYfPdNwS9AXe+6e4oyOZTZm/4YPHeA0w7/hudWivsBnM66+5o6sXygay8bmwLuh95AgXo6daMbL0VdEdW1kW6VcCQm9fTU+U3fx+AF8feVBFpU6IUNDHYCO1DR/3j9DOVSzx7ZwSD4hsryBWiXJtB2I91AudRw8h4ZaK90eHTtTGWslRcG2jWbATnOOkB2xe77NDipYpaidcrglLVYo4TKzCHYpleDcoeFgvZONzCWlTQhtbqR6joy8CdkpStFPWgQPMPVrPdKIvCiWPEbvAD+sk7gkiXCAbrCA3eNhWs4IzOouLBQtxEu8W3LG1GAwFumNLpRAQmu1bqBPhYGS3tEVhppTampp6JJjuAt4Xpu24BwquAzrqQVAHCJh00Gic5xR7lYKr8kMdINAlEGo2S1xRhkunJUT07W2BvIQx8K3LU0SEuRnCxIQFa1zdpWVH5pMoVuuNXupGxUBi3wmvi1tcAVMzACOhAtSKkV49Zxh7XNmDOzJCkZJRqqm4BNdFM5Sc9aCdycKfUI4L3AEVN4bElWN1J44wFZjyVa2zvdQJ8uyFcpPNYXuOWACWMdBl4Yd60ApCFxmoAauyFPryJuWEA565SPXjEoMSGHIpW4IOd1WG5xqKV2K3VDjlRBnr2JbvqsOJUhRQlYXF0loWl8eYjFFY4XDlBIy+qVcSy0ZAcA8ZuNVpiUhu31BSejs0+8bqnWljterbqB/r71tMKLlRdN5KCgWZyw+G1Esxz/x5cQWwqR2SQZWd2YllfObU1lSJ+CBwK40Q2Lu97oBq5vKbTV5uj1cQq7xmTUG8HRFlcDYozrZnBs4d8961BsoVXiVvdMiuwVh+QKN7FeFGYaA/ox/a0jBHCY6KYYMMk2A3ixHcCVQJwzB8fWsNleUlAywos3UbIoU7VYuUdN2jbdCOAaRSVoQu6kZ+0DLr3ynWspfaQCCzbQxUCnQDxjEr/cSaGjyUWy6kN1IyITPr1BM+nX2lb/gFtcDIEdDAAcDPBOn8F1i57cVlay16VkFmqbFbje5xDYwQDAWt1QPoIYj7TtpQLdS0esWI9xzsgBE53GFxC14vmrXSoTe8MC2c+0uoO4I4XXUlIycr1EUAEpGaWeKFOHexiIbnQD/2e0kpRSmU7dIB9mGXIH6lcm9Stmqwgm4JysBS46YBTDPRA/SgmsWovEc3K/RJGUHBFolGMBZU2tUle8U0gT96RJdKeblnh0a04uJulQ7FcAdKepa85svumoAgIRjg/k3JxauN+rKnvsCwUv9jPUjAdavH2fJPYxKwgcRroxaQ9NNFW/RC7H1mbQoqzkfEguRA/wqHQZYeILiP+DCI7Jc2Gf2JZGN22ZXrb3qw1/g4HrxIn1VMGJEwdcJ04ccJ04uZcXNwSPkR8//drkw/728afqWc7tD798wtgtOmPV7z9/fHoOgnPO7ARrHSf17hOx66R2AHCmAy4ArNl3AAC2GglW8ZVw5N1mh+EEwpBYBr9x7ahDfH1bQNnQ4DdFeWX7ef800rQNxunqqMJjALuGAxV38NRfD9QvEqDMhUA1p4VFsL55/+UecBGJNBcqZ5OItr3BOKUOuA8Arfd5JxyeN4DB/IQO/t3bhsrOCdojA2xJbdjTuWQgOT4RvIni4DQmhnE9OI47r/BtjXDwQ85pCdwZAbb+BAeXTVhOs4lBu/ZuN0BJFL+RSUv2Af4vu2jD1IKUSXE5I79ATLwd/F9A2ZOzuNNbW5GkInjsHWhJUfWGHFQmmRq0JCmztNrfoOsJs7zWfCAA41S/xpb65KjCTNa2sRgq0Erg3c4BWrK2IsPr2vUbdF9Y2d3cvHsAeJs0UzAOkQPu9NLwWhjw3EApc+UGcK5qmn6aa563QQrJsXXAnVh8xm2f7ZF7PdtSap63DbiBA+60/DbQDPQzLT/SAKO2SOWs2rlGtTI54E4nlUUWq5L4rikv7rOqDBmXycQBdzqrwJfaZ2/KMaQtG8MVw+9Z32jaRLFxB9wHACZQDfYD5ToSuFVbnWCdfQPrPWX/72iYA+60wj+F6fy0HcA9l2XmW+ybbhG60/RDNRm6OHA0Md/fOeDOK3xXxbgNmGSR8TXrGxyTOkPgaFUMfD69HWuzkDGjADk93zYp475AG0ET+BYAV0HJHHCn934z5qCdVeBl+Qziu7E5vPiETaJUB17plW/lafZRoNfABZsMB019PLGoGJM6CeOEbeO/03wI6tIaZxBKCJGX3pI5Nzy9sM5nkK2cBCiTz99Pco4B5d6evdvN604EULHLo89AG7YBjbjtRVOfsLRG9XX0T0xmzqXxTWTigDs/eFODJbV+F69amg3yVWUJVTFbBXh1ztyriXU0rA/7s4f6Th30xKR/FYE2c1GFx9AG3d4FwgLvoUyo4ZNT8l0E4weyalcFYPH61nRJZ/XliuhDsy9DG2h7OJh121TZY/8KMAD0W9tx3mWyBAAAAABJRU5ErkJggg=="
			style="position: absolute; top: 50px; right: 42px; width: 87px; height: 21px;">
	</div>
	<div class="stiJsViewerAuthFormContainer"
		style="overflow: hidden; padding: 0px;">
		<div>
			<table class="stiJsViewerClearAllStyles" cellpadding="0"
				cellspacing="0" style="width: 100%;">
				<tbody>
					<tr class="stiJsViewerClearAllStyles">
						<td class="stiJsViewerClearAllStyles" style="width: 50%;"><table
								class="stiJsViewerClearAllStyles" cellpadding="0"
								cellspacing="0" style="margin: 0px auto;">
								<tbody>
									<tr class="stiJsViewerClearAllStyles"></tr>
									<tr class="stiJsViewerClearAllStyles">
										<td class="stiJsViewerClearAllStyles"><table
												class="stiJsViewerClearAllStyles" cellpadding="0"
												cellspacing="0">
												<tbody>
													<tr class="stiJsViewerClearAllStyles">
														<td class="stiJsViewerClearAllStyles"
															style="line-height: 0; background-color: rgb(242, 241, 241); width: 30px; text-align: center;"><img
															src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDAyIDc5LjE2NDM1MiwgMjAyMC8wMS8zMC0xNTo1MDozOCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjEgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkNGQzNFQTREQTQ2OTExRUFBQzFBQjcwQUVCQUVFNURFIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkNGQzNFQTRFQTQ2OTExRUFBQzFBQjcwQUVCQUVFNURFIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6Q0ZDM0VBNEJBNDY5MTFFQUFDMUFCNzBBRUJBRUU1REUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6Q0ZDM0VBNENBNDY5MTFFQUFDMUFCNzBBRUJBRUU1REUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7qFruUAAAApUlEQVR42mL8//8/AwhIeXQzIAFXIE4FYlkgfgzEs4F4N0zy2Y5SuEIWBkzgDMTtSHwlJP5udMVMWAxIZ8AOUrEJYjNAFocBssQa8BiHAY+JNWAWDgPmEGvAHiCuAuL7QPwHSoP4u7AZwILDtl24NBBywRkojkMTj0OSI+gFEMgF4iAoOwjKZyDFC4xAXAHEmkDsD+WTZADMdYGkhgHJYBgYABBgAAcgHJxJDtSoAAAAAElFTkSuQmCC"
															style="vertical-align: middle; opacity: 0.8; width: 16px; height: 16px;"></td>
														<td class="stiJsViewerClearAllStyles"><input
                              [(ngModel)]="login"
															name="null" title="{{loginInfo.AuthorizationTextUserName}}"
															class="stiJsViewerTextBox stiJsViewerTextBoxDefault"
															placeholder="{{loginInfo.AuthorizationTextUserName}}"
															style="font-family: Arial; width: 280px; height: 30px; line-height: 21px; box-sizing: content-box; background-color: rgb(242, 241, 241); border: none;"></td>
													</tr>
												</tbody>
											</table></td>
									</tr>
									<tr class="stiJsViewerClearAllStyles">
										<td class="stiJsViewerClearAllStyles"
											style="padding-top: 17px;"><table
												class="stiJsViewerClearAllStyles" cellpadding="0"
												cellspacing="0">
												<tbody>
													<tr class="stiJsViewerClearAllStyles">
														<td class="stiJsViewerClearAllStyles"
															style="line-height: 0; background-color: rgb(242, 241, 241); width: 30px; text-align: center;"><img
															src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDAyIDc5LjE2NDM1MiwgMjAyMC8wMS8zMC0xNTo1MDozOCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjEgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkNBNjE4NDExQTQ2OTExRUE4Qjg4OUQyMDc0MzI4QjQzIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkNBNjE4NDEyQTQ2OTExRUE4Qjg4OUQyMDc0MzI4QjQzIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6Q0E2MTg0MEZBNDY5MTFFQThCODg5RDIwNzQzMjhCNDMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6Q0E2MTg0MTBBNDY5MTFFQThCODg5RDIwNzQzMjhCNDMiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6i/NOXAAAA5UlEQVR42mKUdO9igAI7II4CYi0o/xoQLwXiwwx4AAuUzgLiJDQ5EyieB8TTcBnABMS2UM0TgNgSiPvQ1CRBXYfTgGgoex0Q/wbijVjUReEzAObnQCDmBGJ/LOq0CIUBCBRCMUmACRrahMBbfAYsI8IAWVzhwMyr4voQ6hVDAoZYQsPCAYiPAPEfmAsYoPFcBMRngPg7FD/GYogNELsghx1yIB6CYmQQjSNgQd5+AMR5LAScvRQphpCBFBD/gIUBoQC8DMRfoGGADASB+BsxBuAzxIKJhDSzDEs+YWAiMeFhGAIQYABSSCj4eeytwAAAAABJRU5ErkJggg=="
															style="vertical-align: middle; opacity: 0.8; width: 16px; height: 16px;"></td>
														<td class="stiJsViewerClearAllStyles"><input
                              [(ngModel)]="password"
                              (keydown)="keydown($event)"
															name="null" title="{{loginInfo.AuthorizationTextPassword}}"
															class="stiJsViewerTextBox stiJsViewerTextBoxDefault"
															placeholder="{{loginInfo.AuthorizationTextPassword}}" type="password"
															style="font-family: Arial; width: 280px; height: 30px; line-height: 21px; box-sizing: content-box; background-color: rgb(242, 241, 241); border: none;"></td>
													</tr>
												</tbody>
											</table></td>
									</tr>
									<tr class="stiJsViewerClearAllStyles">
										<td class="stiJsViewerClearAllStyles"><table
												class="stiJsViewerClearAllStyles" cellpadding="0"
												cellspacing="0" style="width: 100%;">
												<tbody>
													<tr class="stiJsViewerClearAllStyles">
														<td class="stiJsViewerClearAllStyles"
															style="padding-top: 20px;"><div
																class="stiJsViewerLoginButton stiJsViewerLoginButtonDefault"
																style="font-family: Arial; height: 40px; box-sizing: content-box; min-width: 80px; cursor: pointer; margin: 8px 0px 80px; display: inline-block;">
																<table class="stiJsViewerClearAllStyles" cellpadding="0"
                                (click)="doLogin()"
																	cellspacing="0" style="width: 100%; height: 100%;">
																	<tbody>
																		<tr class="stiJsViewerClearAllStyles">
																			<td class="stiJsViewerClearAllStyles"
																				style="padding: 0px 10px; white-space: nowrap; text-align: center;">{{loginInfo.AuthorizationWindowTitleLogin}}</td>
																		</tr>
																	</tbody>
																</table>
															</div></td>
													</tr>
												</tbody>
											</table></td>
									</tr>
								</tbody>
							</table></td>
					</tr>
					<tr class="stiJsViewerClearAllStyles">
						<td class="stiJsViewerClearAllStyles" colspan="2"
							style="text-align: center;"><div
								style="width: 380px; margin: 0px auto;"></div></td>
					</tr>
				</tbody>
			</table>
		</div>
	</div>
	<div class="stiJsViewerFormButtonsPanel" style="display: none;">
		<table class="stiJsViewerClearAllStyles" cellpadding="0"
			cellspacing="0">
			<tbody>
				<tr class="stiJsViewerClearAllStyles">
					<td class="stiJsViewerClearAllStyles" style="padding: 12px;"><div
							class="stiJsViewerFormButtonTheme stiJsViewerFormButtonThemeDefault"
							style="font-family: Arial; height: 23px; box-sizing: content-box; min-width: 80px;">
							<table class="stiJsViewerClearAllStyles" cellpadding="0"
								cellspacing="0" style="width: 100%; height: 100%;">
								<tbody>
									<tr class="stiJsViewerClearAllStyles">
										<td class="stiJsViewerClearAllStyles"
											style="padding: 0px 10px; white-space: nowrap; text-align: center; width: 100%;">OK</td>
									</tr>
								</tbody>
							</table>
						</div></td>
					<td class="stiJsViewerClearAllStyles"
						style="padding: 12px 12px 12px 0px;"><div
							class="stiJsViewerFormButton stiJsViewerFormButtonDefault"
							style="font-family: Arial; height: 23px; box-sizing: content-box; min-width: 80px;">
							<table class="stiJsViewerClearAllStyles" cellpadding="0"
								cellspacing="0" style="width: 100%; height: 100%;">
								<tbody>
									<tr class="stiJsViewerClearAllStyles">
										<td class="stiJsViewerClearAllStyles"
											style="padding: 0px 10px; white-space: nowrap; text-align: center; width: 100%;">Cancel</td>
									</tr>
								</tbody>
							</table>
						</div></td>
				</tr>
			</tbody>
		</table>
	</div>
</div>
<style>
  .stiJsViewerMainPanel *, .stiJsViewerMainPanel *:before, .stiJsViewerMainPanel *:after {
    box-sizing: content-box;
    border-collapse: initial;
}

.stiJsViewerForm {
    position: absolute;
    border: 1px solid #19478a;
    background: #ffffff;
    -moz-box-shadow: 0px 0px 7px rgba(0,0,0,0.6);
    -webkit-box-shadow: 0px 0px 7px rgb(0 0 0 / 60%);
    box-shadow: 0 0 7px rgb(0 0 0 / 30%);
    cursor: default;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    text-align: left;
    color: #202020;
}

.stiJsViewerClearAllStyles {
    padding: 0px;
    margin: 0px;
    border: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    line-height: normal;
}

.stiJsViewerAuthFormCaption {
    font-family: Arial;
    color: #7a8d8e;
    font-size: 28px;
}

.stiJsViewerAuthFormContainer {
    padding: 5px 10px 0px 10px;
    background: #ffffff;
    overflow-y: auto;
    overflow-x: hidden;
}

.stiJsViewerTextBoxDefault {
    border-radius: 3px;
    border: 1px solid #ababab;
}

.stiJsViewerTextBox {
    font-size: 12px;
    margin: 0px;
    padding: 0px 0px 0px 4px;
    -webkit-border-radius: 0px;
    outline: none;
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(hsla(0,0%,100%,0)), to(hsla(0,0%,100%,0)));
    background-image: -webkit-linear-gradient(hsla(0,0%,100%,0), hsla(0,0%,100%,0));
    background: #ffffff;
    color: #202020;
}

.stiJsViewerLoginButtonDefault {
    background: #19478a;
}

.stiJsViewerLoginButton {
    border: none;
    border-radius: 3px;
    height: 40px;
    color: white;
    cursor: default;
    font-family: Arial;
    font-size: 19px;
    width: 100%;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

.stiJsViewerLoginButton:hover {
    background: #3b629b;
}
</style>
  `
                }]
        }], ctorParameters: () => [], propDecorators: { loginInfo: [{
                type: Input
            }], onLogin: [{
                type: Output
            }] } });

class StiCellsPreviewComponent {
    constructor() {
        this.cellClick = new EventEmitter();
        this.startCellDrag = new EventEmitter();
    }
    get cells() {
        return new Array(this.object?.eParent?.rowLabels?.length).fill(1);
    }
    addCell(index) {
        this.cellClick.emit({ column: this.object, index: index + 1 });
    }
    startDragEvent(event, index) {
        this.startCellDrag.emit({ object: this.object, index: index + 1, event: event, isCell: true });
    }
    getValue(index) {
        return this.object["cells"][index].value;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiCellsPreviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiCellsPreviewComponent, selector: "sti-cells-preview", inputs: { state: "state", object: "object" }, outputs: { cellClick: "cellClick", startCellDrag: "startCellDrag" }, ngImport: i0, template: `<div [@slideInOut]="state ? 'in' : 'out'">
    <div
      *ngFor="let cell of cells; let i = index"
      class="cell-field"
      (dblclick)="addCell(i)"
      (mousedown)="startDragEvent($event, i)"
    >
      <span>{{ "Cell - " + (i + 1) }}</span>
    </div>
  </div>`, isInline: true, styles: [".cell-field{font-family:Segoe UI;color:var(--text-color);font-size:13px;-webkit-user-select:none;padding:3px 2px 3px 5px;margin-left:25px;border-radius:3px;display:flex}.cell-field:hover{background-color:#f0f0f0}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], animations: [SlideInOutAnimation] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiCellsPreviewComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-cells-preview", template: `<div [@slideInOut]="state ? 'in' : 'out'">
    <div
      *ngFor="let cell of cells; let i = index"
      class="cell-field"
      (dblclick)="addCell(i)"
      (mousedown)="startDragEvent($event, i)"
    >
      <span>{{ "Cell - " + (i + 1) }}</span>
    </div>
  </div>`, animations: [SlideInOutAnimation], styles: [".cell-field{font-family:Segoe UI;color:var(--text-color);font-size:13px;-webkit-user-select:none;padding:3px 2px 3px 5px;margin-left:25px;border-radius:3px;display:flex}.cell-field:hover{background-color:#f0f0f0}\n"] }]
        }], ctorParameters: () => [], propDecorators: { state: [{
                type: Input
            }], object: [{
                type: Input
            }], cellClick: [{
                type: Output
            }], startCellDrag: [{
                type: Output
            }] } });

class StiColumnsPreviewComponent {
    get columns() {
        let columns = [];
        this.object.columns.forEach((column) => {
            columns.push(column);
        });
        this.object.totalsFields.forEach((total) => {
            columns.push(total);
        });
        return columns;
    }
    isColumn(column) {
        return column instanceof StiColumnItem;
    }
    constructor() {
        this.fieldClick = new EventEmitter();
        this.startFieldDrag = new EventEmitter();
        this.arrayOfStates = [];
    }
    addTotal(column) {
        this.fieldClick.emit(column);
    }
    addCell(cellObject) {
        this.fieldClick.emit(cellObject);
    }
    startItemDrag(dragObject) {
        this.startFieldDrag.emit(dragObject);
    }
    ngOnInit() {
        this.columns?.forEach((field) => {
            if (this.isColumn(field)) {
                this.arrayOfStates.push({ element: field, state: "default" });
            }
        });
    }
    getState(element) {
        return this.arrayOfStates.find((item) => item.element == element).state;
    }
    changeState(element) {
        let index = this.arrayOfStates.findIndex((item) => item.element == element);
        this.arrayOfStates[index].state == "default"
            ? (this.arrayOfStates[index].state = "rotated")
            : (this.arrayOfStates[index].state = "default");
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiColumnsPreviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiColumnsPreviewComponent, selector: "sti-columns-preview", inputs: { state: "state", object: "object" }, outputs: { fieldClick: "fieldClick", startFieldDrag: "startFieldDrag" }, ngImport: i0, template: ` <div [@slideInOut]="state ? 'in' : 'out'">
    <div *ngFor="let column of columns; let i = index" class="column-field">
      <div
        class="field-content"
        [style.padding]="!isColumn(column) ? '3px 2px 3px 5px' : '3px 2px 3px 0px'"
        (click)="isColumn(column) ? changeState(column) : ''"
        (mousedown)="startItemDrag({ object: column, event: $event })"
        (dblclick)="!isColumn(column) ? addTotal(column) : ''"
      >
        <div *ngIf="isColumn(column)" class="arrow" [@rotatedState]="getState(column)">
          <i class="pi pi-chevron-right"></i>
        </div>
        <span>{{ column.label ? column.label : column.header ? column.header : "Column " + (i + 1) }}</span>
      </div>
      <sti-cells-preview
        *ngIf="isColumn(column)"
        (cellClick)="addCell($event)"
        (startCellDrag)="startItemDrag($event)"
        [object]="column"
        [state]="getState(column) == 'default' ? false : true"
      ></sti-cells-preview>
    </div>
  </div>`, isInline: true, styles: [".field-content{display:flex;border-radius:3px;padding:2px 5px;margin-left:5px}.field-content:hover{background-color:#f0f0f0}.arrow{width:20px;cursor:default;-webkit-touch-callout:none;-webkit-user-select:none;display:flex;align-items:center;justify-content:center}.arrow .pi{font-size:.625rem}.column-field{font-family:Segoe UI;color:var(--text-color);font-size:13px;-webkit-user-select:none;display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiCellsPreviewComponent, selector: "sti-cells-preview", inputs: ["state", "object"], outputs: ["cellClick", "startCellDrag"] }], animations: [SlideInOutAnimation, RotateAnimation] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiColumnsPreviewComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-columns-preview", template: ` <div [@slideInOut]="state ? 'in' : 'out'">
    <div *ngFor="let column of columns; let i = index" class="column-field">
      <div
        class="field-content"
        [style.padding]="!isColumn(column) ? '3px 2px 3px 5px' : '3px 2px 3px 0px'"
        (click)="isColumn(column) ? changeState(column) : ''"
        (mousedown)="startItemDrag({ object: column, event: $event })"
        (dblclick)="!isColumn(column) ? addTotal(column) : ''"
      >
        <div *ngIf="isColumn(column)" class="arrow" [@rotatedState]="getState(column)">
          <i class="pi pi-chevron-right"></i>
        </div>
        <span>{{ column.label ? column.label : column.header ? column.header : "Column " + (i + 1) }}</span>
      </div>
      <sti-cells-preview
        *ngIf="isColumn(column)"
        (cellClick)="addCell($event)"
        (startCellDrag)="startItemDrag($event)"
        [object]="column"
        [state]="getState(column) == 'default' ? false : true"
      ></sti-cells-preview>
    </div>
  </div>`, animations: [SlideInOutAnimation, RotateAnimation], styles: [".field-content{display:flex;border-radius:3px;padding:2px 5px;margin-left:5px}.field-content:hover{background-color:#f0f0f0}.arrow{width:20px;cursor:default;-webkit-touch-callout:none;-webkit-user-select:none;display:flex;align-items:center;justify-content:center}.arrow .pi{font-size:.625rem}.column-field{font-family:Segoe UI;color:var(--text-color);font-size:13px;-webkit-user-select:none;display:flex;flex-direction:column}\n"] }]
        }], ctorParameters: () => [], propDecorators: { state: [{
                type: Input
            }], object: [{
                type: Input
            }], fieldClick: [{
                type: Output
            }], startFieldDrag: [{
                type: Output
            }] } });

class StiExpressionEditorComponent {
    constructor(model, expressionService, loc, mouseService, editableService, cdr) {
        this.model = model;
        this.expressionService = expressionService;
        this.loc = loc;
        this.mouseService = mouseService;
        this.editableService = editableService;
        this.cdr = cdr;
        this.expressionString = "{}";
        this.currentSelectedMode = "functions";
        this.currentSelectedFunction = "value";
        this.canDragExpression = false;
        this.arrayOfSamples = [
            {
                functionName: "value",
                samples: ["Value('TextBox')", "Value('NumberBox')", "Value('Label')"],
                title: "Value of NumberBox, TextBox or Label element",
            },
            {
                functionName: "count",
                samples: ["Count(Col(1,'Table'))", "Count(Row('First','Table'))"],
                title: "Number of items in the list",
            },
            {
                functionName: "min",
                samples: ["Min(Col(1,'Table'))", "Min(Row('First','Table'))"],
                title: "The smallest number in list",
            },
            {
                functionName: "max",
                samples: ["Max(Col(1,'Table'))", "Max(Row('First','Table'))"],
                title: "The largest number in list",
            },
            {
                functionName: "sum",
                samples: ["Sum(Col(1,'Table'))", "Sum(Row('First','Table'))"],
                title: "Sum of all numbers in list",
            },
            {
                functionName: "cell",
                samples: ["Cell(columnId,rowId)", "Cell(columnId,rowId,'Table')"],
                title: "Number value of specified cell",
            },
            {
                functionName: "total",
                samples: ["Total(totalId)", "Total(totalId,'Table')"],
                title: "Value of Tables Totals field",
            },
            {
                functionName: "col",
                samples: ["Col(columnId)", "Col(columnId,'Table')"],
                title: "List of numbers which are cell values from specified column",
            },
            {
                functionName: "row",
                samples: ["Row(rowLabel)", "Row(rowLabel,'Table')"],
                title: "List of numbers which are cell values from specified row",
            },
            {
                functionName: "line",
                samples: ["Line"],
                title: "Returns the current table line number (starts from 1).",
            },
            {
                functionName: "today",
                samples: ["Today"],
                title: "Returns the current date in default format.",
            },
            {
                functionName: "time",
                samples: ["Time"],
                title: "Returns the current time in default format.",
            },
        ];
        this.arrayOfStates = [];
    }
    ngAfterViewInit() {
        this.expressionService.elementRef = this.elementRef;
    }
    ngOnDestroy() {
        this.mouseMoveSubscription?.unsubscribe();
        this.mouseUpSubscription?.unsubscribe();
        this.expressionUpdatingSubscription?.unsubscribe();
        this.expressionService.elementRef = null;
    }
    startExpressionDragging(dragObject) {
        this.startX = dragObject.event.clientX;
        this.startY = dragObject.event.clientY;
        this.canDragExpression = true;
        this.dragObject = dragObject;
    }
    setContent(innerText) {
        if (innerText == "" || innerText == null) {
            this.expressionString = innerText;
        }
        if (this.model.getBrowserType() == "safari" || this.model.getBrowserType() == "firefox") {
            this.cdr.detach();
        }
    }
    checkBrackets() {
        let haveCloseBreaket = false;
        let haveOpenBreaket = false;
        if (this.lastCaretPosition) {
            for (let i = this.lastCaretPosition - 1; i >= 0; i--) {
                if (this.expressionString[i] === "}") {
                    haveCloseBreaket = true;
                    break;
                }
                else if (this.expressionString[i] === "{") {
                    haveOpenBreaket = true;
                    break;
                }
            }
        }
        if (haveCloseBreaket || (!haveCloseBreaket && !haveOpenBreaket)) {
            return true;
        }
        else {
            return false;
        }
    }
    showInfo() {
        this.model.showHelpWindow = true;
    }
    addValue(element) {
        this.addFunction("Value", element.name, true);
    }
    changeMode(mode) {
        if (this.model.getBrowserType() == "safari" || this.model.getBrowserType() == "firefox") {
            this.cdr.reattach();
            this.cdr.detectChanges();
        }
        if (this.currentSelectedMode != mode && mode == "systemVariable") {
            this.currentSelectedFunction = "line";
        }
        else {
            this.currentSelectedFunction = "value";
        }
        this.currentSelectedMode = mode;
    }
    changeCurrentFuction(func) {
        this.currentSelectedFunction = func;
    }
    startDrag(event) {
        this.startX = event.clientX;
        this.startY = event.clientY;
        this.startComponentX = this.expressionService.componentX;
        this.startComponentY = this.expressionService.componentY;
        this.isDragging = true;
    }
    get samples() {
        return this.arrayOfSamples.find((sample) => sample.functionName == this.currentSelectedFunction).samples;
    }
    get title() {
        return this.arrayOfSamples.find((sample) => sample.functionName == this.currentSelectedFunction).title;
    }
    nestedFieldClick(field) {
        if (field instanceof StiTotalsFieldItem) {
            this.insertInExpression(this.lastCaretPosition, `Total(${field.eParent.totalsFields.indexOf(field) + 1},'${field.eParent.name}')`);
        }
        else {
            this.insertInExpression(this.lastCaretPosition, `Cell(${field.column.eParent.columns.indexOf(field.column) + 1},${field.index},'${field.column.eParent.name}')`);
        }
    }
    get fields() {
        let fields = [];
        this.model?.form?.pages?.forEach((page) => {
            page.allElements.forEach((element) => {
                if (this.haveExpression(element)) {
                    fields.push(element);
                }
            });
        });
        return fields;
    }
    isTable(element) {
        return element instanceof StiTableElement;
    }
    haveExpression(element) {
        return element instanceof StiTableElement ||
            element instanceof StiTextBoxElement ||
            element instanceof StiNumberBoxElement
            ? true
            : false;
    }
    addOperator(operator) {
        this.insertInExpression(this.lastCaretPosition, operator, true);
    }
    addFunction(func, name, filled = false) {
        let string = "";
        if (func.toLowerCase() == "value") {
            string = func + `('${name ? name : ""}')`;
        }
        else if (func.toLowerCase() == "line" || func.toLowerCase() == "today" || func.toLowerCase() == "time") {
            string = func;
        }
        else if (func.toLowerCase() == "cell") {
            string = func + "(,,'')";
        }
        else if (func.toLowerCase() == "total" || func.toLowerCase() == "col" || func.toLowerCase() == "row") {
            string = func + "(,'')";
        }
        else {
            string = func + "()";
        }
        this.insertInExpression(this.lastCaretPosition, string, false, filled ? false : true);
    }
    insertInExpression(position, string, isOperator = false, isFunction = false) {
        let needBrackets = isOperator ? false : this.checkBrackets();
        let previousString = this.expressionString;
        let insertedExpression = `${needBrackets ? "{" : ""}${string}${needBrackets ? "}" : ""}`;
        if (this.expressionString.length > 0 && position) {
            if (position == 0) {
                this.expressionString = insertedExpression + previousString;
            }
            else {
                this.expressionString =
                    previousString.slice(0, position) +
                        insertedExpression +
                        previousString.slice(position, previousString.length);
            }
        }
        else {
            this.expressionString += insertedExpression;
        }
        this.setCaret(insertedExpression, isFunction);
    }
    setCaret(insertedExpression, isFunction = false) {
        let leftBracketIndex = insertedExpression.indexOf("(");
        let carretOffset = 0;
        if (!this.lastCaretPosition) {
            this.lastCaretPosition = this.expressionString.length - insertedExpression.length;
        }
        if (isFunction) {
            if (insertedExpression[leftBracketIndex + 1] == "'") {
                carretOffset = this.lastCaretPosition + leftBracketIndex + 2;
            }
            else {
                carretOffset = this.lastCaretPosition + leftBracketIndex + 1;
            }
        }
        else {
            carretOffset = this.lastCaretPosition + insertedExpression.length;
        }
        let elem = this.elementRef.nativeElement;
        elem.focus();
        setTimeout(() => {
            var range = document.createRange();
            var sel = window.getSelection();
            range.setStart(elem.childNodes[0], carretOffset);
            range.collapse(true);
            this.lastCaretPosition += insertedExpression.length;
            sel.removeAllRanges();
            sel.addRange(range);
        });
    }
    save() {
        if (this.expressionService.currentSelectedObject instanceof StiLabelElement) {
            this.expressionService.currentSelectedObject.text.value = this.expressionString;
            this.model.formEvents.next({ name: "ValueChanged" });
        }
        else {
            this.expressionService.currentSelectedObject.expression = this.expressionString;
        }
        this.model.showExpressionEditor = false;
    }
    ngOnInit() {
        this.expressionService.componentX = (window.innerWidth - this.expressionService.componentWidth) / 2;
        this.expressionService.componentY = (window.innerHeight - this.expressionService.componentHeight) / 2;
        this.expressionString = this.expressionService.currentSelectedObject?.expression
            ? this.expressionService.currentSelectedObject?.expression
            : this.expressionService.currentSelectedObject?.text?.value
                ? this.expressionService.currentSelectedObject?.text?.value
                : "";
        this.fields?.forEach((field) => {
            if (this.isTable(field)) {
                this.arrayOfStates.push({ element: field, state: "default" });
            }
        });
        this.currentSelectedFunction = "value";
        this.currentSelectedMode = "functions";
        this.expressionUpdatingSubscription = this.expressionService.needToAddExpression.subscribe((object) => {
            this.addExpressionByDrag(object);
        });
        this.mouseUpSubscription = this.mouseService.getDocumentMouseUp().subscribe(() => {
            this.isDragging = false;
            this.canDragExpression = false;
        });
        this.mouseMoveSubscription = this.mouseService.getDocumentMouseMove().subscribe((event) => {
            this.onMouseMove(event);
        });
    }
    addExpressionByDrag(expressionObject) {
        if (this.expressionString.length == 0) {
            this.lastCaretPosition = 0;
        }
        else {
            this.lastCaretPosition = expressionObject.lastCaretOffset;
        }
        if (typeof expressionObject.startObject.object == "string") {
            if (expressionObject.startObject.object.length == 1) {
                this.addOperator(expressionObject.startObject.object);
            }
            else {
                this.addFunction(expressionObject.startObject.object);
            }
        }
        else {
            if (expressionObject.startObject.object instanceof StiFormElement) {
                this.addFunction("Value", expressionObject.startObject.object.name, true);
            }
            else {
                if (expressionObject.startObject.object instanceof StiTotalsFieldItem) {
                    this.insertInExpression(this.lastCaretPosition, `Total(${expressionObject.startObject.object.eParent.totalsFields.indexOf(expressionObject.startObject.object) + 1},'${expressionObject.startObject.object.eParent.name}')`);
                }
                else if (expressionObject.startObject.object instanceof StiColumnItem &&
                    !expressionObject.startObject.isCell) {
                    this.insertInExpression(this.lastCaretPosition, `Col(${expressionObject.startObject.object.eParent.columns.indexOf(expressionObject.startObject.object) + 1},'${expressionObject.startObject.object.eParent.name}')`);
                }
                else {
                    this.insertInExpression(this.lastCaretPosition, `Cell(${expressionObject.startObject.object.eParent.columns.indexOf(expressionObject.startObject.object) + 1},${expressionObject.startObject.index},'${expressionObject.startObject.object.eParent.name}')`);
                }
            }
        }
    }
    onMouseMove(event) {
        if (this.canDragExpression &&
            Math.max(Math.abs(this.startX - event.clientX), Math.abs(this.startY - event.clientY)) >
                StiExpressionService.MOUSE_DELTA) {
            this.expressionService.expressionDraggableContainerX = this.dragObject.event.clientX - 10;
            this.expressionService.expressionDraggableContainerY = this.dragObject.event.clientY - 10;
            this.expressionService.startContainerDrag(this.dragObject);
            this.canDragExpression = false;
        }
        if (this.isDragging) {
            let deltaX = event.clientX - this.startX;
            let deltaY = event.clientY - this.startY;
            if (this.startComponentX + deltaX < 0) {
                this.expressionService.componentX = 0;
            }
            else if (this.startComponentX + deltaX > window.innerWidth - this.expressionService.componentWidth) {
                this.expressionService.componentX = window.innerWidth - this.expressionService.componentWidth;
            }
            else {
                this.expressionService.componentX = this.startComponentX + deltaX;
            }
            if (this.startComponentY + deltaY < 0) {
                this.expressionService.componentY = 0;
            }
            else if (this.startComponentY + deltaY > window.innerHeight - this.expressionService.componentHeight) {
                this.expressionService.componentY = window.innerHeight - this.expressionService.componentHeight;
            }
            else {
                this.expressionService.componentY = this.startComponentY + deltaY;
            }
        }
    }
    getState(element) {
        return this.arrayOfStates.find((item) => item.element == element).state;
    }
    changeState(element) {
        let index = this.arrayOfStates.findIndex((item) => item.element == element);
        this.arrayOfStates[index].state == "default"
            ? (this.arrayOfStates[index].state = "rotated")
            : (this.arrayOfStates[index].state = "default");
    }
    focus() {
        this.expressionService.elementRef = this.elementRef;
    }
    blur() {
        if (this.model.getBrowserType() == "safari" || this.model.getBrowserType() == "firefox") {
            this.cdr.reattach();
            this.cdr.detectChanges();
        }
    }
    getCaret() {
        this.lastCaretPosition = this.expressionService.getCaretOffset(this.elementRef.nativeElement ?? this.elementRef);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiExpressionEditorComponent, deps: [{ token: StiModelService }, { token: StiExpressionService }, { token: StiLocalizationService }, { token: StiMouseService }, { token: StiEditableContentService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiExpressionEditorComponent, selector: "sti-expression-editor", viewQueries: [{ propertyName: "elementRef", first: true, predicate: ["expressionRef"], descendants: true }], ngImport: i0, template: `<div
    class="expression-editor-container"
    [style.left.px]="expressionService.componentX"
    [style.top.px]="expressionService.componentY"
    [style.pointer-events]="model.showHelpWindow ? 'none' : ''"
  >
    <div class="header-navigation" (mousedown)="startDrag($event)">
      <span>{{ loc.get2("FormTitles", "ExpressionEditorForm") }}</span>
      <div class="nav-button" (click)="showInfo()"><img [src]="model.getImage('images.Other.HelpIcon.png')" /></div>
      <div class="nav-button" (click)="model.showExpressionEditor = false">
        <img [src]="model.getImage('images.Other.CloseForm.png')" />
        <!-- <i class="pi pi-times"></i> -->
      </div>
    </div>
    <div
      class="expression-preview {{ expressionService.isDragging ? 'dragging-over' : '' }}"
      (click)="expressionRef.focus()"
    >
      <label
        [id]="'expressionLabel'"
        #expressionRef
        contenteditable="plaintext-only"
        (mouseup)="getCaret()"
        (input)="setContent($event.target.textContent)"
        (blur)="expressionString = $event.target.textContent"
        (keyup)="getCaret()"
        spellcheck="false"
        [textContent]="expressionString"
        [style.cursor]="expressionService.isDragging ? 'default' : 'text'"
      ></label>
    </div>
    <div class="expression-navigation">
      <div
        class="expression-functions column"
        [style.width]="currentSelectedMode == 'functions' || currentSelectedMode == 'systemVariable' ? '100%' : '30%'"
      >
        <div class="column-content">
          <span
            class="column-item {{ currentSelectedMode == 'functions' ? 'selected' : '' }}"
            (click)="changeMode('functions')"
          >
            {{ loc.getP("Functions") }}
          </span>
          <span
            class="column-item {{ currentSelectedMode == 'elements' ? 'selected' : '' }}"
            (click)="changeMode('elements')"
          >
            {{ loc.get2("Report", "Components") }}
          </span>
          <span
            class="column-item {{ currentSelectedMode == 'systemVariable' ? 'selected' : '' }}"
            (click)="changeMode('systemVariable')"
          >
            {{ loc.getP("SystemVariable") }}
          </span>
          <span
            class="column-item {{ currentSelectedMode == 'operators' ? 'selected' : '' }}"
            (click)="changeMode('operators')"
          >
            {{ loc.get2("MathFormula", "Operators") }}
          </span>
        </div>
      </div>
      <div
        class="expression-operators column"
        *ngIf="currentSelectedMode == 'functions' || currentSelectedMode == 'systemVariable'"
      >
        <div class="column-content" *ngIf="currentSelectedMode == 'functions'">
          <span
            class="column-item {{ currentSelectedFunction == 'value' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('value')"
            (mousedown)="startExpressionDragging({ object: 'Value', event: $event })"
            (dblclick)="addFunction('Value')"
          >
            {{ "Value()" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'count' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('count')"
            (mousedown)="startExpressionDragging({ object: 'Count', event: $event })"
            (dblclick)="addFunction('Count')"
          >
            {{ "Count()" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'min' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('min')"
            (mousedown)="startExpressionDragging({ object: 'Min', event: $event })"
            (dblclick)="addFunction('Min')"
          >
            {{ "Min()" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'max' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('max')"
            (mousedown)="startExpressionDragging({ object: 'Max', event: $event })"
            (dblclick)="addFunction('Max')"
          >
            {{ "Max()" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'sum' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('sum')"
            (mousedown)="startExpressionDragging({ object: 'Sum', event: $event })"
            (dblclick)="addFunction('Sum')"
          >
            {{ "Sum()" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'cell' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('cell')"
            (mousedown)="startExpressionDragging({ object: 'Cell', event: $event })"
            (dblclick)="addFunction('Cell')"
          >
            {{ "Cell()" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'total' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('total')"
            (mousedown)="startExpressionDragging({ object: 'Total', event: $event })"
            (dblclick)="addFunction('Total')"
          >
            {{ "Total()" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'col' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('col')"
            (mousedown)="startExpressionDragging({ object: 'Col', event: $event })"
            (dblclick)="addFunction('Col')"
          >
            {{ "Col()" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'row' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('row')"
            (mousedown)="startExpressionDragging({ object: 'Row', event: $event })"
            (dblclick)="addFunction('Row')"
          >
            {{ "Row()" }}
          </span>
        </div>
        <div class="column-content" *ngIf="currentSelectedMode == 'systemVariable'">
          <span
            class="column-item {{ currentSelectedFunction == 'line' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('line')"
            (mousedown)="startExpressionDragging({ object: 'Line', event: $event })"
            (dblclick)="addFunction('Line')"
          >
            {{ "Line" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'today' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('today')"
            (mousedown)="startExpressionDragging({ object: 'Today', event: $event })"
            (dblclick)="addFunction('Today')"
          >
            {{ "Today" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'time' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('time')"
            (mousedown)="startExpressionDragging({ object: 'Time', event: $event })"
            (dblclick)="addFunction('Time')"
          >
            {{ "Time" }}
          </span>
        </div>
      </div>
      <div class="expression-fields column">
        <div
          class="column-content"
          *ngIf="currentSelectedMode == 'functions' || currentSelectedMode == 'systemVariable'"
        >
          <div *ngFor="let sample of samples" class="sample-item">
            <span>{{ sample }}</span>
          </div>
          <div class="sample-item" [style.padding]="'15px 0px'">
            <span>{{ title }}</span>
          </div>
        </div>
        <div class="column-content" *ngIf="currentSelectedMode == 'operators'">
          <span
            class="operator-item"
            [stiTooltip]="loc.get2('Shapes', 'Plus')"
            tooltipPosition="bottom"
            showDelay="500"
            (dblclick)="addOperator('+')"
            (mousedown)="startExpressionDragging({ object: '+', event: $event })"
            >+</span
          >
          <span
            class="operator-item"
            [stiTooltip]="loc.get2('Shapes', 'Minus')"
            tooltipPosition="bottom"
            showDelay="500"
            (mousedown)="startExpressionDragging({ object: '-', event: $event })"
            (dblclick)="addOperator('-')"
            >-</span
          >
          <span
            class="operator-item"
            [stiTooltip]="loc.get2('Shapes', 'Multiply')"
            tooltipPosition="bottom"
            showDelay="500"
            (mousedown)="startExpressionDragging({ object: '*', event: $event })"
            (dblclick)="addOperator('*')"
            >*</span
          >
          <span
            class="operator-item"
            [stiTooltip]="loc.get2('Shapes', 'Division')"
            tooltipPosition="bottom"
            showDelay="500"
            (mousedown)="startExpressionDragging({ object: '/', event: $event })"
            (dblclick)="addOperator('/')"
            >/</span
          >
        </div>
        <div class="column-content" *ngIf="currentSelectedMode == 'elements'">
          <div *ngFor="let field of fields">
            <div
              class="column-item field"
              [style.padding]="isTable(field) ? '4px 5px 4px 0px' : '4px 5px'"
              (click)="isTable(field) ? changeState(field) : ''"
              (mousedown)="!isTable(field) ? startExpressionDragging({ object: field, event: $event }) : ''"
              (dblclick)="!isTable(field) ? addValue(field) : ''"
            >
              <div *ngIf="isTable(field)" class="arrow" [@rotatedState]="getState(field)">
                <i class="pi pi-chevron-right"></i>
              </div>
              <span>{{ field.name }}</span>
            </div>
            <sti-columns-preview
              *ngIf="isTable(field)"
              [object]="field"
              (fieldClick)="nestedFieldClick($event)"
              (startFieldDrag)="startExpressionDragging($event)"
              [state]="getState(field) == 'default' ? false : true"
            ></sti-columns-preview>
          </div>
        </div>
      </div>
    </div>
    <div class="footer-navigation">
      <div class="footer-button accept" (click)="save()" [style.margin-right.px]="0">
        <span>{{ loc.get2("Buttons", "Save") }}</span>
      </div>
      <div class="footer-button cancel" (click)="model.showExpressionEditor = false">
        <span>{{ loc.getP("Cancel") }}</span>
      </div>
    </div>
  </div>`, isInline: true, styles: [".arrow{width:20px;cursor:default;-webkit-touch-callout:none;-webkit-user-select:none;display:flex;align-items:center;justify-content:center}.arrow .pi{font-size:.625rem}.pi{font-size:.825rem}.selected{background-color:#e5e5e5}.expression-editor-container{position:absolute;font-size:13px;font-family:Arial;color:var(--text-color);min-height:480px;width:700px;border-radius:5px;left:calc(50% - 350px);top:calc(50% - 250px);display:flex;flex-direction:column;border:1px solid rgb(28,71,134);background-color:#fff;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;z-index:999}.header-navigation{display:flex;height:40px;align-items:center;padding-left:15px;padding-right:5px;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a;color:#fff;-webkit-user-select:none}.header-navigation span{width:100%;font-size:17px;-webkit-user-select:none;cursor:default}.nav-button{height:24px;width:28px;border-radius:3px;display:flex;align-items:center;justify-content:center;align-self:start;margin-top:5px}.nav-button:hover{background-color:#d3d3d3}.nav-button img{height:16px;width:16px;filter:brightness(0) invert(1)}.expression-preview{width:calc(100% - 20px);margin:10px 10px 5px;padding:5px;background-color:#fafafa;border:1px solid lightgray;height:135px;-webkit-user-select:text;display:flex}.expression-preview label{-webkit-user-select:text;font-size:13px;outline:none;height:100%;width:100%;overflow:auto}.dragging-over{background-color:#ebebeb!important;border:1px dashed black!important}.expression-navigation{display:flex;width:100%;padding:0 5px}.column{border:1px solid lightgray;height:230px;width:100%;margin:5px}.buttons{height:250px;min-width:150px;display:flex;flex-direction:column;justify-content:center;align-items:center}.buttons img{height:52px;width:52px;border-radius:3px;margin:5px;padding:10px}.buttons img:hover{background-color:#d3d3d3}.column-header{-webkit-user-select:none;height:30px;background-color:#d3d3d3;display:flex;align-items:center;padding:0 10px;border-top-left-radius:4px;border-top-right-radius:4px}.column-header span{font-size:15px;-webkit-user-select:none;cursor:default}.footer-navigation{width:100%;display:flex;justify-content:flex-end;height:50px;align-items:center}.footer-button{min-width:90px;height:30px;border-radius:3px;display:flex;align-items:center;justify-content:center;margin:0 10px;-webkit-user-select:none;font-size:12px}.accept{background-color:#19478a;color:#fff}.accept:hover{background-color:#3d6298}.cancel{background-color:#ddd;color:#444}.cancel:hover{background-color:#d5d5d5}.column-content{width:100%;padding:5px;display:flex;max-height:229px;overflow-y:auto;flex-direction:column}.operator-item{font-family:Arial;color:var(--text-color);font-size:17px;padding:2px 7px;border-radius:3px;-webkit-user-select:none}.operator-item:hover{background-color:#f0f0f0}.sample-item{font-family:Arial;color:var(--text-color);font-size:12px;-webkit-user-select:none;padding-bottom:3px;cursor:default}.column-item{font-family:Arial;color:var(--text-color);font-size:12px;-webkit-user-select:none;padding:5px;cursor:default}.column-item:hover{background-color:#f0f0f0}.info{height:30px;width:30px;display:flex;align-items:center;justify-content:center}.info img{height:16px;width:16px;cursor:pointer}.field{display:flex;align-items:center}.field img{height:16px;width:16px;margin-right:5px}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiColumnsPreviewComponent, selector: "sti-columns-preview", inputs: ["state", "object"], outputs: ["fieldClick", "startFieldDrag"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }], animations: [RotateAnimation] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiExpressionEditorComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-expression-editor", template: `<div
    class="expression-editor-container"
    [style.left.px]="expressionService.componentX"
    [style.top.px]="expressionService.componentY"
    [style.pointer-events]="model.showHelpWindow ? 'none' : ''"
  >
    <div class="header-navigation" (mousedown)="startDrag($event)">
      <span>{{ loc.get2("FormTitles", "ExpressionEditorForm") }}</span>
      <div class="nav-button" (click)="showInfo()"><img [src]="model.getImage('images.Other.HelpIcon.png')" /></div>
      <div class="nav-button" (click)="model.showExpressionEditor = false">
        <img [src]="model.getImage('images.Other.CloseForm.png')" />
        <!-- <i class="pi pi-times"></i> -->
      </div>
    </div>
    <div
      class="expression-preview {{ expressionService.isDragging ? 'dragging-over' : '' }}"
      (click)="expressionRef.focus()"
    >
      <label
        [id]="'expressionLabel'"
        #expressionRef
        contenteditable="plaintext-only"
        (mouseup)="getCaret()"
        (input)="setContent($event.target.textContent)"
        (blur)="expressionString = $event.target.textContent"
        (keyup)="getCaret()"
        spellcheck="false"
        [textContent]="expressionString"
        [style.cursor]="expressionService.isDragging ? 'default' : 'text'"
      ></label>
    </div>
    <div class="expression-navigation">
      <div
        class="expression-functions column"
        [style.width]="currentSelectedMode == 'functions' || currentSelectedMode == 'systemVariable' ? '100%' : '30%'"
      >
        <div class="column-content">
          <span
            class="column-item {{ currentSelectedMode == 'functions' ? 'selected' : '' }}"
            (click)="changeMode('functions')"
          >
            {{ loc.getP("Functions") }}
          </span>
          <span
            class="column-item {{ currentSelectedMode == 'elements' ? 'selected' : '' }}"
            (click)="changeMode('elements')"
          >
            {{ loc.get2("Report", "Components") }}
          </span>
          <span
            class="column-item {{ currentSelectedMode == 'systemVariable' ? 'selected' : '' }}"
            (click)="changeMode('systemVariable')"
          >
            {{ loc.getP("SystemVariable") }}
          </span>
          <span
            class="column-item {{ currentSelectedMode == 'operators' ? 'selected' : '' }}"
            (click)="changeMode('operators')"
          >
            {{ loc.get2("MathFormula", "Operators") }}
          </span>
        </div>
      </div>
      <div
        class="expression-operators column"
        *ngIf="currentSelectedMode == 'functions' || currentSelectedMode == 'systemVariable'"
      >
        <div class="column-content" *ngIf="currentSelectedMode == 'functions'">
          <span
            class="column-item {{ currentSelectedFunction == 'value' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('value')"
            (mousedown)="startExpressionDragging({ object: 'Value', event: $event })"
            (dblclick)="addFunction('Value')"
          >
            {{ "Value()" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'count' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('count')"
            (mousedown)="startExpressionDragging({ object: 'Count', event: $event })"
            (dblclick)="addFunction('Count')"
          >
            {{ "Count()" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'min' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('min')"
            (mousedown)="startExpressionDragging({ object: 'Min', event: $event })"
            (dblclick)="addFunction('Min')"
          >
            {{ "Min()" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'max' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('max')"
            (mousedown)="startExpressionDragging({ object: 'Max', event: $event })"
            (dblclick)="addFunction('Max')"
          >
            {{ "Max()" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'sum' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('sum')"
            (mousedown)="startExpressionDragging({ object: 'Sum', event: $event })"
            (dblclick)="addFunction('Sum')"
          >
            {{ "Sum()" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'cell' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('cell')"
            (mousedown)="startExpressionDragging({ object: 'Cell', event: $event })"
            (dblclick)="addFunction('Cell')"
          >
            {{ "Cell()" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'total' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('total')"
            (mousedown)="startExpressionDragging({ object: 'Total', event: $event })"
            (dblclick)="addFunction('Total')"
          >
            {{ "Total()" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'col' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('col')"
            (mousedown)="startExpressionDragging({ object: 'Col', event: $event })"
            (dblclick)="addFunction('Col')"
          >
            {{ "Col()" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'row' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('row')"
            (mousedown)="startExpressionDragging({ object: 'Row', event: $event })"
            (dblclick)="addFunction('Row')"
          >
            {{ "Row()" }}
          </span>
        </div>
        <div class="column-content" *ngIf="currentSelectedMode == 'systemVariable'">
          <span
            class="column-item {{ currentSelectedFunction == 'line' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('line')"
            (mousedown)="startExpressionDragging({ object: 'Line', event: $event })"
            (dblclick)="addFunction('Line')"
          >
            {{ "Line" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'today' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('today')"
            (mousedown)="startExpressionDragging({ object: 'Today', event: $event })"
            (dblclick)="addFunction('Today')"
          >
            {{ "Today" }}
          </span>
          <span
            class="column-item {{ currentSelectedFunction == 'time' ? 'selected' : '' }}"
            (click)="changeCurrentFuction('time')"
            (mousedown)="startExpressionDragging({ object: 'Time', event: $event })"
            (dblclick)="addFunction('Time')"
          >
            {{ "Time" }}
          </span>
        </div>
      </div>
      <div class="expression-fields column">
        <div
          class="column-content"
          *ngIf="currentSelectedMode == 'functions' || currentSelectedMode == 'systemVariable'"
        >
          <div *ngFor="let sample of samples" class="sample-item">
            <span>{{ sample }}</span>
          </div>
          <div class="sample-item" [style.padding]="'15px 0px'">
            <span>{{ title }}</span>
          </div>
        </div>
        <div class="column-content" *ngIf="currentSelectedMode == 'operators'">
          <span
            class="operator-item"
            [stiTooltip]="loc.get2('Shapes', 'Plus')"
            tooltipPosition="bottom"
            showDelay="500"
            (dblclick)="addOperator('+')"
            (mousedown)="startExpressionDragging({ object: '+', event: $event })"
            >+</span
          >
          <span
            class="operator-item"
            [stiTooltip]="loc.get2('Shapes', 'Minus')"
            tooltipPosition="bottom"
            showDelay="500"
            (mousedown)="startExpressionDragging({ object: '-', event: $event })"
            (dblclick)="addOperator('-')"
            >-</span
          >
          <span
            class="operator-item"
            [stiTooltip]="loc.get2('Shapes', 'Multiply')"
            tooltipPosition="bottom"
            showDelay="500"
            (mousedown)="startExpressionDragging({ object: '*', event: $event })"
            (dblclick)="addOperator('*')"
            >*</span
          >
          <span
            class="operator-item"
            [stiTooltip]="loc.get2('Shapes', 'Division')"
            tooltipPosition="bottom"
            showDelay="500"
            (mousedown)="startExpressionDragging({ object: '/', event: $event })"
            (dblclick)="addOperator('/')"
            >/</span
          >
        </div>
        <div class="column-content" *ngIf="currentSelectedMode == 'elements'">
          <div *ngFor="let field of fields">
            <div
              class="column-item field"
              [style.padding]="isTable(field) ? '4px 5px 4px 0px' : '4px 5px'"
              (click)="isTable(field) ? changeState(field) : ''"
              (mousedown)="!isTable(field) ? startExpressionDragging({ object: field, event: $event }) : ''"
              (dblclick)="!isTable(field) ? addValue(field) : ''"
            >
              <div *ngIf="isTable(field)" class="arrow" [@rotatedState]="getState(field)">
                <i class="pi pi-chevron-right"></i>
              </div>
              <span>{{ field.name }}</span>
            </div>
            <sti-columns-preview
              *ngIf="isTable(field)"
              [object]="field"
              (fieldClick)="nestedFieldClick($event)"
              (startFieldDrag)="startExpressionDragging($event)"
              [state]="getState(field) == 'default' ? false : true"
            ></sti-columns-preview>
          </div>
        </div>
      </div>
    </div>
    <div class="footer-navigation">
      <div class="footer-button accept" (click)="save()" [style.margin-right.px]="0">
        <span>{{ loc.get2("Buttons", "Save") }}</span>
      </div>
      <div class="footer-button cancel" (click)="model.showExpressionEditor = false">
        <span>{{ loc.getP("Cancel") }}</span>
      </div>
    </div>
  </div>`, animations: [RotateAnimation], styles: [".arrow{width:20px;cursor:default;-webkit-touch-callout:none;-webkit-user-select:none;display:flex;align-items:center;justify-content:center}.arrow .pi{font-size:.625rem}.pi{font-size:.825rem}.selected{background-color:#e5e5e5}.expression-editor-container{position:absolute;font-size:13px;font-family:Arial;color:var(--text-color);min-height:480px;width:700px;border-radius:5px;left:calc(50% - 350px);top:calc(50% - 250px);display:flex;flex-direction:column;border:1px solid rgb(28,71,134);background-color:#fff;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;z-index:999}.header-navigation{display:flex;height:40px;align-items:center;padding-left:15px;padding-right:5px;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a;color:#fff;-webkit-user-select:none}.header-navigation span{width:100%;font-size:17px;-webkit-user-select:none;cursor:default}.nav-button{height:24px;width:28px;border-radius:3px;display:flex;align-items:center;justify-content:center;align-self:start;margin-top:5px}.nav-button:hover{background-color:#d3d3d3}.nav-button img{height:16px;width:16px;filter:brightness(0) invert(1)}.expression-preview{width:calc(100% - 20px);margin:10px 10px 5px;padding:5px;background-color:#fafafa;border:1px solid lightgray;height:135px;-webkit-user-select:text;display:flex}.expression-preview label{-webkit-user-select:text;font-size:13px;outline:none;height:100%;width:100%;overflow:auto}.dragging-over{background-color:#ebebeb!important;border:1px dashed black!important}.expression-navigation{display:flex;width:100%;padding:0 5px}.column{border:1px solid lightgray;height:230px;width:100%;margin:5px}.buttons{height:250px;min-width:150px;display:flex;flex-direction:column;justify-content:center;align-items:center}.buttons img{height:52px;width:52px;border-radius:3px;margin:5px;padding:10px}.buttons img:hover{background-color:#d3d3d3}.column-header{-webkit-user-select:none;height:30px;background-color:#d3d3d3;display:flex;align-items:center;padding:0 10px;border-top-left-radius:4px;border-top-right-radius:4px}.column-header span{font-size:15px;-webkit-user-select:none;cursor:default}.footer-navigation{width:100%;display:flex;justify-content:flex-end;height:50px;align-items:center}.footer-button{min-width:90px;height:30px;border-radius:3px;display:flex;align-items:center;justify-content:center;margin:0 10px;-webkit-user-select:none;font-size:12px}.accept{background-color:#19478a;color:#fff}.accept:hover{background-color:#3d6298}.cancel{background-color:#ddd;color:#444}.cancel:hover{background-color:#d5d5d5}.column-content{width:100%;padding:5px;display:flex;max-height:229px;overflow-y:auto;flex-direction:column}.operator-item{font-family:Arial;color:var(--text-color);font-size:17px;padding:2px 7px;border-radius:3px;-webkit-user-select:none}.operator-item:hover{background-color:#f0f0f0}.sample-item{font-family:Arial;color:var(--text-color);font-size:12px;-webkit-user-select:none;padding-bottom:3px;cursor:default}.column-item{font-family:Arial;color:var(--text-color);font-size:12px;-webkit-user-select:none;padding:5px;cursor:default}.column-item:hover{background-color:#f0f0f0}.info{height:30px;width:30px;display:flex;align-items:center;justify-content:center}.info img{height:16px;width:16px;cursor:pointer}.field{display:flex;align-items:center}.field img{height:16px;width:16px;margin-right:5px}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiExpressionService }, { type: StiLocalizationService }, { type: StiMouseService }, { type: StiEditableContentService }, { type: i0.ChangeDetectorRef }], propDecorators: { elementRef: [{
                type: ViewChild,
                args: ["expressionRef"]
            }] } });

class StiColorDialogComponent {
    get colorRowsCount() {
        return new Array(5).fill(1);
    }
    get colorColumnsCount() {
        return new Array(10).fill(2);
    }
    getColor(index, type) {
        return type == "theme"
            ? `rgb(${this.colorService?.themeColors[index].color})`
            : `rgb(${this.colorService?.standardColors[index].color})`;
    }
    setTransparent() {
        this.colorService.currentColorObject.a = 0;
        if (this.colorService.isRichText) {
            this.richText.insertForeColor();
        }
        this.model.showColorDialog = false;
    }
    setColor(color) {
        this.colorService.currentColorObject.hexColor = this.colorService.rgbToHex(color.replace("rgb(", "").replace(")", ""));
        if (this.colorService.isRichText) {
            this.richText.insertForeColor();
        }
        this.model.showColorDialog = false;
    }
    constructor(colorService, model, loc, richText) {
        this.colorService = colorService;
        this.model = model;
        this.loc = loc;
        this.richText = richText;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiColorDialogComponent, deps: [{ token: StiColorDialogService }, { token: StiModelService }, { token: StiLocalizationService }, { token: StiRichTextService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiColorDialogComponent, selector: "sti-color-dialog", ngImport: i0, template: `<div class="color-dialog" [style.left.px]="colorService.dialogX" [style.top.px]="colorService.dialogY">
    <div class="header">
      <span>{{ loc.get2("Gui", "colorpicker_themecolorslabel") }}</span>
    </div>
    <div class="color-preview">
      <div class="preview-row">
        <div
          class="color-button"
          *ngFor="let column of colorColumnsCount; let i = index"
          [style.background-color]="getColor(i, 'theme')"
          [style.margin-bottom.px]="6"
          (click)="setColor(getColor(i, 'theme'))"
        ></div>
      </div>
      <div class="preview-row" *ngFor="let row of colorRowsCount; let ind = index">
        <div
          class="color-button"
          *ngFor="let column of colorColumnsCount; let idx = index"
          [style.background-color]="getColor((ind + 1) * colorColumnsCount.length + idx, 'theme')"
          (click)="setColor(getColor((ind + 1) * colorColumnsCount.length + idx, 'theme'))"
        ></div>
      </div>
    </div>
    <div class="header">
      <span>{{ loc.get2("Gui", "colorpicker_standardcolorslabel") }}</span>
    </div>
    <div class="color-preview" [style.border-bottom]="'1px dotted rgb(226,228,231)'">
      <div class="preview-row">
        <div
          class="color-button"
          *ngFor="let column of colorColumnsCount; let id = index"
          [style.background-color]="getColor(id, 'standard')"
          (click)="setColor(getColor(id, 'standard'))"
        ></div>
      </div>
    </div>
    <div class="transparent panel" [style.border-bottom]="'1px dotted rgb(226,228,231)'" (click)="setTransparent()">
      <img [src]="model.getImage('images.Other.TransparentColorIcon.png')" />
      <span>{{ loc.get2("Gui", "colorpicker_nofill").replace("&amp", "").replace(";", "") }}</span>
    </div>
    <div class="other-colors panel" (click)="model.showMoreColorDialog = true; model.showColorDialog = false">
      <img [src]="model.getImage('images.Other.MoreColorsIcon.png')" />
      <span>{{ loc.get2("Gui", "colorpicker_morecolors").replace("&amp", "").replace(";", "") }}</span>
    </div>
  </div>`, isInline: true, styles: [".color-dialog{position:absolute;left:calc(50% - 92.5px);top:calc(50% - 112.5px);padding:1px;width:185px;min-height:225px;border-radius:3px;border:1px solid #c6c6c6;background-color:var(--back-color);color:var(--text-color);-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;cursor:default;display:flex;flex-direction:column;z-index:999999}.header{width:100%;height:26px;background:#eee;font-family:Arial;font-size:12px;color:#8f8f8f;cursor:default;display:flex;align-items:center;padding-left:7px;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none}.color-preview{width:100%;display:flex;flex-direction:column}.preview-row{width:100%;display:flex}.color-button{height:14px;width:14px;border:1px solid rgb(226,228,231);cursor:default;margin:2px}.color-button:hover{border-color:#f29436}.panel{width:100%;display:flex;cursor:default;color:#444;font-family:Arial;font-size:12px;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;height:25px;align-items:center;border-radius:3px}.panel:hover{background-color:#dadada}.panel img{width:16px;height:16px;margin:0 4px}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiColorDialogComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-color-dialog", template: `<div class="color-dialog" [style.left.px]="colorService.dialogX" [style.top.px]="colorService.dialogY">
    <div class="header">
      <span>{{ loc.get2("Gui", "colorpicker_themecolorslabel") }}</span>
    </div>
    <div class="color-preview">
      <div class="preview-row">
        <div
          class="color-button"
          *ngFor="let column of colorColumnsCount; let i = index"
          [style.background-color]="getColor(i, 'theme')"
          [style.margin-bottom.px]="6"
          (click)="setColor(getColor(i, 'theme'))"
        ></div>
      </div>
      <div class="preview-row" *ngFor="let row of colorRowsCount; let ind = index">
        <div
          class="color-button"
          *ngFor="let column of colorColumnsCount; let idx = index"
          [style.background-color]="getColor((ind + 1) * colorColumnsCount.length + idx, 'theme')"
          (click)="setColor(getColor((ind + 1) * colorColumnsCount.length + idx, 'theme'))"
        ></div>
      </div>
    </div>
    <div class="header">
      <span>{{ loc.get2("Gui", "colorpicker_standardcolorslabel") }}</span>
    </div>
    <div class="color-preview" [style.border-bottom]="'1px dotted rgb(226,228,231)'">
      <div class="preview-row">
        <div
          class="color-button"
          *ngFor="let column of colorColumnsCount; let id = index"
          [style.background-color]="getColor(id, 'standard')"
          (click)="setColor(getColor(id, 'standard'))"
        ></div>
      </div>
    </div>
    <div class="transparent panel" [style.border-bottom]="'1px dotted rgb(226,228,231)'" (click)="setTransparent()">
      <img [src]="model.getImage('images.Other.TransparentColorIcon.png')" />
      <span>{{ loc.get2("Gui", "colorpicker_nofill").replace("&amp", "").replace(";", "") }}</span>
    </div>
    <div class="other-colors panel" (click)="model.showMoreColorDialog = true; model.showColorDialog = false">
      <img [src]="model.getImage('images.Other.MoreColorsIcon.png')" />
      <span>{{ loc.get2("Gui", "colorpicker_morecolors").replace("&amp", "").replace(";", "") }}</span>
    </div>
  </div>`, styles: [".color-dialog{position:absolute;left:calc(50% - 92.5px);top:calc(50% - 112.5px);padding:1px;width:185px;min-height:225px;border-radius:3px;border:1px solid #c6c6c6;background-color:var(--back-color);color:var(--text-color);-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;cursor:default;display:flex;flex-direction:column;z-index:999999}.header{width:100%;height:26px;background:#eee;font-family:Arial;font-size:12px;color:#8f8f8f;cursor:default;display:flex;align-items:center;padding-left:7px;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none}.color-preview{width:100%;display:flex;flex-direction:column}.preview-row{width:100%;display:flex}.color-button{height:14px;width:14px;border:1px solid rgb(226,228,231);cursor:default;margin:2px}.color-button:hover{border-color:#f29436}.panel{width:100%;display:flex;cursor:default;color:#444;font-family:Arial;font-size:12px;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;height:25px;align-items:center;border-radius:3px}.panel:hover{background-color:#dadada}.panel img{width:16px;height:16px;margin:0 4px}\n"] }]
        }], ctorParameters: () => [{ type: StiColorDialogService }, { type: StiModelService }, { type: StiLocalizationService }, { type: StiRichTextService }] });

class StiColorOptionsDialogComponent {
    constructor(model, colorService, loc, richText) {
        this.model = model;
        this.colorService = colorService;
        this.loc = loc;
        this.richText = richText;
        this.currentState = "custom";
        this.currentSelectedItem = "Transparent";
    }
    checkRange(event, object, property) {
        if (parseInt(event.target.value)) {
            if (parseInt(event.target.value) > 255) {
                object[property] = 255;
            }
            else if (parseInt(event.target.value) < 0) {
                object[property] = 0;
            }
            else {
                object[property] = parseInt(event.target.value);
            }
        }
        else {
            object[property] = 0;
        }
        event.target.value = object[property];
    }
    checkHex(event) {
        if (event.target.value) {
            if (event.target.value.length > 7) {
                let value = event.target.value.slice(0, 6);
                this.hex = value;
            }
            else {
                this.hex = event.target.value;
            }
        }
        else {
            this.hex = "#000000";
        }
        event.target.value = this.hex;
    }
    changeState(state) {
        this.currentState = state;
    }
    get hex() {
        return this.colorService.cloneOfCurrentColorObject.toHexColor();
    }
    set hex(value) {
        this.colorService.cloneOfCurrentColorObject.hexColor = value;
    }
    changeColor() {
        if (this.currentState == "custom") {
            this.colorService.currentColorObject.hexColor = this.colorService.cloneOfCurrentColorObject.hexColor;
        }
        else {
            let colorObj = this.colorService.browserColors.find((color) => color.name == this.currentSelectedItem);
            if (colorObj.name != "Transparent") {
                this.colorService.currentColorObject.hexColor = this.colorService.rgbToHex(colorObj.color);
            }
            else {
                this.colorService.currentColorObject.a = 0;
            }
        }
        if (this.colorService.isRichText) {
            this.richText.insertForeColor();
        }
        this.model.showMoreColorDialog = false;
        this.model.showColorDialog = false;
    }
    getColor(color) {
        return `rgb(${color})`;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiColorOptionsDialogComponent, deps: [{ token: StiModelService }, { token: StiColorDialogService }, { token: StiLocalizationService }, { token: StiRichTextService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiColorOptionsDialogComponent, selector: "sti-color-options-dialog", ngImport: i0, template: `
    <div class="color-options-dialog">
      <div class="dialog-navigation">
        <div class="header-navigation">
          <span> {{ loc.get2("Gui", "colorpickerdialog_caption") }}</span>
          <div class="close-button" (click)="model.showMoreColorDialog = false">
            <i class="pi pi-times"></i>
          </div>
        </div>
        <div class="content-navigation">
          <div class="content-button {{ currentState == 'custom' ? 'current' : '' }}" (click)="changeState('custom')">
            <span>{{ loc.get2("Gui", "colorpickerdialog_tabcustom") }}</span>
            <div class="horizontal-line"></div>
          </div>
          <div class="content-button {{ currentState == 'web' ? 'current' : '' }}" (click)="changeState('web')">
            <span>{{ "Web" }}</span>
            <div class="horizontal-line"></div>
          </div>
        </div>
      </div>
      <div class="dialog-content">
        <div class="custom-dialog" *ngIf="currentState == 'custom'">
          <div class="input-fields">
            <div class="field">
              <span>{{
                loc.get2("Gui", "colorpickerdialog_alphalabel").replace("&amp", "").replace(";", "").replace(":", "")
              }}</span>
              <input
                type="text"
                name=""
                id=""
                [ngModel]="colorService.cloneOfCurrentColorObject.a"
                (keyup.enter)="checkRange($event, colorService.cloneOfCurrentColorObject, 'a')"
                (blur)="checkRange($event, colorService.cloneOfCurrentColorObject, 'a')"
              />
            </div>
            <div class="field">
              <span>{{
                loc.get2("Gui", "colorpickerdialog_redlabel").replace("&amp", "").replace(";", "").replace(":", "")
              }}</span>
              <input
                type="text"
                name=""
                id=""
                [ngModel]="colorService.cloneOfCurrentColorObject.r"
                (keyup.enter)="checkRange($event, colorService.cloneOfCurrentColorObject, 'r')"
                (blur)="checkRange($event, colorService.cloneOfCurrentColorObject, 'r')"
              />
            </div>
            <div class="field">
              <span>{{
                loc.get2("Gui", "colorpickerdialog_greenlabel").replace("&amp", "").replace(";", "").replace(":", "")
              }}</span>
              <input
                type="text"
                name=""
                id=""
                [ngModel]="colorService.cloneOfCurrentColorObject.g"
                (keyup.enter)="checkRange($event, colorService.cloneOfCurrentColorObject, 'g')"
                (blur)="checkRange($event, colorService.cloneOfCurrentColorObject, 'g')"
              />
            </div>
            <div class="field">
              <span>{{
                loc.get2("Gui", "colorpickerdialog_bluelabel").replace("&amp", "").replace(";", "").replace(":", "")
              }}</span>
              <input
                type="text"
                name=""
                id=""
                [ngModel]="colorService.cloneOfCurrentColorObject.b"
                (keyup.enter)="checkRange($event, colorService.cloneOfCurrentColorObject, 'b')"
                (blur)="checkRange($event, colorService.cloneOfCurrentColorObject, 'b')"
              />
            </div>
            <div class="field">
              <span>{{ "Hex" }}</span>
              <input
                type="text"
                name=""
                id=""
                [ngModel]="hex"
                (keyup.enter)="checkHex($event)"
                (blur)="checkHex($event)"
              />
            </div>
          </div>
          <div class="color-preview">
            <div class="preview" [style.background-color]="colorService.cloneOfCurrentColorObject.toHtmlColor()"></div>
          </div>
        </div>
        <div class="web-dialog" *ngIf="currentState == 'web'">
          <div
            class="color-item {{ currentSelectedItem == item.name ? 'selected' : '' }}"
            *ngFor="let item of colorService.browserColors"
            (click)="currentSelectedItem = item.name"
          >
            <div class="mini-color-preview" [style.background-color]="getColor(item.color)"></div>
            <span> {{ item.name }}</span>
          </div>
        </div>
      </div>
      <div class="footer-navigation">
        <div class="footer-button accept" (click)="changeColor()">
          <span>{{ loc.get2("Buttons", "Ok").replace("&amp", "").replace(";", "") }}</span>
        </div>
        <div class="footer-button cancel" [style.margin-right.px]="10" (click)="model.showMoreColorDialog = false">
          <span>{{ loc.get2("PropertyMain", "Cancel") }}</span>
        </div>
      </div>
    </div>
  `, isInline: true, styles: [".selected{background-color:#e5e5e5}.web-dialog{height:190px;overflow:auto;width:calc(100% - 20px);margin:5px 10px}.mini-color-preview{width:64px;height:15px;border-radius:3px;border:1px solid #ababab;cursor:default;margin:0 4px}.color-item span{color:#444;font-family:Arial;font-size:12px;font-weight:400;cursor:default}.color-item{height:24px;display:flex;width:calc(100% - 2px);align-items:center;border-radius:3px;margin:1px}.color-item:hover{background-color:#dadada}.field{display:flex;width:100%;flex:1;align-items:center}.field span{width:100%;color:#444;font-family:Arial;font-size:12px;font-weight:400;cursor:default}.field input{width:80px;height:21px;font-size:12px;margin:0;padding:0 0 0 4px;border-radius:3px;font-family:Arial;outline:none;max-width:inherit;border:1px solid #ababab;color:#444}.custom-dialog{display:flex;padding-left:19px;padding-top:5px}.input-fields{width:140px;height:180px;display:flex;flex-direction:column}.preview{height:128px;width:128px;border:1px solid #c6c6c6}.color-preview{height:180px;width:180px;display:flex;align-items:center;justify-content:center}.pi{font-size:.5rem}.color-options-dialog{min-height:315px;-webkit-user-select:none;-moz-user-select:none;width:345px;left:calc(50% - 172.5px);top:calc(50% - 157.5px);position:absolute;border:1px solid #19478a;background:#fff;color:#444;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;cursor:default;display:flex;flex-direction:column;z-index:99999}.header-navigation{display:flex;width:100%;height:30px;align-items:center;padding-left:15px;padding-right:3px}.header-navigation span{font-family:Arial;font-size:13px;font-weight:700;color:#19478a;cursor:default;width:100%}.close-button{width:28px;height:24px;border-radius:3px;display:flex;align-items:center;justify-content:center}.close-button:hover{background-color:#d3d3d3}.content-navigation{width:calc(100% - 20px);height:40px;display:flex;border-bottom:1px solid lightgray;align-items:center;margin:0 12px}.content-button{min-width:35px;height:26px;border-radius:3px;display:flex;flex-direction:column;justify-content:center;margin-right:2px}.content-button:hover{background-color:#dadada}.content-button span{color:#444;font-family:Arial;font-size:12px;font-weight:400;cursor:default;text-align:center;margin:0 10px}.horizontal-line{height:3px;border-radius:3px;margin:0 10px}.current{background-color:#e5e5e5}.current .horizontal-line{background-color:#19478a}.footer-button{width:80px;height:24px;border-radius:3px;display:flex;align-items:center;justify-content:center;margin:0 5px 10px;-webkit-user-select:none;font-family:Arial;font-size:12px}.accept{background-color:#19478a;color:#fff}.accept:hover{background-color:#3d6298}.cancel{background-color:#ddd;color:#444}.cancel:hover{background-color:#d5d5d5}.footer-navigation{display:flex;justify-content:end}.dialog-content{height:100%;width:100%;flex:1}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiColorOptionsDialogComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-color-options-dialog", template: `
    <div class="color-options-dialog">
      <div class="dialog-navigation">
        <div class="header-navigation">
          <span> {{ loc.get2("Gui", "colorpickerdialog_caption") }}</span>
          <div class="close-button" (click)="model.showMoreColorDialog = false">
            <i class="pi pi-times"></i>
          </div>
        </div>
        <div class="content-navigation">
          <div class="content-button {{ currentState == 'custom' ? 'current' : '' }}" (click)="changeState('custom')">
            <span>{{ loc.get2("Gui", "colorpickerdialog_tabcustom") }}</span>
            <div class="horizontal-line"></div>
          </div>
          <div class="content-button {{ currentState == 'web' ? 'current' : '' }}" (click)="changeState('web')">
            <span>{{ "Web" }}</span>
            <div class="horizontal-line"></div>
          </div>
        </div>
      </div>
      <div class="dialog-content">
        <div class="custom-dialog" *ngIf="currentState == 'custom'">
          <div class="input-fields">
            <div class="field">
              <span>{{
                loc.get2("Gui", "colorpickerdialog_alphalabel").replace("&amp", "").replace(";", "").replace(":", "")
              }}</span>
              <input
                type="text"
                name=""
                id=""
                [ngModel]="colorService.cloneOfCurrentColorObject.a"
                (keyup.enter)="checkRange($event, colorService.cloneOfCurrentColorObject, 'a')"
                (blur)="checkRange($event, colorService.cloneOfCurrentColorObject, 'a')"
              />
            </div>
            <div class="field">
              <span>{{
                loc.get2("Gui", "colorpickerdialog_redlabel").replace("&amp", "").replace(";", "").replace(":", "")
              }}</span>
              <input
                type="text"
                name=""
                id=""
                [ngModel]="colorService.cloneOfCurrentColorObject.r"
                (keyup.enter)="checkRange($event, colorService.cloneOfCurrentColorObject, 'r')"
                (blur)="checkRange($event, colorService.cloneOfCurrentColorObject, 'r')"
              />
            </div>
            <div class="field">
              <span>{{
                loc.get2("Gui", "colorpickerdialog_greenlabel").replace("&amp", "").replace(";", "").replace(":", "")
              }}</span>
              <input
                type="text"
                name=""
                id=""
                [ngModel]="colorService.cloneOfCurrentColorObject.g"
                (keyup.enter)="checkRange($event, colorService.cloneOfCurrentColorObject, 'g')"
                (blur)="checkRange($event, colorService.cloneOfCurrentColorObject, 'g')"
              />
            </div>
            <div class="field">
              <span>{{
                loc.get2("Gui", "colorpickerdialog_bluelabel").replace("&amp", "").replace(";", "").replace(":", "")
              }}</span>
              <input
                type="text"
                name=""
                id=""
                [ngModel]="colorService.cloneOfCurrentColorObject.b"
                (keyup.enter)="checkRange($event, colorService.cloneOfCurrentColorObject, 'b')"
                (blur)="checkRange($event, colorService.cloneOfCurrentColorObject, 'b')"
              />
            </div>
            <div class="field">
              <span>{{ "Hex" }}</span>
              <input
                type="text"
                name=""
                id=""
                [ngModel]="hex"
                (keyup.enter)="checkHex($event)"
                (blur)="checkHex($event)"
              />
            </div>
          </div>
          <div class="color-preview">
            <div class="preview" [style.background-color]="colorService.cloneOfCurrentColorObject.toHtmlColor()"></div>
          </div>
        </div>
        <div class="web-dialog" *ngIf="currentState == 'web'">
          <div
            class="color-item {{ currentSelectedItem == item.name ? 'selected' : '' }}"
            *ngFor="let item of colorService.browserColors"
            (click)="currentSelectedItem = item.name"
          >
            <div class="mini-color-preview" [style.background-color]="getColor(item.color)"></div>
            <span> {{ item.name }}</span>
          </div>
        </div>
      </div>
      <div class="footer-navigation">
        <div class="footer-button accept" (click)="changeColor()">
          <span>{{ loc.get2("Buttons", "Ok").replace("&amp", "").replace(";", "") }}</span>
        </div>
        <div class="footer-button cancel" [style.margin-right.px]="10" (click)="model.showMoreColorDialog = false">
          <span>{{ loc.get2("PropertyMain", "Cancel") }}</span>
        </div>
      </div>
    </div>
  `, styles: [".selected{background-color:#e5e5e5}.web-dialog{height:190px;overflow:auto;width:calc(100% - 20px);margin:5px 10px}.mini-color-preview{width:64px;height:15px;border-radius:3px;border:1px solid #ababab;cursor:default;margin:0 4px}.color-item span{color:#444;font-family:Arial;font-size:12px;font-weight:400;cursor:default}.color-item{height:24px;display:flex;width:calc(100% - 2px);align-items:center;border-radius:3px;margin:1px}.color-item:hover{background-color:#dadada}.field{display:flex;width:100%;flex:1;align-items:center}.field span{width:100%;color:#444;font-family:Arial;font-size:12px;font-weight:400;cursor:default}.field input{width:80px;height:21px;font-size:12px;margin:0;padding:0 0 0 4px;border-radius:3px;font-family:Arial;outline:none;max-width:inherit;border:1px solid #ababab;color:#444}.custom-dialog{display:flex;padding-left:19px;padding-top:5px}.input-fields{width:140px;height:180px;display:flex;flex-direction:column}.preview{height:128px;width:128px;border:1px solid #c6c6c6}.color-preview{height:180px;width:180px;display:flex;align-items:center;justify-content:center}.pi{font-size:.5rem}.color-options-dialog{min-height:315px;-webkit-user-select:none;-moz-user-select:none;width:345px;left:calc(50% - 172.5px);top:calc(50% - 157.5px);position:absolute;border:1px solid #19478a;background:#fff;color:#444;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;cursor:default;display:flex;flex-direction:column;z-index:99999}.header-navigation{display:flex;width:100%;height:30px;align-items:center;padding-left:15px;padding-right:3px}.header-navigation span{font-family:Arial;font-size:13px;font-weight:700;color:#19478a;cursor:default;width:100%}.close-button{width:28px;height:24px;border-radius:3px;display:flex;align-items:center;justify-content:center}.close-button:hover{background-color:#d3d3d3}.content-navigation{width:calc(100% - 20px);height:40px;display:flex;border-bottom:1px solid lightgray;align-items:center;margin:0 12px}.content-button{min-width:35px;height:26px;border-radius:3px;display:flex;flex-direction:column;justify-content:center;margin-right:2px}.content-button:hover{background-color:#dadada}.content-button span{color:#444;font-family:Arial;font-size:12px;font-weight:400;cursor:default;text-align:center;margin:0 10px}.horizontal-line{height:3px;border-radius:3px;margin:0 10px}.current{background-color:#e5e5e5}.current .horizontal-line{background-color:#19478a}.footer-button{width:80px;height:24px;border-radius:3px;display:flex;align-items:center;justify-content:center;margin:0 5px 10px;-webkit-user-select:none;font-family:Arial;font-size:12px}.accept{background-color:#19478a;color:#fff}.accept:hover{background-color:#3d6298}.cancel{background-color:#ddd;color:#444}.cancel:hover{background-color:#d5d5d5}.footer-navigation{display:flex;justify-content:end}.dialog-content{height:100%;width:100%;flex:1}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiColorDialogService }, { type: StiLocalizationService }, { type: StiRichTextService }] });

class StiExpressionDraggableContainerComponent {
    constructor(expressionService) {
        this.expressionService = expressionService;
    }
    ngAfterViewInit() {
        if (this.elementRef) {
            this.expressionService.elementRef = this.elementRef;
        }
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiExpressionDraggableContainerComponent, deps: [{ token: StiExpressionService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiExpressionDraggableContainerComponent, selector: "expression-draggable-container", viewQueries: [{ propertyName: "elementRef", first: true, predicate: ["expressionContainer"], descendants: true }], ngImport: i0, template: `<div
    #expressionContainer
    *ngIf="expressionService.isDragging"
    class="expression-draggable-container"
    [style.left.px]="expressionService.expressionDraggableContainerX"
    [style.top.px]="expressionService.expressionDraggableContainerY"
    [style.pointer-events]="'none'"
  >
    <span>{{ expressionService.draggableExpressionObject.previewString }}</span>
  </div>`, isInline: true, styles: [".expression-draggable-container{position:absolute;padding:5px;width:fit-content;height:max-content;z-index:9999;background-color:#d3d3d3;max-height:23.6px;display:flex;align-items:center;-webkit-user-select:none;user-select:none;opacity:.7}.expression-draggable-container span{font-family:Arial;color:var(--text-color);font-size:12px;cursor:default}.expression-draggable-container span:hover{cursor:default}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiExpressionDraggableContainerComponent, decorators: [{
            type: Component,
            args: [{ selector: "expression-draggable-container", template: `<div
    #expressionContainer
    *ngIf="expressionService.isDragging"
    class="expression-draggable-container"
    [style.left.px]="expressionService.expressionDraggableContainerX"
    [style.top.px]="expressionService.expressionDraggableContainerY"
    [style.pointer-events]="'none'"
  >
    <span>{{ expressionService.draggableExpressionObject.previewString }}</span>
  </div>`, styles: [".expression-draggable-container{position:absolute;padding:5px;width:fit-content;height:max-content;z-index:9999;background-color:#d3d3d3;max-height:23.6px;display:flex;align-items:center;-webkit-user-select:none;user-select:none;opacity:.7}.expression-draggable-container span{font-family:Arial;color:var(--text-color);font-size:12px;cursor:default}.expression-draggable-container span:hover{cursor:default}\n"] }]
        }], ctorParameters: () => [{ type: StiExpressionService }], propDecorators: { elementRef: [{
                type: ViewChild,
                args: ["expressionContainer"]
            }] } });

class StiDropdownListComponent {
    get list() {
        return this.dropdownService.currentOptionList;
    }
    getValue(index) {
        let value = this.list[index][this.dropdownService.optionLabel ? this.dropdownService.optionLabel : index.toString()];
        return value ? value : this.list[index];
    }
    isActive(index) {
        let value = this.list[index][this.dropdownService.optionLabel ? this.dropdownService.optionLabel : index.toString()];
        return value ? value == this.dropdownService.currentValue : this.list[index] == this.dropdownService.currentValue;
    }
    setItem(index) {
        let item = this.dropdownService.currentOptionList[index][this.dropdownService.optionValue ? this.dropdownService.optionValue : index.toString()];
        this.dropdownService.valueChanged.next(item ? item : this.dropdownService.currentOptionList[index]);
        this.dropdownService.showDropdownList = false;
        this.dropdownService.optionLabel = null;
        this.dropdownService.optionValue = null;
    }
    constructor(dropdownService, editableContentService) {
        this.dropdownService = dropdownService;
        this.editableContentService = editableContentService;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDropdownListComponent, deps: [{ token: StiDropdownService }, { token: StiEditableContentService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiDropdownListComponent, selector: "sti-dropdown-list-component", ngImport: i0, template: `<div
    class="sti-dropdown-list"
    [style.left.px]="dropdownService.dropdownX"
    [style.top.px]="dropdownService.dropdownY + 2"
  >
    <span
      class="list-item {{ isActive(i) ? 'active' : '' }}"
      *ngFor="let item of list; let i = index"
      (click)="setItem(i)"
      (mousedown)="$event.preventDefault()"
      (mouseup)="editableContentService.startEdit()"
      >{{ getValue(i) }}</span
    >
  </div>`, isInline: true, styles: [".active{background-color:#efefef!important}.sti-dropdown-list{position:absolute;display:flex;flex-direction:column;max-height:400px;max-width:202px;overflow-x:hidden;overflow-y:auto;background:var(--input-color);color:var(--text-color);border:1px solid #c8c8c8;border-radius:3px;font-size:13px;z-index:999999999999999;box-shadow:0 3px 6px #00000029;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.list-item{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",Segoe UI Symbol;margin:0;padding:.429rem .857rem;border:0 none;color:var(--text-color);background:transparent;transition:background-color .2s,box-shadow .2s;border-radius:0;cursor:pointer;font-weight:400;position:relative;white-space:nowrap}.list-item:hover{background-color:#d3d3d3!important}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDropdownListComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-dropdown-list-component", template: `<div
    class="sti-dropdown-list"
    [style.left.px]="dropdownService.dropdownX"
    [style.top.px]="dropdownService.dropdownY + 2"
  >
    <span
      class="list-item {{ isActive(i) ? 'active' : '' }}"
      *ngFor="let item of list; let i = index"
      (click)="setItem(i)"
      (mousedown)="$event.preventDefault()"
      (mouseup)="editableContentService.startEdit()"
      >{{ getValue(i) }}</span
    >
  </div>`, styles: [".active{background-color:#efefef!important}.sti-dropdown-list{position:absolute;display:flex;flex-direction:column;max-height:400px;max-width:202px;overflow-x:hidden;overflow-y:auto;background:var(--input-color);color:var(--text-color);border:1px solid #c8c8c8;border-radius:3px;font-size:13px;z-index:999999999999999;box-shadow:0 3px 6px #00000029;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.list-item{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",Segoe UI Symbol;margin:0;padding:.429rem .857rem;border:0 none;color:var(--text-color);background:transparent;transition:background-color .2s,box-shadow .2s;border-radius:0;cursor:pointer;font-weight:400;position:relative;white-space:nowrap}.list-item:hover{background-color:#d3d3d3!important}\n"] }]
        }], ctorParameters: () => [{ type: StiDropdownService }, { type: StiEditableContentService }] });

class StiFormCheckerItemComponent {
    constructor(model, loc, formCheckerService, httpService) {
        this.model = model;
        this.loc = loc;
        this.formCheckerService = formCheckerService;
        this.httpService = httpService;
    }
    save() {
        let currentForm = this.model.form.saveToReportJsonObject().serialize();
        if (this.model.isWebView) {
            this.httpService
                .post("", { action: "InterfaceEvent", event: "SaveToCloudButtonClickForDesigner", data: { form: currentForm } })
                .subscribe(() => { });
        }
        else {
            this.httpService
                .post("", { action: "InterfaceEvent", event: "SaveToCloudButtonClick", data: { form: currentForm } })
                .subscribe(() => { });
        }
        // this.model.showSaveDialogFromCloud = true;
    }
    edit() {
        this.formCheckerService.showFormCheckerWindow = false;
    }
    ignore() {
        // this.formCheckerService.formMessages.splice(this.index - 1, 1);
        this.formCheckerService.showFormCheckerWindow = false;
        this.model.formEvents.next({ name: this.formCheckerService.currentPressedButton });
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFormCheckerItemComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }, { token: StiFormCheckerService }, { token: StiHttpClientService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiFormCheckerItemComponent, selector: "sti-form-checker-item", inputs: { item: "item", index: "index" }, ngImport: i0, template: ` <div class="form-checker-item">
    <div class="item-container">
      <div class="item-icon">
        <img [src]="model.getImage('images.Form_Checker.Warning32.png')" />
      </div>
      <div class="item-content">
        <div class="item-label">{{ index + "." }}{{ item.label }}</div>
        <div class="item-message">{{ item.content.replace("{0}", formCheckerService.buttonNames) }}</div>
      </div>
    </div>
    <div class="item-navigation">
      <div class="button" (click)="save()">{{ "Save to cloud" }}</div>
      <!-- <div class="button" (click)="edit()">{{ loc.get2("MainMenu", "menuEditEdit") }}</div>
      <div class="button" (click)="ignore()">{{ loc.get2("PropertyEnum", "DialogResultIgnore") }}</div> -->
    </div>
  </div>`, isInline: true, styles: [".item-navigation{display:flex;justify-content:end;margin:5px 0}.form-checker-item{padding-top:10px;border-bottom:1px dashed lightgray;margin:0 10px;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-touch-callout:none;-webkit-user-select:none}.button{background-color:#ddd;height:24px;min-width:24px;padding:0 10px;border-radius:3px;color:#444;margin:5px;display:flex;align-items:center;justify-content:center}.button:hover{background-color:#d5d5d5}.item-icon{display:flex;align-items:center}.item-icon img{width:32px;height:32px;margin-right:12px}.item-container{display:flex}.item-content{font-family:Arial;color:#444;font-size:12px}.item-label{font-weight:700;margin-top:5px}.item-message{margin-top:15px}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFormCheckerItemComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-form-checker-item", template: ` <div class="form-checker-item">
    <div class="item-container">
      <div class="item-icon">
        <img [src]="model.getImage('images.Form_Checker.Warning32.png')" />
      </div>
      <div class="item-content">
        <div class="item-label">{{ index + "." }}{{ item.label }}</div>
        <div class="item-message">{{ item.content.replace("{0}", formCheckerService.buttonNames) }}</div>
      </div>
    </div>
    <div class="item-navigation">
      <div class="button" (click)="save()">{{ "Save to cloud" }}</div>
      <!-- <div class="button" (click)="edit()">{{ loc.get2("MainMenu", "menuEditEdit") }}</div>
      <div class="button" (click)="ignore()">{{ loc.get2("PropertyEnum", "DialogResultIgnore") }}</div> -->
    </div>
  </div>`, styles: [".item-navigation{display:flex;justify-content:end;margin:5px 0}.form-checker-item{padding-top:10px;border-bottom:1px dashed lightgray;margin:0 10px;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-touch-callout:none;-webkit-user-select:none}.button{background-color:#ddd;height:24px;min-width:24px;padding:0 10px;border-radius:3px;color:#444;margin:5px;display:flex;align-items:center;justify-content:center}.button:hover{background-color:#d5d5d5}.item-icon{display:flex;align-items:center}.item-icon img{width:32px;height:32px;margin-right:12px}.item-container{display:flex}.item-content{font-family:Arial;color:#444;font-size:12px}.item-label{font-weight:700;margin-top:5px}.item-message{margin-top:15px}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }, { type: StiFormCheckerService }, { type: StiHttpClientService }], propDecorators: { item: [{
                type: Input
            }], index: [{
                type: Input
            }] } });

class StiFormCheckerComponent {
    constructor(model, loc, mouseService, formCheckerService) {
        this.model = model;
        this.loc = loc;
        this.mouseService = mouseService;
        this.formCheckerService = formCheckerService;
        this.isDragging = false;
    }
    ngOnDestroy() {
        this.mouseMoveSubscription?.unsubscribe();
        this.mouseUpSubscription?.unsubscribe();
    }
    startDrag(event) {
        this.startX = event.clientX;
        this.startY = event.clientY;
        this.startComponentX = this.formCheckerService.componentX;
        this.startComponentY = this.formCheckerService.componentY;
        this.isDragging = true;
    }
    showInfo() { }
    onMouseMove(event) {
        if (this.isDragging) {
            let deltaX = event.clientX - this.startX;
            let deltaY = event.clientY - this.startY;
            if (this.startComponentX + deltaX < 0) {
                this.formCheckerService.componentX = 0;
            }
            else if (this.startComponentX + deltaX > window.innerWidth - this.formCheckerService.componentWidth) {
                this.formCheckerService.componentX = window.innerWidth - this.formCheckerService.componentWidth;
            }
            else {
                this.formCheckerService.componentX = this.startComponentX + deltaX;
            }
            if (this.startComponentY + deltaY < 0) {
                this.formCheckerService.componentY = 0;
            }
            else if (this.startComponentY + deltaY > window.innerHeight - this.formCheckerService.componentHeight) {
                this.formCheckerService.componentY = window.innerHeight - this.formCheckerService.componentHeight;
            }
            else {
                this.formCheckerService.componentY = this.startComponentY + deltaY;
            }
        }
    }
    ngOnInit() {
        this.formCheckerService.getButtonNames();
        this.formCheckerService.componentX = (window.innerWidth - this.formCheckerService.componentWidth) / 2;
        this.formCheckerService.componentY = (window.innerHeight - this.formCheckerService.componentHeight) / 2;
        this.mouseUpSubscription = this.mouseService.getDocumentMouseUp().subscribe(() => {
            this.isDragging = false;
        });
        this.mouseMoveSubscription = this.mouseService.getDocumentMouseMove().subscribe((event) => {
            this.onMouseMove(event);
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFormCheckerComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }, { token: StiMouseService }, { token: StiFormCheckerService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiFormCheckerComponent, selector: "sti-form-checker", ngImport: i0, template: `<div
    class="form-checker-container"
    [style.left.px]="formCheckerService.componentX"
    [style.top.px]="formCheckerService.componentY"
  >
    <div class="header-navigation" (mousedown)="startDrag($event)">
      <!-- <span>{{ loc.get2("FormTitles", "FormsChecker") }}</span> -->
      <span>{{ "Form Checker" }}</span>
      <!-- <div class="nav-button" (click)="showInfo()"><img [src]="model.getImage('images.Other.HelpIcon.png')" /></div> -->
      <div class="nav-button" (click)="formCheckerService.showFormCheckerWindow = false">
        <img [src]="model.getImage('images.Other.CloseForm.png')" />
      </div>
    </div>
    <div class="content">
      <sti-form-checker-item
        *ngFor="let item of formCheckerService.formMessages; let i = index"
        [index]="i + 1"
        [item]="item"
      ></sti-form-checker-item>
    </div>
  </div>`, isInline: true, styles: [".content{flex:1;overflow-x:hidden;overflow-y:auto}.form-checker-container{position:absolute;font-size:13px;font-family:Arial;color:var(--text-color);min-height:480px;width:700px;border-radius:5px;left:calc(50% - 350px);top:calc(50% - 250px);display:flex;flex-direction:column;border:1px solid rgb(28,71,134);background-color:#fff;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;z-index:999;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-touch-callout:none;-webkit-user-select:none}.header-navigation{display:flex;height:40px;align-items:center;padding-left:15px;padding-right:5px;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a;color:#fff;-webkit-user-select:none}.header-navigation span{width:100%;font-size:17px;-webkit-user-select:none;cursor:default}.nav-button{height:24px;width:28px;border-radius:3px;display:flex;align-items:center;justify-content:center;align-self:start;margin-top:5px}.nav-button:hover{background-color:#d3d3d3}.nav-button img{height:16px;width:16px;filter:brightness(0) invert(1)}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: StiFormCheckerItemComponent, selector: "sti-form-checker-item", inputs: ["item", "index"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFormCheckerComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-form-checker", template: `<div
    class="form-checker-container"
    [style.left.px]="formCheckerService.componentX"
    [style.top.px]="formCheckerService.componentY"
  >
    <div class="header-navigation" (mousedown)="startDrag($event)">
      <!-- <span>{{ loc.get2("FormTitles", "FormsChecker") }}</span> -->
      <span>{{ "Form Checker" }}</span>
      <!-- <div class="nav-button" (click)="showInfo()"><img [src]="model.getImage('images.Other.HelpIcon.png')" /></div> -->
      <div class="nav-button" (click)="formCheckerService.showFormCheckerWindow = false">
        <img [src]="model.getImage('images.Other.CloseForm.png')" />
      </div>
    </div>
    <div class="content">
      <sti-form-checker-item
        *ngFor="let item of formCheckerService.formMessages; let i = index"
        [index]="i + 1"
        [item]="item"
      ></sti-form-checker-item>
    </div>
  </div>`, styles: [".content{flex:1;overflow-x:hidden;overflow-y:auto}.form-checker-container{position:absolute;font-size:13px;font-family:Arial;color:var(--text-color);min-height:480px;width:700px;border-radius:5px;left:calc(50% - 350px);top:calc(50% - 250px);display:flex;flex-direction:column;border:1px solid rgb(28,71,134);background-color:#fff;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;z-index:999;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-touch-callout:none;-webkit-user-select:none}.header-navigation{display:flex;height:40px;align-items:center;padding-left:15px;padding-right:5px;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a;color:#fff;-webkit-user-select:none}.header-navigation span{width:100%;font-size:17px;-webkit-user-select:none;cursor:default}.nav-button{height:24px;width:28px;border-radius:3px;display:flex;align-items:center;justify-content:center;align-self:start;margin-top:5px}.nav-button:hover{background-color:#d3d3d3}.nav-button img{height:16px;width:16px;filter:brightness(0) invert(1)}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }, { type: StiMouseService }, { type: StiFormCheckerService }] });

class StiElectronicSignatureEditorComponent {
    get brushColor() {
        return this.signatureService?.currentEditableSignatureElement?.penColor
            ? this.signatureService?.currentEditableSignatureElement?.penColor
            : Color.black();
    }
    constructor(model, loc, mouseService, signatureService, modalWindowService, colorService) {
        this.model = model;
        this.loc = loc;
        this.mouseService = mouseService;
        this.signatureService = signatureService;
        this.modalWindowService = modalWindowService;
        this.colorService = colorService;
        this.drawingMode = false;
        this.isDrawing = false;
        this.defaultPreviewText = "FullName FN";
    }
    get hasTemplates() {
        return this.signatureService.savedTemplates.length > 0;
    }
    get insertedText() {
        return this.signatureService.currentEditableText;
    }
    get insertedImage() {
        return this.signatureService.currentEditableImage;
    }
    get fullName() {
        return this.signatureService.currentEditableFullName;
    }
    set fullName(value) {
        this.signatureService.currentEditableFullName = value;
    }
    get initials() {
        return this.signatureService.currentEditableInitials;
    }
    set initials(value) {
        this.signatureService.currentEditableInitials = value;
    }
    isEmptyContent() {
        if (this.signatureService.selectedMode == "Draw") {
            return (!this.signatureService.currentEditableImage?.loadedImage &&
                !this.signatureService.currentEditableText?.value &&
                !this.signatureService.currentCanvasContent);
        }
        else {
            return !this.signatureService.currentEditableFullName && !this.signatureService.currentEditableInitials;
        }
    }
    saveTemplate() {
        if (this.signatureService.selectedMode == "Draw") {
            let imageObj = {
                type: "Image",
                image: this.signatureService.currentEditableImage,
                text: this.signatureService.currentEditableText,
                drawedImage: this.signatureService.currentCanvasContent,
            };
            if (!this.signatureService.savedTemplates.find((item) => item == imageObj)) {
                this.signatureService.savedTemplates.push(imageObj);
            }
        }
        else {
            let textObj = {
                type: "Text",
                fullName: this.signatureService.currentEditableFullName,
                initials: this.signatureService.currentEditableInitials,
                specialFont: this.signatureService.currentPreviewFont,
            };
            if (!this.signatureService.savedTemplates.find((item) => item == textObj)) {
                this.signatureService.savedTemplates.push(textObj);
            }
        }
        localStorage.removeItem("StiSignatureTemplates");
        localStorage.setItem("StiSignatureTemplates", JSON.stringify(this.signatureService.savedTemplates));
    }
    showSavedTemplatesPreview(button) {
        let buttonRect = this.model.getPositionRelativeToForm(button);
        this.signatureService.templatesPreviewX = buttonRect.right - 335;
        this.signatureService.templatesPreviewY = buttonRect.bottom + 1;
        this.signatureService.showSavedTemplates = !this.signatureService.showSavedTemplates;
    }
    ngOnDestroy() {
        this.signatureService.currentEditableText = new StiTextItem();
        this.signatureService.currentCanvasContent = null;
        this.signatureService.currentEditableImage = new StiImageEditorResult();
        this.signatureService.currentEditableSignatureElement = null;
    }
    isCanvasBlank(canvas) {
        const context = canvas.getContext("2d");
        const pixelBuffer = new Uint32Array(context.getImageData(0, 0, canvas.width, canvas.height).data.buffer);
        return !pixelBuffer.some((color) => color !== 0);
    }
    ngAfterViewInit() {
        const onResize = (event) => {
            this.signatureService.editorComponentX = (window.innerWidth - this.signatureService.editorComponentWidth) / 2;
            this.signatureService.editorComponentY = (window.innerHeight - this.signatureService.editorComponentHeight) / 2;
        };
        window.addEventListener("resize", onResize);
        this.fillDrawingCanvas();
    }
    get image() {
        return "url(" + this.insertedImage?.loadedImage + ")";
    }
    getHorizontalAlignment() {
        if (this.insertedImage?.horizontalAlignment == StiHorizontalAlignment.Center) {
            return "center";
        }
        else if (this.insertedImage?.horizontalAlignment == StiHorizontalAlignment.Left) {
            return "start";
        }
        else {
            return "end";
        }
    }
    onMouseDown(event, canvasElement) {
        if (this.drawingMode) {
            event.preventDefault();
            event.stopPropagation();
            this.isDrawing = true;
            this.context = canvasElement?.getContext("2d");
            this.context.strokeStyle = this.brushColor.toHtmlColor();
            const coords = this.relativeCoords(event, canvasElement);
            this.context.moveTo(coords.x, coords.y);
        }
    }
    relativeCoords(event, canvasElement) {
        const bounds = this.model.getPositionRelativeToForm(canvasElement);
        const x = ((event.clientX ? event.clientX : (event.touches && event.touches.length > 0 ? event.touches[0].clientX : 0)) - bounds.left) / this.model.zoom;
        const y = ((event.clientY ? event.clientY : (event.touches && event.touches.length > 0 ? event.touches[0].clientY : 0)) - bounds.top) / this.model.zoom;
        return { x: x, y: y };
    }
    onCanvasMove(event, canvasElement) {
        if (this.isDrawing) {
            const coords = this.relativeCoords(event, canvasElement);
            this.context.lineTo(coords.x, coords.y);
            this.context.stroke();
        }
    }
    onMouseUp() {
        if (this.isDrawing && !this.isCanvasBlank(this.canvas?.nativeElement)) {
            this.signatureService.currentCanvasContent = this.canvas?.nativeElement?.toDataURL("image/png");
        }
        this.isDragging = false;
        this.isDrawing = false;
    }
    getBackgroundSize(container) {
        if (!this.insertedImage?.loadedImage) {
            return;
        }
        if (this.insertedImage?.aspectRatio && this.insertedImage?.stretch) {
            return "contain";
        }
        if (this.insertedImage?.stretch) {
            return `${container.offsetWidth}px ${container.offsetHeight}px`;
        }
        else {
            return `${this.insertedImage?.naturalWidth}px ${this.insertedImage?.naturalHeight}px`;
        }
    }
    getBackgroundPosition() {
        if (this.insertedImage?.stretch && !this.insertedImage?.aspectRatio) {
            return `center`;
        }
        else {
            return `${this.signatureService.getVerticalPosition(this.insertedImage?.verticalAlignment)} ${this.signatureService.getHorizontalPosition(this.insertedImage?.horizontalAlignment)}`;
        }
    }
    get previewText() {
        return (this.fullName + " " + this.initials).length > 1
            ? this.fullName + " " + this.initials
            : this.defaultPreviewText;
    }
    get alignment() {
        if (this.insertedText.horizontalAlignment == StiHorizontalAlignment.Center) {
            return "center";
        }
        else if (this.insertedText.horizontalAlignment == StiHorizontalAlignment.Right) {
            return "end";
        }
        else {
            return "start";
        }
    }
    clear() {
        this.signatureService.currentEditableText.value = "";
        if (this.signatureService?.currentEditableImage?.loadedImage) {
            this.signatureService.currentEditableImage.loadedImage = "";
        }
        if (!this.context) {
            this.context = this.canvas?.nativeElement?.getContext("2d");
        }
        this.signatureService.currentCanvasContent = "";
        this.context?.clearRect(0, 0, this.canvas?.nativeElement?.width, this.canvas?.nativeElement?.height);
        this.context?.beginPath();
    }
    showEditor(editorType) {
        this.model.showDraggableModalWindow = true;
        if (editorType == "Text") {
            this.modalWindowService.isTextEditor = true;
            this.signatureService.currentEditableText = this.insertedText;
        }
        else {
            this.modalWindowService.isImageEditor = true;
            this.signatureService.currentEditableImage = this.insertedImage;
        }
    }
    showColorPicker(element, object, isRichText = false) {
        this.colorService.openDialog(element, object, isRichText);
    }
    fillDrawingCanvas() {
        let ctx = this.canvas?.nativeElement?.getContext("2d");
        if (ctx && this.signatureService.currentCanvasContent) {
            ctx.clearRect(0, 0, this.canvas?.nativeElement?.width, this.canvas?.nativeElement?.height);
            let image = new Image();
            image.onload = () => {
                ctx.drawImage(image, 0, 0, this.canvas?.nativeElement?.width, this.canvas?.nativeElement?.height);
            };
            image.src = this.signatureService.currentCanvasContent;
        }
    }
    showFontsPreview(element) {
        this.signatureService.showFontsPreview = !this.signatureService.showFontsPreview;
        let rect = this.model.getPositionRelativeToForm(element);
        this.signatureService.fontsPreviewX = rect.right - 200;
        this.signatureService.fontsPreviewY = rect.bottom + 2;
    }
    acceptChanges() {
        this.signatureService.currentActiveLoadingImages = 0;
        this.signatureService.completedLoadingImages = 0;
        this.signatureService.currentEditableSignatureElement.fullName = this.signatureService.currentEditableFullName;
        this.signatureService.currentEditableSignatureElement.initials = this.signatureService.currentEditableInitials;
        this.signatureService.currentEditableSignatureElement.specialFont = this.signatureService.currentPreviewFont;
        let canvasRect = this.model.getPositionRelativeToForm(this.canvas?.nativeElement);
        if (canvasRect && this.signatureService.selectedMode == "Draw") {
            let resultCanvas = document.createElement("canvas");
            this.canvasWidth = canvasRect.width;
            this.canvasHeight = canvasRect.height;
            resultCanvas.width = this.canvasWidth;
            resultCanvas.height = this.canvasHeight;
            let ctx = resultCanvas.getContext("2d");
            this.resultCanvasContext = ctx;
            this.insertedImageLayer = this.createLayer(resultCanvas);
            this.insertedTextLayer = this.createLayer(resultCanvas);
            this.drawedLayer = this.createLayer(resultCanvas);
            if (this.insertedImage?.loadedImage) {
                this.fillLayer(this.insertedImageLayer, this.insertedImage);
            }
            if (this.insertedText?.value) {
                this.fillLayer(this.insertedTextLayer, this.insertedText);
            }
            if (!this.isCanvasBlank(this.canvas?.nativeElement)) {
                this.fillLayer(this.drawedLayer, this.canvas?.nativeElement?.toDataURL("image/png"));
            }
            else {
                this.signatureService.currentCanvasContent = "";
            }
            this.signatureService.checkLoading();
        }
        else {
            this.updateResultCanvas("Text");
        }
        if (this.signatureService.selectedMode == "Draw") {
            this.signatureService.currentEditableSignatureElement.currentSignatureMode = "Draw";
        }
        else {
            this.signatureService.currentEditableSignatureElement.currentSignatureMode = "Type";
        }
    }
    createLayer(canvas) {
        let layer = document.createElement("canvas");
        layer.width = canvas.width;
        layer.height = canvas.height;
        return layer.getContext("2d");
    }
    drawLayer(context, layer) {
        if (layer) {
            context.drawImage(layer.canvas, 0, 0);
        }
    }
    fillLayer(layer, content) {
        if (content instanceof StiTextItem) {
            if (content.value) {
                layer.font = `${content.font.isItalic() ? "italic " : ""}${content.font.isBold() ? "bold " : ""}${content.font.size + "px "}${content.font.family}`;
                layer.textBaseline = "center";
                layer.textAlign = Enum.getName(StiHorizontalAlignment, content.horizontalAlignment).toLocaleLowerCase();
                layer.fillText(content.value, Enum.getName(StiHorizontalAlignment, content.horizontalAlignment).toLocaleLowerCase() == "left"
                    ? 0
                    : Enum.getName(StiHorizontalAlignment, content.horizontalAlignment).toLocaleLowerCase() == "center"
                        ? this.canvasWidth / 2
                        : this.canvasWidth - layer.measureText(content.value).width, this.canvasHeight / 2);
            }
        }
        else if (content?.loadedImage) {
            this.signatureService.currentActiveLoadingImages += 1;
            let image = new Image();
            image.onload = () => {
                if (content?.aspectRatio && content?.stretch) {
                    let hRatio = this.canvasWidth / image.naturalWidth;
                    let vRatio = this.canvasHeight / image.naturalHeight;
                    let ratio = Math.min(hRatio, vRatio);
                    let centerShiftX = (this.canvasWidth - image.naturalWidth * ratio) / 2;
                    let centerShiftY = (this.canvasHeight - image.naturalHeight * ratio) / 2;
                    layer.drawImage(image, 0, 0, image.naturalWidth, image.naturalHeight, centerShiftX, centerShiftY, image.naturalWidth * ratio, image.naturalHeight * ratio);
                    this.signatureService.completedLoadingImages += 1;
                }
                else {
                    layer.drawImage(image, 0, 0, content.stretch ? this.canvasWidth : image.naturalWidth, content.stretch ? this.canvasHeight : image.naturalHeight);
                    this.signatureService.completedLoadingImages += 1;
                }
            };
            image.src = content.loadedImage;
        }
        else {
            if (typeof content === "string") {
                this.signatureService.currentActiveLoadingImages += 1;
                let image = new Image();
                image.onload = () => {
                    layer.drawImage(image, 0, 0, this.canvasWidth, this.canvasHeight);
                    this.signatureService.completedLoadingImages += 1;
                };
                image.src = content;
            }
        }
    }
    changeMode(mode) {
        this.signatureService.selectedMode = mode;
        if (mode == "Draw") {
            setTimeout(() => {
                this.fillDrawingCanvas();
            });
        }
    }
    updateResultCanvas(type = "Draw") {
        if (type == "Draw") {
            this.drawLayer(this.resultCanvasContext, this.insertedImageLayer);
            this.drawLayer(this.resultCanvasContext, this.insertedTextLayer);
            this.drawLayer(this.resultCanvasContext, this.drawedLayer);
            // console.log(this.resultCanvasContext.canvas.toDataURL("image/png"));
            if (this.resultCanvasContext?.canvas?.toDataURL("image/png")) {
                this.signatureService.currentEditableSignatureElement.backgroundImage =
                    this.resultCanvasContext.canvas.toDataURL("image/png");
            }
            this.signatureService.currentEditableSignatureElement.insertedImage = this.signatureService.currentEditableImage;
            this.signatureService.currentEditableSignatureElement.insertedText = this.signatureService.currentEditableText;
            if (this.signatureService.currentCanvasContent) {
                this.signatureService.currentEditableSignatureElement.drawedImage = this.signatureService.currentCanvasContent;
            }
            else {
                this.signatureService.currentEditableSignatureElement.drawedImage = "";
            }
        }
        this.signatureService.currentEditableSignatureElement.isSigned = true;
        this.model.showSignatureEditor = false;
        // this.signatureService.currentSignatureElement = null;
    }
    onMouseMove(event) {
        if (this.isDragging) {
            let deltaX = event.clientX - this.startX;
            let deltaY = event.clientY - this.startY;
            if (this.startComponentX + deltaX < 0) {
                this.signatureService.editorComponentX = 0;
            }
            else if (this.startComponentX + deltaX > window.innerWidth - this.signatureService.editorComponentWidth) {
                this.signatureService.editorComponentX = window.innerWidth - this.signatureService.editorComponentWidth;
            }
            else {
                this.signatureService.editorComponentX = this.startComponentX + deltaX;
            }
            if (this.startComponentY + deltaY < 0) {
                this.signatureService.editorComponentY = 0;
            }
            else if (this.startComponentY + deltaY > window.innerHeight - this.signatureService.editorComponentHeight) {
                this.signatureService.editorComponentY = window.innerHeight - this.signatureService.editorComponentHeight;
            }
            else {
                this.signatureService.editorComponentY = this.startComponentY + deltaY;
            }
        }
    }
    startDrag(event) {
        this.startX = event.clientX;
        this.startY = event.clientY;
        this.startComponentX = this.signatureService.editorComponentX;
        this.startComponentY = this.signatureService.editorComponentY;
        this.isDragging = true;
    }
    ngOnInit() {
        this.drawingMode = true;
        if (localStorage.getItem("StiSignatureTemplates")) {
            this.signatureService.savedTemplates = JSON.parse(localStorage.getItem("StiSignatureTemplates"));
        }
        this.signatureService.editorComponentX = (window.innerWidth - this.signatureService.editorComponentWidth) / 2;
        this.signatureService.editorComponentY = (window.innerHeight - this.signatureService.editorComponentHeight) / 2;
        this.updateSignatureSubscription = this.signatureService.updateSignature.subscribe((event) => {
            if (event.type == "Text") {
                this.signatureService.currentEditableText = event.value;
            }
            else if (event.type == "Image") {
                this.signatureService.currentEditableImage = event.value;
            }
        });
        this.updateResultCanvasSubscription = this.signatureService.completedLoading.subscribe(() => {
            this.updateResultCanvas();
        });
        this.mouseUpSubscription = this.mouseService.getDocumentMouseUp().subscribe(() => {
            this.onMouseUp();
        });
        this.mouseService.getDocumentTouchEnd().subscribe(() => {
            this.onMouseUp();
        });
        this.mouseMoveSubscription = this.mouseService.getDocumentMouseMove().subscribe((event) => {
            this.onMouseMove(event);
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiElectronicSignatureEditorComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }, { token: StiMouseService }, { token: SignatureService }, { token: StiDraggableModalWindowService }, { token: StiColorDialogService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiElectronicSignatureEditorComponent, selector: "sti-electronic-signature-editor", viewQueries: [{ propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true }], ngImport: i0, template: `<div
      class="editor-container"
      [style.left.px]="signatureService.editorComponentX"
      [style.top.px]="signatureService.editorComponentY"
    >
      <div class="editor-navbar" (mousedown)="startDrag($event)">
        <span [style.flex]="1">{{ loc.get2("Components", "StiSignature") }}</span>
        <div class="close-button" (click)="model.showSignatureEditor = false">
          <img [src]="model.getImage('images.Other.CloseForm.png')" />
        </div>
      </div>
      <div class="content-container">
        <div class="content-navigation">
          <div
            class="navigation-button {{ signatureService.selectedMode == 'Type' ? 'current' : '' }}"
            (click)="changeMode('Type')"
          >
            <div class="navigation-label">
              <span>{{ loc.get2("PropertyEnum", "StiSignatureTypeType") }}</span>
            </div>
            <div class="indicator {{ signatureService.selectedMode == 'Type' ? 'current-indicator' : '' }}"></div>
          </div>
          <div
            class="navigation-button {{ signatureService.selectedMode == 'Draw' ? 'current' : '' }}"
            (click)="changeMode('Draw')"
          >
            <div class="navigation-label">
              <span>{{ loc.get2("PropertyEnum", "StiSignatureTypeDraw") }}</span>
            </div>
            <div class="indicator {{ signatureService.selectedMode == 'Draw' ? 'current-indicator' : '' }}"></div>
          </div>
          <div class="templates-navigation-container">
            <div (click)="saveTemplate()" class="template-navigation-button {{ isEmptyContent() ? 'disabled' : '' }}">
              <img [src]="model.getImage('signature.StiSignatureSave.png')" />
            </div>
            <div
              #button
              (click)="showSavedTemplatesPreview(button)"
              class="template-navigation-button show-button"
              [style.width.px]="38"
            >
              <img [src]="model.getImage('signature.StiSignatureOpen.png')" /><i class="pi pi-chevron-down"></i>
            </div>
          </div>
        </div>
        <div class="bottom-divider"></div>
        <div class="type-container" *ngIf="signatureService.selectedMode == 'Type'">
          <div class="input-field">
            <span>{{ loc.getP("FullName") }}</span
            ><input type="text" [(ngModel)]="fullName" />
          </div>
          <div class="input-field">
            <span>{{ loc.getP("Initials") }}</span
            ><input type="text" [(ngModel)]="initials" />
          </div>
          <div class="button-panel">
            <div #selectButton class="select-button" (click)="showFontsPreview(selectButton)">
              <span class="button-label">{{ loc.get2("ChartRibbon", "Style") }}</span
              ><i class="pi pi-chevron-down"></i>
            </div>
          </div>
          <div class="preview-panel" [style.font-family]="signatureService.currentPreviewFont">
            <span>{{ previewText }}</span>
          </div>
        </div>
        <div class="draw-container" *ngIf="signatureService.selectedMode == 'Draw'">
          <div class="draw-buttons-panel">
            <div
              class="button-container {{ drawingMode ? 'active' : '' }}"
              [stiTooltip]="loc.getP('ForeColor')"
              tooltipPosition="bottom"
              showDelay="500"
              (mousedown)="$event.preventDefault()"
              #fontColorEditor
            >
              <div class="preview-container" (click)="drawingMode = !drawingMode">
                <div class="foreground" [style]="{ backgroundPosition: 'center', backgroundRepeat: 'no-repeat' }">
                  <img [src]="model.getImage('images.Brush.png')" alt="" />
                </div>
                <span
                  class="color-preview"
                  [style.background-color]="brushColor != null ? brushColor?.toHtmlColor() : 'rgb(182, 181, 180)'"
                ></span>
              </div>
              <div
                (click)="showColorPicker(fontColorEditor, brushColor)"
                [style]="{ position: 'relative', display: 'flex', alignItems: 'center' }"
              >
                <i class="pi pi-chevron-down"></i>
              </div>
            </div>
            <div class="draw-panel-button" (click)="showEditor('Text')">
              <img [src]="model.getImage('signature.Text.png')" />
            </div>
            <div class="draw-panel-button" (click)="showEditor('Image')">
              <img [src]="model.getImage('images.Toolbox.StiImageElement.png')" />
            </div>
            <div class="draw-panel-button" (click)="clear()">
              <img [src]="model.getImage('images.Page.ClearContent.png')" />
            </div>
          </div>
          <div class="draw-panel" #previewContainer>
            <div class="canvas-container">
              <canvas
                [width]="previewContainer.clientWidth"
                [height]="previewContainer.clientHeight"
                (mousedown)="onMouseDown($event, canvas)"
                (mousemove)="onCanvasMove($event, canvas)"
                (touchstart)="onMouseDown($event, canvas)"
                (touchmove)="onCanvasMove($event, canvas)"
                #canvas
              >
              </canvas>
            </div>
            <div class="preview-inserted-text" [style]="insertedText.htmlStyle()" [style.justify-content]="alignment">
              <span>{{ insertedText.value }}</span>
            </div>
            <div class="inserted-image-container" [style.justify-content]="getHorizontalAlignment()">
              <div
                class="preview-inserted-image"
                [style.width.px]="
                  insertedImage?.aspectRatio && insertedImage?.stretch
                    ? previewContainer.clientHeight
                    : previewContainer.clientWidth
                "
                [style.height.px]="previewContainer.clientHeight"
                [style.background-image]="image"
                [style.background-position]="getBackgroundPosition()"
                [style.background-size]="getBackgroundSize(previewContainer)"
                [style.background-repeat]="image ? 'no-repeat' : ''"
              ></div>
            </div>
            <div class="signature-description">
              <span>{{ "Signature" }}</span>
            </div>
          </div>
        </div>
      </div>
      <div class="setup-accept">
        <div class="accept button" (click)="acceptChanges()">
          <span [style.margin-left.px]="0">{{
            model.previewMode
              ? loc.get2("Buttons", "Sign")
              : loc.get2("Buttons", "Save").replace("&amp", "").replace(";", "")
          }}</span>
        </div>
        <div class="cancel button" (click)="model.showSignatureEditor = false">
          <span [style.margin-left.px]="0">{{ loc.getP("Cancel") }}</span>
        </div>
      </div>
    </div>
    <div
      class="fonts-preview-container"
      *ngIf="signatureService.showFontsPreview"
      [style.left.px]="signatureService.fontsPreviewX"
      [style.top.px]="signatureService.fontsPreviewY"
    >
      <div
        *ngFor="let font of signatureService.previewFonts"
        class="font-preview"
        [style.font-family]="font"
        (click)="signatureService.currentPreviewFont = font; signatureService.showFontsPreview = false"
      >
        <div class="vertical-line {{ signatureService.currentPreviewFont == font ? 'current-indicator' : '' }}"></div>
        <span> {{ previewText }}</span>
      </div>
    </div>
    <div
      *ngIf="signatureService.showSavedTemplates"
      class="saved-templates-container"
      [style.left.px]="signatureService.templatesPreviewX"
      [style.top.px]="signatureService.templatesPreviewY"
      [style.overflow-y]="hasTemplates ? 'scroll' : 'hidden'"
    >
      <div class="empty-container" *ngIf="!hasTemplates">
        <span>{{ "No saved items" }}</span>
      </div>
      <div
        class="template-item"
        *ngFor="let temp of signatureService.savedTemplates; let i = index"
        [style.margin-top.px]="i == 0 ? 6 : 0"
        (click)="signatureService.setTemplate(temp)"
      >
        <div class="delete-button" (click)="signatureService.deleteTemplate(i)">
          <img [src]="model.getImage('images.Other.CloseForm.png')" />
        </div>
        <div
          class="image-template"
          *ngIf="temp.type == 'Image'"
          #parentContainer
          [style.justify-content]="signatureService.getTemplateHorizontalAlignment(temp)"
        >
          <div
            class="loadedImage image-content"
            [style.background-image]="signatureService.getTemplateImage(temp)"
            [style.background-position]="signatureService.getTemplateBackgroundPosition(temp)"
            [style.background-size]="signatureService.getTemplateBackgroundSize(temp, parentContainer)"
            [style.background-repeat]="'no-repeat'"
          ></div>
          <div class="insertedText image-content">
            <span [style]="temp.text.htmlStyle()">{{ temp?.text?.value }}</span>
          </div>
          <div
            class="drawedImage image-content"
            [style.background-size]="'contain'"
            [style.background-image]="signatureService.getTemplateDrawedImage(temp)"
          ></div>
        </div>
        <div class="text-template" *ngIf="temp.type == 'Text'">
          <span [style.font-family]="temp.specialFont" [style.font-size.pt]="16">{{
            temp.fullName + " " + temp.initials
          }}</span>
        </div>
      </div>
    </div>`, isInline: true, styles: [".image-content{height:100%;width:100%;top:0;left:0;position:absolute}.drawedImage{z-index:3}.loadedImage{z-index:1}.insertedText{z-index:2;display:flex;align-items:center;justify-content:center}.text-template{display:flex;align-items:center;justify-content:center;height:50px}.image-template{position:relative;height:130px}.template-item{width:calc(100% - 12px);height:fit-content;padding:2px;margin:0 6px 6px;border:1px solid lightgray;border-radius:3px;position:relative}.delete-button{position:absolute;z-index:999;right:0;top:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border-radius:3px}.delete-button img{height:16px;width:16px}.delete-button:hover img{filter:saturate(500%) contrast(100%) brightness(900%) invert(900%) sepia(50%)}.template-item:hover{background-color:#d7d7d7;cursor:pointer}.empty-container{height:100%;width:100%;background-color:#fafafa;display:flex;align-items:center;justify-content:center;color:#454545;font-size:13px;font-family:Arial}.saved-templates-container{position:absolute;overflow-x:hidden;overflow-y:scroll;width:335px;height:270px;border-radius:3px;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;border:1px solid rgb(25,71,138);display:flex;flex-direction:column;background-color:#fff;z-index:99999999999999999}.active{background-color:#d3d3d3;outline:1px solid rgb(61,107,186)}.canvas-container{position:absolute;left:0;top:0;height:100%;width:100%;z-index:99999}.preview-inserted-image{position:absolute}.inserted-image-container{position:absolute;left:0;top:0;display:flex;height:100%;width:100%}.preview-inserted-text{position:absolute;height:100%;width:100%;display:flex;align-items:center;justify-content:center;z-index:999}.signature-content{z-index:9999;height:100%;width:100%}.signature-description{width:calc(100% - 10px);height:50px;margin:0 5px;padding:0 5px;border-top:1px solid lightgray;display:flex;align-items:center;overflow:hidden;z-index:999}.disabled{pointer-events:none;opacity:.5}.preview-container{display:flex;width:100%;position:relative;flex-direction:column}.preview-container img{height:16px;width:16px}.button-container{display:flex;height:26px;width:40px;position:relative;margin-right:5px;border-radius:3px}.button-container:hover{background-color:#d3d3d3}.button-container:active{background-color:var(--columnDeleteHover-color)}.color-preview{width:20px;height:5px;margin-left:4px}i{height:12px;width:12px;right:3px;top:50%;vertical-align:middle;color:var(--text-color)}.button-container:hover i{color:#fff}.foreground{margin-left:8px;margin-top:2px;width:16px;height:16px}.template-navigation-button{height:26px;width:26px;margin-right:2px;border-radius:3px;display:flex;align-items:center;justify-content:center}.template-navigation-button:hover{background-color:#d3d3d3}.template-navigation-button img{height:16px;width:16px}.templates-navigation-container{width:100%;display:flex;align-items:center;justify-content:flex-end}.vertical-line{width:3px;height:calc(100% - 14px);margin:7px 10px 7px 5px}.font-preview{font-size:16px;height:42px;display:flex;align-items:center;padding-left:5px;border-radius:3px;margin:1px}.font-preview:hover{background-color:#dadada}.fonts-preview-container{position:absolute;width:200px;height:134px;z-index:9999999999;padding:1px;border-radius:3px;border:1px solid #c6c6c6;background:#fff;color:#444;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgba(0,0,0,.6);box-shadow:0 0 7px #0000004d;cursor:default}.draw-buttons-panel{height:26px;margin-bottom:5px;margin-top:10px;display:flex;padding-left:24px}.draw-panel-button:hover{background-color:#d3d3d3}.draw-panel-button{height:26px;width:26px;margin-right:5px;border-radius:3px;display:flex;align-items:center;justify-content:center}.draw-panel-button img{height:16px;width:16px}.draw-panel{border:1px dashed #ababab;border-radius:3px;margin:0 24px;width:calc(100% - 48px);height:186px;display:flex;flex-direction:column-reverse;position:relative}i{margin-left:5px;font-size:7px;padding-top:4px}.select-button{border:1px solid #dddddd;border-radius:3px;min-width:30px;padding-left:10px;padding-right:6px;display:flex;color:#444;align-items:center;margin-right:24px;margin-top:24px;height:24px}.select-button:hover{background-color:#d3d3d3}.button-panel{width:100%;display:flex;justify-content:flex-end}.preview-panel{height:80px;width:calc(100% - 48px);border:1px solid #ababab;border-radius:3px;font-size:16pt;margin:10px 24px;padding-left:12px;display:flex;align-items:center;overflow:hidden}.input-field{width:calc(100% - 24px);display:flex;margin:12px 12px 6px;padding:0 12px;align-items:center}.input-field span{min-width:100px;font-size:12px}.input-field input{border-radius:3px;padding-left:5px;height:24px;outline:none;border:1px solid lightgray;width:100%}.input-field input:hover{border-color:#454545}.current-indicator{background-color:#19478a}.other-indicator{background-color:transparent}.current{background-color:#e5e5e5}.navigation-button:hover{background-color:#dadada}.navigation-button{border-radius:3px;height:26px;min-width:50px;display:flex;flex-direction:column;color:#444;font-size:12px;font-family:Arial;margin-right:2px}.navigation-label{height:27px;width:100%;height:18px;padding:0 10px;display:flex;align-items:center;justify-content:center;white-space:nowrap}.navigation-label span{margin-top:7px}.indicator{height:3px;margin:1px 9px}.bottom-divider{height:1px;width:calc(100% - 24px);background-color:#d3d3d3;margin:5px 12px}.content-navigation{display:flex;padding:12px 12px 0}.content-container{height:100%;width:100%}.editor-navbar{display:flex;height:30px;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a;-webkit-user-select:none;color:#fff;align-items:center}.editor-navbar span{font-size:13px;margin-left:10px}.close-button{height:30px;width:30px;border-radius:3px;display:flex;align-items:center;justify-content:center}.close-button:hover{background-color:#dadada}.close-button img{height:16px;width:16px;filter:brightness(0) invert(1)}.editor-container{background-color:var(--back-color);position:absolute;left:calc(50% - 182px);top:calc(50% - 175px);z-index:999;width:365px;height:350px;overflow:hidden;display:flex;flex-direction:column;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;border:1px solid rgb(25,71,138);color:var(--text-color);font-size:12px;border-radius:5px;font-family:Arial;-webkit-user-select:none}.button{height:24px;width:80px;border-radius:3px;margin:3px 5px;display:flex;align-items:center;justify-content:center;border:1px solid transparent}.accept:active{background-color:#355da0;border-color:#264c7d}.cancel:active{background-color:#e2e2e2;border-color:#838383}.accept{background-color:#19478a;color:#fff}.accept:hover{background-color:#3d6298}.cancel{background-color:#ddd;color:#444}.cancel:hover{background-color:#d5d5d5}.setup-accept{padding:8px;display:flex;align-items:flex-end;justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiElectronicSignatureEditorComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-electronic-signature-editor", template: `<div
      class="editor-container"
      [style.left.px]="signatureService.editorComponentX"
      [style.top.px]="signatureService.editorComponentY"
    >
      <div class="editor-navbar" (mousedown)="startDrag($event)">
        <span [style.flex]="1">{{ loc.get2("Components", "StiSignature") }}</span>
        <div class="close-button" (click)="model.showSignatureEditor = false">
          <img [src]="model.getImage('images.Other.CloseForm.png')" />
        </div>
      </div>
      <div class="content-container">
        <div class="content-navigation">
          <div
            class="navigation-button {{ signatureService.selectedMode == 'Type' ? 'current' : '' }}"
            (click)="changeMode('Type')"
          >
            <div class="navigation-label">
              <span>{{ loc.get2("PropertyEnum", "StiSignatureTypeType") }}</span>
            </div>
            <div class="indicator {{ signatureService.selectedMode == 'Type' ? 'current-indicator' : '' }}"></div>
          </div>
          <div
            class="navigation-button {{ signatureService.selectedMode == 'Draw' ? 'current' : '' }}"
            (click)="changeMode('Draw')"
          >
            <div class="navigation-label">
              <span>{{ loc.get2("PropertyEnum", "StiSignatureTypeDraw") }}</span>
            </div>
            <div class="indicator {{ signatureService.selectedMode == 'Draw' ? 'current-indicator' : '' }}"></div>
          </div>
          <div class="templates-navigation-container">
            <div (click)="saveTemplate()" class="template-navigation-button {{ isEmptyContent() ? 'disabled' : '' }}">
              <img [src]="model.getImage('signature.StiSignatureSave.png')" />
            </div>
            <div
              #button
              (click)="showSavedTemplatesPreview(button)"
              class="template-navigation-button show-button"
              [style.width.px]="38"
            >
              <img [src]="model.getImage('signature.StiSignatureOpen.png')" /><i class="pi pi-chevron-down"></i>
            </div>
          </div>
        </div>
        <div class="bottom-divider"></div>
        <div class="type-container" *ngIf="signatureService.selectedMode == 'Type'">
          <div class="input-field">
            <span>{{ loc.getP("FullName") }}</span
            ><input type="text" [(ngModel)]="fullName" />
          </div>
          <div class="input-field">
            <span>{{ loc.getP("Initials") }}</span
            ><input type="text" [(ngModel)]="initials" />
          </div>
          <div class="button-panel">
            <div #selectButton class="select-button" (click)="showFontsPreview(selectButton)">
              <span class="button-label">{{ loc.get2("ChartRibbon", "Style") }}</span
              ><i class="pi pi-chevron-down"></i>
            </div>
          </div>
          <div class="preview-panel" [style.font-family]="signatureService.currentPreviewFont">
            <span>{{ previewText }}</span>
          </div>
        </div>
        <div class="draw-container" *ngIf="signatureService.selectedMode == 'Draw'">
          <div class="draw-buttons-panel">
            <div
              class="button-container {{ drawingMode ? 'active' : '' }}"
              [stiTooltip]="loc.getP('ForeColor')"
              tooltipPosition="bottom"
              showDelay="500"
              (mousedown)="$event.preventDefault()"
              #fontColorEditor
            >
              <div class="preview-container" (click)="drawingMode = !drawingMode">
                <div class="foreground" [style]="{ backgroundPosition: 'center', backgroundRepeat: 'no-repeat' }">
                  <img [src]="model.getImage('images.Brush.png')" alt="" />
                </div>
                <span
                  class="color-preview"
                  [style.background-color]="brushColor != null ? brushColor?.toHtmlColor() : 'rgb(182, 181, 180)'"
                ></span>
              </div>
              <div
                (click)="showColorPicker(fontColorEditor, brushColor)"
                [style]="{ position: 'relative', display: 'flex', alignItems: 'center' }"
              >
                <i class="pi pi-chevron-down"></i>
              </div>
            </div>
            <div class="draw-panel-button" (click)="showEditor('Text')">
              <img [src]="model.getImage('signature.Text.png')" />
            </div>
            <div class="draw-panel-button" (click)="showEditor('Image')">
              <img [src]="model.getImage('images.Toolbox.StiImageElement.png')" />
            </div>
            <div class="draw-panel-button" (click)="clear()">
              <img [src]="model.getImage('images.Page.ClearContent.png')" />
            </div>
          </div>
          <div class="draw-panel" #previewContainer>
            <div class="canvas-container">
              <canvas
                [width]="previewContainer.clientWidth"
                [height]="previewContainer.clientHeight"
                (mousedown)="onMouseDown($event, canvas)"
                (mousemove)="onCanvasMove($event, canvas)"
                (touchstart)="onMouseDown($event, canvas)"
                (touchmove)="onCanvasMove($event, canvas)"
                #canvas
              >
              </canvas>
            </div>
            <div class="preview-inserted-text" [style]="insertedText.htmlStyle()" [style.justify-content]="alignment">
              <span>{{ insertedText.value }}</span>
            </div>
            <div class="inserted-image-container" [style.justify-content]="getHorizontalAlignment()">
              <div
                class="preview-inserted-image"
                [style.width.px]="
                  insertedImage?.aspectRatio && insertedImage?.stretch
                    ? previewContainer.clientHeight
                    : previewContainer.clientWidth
                "
                [style.height.px]="previewContainer.clientHeight"
                [style.background-image]="image"
                [style.background-position]="getBackgroundPosition()"
                [style.background-size]="getBackgroundSize(previewContainer)"
                [style.background-repeat]="image ? 'no-repeat' : ''"
              ></div>
            </div>
            <div class="signature-description">
              <span>{{ "Signature" }}</span>
            </div>
          </div>
        </div>
      </div>
      <div class="setup-accept">
        <div class="accept button" (click)="acceptChanges()">
          <span [style.margin-left.px]="0">{{
            model.previewMode
              ? loc.get2("Buttons", "Sign")
              : loc.get2("Buttons", "Save").replace("&amp", "").replace(";", "")
          }}</span>
        </div>
        <div class="cancel button" (click)="model.showSignatureEditor = false">
          <span [style.margin-left.px]="0">{{ loc.getP("Cancel") }}</span>
        </div>
      </div>
    </div>
    <div
      class="fonts-preview-container"
      *ngIf="signatureService.showFontsPreview"
      [style.left.px]="signatureService.fontsPreviewX"
      [style.top.px]="signatureService.fontsPreviewY"
    >
      <div
        *ngFor="let font of signatureService.previewFonts"
        class="font-preview"
        [style.font-family]="font"
        (click)="signatureService.currentPreviewFont = font; signatureService.showFontsPreview = false"
      >
        <div class="vertical-line {{ signatureService.currentPreviewFont == font ? 'current-indicator' : '' }}"></div>
        <span> {{ previewText }}</span>
      </div>
    </div>
    <div
      *ngIf="signatureService.showSavedTemplates"
      class="saved-templates-container"
      [style.left.px]="signatureService.templatesPreviewX"
      [style.top.px]="signatureService.templatesPreviewY"
      [style.overflow-y]="hasTemplates ? 'scroll' : 'hidden'"
    >
      <div class="empty-container" *ngIf="!hasTemplates">
        <span>{{ "No saved items" }}</span>
      </div>
      <div
        class="template-item"
        *ngFor="let temp of signatureService.savedTemplates; let i = index"
        [style.margin-top.px]="i == 0 ? 6 : 0"
        (click)="signatureService.setTemplate(temp)"
      >
        <div class="delete-button" (click)="signatureService.deleteTemplate(i)">
          <img [src]="model.getImage('images.Other.CloseForm.png')" />
        </div>
        <div
          class="image-template"
          *ngIf="temp.type == 'Image'"
          #parentContainer
          [style.justify-content]="signatureService.getTemplateHorizontalAlignment(temp)"
        >
          <div
            class="loadedImage image-content"
            [style.background-image]="signatureService.getTemplateImage(temp)"
            [style.background-position]="signatureService.getTemplateBackgroundPosition(temp)"
            [style.background-size]="signatureService.getTemplateBackgroundSize(temp, parentContainer)"
            [style.background-repeat]="'no-repeat'"
          ></div>
          <div class="insertedText image-content">
            <span [style]="temp.text.htmlStyle()">{{ temp?.text?.value }}</span>
          </div>
          <div
            class="drawedImage image-content"
            [style.background-size]="'contain'"
            [style.background-image]="signatureService.getTemplateDrawedImage(temp)"
          ></div>
        </div>
        <div class="text-template" *ngIf="temp.type == 'Text'">
          <span [style.font-family]="temp.specialFont" [style.font-size.pt]="16">{{
            temp.fullName + " " + temp.initials
          }}</span>
        </div>
      </div>
    </div>`, styles: [".image-content{height:100%;width:100%;top:0;left:0;position:absolute}.drawedImage{z-index:3}.loadedImage{z-index:1}.insertedText{z-index:2;display:flex;align-items:center;justify-content:center}.text-template{display:flex;align-items:center;justify-content:center;height:50px}.image-template{position:relative;height:130px}.template-item{width:calc(100% - 12px);height:fit-content;padding:2px;margin:0 6px 6px;border:1px solid lightgray;border-radius:3px;position:relative}.delete-button{position:absolute;z-index:999;right:0;top:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border-radius:3px}.delete-button img{height:16px;width:16px}.delete-button:hover img{filter:saturate(500%) contrast(100%) brightness(900%) invert(900%) sepia(50%)}.template-item:hover{background-color:#d7d7d7;cursor:pointer}.empty-container{height:100%;width:100%;background-color:#fafafa;display:flex;align-items:center;justify-content:center;color:#454545;font-size:13px;font-family:Arial}.saved-templates-container{position:absolute;overflow-x:hidden;overflow-y:scroll;width:335px;height:270px;border-radius:3px;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;border:1px solid rgb(25,71,138);display:flex;flex-direction:column;background-color:#fff;z-index:99999999999999999}.active{background-color:#d3d3d3;outline:1px solid rgb(61,107,186)}.canvas-container{position:absolute;left:0;top:0;height:100%;width:100%;z-index:99999}.preview-inserted-image{position:absolute}.inserted-image-container{position:absolute;left:0;top:0;display:flex;height:100%;width:100%}.preview-inserted-text{position:absolute;height:100%;width:100%;display:flex;align-items:center;justify-content:center;z-index:999}.signature-content{z-index:9999;height:100%;width:100%}.signature-description{width:calc(100% - 10px);height:50px;margin:0 5px;padding:0 5px;border-top:1px solid lightgray;display:flex;align-items:center;overflow:hidden;z-index:999}.disabled{pointer-events:none;opacity:.5}.preview-container{display:flex;width:100%;position:relative;flex-direction:column}.preview-container img{height:16px;width:16px}.button-container{display:flex;height:26px;width:40px;position:relative;margin-right:5px;border-radius:3px}.button-container:hover{background-color:#d3d3d3}.button-container:active{background-color:var(--columnDeleteHover-color)}.color-preview{width:20px;height:5px;margin-left:4px}i{height:12px;width:12px;right:3px;top:50%;vertical-align:middle;color:var(--text-color)}.button-container:hover i{color:#fff}.foreground{margin-left:8px;margin-top:2px;width:16px;height:16px}.template-navigation-button{height:26px;width:26px;margin-right:2px;border-radius:3px;display:flex;align-items:center;justify-content:center}.template-navigation-button:hover{background-color:#d3d3d3}.template-navigation-button img{height:16px;width:16px}.templates-navigation-container{width:100%;display:flex;align-items:center;justify-content:flex-end}.vertical-line{width:3px;height:calc(100% - 14px);margin:7px 10px 7px 5px}.font-preview{font-size:16px;height:42px;display:flex;align-items:center;padding-left:5px;border-radius:3px;margin:1px}.font-preview:hover{background-color:#dadada}.fonts-preview-container{position:absolute;width:200px;height:134px;z-index:9999999999;padding:1px;border-radius:3px;border:1px solid #c6c6c6;background:#fff;color:#444;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgba(0,0,0,.6);box-shadow:0 0 7px #0000004d;cursor:default}.draw-buttons-panel{height:26px;margin-bottom:5px;margin-top:10px;display:flex;padding-left:24px}.draw-panel-button:hover{background-color:#d3d3d3}.draw-panel-button{height:26px;width:26px;margin-right:5px;border-radius:3px;display:flex;align-items:center;justify-content:center}.draw-panel-button img{height:16px;width:16px}.draw-panel{border:1px dashed #ababab;border-radius:3px;margin:0 24px;width:calc(100% - 48px);height:186px;display:flex;flex-direction:column-reverse;position:relative}i{margin-left:5px;font-size:7px;padding-top:4px}.select-button{border:1px solid #dddddd;border-radius:3px;min-width:30px;padding-left:10px;padding-right:6px;display:flex;color:#444;align-items:center;margin-right:24px;margin-top:24px;height:24px}.select-button:hover{background-color:#d3d3d3}.button-panel{width:100%;display:flex;justify-content:flex-end}.preview-panel{height:80px;width:calc(100% - 48px);border:1px solid #ababab;border-radius:3px;font-size:16pt;margin:10px 24px;padding-left:12px;display:flex;align-items:center;overflow:hidden}.input-field{width:calc(100% - 24px);display:flex;margin:12px 12px 6px;padding:0 12px;align-items:center}.input-field span{min-width:100px;font-size:12px}.input-field input{border-radius:3px;padding-left:5px;height:24px;outline:none;border:1px solid lightgray;width:100%}.input-field input:hover{border-color:#454545}.current-indicator{background-color:#19478a}.other-indicator{background-color:transparent}.current{background-color:#e5e5e5}.navigation-button:hover{background-color:#dadada}.navigation-button{border-radius:3px;height:26px;min-width:50px;display:flex;flex-direction:column;color:#444;font-size:12px;font-family:Arial;margin-right:2px}.navigation-label{height:27px;width:100%;height:18px;padding:0 10px;display:flex;align-items:center;justify-content:center;white-space:nowrap}.navigation-label span{margin-top:7px}.indicator{height:3px;margin:1px 9px}.bottom-divider{height:1px;width:calc(100% - 24px);background-color:#d3d3d3;margin:5px 12px}.content-navigation{display:flex;padding:12px 12px 0}.content-container{height:100%;width:100%}.editor-navbar{display:flex;height:30px;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a;-webkit-user-select:none;color:#fff;align-items:center}.editor-navbar span{font-size:13px;margin-left:10px}.close-button{height:30px;width:30px;border-radius:3px;display:flex;align-items:center;justify-content:center}.close-button:hover{background-color:#dadada}.close-button img{height:16px;width:16px;filter:brightness(0) invert(1)}.editor-container{background-color:var(--back-color);position:absolute;left:calc(50% - 182px);top:calc(50% - 175px);z-index:999;width:365px;height:350px;overflow:hidden;display:flex;flex-direction:column;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;border:1px solid rgb(25,71,138);color:var(--text-color);font-size:12px;border-radius:5px;font-family:Arial;-webkit-user-select:none}.button{height:24px;width:80px;border-radius:3px;margin:3px 5px;display:flex;align-items:center;justify-content:center;border:1px solid transparent}.accept:active{background-color:#355da0;border-color:#264c7d}.cancel:active{background-color:#e2e2e2;border-color:#838383}.accept{background-color:#19478a;color:#fff}.accept:hover{background-color:#3d6298}.cancel{background-color:#ddd;color:#444}.cancel:hover{background-color:#d5d5d5}.setup-accept{padding:8px;display:flex;align-items:flex-end;justify-content:flex-end}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }, { type: StiMouseService }, { type: SignatureService }, { type: StiDraggableModalWindowService }, { type: StiColorDialogService }], propDecorators: { canvas: [{
                type: ViewChild,
                args: ["canvas"]
            }] } });

class StiEmbedTextEditorComponent {
    constructor(model, helper, loc, colorService, signatureService) {
        this.model = model;
        this.helper = helper;
        this.loc = loc;
        this.colorService = colorService;
        this.signatureService = signatureService;
        this.currentText = new StiTextItem();
    }
    get alignment() {
        if (this.currentText.horizontalAlignment == StiHorizontalAlignment.Center) {
            return "center";
        }
        else if (this.currentText.horizontalAlignment == StiHorizontalAlignment.Right) {
            return "end";
        }
        else {
            return "start";
        }
    }
    ngAfterViewInit() {
        setTimeout(() => {
            this.textInput.nativeElement.focus();
        });
    }
    showColorPicker(element, object, isRichText = false) {
        this.colorService.openDialog(element, object, isRichText);
    }
    setContent(innerText) {
        /* if ((this.model.getBrowserType() == "safari" || this.model.getBrowserType() == "firefox") && this.showPlaceholder) {
          this.editableContentService.startEdit();
        }
        if (
          this.model.getBrowserType() == "safari" ||
          (this.model.getBrowserType() == "firefox" && !this.showPlaceholder)
        ) {
          this.cdr.detach();
        } */
        this.currentText.value = innerText;
    }
    ngOnInit() {
        this.currentText = this.cloneTextItem(this.signatureService.currentEditableText);
        this.updateSignatureSubscription = this.signatureService.getInsertedInformation.subscribe((event) => {
            if (event.eventName == "TextEditor") {
                this.signatureService.updateSignature.next({ type: "Text", value: this.currentText });
            }
        });
    }
    cloneTextItem(textItem) {
        let result = new StiTextItem();
        let jObject = new StiJson();
        jObject.deserialize(textItem.saveToJsonObject({}).serialize());
        result.loadFromJsonObject(jObject);
        return result;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiEmbedTextEditorComponent, deps: [{ token: StiModelService }, { token: StiHelperService }, { token: StiLocalizationService }, { token: StiColorDialogService }, { token: SignatureService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiEmbedTextEditorComponent, selector: "embed-text-editor", viewQueries: [{ propertyName: "textInput", first: true, predicate: ["textInput"], descendants: true }], ngImport: i0, template: ` <div class="editor-container">
    <div class="editor-navigation">
      <sti-dropdown-component
        [id]="4"
        [options]="model.fontFamilies"
        [(value)]="currentText.font.family"
        [tooltip]="loc.get2('HelpDesigner', 'FontName')"
        [isMinVersion]="true"
        [optionLabel]="'name'"
        [optionValue]="'name'"
        [style]="{
          width: '100px',
          height: '24px',
          alignItems: 'center',
          marginRight: '5px',
          fontSize: '12px'
        }"
      ></sti-dropdown-component>
      <sti-dropdown-component
        [id]="5"
        [options]="helper.fontSizes"
        [(value)]="currentText.font.size"
        [tooltip]="loc.getP('FontSize')"
        [isMinVersion]="true"
        [style]="{
          width: '45px',
          height: '24px',
          alignItems: 'center',
          marginRight: '5px',
          fontSize: '12px'
        }"
      ></sti-dropdown-component>
      <sti-selectButton
        [options]="helper.styleOptions"
        [(value)]="currentText.font.style"
        [multiple]="true"
        optionValue="value"
        [style]="{ height: '26px', minWidth: '87px' }"
        ><ng-template let-item>
          <img
            [src]="model.getImage(item.image)"
            [stiTooltip]="loc.getP(item.value)"
            tooltipPosition="bottom"
            showDelay="500"
          /> </ng-template
      ></sti-selectButton>
      <div class="vertical-line"></div>
      <div
        class="button-container"
        [stiTooltip]="loc.getP('ForeColor')"
        tooltipPosition="bottom"
        showDelay="500"
        (click)="showColorPicker(fontColorEditor, currentText.color)"
        (mousedown)="$event.preventDefault()"
        #fontColorEditor
      >
        <div class="preview-container">
          <div class="foreground" [style]="{ backgroundPosition: 'center', backgroundRepeat: 'no-repeat' }">
            <img [src]="model.getImage('images.Brush.png')" alt="" />
          </div>
          <span
            class="color-preview"
            [style.background-color]="
              currentText.color != null ? currentText.color?.toHtmlColor() : 'rgb(182, 181, 180)'
            "
          ></span>
        </div>
        <div [style]="{ position: 'relative', alignSelf: 'center' }">
          <i class="pi pi-chevron-down"></i>
        </div>
      </div>
      <div class="vertical-line"></div>
      <sti-selectButton
        [options]="helper.justifyOptions"
        [(value)]="currentText.eContentAlignment"
        optionValue="value"
        [style]="{ height: '26px', minWidth: '94px' }"
      >
        <ng-template let-item>
          <img
            [src]="model.getImage(item.image)"
            [stiTooltip]="loc.getP(item.name)"
            tooltipPosition="bottom"
            showDelay="500"
            [style]="{ height: '16px', width: '16px' }"
          />
        </ng-template>
      </sti-selectButton>
    </div>
    <div class="text-container" (click)="textInput.focus()">
      <label
        class="text-input"
        #textInput
        spellcheck="false"
        [attr.contenteditable]="'plaintext-only'"
        [style]="currentText.htmlStyle()"
        [textContent]="currentText.value"
        [style.text-align]="alignment"
        (input)="setContent($event.target.textContent)"
      ></label>
    </div>
  </div>`, isInline: true, styles: [".text-input{width:100%;height:100%;min-width:10px;margin:0;outline:none;max-width:100%;overflow:hidden;scroll-behavior:smooth;padding:4px}.text-container:hover{cursor:text}.text-container{display:flex}.preview-container{display:flex;width:100%;position:relative;flex-direction:column}.button-container{display:flex;height:26px;width:40px;position:relative;margin:0 2px;border-radius:3px}.button-container:hover{background-color:var(--hover-color)}.button-container:active{background-color:var(--columnDeleteHover-color)}.color-preview{width:20px;height:5px;margin-left:4px}i{height:12px;width:12px;right:3px;top:50%;vertical-align:middle;color:var(--text-color)}.button-container:hover i{color:#fff}.foreground{margin-left:8px;margin-top:2px;width:16px;height:18px}.vertical-line{height:26px;width:1px;background-color:#d3d3d3;margin:0 3px}img{max-width:16px}.text-container{border-radius:3px;border:1px dashed lightgray;height:100%;width:100%}.editor-container{height:calc(100% - 20px);width:calc(100% - 20px);margin:10px;display:flex;flex-direction:column}.editor-navigation{height:26px;margin-bottom:5px;margin-top:10px;display:flex}.navigation-button:hover{background-color:#d3d3d3}.navigation-button{height:26px;width:26px;margin-right:2px;border-radius:3px;display:flex;align-items:center;justify-content:center}.navigation-button img{height:16px;width:16px}\n"], dependencies: [{ kind: "component", type: StiDropdownComponent, selector: "sti-dropdown-component", inputs: ["id", "options", "value", "disabled", "optionLabel", "optionValue", "isMinVersion", "tooltip"], outputs: ["valueChange"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }, { kind: "component", type: StiSelectButtonComponent, selector: "sti-selectButton", inputs: ["options", "value", "optionLabel", "optionValue", "multiple", "disabled"], outputs: ["onOptionClick", "onChange", "valueChange"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiEmbedTextEditorComponent, decorators: [{
            type: Component,
            args: [{ selector: "embed-text-editor", template: ` <div class="editor-container">
    <div class="editor-navigation">
      <sti-dropdown-component
        [id]="4"
        [options]="model.fontFamilies"
        [(value)]="currentText.font.family"
        [tooltip]="loc.get2('HelpDesigner', 'FontName')"
        [isMinVersion]="true"
        [optionLabel]="'name'"
        [optionValue]="'name'"
        [style]="{
          width: '100px',
          height: '24px',
          alignItems: 'center',
          marginRight: '5px',
          fontSize: '12px'
        }"
      ></sti-dropdown-component>
      <sti-dropdown-component
        [id]="5"
        [options]="helper.fontSizes"
        [(value)]="currentText.font.size"
        [tooltip]="loc.getP('FontSize')"
        [isMinVersion]="true"
        [style]="{
          width: '45px',
          height: '24px',
          alignItems: 'center',
          marginRight: '5px',
          fontSize: '12px'
        }"
      ></sti-dropdown-component>
      <sti-selectButton
        [options]="helper.styleOptions"
        [(value)]="currentText.font.style"
        [multiple]="true"
        optionValue="value"
        [style]="{ height: '26px', minWidth: '87px' }"
        ><ng-template let-item>
          <img
            [src]="model.getImage(item.image)"
            [stiTooltip]="loc.getP(item.value)"
            tooltipPosition="bottom"
            showDelay="500"
          /> </ng-template
      ></sti-selectButton>
      <div class="vertical-line"></div>
      <div
        class="button-container"
        [stiTooltip]="loc.getP('ForeColor')"
        tooltipPosition="bottom"
        showDelay="500"
        (click)="showColorPicker(fontColorEditor, currentText.color)"
        (mousedown)="$event.preventDefault()"
        #fontColorEditor
      >
        <div class="preview-container">
          <div class="foreground" [style]="{ backgroundPosition: 'center', backgroundRepeat: 'no-repeat' }">
            <img [src]="model.getImage('images.Brush.png')" alt="" />
          </div>
          <span
            class="color-preview"
            [style.background-color]="
              currentText.color != null ? currentText.color?.toHtmlColor() : 'rgb(182, 181, 180)'
            "
          ></span>
        </div>
        <div [style]="{ position: 'relative', alignSelf: 'center' }">
          <i class="pi pi-chevron-down"></i>
        </div>
      </div>
      <div class="vertical-line"></div>
      <sti-selectButton
        [options]="helper.justifyOptions"
        [(value)]="currentText.eContentAlignment"
        optionValue="value"
        [style]="{ height: '26px', minWidth: '94px' }"
      >
        <ng-template let-item>
          <img
            [src]="model.getImage(item.image)"
            [stiTooltip]="loc.getP(item.name)"
            tooltipPosition="bottom"
            showDelay="500"
            [style]="{ height: '16px', width: '16px' }"
          />
        </ng-template>
      </sti-selectButton>
    </div>
    <div class="text-container" (click)="textInput.focus()">
      <label
        class="text-input"
        #textInput
        spellcheck="false"
        [attr.contenteditable]="'plaintext-only'"
        [style]="currentText.htmlStyle()"
        [textContent]="currentText.value"
        [style.text-align]="alignment"
        (input)="setContent($event.target.textContent)"
      ></label>
    </div>
  </div>`, styles: [".text-input{width:100%;height:100%;min-width:10px;margin:0;outline:none;max-width:100%;overflow:hidden;scroll-behavior:smooth;padding:4px}.text-container:hover{cursor:text}.text-container{display:flex}.preview-container{display:flex;width:100%;position:relative;flex-direction:column}.button-container{display:flex;height:26px;width:40px;position:relative;margin:0 2px;border-radius:3px}.button-container:hover{background-color:var(--hover-color)}.button-container:active{background-color:var(--columnDeleteHover-color)}.color-preview{width:20px;height:5px;margin-left:4px}i{height:12px;width:12px;right:3px;top:50%;vertical-align:middle;color:var(--text-color)}.button-container:hover i{color:#fff}.foreground{margin-left:8px;margin-top:2px;width:16px;height:18px}.vertical-line{height:26px;width:1px;background-color:#d3d3d3;margin:0 3px}img{max-width:16px}.text-container{border-radius:3px;border:1px dashed lightgray;height:100%;width:100%}.editor-container{height:calc(100% - 20px);width:calc(100% - 20px);margin:10px;display:flex;flex-direction:column}.editor-navigation{height:26px;margin-bottom:5px;margin-top:10px;display:flex}.navigation-button:hover{background-color:#d3d3d3}.navigation-button{height:26px;width:26px;margin-right:2px;border-radius:3px;display:flex;align-items:center;justify-content:center}.navigation-button img{height:16px;width:16px}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiHelperService }, { type: StiLocalizationService }, { type: StiColorDialogService }, { type: SignatureService }], propDecorators: { textInput: [{
                type: ViewChild,
                args: ["textInput"]
            }] } });

class StiEmbedImageEditorComponent {
    get hasImage() {
        return this.loadedImage ? true : false;
    }
    get image() {
        return "url(" + this.loadedImage + ")";
    }
    clear() {
        this.loadedImage = null;
    }
    getBackgroundSize(container) {
        if (!this.loadedImage) {
            return;
        }
        if (this.useAspectRatio && this.useStretch) {
            return "contain";
        }
        if (this.useStretch) {
            return `${container.offsetWidth}px ${container.offsetHeight}px`;
        }
        else {
            return `${this.currentImageNaturalWidth}px ${this.currentImageNaturalHeight}px`;
        }
    }
    getBackgroundPosition() {
        if (this.useStretch && !this.useAspectRatio) {
            return `center`;
        }
        else {
            return `${this.signatureService.getVerticalPosition(this.currentVerticalAlignment)} ${this.signatureService.getHorizontalPosition(this.currentHorizontalAlignment)}`;
        }
    }
    getHorizontalAlignment() {
        if (this.currentHorizontalAlignment == StiHorizontalAlignment.Center) {
            return "center";
        }
        else if (this.currentHorizontalAlignment == StiHorizontalAlignment.Left) {
            return "start";
        }
        else {
            return "end";
        }
    }
    onFileSelected(event) {
        if (event.files && event.files[0]) {
            var reader = new FileReader();
            reader.onload = (e) => {
                let image = new Image();
                image.onload = () => {
                    this.currentImageNaturalHeight = image.naturalHeight;
                    this.currentImageNaturalWidth = image.naturalWidth;
                };
                image.src = e.target.result;
                setTimeout(() => {
                    this.loadedImage = e.target.result;
                });
            };
            reader.readAsDataURL(event.files[0]);
        }
    }
    constructor(model, loc, helper, signatureService) {
        this.model = model;
        this.loc = loc;
        this.helper = helper;
        this.signatureService = signatureService;
        this.currentVerticalAlignment = StiVerticalAlignment.Center;
        this.currentHorizontalAlignment = StiHorizontalAlignment.Center;
        this.useAspectRatio = false;
        this.useStretch = false;
        this.currentImageNaturalWidth = 0;
        this.currentImageNaturalHeight = 0;
    }
    ngOnInit() {
        if (this.signatureService.currentEditableImage) {
            this.loadedImage = this.signatureService.currentEditableImage.loadedImage;
            this.currentVerticalAlignment = this.signatureService.currentEditableImage.verticalAlignment;
            this.currentHorizontalAlignment = this.signatureService.currentEditableImage.horizontalAlignment;
            this.useAspectRatio = this.signatureService.currentEditableImage.aspectRatio;
            this.useStretch = this.signatureService.currentEditableImage.stretch;
            this.currentImageNaturalHeight = this.signatureService.currentEditableImage.naturalHeight;
            this.currentImageNaturalWidth = this.signatureService.currentEditableImage.naturalWidth;
        }
        this.updateSignatureSubscription = this.signatureService.getInsertedInformation.subscribe((event) => {
            if (event.eventName == "ImageEditor") {
                let resultObject = new StiImageEditorResult();
                resultObject.loadedImage = this.loadedImage;
                resultObject.verticalAlignment = this.currentVerticalAlignment;
                resultObject.horizontalAlignment = this.currentHorizontalAlignment;
                resultObject.aspectRatio = this.useAspectRatio;
                resultObject.stretch = this.useStretch;
                resultObject.naturalHeight = this.currentImageNaturalHeight;
                resultObject.naturalWidth = this.currentImageNaturalWidth;
                this.signatureService.updateSignature.next({ type: "Image", value: resultObject });
            }
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiEmbedImageEditorComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }, { token: StiHelperService }, { token: SignatureService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiEmbedImageEditorComponent, selector: "embed-image-editor", ngImport: i0, template: `<div class="editor-container">
    <div class="editor-navigation">
      <div
        class="navigation-button"
        [style.min-width.px]="50"
        [style.padding]="'0px 10px'"
        [style.width]="'auto'"
        (click)="inputFile.click()"
      >
        <img [src]="model.getImage('images.Other.Open.png')" />
        <span [style.margin-left.px]="2"> {{ loc.get2("Buttons", "Open") }}</span>
      </div>
      <div class="navigation-button {{ hasImage ? '' : 'disabled' }}" (click)="clear()">
        <img [src]="model.getImage('images.Ribbon.Delete.png')" />
      </div>
      <sti-selectButton
        [options]="helper.justifyOptions"
        [(value)]="currentHorizontalAlignment"
        [disabled]="!hasImage"
        optionValue="value"
        [style]="{ height: '26px', minWidth: '94px' }"
      >
        <ng-template let-item>
          <img
            [src]="model.getImage(item.image)"
            [stiTooltip]="loc.getP(item.name)"
            tooltipPosition="bottom"
            showDelay="500"
            [style]="{ height: '16px', width: '16px' }"
          />
        </ng-template>
      </sti-selectButton>
      <sti-selectButton
        [options]="helper.verticalAlignment"
        [(value)]="currentVerticalAlignment"
        [disabled]="!hasImage"
        optionValue="value"
        [style]="{ height: '26px', minWidth: '94px' }"
      >
        <ng-template let-item>
          <img
            [src]="model.getImage(item.image)"
            [stiTooltip]="loc.getP(item.name)"
            tooltipPosition="bottom"
            showDelay="500"
            [style]="{ height: '16px', width: '16px' }"
          />
        </ng-template>
      </sti-selectButton>
      <sti-checkbox
        class="min-version"
        [(value)]="useAspectRatio"
        [disabled]="!hasImage"
        [label]="'Aspect Ratio'"
      ></sti-checkbox>
      <sti-checkbox
        class="min-version"
        [(value)]="useStretch"
        [disabled]="!hasImage"
        [label]="'Stretch'"
      ></sti-checkbox>
    </div>
    <div class="image-container" #imageContainer [style.justify-content]="getHorizontalAlignment()">
      <input
        type="file"
        [style.display]="'none'"
        accept=".jpg, .jpeg, .png"
        (click)="$event.target.value = null"
        (change)="onFileSelected($event.target)"
        #inputFile
      />
      <div
        class="image-preview"
        [style.width.px]="useStretch && useAspectRatio ? imageContainer.clientHeight : imageContainer.clientWidth"
        [style.height.px]="imageContainer.clientHeight"
        [style.background-image]="image"
        [style.background-position]="getBackgroundPosition()"
        [style.background-size]="getBackgroundSize(imageContainer)"
        [style.background-repeat]="image ? 'no-repeat' : ''"
      ></div>
    </div>
  </div>`, isInline: true, styles: [".image-preview{width:100%;height:100%}.disabled{pointer-events:none;opacity:.6}sti-checkbox{font-size:12px!important;font-family:Arial!important;margin:0 5px}sti-checkbox .label{font-size:12px!important}.image-container{border-radius:3px;border:1px dashed lightgray;height:100%;width:100%;display:flex}.editor-container{height:calc(100% - 20px);width:calc(100% - 20px);margin:10px;display:flex;flex-direction:column}.editor-navigation{height:26px;margin-bottom:5px;margin-top:10px;display:flex}.navigation-button:hover{background-color:#d3d3d3}.navigation-button{height:26px;width:26px;margin-right:2px;border-radius:3px;display:flex;align-items:center;justify-content:center}.navigation-button img{height:16px;width:16px}\n"], dependencies: [{ kind: "component", type: StiUniversalCheckboxComponent, selector: "sti-checkbox", inputs: ["value", "disabled", "label"], outputs: ["valueChange"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }, { kind: "component", type: StiSelectButtonComponent, selector: "sti-selectButton", inputs: ["options", "value", "optionLabel", "optionValue", "multiple", "disabled"], outputs: ["onOptionClick", "onChange", "valueChange"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiEmbedImageEditorComponent, decorators: [{
            type: Component,
            args: [{ selector: "embed-image-editor", template: `<div class="editor-container">
    <div class="editor-navigation">
      <div
        class="navigation-button"
        [style.min-width.px]="50"
        [style.padding]="'0px 10px'"
        [style.width]="'auto'"
        (click)="inputFile.click()"
      >
        <img [src]="model.getImage('images.Other.Open.png')" />
        <span [style.margin-left.px]="2"> {{ loc.get2("Buttons", "Open") }}</span>
      </div>
      <div class="navigation-button {{ hasImage ? '' : 'disabled' }}" (click)="clear()">
        <img [src]="model.getImage('images.Ribbon.Delete.png')" />
      </div>
      <sti-selectButton
        [options]="helper.justifyOptions"
        [(value)]="currentHorizontalAlignment"
        [disabled]="!hasImage"
        optionValue="value"
        [style]="{ height: '26px', minWidth: '94px' }"
      >
        <ng-template let-item>
          <img
            [src]="model.getImage(item.image)"
            [stiTooltip]="loc.getP(item.name)"
            tooltipPosition="bottom"
            showDelay="500"
            [style]="{ height: '16px', width: '16px' }"
          />
        </ng-template>
      </sti-selectButton>
      <sti-selectButton
        [options]="helper.verticalAlignment"
        [(value)]="currentVerticalAlignment"
        [disabled]="!hasImage"
        optionValue="value"
        [style]="{ height: '26px', minWidth: '94px' }"
      >
        <ng-template let-item>
          <img
            [src]="model.getImage(item.image)"
            [stiTooltip]="loc.getP(item.name)"
            tooltipPosition="bottom"
            showDelay="500"
            [style]="{ height: '16px', width: '16px' }"
          />
        </ng-template>
      </sti-selectButton>
      <sti-checkbox
        class="min-version"
        [(value)]="useAspectRatio"
        [disabled]="!hasImage"
        [label]="'Aspect Ratio'"
      ></sti-checkbox>
      <sti-checkbox
        class="min-version"
        [(value)]="useStretch"
        [disabled]="!hasImage"
        [label]="'Stretch'"
      ></sti-checkbox>
    </div>
    <div class="image-container" #imageContainer [style.justify-content]="getHorizontalAlignment()">
      <input
        type="file"
        [style.display]="'none'"
        accept=".jpg, .jpeg, .png"
        (click)="$event.target.value = null"
        (change)="onFileSelected($event.target)"
        #inputFile
      />
      <div
        class="image-preview"
        [style.width.px]="useStretch && useAspectRatio ? imageContainer.clientHeight : imageContainer.clientWidth"
        [style.height.px]="imageContainer.clientHeight"
        [style.background-image]="image"
        [style.background-position]="getBackgroundPosition()"
        [style.background-size]="getBackgroundSize(imageContainer)"
        [style.background-repeat]="image ? 'no-repeat' : ''"
      ></div>
    </div>
  </div>`, styles: [".image-preview{width:100%;height:100%}.disabled{pointer-events:none;opacity:.6}sti-checkbox{font-size:12px!important;font-family:Arial!important;margin:0 5px}sti-checkbox .label{font-size:12px!important}.image-container{border-radius:3px;border:1px dashed lightgray;height:100%;width:100%;display:flex}.editor-container{height:calc(100% - 20px);width:calc(100% - 20px);margin:10px;display:flex;flex-direction:column}.editor-navigation{height:26px;margin-bottom:5px;margin-top:10px;display:flex}.navigation-button:hover{background-color:#d3d3d3}.navigation-button{height:26px;width:26px;margin-right:2px;border-radius:3px;display:flex;align-items:center;justify-content:center}.navigation-button img{height:16px;width:16px}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }, { type: StiHelperService }, { type: SignatureService }] });

class StiDraggableModalWindowComponent {
    constructor(model, loc, modalWindowService, signatureService, mouseService) {
        this.model = model;
        this.loc = loc;
        this.modalWindowService = modalWindowService;
        this.signatureService = signatureService;
        this.mouseService = mouseService;
    }
    ngAfterViewInit() {
        const onResize = (event) => {
            this.modalWindowService.editorX = (window.innerWidth - this.modalWindowService.editorWidth) / 2;
            this.modalWindowService.editorY = (window.innerHeight - this.modalWindowService.editorHeight) / 2;
        };
        window.addEventListener("resize", onResize);
    }
    get header() {
        return this.modalWindowService.isTextEditor
            ? this.loc.get2("FormTitles", "TextEditorForm")
            : this.loc.get2("Components", "StiImage");
    }
    startDrag(event) {
        this.startX = event.clientX;
        this.startY = event.clientY;
        this.startComponentX = this.modalWindowService.editorX;
        this.startComponentY = this.modalWindowService.editorY;
        this.isDragging = true;
    }
    accept() {
        this.modalWindowService.isTextEditor
            ? this.signatureService.getInsertedInformation.next({ eventName: "TextEditor" })
            : this.signatureService.getInsertedInformation.next({ eventName: "ImageEditor" });
        this.model.showDraggableModalWindow = false;
    }
    onMouseMove(event) {
        if (this.isDragging) {
            let deltaX = event.clientX - this.startX;
            let deltaY = event.clientY - this.startY;
            if (this.startComponentX + deltaX < 0) {
                this.modalWindowService.editorX = 0;
            }
            else if (this.startComponentX + deltaX > window.innerWidth - this.modalWindowService.editorWidth) {
                this.modalWindowService.editorX = window.innerWidth - this.modalWindowService.editorWidth;
            }
            else {
                this.modalWindowService.editorX = this.startComponentX + deltaX;
            }
            if (this.startComponentY + deltaY < 0) {
                this.modalWindowService.editorY = 0;
            }
            else if (this.startComponentY + deltaY > window.innerHeight - this.modalWindowService.editorHeight) {
                this.modalWindowService.editorY = window.innerHeight - this.modalWindowService.editorHeight;
            }
            else {
                this.modalWindowService.editorY = this.startComponentY + deltaY;
            }
        }
    }
    ngOnInit() {
        this.modalWindowService.editorX = (window.innerWidth - this.modalWindowService.editorWidth) / 2;
        this.modalWindowService.editorY = (window.innerHeight - this.modalWindowService.editorHeight) / 2;
        this.mouseUpSubscription = this.mouseService.getDocumentMouseUp().subscribe(() => {
            this.isDragging = false;
        });
        this.mouseMoveSubscription = this.mouseService.getDocumentMouseMove().subscribe((event) => {
            this.onMouseMove(event);
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDraggableModalWindowComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }, { token: StiDraggableModalWindowService }, { token: SignatureService }, { token: StiMouseService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiDraggableModalWindowComponent, selector: "sti-draggable-modal-window", ngImport: i0, template: `<div
    class="draggable-modal-window-container"
    [style.left.px]="modalWindowService.editorX"
    [style.top.px]="modalWindowService.editorY"
  >
    <div class="draggable-modal-window-navbar" (mousedown)="startDrag($event)">
      <span [style.flex]="1">{{ header }}</span>
      <div class="close-button" (click)="model.showDraggableModalWindow = false">
        <img [src]="model.getImage('images.Other.CloseForm.png')" />
      </div>
    </div>
    <div class="content-container">
      <embed-text-editor *ngIf="modalWindowService.isTextEditor"></embed-text-editor>
      <embed-image-editor *ngIf="modalWindowService.isImageEditor"></embed-image-editor>
    </div>
    <div class="setup-accept">
      <div class="accept button" (click)="accept()">
        <span [style.margin-left.px]="0">{{ loc.getP("Insert").replace("&amp", "").replace(";", "") }}</span>
      </div>
      <div class="cancel button" (click)="model.showDraggableModalWindow = false">
        <span [style.margin-left.px]="0">{{ loc.getP("Cancel") }}</span>
      </div>
    </div>
  </div> `, isInline: true, styles: [".draggable-modal-window-container{background-color:var(--back-color);position:absolute;left:calc(50% - 400px);top:calc(50% - 255px);z-index:999;width:800px;height:510px;overflow:hidden;display:flex;flex-direction:column;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;border:1px solid rgb(25,71,138);color:var(--text-color);font-size:12px;border-radius:5px;font-family:Arial;-webkit-user-select:none}.draggable-modal-window-navbar{display:flex;height:30px;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a;-webkit-user-select:none;color:#fff;align-items:center}.draggable-modal-window-navbar span{font-size:13px;margin-left:10px}.close-button{height:30px;width:30px;border-radius:3px;display:flex;align-items:center;justify-content:center}.close-button:hover{background-color:#dadada}.close-button img{height:16px;width:16px;filter:brightness(0) invert(1)}.content-container{height:100%;width:100%}.setup-accept{padding:8px;display:flex;align-items:flex-end;justify-content:flex-end}.button{height:24px;width:80px;border-radius:3px;margin:3px 5px;display:flex;align-items:center;justify-content:center;border:1px solid transparent}.accept:active{background-color:#355da0;border-color:#264c7d}.cancel:active{background-color:#e2e2e2;border-color:#838383}.accept{background-color:#19478a;color:#fff}.accept:hover{background-color:#3d6298}.cancel{background-color:#ddd;color:#444}.cancel:hover{background-color:#d5d5d5}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiEmbedTextEditorComponent, selector: "embed-text-editor" }, { kind: "component", type: StiEmbedImageEditorComponent, selector: "embed-image-editor" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiDraggableModalWindowComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-draggable-modal-window", template: `<div
    class="draggable-modal-window-container"
    [style.left.px]="modalWindowService.editorX"
    [style.top.px]="modalWindowService.editorY"
  >
    <div class="draggable-modal-window-navbar" (mousedown)="startDrag($event)">
      <span [style.flex]="1">{{ header }}</span>
      <div class="close-button" (click)="model.showDraggableModalWindow = false">
        <img [src]="model.getImage('images.Other.CloseForm.png')" />
      </div>
    </div>
    <div class="content-container">
      <embed-text-editor *ngIf="modalWindowService.isTextEditor"></embed-text-editor>
      <embed-image-editor *ngIf="modalWindowService.isImageEditor"></embed-image-editor>
    </div>
    <div class="setup-accept">
      <div class="accept button" (click)="accept()">
        <span [style.margin-left.px]="0">{{ loc.getP("Insert").replace("&amp", "").replace(";", "") }}</span>
      </div>
      <div class="cancel button" (click)="model.showDraggableModalWindow = false">
        <span [style.margin-left.px]="0">{{ loc.getP("Cancel") }}</span>
      </div>
    </div>
  </div> `, styles: [".draggable-modal-window-container{background-color:var(--back-color);position:absolute;left:calc(50% - 400px);top:calc(50% - 255px);z-index:999;width:800px;height:510px;overflow:hidden;display:flex;flex-direction:column;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;border:1px solid rgb(25,71,138);color:var(--text-color);font-size:12px;border-radius:5px;font-family:Arial;-webkit-user-select:none}.draggable-modal-window-navbar{display:flex;height:30px;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a;-webkit-user-select:none;color:#fff;align-items:center}.draggable-modal-window-navbar span{font-size:13px;margin-left:10px}.close-button{height:30px;width:30px;border-radius:3px;display:flex;align-items:center;justify-content:center}.close-button:hover{background-color:#dadada}.close-button img{height:16px;width:16px;filter:brightness(0) invert(1)}.content-container{height:100%;width:100%}.setup-accept{padding:8px;display:flex;align-items:flex-end;justify-content:flex-end}.button{height:24px;width:80px;border-radius:3px;margin:3px 5px;display:flex;align-items:center;justify-content:center;border:1px solid transparent}.accept:active{background-color:#355da0;border-color:#264c7d}.cancel:active{background-color:#e2e2e2;border-color:#838383}.accept{background-color:#19478a;color:#fff}.accept:hover{background-color:#3d6298}.cancel{background-color:#ddd;color:#444}.cancel:hover{background-color:#d5d5d5}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }, { type: StiDraggableModalWindowService }, { type: SignatureService }, { type: StiMouseService }] });

class StiTooltipComponent {
    constructor(tooltipService, model) {
        this.tooltipService = tooltipService;
        this.model = model;
        this.initialized = false;
    }
    ngAfterViewInit() {
        setTimeout(() => {
            this.initialized = true;
        });
    }
    getTooltipArrow() {
        switch (this.tooltipService.position) {
            case "top":
                return "bottom-arrow";
            case "bottom":
                return "top-arrow";
            case "left":
                return "right-arrow";
            case "right":
                return "left-arrow";
        }
    }
    getLeft(tooltipElement) {
        let elementRect = this.model.getPositionRelativeToForm(tooltipElement);
        if (this.tooltipService.elementRect && this.initialized) {
            switch (this.tooltipService.position) {
                case "left":
                    return this.correctLeftLimits(this.tooltipService.elementRect.left - (elementRect.width + 8), elementRect);
                case "right":
                    return this.correctLeftLimits(this.tooltipService.elementRect.right + 8, elementRect);
                case "top":
                case "bottom":
                    return this.correctLeftLimits(this.tooltipService.elementRect.left + (this.tooltipService.elementRect.width / 2 - elementRect.width / 2), elementRect);
            }
        }
        else {
            return -999;
        }
    }
    getTop(tooltipElement) {
        let elementRect = this.model.getPositionRelativeToForm(tooltipElement);
        if (this.tooltipService.elementRect && this.initialized) {
            switch (this.tooltipService.position) {
                case "top":
                    return this.correctTopLimits(this.tooltipService.elementRect.top - (elementRect.height + 8), elementRect);
                case "bottom":
                    return this.correctTopLimits(this.tooltipService.elementRect.bottom + 8, elementRect);
                case "left":
                case "right":
                    return this.correctTopLimits(this.tooltipService.elementRect.top + (this.tooltipService.elementRect.height / 2 - elementRect.height / 2), elementRect);
            }
        }
        else {
            return -999;
        }
    }
    correctLeftLimits(value, tooltipRect) {
        if (value < 0) {
            return 0;
        }
        else if (value + tooltipRect.width > window.innerWidth) {
            return Math.round(window.innerWidth - tooltipRect.width).toFixed(2);
        }
        else {
            return Math.round(value).toFixed(2);
        }
    }
    correctTopLimits(value, tooltipRect) {
        if (value < 0) {
            return 0;
        }
        else if (value + tooltipRect.height > window.innerHeight) {
            return Math.round(window.innerHeight - tooltipRect.height).toFixed(2);
        }
        else {
            return Math.round(value).toFixed(2);
        }
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTooltipComponent, deps: [{ token: StiTooltipService }, { token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTooltipComponent, selector: "sti-tooltip", ngImport: i0, template: ` <div
    #tooltip
    class="sti-tooltip {{ getTooltipArrow() }}"
    [style.left.px]="getLeft(tooltip)"
    [style.top.px]="getTop(tooltip)"
  >
    <span>{{ tooltipService.text }}</span>
  </div>`, isInline: true, styles: [".sti-tooltip{position:absolute;background:var(--back-color);color:var(--text-color);padding:.429rem;box-shadow:0 3px 6px #00000029;border-radius:3px;z-index:99999999;white-space:pre-line}.sti-tooltip span{font-size:16px;font-family:Arial}.bottom-arrow:before,.bottom-arrow:after{content:\"\";position:absolute;left:calc(50% - 8px);bottom:-16px;border:8px solid transparent;border-top:8px solid white}.bottom-arrow:after{border-top:8px solid white;bottom:-16px}.top-arrow:before,.top-arrow:after{content:\"\";position:absolute;left:calc(50% - 8px);top:-16px;border:8px solid transparent;border-bottom:8px solid white}.top-arrow:after{border-bottom:8px solid white;top:-16px}.left-arrow:before,.left-arrow:after{content:\"\";position:absolute;left:-16px;top:calc(50% - 8px);border:8px solid transparent;border-right:8px solid white}.left-arrow:after{border-right:8px solid white;left:-16px}.right-arrow:before,.right-arrow:after{content:\"\";position:absolute;right:-16px;top:calc(50% - 8px);border:8px solid transparent;border-left:8px solid white}.right-arrow:after{border-left:8px solid white;right:-16px}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTooltipComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-tooltip", template: ` <div
    #tooltip
    class="sti-tooltip {{ getTooltipArrow() }}"
    [style.left.px]="getLeft(tooltip)"
    [style.top.px]="getTop(tooltip)"
  >
    <span>{{ tooltipService.text }}</span>
  </div>`, styles: [".sti-tooltip{position:absolute;background:var(--back-color);color:var(--text-color);padding:.429rem;box-shadow:0 3px 6px #00000029;border-radius:3px;z-index:99999999;white-space:pre-line}.sti-tooltip span{font-size:16px;font-family:Arial}.bottom-arrow:before,.bottom-arrow:after{content:\"\";position:absolute;left:calc(50% - 8px);bottom:-16px;border:8px solid transparent;border-top:8px solid white}.bottom-arrow:after{border-top:8px solid white;bottom:-16px}.top-arrow:before,.top-arrow:after{content:\"\";position:absolute;left:calc(50% - 8px);top:-16px;border:8px solid transparent;border-bottom:8px solid white}.top-arrow:after{border-bottom:8px solid white;top:-16px}.left-arrow:before,.left-arrow:after{content:\"\";position:absolute;left:-16px;top:calc(50% - 8px);border:8px solid transparent;border-right:8px solid white}.left-arrow:after{border-right:8px solid white;left:-16px}.right-arrow:before,.right-arrow:after{content:\"\";position:absolute;right:-16px;top:calc(50% - 8px);border:8px solid transparent;border-left:8px solid white}.right-arrow:after{border-left:8px solid white;right:-16px}\n"] }]
        }], ctorParameters: () => [{ type: StiTooltipService }, { type: StiModelService }] });

class StiTrialTimerWindowComponent {
    isRusLocalization() {
        if (this.loc.currentLocalization?.cultureName?.toLowerCase() == "ru") {
            return true;
        }
        else {
            return false;
        }
    }
    upgradeClick() {
        window.open("https://www.stimulsoft.com/en/online-store#embedded/forms/web", "_blank");
    }
    getRemainingDays() {
        let user = this.userService?.currentUser;
        if (!user || user?.days <= 0) {
            return "0";
        }
        let today = new Date();
        let created = new Date(user.created);
        let oneDay = 24 * 60 * 60 * 1000;
        let differenceInTime = today.getTime() - created.getTime();
        let diffDays = user?.days - differenceInTime / oneDay;
        return Math.trunc(Math.max(0, diffDays)).toString();
    }
    constructor(model, loc, userService) {
        this.model = model;
        this.loc = loc;
        this.userService = userService;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTrialTimerWindowComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }, { token: StiUserService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTrialTimerWindowComponent, selector: "sti-trial-timer-window", ngImport: i0, template: `<div class="trial-timer-window">
    <div class="trial-timer-window-navbar">
      <span [style.flex]="1">{{ loc.get2("Permissions", "ItemForms") }}</span>
      <div
        class="close-button {{ getRemainingDays() == '0' ? 'disabled' : '' }}"
        (click)="model.showTrialTimerWindow = false"
      >
        <img [src]="model.getImage('images.Other.CloseForm.png')" />
      </div>
    </div>
    <div class="trial-timer-window-content">
      <div class="trial-timer-window-interface">
        <div class="trial-timer-image">
          <img
            [style.width.px]="isRusLocalization() ? 239 : 197"
            [src]="
              isRusLocalization()
                ? model.getImage('images.Other.TrialDaysLeft_Ru.png')
                : model.getImage('images.Other.TrialDaysLeft_En.png')
            "
          />
          <div
            class="timer-remaining-days"
            [style.left]="isRusLocalization() ? 'calc(50% - 93px)' : 'calc(50% - 72px)'"
          >
            {{ getRemainingDays() }}
          </div>
        </div>
        <div class="trial-timer-warnings">
          <span class="blue description">{{
            loc.get2("Notices", "YourTrialWillExpire").replace("{0}", getRemainingDays())
          }}</span>
          <span class="lightgray description">{{ loc.get2("Notices", "ActivationTrialExpired") }}</span>
        </div>
      </div>
      <div class="trial-timer-window-navigation">
        <div
          class="button gray {{ getRemainingDays() == '0' ? 'disabled' : '' }}"
          (click)="model.showTrialTimerWindow = false"
        >
          <span>{{ "Continue" }}</span>
        </div>
        <div class="button navy" (click)="upgradeClick()">
          <span>{{ "Upgrade" }}</span>
        </div>
      </div>
    </div>
  </div>`, isInline: true, styles: [".disabled{opacity:.5;pointer-events:none}.gray{background:#ddd;border:1px solid #dddddd;color:#444}.gray:hover{background:#d5d5d5;border:1px solid #d5d5d5}.navy{background:#19478a;border:1px solid #19478a;color:#fff}.navy:hover{background:#3b629b;border:1px solid #3b629b}.trial-timer-window-navigation{display:flex;align-items:center;justify-content:center;margin-top:10px}.button{width:150px;height:32px;font-size:14px;font-family:Arial;display:flex;align-items:center;justify-content:center;margin:10px;border-radius:3px;-webkit-user-select:none}.blue{font-size:16px;color:#19478a}.lightgray{font-size:14px;color:#888}.trial-timer-warnings{display:flex;flex-direction:column;justify-content:center;align-items:center}.description{padding:10px 25px;font-family:Arial}.timer-remaining-days{position:absolute;display:inline-block;color:#76a797;font-family:Arial;font-size:30px;text-align:center;width:50px;top:calc(50% - 13px);left:calc(50% - 72px)}.trial-timer-window-interface{display:flex;flex-direction:column;justify-content:center;align-items:center}.trial-timer-image{position:relative;margin-top:20px}.trial-timer-image img{height:112px;width:197px}.trial-timer-window{background-color:var(--back-color);position:absolute;left:calc(50% - 275px);top:calc(50% - 176px);z-index:999;width:550px;height:352px;overflow:hidden;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;border:1px solid rgb(25,71,138);color:var(--text-color);font-size:13px;border-radius:5px;font-family:Arial;-webkit-user-select:none}.trial-timer-window-navbar{display:flex;height:30px;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a;-webkit-user-select:none;color:#fff;align-items:center}.trial-timer-window-navbar span{font-size:13px}.close-button{height:30px;width:30px;border-radius:3px;display:flex;align-items:center;justify-content:center}span{margin-left:5px;font-size:12px}.close-button:hover{background-color:#dadada}.close-button img{height:16px;width:16px;filter:brightness(0) invert(1)}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTrialTimerWindowComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-trial-timer-window", template: `<div class="trial-timer-window">
    <div class="trial-timer-window-navbar">
      <span [style.flex]="1">{{ loc.get2("Permissions", "ItemForms") }}</span>
      <div
        class="close-button {{ getRemainingDays() == '0' ? 'disabled' : '' }}"
        (click)="model.showTrialTimerWindow = false"
      >
        <img [src]="model.getImage('images.Other.CloseForm.png')" />
      </div>
    </div>
    <div class="trial-timer-window-content">
      <div class="trial-timer-window-interface">
        <div class="trial-timer-image">
          <img
            [style.width.px]="isRusLocalization() ? 239 : 197"
            [src]="
              isRusLocalization()
                ? model.getImage('images.Other.TrialDaysLeft_Ru.png')
                : model.getImage('images.Other.TrialDaysLeft_En.png')
            "
          />
          <div
            class="timer-remaining-days"
            [style.left]="isRusLocalization() ? 'calc(50% - 93px)' : 'calc(50% - 72px)'"
          >
            {{ getRemainingDays() }}
          </div>
        </div>
        <div class="trial-timer-warnings">
          <span class="blue description">{{
            loc.get2("Notices", "YourTrialWillExpire").replace("{0}", getRemainingDays())
          }}</span>
          <span class="lightgray description">{{ loc.get2("Notices", "ActivationTrialExpired") }}</span>
        </div>
      </div>
      <div class="trial-timer-window-navigation">
        <div
          class="button gray {{ getRemainingDays() == '0' ? 'disabled' : '' }}"
          (click)="model.showTrialTimerWindow = false"
        >
          <span>{{ "Continue" }}</span>
        </div>
        <div class="button navy" (click)="upgradeClick()">
          <span>{{ "Upgrade" }}</span>
        </div>
      </div>
    </div>
  </div>`, styles: [".disabled{opacity:.5;pointer-events:none}.gray{background:#ddd;border:1px solid #dddddd;color:#444}.gray:hover{background:#d5d5d5;border:1px solid #d5d5d5}.navy{background:#19478a;border:1px solid #19478a;color:#fff}.navy:hover{background:#3b629b;border:1px solid #3b629b}.trial-timer-window-navigation{display:flex;align-items:center;justify-content:center;margin-top:10px}.button{width:150px;height:32px;font-size:14px;font-family:Arial;display:flex;align-items:center;justify-content:center;margin:10px;border-radius:3px;-webkit-user-select:none}.blue{font-size:16px;color:#19478a}.lightgray{font-size:14px;color:#888}.trial-timer-warnings{display:flex;flex-direction:column;justify-content:center;align-items:center}.description{padding:10px 25px;font-family:Arial}.timer-remaining-days{position:absolute;display:inline-block;color:#76a797;font-family:Arial;font-size:30px;text-align:center;width:50px;top:calc(50% - 13px);left:calc(50% - 72px)}.trial-timer-window-interface{display:flex;flex-direction:column;justify-content:center;align-items:center}.trial-timer-image{position:relative;margin-top:20px}.trial-timer-image img{height:112px;width:197px}.trial-timer-window{background-color:var(--back-color);position:absolute;left:calc(50% - 275px);top:calc(50% - 176px);z-index:999;width:550px;height:352px;overflow:hidden;-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d;border:1px solid rgb(25,71,138);color:var(--text-color);font-size:13px;border-radius:5px;font-family:Arial;-webkit-user-select:none}.trial-timer-window-navbar{display:flex;height:30px;border-top-left-radius:3px;border-top-right-radius:3px;background-color:#515c6a;-webkit-user-select:none;color:#fff;align-items:center}.trial-timer-window-navbar span{font-size:13px}.close-button{height:30px;width:30px;border-radius:3px;display:flex;align-items:center;justify-content:center}span{margin-left:5px;font-size:12px}.close-button:hover{background-color:#dadada}.close-button img{height:16px;width:16px;filter:brightness(0) invert(1)}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }, { type: StiUserService }] });

class StiTieredMenuComponent {
    constructor(helper, model) {
        this.helper = helper;
        this.model = model;
        this.baseZIndex = 9999;
        this.isInitialized = false;
    }
    ngAfterViewInit() {
        setTimeout(() => {
            this.isInitialized = true;
        });
    }
    getMenuTop() {
        let rect = this.model.getPositionRelativeToForm(this.parentElement);
        return this.isInitialized
            ? window.innerHeight - rect.top >= (this.menuElementRef ? this.menuElementRef?.nativeElement?.offsetHeight : 165)
                ? 0
                : this.menuElementRef
                    ? -(this.menuElementRef?.nativeElement?.offsetHeight - rect.height)
                    : -165
            : 0;
    }
    getMunuLeft() {
        let rect = this.model.getPositionRelativeToForm(this.parentElement);
        return window.innerWidth - rect.right >= 107 ? 100 : -107;
    }
    onMouseEnter(index) {
        this.currentHoveredElementIndex = index;
    }
    onMouseClick(item) {
        item.command(item);
        this.model.showTieredMenu = false;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTieredMenuComponent, deps: [{ token: StiHelperService }, { token: StiModelService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiTieredMenuComponent, selector: "sti-tiered-menu", inputs: { menu: "menu", parentElement: "parentElement", baseZIndex: "baseZIndex" }, viewQueries: [{ propertyName: "menuElementRef", first: true, predicate: ["menuElement"], descendants: true }], ngImport: i0, template: `<div
    class="tiered-menu-container"
    [style.left.px]="parentElement ? getMunuLeft() : model.tieredMenuX"
    [style.top.px]="parentElement ? getMenuTop() : model.tieredMenuY"
    [style.zIndex]="baseZIndex"
    #menuElement
  >
    <div
      class="tiered-menu-item"
      *ngFor="let item of menu; index as i"
      (mouseenter)="onMouseEnter(i)"
      (click)="item.command ? onMouseClick(item) : onMouseEnter(i)"
      #parentElement
    >
      <span class="item-label">{{ item.label }}</span>
      <span *ngIf="item.items"><i class="pi pi-chevron-right"></i></span>
      <sti-tiered-menu
        *ngIf="currentHoveredElementIndex == i && item.items"
        [menu]="item.items"
        [baseZIndex]="baseZIndex + 1"
        [parentElement]="parentElement"
      ></sti-tiered-menu>
    </div>
  </div>`, isInline: true, styles: [".tiered-menu-container{position:absolute;left:500px;top:500px;width:6.5rem;background:#fff;user-select:none;-webkit-user-select:none;border:1px solid #c8c8c8;box-shadow:0 0 6px #00000029;border-radius:3px;font-family:Segoe UI}.tiered-menu-item{width:calc(100% - 6px);display:flex;align-items:center;justify-content:center;margin:3px;font-size:13px;font-weight:400;padding:.3rem;color:#333;border-radius:3px;position:relative}.tiered-menu-item span{display:flex;align-items:center;height:100%}.tiered-menu-item:hover{background-color:#eaeaea;cursor:pointer}.item-label{flex:1;line-height:1}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StiTieredMenuComponent, selector: "sti-tiered-menu", inputs: ["menu", "parentElement", "baseZIndex"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiTieredMenuComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-tiered-menu", template: `<div
    class="tiered-menu-container"
    [style.left.px]="parentElement ? getMunuLeft() : model.tieredMenuX"
    [style.top.px]="parentElement ? getMenuTop() : model.tieredMenuY"
    [style.zIndex]="baseZIndex"
    #menuElement
  >
    <div
      class="tiered-menu-item"
      *ngFor="let item of menu; index as i"
      (mouseenter)="onMouseEnter(i)"
      (click)="item.command ? onMouseClick(item) : onMouseEnter(i)"
      #parentElement
    >
      <span class="item-label">{{ item.label }}</span>
      <span *ngIf="item.items"><i class="pi pi-chevron-right"></i></span>
      <sti-tiered-menu
        *ngIf="currentHoveredElementIndex == i && item.items"
        [menu]="item.items"
        [baseZIndex]="baseZIndex + 1"
        [parentElement]="parentElement"
      ></sti-tiered-menu>
    </div>
  </div>`, styles: [".tiered-menu-container{position:absolute;left:500px;top:500px;width:6.5rem;background:#fff;user-select:none;-webkit-user-select:none;border:1px solid #c8c8c8;box-shadow:0 0 6px #00000029;border-radius:3px;font-family:Segoe UI}.tiered-menu-item{width:calc(100% - 6px);display:flex;align-items:center;justify-content:center;margin:3px;font-size:13px;font-weight:400;padding:.3rem;color:#333;border-radius:3px;position:relative}.tiered-menu-item span{display:flex;align-items:center;height:100%}.tiered-menu-item:hover{background-color:#eaeaea;cursor:pointer}.item-label{flex:1;line-height:1}\n"] }]
        }], ctorParameters: () => [{ type: StiHelperService }, { type: StiModelService }], propDecorators: { menu: [{
                type: Input
            }], parentElement: [{
                type: Input
            }], baseZIndex: [{
                type: Input
            }], menuElementRef: [{
                type: ViewChild,
                args: ["menuElement"]
            }] } });

class StiFormTreeWarningWindowComponent {
    constructor(model, loc) {
        this.model = model;
        this.loc = loc;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFormTreeWarningWindowComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiFormTreeWarningWindowComponent, selector: "form-tree-warning-window", ngImport: i0, template: ` <div class="warning-window-container">
    <div class="nav">
      <span>{{ loc.get2("Permissions", "ItemForms") }}</span>
    </div>
    <div class="content">
      <img [src]="model.getImage('images.Other.MsgFormInfo.png')" />
      <p>{{ loc.get2("DesignerFx", "TextNotFound").replace("{0}", model.formTreeWarningMessage) }}</p>
    </div>
    <div class="buttons" [style.padding-right.px]="3" [style.align-self]="'flex-end'">
      <div class="button accept" (click)="model.showFormTreeWarningWindow = false">
        <span>
          {{ loc.get2("Gui", "barname_ok") }}
        </span>
      </div>
    </div>
  </div>`, isInline: true, styles: [".warning-window-container{-webkit-touch-callout:none;-webkit-user-select:none;position:absolute;top:calc(50% - 75px);left:calc(50% - 225px);padding:0;font-family:Segoe UI;background-color:var(--back-color);width:450px;height:150px;z-index:9999999;border-radius:5px;display:flex;flex-direction:column;outline:1px solid rgb(81,92,106);-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d}.nav{width:100%;height:30px;background-color:#515c6a;border-top-left-radius:4px;border-top-right-radius:4px;display:flex;align-items:center}.nav span{width:100%;margin-left:10px;color:#fff;font-size:13px;font-family:Arial}.content{width:100%;display:flex;align-items:center;flex:1;padding:10px}.content img{margin-left:10px;margin-right:10px;width:32px;height:32px}p{font-size:12px;font-family:Arial;color:var(--text-color)}.buttons{align-self:flex-end;padding-bottom:5px;height:32px;display:flex;padding-right:3px}.button{width:80px;height:24px;border-radius:3px;display:flex;align-items:center;justify-content:center;margin:0 5px}.button span{font-size:12px;font-family:Arial;cursor:default;margin:0;padding:0}.accept{background-color:#19478a;color:#fff}.accept:hover{background-color:#3d6298}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiFormTreeWarningWindowComponent, decorators: [{
            type: Component,
            args: [{ selector: "form-tree-warning-window", template: ` <div class="warning-window-container">
    <div class="nav">
      <span>{{ loc.get2("Permissions", "ItemForms") }}</span>
    </div>
    <div class="content">
      <img [src]="model.getImage('images.Other.MsgFormInfo.png')" />
      <p>{{ loc.get2("DesignerFx", "TextNotFound").replace("{0}", model.formTreeWarningMessage) }}</p>
    </div>
    <div class="buttons" [style.padding-right.px]="3" [style.align-self]="'flex-end'">
      <div class="button accept" (click)="model.showFormTreeWarningWindow = false">
        <span>
          {{ loc.get2("Gui", "barname_ok") }}
        </span>
      </div>
    </div>
  </div>`, styles: [".warning-window-container{-webkit-touch-callout:none;-webkit-user-select:none;position:absolute;top:calc(50% - 75px);left:calc(50% - 225px);padding:0;font-family:Segoe UI;background-color:var(--back-color);width:450px;height:150px;z-index:9999999;border-radius:5px;display:flex;flex-direction:column;outline:1px solid rgb(81,92,106);-moz-box-shadow:0px 0px 7px rgba(0,0,0,.6);-webkit-box-shadow:0px 0px 7px rgb(0 0 0 / 60%);box-shadow:0 0 7px #0000004d}.nav{width:100%;height:30px;background-color:#515c6a;border-top-left-radius:4px;border-top-right-radius:4px;display:flex;align-items:center}.nav span{width:100%;margin-left:10px;color:#fff;font-size:13px;font-family:Arial}.content{width:100%;display:flex;align-items:center;flex:1;padding:10px}.content img{margin-left:10px;margin-right:10px;width:32px;height:32px}p{font-size:12px;font-family:Arial;color:var(--text-color)}.buttons{align-self:flex-end;padding-bottom:5px;height:32px;display:flex;padding-right:3px}.button{width:80px;height:24px;border-radius:3px;display:flex;align-items:center;justify-content:center;margin:0 5px}.button span{font-size:12px;font-family:Arial;cursor:default;margin:0;padding:0}.accept{background-color:#19478a;color:#fff}.accept:hover{background-color:#3d6298}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }] });

class StimulsoftFormsComponent {
    constructor(toolbarResizerService, model, theme, controller, barcodeService, render, editableContentService, changesService, exportService, font, toolboxService, undoService, userService, expressionService, helper, localizationService, httpService, signatureService, tabIndexService, mouseService, formEvents, dropdownService, formCheckerService, stiLocalStorage, tooltipService, clipboardService) {
        this.toolbarResizerService = toolbarResizerService;
        this.model = model;
        this.theme = theme;
        this.controller = controller;
        this.barcodeService = barcodeService;
        this.render = render;
        this.editableContentService = editableContentService;
        this.changesService = changesService;
        this.exportService = exportService;
        this.font = font;
        this.toolboxService = toolboxService;
        this.undoService = undoService;
        this.userService = userService;
        this.expressionService = expressionService;
        this.helper = helper;
        this.localizationService = localizationService;
        this.httpService = httpService;
        this.signatureService = signatureService;
        this.tabIndexService = tabIndexService;
        this.mouseService = mouseService;
        this.formEvents = formEvents;
        this.dropdownService = dropdownService;
        this.formCheckerService = formCheckerService;
        this.stiLocalStorage = stiLocalStorage;
        this.tooltipService = tooltipService;
        this.clipboardService = clipboardService;
        this.viewerMode = false;
        this.readonlyMode = false;
        this.form = new StiForm();
        this.interfaceEvent = new EventEmitter();
        this.init = false;
        this.distance = 0;
        this.isDoubleTouch = false;
        this.model.interfaceEvent.subscribe((e) => this.interfaceEvent.emit(e));
        this.model.component = this;
        barcodeService.init();
        changesService.start();
        expressionService.start();
    }
    get pointerEvents() {
        return this.model.showModalWindow ||
            this.model.showAboutWindow ||
            this.exportService.showModalWindow ||
            this.model.showTrialModalWindow ||
            this.model.showButtonMessageWindow ||
            this.model.showErrorWindow ||
            this.model.showHelpWindow ||
            this.model.showMoreColorDialog ||
            this.model.showProgress ||
            this.model.showExpressionEditor ||
            this.formCheckerService.showFormCheckerWindow ||
            this.model.showSignatureEditor ||
            this.model.showDraggableModalWindow ||
            this.model.showTrialTimerWindow ||
            this.model.showFormTreeWarningWindow
            ? "none"
            : "";
    }
    get cursor() {
        return this.model.cursor;
    }
    get toolbarWidth() {
        return this.toolbarResizerService.isMaximizeMode ? 200 : 45;
    }
    hasParentHeight() {
        let root = document.getElementsByClassName("sti-root-form");
        return root[0].parentElement.style.height ? true : false;
    }
    hasParentWidth() {
        let root = document.getElementsByClassName("sti-root-form");
        return root[0].parentElement.style.width ? true : false;
    }
    ngOnInit() {
        this.model.settings = this.settings;
        this.mouseService.getDocumentTouchStart().subscribe((event) => {
            this.startTouch(event);
        });
        this.mouseService.getDocumentTouchMove().subscribe((event) => {
            this.touchMove(event);
        });
        this.mouseService.getDocumentTouchEnd().subscribe((event) => {
            this.touchEnd(event);
        });
        this.toolboxService.unusedElements = JSON.parse(this.stiLocalStorage.getItem("StiToolboxSetup"));
        let showInsertTab = JSON.parse(this.stiLocalStorage.getItem("StiShowInsertTab"));
        let showToolbox = JSON.parse(this.stiLocalStorage.getItem("StiShowToolbox"));
        let buttonLinks = this.stiLocalStorage.getItem("StiButtonLinks");
        if (buttonLinks) {
            this.model.enteredUrls = buttonLinks.split(",");
        }
        this.model.showInsertTab = showInsertTab != null ? showInsertTab : true;
        this.toolboxService.showToolbox = showToolbox != null ? showToolbox : true;
        this.model.viewerMode = this.viewerMode;
        if (this.viewerMode) {
            this.model.ribbon = "Preview";
        }
        if (this.properties?.cloudPlanIdent?.length > 0 &&
            (this.properties.cloudPlanIdent == "Trial" ||
                this.properties.cloudPlanIdent == "Expiried" ||
                this.properties.cloudPlanIdent == "Developer" ||
                this.properties.cloudPlanIdent.indexOf("Base") > 0 ||
                this.properties.cloudPlanIdent.indexOf("Single") > 0 ||
                this.properties.cloudPlanIdent.indexOf("Team") > 0 ||
                this.properties.cloudPlanIdent.indexOf("Enterprise") > 0)) {
            if (this.properties?.cloudPlanIdent == "Trial" || this.properties?.cloudPlanIdent == "Expiried") {
                this.model.basePlanIsTrial = true;
                if (!this.viewerMode) {
                    this.model.showTrialBar = true;
                }
                else {
                    this.model.showTrialTitle = true;
                }
            }
            this.model.form.additionalFormFields;
            this.model.isCloudMode = true;
            if (this.model.enteredUrls.indexOf("cloud.stimulsoft.com") == -1) {
                this.model.enteredUrls.push("cloud.stimulsoft.com");
            }
        }
        if (this.viewerMode && this.readonlyMode) {
            this.setReadOnlyMode();
        }
        this.toolboxService.elements.forEach((element) => {
            if (this.toolboxService.unusedElements?.find((item) => item == element.id)) {
                element.enabled = false;
            }
        });
        this.theme.currentTheme = "Light";
        const zoomByWheel = (event) => {
            if (event.ctrlKey) {
                event.stopPropagation();
                event.preventDefault();
                if (event.deltaY < 0) {
                    if (this.model.zoom > 0.1 && this.model.zoom < 4.9) {
                        this.model.zoom += 0.1;
                    }
                }
                else {
                    if (this.model.zoom > 0.2 && this.model.zoom < 5) {
                        this.model.zoom -= 0.1;
                    }
                }
            }
            else {
                let workspace = document.getElementsByTagName("sti-workspace")[0];
                // workspace.scrollTop = 10;
                if (this.model.draggingElement) {
                    if (event.deltaY < 0) {
                        workspace.scrollTop -= 300;
                    }
                    else {
                        workspace.scrollTop += 300;
                    }
                }
            }
        };
        let this_ = this;
        window.oncontextmenu = function ($event) {
            if (this_.model.getPageFromPoint(event["clientX"], event["clientY"]) &&
                document.activeElement.tagName.toLocaleLowerCase() == "body") {
                event.preventDefault();
                this_.model.contextMenuX = event["clientX"];
                if (window.outerHeight - event["clientY"] <= 255) {
                    this_.model.contextMenuY = event["clientY"] - 150;
                }
                else {
                    this_.model.contextMenuY = event["clientY"];
                }
                this_.model.showContextMenu = true;
            }
        };
        window.onbeforeunload = function (event) {
            this_.model.currentFormState = this_.model.form.saveToReportJsonObject().serialize();
            if (this_.model?.currentFormState !== this_.model?.lastSavedFormState &&
                this_.undoService?.undos?.length > 1 &&
                !this_.model.viewerMode) {
                setTimeout(() => {
                    this_.model.showProgress = false;
                }, 3000);
                event.returnValue = "";
                return event.returnValue;
            }
        };
        const deletingComponents = (event) => {
            let selection = window.getSelection().toString();
            if (event.key === "Escape" && this.model.lastFormState != null) {
                let form = new StiForm();
                form.loadFormJsonString(this.model.lastFormState);
                this.model.form = form;
                this.model.draggingElement = null;
                this.model.lastFormState = null;
            }
            else if (event.key === "Delete" && this.model.canDelete()) {
                if (this.model.selectedComponent) {
                    this.helper.deleteSelectedComponent();
                }
                else if (this.model.selectedPage && this.model?.form?.pages?.length > 1) {
                    this.model.showModalWindow = true;
                }
            }
            else if (event.key === "PageDown" || event.key === "PageUp") {
                event.preventDefault();
            }
            else if (event.ctrlKey && event.code === "KeyC") {
                if (this.model.showExpressionEditor) {
                    return;
                }
                if (this.model.selectedComponent && document.activeElement.tagName.toLocaleLowerCase() == "body") {
                    this.clipboardService.copyElement();
                }
            }
            else if (event.ctrlKey && event.code === "KeyV") {
                if (this.model.showExpressionEditor) {
                    return;
                }
                if (this.clipboardService.hasCopy && document.activeElement.tagName.toLocaleLowerCase() == "body") {
                    let mouseEvent = new MouseEvent("mousemove");
                    this.clipboardService.pasteElement(mouseEvent);
                }
            }
            else if (event.ctrlKey && event.code === "KeyZ") {
                if (this.model.showExpressionEditor) {
                    return;
                }
                event.preventDefault();
                if (this.undoService.undos.length >= 2) {
                    this.undoService.undo();
                }
            }
            else if (event.ctrlKey && event.code === "KeyX") {
                if (this.model.showExpressionEditor) {
                    return;
                }
                if (this.model.selectedComponent && document.activeElement.tagName.toLocaleLowerCase() == "body") {
                    this.clipboardService.cutElement();
                }
            }
        };
        const disableDeleting = (event) => {
            let isWorkspace = false;
            let isBarcodePreview = false;
            let elements = document.elementsFromPoint(event.clientX, event.clientY);
            elements.forEach((element) => {
                if (element?.classList.contains("sti-page") || element?.classList.contains("sti-component")) {
                    isWorkspace = true;
                }
                if (element?.classList.contains("container")) {
                    isBarcodePreview = true;
                }
            });
            if (!isBarcodePreview) {
                this.barcodeService.showBarcodePreview = false;
            }
        };
        document.querySelector(".sti-root-form")?.addEventListener("wheel", zoomByWheel);
        document.addEventListener("keydown", deletingComponents);
        document.addEventListener("mousedown", disableDeleting);
    }
    needToScroll() {
        let workspace = document.getElementsByTagName("sti-workspace")[0];
        let pageElem = document.querySelectorAll(".sti-page")[0];
        let rect = this.model.getPositionRelativeToForm(pageElem);
        return workspace?.clientWidth < rect?.width;
    }
    ngOnChanges(changes) {
        if (Object.keys(changes).length == 1) {
            if (changes["form"]) {
                this.model.form = changes["form"].currentValue;
                this.model.fileName = this.formName;
                if (this.viewerMode) {
                    this.model.form.updateToViewerMode();
                }
            }
            else if (changes["localization"]) {
                this.localizationService.loadLocalization(this.localization);
            }
        }
        else {
            this.initialize();
        }
    }
    startTouch(event) {
        if (this.isMobileViewer) {
            if (event.touches.length === 2) {
                this.startZoomValue = this.model.zoom;
                this.distance = Math.hypot(event.touches[0].pageX - event.touches[1].pageX, event.touches[0].pageY - event.touches[1].pageY);
                this.isDoubleTouch = true;
            }
        }
    }
    get isMobileViewer() {
        return this.model.viewerMode && this.model.isMobile();
    }
    touchMove(event) {
        if (this.isMobileViewer && this.isDoubleTouch) {
            event.preventDefault();
            let dist2 = Math.hypot(event.touches[0].pageX - event.touches[1].pageX, event.touches[0].pageY - event.touches[1].pageY);
            let delta = Math.abs(dist2 - this.distance);
            if (this.distance < dist2) {
                this.model.zoom = this.startZoomValue + Number((delta / 200).toFixed(2));
            }
            else if (this.distance > dist2) {
                this.model.zoom = this.startZoomValue - Number((delta / 200).toFixed(2));
            }
            if (this.model.zoom < this.minimalZoomValue()) {
                this.model.zoom = this.minimalZoomValue();
                let workspace = document.getElementsByTagName("sti-workspace")[0];
                let pageElem = document.querySelectorAll(".page-container")[0];
                setTimeout(() => {
                    let rect = this.model.getPositionRelativeToForm(pageElem);
                    if (workspace.scrollLeft != workspace.scrollWidth - rect.width - 6) {
                        workspace.scrollLeft = workspace.scrollWidth - rect.width - 6;
                    }
                });
            }
        }
    }
    touchEnd(event) {
        if (this.isMobileViewer && this.isDoubleTouch) {
            if (event.targetTouches.length < 2) {
                this.isDoubleTouch = false;
            }
        }
    }
    minimalZoomValue() {
        let workspace = document.getElementsByTagName("sti-workspace")[0];
        let width = workspace["offsetWidth"];
        let pagetWithMaxWidth = this.model.form.pages.reduce((acc, curr) => (acc.width > curr.width ? acc : curr));
        return width / (pagetWithMaxWidth.width + 30);
    }
    setReadOnlyMode() {
        this.model?.form?.pages.forEach((page) => {
            page.allElements.forEach((element) => {
                if (element["readOnly"]) {
                    element["readOnly"] = true;
                }
                else {
                    if (!(element instanceof StiButtonElement)) {
                        element.readOnly = false;
                    }
                }
            });
        });
    }
    ngAfterViewInit() {
        this.init = true;
        setTimeout(() => {
            this.initialize();
            this.rootFormElementRef.nativeElement.component = this;
            this.model.rootFormElement = this.rootFormElementRef.nativeElement;
            this.model.addTotalMenu = this.addTotalMenu;
        }, 0);
    }
    containerHeight() {
        let showfooter = this.model.getBooleanSetting("showFooter");
        let isModeWithPreview = this.model.previewMode || this.model.pdfPreviewMode || this.viewerMode;
        if (isModeWithPreview) {
            if (this.viewerMode) {
                return "calc(100% - 32px)";
            }
            else {
                return this.model.pdfPreviewMode || !showfooter ? "calc(100% - 38px)" : "calc(100% - 70px)";
            }
        }
        else {
            if (showfooter) {
                return this.model.showTrialBar ? "calc(100% - 155px)" : "calc(100% - 125px)";
            }
            else {
                return this.model.showTrialBar ? "calc(100% - 123px)" : "calc(100% - 93px)";
            }
        }
    }
    initialize() {
        if (this.init) {
            this.model.requestUrl = this.requestUrl;
            this.model.properties = this.properties;
            this.model.fileName = this.formName;
            if (this.form) {
                this.model.form = this.form;
            }
            if (this.localization) {
                this.localizationService.loadLocalization(this.localization);
            }
            this.controller.initialize();
        }
    }
    cloudLogin(event) {
        delete this.model.properties.cloudLoginInfo;
        delete this.model.login;
        this.model.properties["cloudLogin"] = event.login;
        this.model.properties["cloudPassword"] = event.password;
        this.controller.initialize();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StimulsoftFormsComponent, deps: [{ token: StiToolbarResizerService }, { token: StiModelService }, { token: StiThemeService }, { token: StiControllerService }, { token: StiBarcodeService }, { token: StiRectangleGeometryLayout }, { token: StiEditableContentService }, { token: StiChangesService }, { token: StiExportService }, { token: StiFontService }, { token: StiToolboxService }, { token: StiUndoService }, { token: StiUserService }, { token: StiExpressionService }, { token: StiHelperService }, { token: StiLocalizationService }, { token: StiHttpClientService }, { token: SignatureService }, { token: StiTabIndexService }, { token: StiMouseService }, { token: FormEventsService }, { token: StiDropdownService }, { token: StiFormCheckerService }, { token: StiLocalStorageService }, { token: StiTooltipService }, { token: StiClipboardService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StimulsoftFormsComponent, selector: "stimulsoft-forms", inputs: { requestUrl: "requestUrl", style: "style", viewerMode: "viewerMode", readonlyMode: "readonlyMode", form: "form", localization: "localization", formName: "formName", settings: "settings", properties: "properties" }, outputs: { interfaceEvent: "interfaceEvent" }, providers: [
            StiModelService,
            StiToolboxService,
            StiMouseService,
            StiComponentResizerService,
            StiDraggableService,
            StiHelperService,
            StiLocalizationService,
            StiToolbarResizerService,
            StiNameService,
            StiRectangleGeometryLayout,
            StiThemeService,
            StiEditableContentService,
            StiControllerService,
            StiHttpClientService,
            StiBarcodeService,
            StiColumnDraggableService,
            StiRichTextService,
            StiChangesService,
            StiUndoService,
            StiExportService,
            StiFontService,
            StiUserService,
            StiExpressionService,
            FormEventsService,
            SignatureService,
            StiColorDialogService,
            StiStaticHelperService,
            StiTabIndexService,
            StiDropdownService,
            StiFormCheckerService,
            StiLocalStorageService,
            StiDraggableModalWindowService,
            StiTooltipService,
            StiClipboardService
        ], viewQueries: [{ propertyName: "addTotalMenu", first: true, predicate: ["addTotalMenu"], descendants: true }, { propertyName: "rootFormElementRef", first: true, predicate: ["rootForm"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
    <div
      class="sti-root-form"
      [style.position]="'relative'"
      [style]="style"
      [style.cursor]="cursor"
      [style.width]="hasParentWidth() ? 'inherit' : '100%'"
      [style.height]="hasParentHeight() ? 'inherit' : '100%'"
      #rootForm
    >
      <sti-navbar [style.pointer-events]="pointerEvents" [style.opacity]="model.isInitialized ? 1 : 0"></sti-navbar>
      <sti-cloud-navbar
        [style.opacity]="model.isInitialized ? 1 : 0"
        *ngIf="model.isCloudMode && model.viewerMode && model.basePlanIsTrial"
      ></sti-cloud-navbar>
      <sti-trial-bar
        [style.opacity]="model.isInitialized ? 1 : 0"
        *ngIf="!viewerMode && !model.previewMode && !model.pdfPreviewMode && model.showTrialBar"
      ></sti-trial-bar>
      <div
        class="flex-container"
        [style.opacity]="model.isInitialized ? 1 : 0"
        [style.height]="containerHeight()"
        [style.pointer-events]="pointerEvents"
      >
        <!-- elements -->

        <sti-toolbox
          *ngIf="
            !viewerMode &&
            !model.previewMode &&
            !model.pdfPreviewMode &&
            toolboxService.showToolbox &&
            model.getBooleanSetting('showToolbox')
          "
          class="elements"
          [style.min-width.px]="toolbarWidth"
        ></sti-toolbox>

        <!-- workspace -->
        <sti-pdf-preview *ngIf="model.pdfPreviewMode" style="width:100%;height:100%"></sti-pdf-preview>
        <sti-workspace
          *ngIf="!model.pdfPreviewMode"
          class="workspace"
          [style.overflow-x]="model.viewerMode && model.isMobile() && !needToScroll() ? 'hidden' : 'auto'"
        ></sti-workspace>
        <!-- properties -->
        <app-properties
          class="properties"
          [style.min-width.px]="
            viewerMode || model.previewMode || model.pdfPreviewMode || !model.getBooleanSetting('showProperties')
              ? '0'
              : model.propertyGridWidth
          "
          [style.max-width.px]="
            viewerMode || model.previewMode || model.pdfPreviewMode || !model.getBooleanSetting('showProperties')
              ? '0'
              : model.propertyGridWidth
          "
          [style.visibility]="
            viewerMode || model.previewMode || model.pdfPreviewMode || !model.getBooleanSetting('showProperties')
              ? 'hidden'
              : ''
          "
        ></app-properties>
        <sti-draggable-element-container></sti-draggable-element-container>
        <sti-clone-element-container></sti-clone-element-container>
        <sti-draggable-column-container></sti-draggable-column-container>
        <sti-barcode-styles-preview></sti-barcode-styles-preview>
        <sti-navbar-group-preview-component></sti-navbar-group-preview-component>
        <sti-user-info></sti-user-info>
        <sti-localization-preview></sti-localization-preview>
      </div>
      <sti-electronic-signature-editor *ngIf="model.showSignatureEditor"></sti-electronic-signature-editor>
      <sti-footer
        [style.opacity]="model.isInitialized ? 1 : 0"
        *ngIf="!model.pdfPreviewMode && model.getBooleanSetting('showFooter')"
        [style.pointer-events]="pointerEvents"
      ></sti-footer>
      <sti-file-menu *ngIf="model.fileMenuMode && model.isInitialized"></sti-file-menu>
      <sti-file-menu-navigation [style.visibility]="model.isInitialized ? '' : 'hidden'"></sti-file-menu-navigation>
      <sti-about-window-component *ngIf="model.showAboutWindow"></sti-about-window-component>
      <sti-progress [display]="model.showProgress"></sti-progress>
      <expression-draggable-container></expression-draggable-container>
      <sti-color-options-dialog *ngIf="model.showMoreColorDialog"></sti-color-options-dialog>
      <sti-color-dialog *ngIf="model.showColorDialog"></sti-color-dialog>
      <sti-expression-editor *ngIf="model.showExpressionEditor"></sti-expression-editor>
      <sti-trial-modal-window *ngIf="model.showTrialModalWindow"></sti-trial-modal-window>
      <sti-file-save-dialog *ngIf="model.showSaveDialog || model.showSaveDialogFromCloud"></sti-file-save-dialog>
      <sti-setup-toolbox-component *ngIf="model.showToolboxSetup"></sti-setup-toolbox-component>
      <button-message-window *ngIf="model.showButtonMessageWindow || model.showErrorWindow"></button-message-window>
      <sti-modal-agree-window *ngIf="model.showModalWindow || exportService.showModalWindow"></sti-modal-agree-window>
      <expression-help-window *ngIf="model.showHelpWindow"></expression-help-window>
      <sti-context-menu-window
        *ngIf="model.showContextMenu && !viewerMode && !model.previewMode"
      ></sti-context-menu-window>
      <sti-login *ngIf="model.login != null" [loginInfo]="model.login" (onLogin)="cloudLogin($event)"></sti-login>
      <sti-dropdown-list-component *ngIf="dropdownService.showDropdownList"></sti-dropdown-list-component>
      <sti-form-checker *ngIf="formCheckerService.showFormCheckerWindow"></sti-form-checker>
      <sti-draggable-modal-window *ngIf="model.showDraggableModalWindow"></sti-draggable-modal-window>
      <sti-tooltip *ngIf="tooltipService.showTooltip"></sti-tooltip>
      <sti-trial-timer-window *ngIf="model.showTrialTimerWindow"></sti-trial-timer-window>
      <sti-tiered-menu *ngIf="model.showTieredMenu" [menu]="helper.getAddTotalMenuItems()"></sti-tiered-menu>
      <form-tree-warning-window *ngIf="model.showFormTreeWarningWindow"></form-tree-warning-window>
    </div>
  `, isInline: true, styles: ["sti-file-menu{height:inherit;width:inherit}sti-file-menu-navigation{height:inherit}.flex-container{display:flex;justify-content:center;background:var(--back-color);height:calc(100% - 117px);width:100%;font-family:Segoe UI}.workspace{background-color:var(--workspace-color);display:block;justify-content:center;font-size:2.5rem;color:#000;overflow-y:auto;scroll-behavior:smooth;height:100%;flex-grow:1}*{scrollbar-width:thin;scrollbar-color:var(--thumb-color),var(--back-color)}*::-webkit-scrollbar{-webkit-appearance:none;background-color:var(--back-color);height:10px;width:10px;outline:none}*::-webkit-scrollbar-button{-webkit-appearance:none;height:3px;width:3px}*::-webkit-scrollbar-thumb{-webkit-appearance:none;background-color:var(--thumb-color);height:10px;min-width:25px;max-width:80%;border-radius:4px;border:2px solid var(--back-color)}*::-webkit-scrollbar-thumb:hover{background-color:var(--trackHover-color);height:10px}*::-webkit-scrollbar-track{-webkit-appearance:none;background-color:var(--back-color);border:1px solid var(--back-color)}*::-webkit-scrollbar-corner{background-color:var(--back-color)}.elements{background-color:var(--back-color);font-size:2.5rem;color:#000;visibility:visible;overflow-y:auto;scroll-behavior:smooth;border-right:1px solid var(--formBorder-color);padding:7px;transition:min-width .2s}.properties{background-color:var(--back-color);font-size:2.5rem;color:#000;scroll-behavior:smooth;display:flex;min-width:360px;max-width:360px;border-left:1px solid var(--formBorder-color);font-size:18px}.hovered{background-color:#d1d8e2}.sti-root-form{height:inherit;width:inherit}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: NavbarComponent, selector: "sti-navbar" }, { kind: "component", type: WorkspaceComponent, selector: "sti-workspace" }, { kind: "component", type: PropertiesComponent, selector: "app-properties" }, { kind: "component", type: StiDraggableElementContainerComponent, selector: "sti-draggable-element-container" }, { kind: "component", type: StiToolboxComponent, selector: "sti-toolbox" }, { kind: "component", type: StiFooterComponent, selector: "sti-footer" }, { kind: "component", type: StiCloneElementContainerComponent, selector: "sti-clone-element-container" }, { kind: "component", type: StiModalAgreeWindowComponent, selector: "sti-modal-agree-window" }, { kind: "component", type: StiProgressComponent, selector: "sti-progress", inputs: ["display"] }, { kind: "component", type: StiDraggableColumnContainerComponent, selector: "sti-draggable-column-container" }, { kind: "component", type: StiAboutWindowComponent, selector: "sti-about-window-component" }, { kind: "component", type: StiBarcodeStylesPreviewComponent, selector: "sti-barcode-styles-preview" }, { kind: "component", type: StiPdfPreviewComponent, selector: "sti-pdf-preview" }, { kind: "component", type: NavbarGroupPreviewComponent, selector: "sti-navbar-group-preview-component" }, { kind: "component", type: StiSetupToolboxComponent, selector: "sti-setup-toolbox-component" }, { kind: "component", type: StiLocalizationPreviewComponent, selector: "sti-localization-preview" }, { kind: "component", type: StiUserInfoComponent, selector: "sti-user-info" }, { kind: "component", type: StiTrialBarComponent, selector: "sti-trial-bar" }, { kind: "component", type: StiTrialModalWindowComponent, selector: "sti-trial-modal-window" }, { kind: "component", type: StiFileMenuComponent, selector: "sti-file-menu" }, { kind: "component", type: StiFileMenuNavigationComponent, selector: "sti-file-menu-navigation" }, { kind: "component", type: StiFileSaveDialogComponent, selector: "sti-file-save-dialog" }, { kind: "component", type: StiButtonMessageWindowComponent, selector: "button-message-window" }, { kind: "component", type: StiCloudNavbarComponent, selector: "sti-cloud-navbar" }, { kind: "component", type: ContextMenuWindowComponent, selector: "sti-context-menu-window" }, { kind: "component", type: StiExpressionHelpWindowComponent, selector: "expression-help-window" }, { kind: "component", type: StiLoginComponent, selector: "sti-login", inputs: ["loginInfo"], outputs: ["onLogin"] }, { kind: "component", type: StiExpressionEditorComponent, selector: "sti-expression-editor" }, { kind: "component", type: StiColorDialogComponent, selector: "sti-color-dialog" }, { kind: "component", type: StiColorOptionsDialogComponent, selector: "sti-color-options-dialog" }, { kind: "component", type: StiExpressionDraggableContainerComponent, selector: "expression-draggable-container" }, { kind: "component", type: StiDropdownListComponent, selector: "sti-dropdown-list-component" }, { kind: "component", type: StiFormCheckerComponent, selector: "sti-form-checker" }, { kind: "component", type: StiElectronicSignatureEditorComponent, selector: "sti-electronic-signature-editor" }, { kind: "component", type: StiDraggableModalWindowComponent, selector: "sti-draggable-modal-window" }, { kind: "component", type: StiTooltipComponent, selector: "sti-tooltip" }, { kind: "component", type: StiTrialTimerWindowComponent, selector: "sti-trial-timer-window" }, { kind: "component", type: StiTieredMenuComponent, selector: "sti-tiered-menu", inputs: ["menu", "parentElement", "baseZIndex"] }, { kind: "component", type: StiFormTreeWarningWindowComponent, selector: "form-tree-warning-window" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StimulsoftFormsComponent, decorators: [{
            type: Component,
            args: [{ selector: "stimulsoft-forms", template: `
    <div
      class="sti-root-form"
      [style.position]="'relative'"
      [style]="style"
      [style.cursor]="cursor"
      [style.width]="hasParentWidth() ? 'inherit' : '100%'"
      [style.height]="hasParentHeight() ? 'inherit' : '100%'"
      #rootForm
    >
      <sti-navbar [style.pointer-events]="pointerEvents" [style.opacity]="model.isInitialized ? 1 : 0"></sti-navbar>
      <sti-cloud-navbar
        [style.opacity]="model.isInitialized ? 1 : 0"
        *ngIf="model.isCloudMode && model.viewerMode && model.basePlanIsTrial"
      ></sti-cloud-navbar>
      <sti-trial-bar
        [style.opacity]="model.isInitialized ? 1 : 0"
        *ngIf="!viewerMode && !model.previewMode && !model.pdfPreviewMode && model.showTrialBar"
      ></sti-trial-bar>
      <div
        class="flex-container"
        [style.opacity]="model.isInitialized ? 1 : 0"
        [style.height]="containerHeight()"
        [style.pointer-events]="pointerEvents"
      >
        <!-- elements -->

        <sti-toolbox
          *ngIf="
            !viewerMode &&
            !model.previewMode &&
            !model.pdfPreviewMode &&
            toolboxService.showToolbox &&
            model.getBooleanSetting('showToolbox')
          "
          class="elements"
          [style.min-width.px]="toolbarWidth"
        ></sti-toolbox>

        <!-- workspace -->
        <sti-pdf-preview *ngIf="model.pdfPreviewMode" style="width:100%;height:100%"></sti-pdf-preview>
        <sti-workspace
          *ngIf="!model.pdfPreviewMode"
          class="workspace"
          [style.overflow-x]="model.viewerMode && model.isMobile() && !needToScroll() ? 'hidden' : 'auto'"
        ></sti-workspace>
        <!-- properties -->
        <app-properties
          class="properties"
          [style.min-width.px]="
            viewerMode || model.previewMode || model.pdfPreviewMode || !model.getBooleanSetting('showProperties')
              ? '0'
              : model.propertyGridWidth
          "
          [style.max-width.px]="
            viewerMode || model.previewMode || model.pdfPreviewMode || !model.getBooleanSetting('showProperties')
              ? '0'
              : model.propertyGridWidth
          "
          [style.visibility]="
            viewerMode || model.previewMode || model.pdfPreviewMode || !model.getBooleanSetting('showProperties')
              ? 'hidden'
              : ''
          "
        ></app-properties>
        <sti-draggable-element-container></sti-draggable-element-container>
        <sti-clone-element-container></sti-clone-element-container>
        <sti-draggable-column-container></sti-draggable-column-container>
        <sti-barcode-styles-preview></sti-barcode-styles-preview>
        <sti-navbar-group-preview-component></sti-navbar-group-preview-component>
        <sti-user-info></sti-user-info>
        <sti-localization-preview></sti-localization-preview>
      </div>
      <sti-electronic-signature-editor *ngIf="model.showSignatureEditor"></sti-electronic-signature-editor>
      <sti-footer
        [style.opacity]="model.isInitialized ? 1 : 0"
        *ngIf="!model.pdfPreviewMode && model.getBooleanSetting('showFooter')"
        [style.pointer-events]="pointerEvents"
      ></sti-footer>
      <sti-file-menu *ngIf="model.fileMenuMode && model.isInitialized"></sti-file-menu>
      <sti-file-menu-navigation [style.visibility]="model.isInitialized ? '' : 'hidden'"></sti-file-menu-navigation>
      <sti-about-window-component *ngIf="model.showAboutWindow"></sti-about-window-component>
      <sti-progress [display]="model.showProgress"></sti-progress>
      <expression-draggable-container></expression-draggable-container>
      <sti-color-options-dialog *ngIf="model.showMoreColorDialog"></sti-color-options-dialog>
      <sti-color-dialog *ngIf="model.showColorDialog"></sti-color-dialog>
      <sti-expression-editor *ngIf="model.showExpressionEditor"></sti-expression-editor>
      <sti-trial-modal-window *ngIf="model.showTrialModalWindow"></sti-trial-modal-window>
      <sti-file-save-dialog *ngIf="model.showSaveDialog || model.showSaveDialogFromCloud"></sti-file-save-dialog>
      <sti-setup-toolbox-component *ngIf="model.showToolboxSetup"></sti-setup-toolbox-component>
      <button-message-window *ngIf="model.showButtonMessageWindow || model.showErrorWindow"></button-message-window>
      <sti-modal-agree-window *ngIf="model.showModalWindow || exportService.showModalWindow"></sti-modal-agree-window>
      <expression-help-window *ngIf="model.showHelpWindow"></expression-help-window>
      <sti-context-menu-window
        *ngIf="model.showContextMenu && !viewerMode && !model.previewMode"
      ></sti-context-menu-window>
      <sti-login *ngIf="model.login != null" [loginInfo]="model.login" (onLogin)="cloudLogin($event)"></sti-login>
      <sti-dropdown-list-component *ngIf="dropdownService.showDropdownList"></sti-dropdown-list-component>
      <sti-form-checker *ngIf="formCheckerService.showFormCheckerWindow"></sti-form-checker>
      <sti-draggable-modal-window *ngIf="model.showDraggableModalWindow"></sti-draggable-modal-window>
      <sti-tooltip *ngIf="tooltipService.showTooltip"></sti-tooltip>
      <sti-trial-timer-window *ngIf="model.showTrialTimerWindow"></sti-trial-timer-window>
      <sti-tiered-menu *ngIf="model.showTieredMenu" [menu]="helper.getAddTotalMenuItems()"></sti-tiered-menu>
      <form-tree-warning-window *ngIf="model.showFormTreeWarningWindow"></form-tree-warning-window>
    </div>
  `, providers: [
                        StiModelService,
                        StiToolboxService,
                        StiMouseService,
                        StiComponentResizerService,
                        StiDraggableService,
                        StiHelperService,
                        StiLocalizationService,
                        StiToolbarResizerService,
                        StiNameService,
                        StiRectangleGeometryLayout,
                        StiThemeService,
                        StiEditableContentService,
                        StiControllerService,
                        StiHttpClientService,
                        StiBarcodeService,
                        StiColumnDraggableService,
                        StiRichTextService,
                        StiChangesService,
                        StiUndoService,
                        StiExportService,
                        StiFontService,
                        StiUserService,
                        StiExpressionService,
                        FormEventsService,
                        SignatureService,
                        StiColorDialogService,
                        StiStaticHelperService,
                        StiTabIndexService,
                        StiDropdownService,
                        StiFormCheckerService,
                        StiLocalStorageService,
                        StiDraggableModalWindowService,
                        StiTooltipService,
                        StiClipboardService
                    ], styles: ["sti-file-menu{height:inherit;width:inherit}sti-file-menu-navigation{height:inherit}.flex-container{display:flex;justify-content:center;background:var(--back-color);height:calc(100% - 117px);width:100%;font-family:Segoe UI}.workspace{background-color:var(--workspace-color);display:block;justify-content:center;font-size:2.5rem;color:#000;overflow-y:auto;scroll-behavior:smooth;height:100%;flex-grow:1}*{scrollbar-width:thin;scrollbar-color:var(--thumb-color),var(--back-color)}*::-webkit-scrollbar{-webkit-appearance:none;background-color:var(--back-color);height:10px;width:10px;outline:none}*::-webkit-scrollbar-button{-webkit-appearance:none;height:3px;width:3px}*::-webkit-scrollbar-thumb{-webkit-appearance:none;background-color:var(--thumb-color);height:10px;min-width:25px;max-width:80%;border-radius:4px;border:2px solid var(--back-color)}*::-webkit-scrollbar-thumb:hover{background-color:var(--trackHover-color);height:10px}*::-webkit-scrollbar-track{-webkit-appearance:none;background-color:var(--back-color);border:1px solid var(--back-color)}*::-webkit-scrollbar-corner{background-color:var(--back-color)}.elements{background-color:var(--back-color);font-size:2.5rem;color:#000;visibility:visible;overflow-y:auto;scroll-behavior:smooth;border-right:1px solid var(--formBorder-color);padding:7px;transition:min-width .2s}.properties{background-color:var(--back-color);font-size:2.5rem;color:#000;scroll-behavior:smooth;display:flex;min-width:360px;max-width:360px;border-left:1px solid var(--formBorder-color);font-size:18px}.hovered{background-color:#d1d8e2}.sti-root-form{height:inherit;width:inherit}\n"] }]
        }], ctorParameters: () => [{ type: StiToolbarResizerService }, { type: StiModelService }, { type: StiThemeService }, { type: StiControllerService }, { type: StiBarcodeService }, { type: StiRectangleGeometryLayout }, { type: StiEditableContentService }, { type: StiChangesService }, { type: StiExportService }, { type: StiFontService }, { type: StiToolboxService }, { type: StiUndoService }, { type: StiUserService }, { type: StiExpressionService }, { type: StiHelperService }, { type: StiLocalizationService }, { type: StiHttpClientService }, { type: SignatureService }, { type: StiTabIndexService }, { type: StiMouseService }, { type: FormEventsService }, { type: StiDropdownService }, { type: StiFormCheckerService }, { type: StiLocalStorageService }, { type: StiTooltipService }, { type: StiClipboardService }], propDecorators: { addTotalMenu: [{
                type: ViewChild,
                args: ["addTotalMenu"]
            }], requestUrl: [{
                type: Input
            }], style: [{
                type: Input
            }], viewerMode: [{
                type: Input
            }], readonlyMode: [{
                type: Input
            }], form: [{
                type: Input
            }], localization: [{
                type: Input
            }], formName: [{
                type: Input
            }], settings: [{
                type: Input
            }], interfaceEvent: [{
                type: Output
            }], properties: [{
                type: Input
            }], rootFormElementRef: [{
                type: ViewChild,
                args: ["rootForm"]
            }] } });

class StiPreviewRibbonComponent {
    constructor(model, loc, exportService) {
        this.model = model;
        this.loc = loc;
        this.exportService = exportService;
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPreviewRibbonComponent, deps: [{ token: StiModelService }, { token: StiLocalizationService }, { token: StiExportService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiPreviewRibbonComponent, selector: "sti-preview-ribbon-component", ngImport: i0, template: `<div class="preview">
    <button style="margin-left: 20px" (click)="exportService.showModalWindow = !exportService.showModalWindow">
      {{ loc.getP("ExportToPdf") }}
    </button>
  </div>`, isInline: true, styles: [".preview{height:55px;color:var(--text-color);width:100%;border-bottom:1px solid var(--formBorder-color);background-color:var(--back-color);font-family:Segoe UI}.preview button{margin-top:15px;padding:3px 12px;text-decoration:none;margin-right:5px;text-align:center;justify-content:center;font-size:12px;color:var(--text-color);font-weight:600;cursor:default;background-color:var(--input-color);border-top:2px solid var(--toolbarResizerBorder-color);border-left:1px solid var(--toolbarResizerBorder-color);border-right:1px solid var(--toolbarResizerBorder-color);border-bottom:1px solid var(--toolbarResizerBorder-color);vertical-align:-webkit-baseline-middle;border-radius:3px}.preview button:hover{background-color:var(--hover-color)}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiPreviewRibbonComponent, decorators: [{
            type: Component,
            args: [{ selector: "sti-preview-ribbon-component", template: `<div class="preview">
    <button style="margin-left: 20px" (click)="exportService.showModalWindow = !exportService.showModalWindow">
      {{ loc.getP("ExportToPdf") }}
    </button>
  </div>`, styles: [".preview{height:55px;color:var(--text-color);width:100%;border-bottom:1px solid var(--formBorder-color);background-color:var(--back-color);font-family:Segoe UI}.preview button{margin-top:15px;padding:3px 12px;text-decoration:none;margin-right:5px;text-align:center;justify-content:center;font-size:12px;color:var(--text-color);font-weight:600;cursor:default;background-color:var(--input-color);border-top:2px solid var(--toolbarResizerBorder-color);border-left:1px solid var(--toolbarResizerBorder-color);border-right:1px solid var(--toolbarResizerBorder-color);border-bottom:1px solid var(--toolbarResizerBorder-color);vertical-align:-webkit-baseline-middle;border-radius:3px}.preview button:hover{background-color:var(--hover-color)}\n"] }]
        }], ctorParameters: () => [{ type: StiModelService }, { type: StiLocalizationService }, { type: StiExportService }] });

class StiToolbarResizerComponent {
    constructor(toolbarResizerService) {
        this.toolbarResizerService = toolbarResizerService;
    }
    get isMaximize() {
        return this.toolbarResizerService.isMaximizeMode;
    }
    get isMinimize() {
        return this.toolbarResizerService.isMinimizeMode;
    }
    setMinimizeMode() {
        this.toolbarResizerService.isMinimizeMode = true;
        this.toolbarResizerService.isMaximizeMode = false;
        if (document.querySelector(".maximize")) {
            document.querySelector(".maximize")?.classList?.remove("maxMode");
        }
        document.querySelector(".minimize")?.classList?.add("minMode");
    }
    setMaximizeMode() {
        this.toolbarResizerService.isMinimizeMode = false;
        this.toolbarResizerService.isMaximizeMode = true;
        if (document.querySelector(".minimize")) {
            document.querySelector(".minimize")?.classList?.remove("minMode");
        }
        document.querySelector(".maximize")?.classList?.add("maxMode");
    }
    ngOnInit() { }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiToolbarResizerComponent, deps: [{ token: StiToolbarResizerService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StiToolbarResizerComponent, selector: "sti-toolbar-resizer", ngImport: i0, template: `
    <div class="toolbarResizer">
      <div
        class="resizer minimize"
        *ngIf="this.isMaximize"
        (mousedown)="setMinimizeMode()"
        stiTooltip="Minimize"
        tooltipPosition="bottom"
        showDelay="500"
      >
        <div class="point"></div>
      </div>
      <div
        class="resizer maximize"
        *ngIf="this.isMinimize"
        (mousedown)="setMaximizeMode()"
        stiTooltip="Maximize"
        tooltipPosition="bottom"
        showDelay="500"
      >
        <div class="point"></div>
      </div>
    </div>
    <style>
      .toolbarResizer {
      }
      .resizer {
        width: 8px;
        height: 30px;
        background-color: var(--toolbarResizer-color);
        border: 1px solid var(--toolbarResizerBorder-color);
        position: fixed;
        top: calc((100% - 85px - 24px) / 2 + 85px - 15px);
      }
      .minimize {
        border-bottom-left-radius: 3px;
        border-top-left-radius: 3px;
        left: 192px;
      }
      .minimize:hover {
        background-color: var(--hover-color);
      }
      .point {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 1px;
        height: 2px;
        background-color: rgb(119, 119, 119);
      }
      .maximize {
        border-top-right-radius: 3px;
        border-bottom-right-radius: 3px;
        left: 45px;
        margin-right: 10px;
      }
      .maximize:hover {
        background-color: var(--hover-color);
      }
      .maxMode {
        left: 192px;
      }
      .minMode {
        left: 45px;
      }
    </style>
  `, isInline: true, styles: ["\n      .toolbarResizer {\n      }\n      .resizer {\n        width: 8px;\n        height: 30px;\n        background-color: var(--toolbarResizer-color);\n        border: 1px solid var(--toolbarResizerBorder-color);\n        position: fixed;\n        top: calc((100% - 85px - 24px) / 2 + 85px - 15px);\n      }\n      .minimize {\n        border-bottom-left-radius: 3px;\n        border-top-left-radius: 3px;\n        left: 192px;\n      }\n      .minimize:hover {\n        background-color: var(--hover-color);\n      }\n      .point {\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        width: 1px;\n        height: 2px;\n        background-color: rgb(119, 119, 119);\n      }\n      .maximize {\n        border-top-right-radius: 3px;\n        border-bottom-right-radius: 3px;\n        left: 45px;\n        margin-right: 10px;\n      }\n      .maximize:hover {\n        background-color: var(--hover-color);\n      }\n      .maxMode {\n        left: 192px;\n      }\n      .minMode {\n        left: 45px;\n      }\n    "], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: StiTooltipDirective, selector: "[stiTooltip]", inputs: ["tooltipPosition", "stiTooltip", "showDelay"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StiToolbarResizerComponent, decorators: [{
            type: Component,
            args: [{
                    selector: "sti-toolbar-resizer",
                    template: `
    <div class="toolbarResizer">
      <div
        class="resizer minimize"
        *ngIf="this.isMaximize"
        (mousedown)="setMinimizeMode()"
        stiTooltip="Minimize"
        tooltipPosition="bottom"
        showDelay="500"
      >
        <div class="point"></div>
      </div>
      <div
        class="resizer maximize"
        *ngIf="this.isMinimize"
        (mousedown)="setMaximizeMode()"
        stiTooltip="Maximize"
        tooltipPosition="bottom"
        showDelay="500"
      >
        <div class="point"></div>
      </div>
    </div>
    <style>
      .toolbarResizer {
      }
      .resizer {
        width: 8px;
        height: 30px;
        background-color: var(--toolbarResizer-color);
        border: 1px solid var(--toolbarResizerBorder-color);
        position: fixed;
        top: calc((100% - 85px - 24px) / 2 + 85px - 15px);
      }
      .minimize {
        border-bottom-left-radius: 3px;
        border-top-left-radius: 3px;
        left: 192px;
      }
      .minimize:hover {
        background-color: var(--hover-color);
      }
      .point {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 1px;
        height: 2px;
        background-color: rgb(119, 119, 119);
      }
      .maximize {
        border-top-right-radius: 3px;
        border-bottom-right-radius: 3px;
        left: 45px;
        margin-right: 10px;
      }
      .maximize:hover {
        background-color: var(--hover-color);
      }
      .maxMode {
        left: 192px;
      }
      .minMode {
        left: 45px;
      }
    </style>
  `,
                }]
        }], ctorParameters: () => [{ type: StiToolbarResizerService }] });

class StimulsoftFormsModule {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StimulsoftFormsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: StimulsoftFormsModule, declarations: [StimulsoftFormsComponent,
            NavbarComponent,
            WorkspaceComponent,
            PropertiesComponent,
            PageComponent,
            StiTextBoxComponent,
            StiNumberBoxComponent,
            StiComboBoxComponent,
            StiListBoxComponent,
            StiSingleSelectionComponent,
            StiMultipleSelectionComponent,
            StiCheckBoxComponent,
            StiLineComponent,
            StiDraggableElementContainerComponent,
            StiSignatureComponent,
            StiPanelComponent,
            StiDateTimeBoxComponent,
            StiTableComponent,
            StiImageComponent,
            StiButtonComponent,
            StiBarcodeComponent,
            StiBoolEditorComponent,
            StiColorEditorComponent,
            StiEnumEditorComponent,
            StiFontEditorComponent,
            StiImageEditorComponent,
            StiPaddingEditorComponent,
            StiMultilineStringEditorComponent,
            StiNumberEditorComponent,
            StiPaperKindEditorComponent,
            StiVerticalAlignmentEditorComponent,
            StiTextComponent,
            StiNumberComponent,
            StiDragPreviewAdornerComponent,
            StiToolboxComponent,
            StiToolboxElementComponent,
            StiComponent,
            StiComponentResizerComponent,
            StiPageGridOverlayComponent,
            StiTextEditorComponent,
            StiNameEditorComponent,
            StiLabelComponent,
            StiFooterComponent,
            StiToolbarResizerComponent,
            StiPageNavigationComponent,
            StiComponentHolderComponent,
            StiCloneElementContainerComponent,
            StiEditableContentComponent,
            StiPreviewRibbonComponent,
            StiHomeRibbonComponent,
            StiFileRibbonComponent,
            StiSvgCheckBoxComponent,
            StiSvgRadiobuttonComponent,
            StiHorizontalAlignmentEditorComponent,
            StiLabelAlignmentEditorComponent,
            StiVerticalAlignmentEditorComponent,
            StiModalAgreeWindowComponent,
            StiTableInputTextComponent,
            StiTableRadioButtonComponent,
            StiTableComboboxComponent,
            StiTableCheckboxComponent,
            StiTableLabelComponent,
            StiBooleanWithArrowEditorComponent,
            StiTableItemEditorComponent,
            StiTableBorderEditorComponent,
            StiBorderSidesEditorComponent,
            StiTableColumnsEditorComponent,
            StiTableColumnEditorComponent,
            StiTableTotalsFieldComponent,
            StiTableColumnResizerComponent,
            StiProgressComponent,
            StiDraggableColumnContainerComponent,
            StiTableColumnComponent,
            StiExceedMarginsEditorComponent,
            StiSelectButtonEditorComponent,
            StiAddressComponent,
            StiInputTextComponent,
            StiAboutWindowComponent,
            StiBarcodeStyleEditorComponent,
            StiSvgImageComponent,
            StiBarcodeStylesPreviewComponent,
            StiSimpleEnumEditorComponent,
            StiBarcodeShapeEditorComponent,
            StiCornerRadiusComponent,
            StiPdfPreviewComponent,
            StiInsertRibbonComponent,
            NavbarGroupPreviewComponent,
            StiSetupToolboxComponent,
            TableNavigationComponent,
            StiLocalizationPreviewComponent,
            StiUserInfoComponent,
            StiTrialBarComponent,
            StiTrialModalWindowComponent,
            StiFileMenuComponent,
            StiFileMenuNavigationComponent,
            StiFileMenuContentComponent,
            StiFileNewContentComponent,
            StiFileOpenContentComponent,
            StiFileSaveContentComponent,
            StiFileSaveDialogComponent,
            StiButtonMessageWindowComponent,
            StiCloudNavbarComponent,
            ContextMenuWindowComponent,
            StiExpressionHelpWindowComponent,
            StiComponentHeightEditorComponent,
            StiLoginComponent,
            StiExpressionEditorComponent,
            StiColorDialogComponent,
            StiColorOptionsDialogComponent,
            StiPDFSignatureComponent,
            StiColumnsPreviewComponent,
            StiCellsPreviewComponent,
            StiExpressionDraggableContainerComponent,
            StiDropdownComponent,
            StiDropdownListComponent,
            StiFormCheckerComponent,
            StiFormCheckerItemComponent,
            AutoCompleteEditorComponent,
            StiElectronicSignatureEditorComponent,
            StiDraggableModalWindowComponent,
            StiEmbedTextEditorComponent,
            StiEmbedImageEditorComponent,
            StiDividerComponent,
            StiUniversalCheckboxComponent,
            StiInputTextDirective,
            StiInputTextAreaDirective,
            StiDropdownEditorComponent,
            StiTooltipComponent,
            StiTooltipDirective,
            StiSelectButtonComponent,
            StiAutoCompleteComponent,
            StiTrialTimerWindowComponent,
            StiTieredMenuComponent,
            StiPropertyGridNavigationComponent,
            StiFormsTreeComponent,
            StiPropertyGridComponent,
            StiFormElementsDropdownComponent,
            StiFormsTreeItemComponent,
            StiFormTreeWarningWindowComponent], imports: [CommonModule,
            BrowserModule,
            BrowserAnimationsModule,
            FormsModule], exports: [StimulsoftFormsComponent] }); }
    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StimulsoftFormsModule, providers: [provideHttpClient(withInterceptorsFromDi())], imports: [CommonModule,
            BrowserModule,
            BrowserAnimationsModule,
            FormsModule] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StimulsoftFormsModule, decorators: [{
            type: NgModule,
            args: [{ declarations: [
                        StimulsoftFormsComponent,
                        NavbarComponent,
                        WorkspaceComponent,
                        PropertiesComponent,
                        PageComponent,
                        StiTextBoxComponent,
                        StiNumberBoxComponent,
                        StiComboBoxComponent,
                        StiListBoxComponent,
                        StiSingleSelectionComponent,
                        StiMultipleSelectionComponent,
                        StiCheckBoxComponent,
                        StiLineComponent,
                        StiDraggableElementContainerComponent,
                        StiSignatureComponent,
                        StiPanelComponent,
                        StiDateTimeBoxComponent,
                        StiTableComponent,
                        StiImageComponent,
                        StiButtonComponent,
                        StiBarcodeComponent,
                        StiBoolEditorComponent,
                        StiColorEditorComponent,
                        StiEnumEditorComponent,
                        StiFontEditorComponent,
                        StiImageEditorComponent,
                        StiPaddingEditorComponent,
                        StiMultilineStringEditorComponent,
                        StiNumberEditorComponent,
                        StiPaperKindEditorComponent,
                        StiVerticalAlignmentEditorComponent,
                        StiTextComponent,
                        StiNumberComponent,
                        StiDragPreviewAdornerComponent,
                        StiToolboxComponent,
                        StiToolboxElementComponent,
                        StiComponent,
                        StiComponentResizerComponent,
                        StiPageGridOverlayComponent,
                        StiTextEditorComponent,
                        StiNameEditorComponent,
                        StiLabelComponent,
                        StiFooterComponent,
                        StiToolbarResizerComponent,
                        StiPageNavigationComponent,
                        StiComponentHolderComponent,
                        StiCloneElementContainerComponent,
                        StiEditableContentComponent,
                        StiPreviewRibbonComponent,
                        StiHomeRibbonComponent,
                        StiFileRibbonComponent,
                        StiSvgCheckBoxComponent,
                        StiSvgRadiobuttonComponent,
                        StiHorizontalAlignmentEditorComponent,
                        StiLabelAlignmentEditorComponent,
                        StiVerticalAlignmentEditorComponent,
                        StiModalAgreeWindowComponent,
                        StiTableInputTextComponent,
                        StiTableRadioButtonComponent,
                        StiTableComboboxComponent,
                        StiTableCheckboxComponent,
                        StiTableLabelComponent,
                        StiBooleanWithArrowEditorComponent,
                        StiTableItemEditorComponent,
                        StiTableBorderEditorComponent,
                        StiBorderSidesEditorComponent,
                        StiTableColumnsEditorComponent,
                        StiTableColumnEditorComponent,
                        StiTableTotalsFieldComponent,
                        StiTableColumnResizerComponent,
                        StiProgressComponent,
                        StiDraggableColumnContainerComponent,
                        StiTableColumnComponent,
                        StiExceedMarginsEditorComponent,
                        StiSelectButtonEditorComponent,
                        StiAddressComponent,
                        StiInputTextComponent,
                        StiAboutWindowComponent,
                        StiBarcodeStyleEditorComponent,
                        StiSvgImageComponent,
                        StiBarcodeStylesPreviewComponent,
                        StiSimpleEnumEditorComponent,
                        StiBarcodeShapeEditorComponent,
                        StiCornerRadiusComponent,
                        StiPdfPreviewComponent,
                        StiInsertRibbonComponent,
                        NavbarGroupPreviewComponent,
                        StiSetupToolboxComponent,
                        TableNavigationComponent,
                        StiLocalizationPreviewComponent,
                        StiUserInfoComponent,
                        StiTrialBarComponent,
                        StiTrialModalWindowComponent,
                        StiFileMenuComponent,
                        StiFileMenuNavigationComponent,
                        StiFileMenuContentComponent,
                        StiFileNewContentComponent,
                        StiFileOpenContentComponent,
                        StiFileSaveContentComponent,
                        StiFileSaveDialogComponent,
                        StiButtonMessageWindowComponent,
                        StiCloudNavbarComponent,
                        ContextMenuWindowComponent,
                        StiExpressionHelpWindowComponent,
                        StiComponentHeightEditorComponent,
                        StiLoginComponent,
                        StiExpressionEditorComponent,
                        StiColorDialogComponent,
                        StiColorOptionsDialogComponent,
                        StiPDFSignatureComponent,
                        StiColumnsPreviewComponent,
                        StiCellsPreviewComponent,
                        StiExpressionDraggableContainerComponent,
                        StiDropdownComponent,
                        StiDropdownListComponent,
                        StiFormCheckerComponent,
                        StiFormCheckerItemComponent,
                        AutoCompleteEditorComponent,
                        StiElectronicSignatureEditorComponent,
                        StiDraggableModalWindowComponent,
                        StiEmbedTextEditorComponent,
                        StiEmbedImageEditorComponent,
                        StiDividerComponent,
                        StiUniversalCheckboxComponent,
                        StiInputTextDirective,
                        StiInputTextAreaDirective,
                        StiDropdownEditorComponent,
                        StiTooltipComponent,
                        StiTooltipDirective,
                        StiSelectButtonComponent,
                        StiAutoCompleteComponent,
                        StiTrialTimerWindowComponent,
                        StiTieredMenuComponent,
                        StiPropertyGridNavigationComponent,
                        StiFormsTreeComponent,
                        StiPropertyGridComponent,
                        StiFormElementsDropdownComponent,
                        StiFormsTreeItemComponent,
                        StiFormTreeWarningWindowComponent,
                    ],
                    exports: [StimulsoftFormsComponent], imports: [CommonModule,
                        BrowserModule,
                        BrowserAnimationsModule,
                        FormsModule], providers: [provideHttpClient(withInterceptorsFromDi())] }]
        }] });

/*
 * Public API Surface of stimulsoft-forms
 */

/**
 * Generated bundle index. Do not edit.
 */

export { StimulsoftFormsComponent, StimulsoftFormsModule, StimulsoftFormsService };
//# sourceMappingURL=stimulsoft-forms.mjs.map
