diff --git a/src/assets/javascripts/extensions/jsx/index.ts b/src/assets/javascripts/extensions/jsx/index.ts index 3bd603a6a..337ef8af2 100644 --- a/src/assets/javascripts/extensions/jsx/index.ts +++ b/src/assets/javascripts/extensions/jsx/index.ts @@ -83,7 +83,7 @@ function appendChild(el: Element, child: Child): void { export function h( tag: string, attributes: Attributes | null, ...children: Array -) { +): Element { const el = document.createElement(tag) /* Set attributes, if any */ @@ -102,6 +102,17 @@ export function h( return el } +/** + * JSX factory wrapper + * + * @param el - JSX element + * + * @return Element + */ +export function toElement(el: JSXInternal.Element): Element { + return el as any // Hack: if you have a better idea, PR! +} + /* ---------------------------------------------------------------------------- * Namespace * ------------------------------------------------------------------------- */ diff --git a/src/assets/javascripts/templates/search/_/index.tsx b/src/assets/javascripts/templates/search/_/index.tsx index 2796b96b2..dfddf7790 100644 --- a/src/assets/javascripts/templates/search/_/index.tsx +++ b/src/assets/javascripts/templates/search/_/index.tsx @@ -20,7 +20,7 @@ * IN THE SOFTWARE. */ -import { h } from "extensions" +import { h, toElement } from "extensions" import { SearchResult } from "modules" import { renderArticleDocument } from "../article" @@ -46,12 +46,12 @@ const css = { * * @param article - Search result * - * @return JSX element + * @return Element */ export function renderSearchResult( { article, sections }: SearchResult -) { - return ( +): Element { + return toElement(
  • {renderArticleDocument(article)} {...sections.map(renderSectionDocument)} diff --git a/src/assets/javascripts/templates/search/article/index.tsx b/src/assets/javascripts/templates/search/article/index.tsx index 5d4257193..ba51108e9 100644 --- a/src/assets/javascripts/templates/search/article/index.tsx +++ b/src/assets/javascripts/templates/search/article/index.tsx @@ -20,7 +20,7 @@ * IN THE SOFTWARE. */ -import { h } from "extensions" +import { h, toElement } from "extensions" import { ArticleDocument } from "modules" import { truncate } from "utilities" @@ -47,12 +47,12 @@ const css = { * * @param article - Article document * - * @return JSX element + * @return Element */ export function renderArticleDocument( { location, title, text }: ArticleDocument -) { - return ( +): Element { + return toElement(

    {title}

    diff --git a/src/assets/javascripts/templates/search/section/index.tsx b/src/assets/javascripts/templates/search/section/index.tsx index 1f776fd0e..43905d53d 100644 --- a/src/assets/javascripts/templates/search/section/index.tsx +++ b/src/assets/javascripts/templates/search/section/index.tsx @@ -20,7 +20,7 @@ * IN THE SOFTWARE. */ -import { h } from "extensions" +import { h, toElement } from "extensions" import { SectionDocument } from "modules" import { truncate } from "utilities" @@ -47,12 +47,12 @@ const css = { * * @param section - Section document * - * @return JSX element + * @return Element */ export function renderSectionDocument( { location, title, text }: SectionDocument -) { - return ( +): Element { + return toElement(

    {title}