@nectary/components 0.29.1 → 0.31.0

package/icons-channel/create-icon-class.d.ts

@@ -1,310 +1 @@
-export declare const createIconClass: (templateHTML: string) => {
-    new (): {
-        $svg: SVGElement;
-        size: number;
-        connectedCallback(): void;
-        attributeChangedCallback(name: string, _: string | null, newVal: string | null): void;
-        attachShadow(options?: Partial<ShadowRootInit> | undefined): ShadowRoot;
-        accessKey: string;
-        readonly accessKeyLabel: string;
-        autocapitalize: string;
-        dir: string;
-        draggable: boolean;
-        hidden: boolean;
-        innerText: string;
-        lang: string;
-        readonly offsetHeight: number;
-        readonly offsetLeft: number;
-        readonly offsetParent: Element | null;
-        readonly offsetTop: number;
-        readonly offsetWidth: number;
-        outerText: string;
-        spellcheck: boolean;
-        title: string;
-        translate: boolean;
-        attachInternals(): ElementInternals;
-        click(): void;
-        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions | undefined): void;
-        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
-        removeEventListener<K_1 extends keyof HTMLElementEventMap>(type: K_1, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_1]) => any, options?: boolean | EventListenerOptions | undefined): void;
-        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions | undefined): void;
-        readonly attributes: NamedNodeMap;
-        readonly classList: DOMTokenList;
-        className: string;
-        readonly clientHeight: number;
-        readonly clientLeft: number;
-        readonly clientTop: number;
-        readonly clientWidth: number;
-        id: string;
-        readonly localName: string;
-        readonly namespaceURI: string | null;
-        onfullscreenchange: ((this: Element, ev: Event) => any) | null;
-        onfullscreenerror: ((this: Element, ev: Event) => any) | null;
-        outerHTML: string;
-        readonly ownerDocument: Document;
-        readonly part: DOMTokenList;
-        readonly prefix: string | null;
-        readonly scrollHeight: number;
-        scrollLeft: number;
-        scrollTop: number;
-        readonly scrollWidth: number;
-        readonly shadowRoot: ShadowRoot | null;
-        slot: string;
-        readonly tagName: string;
-        closest<K_2 extends keyof HTMLElementTagNameMap>(selector: K_2): HTMLElementTagNameMap[K_2] | null;
-        closest<K_3 extends keyof SVGElementTagNameMap>(selector: K_3): SVGElementTagNameMap[K_3] | null;
-        closest<E extends Element = Element>(selectors: string): E | null;
-        getAttribute(qualifiedName: string): string | null;
-        getAttributeNS(namespace: string | null, localName: string): string | null;
-        getAttributeNames(): string[];
-        getAttributeNode(qualifiedName: string): Attr | null;
-        getAttributeNodeNS(namespace: string | null, localName: string): Attr | null;
-        getBoundingClientRect(): DOMRect;
-        getClientRects(): DOMRectList;
-        getElementsByClassName(classNames: string): HTMLCollectionOf<Element>;
-        getElementsByTagName<K_4 extends keyof HTMLElementTagNameMap>(qualifiedName: K_4): HTMLCollectionOf<HTMLElementTagNameMap[K_4]>;
-        getElementsByTagName<K_5 extends keyof SVGElementTagNameMap>(qualifiedName: K_5): HTMLCollectionOf<SVGElementTagNameMap[K_5]>;
-        getElementsByTagName(qualifiedName: string): HTMLCollectionOf<Element>;
-        getElementsByTagNameNS(namespaceURI: "http://www.w3.org/1999/xhtml", localName: string): HTMLCollectionOf<HTMLElement>;
-        getElementsByTagNameNS(namespaceURI: "http://www.w3.org/2000/svg", localName: string): HTMLCollectionOf<SVGElement>;
-        getElementsByTagNameNS(namespace: string | null, localName: string): HTMLCollectionOf<Element>;
-        hasAttribute(qualifiedName: string): boolean;
-        hasAttributeNS(namespace: string | null, localName: string): boolean;
-        hasAttributes(): boolean;
-        hasPointerCapture(pointerId: number): boolean;
-        insertAdjacentElement(where: InsertPosition, element: Element): Element | null;
-        insertAdjacentHTML(position: InsertPosition, text: string): void;
-        insertAdjacentText(where: InsertPosition, data: string): void;
-        matches(selectors: string): boolean;
-        releasePointerCapture(pointerId: number): void;
-        removeAttribute(qualifiedName: string): void;
-        removeAttributeNS(namespace: string | null, localName: string): void;
-        removeAttributeNode(attr: Attr): Attr;
-        requestFullscreen(options?: FullscreenOptions | undefined): Promise<void>;
-        requestPointerLock(): void;
-        scroll(options?: ScrollToOptions | undefined): void;
-        scroll(x: number, y: number): void;
-        scrollBy(options?: ScrollToOptions | undefined): void;
-        scrollBy(x: number, y: number): void;
-        scrollIntoView(arg?: boolean | ScrollIntoViewOptions | undefined): void;
-        scrollTo(options?: ScrollToOptions | undefined): void;
-        scrollTo(x: number, y: number): void;
-        setAttribute(qualifiedName: string, value: string): void;
-        setAttributeNS(namespace: string | null, qualifiedName: string, value: string): void;
-        setAttributeNode(attr: Attr): Attr | null;
-        setAttributeNodeNS(attr: Attr): Attr | null;
-        setPointerCapture(pointerId: number): void;
-        toggleAttribute(qualifiedName: string, force?: boolean | undefined): boolean;
-        webkitMatchesSelector(selectors: string): boolean;
-        readonly baseURI: string;
-        readonly childNodes: NodeListOf<ChildNode>;
-        readonly firstChild: ChildNode | null;
-        readonly isConnected: boolean;
-        readonly lastChild: ChildNode | null;
-        readonly nextSibling: ChildNode | null;
-        readonly nodeName: string;
-        readonly nodeType: number;
-        nodeValue: string | null;
-        readonly parentElement: HTMLElement | null;
-        readonly parentNode: ParentNode | null;
-        readonly previousSibling: ChildNode | null;
-        textContent: string | null;
-        appendChild<T extends Node>(node: T): T;
-        cloneNode(deep?: boolean | undefined): Node;
-        compareDocumentPosition(other: Node): number;
-        contains(other: Node | null): boolean;
-        getRootNode(options?: GetRootNodeOptions | undefined): Node;
-        hasChildNodes(): boolean;
-        insertBefore<T_1 extends Node>(node: T_1, child: Node | null): T_1;
-        isDefaultNamespace(namespace: string | null): boolean;
-        isEqualNode(otherNode: Node | null): boolean;
-        isSameNode(otherNode: Node | null): boolean;
-        lookupNamespaceURI(prefix: string | null): string | null;
-        lookupPrefix(namespace: string | null): string | null;
-        normalize(): void;
-        removeChild<T_2 extends Node>(child: T_2): T_2;
-        replaceChild<T_3 extends Node>(node: Node, child: T_3): T_3;
-        readonly ATTRIBUTE_NODE: number;
-        readonly CDATA_SECTION_NODE: number;
-        readonly COMMENT_NODE: number;
-        readonly DOCUMENT_FRAGMENT_NODE: number;
-        readonly DOCUMENT_NODE: number;
-        readonly DOCUMENT_POSITION_CONTAINED_BY: number;
-        readonly DOCUMENT_POSITION_CONTAINS: number;
-        readonly DOCUMENT_POSITION_DISCONNECTED: number;
-        readonly DOCUMENT_POSITION_FOLLOWING: number;
-        readonly DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC: number;
-        readonly DOCUMENT_POSITION_PRECEDING: number;
-        readonly DOCUMENT_TYPE_NODE: number;
-        readonly ELEMENT_NODE: number;
-        readonly ENTITY_NODE: number;
-        readonly ENTITY_REFERENCE_NODE: number;
-        readonly NOTATION_NODE: number;
-        readonly PROCESSING_INSTRUCTION_NODE: number;
-        readonly TEXT_NODE: number;
-        dispatchEvent(event: Event): boolean;
-        ariaAtomic: string | null;
-        ariaAutoComplete: string | null;
-        ariaBusy: string | null;
-        ariaChecked: string | null;
-        ariaColCount: string | null;
-        ariaColIndex: string | null;
-        ariaColSpan: string | null;
-        ariaCurrent: string | null;
-        ariaDisabled: string | null;
-        ariaExpanded: string | null;
-        ariaHasPopup: string | null;
-        ariaHidden: string | null;
-        ariaKeyShortcuts: string | null;
-        ariaLabel: string | null;
-        ariaLevel: string | null;
-        ariaLive: string | null;
-        ariaModal: string | null;
-        ariaMultiLine: string | null;
-        ariaMultiSelectable: string | null;
-        ariaOrientation: string | null;
-        ariaPlaceholder: string | null;
-        ariaPosInSet: string | null;
-        ariaPressed: string | null;
-        ariaReadOnly: string | null;
-        ariaRequired: string | null;
-        ariaRoleDescription: string | null;
-        ariaRowCount: string | null;
-        ariaRowIndex: string | null;
-        ariaRowSpan: string | null;
-        ariaSelected: string | null;
-        ariaSetSize: string | null;
-        ariaSort: string | null;
-        ariaValueMax: string | null;
-        ariaValueMin: string | null;
-        ariaValueNow: string | null;
-        ariaValueText: string | null;
-        animate(keyframes: Keyframe[] | PropertyIndexedKeyframes | null, options?: number | KeyframeAnimationOptions | undefined): Animation;
-        getAnimations(options?: GetAnimationsOptions | undefined): Animation[];
-        after(...nodes: (string | Node)[]): void;
-        before(...nodes: (string | Node)[]): void;
-        remove(): void;
-        replaceWith(...nodes: (string | Node)[]): void;
-        innerHTML: string;
-        readonly nextElementSibling: Element | null;
-        readonly previousElementSibling: Element | null;
-        readonly childElementCount: number;
-        readonly children: HTMLCollection;
-        readonly firstElementChild: Element | null;
-        readonly lastElementChild: Element | null;
-        append(...nodes: (string | Node)[]): void;
-        prepend(...nodes: (string | Node)[]): void;
-        querySelector<K_6 extends keyof HTMLElementTagNameMap>(selectors: K_6): HTMLElementTagNameMap[K_6] | null;
-        querySelector<K_7 extends keyof SVGElementTagNameMap>(selectors: K_7): SVGElementTagNameMap[K_7] | null;
-        querySelector<E_1 extends Element = Element>(selectors: string): E_1 | null;
-        querySelectorAll<K_8 extends keyof HTMLElementTagNameMap>(selectors: K_8): NodeListOf<HTMLElementTagNameMap[K_8]>;
-        querySelectorAll<K_9 extends keyof SVGElementTagNameMap>(selectors: K_9): NodeListOf<SVGElementTagNameMap[K_9]>;
-        querySelectorAll<E_2 extends Element = Element>(selectors: string): NodeListOf<E_2>;
-        replaceChildren(...nodes: (string | Node)[]): void;
-        readonly assignedSlot: HTMLSlotElement | null;
-        oncopy: ((this: DocumentAndElementEventHandlers, ev: ClipboardEvent) => any) | null;
-        oncut: ((this: DocumentAndElementEventHandlers, ev: ClipboardEvent) => any) | null;
-        onpaste: ((this: DocumentAndElementEventHandlers, ev: ClipboardEvent) => any) | null;
-        readonly style: CSSStyleDeclaration;
-        contentEditable: string;
-        enterKeyHint: string;
-        inputMode: string;
-        readonly isContentEditable: boolean;
-        onabort: ((this: GlobalEventHandlers, ev: UIEvent) => any) | null;
-        onanimationcancel: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
-        onanimationend: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
-        onanimationiteration: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
-        onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
-        onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
-        oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        oncanplaythrough: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onclose: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        oncontextmenu: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        oncuechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        ondblclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        ondrag: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
-        ondragend: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
-        ondragenter: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
-        ondragleave: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
-        ondragover: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
-        ondragstart: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
-        ondrop: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
-        ondurationchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onemptied: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onended: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onerror: OnErrorEventHandler;
-        onfocus: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
-        onformdata: ((this: GlobalEventHandlers, ev: FormDataEvent) => any) | null;
-        ongotpointercapture: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        oninput: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        oninvalid: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onkeydown: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
-        onkeypress: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
-        onkeyup: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
-        onload: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onloadeddata: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onloadedmetadata: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onloadstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onlostpointercapture: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onmousedown: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onmouseenter: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onmouseleave: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onmousemove: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onmouseout: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onmouseover: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onmouseup: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onpause: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onplaying: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onpointercancel: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onpointerdown: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onpointerenter: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onpointerleave: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onpointermove: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onpointerout: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onpointerover: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onpointerup: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onprogress: ((this: GlobalEventHandlers, ev: ProgressEvent<EventTarget>) => any) | null;
-        onratechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onreset: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onresize: ((this: GlobalEventHandlers, ev: UIEvent) => any) | null;
-        onscroll: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onsecuritypolicyviolation: ((this: GlobalEventHandlers, ev: SecurityPolicyViolationEvent) => any) | null;
-        onseeked: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onseeking: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onselect: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onselectionchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onselectstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onslotchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onstalled: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onsubmit: ((this: GlobalEventHandlers, ev: SubmitEvent) => any) | null;
-        onsuspend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        ontimeupdate: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        ontoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        ontouchcancel?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
-        ontouchend?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
-        ontouchmove?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
-        ontouchstart?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
-        ontransitioncancel: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
-        ontransitionend: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
-        ontransitionrun: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
-        ontransitionstart: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
-        onvolumechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onwaiting: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onwebkitanimationend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onwebkitanimationiteration: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onwebkitanimationstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onwebkittransitionend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onwheel: ((this: GlobalEventHandlers, ev: WheelEvent) => any) | null;
-        autofocus: boolean;
-        readonly dataset: DOMStringMap;
-        nonce?: string | undefined;
-        tabIndex: number;
-        blur(): void;
-        focus(options?: FocusOptions | undefined): void;
-    };
-    readonly observedAttributes: string[];
-};
+export declare const createIconClass: (templateHTML: string) => CustomElementConstructor;

