@nu-art/thunderstorm-frontend 0.400.5

package/components/TS_Tree/types.js

@@ -0,0 +1,21 @@
+/*
+ * Thunderstorm is a full web app framework!
+ *
+ * Typescript & Express backend infrastructure that natively runs on firebase function
+ * Typescript & React frontend infrastructure
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+export {};

package/components/TS_V2_Input/TS_InputV2.d.ts

@@ -0,0 +1,93 @@
+import * as React from 'react';
+import { ChangeEvent, CSSProperties, HTMLProps, KeyboardEvent } from 'react';
+import '../TS_Input/TS_Input.scss';
+import { ComponentProps_Error } from '../types.js';
+import { TS_Object } from '@nu-art/ts-common';
+import { UIProps_EditableItem } from '../../utils/EditableItem.js';
+type MetaKeys = 'shiftKey' | 'altKey' | 'ctrlKey' | 'metaKey';
+type InputState = {
+    id?: string;
+    name?: string;
+    initialValue?: string;
+    value?: string;
+    focused?: boolean;
+};
+export type InputType = 'text' | 'number' | 'password' | 'time';
+type TypeProps_TS_Input = {
+    type: InputType;
+};
+type BaseInfraProps_TS_InputV2 = {
+    saveEvent?: ('blur' | 'accept' | 'change')[];
+    forceAcceptKeys?: MetaKeys[];
+    className?: string;
+    style?: CSSProperties;
+    trim?: boolean;
+    autoComplete?: string;
+    spellCheck?: boolean;
+};
+type BaseAppLevelProps_TS_InputV2 = ComponentProps_Error & Omit<HTMLProps<HTMLInputElement>, 'onChange' | 'onBlur' | 'ref'> & BaseInfraProps_TS_InputV2 & {
+    id?: string;
+    placeholder?: string;
+    name?: string;
+    focus?: boolean;
+    innerRef?: React.RefObject<HTMLInputElement>;
+    onCancel?: () => void;
+};
+export type TemplatingProps_TS_InputV2 = TypeProps_TS_Input & BaseInfraProps_TS_InputV2;
+export type Props_TS_InputV2 = BaseAppLevelProps_TS_InputV2 & TypeProps_TS_Input & {
+    value?: string;
+    onChange?: (value: string, id: string) => void;
+    onAccept?: (value: string, event: KeyboardEvent<HTMLInputElement>) => Promise<any> | any;
+    onBlur?: (value: string, event: React.FocusEvent<HTMLInputElement>) => void;
+    allowAccept?: boolean;
+};
+export type NativeProps_TS_InputV2 = Props_TS_InputV2;
+export type EditableItemProps_TS_InputV2<ValueType, K extends keyof T, T extends TS_Object & {
+    [k in K]: ValueType;
+} | ValueType[]> = Omit<BaseAppLevelProps_TS_InputV2, 'value'> & {
+    value?: ValueType;
+} & UIProps_EditableItem<T, K, ValueType> & {
+    onChange?: (value: ValueType) => Promise<any> | any;
+};
+/**
+ * A better way to capture user input
+ *
+ * <code>
+ * 		<input className="ts-input"/>
+ * </code>
+ *
+ */
+export declare class TS_InputV2 extends React.Component<Props_TS_InputV2, InputState> {
+    static readonly editableString: (templateProps: TemplatingProps_TS_InputV2) => (props: NativeProps_TS_InputV2) => import("react/jsx-runtime").JSX.Element;
+    static readonly editableTimeOptional: (templateProps: TemplatingProps_TS_InputV2) => <K extends string, T extends TS_Object & { [k in K]?: number | string; }>(props: EditableItemProps_TS_InputV2<any, K, T>) => import("react/jsx-runtime").JSX.Element;
+    static readonly editableTime: (templateProps: TemplatingProps_TS_InputV2) => <K extends string, T extends TS_Object & { [k in K]: number | string; }>(props: EditableItemProps_TS_InputV2<any, K, T>) => import("react/jsx-runtime").JSX.Element;
+    static readonly _editableTime: (templateProps: TemplatingProps_TS_InputV2) => <K extends string, T extends TS_Object & { [k in K]: number | string; }>(props: EditableItemProps_TS_InputV2<number | string, K, T>) => import("react/jsx-runtime").JSX.Element;
+    static readonly editableNumberOptional: (templateProps: TemplatingProps_TS_InputV2) => <K extends string, T extends TS_Object & { [k in K]?: number; }>(props: EditableItemProps_TS_InputV2<any, K, T>) => import("react/jsx-runtime").JSX.Element;
+    static readonly editableNumber: (templateProps: TemplatingProps_TS_InputV2) => <K extends string, T extends TS_Object & { [k in K]: number; }>(props: EditableItemProps_TS_InputV2<any, K, T>) => import("react/jsx-runtime").JSX.Element;
+    static readonly _editableNumber: (templateProps: TemplatingProps_TS_InputV2) => <K extends string, T extends TS_Object & { [k in K]: number; }>(props: EditableItemProps_TS_InputV2<number, K, T>) => import("react/jsx-runtime").JSX.Element;
+    static readonly editableOptional: (templateProps: TemplatingProps_TS_InputV2) => <K extends string, T extends TS_Object & ({ [k in K]?: string; })>(props: EditableItemProps_TS_InputV2<string | undefined, K, T>) => import("react/jsx-runtime").JSX.Element;
+    static readonly editableArray: (templateProps: TemplatingProps_TS_InputV2) => <K extends keyof T, T extends string[]>(props: EditableItemProps_TS_InputV2<string, K, T>) => import("react/jsx-runtime").JSX.Element;
+    static readonly editable: (templateProps: TemplatingProps_TS_InputV2) => <K extends string, T extends TS_Object & ({ [k in K]: string; })>(props: EditableItemProps_TS_InputV2<string, K, T>) => import("react/jsx-runtime").JSX.Element;
+    static readonly _editable: (templateProps: TemplatingProps_TS_InputV2) => <K extends string, T extends TS_Object & ({ [k in K]?: string; } | { [k in K]: string; })>(props: EditableItemProps_TS_InputV2<string | undefined, K, T>) => import("react/jsx-runtime").JSX.Element;
+    static defaultProps: {
+        forceAcceptKeys: MetaKeys[];
+        saveEvent: string[];
+    };
+    inputRef: React.RefObject<HTMLInputElement>;
+    constructor(props: Props_TS_InputV2);
+    static getDerivedStateFromProps(props: Props_TS_InputV2, state: InputState): {
+        id: string | undefined;
+        name: string | undefined;
+        initialValue: string | (readonly string[] & string) | undefined;
+        value: string;
+    } | {
+        value: string | undefined;
+        focused: boolean | undefined;
+    };
+    private static getInitialState;
+    changeValue: (event: ChangeEvent<HTMLInputElement>) => void;
+    onKeyDown: (ev: KeyboardEvent<HTMLInputElement>) => Promise<void>;
+    componentDidMount(): void;
+    render(): import("react/jsx-runtime").JSX.Element;
+}
+export {};

