preact-material-components/Base/MaterialComponent.d.ts

preact wrapper for "Material Components for the web"

import MDCComponent from '@material/base/component';
import { MDCRipple } from '@material/ripple';
import { Component, VNode } from 'preact';
import { SoftMerge } from './types';
export interface IMaterialComponentOwnProps {
    ripple?: boolean;
}
export interface IMaterialComponentOwnState {
}
export declare type MaterialComponentProps<PropType> = SoftMerge<PropType & IMaterialComponentOwnProps, JSX.HTMLAttributes>;
export declare type MaterialComponentState<StateType> = StateType & IMaterialComponentOwnState;
/**
 * Base class for every Material component in this package
 * NOTE: every component should add a ref by the name of `control` to its root dom for autoInit Properties
 *
 * @export
 * @class MaterialComponent
 * @extends {Component}
 */
export declare abstract class MaterialComponent<PropType extends {
    [prop: string]: any;
}, StateType extends {
    [prop: string]: any;
}> extends Component<MaterialComponentProps<PropType>, MaterialComponentState<StateType>> {
    MDComponent?: MDCComponent<any, any>;
    /**
     * Attributes inside this array will be check for boolean value true
     * and will be converted to mdc classes
     */
    protected abstract mdcProps: string[];
    /** This will again be used to add apt classname to the component */
    protected abstract componentName: string;
    /**
     * Props of which change the MDComponent will be informed.
     * Override to use.
     * When used do not forget to include this.afterComponentDidMount() at the end of your componentDidMount function.
     * Requires this.MDComponent to be defined.
     */
    protected mdcNotifyProps?: string[];
    /** The final class name given to the dom */
    protected classText?: string | null;
    protected ripple?: MDCRipple | null;
    protected control?: Element;
    render(props: any): VNode;
    /** Attach the ripple effect */
    componentDidMount(): void;
    componentWillReceiveProps(nextProps: MaterialComponentProps<PropType>): void;
    componentWillUnmount(): void;
    protected afterComponentDidMount(): void;
    protected setControlRef(control?: Element): void;
    /** Build the className based on component names and mdc props */
    protected buildClassName(props: MaterialComponentProps<PropType>): string;
    /** Returns the class name for element */
    protected getClassName(element: VNode): string | null | undefined;
    /** Components must implement this method for their specific DOM structure */
    protected abstract materialDom(props: MaterialComponentProps<PropType>): VNode;
}
export default MaterialComponent;