package/icons-channel/create-icon-class.js

@@ -1,5 +1,5 @@
 import { getIntegerAttribute, NectaryElement, updateAttribute, updateIntegerAttribute } from '../utils';
-const iconStylesHtml = '<style>:host{display:inline-block;vertical-align:middle}</style>';
+const iconStylesHtml = '<style>:host{display:inline-block;vertical-align:middle}svg{display:block;pointer-events:none}</style>';
 const DEFAULT_SIZE = 48;
 const MIN_SIZE = 4;
 const MAX_SIZE = 256;

package/icons-channel/facebook-messenger-square/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchIconChannelElement, TSinchIconChannelReact } from '../types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-icon-channel-facebook-messenger-square': TSinchIconChannelReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-icon-channel-facebook-messenger-square': TSinchIconChannelElement;
+    }
+}

package/icons-channel/facebook-messenger-square/index.js

@@ -0,0 +1,4 @@
+import { defineCustomElement } from '../../utils';
+import { createIconClass } from '../create-icon-class';
+const templateHTML = '<svg viewBox="0 0 48 48" aria-hidden="true" focusable="false"><path d="M8.1 0H40c4.4 0 8 3.615 8 8.033v31.934C48 44.385 44.4 48 40 48H8.1c-4.4 0-8-3.615-8-8.033V8.033C.1 3.615 3.6 0 8.1 0Z" fill="url(#b)"/><path d="M24.2 9.038c-8.5 0-15.1 6.226-15.1 14.56 0 4.419 1.8 8.134 4.8 10.745.2.2.4.502.4.904l.1 2.711c0 .803.9 1.406 1.7 1.105l3-1.306c.3-.1.5-.1.8-.1 1.4.402 2.9.602 4.4.602 8.5 0 15.2-6.226 15.2-14.56-.1-8.436-6.7-14.661-15.3-14.661Z" fill="#fff"/><path d="m15.1 27.916 4.5-7.029a2.29 2.29 0 0 1 3.3-.602l3.5 2.61c.3.201.8.201 1.1 0l4.8-3.615c.6-.502 1.5.302 1 .904l-4.5 7.03a2.29 2.29 0 0 1-3.3.602L22 25.205c-.3-.2-.8-.2-1.1 0l-4.8 3.615c-.6.502-1.4-.301-1-.904Z" fill="url(#c)"/><defs><radialGradient id="b" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(52.1753 0 0 52.2422 9.289 47.733)"><stop stop-color="#09F"/><stop offset=".61" stop-color="#A033FF"/><stop offset=".935" stop-color="#FF5280"/><stop offset="1" stop-color="#FF7061"/></radialGradient><radialGradient id="c" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(20.1092 0 0 10.6968 18.56 28.942)"><stop stop-color="#09F"/><stop offset=".61" stop-color="#A033FF"/><stop offset=".935" stop-color="#FF5280"/><stop offset="1" stop-color="#FF7061"/></radialGradient></defs></svg>';
+defineCustomElement('sinch-icon-channel-facebook-messenger-square', createIconClass(templateHTML));

package/icons-channel/instagram-square/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchIconChannelElement, TSinchIconChannelReact } from '../types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-icon-channel-instagram-square': TSinchIconChannelReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-icon-channel-instagram-square': TSinchIconChannelElement;
+    }
+}

package/icons-channel/instagram-square/index.js

@@ -0,0 +1,4 @@
+import { defineCustomElement } from '../../utils';
+import { createIconClass } from '../create-icon-class';
+const templateHTML = '<svg viewBox="0 0 48 48" aria-hidden="true" focusable="false"><path d="M7.7 0h32.5c4.2 0 7.6 3.414 7.6 7.632v32.636c0 4.217-3.4 7.632-7.6 7.632H7.7c-4.2 0-7.6-3.415-7.6-7.632V7.632C.1 3.414 3.5 0 7.7 0Z" fill="url(#a)"/><path d="M19.2 24c0-2.711 2.2-4.82 4.8-4.82 2.7 0 4.8 2.21 4.8 4.82 0 2.61-2.2 4.82-4.8 4.82-2.7 0-4.8-2.109-4.8-4.82Zm-2.6 0c0 4.117 3.3 7.431 7.4 7.431 4.1 0 7.4-3.314 7.4-7.431s-3.3-7.43-7.4-7.43c-4.1 0-7.4 3.313-7.4 7.43ZM30 16.268c0 .301.1.703.3 1.004.2.301.5.502.8.603.3.1.7.2 1 .1.3-.1.6-.2.9-.502.2-.201.4-.603.5-.904.1-.301 0-.703-.1-1.004-.1-.301-.4-.603-.6-.803-.3-.201-.6-.302-1-.302-.5 0-.9.201-1.2.502-.4.402-.6.804-.6 1.306ZM18.2 35.749c-1.4-.1-2.2-.301-2.7-.502-.7-.301-1.2-.603-1.7-1.105s-.8-1.004-1.1-1.707c-.2-.502-.4-1.305-.5-2.711-.1-1.506-.1-2.009-.1-5.824 0-3.816 0-4.318.1-5.825.1-1.405.3-2.209.5-2.71.3-.704.6-1.206 1.1-1.708.5-.502 1-.803 1.7-1.105.5-.2 1.3-.401 2.7-.502 1.5-.1 2-.1 5.8-.1s4.3 0 5.8.1c1.4.1 2.2.301 2.7.502.7.302 1.2.603 1.7 1.105s.8 1.004 1.1 1.707c.2.502.4 1.305.5 2.711.1 1.507.1 2.009.1 5.825 0 3.816 0 4.318-.1 5.824-.1 1.406-.3 2.21-.5 2.711-.3.703-.6 1.205-1.1 1.707-.5.502-1 .804-1.7 1.105-.5.2-1.3.402-2.7.502-1.5.1-2 .1-5.8.1-3.9 0-4.3 0-5.8-.1ZM18.1 9.64c-1.5.1-2.6.301-3.5.703-.9.402-1.8.904-2.6 1.707-.8.804-1.3 1.607-1.7 2.611-.4.904-.6 2.008-.7 3.515-.1 1.506-.1 2.008-.1 5.925 0 3.916 0 4.418.1 5.924.1 1.506.3 2.611.7 3.515.4.904.9 1.807 1.7 2.61.8.804 1.6 1.306 2.6 1.708.9.402 2 .602 3.5.703 1.5.1 2 .1 5.9.1 3.9 0 4.4 0 5.9-.1s2.6-.301 3.5-.703c.9-.402 1.8-.904 2.6-1.707.8-.804 1.3-1.607 1.7-2.611.4-.904.6-2.009.7-3.515.1-1.506.1-2.008.1-5.924 0-3.917 0-4.419-.1-5.925-.1-1.506-.3-2.611-.7-3.515-.4-.904-.9-1.807-1.7-2.61-.8-.804-1.6-1.306-2.6-1.708-.9-.402-2-.602-3.5-.703-1.5-.1-2-.1-5.9-.1-3.9 0-4.4 0-5.9.1Z" fill="#fff"/><defs><linearGradient id="a" x1="47.991" y1="-.024" x2="-.258" y2="47.89" gradientUnits="userSpaceOnUse"><stop stop-color="#4F3EB7"/><stop offset=".193" stop-color="#9132AE"/><stop offset=".526" stop-color="#CF288B"/><stop offset="1" stop-color="#FFD43C"/></linearGradient></defs></svg>';
+defineCustomElement('sinch-icon-channel-instagram-square', createIconClass(templateHTML));

