export declare type Attrs = ReadonlyArray<MinzeAttr>;

export declare type EventListeners = ReadonlyArray<MinzeEvent>;

/**
 * Minze: Global class with helpful static methods.
 */
declare class Minze {
    /**
     * The current Minze version.
     */
    static readonly version: string;
    /**
     * Defines a custom element.
     *
     * @param name - The name of the custom element.
     * @param element - The element extending the MinzeElement class.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {}
     * Minze.define('my-element', MyElement)
     * ```
     */
    static define(name: string, element: typeof MinzeElement): void;
    /**
     * Defines multiple custom elements.
     *
     * All class names have to be in PascalCase for automatic dash-case name conversion.
     * Example: `MinzeElement` will be registered as `<minze-element></minze-element>`.
     *
     * The parameters filter and keys have only an effect when elementsOrModules is actually a
     * module-map. E.g. Object returned by vite `import.meta.glob`.
     *
     * @param elementsOrModules - A module object, a module-map or an array of Minze elements.
     * @param filter - An array of keys that narrows down which modules of a module-map should be defined.
     * @param keys - A callback function that will be applied to every key.
     *
     * @default
     * keys = (key) => key.replace(/^\.\/lib\/|\.(ts|js)$/gi, '') // removes './lib/', '.ts' and '.js'
     *
     * @example
     * ```
     * // array
     * import { MinzeElement, MinzeElementTwo } from './elements'
     * Minze.defineAll([ MinzeElement, MinzeElementTwo ])
     *
     * // module
     * import * as elements from './elements'
     * Minze.defineAll(elements)
     *
     * // module-map
     * const modules = {
     *   'element': () => import('./path/to/file.js')
     * }
     * Minze.defineAll(modules)
     *
     * // module-map (vite)
     * const modules = import.meta.glob('./lib/*.@(ts|js)')
     * Minze.defineAll(modules)
     * ```
     */
    static defineAll(elementsOrModules: (typeof MinzeElement)[] | Record<string, unknown | (() => Promise<unknown>)>, filter?: string[] | null, keys?: ((key: string) => string) | false | null): void;
    /**
     * Creates an enhanced consumable map of modules for `Minze.defineAll`.
     *
     * @param modules - A module object.
     * @param filter - An array of strings that narrows down which modules should be included.
     * @param keys - A callback function that will be applied to every key.
     *
     * @example
     * ```
     * Minze.enhanceModules(modules, ['first-module', 'second-module'], (key) => key)
     * ```
     */
    private static enhanceModules;
    /**
     * Dispatches a custom event on the `window` object.
     *
     * @param eventName - The name of the event.
     * @param detail - The detail data to be passed with the event.
     *
     * @example
     * ```
     * Minze.dispatch('minze:update', { amount: 10 })
     * ```
     */
    static dispatch(eventName: string, detail?: unknown): void;
    /**
     * @deprecated use dispatch instead.
     */
    static cast(eventName: string, detail?: unknown): void;
    /**
     * Adds an event listener to the `window` object
     * for the provided event name and callback function.
     *
     * @param eventName - The name of the event.
     * @param callback - The callback function to be called when the event is dispatched.
     *
     * @example
     * ```
     * Minze.listen('minze:update', (event) => {})
     * ```
     */
    static listen(eventName: string, callback: (event: any) => void): void;
    /**
     * Removes event listener based on the provided event name and
     * callback function from the `window` object.
     *
     * @param eventName - The name of the event.
     * @param callback - The callback function to be removed.
     *
     * @example
     * ```
     * Minze.stopListen('minze:update', (event) => {})
     * ```
     */
    static stopListen(eventName: string, callback: (event: any) => void): void;
}
export { Minze }
export default Minze;

export declare type MinzeAttr = string | [name: string, value?: unknown];

export declare type MinzeAttrs = Attrs;

/**
 * MinzeElement: Base class for custom web components.
 *
 * @example
 * ```
 * class MyElement extends MinzeElement {
 *   html = () => `<div>Hello Minze!</div>`
 * }
 * ```
 */
