/** * @license * Copyright (c) 2017 The Polymer Project Authors. All rights reserved. * This code may only be used under the BSD style license found at * http://polymer.github.io/LICENSE.txt * The complete set of authors may be found at * http://polymer.github.io/AUTHORS.txt * The complete set of contributors may be found at * http://polymer.github.io/CONTRIBUTORS.txt * Code distributed by Google as part of the polymer project is also * subject to an additional IP rights grant found at * http://polymer.github.io/PATENTS.txt */ import { PropertyDeclaration } from './updating-element.js'; export declare type Constructor = { new (...args: any[]): T; }; interface ClassDescriptor { kind: 'class'; elements: ClassElement[]; finisher?: (clazz: Constructor) => undefined | Constructor; } interface ClassElement { kind: 'field' | 'method'; key: PropertyKey; placement: 'static' | 'prototype' | 'own'; initializer?: Function; extras?: ClassElement[]; finisher?: (clazz: Constructor) => undefined | Constructor; descriptor?: PropertyDescriptor; } /** * 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 | ClassDescriptor) => any; /** * A property decorator which creates a LitElement property which reflects a * corresponding attribute value. A [[`PropertyDeclaration`]] may optionally be * supplied to configure property features. * * This decorator should only be used for public fields. Private or protected * fields should use the [[`internalProperty`]] decorator. * * @example * ```ts * class MyElement { * @property({ type: Boolean }) * clicked = false; * } * ``` * @category Decorator * @ExportDecoratedItems */ export declare function property(options?: PropertyDeclaration): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any; export interface InternalPropertyDeclaration { /** * A function that indicates if a property should be considered changed when * it is set. The function should take the `newValue` and `oldValue` and * return `true` if an update should be requested. */ hasChanged?(value: Type, oldValue: Type): boolean; } /** * Declares a private or protected property that still triggers updates to the * element when it changes. * * Properties declared this way must not be used from HTML or HTML templating * systems, they're solely for properties internal to the element. These * properties may be renamed by optimization tools like the Closure Compiler. * @category Decorator * @deprecated `internalProperty` has been renamed to `state` in lit-element * 3.0. Please update to `state` now to be compatible with 3.0. */ export declare function internalProperty(options?: InternalPropertyDeclaration): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any; /** * Declares a private or protected property that still triggers updates to the * element when it changes. * * Properties declared this way must not be used from HTML or HTML templating * systems, they're solely for properties internal to the element. These * properties may be renamed by optimization tools like the Closure Compiler. * @category Decorator */ export declare const state: (options?: InternalPropertyDeclaration | undefined) => (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any; /** * A property decorator that converts a class property into a getter that * executes a querySelector on the element's renderRoot. * * @param selector A DOMString containing one or more selectors to match. * @param cache An optional boolean which when true performs the DOM query only * once and caches the result. * * See: https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector * * @example * * ```ts * class MyElement { * @query('#first') * first; * * render() { * return html` *
*
* `; * } * } * ``` * @category Decorator */ export declare function query(selector: string, cache?: boolean): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any; /** * A property decorator that converts a class property into a getter that * returns a promise that resolves to the result of a querySelector on the * element's renderRoot done after the element's `updateComplete` promise * resolves. When the queried property may change with element state, this * decorator can be used instead of requiring users to await the * `updateComplete` before accessing the property. * * @param selector A DOMString containing one or more selectors to match. * * See: https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector * * @example * ```ts * class MyElement { * @queryAsync('#first') * first; * * render() { * return html` *
*
* `; * } * } * * // external usage * async doSomethingWithFirst() { * (await aMyElement.first).doSomething(); * } * ``` * @category Decorator */ export declare function queryAsync(selector: string): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any; /** * A property decorator that converts a class property into a getter * that executes a querySelectorAll on the element's renderRoot. * * @param selector A DOMString containing one or more selectors to match. * * See: * https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelectorAll * * @example * ```ts * class MyElement { * @queryAll('div') * divs; * * render() { * return html` *
*
* `; * } * } * ``` * @category Decorator */ export declare function queryAll(selector: string): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any; /** * Adds event listener options to a method used as an event listener in a * lit-html template. * * @param options An object that specifies event listener options as accepted by * `EventTarget#addEventListener` and `EventTarget#removeEventListener`. * * Current browsers support the `capture`, `passive`, and `once` options. See: * https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#Parameters * * @example * ```ts * class MyElement { * clicked = false; * * render() { * return html` *
* *
* `; * } * * @eventOptions({capture: true}) * _onClick(e) { * this.clicked = true; * } * } * ``` * @category Decorator */ export declare function eventOptions(options: AddEventListenerOptions): any; /** * A property decorator that converts a class property into a getter that * returns the `assignedNodes` of the given named `slot`. Note, the type of * this property should be annotated as `NodeListOf`. * * @param slotName A string name of the slot. * @param flatten A boolean which when true flattens the assigned nodes, * meaning any assigned nodes that are slot elements are replaced with their * assigned nodes. * @param selector A string which filters the results to elements that match * the given css selector. * * * @example * ```ts * class MyElement { * @queryAssignedNodes('list', true, '.item') * listItems; * * render() { * return html` * * `; * } * } * ``` * @category Decorator */ export declare function queryAssignedNodes(slotName?: string, flatten?: boolean, selector?: string): (protoOrDescriptor: Object | ClassElement, name?: PropertyKey | undefined) => any; export {}; //# sourceMappingURL=decorators.d.ts.map