package/icons-channel/line-square/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchIconChannelElement, TSinchIconChannelReact } from '../types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-icon-channel-line-square': TSinchIconChannelReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-icon-channel-line-square': TSinchIconChannelElement;
+    }
+}

package/icons-channel/line-square/index.js

@@ -0,0 +1,4 @@
+import { defineCustomElement } from '../../utils';
+import { createIconClass } from '../create-icon-class';
+const templateHTML = '<svg viewBox="0 0 48 48" aria-hidden="true" focusable="false"><path d="M8.1 0H40c4.4 0 8 3.615 8 8.033v31.934C48 44.385 44.4 48 40 48H8.1c-4.4 0-8-3.615-8-8.033V8.033C.1 3.615 3.7 0 8.1 0Z" fill="#06C755"/><path d="M38.2 22.092c0-6.427-6.4-11.548-14.2-11.548-7.8 0-14.2 5.222-14.2 11.548 0 5.724 5.1 10.544 11.9 11.448.5.1 1.1.301 1.3.703.1.401.1.904 0 1.305 0 0-.2 1.004-.2 1.205-.1.402-.3 1.406 1.2.803 1.5-.602 8.2-4.82 11.2-8.334 2-2.31 3-4.62 3-7.13Z" fill="#fff"/><path d="M33.5 25.808h-4c-.1 0-.3-.1-.3-.302V19.28c0-.1.1-.3.3-.3h4c.1 0 .3.1.3.3v1.005c0 .1-.1.3-.3.3h-2.7v1.005h2.7c.1 0 .3.1.3.301v1.004c0 .1-.1.302-.3.302h-2.7V24.2h2.7c.1 0 .3.1.3.301v1.004c0 .1-.2.302-.3.302Zm-14.8 0c.1 0 .3-.1.3-.302v-1.004c0-.1-.1-.301-.3-.301H16v-4.92c0-.101-.1-.302-.3-.302h-1c-.1 0-.3.1-.3.301v6.226c0 .1.1.302.3.302h4Zm2.4-6.829h-1c-.1 0-.3.1-.3.301v6.226c0 .1.1.302.3.302h1c.1 0 .3-.1.3-.302V19.28c0-.2-.1-.3-.3-.3Zm6.9 0h-1c-.1 0-.3.1-.3.301v3.716l-2.8-3.916h-1c-.1 0-.3.1-.3.3v6.227c0 .1.1.301.3.301h1c.1 0 .3-.1.3-.301V21.89l2.8 3.816s0 .1.1.1h1.1c.1 0 .3-.1.3-.3V19.28c-.2-.2-.4-.3-.5-.3Z" fill="#06C755"/></svg>';
+defineCustomElement('sinch-icon-channel-line-square', createIconClass(templateHTML));

package/icons-channel/talk-square/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchIconChannelElement, TSinchIconChannelReact } from '../types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-icon-channel-talk-square': TSinchIconChannelReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-icon-channel-talk-square': TSinchIconChannelElement;
+    }
+}

package/icons-channel/talk-square/index.js

@@ -0,0 +1,4 @@
+import { defineCustomElement } from '../../utils';
+import { createIconClass } from '../create-icon-class';
+const templateHTML = '<svg viewBox="0 0 48 48" aria-hidden="true" focusable="false"><path d="M8.1 0H40c4.4 0 8 3.615 8 8.033v31.934C48 44.385 44.4 48 40 48H8.1c-4.4 0-8-3.615-8-8.033V8.033C.1 3.615 3.7 0 8.1 0Z" fill="#FFE812"/><path d="M24 12.251c-7.6 0-13.8 4.92-13.8 10.946 0 3.916 2.6 7.33 6.5 9.238-.2.703-1.4 4.72-1.4 5.021 0 0 0 .201.1.301.2.1.3 0 .3 0 .4-.1 5-3.313 5.8-3.916.8.1 1.6.2 2.5.2 7.6 0 13.8-4.92 13.8-10.945S31.6 12.251 24 12.251Z" fill="#000"/><path d="M16.4 27.012a.79.79 0 0 1-.8-.803v-4.72h-1.2c-.4 0-.8-.401-.8-.803 0-.401.4-.803.8-.803h4.1c.4 0 .8.402.8.803 0 .402-.4.803-.8.803h-1.2v4.72c-.2.402-.5.803-.9.803Zm6.9 0c-.3 0-.6-.1-.7-.401l-.4-1.004h-2.4l-.4 1.004c-.1.2-.3.401-.7.401-.2 0-.4 0-.5-.1-.2-.1-.4-.402-.2-1.104l1.9-5.021c.1-.402.5-.804 1.1-.804.5 0 .9.402 1.1.804l1.9 5.02c.2.804 0 1.005-.2 1.105-.1 0-.3.1-.5.1Zm-1.4-2.811-.8-2.31-.8 2.31h1.6Zm3.4 2.711c-.4 0-.8-.301-.8-.703v-5.422c0-.402.4-.804.8-.804s.8.402.8.804v4.72h1.7c.4 0 .8.3.8.702 0 .402-.3.703-.8.703h-2.5Zm4.5.1c-.4 0-.8-.401-.8-.803v-5.523c0-.401.4-.803.8-.803s.8.402.8.803v1.707l2.2-2.209c.1-.1.3-.2.4-.2.2 0 .4.1.5.2.1.1.2.301.2.502s-.1.402-.2.502L32 23.096l2 2.611c.1.2.2.402.2.603 0 .2-.1.401-.3.502-.1.1-.3.2-.5.2-.3 0-.5-.1-.6-.3L30.9 24.2l-.3.301v1.707c0 .402-.4.803-.8.803Z" fill="#FFE812"/></svg>';
+defineCustomElement('sinch-icon-channel-talk-square', createIconClass(templateHTML));

package/icons-channel/telegram-square/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchIconChannelElement, TSinchIconChannelReact } from '../types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-icon-channel-telegram-square': TSinchIconChannelReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-icon-channel-telegram-square': TSinchIconChannelElement;
+    }
+}

package/icons-channel/telegram-square/index.js

@@ -0,0 +1,4 @@
+import { defineCustomElement } from '../../utils';
+import { createIconClass } from '../create-icon-class';
+const templateHTML = '<svg viewBox="0 0 48 48" aria-hidden="true" focusable="false"><path d="M8 0h31.9c4.4 0 8 3.615 8 8.033v31.934c0 4.418-3.6 8.033-8 8.033H8c-4.4 0-8-3.615-8-8.033V8.033C0 3.615 3.6 0 8 0Z" fill="#25A2E0"/><path fill-rule="evenodd" clip-rule="evenodd" d="M10.9 23.7c7-3 11.7-5.1 14-6 6.7-2.8 8-3.3 9-3.3.2 0 .6 0 .9.3.2.2.3.5.3.6 0 .1.1.6 0 .9-.4 3.8-1.9 13-2.7 17.3-.3 1.8-1 2.4-1.6 2.5-1.4.1-2.5-.9-3.8-1.8l-5.4-3.6c-2.4-1.6-.8-2.4.5-3.8.4-.4 6.5-6 6.6-6.5 0-.1 0-.3-.1-.4-.1-.1-.3-.1-.5 0-.2 0-3.6 2.3-10.1 6.7-1 .7-1.8 1-2.6 1-.9 0-2.5-.5-3.7-.9-1.5-.5-2.7-.7-2.6-1.6 0-.5.6-.9 1.8-1.4Z" fill="#fff"/></svg>';
+defineCustomElement('sinch-icon-channel-telegram-square', createIconClass(templateHTML));

package/icons-channel/twitter-square/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchIconChannelElement, TSinchIconChannelReact } from '../types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-icon-channel-twitter-square': TSinchIconChannelReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-icon-channel-twitter-square': TSinchIconChannelElement;
+    }
+}

package/icons-channel/twitter-square/index.js

@@ -0,0 +1,4 @@
+import { defineCustomElement } from '../../utils';
+import { createIconClass } from '../create-icon-class';
+const templateHTML = '<svg viewBox="0 0 48 48" aria-hidden="true" focusable="false"><path d="M8.1 0H40c4.4 0 8 3.615 8 8.033v31.934C48 44.385 44.4 48 40 48H8.1c-4.4 0-8-3.615-8-8.033V8.033C.1 3.615 3.7 0 8.1 0Z" fill="#1D9BF0"/><path d="M34.7 19.682v.703c0 7.03-5.3 15.163-15.1 15.163-2.9 0-5.7-.803-8.1-2.41.4.1.8.1 1.3.1 2.4 0 4.7-.803 6.6-2.31-2.3 0-4.3-1.505-4.9-3.715.8.201 1.6.1 2.4-.1-2.5-.502-4.2-2.711-4.2-5.222v-.1c.7.401 1.6.602 2.4.703-2.3-1.607-3-4.62-1.6-7.13 2.7 3.314 6.7 5.322 10.9 5.523-.4-1.808.2-3.816 1.5-5.121 2.1-2.009 5.5-1.908 7.5.2 1.2-.2 2.3-.702 3.4-1.305-.4 1.205-1.2 2.31-2.3 2.912 1-.1 2.1-.401 3-.803-.9 1.305-1.8 2.209-2.8 2.912Z" fill="#fff"/></svg>';
+defineCustomElement('sinch-icon-channel-twitter-square', createIconClass(templateHTML));