export declare class MinzeElement extends HTMLElement {
    constructor();
    /**
     * The current Minze version.
     */
    static readonly version: string;
    /**
     * Can by used in conditional checks to determine if the class is a MinzeElement.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {}
     * MyElement.isMinzeElement
     * ```
     */
    static readonly isMinzeElement = true;
    /**
     * The class name of the component in dash-case.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {}
     * MyElement.dashName
     * ```
     */
    static get dashName(): string;
    /**
     * The class name of the component instance in dash-case.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   onStart = () => {
     *     console.log(this.dashName) // my-element
     *   }
     * }
     * ```
     */
    get dashName(): string;
    /**
     * The class name of the component instance.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   onStart = () => {
     *     console.log(this.name) // MyElement
     *   }
     * }
     * ```
     */
    get name(): string;
    /**
     * Registers element as a custom web component.
     *
     * @param name - The name of the custom web component.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {}
     * MyElement.define()
     * // or
     * MyElement.define('my-element')
     * ```
     */
    static define(name?: string): void;
    /**
     * Defines options for the web component.
     *
     * @default
     * ```
     * MyElement extends MinzeElement {
     *   options = {
     *     cssReset: true,
     *     exposeAttrs: {
     *       exportparts: false,
     *       rendered: false
     *     },
     *     viewTransitions: false
     *   }
     * }
     * ```
     */
    options?: {
        cssReset?: boolean;
        exposeAttrs?: {
            exportparts?: boolean;
            rendered?: boolean;
        };
        viewTransitions?: boolean;
    };
    /**
     * Toggles debug mode.
     *
     * @example
     * ```
     * MyElement extends MinzeElement {
     *   debug = true
     * }
     * ```
     */
    debug?: boolean;
    /**
     * Defines properties that should be created as reactive.
     *
     * reactive takes a mixed array of strings and tuples:
     * [name, [ name, value, exposeAttr? ], ...]
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   reactive = [
     *     'foo',
     *     ['active', false],
     *     ['amount', 0, true]
     *   ]
     * }
     * ```
     */
    reactive?: Reactive;
    /**
     * Defines attribute properties that should be created as reactive.
     *
     * attrs takes a mixed array of strings and tuples:
     * [name [ name, value? ], ...]
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   attrs = [
     *     'foo',
     *     ['active'],
     *     ['amount', 0]
     *   ]
     * }
     * ```
     */
    attrs?: Attrs;
    /**
     * Defines which attributes should be observed.
     * A change to an observed attribute requests a template update.
     *
     * observedAttributes takes an array of strings.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   static observedAttributes = ['active', 'amount']
     * }
     * ```
     */
    static observedAttributes?: string[];
    /**
     * Defines watchers with callbacks for reactive properties and attrs.
     * Whenever a property changes the watcher will be called.
     *
     * watch takes an array of tuples: [[ name, callback ], ...]
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   watch = [
     *     ['active', (newValue, oldValue, key, target) => {}],
     *     ['amount', async (newValue, oldValue) => {}]
     *   ]
     * }
     * ```
     */
    watch?: Watch;
    /**
     * Defines event listeners that will be registered when the element is rendered.
     *
     * eventListeners takes an array of tuples: [[ eventTarget, eventName, callback ], ...]
     *
     * possible event targets are:
     * - global: window (limited to prevent event-listener-pollution)
     * - local: this, a BroadcastChannel, or any elements inside the shadow DOM (by passing a valid CSS selector string)
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   eventListeners = [
     *     ['.my-class', 'click', () => {}],
     *     [this, 'minze:event', () => {}],
     *     [window, 'resize', () => {}],
     *     [new BroadcastChannel('$'), 'message', () => {}]
     *   ]
     * }
     * ```
     */
    eventListeners?: EventListeners;
    /**
     * Enhanced eventListeners with merged on-events and callbacks binded to the component.
     *
     * @example
     * ```
     * this._eventListeners
     * ```
     */
    private _eventListeners?;
    /**
     * Defines the shadow DOM HTML content.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   html = () => `
     *     <div>Hello Minze!</div>
     *   `
     * }
     * ```
     */
    html?(): string;
    /**
     * HTML template (Internal)
     */
    private _html;
    /**
     * Defines the shadow DOM styling.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   css = () => `
     *     :host {
     *       background: #000;
     *     }
     *   `
     * }
     * ```
     */
    css?(): string;
    /**
     * CSS template (Internal)
     */
    private _css;
    /**
     * Renders the template into the shadow DOM.
     * Removes any previously registered event listeners.
     * Attaches all new event listeners.
     *
     * @param force - Forces the re-rendering of the template regardless of caching.
     *
     * @example
     * ```
     * this.render()
     * ```
     */
    private render;
    /**
     * Leverages the View Transition API while rendering.
     *
     * @param force - Forces the re-rendering of the template regardless of caching.
     *
     * @url https://developer.mozilla.org/docs/Web/API/View_Transitions_API
     *
     * @example
     * ```
     * this.renderWithTransition()
     * ```
     */
    private renderWithTransition;
    /**
     * Re-renders the component template, invalidating all caches.
     *
     * @example
     * ```
     * this.rerender()
     * ```
     */
    rerender(): void;
    /**
     * Selects the first matching element inside the shadow DOM.
     *
     * @param selectors - A valid CSS selector string.
     *
     * @example
     * ```
     * this.select('div')
     * ```
     */
    select<E extends Element = Element>(selectors: string): E | null;
    /**
     * Selects element(s) inside the shadow DOM.
     *
     * @param selectors - A valid CSS selector string.
     *
     * @example
     * ```
     * this.selectAll('div')
     * ```
     */
    selectAll<E extends Element = Element>(selectors: string): NodeListOf<E> | null;
    /**
     * Returns an array of slotted element(s) for provided slot name, otherwise `null` if none found.
     * Works only after the template has rendered, otherwise returns `null`.
     * Can be used inside the `afterRender` or `onReady` hooks.
     *
     * @param name - The name of the slot or empty / `default` for the default slot.
     *
     * @example
     * ```
     * this.slotted('default')
     * ```
     */
    slotted(name?: string): Element[] | null;
    /**
     * Exposes property as an attribute on the element.
     *
     * @param name - The name of the attribute.
     * @param value - The value for the attribute.
     *
     * @example
     * ```
     * this.exposeAttr('active', false)
     * ```
     */
    private exposeAttr;
    /**
     * Callback, executes a set of methods on reactive changes.
     *
     * @param type - The type of property that changed.
     * @param rootName - The name of the root property that changed.
     * @param target - The target of the property that changed.
     * @param key - The name of the property that changed.
     * @param newValue - The new value of the property that changed.
     * @param oldValue - The old value of the property that changed.
     *
     * @example
     * ```
     * this.reactiveChange(type, rootName, target, prop, newValue, oldValue)
     * ```
     */
    private reactiveChange;
    /**
     * Makes a complex object deeply reactive.
     *
     * @param name - The name of the property.
     * @param prop - The property to be made reactive.
     * @param exposeAttr - Whether to expose the property as an attribute.
     *
     * @example
     * ```
     * this.makeComplexReactive('active', {deeply: {nested: true}}, true)
     * ```
     */
    private makeComplexReactive;
    /**
     * Makes a primitive value reactive.
     *
     * @param name - The name of the property.
     * @param prop - The property to be made reactive.
     * @param exposeAttr - Whether to expose the property as an attribute.
     *
     * @example
     * ```
     * this.makePrimitiveReactive('count', 99)
     * ```
     */
    private makePrimitiveReactive;
    /**
     * Makes provided property reactive.
     *
     * @param prop - The MinzeProp to be made reactive.
     *
     * @example
     * ```
     * this.registerProp(prop)
     * ```
     */
    private registerProp;
    /**
     * Makes provided property reactive to attribute changes on the component.
     *
     * @param attr - The MinzeAttr to be made reactive.
     *
     * @example
     * ```
     * this.registerAttr(attr)
     * ```
     */
    private registerAttr;
    /**
     * Merges any on:events from the provided template with the eventListeners array.
     *
     * @param eventListeners - An eventListeners array.
     * @param template - A template function or string with html markup.
     *
     * @example
     * ```
     * this.mergeEvents(this._eventListeners, this.html)
     * ```
     */
    private mergeEvents;
    /**
     * Automatically binds all event listener callbacks that are component methods.
     *
     * @param eventListeners - An eventListeners array.
     *
     * @example
     * ```
     * this.bindEvents(this._eventListeners)
     * ```
     */
    private bindEvents;
    /**
     * Adds or removes a provided event listener.
     *
     * @param eventTuple - The event tuple to be added or removed.
     * @param action - The action to be performed.
     *
     * @example
     * ```
     * this.registerEvent(this.eventListeners[0], 'add')
     * ```
     */
    private registerEvent;
    /**
     * Dispatches a custom event from the web component.
     *
     * It's a good idea to namespace the event name. For example: `minze:update`
     *
     * @param eventName - The name of the event to be dispatched.
     * @param detail - The detail data to be passed with the event.
     *
     * @example
     * ```
     * this.dispatch('minze:update', { amount: 10 })
     * ```
     */
    dispatch(eventName: string, detail?: unknown): void;
    /**
     * @deprecated use dispatch instead.
     */
    cast(eventName: string, detail?: unknown): void;
    /**
     * Automatically exports all parts and exportparts present in the template.
     *
     * @param template - A template function or string with html markup.
     *
     * @example
     * ```
     * this.exportParts(this.html)
     * ```
     */
    private exportParts;
    /**
     * Adds or removes exportparts attribute observer.
     *
     * @param action - The action to be performed.
     * @param key - The name for the oberver.
     *
     * @example
     * ```
     * this.registerExportpartsObserver('add')
     * ```
     */
    private registerExportpartsObserver;
    /**
     * Logs debug information to the console.
     *
     * @example
     * ```
     * this.debuglog()
     * ```
     */
    private debuglog;
    /**
     * Lifecycle (Internal) - Runs whenever the element is appended into a document-connected element.
     */
    private connectedCallback;
    /**
     * Lifecycle (Internal) - Runs each time the element is disconnected from the document's DOM.
     */
    private disconnectedCallback;
    /**
     * Lifecycle (Internal) - Runs each time the element is moved to a new document.
     */
    private adoptedCallback;
    /**
     * Lifecycle (Internal) - Runs whenever one of the element's attributes is changed.
     *
     * @param name - The name of the attribute that was changed.
     * @param oldValue - The previous value of the attribute.
     * @param newValue - The new value of the attribute.
     */
    private attributeChangedCallback;
    /**
     * Lifecycle - Runs once at the start of the connectedCallback method.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   onStart = () => console.log('onStart')
     * }
     * ```
     */
    onStart?(): Promise<any> | any;
    /**
     * Lifecycle - Runs once after reactive properties are initialized.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   onReactive = () => console.log('onReactive')
     * }
     * ```
     */
    onReactive?(): Promise<any> | any;
    /**
     * Lifecycle - Runs once at the end of the connectedCallback method.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   onReady = () => console.log('onReady')
     * }
     * ```
     */
    onReady?(): Promise<any> | any;
    /**
     * Lifecycle - Runs once at the end of the disconnectedCallback method.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   onDestroy = () => console.log('onDestroy')
     * }
     * ```
     */
    onDestroy?(): Promise<any> | any;
    /**
     * Lifecycle - Runs once at the start of the adoptedCallback method.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   onMove = () => console.log('onMove')
     * }
     * ```
     */
    onMove?(): Promise<any> | any;
    /**
     * Lifecycle - Runs each time at before of every render.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   beforeRender = () => console.log('beforeRender')
     * }
     * ```
     */
    beforeRender?(): Promise<any> | any;
    /**
     * Lifecycle - Runs each time at the end of every render.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   afterRender = () => console.log('afterRender')
     * }
     * ```
     */
    afterRender?(): Promise<any> | any;
    /**
     * @deprecated use afterRender instead.
     */
    onRender?(): typeof MinzeElement.afterRender;
    /**
     * Lifecycle - Runs each time at the start of the attributeChangedCallback method.
     *
     * This hook runs before the onStart lifecycle, if an attribute is set on the element:
     * `<minze-element text="Hello Minze!" /></minze-element>`
     *
     * @param name - The name of the attribute that was changed.
     * @param oldValue - The previous value of the attribute.
     * @param newValue - The new value of the attribute.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   beforeAttributeChange = (name, oldValue, newValue) => console.log('beforeAttributeChange')
     * }
     * ```
     */
    beforeAttributeChange?(name?: string, oldValue?: string | null, newValue?: string | null): Promise<any> | any;
    /**
     * Lifecycle - Runs each time at the end of the attributeChangedCallback method.
     *
     * This hook runs before the onStart lifecycle, if an attribute is set on the element:
     * `<minze-element text="Hello Minze!" /></minze-element>`
     *
     * @param name - The name of the attribute that was changed.
     * @param oldValue - The previous value of the attribute.
     * @param newValue - The new value of the attribute.
     *
     * @example
     * ```
     * class MyElement extends MinzeElement {
     *   afterAttributeChange = (name, oldValue, newValue) => console.log('afterAttributeChange')
     * }
     * ```
     */
    afterAttributeChange?(name?: string, oldValue?: string | null, newValue?: string | null): Promise<any> | any;
    /**
     * @deprecated use afterAttributeChange instead.
     */
    onAttributeChange?: typeof MinzeElement.afterAttributeChange;
}

export declare type MinzeEvent = [
eventTarget: string | MinzeElement | typeof window | BroadcastChannel,
eventName: string,
callback: (event: any) => void
];

export declare type MinzeEventListeners = EventListeners;

export declare type MinzeProp = string | [name: string, value: unknown, exposeAttr?: boolean];

export declare type MinzeReactive = Reactive;

export declare type MinzeWatch = Watch;

export declare type MinzeWatcher = [
name: string,
callback: (newValue?: any, oldValue?: any, key?: string, target?: object | typeof MinzeElement) => Promise<void> | void
];

export declare type Reactive = ReadonlyArray<MinzeProp>;

export declare type Watch = ReadonlyArray<MinzeWatcher>;

export { }