@furystack/shades-common-components/esm/components/suggest/suggest-input.js

import { Shade, createComponent } from '@furystack/shades';
import { ThemeProviderService } from '../../services/theme-provider-service.js';
export const SuggestInput = Shade({
    shadowDomName: 'shades-suggest-input',
    style: {
        width: '100%',
        overflow: 'hidden',
    },
    render: ({ element, props, useObservable, injector }) => {
        const { theme } = injector.getInstance(ThemeProviderService);
        // todo: getLast is eliminated, do we need it?
        useObservable('isOpened', props.manager.isOpened, {
            onChange: (isOpened) => {
                const input = element.firstChild;
                if (isOpened) {
                    input.focus();
                }
                else {
                    input.value = '';
                }
            },
        });
        return (createComponent("input", { autofocus: true, style: {
                color: theme.text.primary,
                outline: 'none',
                padding: '1em',
                background: 'transparent',
                border: 'none',
                display: 'inline-flex',
                width: 'calc(100% - 2em)',
            } }));
    },
});
//# sourceMappingURL=suggest-input.js.map