@conectate/ct-lit/ct-lit.d.ts

Super class wrapper for lit

/**
 * @license
 * Copyright (c) Conectate Team. All rights reserved.
 * This code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */
import { LitElement } from "lit";
export type PropertyValues = Map<PropertyKey, any>;
export { css, html, svg, unsafeCSS } from "lit";
export { state as internalProperty, property, query, queryAll, queryAssignedNodes, queryAsync, state } from "lit/decorators.js";
export { unsafeHTML } from "lit/directives/unsafe-html.js";
export { until } from "lit/directives/until.js";
export { LitElement };
interface ClassDescriptor {
    kind: "class";
    elements: ClassElement[];
    finisher?: <T>(clazz: Constructor<T>) => undefined | Constructor<T>;
}
interface ClassElement {
    kind: "field" | "method";
    key: PropertyKey;
    placement: "static" | "prototype" | "own";
    initializer?: Function;
    extras?: ClassElement[];
    finisher?: <T>(clazz: Constructor<T>) => undefined | Constructor<T>;
    descriptor?: PropertyDescriptor;
}
export type Constructor<T> = {
    new (...args: any[]): T;
};
/**
 * Class decorator factory that defines the decorated class as a custom element.
 *
 * ```
 * @customElement('my-element')
 * class MyElement {
 *   render() {
 *     return html``;
 *   }
 * }
 * ```
 * @category Decorator
 * @param tagName The name of the custom element to define.
 */
export declare const customElement: (tagName: string) => (classOrDescriptor: Constructor<HTMLElement> | ClassDescriptor) => any;
/**
 * CtLit - A wrapper class for LitElement with additional utility methods
 *
 * This class extends LitElement and provides convenient utility methods
 * for common operations such as element selection, event dispatching,
 * and scrolling animations.
 */
export declare class CtLit extends LitElement {
    connectedCallback(): void;
    /**
     * Returns the first element that is a descendant of node that matches selectors.
     * @param name
     * @returns {HTMLElement | Element | undefined | null}
     */
    $$(name: string): HTMLElement | Element | undefined | null;
    /**
     * Returns all element descendants of node that match selectors.
     * @param name
     * @returns {NodeListOf<HTMLElement | Element> | undefined}
     */
    $$$(name: string): NodeListOf<HTMLElement | Element> | undefined;
    /**
     * Map all IDs for shadowRoot and save in `this.$` like a polymer element.
     * You should add in the first line of `firstUpdated()`
     * @deprecated
     */
    mapIDs(): void;
    /**
     * Clone all `native` types of object in a new object reference
     * @param ob Original Object
     */
    deepClone<T extends object>(ob: T): T;
    /**
     * Fire a event with name and value
     * @param name
     * @param value
     */
    fire(name: string, value: any): void;
    /**
     *
     * @param scrollTargetY pixels to scroll. Ej:
        const ticketsBlockPositionY = this.$.contact.getBoundingClientRect().top + window.scrollTarget.scrollTop;
     * @param time Time to scroll
     * @param easing
     * @param target scrollTarget Element
     */
    scrollToY(scrollTargetY?: number, time?: number, easing?: "easeInOutSine" | "easeOutSine" | "easeInOutQuint" | "easeInOutCubic", target?: Element): void;
}
/**
 * Conditional template rendering helper
 *
 * @param condition Boolean condition to evaluate
 * @param template The template to render if the condition is true
 * @returns The template if the condition is true, empty string otherwise
 *
 * @example
 * ```ts
 * render() {
 *   return html`
 *     ${If(this.isVisible, html`<div>Conditional content</div>`)}
 *   `;
 * }
 * ```
 */
export declare function If(condition: boolean, template: any): any;