package/icons-channel/viber-square/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchIconChannelElement, TSinchIconChannelReact } from '../types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-icon-channel-viber-square': TSinchIconChannelReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-icon-channel-viber-square': TSinchIconChannelElement;
+    }
+}

package/icons-channel/viber-square/index.js

@@ -0,0 +1,4 @@
+import { defineCustomElement } from '../../utils';
+import { createIconClass } from '../create-icon-class';
+const templateHTML = '<svg viewBox="0 0 48 48" aria-hidden="true" focusable="false"><path d="M8.1 0H40c4.4 0 8 3.615 8 8.033v31.934C48 44.385 44.4 48 40 48H8.1c-4.4 0-8-3.615-8-8.033V8.033C.1 3.615 3.7 0 8.1 0Z" fill="#7360F2"/><path d="M35.4 12.552c-.8-.703-3.9-3.012-10.8-3.012 0 0-8.2-.502-12.1 3.213-2.2 2.21-3 5.523-3.1 9.54-.1 4.017-.2 11.548 7.1 13.657v3.113s0 1.305.8 1.506c1 .301 1.6-.602 2.6-1.707.5-.603 1.3-1.406 1.8-2.009 5 .402 8.8-.502 9.2-.702 1-.302 6.7-1.105 7.6-8.636.8-7.733-.6-12.653-3.1-14.963Zm.8 14.46c-.8 6.327-5.4 6.728-6.2 7.03-.4.1-3.7 1.004-7.9.703 0 0-3.1 3.816-4.1 4.82-.2.2-.3.2-.5.2s-.2-.2-.2-.502v-5.221c-6.1-1.707-5.8-8.134-5.7-11.548.1-3.415.7-6.126 2.6-8.034 3.4-3.012 10.3-2.61 10.3-2.61 5.9 0 8.7 1.807 9.3 2.41 2.1 1.807 3.2 6.225 2.4 12.752Z" fill="#fff"/><path d="M27.4 22.494c-.2 0-.4-.201-.4-.402-.1-1.305-.7-2.008-2-2.008-.2 0-.4-.201-.4-.402 0-.2.2-.402.4-.402 1.7.1 2.6 1.105 2.7 2.812.1.2-.1.402-.3.402Z" fill="#fff"/><path d="M29.4 23.197c-.2 0-.4-.201-.4-.402 0-1.306-.4-2.41-1.2-3.314-.8-.904-1.9-1.406-3.4-1.506-.2 0-.4-.201-.4-.402 0-.2.2-.401.4-.401 1.7.1 3 .702 3.9 1.707.9 1.004 1.4 2.31 1.4 3.916.1.2-.1.402-.3.402Z" fill="#fff"/><path d="M31.5 24c-.2 0-.4-.2-.4-.402 0-2.41-.7-4.217-2.1-5.623-1.4-1.306-3.1-2.009-5.2-2.109-.2 0-.4-.2-.4-.402 0-.2.2-.401.4-.401 2.3 0 4.2.803 5.7 2.31 1.5 1.506 2.3 3.614 2.3 6.125.1.301-.1.502-.3.502Zm-6.4 3.314s.6 0 .8-.302l.6-.702c.3-.402 1-.603 1.6-.201.5.301 1 .602 1.4.903.4.302 1.3 1.105 1.3 1.105.4.402.5.904.2 1.406a4.44 4.44 0 0 1-1.2 1.506c-.4.302-.8.502-1.2.603h-.2c-.2 0-.4 0-.5-.1-.6-.201-1.6-.603-3.4-1.607-1-.502-1.9-1.205-2.8-1.908-.4-.402-.9-.703-1.3-1.105s-.8-.803-1.1-1.305c-.7-.904-1.3-1.808-1.9-2.812-.9-1.707-1.4-2.711-1.6-3.414-.1-.201-.1-.302-.1-.502v-.201c0-.402.2-.803.6-1.205.4-.502.9-.904 1.5-1.205.6-.302 1.1-.201 1.4.2 0 0 .7.904 1.1 1.306.3.502.6.904.9 1.406.4.703.1 1.305-.2 1.607l-.7.602c-.4.301-.3.803-.3.803s1.1 4.118 5.1 5.122Z" fill="#fff"/></svg>';
+defineCustomElement('sinch-icon-channel-viber-square', createIconClass(templateHTML));

package/icons-channel/wechat-square/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchIconChannelElement, TSinchIconChannelReact } from '../types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-icon-channel-wechat-square': TSinchIconChannelReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-icon-channel-wechat-square': TSinchIconChannelElement;
+    }
+}

package/icons-channel/wechat-square/index.js

@@ -0,0 +1,4 @@
+import { defineCustomElement } from '../../utils';
+import { createIconClass } from '../create-icon-class';
+const templateHTML = '<svg viewBox="0 0 48 48" aria-hidden="true" focusable="false"><path d="M8.1 0H40c4.4 0 8 3.615 8 8.033v31.934C48 44.385 44.4 48 40 48H8.1c-4.4 0-8-3.615-8-8.033V8.033C.1 3.615 3.7 0 8.1 0Z" fill="#2DC100"/><path d="M29.8 19.682c-2.8.1-5.1 1.004-7.1 2.912s-2.9 4.218-2.6 7.13c-1.1-.1-2.1-.301-3-.402-.3 0-.7 0-1 .201-1 .502-1.9 1.105-3 1.808.2-.904.3-1.708.6-2.51.2-.603.1-.905-.4-1.206-3.3-2.31-4.7-5.824-3.7-9.44 1-3.313 3.3-5.322 6.5-6.426 4.4-1.406 9.3 0 12 3.515 1 1.305 1.6 2.71 1.7 4.418Zm-12.6-1.105c0-.703-.5-1.205-1.2-1.305-.7 0-1.3.502-1.3 1.205 0 .703.5 1.205 1.2 1.305.7 0 1.2-.502 1.3-1.205Zm6.6-1.305c-.7 0-1.3.603-1.2 1.205 0 .703.6 1.205 1.3 1.205.7 0 1.2-.502 1.2-1.205-.1-.703-.6-1.205-1.3-1.205Z" fill="#fff"/><path d="M36 36.853c-.9-.401-1.7-1.004-2.5-1.104-.8-.1-1.7.402-2.6.502-2.7.301-5.1-.502-7.1-2.31-3.8-3.514-3.3-8.937 1.1-11.849 3.9-2.61 9.6-1.707 12.4 1.808 2.4 3.113 2.1 7.23-.8 9.84-.8.804-1.2 1.406-.6 2.41 0 .302 0 .503.1.703Zm-9.9-9.64c.6 0 1-.401 1-1.004 0-.602-.4-1.104-1-1.104s-1.1.502-1 1.104c0 .603.4 1.004 1 1.004Zm6.4-2.008c-.5 0-1 .402-1 1.004 0 .603.4 1.105 1 1.105s1-.402 1-1.004c0-.603-.4-1.105-1-1.105Z" fill="#fff"/></svg>';
+defineCustomElement('sinch-icon-channel-wechat-square', createIconClass(templateHTML));

package/icons-channel/whatsapp-square/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchIconChannelElement, TSinchIconChannelReact } from '../types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-icon-channel-whatsapp-square': TSinchIconChannelReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-icon-channel-whatsapp-square': TSinchIconChannelElement;
+    }
+}

package/icons-channel/whatsapp-square/index.js

@@ -0,0 +1,4 @@
+import { defineCustomElement } from '../../utils';
+import { createIconClass } from '../create-icon-class';
+const templateHTML = '<svg viewBox="0 0 48 48" aria-hidden="true" focusable="false"><path d="M8.1 0H40c4.4 0 8 3.615 8 8.033v31.934C48 44.385 44.4 48 40 48H8.1c-4.4 0-8-3.615-8-8.033V8.033C.1 3.615 3.7 0 8.1 0Z" fill="#00D741"/><path fill-rule="evenodd" clip-rule="evenodd" d="M34.9 13.255c-2.7-2.711-6.4-4.217-10.2-4.217-8 0-14.4 6.426-14.4 14.46 0 2.51.7 5.02 1.9 7.23l-2 7.43 7.7-2.007a14.94 14.94 0 0 0 6.9 1.707c8 0 14.4-6.427 14.4-14.46-.1-3.817-1.6-7.431-4.3-10.143ZM24.7 35.448c-2.2 0-4.3-.603-6.1-1.708l-.4-.3-4.5 1.204 1.2-4.418-.3-.502c-1.2-1.908-1.8-4.117-1.8-6.427 0-6.628 5.4-11.95 12-11.95 3.2 0 6.2 1.205 8.5 3.515s3.5 5.322 3.5 8.535c-.1 6.729-5.5 12.05-12.1 12.05Zm6.6-8.938c-.4-.2-2.1-1.004-2.5-1.205-.3-.1-.6-.2-.8.201-.2.402-.9 1.205-1.1 1.406-.2.2-.4.301-.8.1-.4-.2-1.5-.602-2.9-1.807-1.1-1.004-1.8-2.109-2-2.51-.2-.402 0-.603.2-.703.2-.201.4-.402.5-.603.2-.2.2-.402.4-.602.1-.201.1-.402 0-.603-.1-.2-.8-1.908-1.1-2.711-.3-.703-.6-.603-.8-.603h-.7c-.2 0-.6.1-1 .402-.3.402-1.3 1.205-1.3 3.013 0 1.807 1.3 3.514 1.5 3.715.2.2 2.5 3.916 6.2 5.422.9.402 1.5.603 2.1.804.9.301 1.7.2 2.3.1.7-.1 2.1-.904 2.4-1.707.3-.803.3-1.607.2-1.707-.2-.2-.5-.2-.8-.402Z" fill="#fff"/></svg>';
+defineCustomElement('sinch-icon-channel-whatsapp-square', createIconClass(templateHTML));

package/illustrations/5g/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchIllustrationElement, TSinchIllustrationReact } from '../types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-illustration-5g': TSinchIllustrationReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-illustration-5g': TSinchIllustrationElement;
+    }
+}

package/illustrations/5g/index.js

