/** * Supported property type constructors for reactive properties. * These constructors are used to convert attribute values to the correct JavaScript type. * * @typedef {StringConstructor | NumberConstructor | BooleanConstructor | ObjectConstructor | ArrayConstructor} PropertyType */ type PropertyType = StringConstructor | NumberConstructor | BooleanConstructor | ObjectConstructor | ArrayConstructor; /** * Legacy string-based property types (deprecated). * Maintained for backward compatibility. Use PropertyType constructors instead. * * @typedef {('string' | 'number' | 'boolean' | 'object' | 'array')} oldPropertyType * @deprecated Use PropertyType constructors (String, Number, Boolean, Object, Array) instead */ type oldPropertyType = "string" | "number" | "boolean" | "object" | "array"; /** * Configuration options for the @property decorator. * Defines how a property should sync with HTML attributes and trigger updates. * * @interface PropertyOptions * * @example * ```typescript * @property({ type: String, reflect: true }) * name = 'default'; * * @property({ type: Number, attribute: 'data-count' }) * count = 0; * * @property({ type: Boolean }) * active = false; * ``` */ export interface PropertyOptions { /** * The type constructor for converting attribute values to property values. * Use String, Number, Boolean, Object, or Array. * @type {PropertyType | oldPropertyType} */ type?: PropertyType | oldPropertyType; /** * The HTML attribute name to sync with, or false to disable attribute syncing. * - `true` (default): Use kebab-case version of property name * - `string`: Use specific attribute name * - `false`: No attribute syncing * @type {string | boolean} */ attribute?: string | boolean; /** * Whether to reflect property changes back to the HTML attribute. * When true, setting the property will update the attribute. * @type {boolean} * @default false */ reflect?: boolean; readonly?: boolean; /** * Custom converter for complex attribute/property transformations. * @type {AttributeConverter} */ converter?: AttributeConverter; } /** * PropertyOptions extended with the property name. * Used internally to track registered properties. * * @typedef {PropertyOptions & { name: string }} PropertyOptionsWithName */ export type PropertyOptionsWithName = PropertyOptions & { name: string; }; /** * Checks if an element is currently updating its attributes from property setters. * Used to prevent circular updates during property reflection. * * @param {HTMLElement} element - The element to check * @returns {boolean} True if the element is currently setting attributes * * @example * ```typescript * if (!isSettingAttribute(this)) { * // Safe to update property from attribute * } * ``` */ export declare function isSettingAttribute(element: HTMLElement): boolean; /** * Process any pending update callbacks for an element. * Should be called when the element connects to the DOM to trigger * deferred lifecycle callbacks. * * @param {any} element - The element with pending updates * @returns {void} * * @example * ```typescript * connectedCallback() { * processPendingUpdates(this); * } * ``` */ export declare function processPendingUpdates(element: any): void; /** * Interface for custom attribute conversion functions. * * @interface AttributeConverter * @template T The type of the property value * @description Provides custom conversion logic between HTML attribute strings * and JavaScript property values for complex data types or custom formatting. */ export interface AttributeConverter { /** * Converts an HTML attribute string value to a JavaScript property value. * * @param {string | null} value - The attribute value to convert * @returns {T} The converted JavaScript value * @optional * * @example * ```typescript * fromAttribute: (value: string | null) => { * return value ? JSON.parse(value) : null; * } * ``` */ fromAttribute?(value: string | null): T; /** * Converts a JavaScript property value to an HTML attribute string. * * @param {T} value - The JavaScript value to convert * @returns {string} The converted attribute string * @optional * * @example * ```typescript * toAttribute: (value: object) => { * return JSON.stringify(value); * } * ``` */ toAttribute?(value: T): string; } /** * Class field decorator that creates a reactive property with automatic attribute syncing. * * Features: * - Automatic type conversion between attributes and properties * - Optional property → attribute reflection * - Custom converters for complex types * - Automatic observedAttributes registration * - Deferred updates for disconnected elements * - Lifecycle integration (updated, shouldUpdate, renderNow) * * @decorator * @param {PropertyOptions} [options={}] - Configuration options for the property * @returns {(target: any, propertyKey: string) => void} The decorator function * * @example * Basic usage with different types: * ```typescript * class MyElement extends BaseComponent { * @property({ type: String }) * name = 'default'; * * @property({ type: Number }) * count = 0; * * @property({ type: Boolean }) * active = false; * } * ``` * * @example * With reflection (property changes update attribute): * ```typescript * class MyElement extends BaseComponent { * @property({ type: String, reflect: true }) * status = 'pending'; * * updateStatus() { * this.status = 'complete'; // Also updates status="complete" attribute * } * } * ``` * * @example * Custom attribute name and converter: * ```typescript * class MyElement extends BaseComponent { * @property({ * type: Object, * attribute: 'data-config', * converter: { * fromAttribute: (value) => value ? JSON.parse(value) : {}, * toAttribute: (value) => JSON.stringify(value) * } * }) * config = {}; * } * ``` * * @example * Property without attribute syncing: * ```typescript * class MyElement extends BaseComponent { * @property({ attribute: false }) * internalState = null; // No attribute created or observed * } * ``` */ export declare function property(options?: PropertyOptions): (target: any, propertyKey: string) => void; export {}; //# sourceMappingURL=property.d.ts.map