<commit_before>import m from 'mithril';
import prop from 'mithril/stream';
import h from '../h';

export const InputSelectSearchClearable = {
    oninit(vnode) {

        const openSearchControl = h.RedrawToggleStream(false, true);

        vnode.state = {
            openSearchControl
        };
    },

    view({ state, attrs }) {

        const onSearch = attrs.onSearch;
        const onSelect = attrs.onSelect;
        const selectedItem = attrs.selectedItem() || 'Brasil';
        const foundItems = attrs.foundItems() || [];
        const itemToString = attrs.itemToString;
        const openSearchControl = state.openSearchControl;
        const openSearchControlDisplayStyle = openSearchControl() ? 'block' : 'none';
        const onToggleSearchBox = (/** @type {Event} */ event) => {
            event.stopPropagation();
            openSearchControl.toggle();
            if (openSearchControl()) {
                onSearch('');
            }
        }

        return m('div.explore-filter-wrapper', [
            m('div.explore-span-filter', { 
                'style': { 'border-color': 'rgba(0, 0, 0, 0.11)' },
                onclick: onToggleSearchBox
            }, [
                m('div.explore-span-filter-name', [
                    m('div.explore-mobile-label', 'LOCAL'),
                    m('div.inline-block', selectedItem)
                ]),
                m('.inline-block.fa.fa-angle-down[aria-hidden="true"]', {
                    onclick: onToggleSearchBox
                })
            ]),
            m('div.explore-filter-select.big.w-clearfix', { 'style': { 'display': openSearchControlDisplayStyle } }, [
                m('a.modal-close.fa.fa-close.fa-lg.w-hidden-main.w-hidden-medium.w-inline-block[href="#"]', {
                    onclick: onToggleSearchBox
                }),
                m('div.w-form', [
                    m('form.position-relative', [
                        m('a.btn-search.w-inline-block[href="#"]',
                            m('img.header-lupa[src="https://uploads-ssl.webflow.com/57ba58b4846cc19e60acdd5b/57ba58b4846cc19e60acdda7_lupa.png"][alt=""]')
                        ),
                        m('input.text-field.positive.city-search.w-input[type="text"][autofocus][maxlength="256"][placeholder="Pesquise por cidade ou estado"]', {
                            oninput: (/** @type {Event} */ event) => onSearch(event.target.value),
                            onkeyup: (/** @type {Event} */ event) => onSearch(event.target.value),
                        }),
                        m('div.table-outer.search-cities-pre-result', [
                            foundItems.map(item => {
                                return m('div.table-row.fontsize-smallest.fontcolor-secondary',
                                    m('a.fontsize-smallest.link-hidden-light[href="#"]', {
                                        onclick: () => onSelect(item)
                                    }, itemToString(item))
                                );
                            })
                        ])
                    ]),
                ])
            ])
        ]);
    }
}<commit_msg>close search cities when select one and remove selected button<commit_after>import m from 'mithril';
import prop from 'mithril/stream';
import h from '../h';

export const InputSelectSearchClearable = {
    oninit(vnode) {

        const openSearchControl = h.RedrawToggleStream(false, true);

        vnode.state = {
            openSearchControl
        };
    },

    view({ state, attrs }) {

        const onSearch = attrs.onSearch;
        const onSelect = attrs.onSelect;
        const selectedToString = attrs.selectedToString;
        const hasItemSelected = attrs.selectedItem() !== null;
        const selectedItem = hasItemSelected ? selectedToString(attrs.selectedItem()) : attrs.noneSelected;
        const foundItems = attrs.foundItems() || [];
        const itemToString = attrs.itemToString;
        const openSearchControl = state.openSearchControl;
        const openSearchControlDisplayStyle = openSearchControl() ? 'block' : 'none';
        const onToggleSearchBox = (/** @type {Event} */ event) => {
            event.stopPropagation();
            openSearchControl.toggle();
            if (openSearchControl()) {
                onSearch('');
            }
        };

        return m('div.explore-filter-wrapper', [
            m('div.explore-span-filter', {
                onclick: onToggleSearchBox
            }, [
                m('div.explore-span-filter-name', [
                    m('div.explore-mobile-label', 'LOCAL'),
                    m('div.inline-block', selectedItem)
                ]),
                m(`.inline-block.fa${ hasItemSelected ? '.fa-times' : '.fa-angle-down'}[aria-hidden="true"]`, {
                    onclick: (/** @type {Event} */ event) => {
                        if (hasItemSelected) {
                            onSelect(null);
                            event.stopPropagation();
                            openSearchControl(false);
                        } else {
                            onToggleSearchBox(event);
                        }
                    }
                })
            ]),
            m('div.explore-filter-select.big.w-clearfix', { 'style': { 'display': openSearchControlDisplayStyle } }, [
                m('a.modal-close.fa.fa-close.fa-lg.w-hidden-main.w-hidden-medium.w-inline-block[href="#"]', {
                    onclick: onToggleSearchBox
                }),
                m('div.w-form', [
                    m('form.position-relative', [
                        m('a.btn-search.w-inline-block[href="#"]',
                            m('img.header-lupa[src="https://uploads-ssl.webflow.com/57ba58b4846cc19e60acdd5b/57ba58b4846cc19e60acdda7_lupa.png"][alt=""]')
                        ),
                        m('input.text-field.positive.city-search.w-input[type="text"][autofocus][maxlength="256"][placeholder="Pesquise por cidade ou estado"]', {
                            oninput: (/** @type {Event} */ event) => onSearch(event.target.value),
                            onkeyup: (/** @type {Event} */ event) => onSearch(event.target.value),
                        }),
                        m('div.table-outer.search-cities-pre-result', [
                            foundItems.map(item => {
                                return m('div.table-row.fontsize-smallest.fontcolor-secondary',
                                    m('a.fontsize-smallest.link-hidden-light[href="#"]', {
                                        onclick: (/** @type {Event} */ event) => {
                                            event.preventDefault();
                                            onSelect(item);
                                            onToggleSearchBox(event);
                                        }
                                    }, itemToString(item))
                                );
                            })
                        ])
                    ]),
                ])
            ])
        ]);
    }
}
{'fraction_non_alphanumeric': 0.13530566461020752, 'fraction_numerical': 0.0089736399326977, 'mean_word_length': 1.3379219927892494, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 14, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 13, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4930129', 'n_tokens_mistral': 1904, 'n_tokens_neox': 1818, 'n_words': 252}