@@ -0,0 +1,4 @@
+import { defineCustomElement } from '../../utils';
+import { createIllustrationClass } from '../create-illustration-class';
+const templateHTML = '<svg viewBox="0 0 531 800" fill="none" aria-hidden="true" focusable="false"><path d="M238.328 469.641c13.314 0 26.292-5.035 36.137-13.984 9.845-8.95 16.111-21.368 17.453-34.681a53.286 53.286 0 0 0-10.405-37.365c-7.943-10.74-19.69-18.124-32.78-20.697-13.09-2.573-26.739-.223-38.151 6.713-11.412 6.936-19.915 17.787-23.83 30.541-3.916 12.753-2.797 26.514 2.909 38.596 5.705 12.082 15.775 21.591 28.081 26.737 6.489 2.685 13.538 4.14 20.586 4.14Z" fill="#FFBE3C"/><path d="m219.532 445.812 18.908-10.852h22.935c1.566 0 2.909-.559 4.028-1.678 1.118-1.119 1.678-2.461 1.678-4.027v-30.318c0-1.454-.56-2.909-1.678-4.027-1.119-1.119-2.462-1.679-4.028-1.679H215.84c-1.566 0-2.909.56-4.028 1.679-1.118 1.118-1.678 2.461-1.678 4.027v30.318a5.68 5.68 0 0 0 1.678 4.027c1.119 1.119 2.462 1.678 4.028 1.678h3.804v10.852h-.112Zm41.731-48.777c.448 0 1.007.224 1.343.559.335.336.559.784.559 1.343v30.318c0 .447-.224 1.006-.559 1.342a2.063 2.063 0 0 1-1.343.559h-23.83l-14.097 8.055v-8.055h-7.608a2.06 2.06 0 0 1-1.342-.559 2.064 2.064 0 0 1-.56-1.342v-30.318c0-.448.224-1.007.56-1.343a2.065 2.065 0 0 1 1.342-.559h45.535Z" fill="#272727"/><path d="M219.533 404.642c0-1.007.895-1.902 1.902-1.902h9.509c1.007 0 1.902.895 1.902 1.902s-.895 1.902-1.902 1.902h-7.607v4.699h4.251a7.137 7.137 0 0 1 7.16 7.16 7.138 7.138 0 0 1-7.16 7.16h-6.153c-1.007 0-1.902-.895-1.902-1.902s.895-1.902 1.902-1.902h6.153c1.79 0 3.356-1.454 3.356-3.356 0-1.79-1.454-3.357-3.356-3.357h-6.153c-1.007 0-1.902-.895-1.902-1.901v-8.503Z" fill="#007171"/><path d="M255.333 415.943c-.895 3.244-3.804 5.705-7.384 5.705-4.14 0-7.608-3.356-7.608-7.607 0-4.139 3.356-7.607 7.608-7.607 1.566 0 2.909.447 4.139 1.23.672.448 1.679.448 2.238-.112.895-.895.895-2.349-.112-3.02-1.79-1.119-3.916-1.902-6.265-1.902-6.265 0-11.412 5.146-11.412 11.411s5.147 11.411 11.412 11.411c6.265 0 11.412-5.146 11.412-11.411 0-1.007-.895-1.902-1.902-1.902h-7.608c-1.007 0-1.902.895-1.902 1.902s.895 1.902 1.902 1.902h5.482Z" fill="#007171"/><path d="M315.077 273.193c10.405 0 20.362-3.916 28.082-10.852 7.72-6.936 12.53-16.557 13.537-26.849 1.007-10.292-1.902-20.696-8.055-28.975-6.153-8.391-15.216-14.096-25.397-16.11-10.181-2.013-20.809-.223-29.648 5.146-8.95 5.37-15.551 13.761-18.46 23.717-3.02 9.957-2.237 20.697 2.238 29.982 4.475 9.398 12.195 16.781 21.816 20.697 4.923 2.125 10.405 3.244 15.887 3.244Z" fill="#007272"/><path d="M317.538 215.914c.111-.783.783-1.343 1.566-1.231 3.468.336 6.825 2.014 9.286 4.475 2.461 2.461 4.028 5.817 4.475 9.286.112.783-.447 1.454-1.231 1.566-.783.112-1.454-.448-1.566-1.231-.336-2.909-1.566-5.593-3.692-7.607a12.9 12.9 0 0 0-7.608-3.692c-.783-.112-1.342-.783-1.23-1.566Zm0 6.153c.111-.783.895-1.231 1.678-1.119 1.79.336 3.468 1.231 4.811 2.573 1.342 1.343 2.237 3.021 2.573 4.811.112.783-.336 1.454-1.119 1.678-.783.112-1.454-.336-1.678-1.119-.224-1.231-.895-2.461-1.79-3.356s-2.126-1.566-3.357-1.79c-.783-.224-1.23-.895-1.118-1.678Z" fill="#FFBE3C"/><path d="M326.824 249.476h-.447c-5.147-.559-10.181-2.237-14.545-4.922a33.107 33.107 0 0 1-10.069-9.621 31.17 31.17 0 0 1-5.146-13.984c-.112-.671 0-1.231.223-1.79.224-.56.56-1.119 1.007-1.566.448-.448 1.007-.784 1.567-1.119.559-.224 1.23-.448 1.902-.448h4.81c1.119 0 2.238.336 3.021 1.119a3.967 3.967 0 0 1 1.567 2.797 26.464 26.464 0 0 0 1.006 4.027c.336.783.336 1.678.224 2.462-.224.894-.671 1.566-1.23 2.237l-1.231 1.231c1.902 2.908 4.475 5.481 7.608 7.271l1.23-1.23c.672-.56 1.455-1.007 2.35-1.231a4.023 4.023 0 0 1 2.573.224c1.343.447 2.797.783 4.14 1.007 1.118.112 2.125.671 2.909 1.566.783.783 1.118 1.902 1.118 3.02v4.587c0 .671-.112 1.231-.335 1.79a3.642 3.642 0 0 1-1.119 1.455c-.448.447-1.007.783-1.678.895-.448.111-1.007.223-1.455.223Zm-20.698-30.653h-4.81c-.224 0-.448 0-.672.112-.223.112-.447.224-.559.448a.613.613 0 0 0-.336.559c-.112.224-.112.447-.112.671.448 4.475 2.126 8.95 4.699 12.754 2.35 3.58 5.483 6.6 9.175 8.838 4.027 2.461 8.502 4.027 13.201 4.474.224 0 .448 0 .672-.111l.671-.336c.224-.112.336-.336.447-.559.112-.224.336-.895.336-1.119v-4.139c0-.448-.336-.895-.559-1.231-.336-.336-.672-.559-1.119-.559-1.678-.224-3.245-.56-4.811-1.119-.336-.112-.671-.112-1.007-.112-.335.112-.671.224-.895.448l-2.014 1.901c-.447.448-1.119.56-1.678.224a27.443 27.443 0 0 1-10.181-9.733c-.336-.559-.224-1.23.224-1.678l2.014-1.902c.223-.223.335-.559.447-.783.112-.335.112-.671-.112-.895-.559-1.454-1.007-3.02-1.23-4.587-.112-.335-.224-.783-.56-1.006-.447-.448-.783-.56-1.231-.56Z" fill="#fff"/><path d="M315.972 372.758c9.398 0 18.461-3.468 25.509-9.844a38.627 38.627 0 0 0 12.307-24.389c.895-9.397-1.678-18.794-7.272-26.29-5.594-7.607-13.874-12.753-23.048-14.543-9.286-1.79-18.795-.112-26.851 4.699-8.055 4.81-14.097 12.529-16.782 21.591-2.685 9.062-2.014 18.683 2.014 27.185a37.79 37.79 0 0 0 19.803 18.795c4.363 1.79 9.286 2.796 14.32 2.796Z" fill="#007272"/><path d="M315.749 319.283c-3.021 0-5.818 1.23-8.056 3.356-2.125 2.237-3.58 5.146-3.58 8.279 0 2.013.895 5.034 2.126 7.383 1.119 2.349 2.685 4.811 4.251 6.936 1.567 2.126 3.133 4.028 4.252 5.37.335.448.671.783 1.007 1.119.335-.336.671-.671 1.006-1.119 1.119-1.342 2.686-3.244 4.252-5.37 1.566-2.125 3.133-4.587 4.251-6.936 1.119-2.461 2.126-5.37 2.126-7.383 0-3.133-1.454-6.153-3.58-8.279-2.238-2.237-5.035-3.356-8.055-3.356Zm0 34.792-.895-.335-.112-.112-.448-.448a22.904 22.904 0 0 1-1.454-1.566c-1.231-1.343-2.797-3.356-4.475-5.482-1.567-2.237-3.245-4.698-4.476-7.272-1.23-2.573-2.125-5.258-2.125-7.719 0-3.692 1.454-7.271 4.027-9.844 2.574-2.685 6.154-4.14 9.958-4.14 3.692 0 7.272 1.455 9.957 4.14 2.573 2.684 4.027 6.152 4.027 9.844 0 2.461-.895 5.146-2.125 7.719-1.231 2.574-2.909 5.147-4.475 7.272-1.567 2.238-3.245 4.139-4.476 5.482a22.904 22.904 0 0 1-1.454 1.566l-.448.448-.111.112-.895.335Zm0 0 .895-.335c-.224.223-.56.335-.895.335-.336 0-.672-.112-.895-.335l.895.335Z" fill="#fff"/><path d="M315.748 329.688c1.231 0 2.349-1.007 2.349-2.35 0-1.342-1.007-2.349-2.349-2.349-1.231 0-2.35 1.007-2.35 2.349 0 1.343 1.007 2.35 2.35 2.35Zm0 2.349c2.573 0 4.699-2.126 4.699-4.699s-2.126-4.698-4.699-4.698-4.699 2.125-4.699 4.698c0 2.573 2.126 4.699 4.699 4.699Z" fill="#FFBE3C"/><path d="M228.371 326.22a35.79 35.79 0 0 0 24.166-9.398 36.428 36.428 0 0 0 11.635-23.157c.895-8.95-1.566-17.788-6.937-25.06-5.37-7.16-13.201-12.082-21.928-13.872-8.726-1.79-17.901-.112-25.62 4.475-7.72 4.587-13.314 11.858-15.999 20.473-2.573 8.614-1.902 17.787 1.902 25.842s10.517 14.432 18.796 17.9a36.277 36.277 0 0 0 13.985 2.797Z" fill="#FFBE3C"/><path d="m223.783 287.289-1.454-.895-1.567-.895-3.356-1.902c-.448-.224-.895 0-1.119.336 0 .111-.112.223-.112.335v7.384c0 .447.448.783.895.783.112 0 .224 0 .336-.112l3.356-1.902 1.567-.895 1.454-.895c.336-.224.448-.783.224-1.119 0-.111-.112-.223-.224-.223Z" fill="#007272"/><path d="M219.644 271.402c-.671 0-1.231.559-1.231 1.231v4.81h13.202c2.014 0 3.58 1.566 3.58 3.58v7.16h7.16c.672 0 1.231-.559 1.231-1.231v-14.319c0-.672-.559-1.231-1.231-1.231h-22.711Zm15.551 19.13v3.58c0 2.349-.559 4.811-3.58 4.811H223l-11.747 7.048v-7.048h-2.35c-2.013 0-3.58-1.567-3.58-3.58v-14.32c0-2.014 1.567-3.58 3.58-3.58h7.161v-4.81c0-2.014 1.566-3.58 3.58-3.58h22.711c2.014 0 3.58 1.566 3.58 3.58v13.201h1.231c2.014 0 3.58 1.566 3.58 3.58v14.319c0 2.014-1.566 3.58-3.58 3.58h-2.349v6.824l-12.307-6.824h-7.496c-2.014 0-3.021-1.566-3.021-3.58v-.559l2.35-1.79v2.349c0 .671.559 1.231 1.23 1.231h7.496l9.286 5.146v-5.146h4.811c.671 0 1.231-.56 1.231-1.231v-14.319c0-.672-.56-1.231-1.231-1.231h-1.454c-.448 1.342-1.79 2.349-3.357 2.349h-7.16Zm-26.292-10.74c-.671 0-1.23.56-1.23 1.231v14.32c0 .671.559 1.23 1.23 1.23h4.811v4.923l8.615-4.923h9.398c1.23 0 1.23-.559 1.23-2.349v-13.201c0-.671-.559-1.231-1.23-1.231h-22.824Z" fill="#272727"/><path d="M240.006 297.133c0 1.007-.783 1.79-1.79 1.79a1.767 1.767 0 0 1-1.79-1.79c0-1.007.783-1.79 1.79-1.79 1.007 0 1.79.783 1.79 1.79Zm4.811 0c0 1.007-.783 1.79-1.79 1.79a1.767 1.767 0 0 1-1.79-1.79c0-1.007.783-1.79 1.79-1.79 1.007 0 1.79.783 1.79 1.79Z" fill="#007272"/><path d="M101.5 59.627c8.279-12.977 25.508-16.445 38.486-7.607 12.978 8.838 16.67 26.625 8.391 39.603-8.279 12.977-25.508 16.445-38.486 7.607-12.978-8.838-16.67-26.626-8.391-39.603Zm9.845 6.712c-4.811 7.608-2.685 17.9 4.923 23.046 7.496 5.146 17.565 3.132 22.376-4.363 4.811-7.607 2.685-17.9-4.923-23.046-7.496-5.258-17.565-3.244-22.376 4.363Zm125.753 131.003-.224 31.772c0 3.804-3.133 6.712-6.937 6.601-3.803-.112-6.936-3.357-6.824-7.16l.224-32.108c4.363 1.455 9.062 1.566 13.761.895Z" fill="#F1F1F1"/><path d="M216.96 187.497c.111-7.272 6.041-12.865 13.313-12.53 7.272.336 13.202 6.377 13.202 13.649 0 7.272-6.041 12.865-13.314 12.53-7.384-.224-13.313-6.377-13.201-13.649Zm5.482.224c0 4.251 3.356 7.719 7.607 7.943 4.252.224 7.72-3.133 7.832-7.272.112-4.139-3.356-7.719-7.608-7.943-4.251-.112-7.719 3.133-7.831 7.272Zm4.81 67.459 4.475.112.112-22.822-4.475-.224-.112 22.934Z" fill="#F1F1F1"/><path d="m223.784 120.263.336 55.712 11.076.336-.336-55.713-11.076-.335Zm-77.309-28.081 72.498 26.178 5.147-15.55-72.61-26.178-5.035 15.55Z" fill="#F1F1F1"/><path d="M234.967 129.849c7.494-3.217 10.864-12.13 7.525-19.908-3.339-7.778-12.121-11.476-19.616-8.259-7.494 3.216-10.863 12.129-7.525 19.907 3.339 7.779 12.121 11.476 19.616 8.26ZM101.947 0l6.377 53.363 31.662-.335L145.916 0h-43.969Z" fill="#F1F1F1"/><path d="M108.212 222.515h51.241c.895 0 1.678-.224 2.461-.56.784-.447 1.455-1.006 1.902-1.678.56-.671.784-1.566 1.007-2.349.112-.895 0-1.678-.223-2.573-1.343-3.58-3.692-6.6-6.713-8.838-3.133-2.237-6.713-3.356-10.517-3.468-2.685 0-5.258.559-7.719 1.678-1.343-5.705-4.699-10.74-9.51-14.096s-10.629-4.922-16.446-4.251c-5.818.671-11.188 3.356-15.104 7.719-3.916 4.363-6.153 9.957-6.153 15.774-.112 12.642 9.509 12.642 15.774 12.642Z" fill="#fff"/><path d="M128.574 256.861c27.187 0 49.227-22.038 49.227-49.224 0-27.186-22.04-49.224-49.227-49.224-27.187 0-49.227 22.038-49.227 49.224 0 27.186 22.04 49.224 49.227 49.224Z" stroke="#13374C" stroke-miterlimit="10"/><path d="M128.462 274.536c36.95 0 66.904-29.952 66.904-66.9 0-36.948-29.954-66.9-66.904-66.9-36.95 0-66.904 29.952-66.904 66.9 0 36.948 29.954 66.9 66.904 66.9Z" stroke="#13374C" stroke-miterlimit="10"/><path d="M71.068 180.227a7.943 7.943 0 1 0 0-15.886 7.943 7.943 0 1 0 0 15.886Z" fill="#E63453"/><path d="M83.822 234.149a5.482 5.482 0 1 0 0-10.964 5.482 5.482 0 0 0 0 10.964Z" fill="#009589"/><path d="M153.747 257.979a7.944 7.944 0 1 0 0-15.888 7.944 7.944 0 0 0 0 15.888Z" fill="#FABB3E"/><g opacity=".15" stroke="#fff" stroke-miterlimit="10"><path opacity=".15" d="M341.817 554.439c17.733 0 32.109-14.375 32.109-32.107s-14.376-32.107-32.109-32.107c-17.734 0-32.11 14.375-32.11 32.107s14.376 32.107 32.11 32.107Z"/><path opacity=".15" d="M341.817 571.781c27.187 0 49.226-22.039 49.226-49.224 0-27.186-22.039-49.224-49.226-49.224-27.188 0-49.227 22.038-49.227 49.224 0 27.185 22.039 49.224 49.227 49.224Z"/><path opacity=".15" d="M341.816 589.344c36.95 0 66.904-29.952 66.904-66.899 0-36.948-29.954-66.9-66.904-66.9-36.95 0-66.903 29.952-66.903 66.9 0 36.947 29.953 66.899 66.903 66.899Z"/></g><path d="M284.31 495.148a7.944 7.944 0 1 0 0-15.888 7.944 7.944 0 0 0 0 15.888Zm82.792 77.751a7.943 7.943 0 1 0 0-15.887 7.943 7.943 0 0 0 0 15.887Z" fill="#009589"/><path d="M383.548 503.313a6.824 6.824 0 1 0 0-13.648 6.825 6.825 0 1 0 0 13.648Z" fill="#E63453"/><path d="M339.691 513.383v-2.909c0-.447.224-1.007.671-1.342a2.747 2.747 0 0 1 1.678-.56c.672 0 1.231.224 1.679.56.447.335.671.783.671 1.342v2.685c.895.336 1.79.783 2.573 1.454.224.224.448.56.56.783.111.336.111.672.111 1.007 0 .336-.223.672-.447.895a4.904 4.904 0 0 1-.783.672 2.99 2.99 0 0 1-1.343.335c-.447 0-1.342-.335-1.342-.335s-1.455-.224-2.014-.224c-.783 0-1.678.224-1.678.895s.671 1.23 3.132 1.902c2.797.783 5.93 1.79 5.93 5.481 0 2.909-1.79 4.699-4.587 5.258v3.021c0 .447-.224 1.007-.671 1.342a2.748 2.748 0 0 1-1.679.56c-.671 0-1.23-.224-1.678-.56a1.595 1.595 0 0 1-.671-1.342v-2.909c-1.455-.335-2.685-1.007-3.804-1.902a3.343 3.343 0 0 1-.559-.783c-.112-.335-.112-.671-.112-1.007 0-.335.112-.671.335-.895.224-.335.448-.559.672-.671.447-.224 1.118-.335 1.678-.335.559.111 1.007.335 1.342.671.336.335.784.559 1.231.783.448.112 1.007.224 1.454.224 1.679 0 2.238-.56 2.238-1.231 0-1.007-1.119-1.23-3.356-1.902-.112 0-.112 0-.224-.112-2.909-.783-5.482-2.237-5.482-5.481 0-.783.224-1.567.559-2.238.336-.671.783-1.342 1.455-1.79.559-.559 1.342-.895 2.125-1.118 0-.224.112-.224.336-.224Z" fill="#FABB3E"/><path d="M321.231 522.444c0-11.411 9.286-20.696 20.698-20.696 11.188 0 20.474 9.062 20.698 20.696 0 11.411-9.286 20.697-20.698 20.697s-20.698-9.286-20.698-20.697Zm4.476-.223a16.282 16.282 0 0 0 16.334 16.333c8.838-.224 16.111-7.272 16.334-16.333a16.282 16.282 0 0 0-16.334-16.334 16.282 16.282 0 0 0-16.334 16.334Z" fill="#FABB3E"/><path d="m463.317 501.634-33.675 298.364h101.027l-35.69-298.699-31.662.335Zm-88.16-44.411-16.335 23.828c-1.902 2.797-1.118 6.713 1.79 8.503 2.909 1.79 6.937 1.119 8.839-1.79l16.446-24.165c-4.027-1.118-7.608-3.468-10.74-6.376Z" fill="#F1F1F1"/><path d="M378.401 463.71c-5.594-3.58-7.16-10.851-3.468-16.333 3.692-5.482 11.3-6.936 16.894-3.356 5.594 3.58 7.16 10.851 3.468 16.333-3.692 5.37-11.3 6.824-16.894 3.356Zm10.517-15.662c-3.244-2.126-7.72-1.231-9.845 2.014-2.126 3.132-1.231 7.383 2.014 9.509 3.244 2.125 7.719 1.231 9.845-2.014 2.126-3.244 1.342-7.383-2.014-9.509Zm76.19 55.713c-12.083-7.607-15.44-23.269-7.496-34.904 7.943-11.635 24.166-14.879 36.137-7.272 11.971 7.608 15.439 23.27 7.496 34.904-7.944 11.747-24.166 14.991-36.137 7.272Zm22.711-33.338c-7.048-4.475-16.446-2.573-21.033 4.251-4.587 6.713-2.685 15.886 4.363 20.361 7.049 4.475 16.446 2.573 21.033-4.251 4.588-6.712 2.574-15.886-4.363-20.361Zm-135.262 35.128-3.468-2.125 11.747-17.229 3.468 2.126-11.747 17.228Z" fill="#F1F1F1"/><path d="m424.943 406.321-29.089 41.616-8.391-5.482 29.089-41.616 8.391 5.482Zm39.158 61.082-39.83-57.95 12.531-8.055 39.829 57.95-12.53 8.055Z" fill="#F1F1F1"/><path d="M424.718 410.795c7.724 0 13.985-6.061 13.985-13.537 0-7.476-6.261-13.536-13.985-13.536-7.723 0-13.985 6.06-13.985 13.536s6.262 13.537 13.985 13.537Z" fill="#F1F1F1"/><path d="M228.26 635.212c5.146-2.685 9.286-7.048 11.635-12.418 2.35-5.37 2.909-11.299 1.567-17.005-1.455-5.705-4.699-10.739-9.286-14.319s-10.293-5.594-16.111-5.594c-5.818 0-11.523 1.902-16.111 5.594-4.587 3.58-7.831 8.614-9.286 14.319-1.342 5.706-.895 11.635 1.567 17.005 2.349 5.37 6.489 9.733 11.635 12.418-6.489 68.913-37.367 158.971-39.269 164.564h18.124c4.811-7.272 15.216-18.459 33.34-18.459 18.125 0 28.529 11.299 33.34 18.459h18.125c-1.902-5.593-32.893-95.875-39.27-164.564Zm-12.195-33.338c2.35 0 4.699.895 6.601 2.349 1.79 1.566 3.133 3.692 3.58 6.041.448 2.349.112 4.811-1.007 6.936-1.119 2.126-3.021 3.804-5.146 4.699-2.238.895-4.699 1.007-6.937.336a10.325 10.325 0 0 1-5.594-4.14 10.267 10.267 0 0 1-1.678-6.712c.224-2.349 1.343-4.587 3.021-6.265a8.678 8.678 0 0 1 7.16-3.244Zm7.384 112.208h-14.544c-.336 0-.671-.112-.895-.224a2.193 2.193 0 0 1-1.007-1.007c-.224-.447-.224-.895-.112-1.342a621.264 621.264 0 0 0 7.496-35.576c.112-.447.336-.783.671-1.118.336-.224.783-.448 1.119-.448.447 0 .783.112 1.119.448.335.223.559.671.671 1.118 2.014 11.188 4.587 23.046 7.496 35.576.112.335.112.671 0 .895a3.363 3.363 0 0 1-.448.895c-.223.223-.447.447-.783.559-.223.112-.559.224-.783.224Zm16.335 56.495c-7.385-3.468-15.552-5.258-23.719-5.258-8.167 0-16.222 1.79-23.718 5.258-.112.112-.336.112-.56.112-.223 0-.335-.112-.447-.223a1.546 1.546 0 0 1-.336-.448v-.559c2.909-9.509 6.042-20.473 9.174-32.331.448-1.902 1.007-3.692 1.455-5.594.112-.448.335-.895.783-1.119.335-.335.783-.447 1.23-.447h24.614c.447 0 .895.112 1.231.447.335.336.671.671.783 1.119.447 1.79.895 3.58 1.454 5.37 3.133 11.858 6.377 22.934 9.174 32.443v.559c0 .112-.112.336-.335.448-.112.112-.336.223-.448.223 0 .112-.112.112-.335 0Z" fill="#007072"/><path d="m288.116 797.65-15.104-44.749c-.112-.336-.335-.559-.559-.783-.224-.224-.56-.336-.895-.336-.336 0-.671.112-.895.336-.224.224-.448.447-.56.783l-11.859 35.016-7.16-21.256c-.112-.335-.336-.559-.56-.783-.223-.224-.559-.335-.895-.335-.335 0-.671.111-.895.335-.223.224-.447.448-.559.783l-9.957 29.535-7.161-21.256c-.112-.336-.335-.56-.559-.783-.224-.224-.56-.336-.895-.336-.336 0-.671.112-.895.336-.224.223-.448.447-.56.783l-7.607 22.598c-.112.224-.112.448-.112.783 0 .224.112.448.335.671.112.224.336.336.56.448.224.112.447.224.783.224h64.89c.224 0 .448-.112.671-.224.224-.112.448-.224.56-.448.112-.223.224-.447.224-.671-.224-.224-.224-.447-.336-.671Zm-97.56 0-15.103-44.749c-.112-.336-.336-.559-.56-.783-.223-.224-.559-.336-.895-.336-.335 0-.671.112-.895.336-.224.224-.447.447-.559.783l-11.076 32.891-6.489-19.243c-.112-.335-.336-.559-.56-.783-.223-.223-.559-.335-.895-.335-.335 0-.671.112-.895.335-.223.224-.447.448-.559.783l-10.405 30.989c-.112.224-.112.448-.112.783 0 .224.112.448.336.671.112.224.336.336.559.448.224.112.448.224.783.224h46.095c.223 0 .559 0 .783-.112.336-.224.559-.448.783-.783-.224-.336-.224-.783-.336-1.119Z" fill="#009589"/><path d="M216.064 562.046c-27.634 0-50.122 22.486-50.122 50.007 0 7.719 1.79 15.438 5.259 22.374 3.468 6.936 8.503 12.978 14.768 17.564.335.224.783.448 1.23.448.336 0 .672-.112 1.007-.224.224-.112.56-.335.672-.559.223-.224.335-.56.447-.783a.954.954 0 0 0 0-.783c0-.224-.112-.56-.224-.784-.111-.223-.335-.447-.559-.671-5.706-4.251-10.293-9.733-13.426-16.109-3.132-6.377-4.81-13.313-4.81-20.473 0-25.171 20.585-45.756 45.87-45.756 25.285 0 45.871 20.585 45.871 45.756 0 7.048-1.567 14.096-4.811 20.473-3.133 6.376-7.832 11.858-13.426 16.109a1.15 1.15 0 0 0-.559.671c-.112.224-.224.56-.224.784v.783c.112.335.224.559.448.783.224.224.447.447.671.559.336.112.671.224 1.007.224.448 0 .895-.112 1.231-.448 6.265-4.586 11.299-10.628 14.768-17.564 3.468-6.936 5.258-14.655 5.258-22.374-.224-27.521-22.711-49.895-50.346-50.007Z" fill="#FFBE3C"/><path d="M216.065 535.645c-41.62 0-75.519 33.785-75.519 75.402a74.51 74.51 0 0 0 11.971 40.497c7.72 12.083 18.796 21.704 31.774 27.857.224.111.559.223.783.223.224 0 .559 0 .783-.111.224-.112.559-.224.671-.448.224-.224.336-.447.448-.671.112-.224.224-.56.224-.783 0-.224 0-.56-.112-.783-.112-.224-.224-.56-.448-.672-.224-.223-.447-.335-.671-.447-12.307-5.706-22.712-14.879-29.984-26.29-7.272-11.411-11.188-24.724-11.3-38.261 0-39.155 31.886-71.039 71.156-71.15 39.269 0 71.155 31.883 71.155 71.15a70.486 70.486 0 0 1-11.3 38.261c-7.272 11.411-17.677 20.584-29.983 26.29-.224.112-.448.335-.672.447-.223.224-.335.448-.447.672-.112.223-.112.559-.112.783 0 .223.112.559.224.783.112.224.335.447.447.671.224.224.448.336.671.448.224.111.56.111.784.111.223 0 .559-.112.783-.223 12.978-6.041 24.054-15.662 31.774-27.857 7.719-12.082 11.859-26.178 11.971-40.497.335-41.505-33.452-75.291-75.071-75.402Z" fill="#FFBE3C"/><path d="m44.442 759.167-.448-10.404c-.224-4.363 1.79-8.39 5.258-10.963l20.922-15.439-20.922-24.5-33.116 28.192 28.306 33.114Z" fill="#F29F68"/><path d="m55.07 784.785-6.825-9.061c-2.573-3.357-3.58-7.608-3.02-11.747l1.79-12.194c1.454-10.404-5.37-14.544-15.552-15.662h-.447c-.672 0-1.231-.56-1.343-1.343-.447-4.81-2.35-9.621-5.706-13.536-.56-.672-1.566-.672-2.125-.224L.584 739.253c-.67.559-.67 1.566-.223 2.126l13.425 18.682c.56.672 1.567.672 2.126.224l1.566-1.342c1.007-.895 2.685-.112 2.573 1.342l-.111 1.902c-.448 5.594 1.342 11.075 4.922 15.438l16.11 18.795c3.245 3.804 9.063 4.251 12.979 1.007 3.58-3.245 4.028-8.726 1.119-12.642Z" fill="#fff"/><path d="M62.453 532.401s72.834-17.564 72.834-9.173c0 1.118.335 2.237 1.007 3.132 7.272 10.18 52.024 72.717 52.024 72.717s.559.783 1.566 2.126c14.88 20.808 10.74 49.671-9.398 65.445l-97 74.507c-2.908 2.35-7.272 1.678-9.621-1.23l-28.641-36.471c-2.35-3.02-1.902-7.272 1.007-9.621l85.699-65.557-69.477-95.875Z" fill="#A8D7E1"/><path d="m110.114 772.702-8.167-6.376c-3.357-2.685-5.259-6.825-4.923-11.076l1.79-25.954H66.593v43.406h43.521Z" fill="#F29F68"/><path d="m136.519 781.317-11.3-.783c-4.252-.224-8.056-2.237-10.964-5.37l-8.168-9.285c-6.936-7.943-14.544-5.37-22.04 1.678l-.224.224-.111.112c-.448.447-1.231.559-1.902.111-4.028-2.796-8.839-4.474-14.097-4.474-.895 0-1.566.671-1.566 1.566v33.002c0 .895.67 1.566 1.566 1.566h22.935c.895 0 1.566-.671 1.566-1.566v-5.034c0-1.343 1.679-2.014 2.686-1.119l1.342 1.343a20.735 20.735 0 0 0 14.88 6.265h24.725c5.035 0 9.174-4.14 9.174-9.174.224-4.811-3.58-8.726-8.502-9.062Z" fill="#fff"/><path d="m65.81 512.264 58.29-.111.112.223c.112.224 8.95 25.06 8.95 36.023 0 22.151-81.672 40.162-81.672 40.162s-.336-24.835-.56-38.372c-.111-5.705.784-11.299 2.574-16.781 2.909-8.838 7.048-21.591 6.713-21.703" fill="#A8D7E1"/><path d="M111.234 546.162v189.512c0 3.468-3.133 6.264-6.936 6.264H57.979c-3.803 0-6.936-2.796-6.936-6.264V546.05l60.191.112Z" fill="#A8D7E1"/><path d="M59.657 435.52c5.93-8.39 15.439-13.424 25.62-13.76 7.831-.224 15.439-.448 15.439-.448s-26.291 44.973-40.053 68.466c-4.475 7.72-14.32 10.293-22.04 5.818-3.916-2.238-6.713-6.153-7.72-10.628-1.006-4.475 0-9.062 2.574-12.865 7.831-10.964 18.572-25.955 26.18-36.583Z" fill="#F29F68"/><path d="m210.246 537.771-12.642 1.007c-1.119.112-1.343 1.566-.448 2.126l8.503 4.922c1.231.671 1.79 2.126 1.343 3.58-.56 1.566-2.126 2.349-3.692 1.902l-17.677-5.146c-1.119-.336-2.35-.783-3.469-1.455-5.929-3.02-10.628-7.943-13.201-14.096-1.567-3.691-3.133-7.271-3.133-7.271l18.572-7.384s2.014 4.922 3.356 8.279c.784 1.79 2.462 3.132 4.476 3.244 0 0 .671.112 1.678.112 2.349.224 4.587 0 6.824-.56 4.14-1.006 8.615-1.118 12.755-.111 3.02.783 6.377 1.454 7.384 1.566 1.342.112 2.573 1.007 3.021 2.237l2.013.224c1.567.224 2.797 1.454 2.909 3.021 0 .671-.224 1.454-.671 2.013a2.389 2.389 0 0 1-1.902.895h-.559l2.573 3.021c1.007 1.23 1.119 2.908.112 4.251-.448.559-1.119.895-1.79 1.007-.672.112-1.455-.112-2.014-.56-2.573-2.013-6.937-4.922-9.174-6.376-1.119.223-1.902.335-1.902.335s-1.678-.223-3.245-.783Z" fill="#F29F68"/><path d="M89.193 372.76c17.677-4.699 35.801 5.705 40.5 23.381 4.699 17.676-5.706 35.799-23.383 40.498-17.677 4.699-35.801-5.706-40.5-23.381-4.699-17.676 5.706-35.8 23.383-40.498Z" fill="#FFD13F"/><path d="M125.442 393.456a15.566 15.566 0 0 1 19.131 11.076 15.565 15.565 0 0 1-11.076 19.13 15.566 15.566 0 0 1-19.131-11.075c-2.238-8.279 2.797-16.893 11.076-19.131Z" fill="#FFD13F"/><path d="M161.131 450.4c-3.132-8.838-12.754-13.649-21.704-10.852-5.035 1.566-9.062 5.482-10.964 10.404-1.902 4.922-1.455 10.516 1.23 15.103 10.405 17.676 26.068 44.525 38.711 66.005 2.349 4.027 7.16 5.929 11.635 4.698 4.475-1.23 7.496-5.37 7.384-10.068 0-.448-.112-1.007-.224-1.455-2.125-6.041-17.565-49.671-26.068-73.835Z" fill="#F29F68"/><path d="M155.426 433.841c-3.133-8.838-11.524-14.879-20.921-14.879H79.908a16.225 16.225 0 0 0-13.202 6.824 79720.45 79720.45 0 0 0-27.97 38.932l29.983-.559-12.53 60.747h79.434V475.01l3.581 5.93 28.305-12.866c-.112 0-7.048-19.801-12.083-34.233Z" fill="#009589"/><path d="M142.336 364.928c-2.574-7.943-9.398-13.537-17.677-14.655-10.964-1.455-21.145 5.593-23.719 16.333l-4.14 17.34c-1.454 5.93-.223 12.194 3.245 17.229 3.469 5.034 8.839 8.278 14.88 9.061 1.678.224 3.357.224 4.923.112 8.95-.895 16.558-7.271 18.684-16.445l4.139-17.34c1.119-3.916.895-7.943-.335-11.635Z" fill="#F29F68"/><path d="M129.47 398.603c-.672.112-1.343.112-1.902 0-2.238-.223-4.364-1.454-5.706-3.132-.336-.448-.336-1.007.112-1.454.447-.336 1.007-.336 1.454.111a6.913 6.913 0 0 0 4.475 2.462 6.664 6.664 0 0 0 4.923-1.343c.447-.335 1.119-.224 1.454.224.336.447.224 1.119-.223 1.454-1.455 1.007-3.021 1.566-4.587 1.678Z" fill="#894A14"/><path d="M142.336 364.816c-2.573-7.942-9.398-13.536-17.677-14.655-11.412-1.454-22.6 5.706-25.06 15.998l-5.147 21.256c-1.007 4.363-1.343 10.963-.672 16.892.784 7.048 2.686 12.194 5.483 14.432l.335.335 7.049-36.582h-.336c-1.678-.223-3.133-1.007-4.14-2.349-.895-1.343-1.23-3.021-.895-4.699.895-4.363 5.482-5.593 14.88-4.251 14.88 2.126 24.278 1.455 26.18-6.377.112.112.112 0 0 0Z" fill="#FFD13F"/><path d="M126.448 418.962c-.783 0-1.566-.112-2.237-.336-1.79-.559-3.133-2.125-3.468-4.027a4.94 4.94 0 0 1 2.349-4.811c.224-.112.559-.335.783-.335l.224-.112-8.279-29.087-9.846 6.153s-3.468 16.445-5.482 25.954c-.783 3.804-4.14 6.601-8.055 6.601h-1.79l17.006 12.306s14.208-8.503 18.907-11.411c.224-.112.336-.336.224-.56.112-.223-.112-.335-.336-.335Z" fill="#F29F68"/><path d="M89.192 418.962v.336c0 11.299 9.063 20.584 20.251 20.584 11.187 0 20.25-9.173 20.25-20.584v-.336h-40.5Z" fill="#F29F68"/><path d="M108.548 379.024c.671-.112 1.231.448 1.231 1.007.112.671-.448 1.231-1.007 1.231-.672.111-1.231-.448-1.231-1.007-.112-.56.336-1.231 1.007-1.231Z" fill="#fff"/><path d="M176.011 541.128c-2.35-1.567-4.252-3.692-5.594-6.042-2.573-4.474-6.713-11.746-6.713-11.746l40.389 13.536s-3.469.224-6.042.336c-.783 0-1.566.671-1.79 1.454-.224.784.112 1.678.783 2.126l.112.112 8.503 4.922c1.231.671 1.79 2.126 1.342 3.58-.559 1.566-2.125 2.349-3.692 1.902l-17.677-5.146c-3.132-1.007-6.936-3.244-9.621-5.034ZM165.83 448.05v-.112c-.559-1.343-1.902-2.126-3.356-1.79 0 0-20.474 4.363-24.614 5.258-.559.112-1.119.112-1.678-.112-.783-.336-2.238-.783-5.594-1.231-3.58-.559-6.937 3.021-8.503 5.258-1.454 2.126-3.468 3.692-5.93 4.028-1.454.112-2.685.224-2.685.224-.223 0-.335 0-.559.111l-30.431 2.797-23.942 2.461c-4.7.448-8.839 2.909-11.524 6.713a15.12 15.12 0 0 0-2.126 13.089c1.12 4.139 3.916 7.607 7.832 9.621 3.804 2.014 8.279 2.349 12.418 1.007l30.655-9.957c.224 0 .336-.112.56-.112 0 0 15.775-4.922 24.39-7.495.111 0 .223 0 .335-.112 2.238-.671 5.482-.336 7.832-.112 2.125.224 4.699.336 6.489.112 4.363-.56 16.334-4.699 16.334-4.699h.112c1.231-.335 2.126-1.342 2.238-2.685.111-1.342-.672-2.461-1.79-3.02 1.23-.336 2.125-1.343 2.237-2.685a3.074 3.074 0 0 0-2.014-3.133 2.97 2.97 0 0 0 2.462-2.685c.112-1.566-.895-2.908-2.35-3.244l9.846-3.02c.223-.112.559-.224.783-.336l.895-.224c.783-.224 1.454-.783 1.79-1.454.112-.895.112-1.678-.112-2.461Z" fill="#F29F68"/><path d="M51.154 498.616c10.751 0 19.467-5.76 19.467-12.865s-8.716-12.865-19.467-12.865-19.467 5.76-19.467 12.865 8.716 12.865 19.467 12.865Z" fill="#F29F68"/></svg>';
+defineCustomElement('sinch-illustration-5g', createIllustrationClass(templateHTML));

package/illustrations/about-page/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchIllustrationElement, TSinchIllustrationReact } from '../types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-illustration-about-page': TSinchIllustrationReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-illustration-about-page': TSinchIllustrationElement;
+    }
+}