package/components/TS_V2_Input/TS_InputV2.js

@@ -0,0 +1,220 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/*
+ * Thunderstorm is a full web app framework!
+ *
+ * Typescript & Express backend infrastructure that natively runs on firebase function
+ * Typescript & React frontend infrastructure
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import * as React from 'react';
+import { _className } from '../../utils/tools.js';
+import '../TS_Input/TS_Input.scss';
+import { convertToHTMLDataAttributes, getErrorTooltip, resolveEditableError } from '../types.js';
+/**
+ * A better way to capture user input
+ *
+ * <code>
+ * 		<input className="ts-input"/>
+ * </code>
+ *
+ */
+export class TS_InputV2 extends React.Component {
+    static editableString = (templateProps) => {
+        return (props) => _jsx(TS_InputV2, { ...templateProps, ...props });
+    };
+    static editableTimeOptional = (templateProps) => {
+        return (props) => {
+            return this._editableTime(templateProps)(props);
+        };
+    };
+    static editableTime = (templateProps) => {
+        return (props) => {
+            return this._editableTime(templateProps)(props);
+        };
+    };
+    static _editableTime = (templateProps) => {
+        return (props) => {
+            const { type, ...restTemplatingProps } = templateProps;
+            const { editable, prop, showErrorTooltip, saveEvent, onChange: _onChange, ...rest } = props;
+            const _saveEvents = [...saveEvent || [], ...templateProps.saveEvent || []];
+            let onChange;
+            let onBlur;
+            let onAccept;
+            const saveEventHandler = (value) => {
+                return _onChange ? _onChange(value) : editable.updateObj({ [prop]: value });
+            };
+            if (_saveEvents.includes('change'))
+                onChange = saveEventHandler;
+            if (_saveEvents.includes('blur'))
+                onBlur = saveEventHandler;
+            if (_saveEvents.includes('accept'))
+                onAccept = saveEventHandler;
+            const value = props.editable.get(props.prop);
+            return _jsx(TS_InputV2, { error: resolveEditableError(props), ...restTemplatingProps, ...rest, type: type, onChange: onChange, showErrorTooltip: showErrorTooltip, onBlur: onBlur, onAccept: onAccept, value: String(props.value ?? value) });
+        };
+    };
+    static editableNumberOptional = (templateProps) => {
+        return (props) => {
+            // @ts-ignore
+            return this._editableNumber(templateProps)(props);
+        };
+    };
+    static editableNumber = (templateProps) => {
+        return (props) => {
+            return this._editableNumber(templateProps)(props);
+        };
+    };
+    static _editableNumber = (templateProps) => {
+        return (props) => {
+            const { type, ...restTemplatingProps } = templateProps;
+            const { editable, prop, showErrorTooltip, saveEvent, onChange: _onChange, ...rest } = props;
+            const _saveEvents = [...saveEvent || [], ...templateProps.saveEvent || []];
+            let onChange;
+            let onBlur;
+            let onAccept;
+            const saveEventHandler = (value) => {
+                return _onChange ? _onChange(+value) : editable.updateObj({ [prop]: +value });
+            };
+            if (_saveEvents.includes('change'))
+                onChange = saveEventHandler;
+            if (_saveEvents.includes('blur'))
+                onBlur = saveEventHandler;
+            if (_saveEvents.includes('accept'))
+                onAccept = saveEventHandler;
+            const value = props.editable.get(props.prop);
+            return _jsx(TS_InputV2, { error: resolveEditableError(props), ...restTemplatingProps, ...rest, type: type, showErrorTooltip: showErrorTooltip, onChange: onChange, onBlur: onBlur, onAccept: onAccept, value: String(props.value ?? value) });
+        };
+    };
+    static editableOptional = (templateProps) => {
+        return (props) => {
+            return this._editable(templateProps)(props);
+        };
+    };
+    static editableArray = (templateProps) => {
+        return (props) => {
+            // @ts-ignore
+            return this._editable(templateProps)(props);
+        };
+    };
+    static editable = (templateProps) => {
+        return (props) => {
+            // @ts-ignore
+            return this._editable(templateProps)(props);
+        };
+    };
+    static _editable = (templateProps) => {
+        return (props) => {
+            const { type, ...restTemplatingProps } = templateProps;
+            const { editable, prop, showErrorTooltip, saveEvent, onChange: _onChange, ...rest } = props;
+            const _saveEvents = [...saveEvent || [], ...templateProps.saveEvent || []];
+            let onChange;
+            let onBlur;
+            let onAccept;
+            const saveEventHandler = (value) => {
+                return _onChange ? _onChange(value) : editable.updateObj({ [prop]: value });
+            };
+            if (_saveEvents.includes('change'))
+                onChange = saveEventHandler;
+            if (_saveEvents.includes('blur'))
+                onBlur = saveEventHandler;
+            if (_saveEvents.includes('accept'))
+                onAccept = saveEventHandler;
+            const value = editable.get(prop);
+            return _jsx(TS_InputV2, { error: resolveEditableError(props), ...restTemplatingProps, ...rest, type: type, onChange: onChange, onBlur: onBlur, onAccept: onAccept, showErrorTooltip: showErrorTooltip, value: props.value ?? value });
+        };
+    };
+    static defaultProps = {
+        forceAcceptKeys: ['ctrlKey', 'metaKey'],
+        saveEvent: ['accept']
+    };
+    inputRef;
+    constructor(props) {
+        super(props);
+        this.inputRef = React.createRef();
+        this.state = TS_InputV2.getInitialState(props);
+    }
+    static getDerivedStateFromProps(props, state) {
+        if (props.id === state.id && state.name === props.name && state.initialValue === props.value)
+            return { value: state.value, focused: state.focused };
+        return TS_InputV2.getInitialState(props);
+    }
+    static getInitialState(props) {
+        return {
+            id: props.id,
+            name: props.name,
+            initialValue: props.value,
+            value: props.value || ''
+        };
+    }
+    changeValue = (event) => {
+        const value = event.target.value;
+        this.setState({ value });
+        this.props.onChange?.(value, event.target.id);
+    };
+    onKeyDown = async (ev) => {
+        let value = ev.currentTarget.value;
+        if (!(ev.shiftKey || ev.altKey || ev.ctrlKey || ev.metaKey)) {
+            if (ev.key === 'Enter') {
+                ev.persist();
+                if (this.props.trim)
+                    value = value.trim();
+                //@ts-ignore - despite what typescript says, ev.target does have a blur function.
+                ev.target.blur();
+                if (this.props.onAccept) {
+                    if (value !== this.props.value || this.props.allowAccept) {
+                        await this.props.onAccept(value, ev);
+                    }
+                    ev.stopPropagation();
+                }
+            }
+            if (ev.key === 'Escape' && this.props.onCancel) {
+                this.props.onCancel();
+                ev.stopPropagation();
+            }
+        }
+        if (ev.key === 'Enter' && this.props.forceAcceptKeys?.find(key => ev[key]))
+            if (this.props.onAccept) {
+                if (value !== this.props.value || this.props.allowAccept) {
+                    await this.props.onAccept(value, ev);
+                }
+                ev.stopPropagation();
+            }
+        this.props.onKeyDown?.(ev);
+    };
+    componentDidMount() {
+        // console.log(`REFOCUS!!!`);
+        if (!this.inputRef.current)
+            return console.log(`CAN'T REFOCUS!!! - no REF: ${this.state.value}`);
+        // if (this.props.innerRef) {
+        // 	// @ts-ignore
+        // 	this.props.innerRef.current = ref;
+        // }
+        if (this.state.focused) {
+            console.log(`REFOCUS!!! - value: ${this.state.value}`);
+            this.inputRef.current.focus();
+        }
+    }
+    render() {
+        const { onAccept, allowAccept, showErrorTooltip, error, trim, forceAcceptKeys, focus, saveEvent, ...props } = this.props;
+        return _jsx("input", { ...props, ...convertToHTMLDataAttributes(this.props.error, 'error'), ...getErrorTooltip(this.props.error, this.props.showErrorTooltip), autoFocus: focus, ref: this.inputRef, onBlur: (event) => {
+                const value = event.target.value;
+                this.setState({ value, focused: false });
+                props.onBlur?.(value, event);
+            }, onFocus: (event) => {
+                this.setState({ focused: true });
+            }, name: props.name || props.id, className: _className('ts-input', props.className), value: this.state.value, onChange: this.changeValue, onKeyDown: this.onKeyDown, autoComplete: props.autoComplete ? 'on' : 'off' });
+    }
+}

