How to use the snabbdom/h.h function in snabbdom

const NewsFeedEradicator = (store: Store) => {
	const state = store.getState();

	// TODO: Add quotes component
	const quoteDisplay = state.showQuotes ? QuoteDisplay(store) : null;

	const newFeatureLabel = areNewFeaturesAvailable(state)
		? h('span.nfe-label.nfe-new-features', 'New Features!')
		: null;

	const infoPanel = state.showInfoPanel ? InfoPanel(store) : null;

	const onShowInfoPanel = () => store.dispatch(showInfoPanel());
	const link = h('a.nfe-info-link', { on: { click: onShowInfoPanel } }, [
		h('span', 'News Feed Eradicator'),
		newFeatureLabel,
	]);

	// Entire app component
	return h('div', [infoPanel, quoteDisplay, link]);
};

const NewsFeedEradicator = (store: Store) => {
	const state = store.getState();

	// TODO: Add quotes component
	const quoteDisplay = state.showQuotes ? QuoteDisplay(store) : null;

	const newFeatureLabel = areNewFeaturesAvailable(state)
		? h('span.nfe-label.nfe-new-features', 'New Features!')
		: null;

	const infoPanel = state.showInfoPanel ? InfoPanel(store) : null;

	const onShowInfoPanel = () => store.dispatch(showInfoPanel());
	const link = h('a.nfe-info-link', { on: { click: onShowInfoPanel } }, [
		h('span', 'News Feed Eradicator'),
		newFeatureLabel,
	]);

	// Entire app component
	return h('div', [infoPanel, quoteDisplay, link]);
};

private wrap(children: Array) {
    const {tagName, id, className} = this.rootElement as Element;
    const selId = id ? `#${id}` : '';
    const selClass = className ? `.${className.split(` `).join(`.`)}` : '';
    const vnode = h(
      `${tagName.toLowerCase()}${selId}${selClass}`,
      {},
      children
    );
    vnode.data = vnode.data || {};
    vnode.data.isolate = vnode.data.isolate || [];
    return vnode;
  }
}

const QuoteDisplay = (store: Store) => {
	const state = store.getState();
	const quote = currentQuote(state);

	if (quote == null) return null;

	if (state.isEditingQuote) {
		return h('div.nfe-quote', [QuoteEditor(store)]);
	}

	const toggleMenu = () => store.dispatch(menuToggle());
	return h('div.nfe-quote', [
		h('nfe-quote-action-menu', [
			h(
				'a.nfe-quote-action-menu-button',
				{ props: { href: '#' }, on: { click: toggleMenu } },
				'▾'
			),
			state.isQuoteMenuVisible ? QuoteMenu(store) : null,
		]),

		h('div', [
			h('p.nfe-quote-text', [
				h('span', '“'),
				h('span', quote.text),
				h('span', '”'),
			]),
			h('p.nfe-quote-source', [h('span', '~ '), h('span', quote.source)]),
		]),

const Icon = (svgPath: string) => (color: string) =>
	h(
		'svg',
		{
			attrs: {
				x: '0px',
				y: '0px',
				width: '32px',
				height: '32px',
				viewBox: '0 0 32 32',
				'enable-background': 'new 0 0 32 32',
			},
		},
		[h('path', { attrs: { fill: color, d: svgPath } })]
	);

const fieldShowBuiltin = CheckboxField(
		store,
		state.builtinQuotesEnabled,
		'Enable Built-in Quotes',
		toggleBuiltinQuotes(),
		!state.showQuotes
	);

	const hiddenQuoteCount = state.hiddenBuiltinQuotes.length;
	const hiddenQuoteReset = e => {
		e.preventDefault();
		store.dispatch(resetHiddenQuotes());
	};
	const hiddenQuotes = h('span.nfe-settings-hidden-quote-count', [
		h('span', ' ' + hiddenQuoteCount + ' hidden - '),
		h('a', { props: { href: '#' }, on: { click: hiddenQuoteReset } }, 'Reset'),
	]);

	const customQuotes = () => {
		if (state.customQuotes.length > 0) {
			return h('label', state.customQuotes.length + ' custom quotes');
		}
		return h(
			'label',
			'You can now add your own custom quotes! ' +
				'Just click the arrow menu beside the quote text.'
		);
	};

	return h('form.nfe-settings', [
		h('fieldset', [
			h('legend', [fieldShowQuotes]),

const CheckboxField = (
	store: Store,
	checked: boolean,
	text: string,
	toggleAction,
	disabled = false
) => {
	return h('label', [
		h('input', {
			props: {
				type: 'checkbox',
				checked,
				disabled,
			},
			on: {
				change: () => store.dispatch(toggleAction),
			},
		}),
		h('span', text),
	]);
};

const fieldShowBuiltin = CheckboxField(
		store,
		state.builtinQuotesEnabled,
		'Enable Built-in Quotes',
		toggleBuiltinQuotes(),
		!state.showQuotes
	);

	const hiddenQuoteCount = state.hiddenBuiltinQuotes.length;
	const hiddenQuoteReset = e => {
		e.preventDefault();
		store.dispatch(resetHiddenQuotes());
	};
	const hiddenQuotes = h('span.nfe-settings-hidden-quote-count', [
		h('span', ' ' + hiddenQuoteCount + ' hidden - '),
		h('a', { props: { href: '#' }, on: { click: hiddenQuoteReset } }, 'Reset'),
	]);

	const customQuotes = () => {
		if (state.customQuotes.length > 0) {
			return h('label', state.customQuotes.length + ' custom quotes');
		}
		return h(
			'label',
			'You can now add your own custom quotes! ' +
				'Just click the arrow menu beside the quote text.'
		);
	};

	return h('form.nfe-settings', [
		h('fieldset', [

const hasB = typeof b !== 'undefined';
    const hasC = typeof c !== 'undefined';
    if (isSelector(a)) {
      if (hasB && hasC) {
        return h(tagName + a, b, c);
      } else if (hasB) {
        return h(tagName + a, b);
      } else {
        return h(tagName + a, {});
      }
    } else if (hasC) {
      return h(tagName + a, b, c);
    } else if (hasB) {
      return h(tagName, a, b);
    } else if (hasA) {
      return h(tagName, a);
    } else {
      return h(tagName, {});
    }
  };
}

text: string,
	toggleAction,
	disabled = false
) => {
	return h('label', [
		h('input', {
			props: {
				type: 'checkbox',
				checked,
				disabled,
			},
			on: {
				change: () => store.dispatch(toggleAction),
			},
		}),
		h('span', text),
	]);
};