package/components/TS_V2_Input/index.d.ts

@@ -0,0 +1 @@
+export * from './TS_InputV2.js';

package/components/TS_V2_Input/index.js

@@ -0,0 +1,21 @@
+/*
+ * Thunderstorm is a full web app framework!
+ *
+ * Typescript & Express backend infrastructure that natively runs on firebase function
+ * Typescript & React frontend infrastructure
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+export * from './TS_InputV2.js';

package/components/TS_V2_TextArea/TS_BaseInput.d.ts

@@ -0,0 +1,42 @@
+import * as React from 'react';
+import { ChangeEvent, CSSProperties, HTMLProps, KeyboardEvent } from 'react';
+export type InputType = 'text' | 'number' | 'password';
+export type TS_BaseInputProps<Key, Element> = Omit<HTMLProps<Element>, 'onChange' | 'onBlur' | 'ref'> & {
+    type: InputType;
+    style?: CSSProperties;
+    id?: Key;
+    onChange?: (value: string, id: Key) => void;
+    onAccept?: (value: string, event: KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+    onCancel?: () => void;
+    onBlur?: (value: string, event: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+    placeholder?: string;
+    enable?: boolean;
+    name?: string;
+    value?: string;
+    onKeyDown?: (e: KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+    focus?: boolean;
+    spellCheck?: boolean;
+    autoComplete?: boolean;
+    innerRef?: React.RefObject<any>;
+};
+type InputState = {
+    id: string;
+    name?: string;
+    initialValue?: string;
+    value?: string;
+};
+export declare abstract class TS_BaseInput<Key extends string, Props extends TS_BaseInputProps<Key, Input>, Input = HTMLInputElement | HTMLTextAreaElement> extends React.Component<Props, InputState> {
+    protected ref?: HTMLInputElement | HTMLTextAreaElement;
+    constructor(props: Props);
+    static getDerivedStateFromProps(props: TS_BaseInputProps<any, any>, state: InputState): {
+        id: any;
+        name: string | undefined;
+        initialValue: string | (readonly string[] & string) | undefined;
+        value: string;
+    } | {
+        value: string | undefined;
+    };
+    private static getInitialState;
+    changeValue: (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+}
+export {};

package/components/TS_V2_TextArea/TS_BaseInput.js

@@ -0,0 +1,46 @@
+/*
+ * Thunderstorm is a full web app framework!
+ *
+ * Typescript & Express backend infrastructure that natively runs on firebase function
+ * Typescript & React frontend infrastructure
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import * as React from 'react';
+export class TS_BaseInput extends React.Component {
+    ref;
+    constructor(props) {
+        super(props);
+        this.state = TS_BaseInput.getInitialState(props);
+    }
+    static getDerivedStateFromProps(props, state) {
+        if (props.id === state.id && state.name === props.name && state.initialValue === props.value)
+            return { value: state.value };
+        return TS_BaseInput.getInitialState(props);
+    }
+    static getInitialState(props) {
+        return {
+            id: props.id,
+            name: props.name,
+            initialValue: props.value,
+            value: props.value || ''
+        };
+    }
+    changeValue = (event) => {
+        const value = event.target.value;
+        this.setState({ value });
+        this.props.onChange?.(value, event.target.id);
+    };
+}

package/components/TS_V2_TextArea/TS_TextAreaV2.d.ts

@@ -0,0 +1,78 @@
+import * as React from 'react';
+import { ChangeEvent, CSSProperties, HTMLProps, KeyboardEvent } from 'react';
+import './TS_TextAreaV2.scss';
+import { UIProps_EditableItem } from '../../utils/EditableItem.js';
+import { ComponentProps_Error } from '../types.js';
+type MetaKeys = 'shiftKey' | 'altKey' | 'ctrlKey' | 'metaKey';
+type InputState = {
+    id?: string;
+    name?: string;
+    initialValue?: string;
+    value?: string;
+};
+type BaseInfraProps_TS_TextAreaV2 = {
+    saveEvent?: ('blur' | 'accept' | 'change')[];
+    forceAcceptKeys?: MetaKeys[];
+    className?: string;
+    style?: CSSProperties;
+    resizeWithText?: boolean;
+    trim?: boolean;
+    autoComplete?: string;
+    spellCheck?: boolean;
+};
+type BaseAppLevelProps_TS_TextAreaV2 = ComponentProps_Error & Omit<HTMLProps<HTMLTextAreaElement>, 'onChange' | 'onBlur' | 'ref'> & BaseInfraProps_TS_TextAreaV2 & {
+    id?: string;
+    placeholder?: string;
+    name?: string;
+    focus?: boolean;
+    innerRef?: React.RefObject<HTMLTextAreaElement>;
+    onCancel?: () => void;
+};
+export type TemplatingProps_TS_TextAreaV2 = BaseInfraProps_TS_TextAreaV2;
+export type Props_TS_TextAreaV2 = BaseAppLevelProps_TS_TextAreaV2 & {
+    value?: string;
+    onChange?: (value: string, id: string) => void;
+    onAccept?: (value: string, event: KeyboardEvent<HTMLTextAreaElement>) => void;
+    onBlur?: (value: string, event: React.FocusEvent<HTMLTextAreaElement>) => void;
+};
+export type NativeProps_TS_TextAreaV2 = Props_TS_TextAreaV2 & {
+    componentRef?: React.RefObject<TS_TextAreaV2>;
+};
+export type EditableItemProps_TS_TextAreaV2 = BaseAppLevelProps_TS_TextAreaV2 & UIProps_EditableItem<any, any, string> & {
+    onChange?: (value: string) => void;
+    componentRef?: React.RefObject<TS_TextAreaV2>;
+};
+/**
+ * A better way to capture user input
+ *
+ * <code>
+ * 		<input className="ts-input"/>
+ * </code>
+ *
+ */
+export declare class TS_TextAreaV2 extends React.Component<Props_TS_TextAreaV2, InputState> {
+    static readonly editableString: (mandatoryProps: TemplatingProps_TS_TextAreaV2) => (props: NativeProps_TS_TextAreaV2) => import("react/jsx-runtime").JSX.Element;
+    static readonly editable: (templateProps: TemplatingProps_TS_TextAreaV2) => (props: EditableItemProps_TS_TextAreaV2) => import("react/jsx-runtime").JSX.Element;
+    static defaultProps: {
+        forceAcceptKeys: MetaKeys[];
+        saveEvent: string[];
+    };
+    protected ref?: HTMLTextAreaElement;
+    constructor(props: Props_TS_TextAreaV2);
+    static getDerivedStateFromProps(props: Props_TS_TextAreaV2, state: InputState): {
+        id: string | undefined;
+        name: string | undefined;
+        initialValue: string | (readonly string[] & string) | undefined;
+        value: string;
+    } | {
+        value: string | undefined;
+    };
+    private static getInitialState;
+    changeValue: (event: ChangeEvent<HTMLTextAreaElement>) => void;
+    onKeyDown: (ev: KeyboardEvent<HTMLTextAreaElement>) => void;
+    resizeWithText: () => void;
+    componentDidMount(): void;
+    componentDidUpdate(): void;
+    render(): import("react/jsx-runtime").JSX.Element;
+}
+export {};