@reykjavik/hanna-react 0.10.56 → 0.10.57

package/MainMenu/{_Auxiliary.jsx → _Auxiliary.js}

@@ -10,17 +10,11 @@ const Link_1 = require("../_abstract/Link");
 const AuxiliaryPanel = (props) => {
     const { title, id, items, image } = props;
     const imageUrl = image ? (0, assets_1.getIllustrationUrl)(image) : image;
-    return (<li className="AuxiliaryPanel" id={id} style={imageUrl
+    return (react_1.default.createElement("li", { className: "AuxiliaryPanel", id: id, style: imageUrl
             ? { '--menu-auxiliary-image': `url(${imageUrl})` }
-            : undefined}>
-      <h3 className="AuxiliaryPanel__title">{title}</h3>
-      <ul className="AuxiliaryPanel__items">
-        {items.map((item, i) => (<li key={i} className="AuxiliaryPanel__item" aria-current={item.current || undefined}>
-            <Link_1.Link className="AuxiliaryPanel__link" href={item.href} target={item.target} lang={item.lang}>
-              {item.label}
-            </Link_1.Link>
-          </li>))}
-      </ul>
-    </li>);
+            : undefined },
+        react_1.default.createElement("h3", { className: "AuxiliaryPanel__title" }, title),
+        react_1.default.createElement("ul", { className: "AuxiliaryPanel__items" }, items.map((item, i) => (react_1.default.createElement("li", { key: i, className: "AuxiliaryPanel__item", "aria-current": item.current || undefined },
+            react_1.default.createElement(Link_1.Link, { className: "AuxiliaryPanel__link", href: item.href, target: item.target, lang: item.lang }, item.label)))))));
 };
 exports.AuxiliaryPanel = AuxiliaryPanel;

package/MainMenu/_PrimaryPanel.js

@@ -0,0 +1,29 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PrimaryPanel = void 0;
+const react_1 = __importDefault(require("react"));
+const getBemClass_1 = __importDefault(require("@hugsmidjan/react/utils/getBemClass"));
+const Link_1 = require("../_abstract/Link");
+const PrimaryPanel = (props) => {
+    const { setActivePanel, panel, isParent, isActive, isBrowser, texts } = props;
+    const { items } = panel;
+    return (react_1.default.createElement("li", { ref: isActive ? props.activeRef : undefined, className: (0, getBemClass_1.default)('PrimaryPanel', [
+            isParent && 'parent',
+            isActive && 'active',
+            items.length > 5 && 'twocol', // TODO: allow setting twocol manually?
+        ]), id: panel.id },
+        react_1.default.createElement("h3", { className: "PrimaryPanel__title" },
+            ' ',
+            isBrowser && !isActive ? (react_1.default.createElement("button", { className: "MainMenu__mega__title-toggler", "aria-controls": panel.id, onClick: () => setActivePanel(panel, false), "aria-pressed": isActive, type: "button" }, panel.title)) : (panel.title)),
+        react_1.default.createElement("ul", { className: "PrimaryPanel__items" }, items.map((item, i) => (react_1.default.createElement("li", { key: i, className: "PrimaryPanel__item", "aria-current": item.current || undefined },
+            react_1.default.createElement(Link_1.Link, { className: "PrimaryPanel__link", href: item.href, target: item.target, lang: item.lang },
+                react_1.default.createElement("span", { className: "PrimaryPanel__linkTitle" }, item.label),
+                ' ',
+                react_1.default.createElement("small", { className: "PrimaryPanel__summary" }, item.summary),
+                ' '))))),
+        isBrowser && isActive && (react_1.default.createElement("button", { className: "MainMenu__megapanel__backtomenu", "aria-controls": panel.id, "aria-label": texts.backToMenuLong, onClick: () => setActivePanel(undefined), type: "button" }, texts.backToMenu))));
+};
+exports.PrimaryPanel = PrimaryPanel;

package/{MainMenu.jsx → MainMenu.js}

@@ -130,49 +130,36 @@ const MainMenu = (props) => {
     if (menuItems.length === 0) {
         return null;
     }
-    return (<nav className="MainMenu" aria-label={title} data-sprinkled={isBrowser} ref={menuElmRef}>
-      <h2 className="MainMenu__title">{title}</h2>
-      <ul className="MainMenu__items">
-        {menuItems.map((item, i) => {
+    return (react_1.default.createElement("nav", { className: "MainMenu", "aria-label": title, "data-sprinkled": isBrowser, ref: menuElmRef },
+        react_1.default.createElement("h2", { className: "MainMenu__title" }, title),
+        react_1.default.createElement("ul", { className: "MainMenu__items" }, menuItems.map((item, i) => {
             if (item === '---') {
-                return <li key={i} className="MainMenu__separator" aria-hidden="true"/>;
+                return react_1.default.createElement("li", { key: i, className: "MainMenu__separator", "aria-hidden": "true" });
             }
             const { label, labelLong, lang, controlsId, onClick } = item;
             const pressed = (activePanel && controlsId === activePanel.id) || undefined;
-            return (<li key={i} className={(0, getBemClass_1.default)('MainMenu__item', item.modifier)} aria-current={item.current || undefined}>
-              {onClick || (!!item.megaPanel && (isBrowser || item.href != null)) ? (
-                // only print script-driven buttons in the browser
-                <button className="MainMenu__link" onClick={() => {
-                        item.megaPanel && setActivePanel(item.megaPanel);
-                        onClick && onClick(i, item);
-                        onItemClick && onItemClick(i, item);
-                    }} ref={pressed && pressedLinkRef} aria-pressed={pressed} aria-controls={controlsId} aria-label={labelLong} title={labelLong} // For auto-tooltips on desktop
-                 lang={lang} type="button">
-                    {label}
-                  </button>) : item.href != null ? (
-                // always render links server-side
-                <Link_1.Link className="MainMenu__link" href={item.href} aria-label={labelLong} title={labelLong} // For auto-tooltips on desktop
-                 onClick={onItemClick && (() => onItemClick(i, item))} lang={lang}>
-                    {label}
-                  </Link_1.Link>) : undefined // skip rendering non-link menu items server side
-                }
-            </li>);
-        })}
-      </ul>
-      {'\n\n'}
-      {megaPanels.length > 0 && (<div className={(0, getBemClass_1.default)('MainMenu__panelsWrap', [activePanel && 'active'])}>
-          <ul className="MainMenu__panels">
-            {megaPanels.map((panel, i) => {
-                if (!panel.items.length) {
-                    return;
-                }
-                const isActive = activePanel === panel || laggyActivePanel === panel || undefined;
-                const isParent = !!panel.items.find((item) => item.current);
-                return (<_PrimaryPanel_1.PrimaryPanel key={i} isParent={isParent} isActive={isActive} panel={panel} isBrowser={isBrowser} setActivePanel={setActivePanel} texts={(0, i18n_1.getTexts)(props, exports.defaultMainMenuTexts)} activeRef={activePanelRef}/>);
-            })}
-            {auxiliaryPanel && <_Auxiliary_1.AuxiliaryPanel {...auxiliaryPanel}/>}
-          </ul>
-        </div>)}
-    </nav>);
+            return (react_1.default.createElement("li", { key: i, className: (0, getBemClass_1.default)('MainMenu__item', item.modifier), "aria-current": item.current || undefined }, onClick || (!!item.megaPanel && (isBrowser || item.href != null)) ? (
+            // only print script-driven buttons in the browser
+            react_1.default.createElement("button", { className: "MainMenu__link", onClick: () => {
+                    item.megaPanel && setActivePanel(item.megaPanel);
+                    onClick && onClick(i, item);
+                    onItemClick && onItemClick(i, item);
+                }, ref: pressed && pressedLinkRef, "aria-pressed": pressed, "aria-controls": controlsId, "aria-label": labelLong, title: labelLong, lang: lang, type: "button" }, label)) : item.href != null ? (
+            // always render links server-side
+            react_1.default.createElement(Link_1.Link, { className: "MainMenu__link", href: item.href, "aria-label": labelLong, title: labelLong, onClick: onItemClick && (() => onItemClick(i, item)), lang: lang }, label)) : undefined // skip rendering non-link menu items server side
+            ));
+        })),
+        '\n\n',
+        megaPanels.length > 0 && (react_1.default.createElement("div", { className: (0, getBemClass_1.default)('MainMenu__panelsWrap', [activePanel && 'active']) },
+            react_1.default.createElement("ul", { className: "MainMenu__panels" },
+                megaPanels.map((panel, i) => {
+                    if (!panel.items.length) {
+                        return;
+                    }
+                    const isActive = activePanel === panel || laggyActivePanel === panel || undefined;
+                    const isParent = !!panel.items.find((item) => item.current);
+                    return (react_1.default.createElement(_PrimaryPanel_1.PrimaryPanel, { key: i, isParent: isParent, isActive: isActive, panel: panel, isBrowser: isBrowser, setActivePanel: setActivePanel, texts: (0, i18n_1.getTexts)(props, exports.defaultMainMenuTexts), activeRef: activePanelRef }));
+                }),
+                auxiliaryPanel && react_1.default.createElement(_Auxiliary_1.AuxiliaryPanel, Object.assign({}, auxiliaryPanel)))))));
 };
 exports.default = MainMenu;

package/{MiniMetrics.jsx → MiniMetrics.js}

@@ -8,9 +8,10 @@ const Button_1 = __importDefault(require("./_abstract/Button"));
 const SeenEffect_1 = __importDefault(require("./SeenEffect"));
 const MiniMetrics = (props) => {
     const { text, moreButton, startSeen } = props;
-    return (<SeenEffect_1.default className="MiniMetrics" startSeen={startSeen}>
-      <strong className="MiniMetrics__text">{text}</strong> {'\n'}
-      <Button_1.default bem="MiniMetrics__more" {...moreButton}/>
-    </SeenEffect_1.default>);
+    return (react_1.default.createElement(SeenEffect_1.default, { className: "MiniMetrics", startSeen: startSeen },
+        react_1.default.createElement("strong", { className: "MiniMetrics__text" }, text),
+        " ",
+        '\n',
+        react_1.default.createElement(Button_1.default, Object.assign({ bem: "MiniMetrics__more" }, moreButton))));
 };
 exports.default = MiniMetrics;

package/Modal.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const Modal_1 = __importDefault(require("@hugsmidjan/react/Modal"));
+const Modal = (props) => {
+    const { closeDelay = 500, texts = {
+        closeButton: 'Loka ',
+    }, bling, children, render = () => children, } = props;
+    return (react_1.default.createElement(Modal_1.default, Object.assign({}, props, { bodyWrap: false, bem: "Modal", closeDelay: closeDelay, texts: texts, render: (args) => bling ? (react_1.default.createElement(react_1.default.Fragment, null,
+            render(args),
+            react_1.default.createElement("div", { className: "Modal__blings" },
+                react_1.default.createElement("div", { className: "Modal__blings__inner" }, bling)))) : (render(args)), 
+        // eslint-disable-next-line react/no-children-prop
+        children: undefined })));
+};
+exports.default = Modal;

package/{NameCard.jsx → NameCard.js}

@@ -48,16 +48,16 @@ const NameCard = (props) => {
         }
         const texts = (0, i18n_1.getTexts)(props, defaultTexts);
         const { updatedLabel, availableLabel, unavailableLabel } = texts;
-        return (<div className="NameCard__meta">
-        {available != null && (<span className={(0, getBemClass_1.default)('NameCard__availability', available && 'available')}>
-            {available
+        return (react_1.default.createElement("div", { className: "NameCard__meta" },
+            available != null && (react_1.default.createElement("span", { className: (0, getBemClass_1.default)('NameCard__availability', available && 'available') },
+                available
                     ? availableLabel || texts.vacancyLabel
-                    : unavailableLabel || texts.noVacancyLabel}{' '}
-          </span>)}
-        {updated != null && (<span className="NameCard__updated">
-            {updatedLabel} {formatDate(updated)}
-          </span>)}
-      </div>);
+                    : unavailableLabel || texts.noVacancyLabel,
+                ' ')),
+            updated != null && (react_1.default.createElement("span", { className: "NameCard__updated" },
+                updatedLabel,
+                " ",
+                formatDate(updated)))));
     };
     let contactInfo = props.contactInfo;
     if (!contactInfo) {
@@ -74,19 +74,14 @@ const NameCard = (props) => {
         }
         return item;
     });
-    return (<div className="NameCard">
-      <div className="NameCard__name">{name}</div>
-      {contactInfo.length > 0 && (<p className="NameCard__contactinfo">
-          {cleanContactInfo.map((item, i) => (<>
-              {typeof item === 'string' ? (<span className="NameCard__contactinfo__item">{item}</span>) : (<Button_1.default key={i} bem="NameCard__contactinfo__item" href={item.href} aria-label={item.longLabel} title={item.longLabel}>
-                  {item.label}
-                </Button_1.default>)}{' '}
-            </>))}
-        </p>)}
-      {location && <p className="NameCard__location">{renderContent(location)}</p>}
-      {hours && <p className="NameCard__hours">{renderContent(hours)}</p>}
-      {aboutText && <p className="NameCard__abouttext">{renderContent(aboutText)}</p>}
-      {renderMeta()}
-    </div>);
+    return (react_1.default.createElement("div", { className: "NameCard" },
+        react_1.default.createElement("div", { className: "NameCard__name" }, name),
+        contactInfo.length > 0 && (react_1.default.createElement("p", { className: "NameCard__contactinfo" }, cleanContactInfo.map((item, i) => (react_1.default.createElement(react_1.default.Fragment, null,
+            typeof item === 'string' ? (react_1.default.createElement("span", { className: "NameCard__contactinfo__item" }, item)) : (react_1.default.createElement(Button_1.default, { key: i, bem: "NameCard__contactinfo__item", href: item.href, "aria-label": item.longLabel, title: item.longLabel }, item.label)),
+            ' '))))),
+        location && react_1.default.createElement("p", { className: "NameCard__location" }, renderContent(location)),
+        hours && react_1.default.createElement("p", { className: "NameCard__hours" }, renderContent(hours)),
+        aboutText && react_1.default.createElement("p", { className: "NameCard__abouttext" }, renderContent(aboutText)),
+        renderMeta()));
 };
 exports.default = NameCard;

package/{NameCards.jsx → NameCards.js}

@@ -7,8 +7,6 @@ const react_1 = __importDefault(require("react"));
 const NameCard_1 = __importDefault(require("./NameCard"));
 const NameCards = (props) => {
     const { items } = props;
-    return (<div className="NameCards">
-      {items.map((item, i) => (<NameCard_1.default key={i} {...item}/>))}
-    </div>);
+    return (react_1.default.createElement("div", { className: "NameCards" }, items.map((item, i) => (react_1.default.createElement(NameCard_1.default, Object.assign({ key: i }, item))))));
 };
 exports.default = NameCards;

package/{NewsHero.jsx → NewsHero.js}

@@ -80,14 +80,12 @@ const NewsHero = (props) => {
     const { title, sharing = true, meta, summary, image, blingType, startSeen } = props;
     const [ref] = (0, seenEffect_1.useSeenEffect)(startSeen);
     const blings = (blingType && blingOptions[blingType]) || (0, hanna_utils_1.getStableRandomItem)(blingOptions, title);
-    return (<div className={(0, getBemClass_1.default)('NewsHero', [!image && 'align--right'])} ref={ref}>
-      <div className="NewsHero__content">
-        <h1 className="NewsHero__title">{title}</h1>
-        {meta && <span className="NewsHero__meta">{meta}</span>}
-        <div className="NewsHero__summary">{summary}</div>
-        {sharing === true ? <ShareButtons_1.default /> : sharing && sharing()}
-      </div>
-      {image ? (<Image_1.default className="NewsHero__image" {...image}/>) : (<_Blings_1.default blings={blings}/>)}
-    </div>);
+    return (react_1.default.createElement("div", { className: (0, getBemClass_1.default)('NewsHero', [!image && 'align--right']), ref: ref },
+        react_1.default.createElement("div", { className: "NewsHero__content" },
+            react_1.default.createElement("h1", { className: "NewsHero__title" }, title),
+            meta && react_1.default.createElement("span", { className: "NewsHero__meta" }, meta),
+            react_1.default.createElement("div", { className: "NewsHero__summary" }, summary),
+            sharing === true ? react_1.default.createElement(ShareButtons_1.default, null) : sharing && sharing()),
+        image ? (react_1.default.createElement(Image_1.default, Object.assign({ className: "NewsHero__image" }, image))) : (react_1.default.createElement(_Blings_1.default, { blings: blings }))));
 };
 exports.default = NewsHero;

package/{PageFilter.jsx → PageFilter.js}

@@ -10,12 +10,11 @@ const Footnote_1 = __importDefault(require("./Footnote"));
 const PageFilter = (props) => {
     const { title, summary, footnote, filters, children, buttonRow, underlap, startSeen } = props;
     const [ref] = (0, seenEffect_1.useSeenEffect)(startSeen);
-    return (<div className={(0, getBemClass_1.default)('PageFilter', underlap && 'underlap')} ref={ref}>
-      <h2 className="PageFilter__title">{title}</h2>
-      {summary && <div className="PageFilter__summary">{summary}</div>}
-      <div className="PageFilter__filters">{filters || children}</div>
-      <div className="PageFilter__buttons">{buttonRow}</div>
-      {footnote && <Footnote_1.default>{footnote}</Footnote_1.default>}
-    </div>);
+    return (react_1.default.createElement("div", { className: (0, getBemClass_1.default)('PageFilter', underlap && 'underlap'), ref: ref },
+        react_1.default.createElement("h2", { className: "PageFilter__title" }, title),
+        summary && react_1.default.createElement("div", { className: "PageFilter__summary" }, summary),
+        react_1.default.createElement("div", { className: "PageFilter__filters" }, filters || children),
+        react_1.default.createElement("div", { className: "PageFilter__buttons" }, buttonRow),
+        footnote && react_1.default.createElement(Footnote_1.default, null, footnote)));
 };
 exports.default = PageFilter;

package/{PageHeading.jsx → PageHeading.js}

@@ -9,11 +9,9 @@ const seenEffect_1 = require("./utils/seenEffect");
 const PageHeading = (props) => {
     const { Tag = 'h1', align, small, children, startSeen } = props;
     const [ref] = (0, seenEffect_1.useSeenEffect)(startSeen);
-    return (<Tag className={(0, getBemClass_1.default)('PageHeading', [
+    return (react_1.default.createElement(Tag, { className: (0, getBemClass_1.default)('PageHeading', [
             small && 'small',
             align === 'right' && 'align--' + align,
-        ])} ref={ref}>
-      {children}
-    </Tag>);
+        ]), ref: ref }, children));
 };
 exports.default = PageHeading;

package/ProcessOverview.js

@@ -0,0 +1,22 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const getBemClass_1 = __importDefault(require("@hugsmidjan/react/utils/getBemClass"));
+const ProcessOverview = (props) => {
+    const { title, items, attention, transparent, narrow } = props;
+    return (react_1.default.createElement("div", { className: (0, getBemClass_1.default)('ProcessOverview', [
+            transparent && 'transparent',
+            narrow && 'narrow',
+        ]) },
+        react_1.default.createElement("h2", { className: "ProcessOverview__title" }, title),
+        items.map(({ title, content }, i) => {
+            return (react_1.default.createElement("div", { key: i, className: "ProcessOverview__item" },
+                react_1.default.createElement("h3", { className: "ProcessOverview__item__title" }, title),
+                react_1.default.createElement("div", { className: "ProcessOverview__item__content" }, content)));
+        }),
+        attention && react_1.default.createElement("div", { className: "ProcessOverview__attention" }, attention)));
+};
+exports.default = ProcessOverview;

package/{PullQuote.jsx → PullQuote.js}

@@ -5,5 +5,5 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const _Quote_1 = require("./_abstract/_Quote");
-const PullQuote = (props) => <_Quote_1._Quote bem="PullQuote" {...props}/>;
+const PullQuote = (props) => react_1.default.createElement(_Quote_1._Quote, Object.assign({ bem: "PullQuote" }, props));
 exports.default = PullQuote;

package/{RadioButtonsGroup.jsx → RadioButtonsGroup.js}

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const TogglerGroupField_1 = __importDefault(require("./_abstract/TogglerGroupField"));
 const TogglerInput_1 = __importDefault(require("./_abstract/TogglerInput"));
-const RadioButton = (props) => (<TogglerInput_1.default {...props} bem="RadioButton" type="radio"/>);
+const RadioButton = (props) => (react_1.default.createElement(TogglerInput_1.default, Object.assign({}, props, { bem: "RadioButton", type: "radio" })));
 const RadioButtonsGroup = (props) => {
     if (props.layout) {
         console.warn('`RadioButtonsGroupProps.layout` is deprecated.');
@@ -14,6 +14,6 @@ const RadioButtonsGroup = (props) => {
     if (props.columns) {
         console.warn('`RadioButtonsGroupProps.columns` is deprecated.');
     }
-    return <TogglerGroupField_1.default {...props} bem="RadioButtonsGroup" Toggler={RadioButton}/>;
+    return react_1.default.createElement(TogglerGroupField_1.default, Object.assign({}, props, { bem: "RadioButtonsGroup", Toggler: RadioButton }));
 };
 exports.default = RadioButtonsGroup;

package/{RadioGroup.jsx → RadioGroup.js}

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const TogglerGroupField_1 = __importDefault(require("./_abstract/TogglerGroupField"));
 const TogglerInput_1 = __importDefault(require("./_abstract/TogglerInput"));
-const Radio = (props) => (<TogglerInput_1.default {...props} bem="Radio" type="radio"/>);
-const RadioGroup = (props) => (<TogglerGroupField_1.default {...props} bem="RadioGroup" modifier={props.layout} Toggler={Radio}/>);
+const Radio = (props) => (react_1.default.createElement(TogglerInput_1.default, Object.assign({}, props, { bem: "Radio", type: "radio" })));
+const RadioGroup = (props) => (react_1.default.createElement(TogglerGroupField_1.default, Object.assign({}, props, { bem: "RadioGroup", modifier: props.layout, Toggler: Radio })));
 RadioGroup.__Radio = Radio;
 exports.default = RadioGroup;

package/{RelatedLinks.jsx → RelatedLinks.js}

@@ -17,19 +17,15 @@ const RelatedLinks = (props) => {
         return null;
     }
     const TitleTag = props.titleTag || 'h3';
-    return (<div className="RelatedLinks">
-      {title && <TitleTag className="RelatedLinks__title">{title}</TitleTag>}
-      <ul className="RelatedLinks__list">
-        {links.map(({ href, label, type, target }, i) => {
+    return (react_1.default.createElement("div", { className: "RelatedLinks" },
+        title && react_1.default.createElement(TitleTag, { className: "RelatedLinks__title" }, title),
+        react_1.default.createElement("ul", { className: "RelatedLinks__list" }, links.map(({ href, label, type, target }, i) => {
             type = type && types[type] ? type : undefined;
-            return (<li key={i} className="RelatedLinks__item">
-              <Link_1.Link className="RelatedLinks__link" href={href} data-type={type} target={target}>
-                {' '}
-                {label}{' '}
-              </Link_1.Link>
-            </li>);
-        })}
-      </ul>
-    </div>);
+            return (react_1.default.createElement("li", { key: i, className: "RelatedLinks__item" },
+                react_1.default.createElement(Link_1.Link, { className: "RelatedLinks__link", href: href, "data-type": type, target: target },
+                    ' ',
+                    label,
+                    ' ')));
+        }))));
 };
 exports.default = RelatedLinks;

package/{RowBlock.jsx → RowBlock.js}

@@ -9,8 +9,6 @@ const seenEffect_1 = require("./utils/seenEffect");
 const RowBlock = (props) => {
     const { right, modifier, className, children, startSeen } = props;
     const [ref] = (0, seenEffect_1.useSeenEffect)(startSeen);
-    return (<div className={(0, getBemClass_1.default)('RowBlock', [modifier, right && 'align--right'], className)} ref={ref}>
-      {children}
-    </div>);
+    return (react_1.default.createElement("div", { className: (0, getBemClass_1.default)('RowBlock', [modifier, right && 'align--right'], className), ref: ref }, children));
 };
 exports.default = RowBlock;

package/{RowBlockColumn.jsx → RowBlockColumn.js}

@@ -7,12 +7,10 @@ const react_1 = __importDefault(require("react"));
 const getBemClass_1 = __importDefault(require("@hugsmidjan/react/utils/getBemClass"));
 const RowBlockColumn = (props) => {
     const { background, narrow, children } = props;
-    return (<div className={(0, getBemClass_1.default)('RowBlockColumn', [
+    return (react_1.default.createElement("div", { className: (0, getBemClass_1.default)('RowBlockColumn', [
             narrow && 'narrow',
             background && 'background',
             background === 'primary' && 'background--primary',
-        ])}>
-      {children}
-    </div>);
+        ]) }, children));
 };
 exports.default = RowBlockColumn;

package/{SearchInput.jsx → SearchInput.js}

@@ -53,11 +53,9 @@ const SearchInput = (props) => {
             setHasValue(!!e.target.value);
             onChange && onChange(e);
         };
-    return (<FormField_1.default className={(0, getBemClass_1.default)('SearchInput', [], className)} ssr={ssr} small={small} label={label} empty={empty} filled={filled} assistText={assistText} hideLabel={hideLabel} disabled={disabled} readOnly={readOnly} invalid={invalid} errorMessage={errorMessage} required={required} reqText={reqText} id={id} renderInput={(className, inputProps, addFocusProps) => (<div className={className.input} {...addFocusProps()}>
-          <input className="SearchInput__input" onChange={_onChange} {...inputProps} {...inputElementProps} ref={props.inputRef}/>{' '}
-          {onButtonClick && (<button className="SearchInput__button" type="button" onClick={onButtonClick} title={buttonText} ref={props.buttonRef}>
-              {buttonText}
-            </button>)}
-        </div>)}/>);
+    return (react_1.default.createElement(FormField_1.default, { className: (0, getBemClass_1.default)('SearchInput', [], className), ssr: ssr, small: small, label: label, empty: empty, filled: filled, assistText: assistText, hideLabel: hideLabel, disabled: disabled, readOnly: readOnly, invalid: invalid, errorMessage: errorMessage, required: required, reqText: reqText, id: id, renderInput: (className, inputProps, addFocusProps) => (react_1.default.createElement("div", Object.assign({ className: className.input }, addFocusProps()),
+            react_1.default.createElement("input", Object.assign({ className: "SearchInput__input", onChange: _onChange }, inputProps, inputElementProps, { ref: props.inputRef })),
+            ' ',
+            onButtonClick && (react_1.default.createElement("button", { className: "SearchInput__button", type: "button", onClick: onButtonClick, title: buttonText, ref: props.buttonRef }, buttonText)))) }));
 };
 exports.default = SearchInput;

package/SearchResults/_SearchResultsItem.js

@@ -0,0 +1,20 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const Image_1 = __importDefault(require("../_abstract/Image"));
+const Link_1 = require("../_abstract/Link");
+const SearchResultsItem = (props) => {
+    const { highlight, title, summary, href, meta, image } = props;
+    const bem = highlight ? 'SearchResultsHighlightItem' : 'SearchResultsItem';
+    const metaArr = (Array.isArray(meta) ? meta : [meta]);
+    return (react_1.default.createElement("li", { className: bem },
+        react_1.default.createElement(Link_1.Link, { className: bem + '__link', href: href },
+            react_1.default.createElement("h3", { className: bem + '__title' }, title),
+            metaArr.length > 0 && (react_1.default.createElement("span", { className: bem + '__meta' }, metaArr.map((item, i) => typeof item === 'function' ? item() : item && react_1.default.createElement("span", { key: i }, item)))),
+            highlight && image && react_1.default.createElement(Image_1.default, { className: bem + '__image', src: image }),
+            react_1.default.createElement("div", { className: bem + '__summary', dangerouslySetInnerHTML: { __html: summary } }))));
+};
+exports.default = SearchResultsItem;

package/{SearchResults.jsx → SearchResults.js}

@@ -36,11 +36,10 @@ const i18n_1 = require("@reykjavik/hanna-utils/i18n");
 const _SearchResultsItem_1 = __importDefault(require("./SearchResults/_SearchResultsItem"));
 const Alert_1 = __importDefault(require("./Alert"));
 const Tabs_1 = __importDefault(require("./Tabs"));
-const renderDefaultErrorText = () => (<>
-    Úps, það hefur komið upp villa. Má bjóða þér að prófa aftur að leita?
-    <br />
-    Ef ekkert lát er á villunni þá kunnum við að meta að þú látir okkur vita.
-  </>);
+const renderDefaultErrorText = () => (react_1.default.createElement(react_1.default.Fragment, null,
+    "\u00DAps, \u00FEa\u00F0 hefur komi\u00F0 upp villa. M\u00E1 bj\u00F3\u00F0a \u00FE\u00E9r a\u00F0 pr\u00F3fa aftur a\u00F0 leita?",
+    react_1.default.createElement("br", null),
+    "Ef ekkert l\u00E1t er \u00E1 villunni \u00FE\u00E1 kunnum vi\u00F0 a\u00F0 meta a\u00F0 \u00FE\u00FA l\u00E1tir okkur vita."));
 const defaultTexts = {
     en: {
         lang: 'en',
@@ -65,11 +64,9 @@ const SearchResults_Tabs = (props) => {
         label,
         badge: (0, prettyNum_1.prettyNum)(count, { lang }),
     })), [filters, lang]);
-    return tabs.length ? (<Tabs_1.default role="tablist" aria-controls={domid} tabs={tabs} activeIdx={activeIdx || 0} onSetActive={(i) => setFilter && setFilter(i)}/>) : null;
+    return tabs.length ? (react_1.default.createElement(Tabs_1.default, { role: "tablist", "aria-controls": domid, tabs: tabs, activeIdx: activeIdx || 0, onSetActive: (i) => setFilter && setFilter(i) })) : null;
 };
-const LoadingScaffold = (props) => props.count ? (<ol className="SearchResults__list SearchResults__list--loading">
-      {(0, range_1.default)(1, props.count).map((item, i) => (<_SearchResultsItem_1.default key={i} title="..." summary="" href=""/>))}
-    </ol>) : null;
+const LoadingScaffold = (props) => props.count ? (react_1.default.createElement("ol", { className: "SearchResults__list SearchResults__list--loading" }, (0, range_1.default)(1, props.count).map((item, i) => (react_1.default.createElement(_SearchResultsItem_1.default, { key: i, title: "...", summary: "", href: "" }))))) : null;
 // ===========================================================================
 const NUM_AUTOLOADS = 2;
 const SearchResults__loadmore = (props) => {
@@ -89,58 +86,52 @@ const SearchResults__loadmore = (props) => {
         }
     }, [theEndIsNigh, loadMore]);
     const moreAvailable = status === 'results' && moreCount && loadMore;
-    return status === 'loadingmore' ? (<LoadingScaffold count={Math.min(pageSize, moreCount)}/>) : moreAvailable ? (<button ref={refFn} className="SearchResults__loadmore" type="button" onClick={loadMore}>
-      {texts.loadMore}{' '}
-      <span className="SearchResults__loadmore__count">
-        ({(0, prettyNum_1.prettyNum)(moreCount, { lang })})
-      </span>
-    </button>) : null;
+    return status === 'loadingmore' ? (react_1.default.createElement(LoadingScaffold, { count: Math.min(pageSize, moreCount) })) : moreAvailable ? (react_1.default.createElement("button", { ref: refFn, className: "SearchResults__loadmore", type: "button", onClick: loadMore },
+        texts.loadMore,
+        ' ',
+        react_1.default.createElement("span", { className: "SearchResults__loadmore__count" },
+            "(",
+            (0, prettyNum_1.prettyNum)(moreCount, { lang }),
+            ")"))) : null;
 };
 // ===========================================================================
 const renderTitle = (props, texts) => {
     const { status, totalHits, query } = props;
     const lang = texts.lang || props.lang || i18n_1.DEFAULT_LANG;
-    return (<h2 className="SearchResults__title">
-      {status === 'loadingquery'
+    return (react_1.default.createElement("h2", { className: "SearchResults__title" },
+        status === 'loadingquery'
             ? texts.loadQueryTitle
             : totalHits
                 ? (0, prettyNum_1.prettyNum)(totalHits, { lang: lang }) +
                     ' ' +
                     texts.resultsTitle
-                : texts.noResultsTitle}
-      <span className="SearchResults__query">{query}</span>
-    </h2>);
+                : texts.noResultsTitle,
+        react_1.default.createElement("span", { className: "SearchResults__query" }, query)));
 };
 // ---------------------------------------------------------------------------
 const renderResults = (props) => {
     const { status, pageSize, items, hits } = props;
     if (status === 'loadingquery' || status === 'loadingfilter') {
-        return <LoadingScaffold count={Math.min(pageSize, hits || 999)}/>;
+        return react_1.default.createElement(LoadingScaffold, { count: Math.min(pageSize, hits || 999) });
     }
-    return items && items.length ? (<ol className="SearchResults__list">
-      {items.map((item, i) => (<_SearchResultsItem_1.default key={i} {...item}/>))}
-    </ol>) : null;
+    return items && items.length ? (react_1.default.createElement("ol", { className: "SearchResults__list" }, items.map((item, i) => (react_1.default.createElement(_SearchResultsItem_1.default, Object.assign({ key: i }, item)))))) : null;
 };
 // ---------------------------------------------------------------------------
 const renderLoadMore = (props, texts) => {
     const { hits, items, status, pageSize, loadMore } = props;
-    return (<SearchResults__loadmore hits={hits} numItems={items && items.length} status={status} pageSize={pageSize} loadMore={loadMore} texts={texts}/>);
+    return (react_1.default.createElement(SearchResults__loadmore, { hits: hits, numItems: items && items.length, status: status, pageSize: pageSize, loadMore: loadMore, texts: texts }));
 };
 // TODO: add plural translation thingy for result string
 const SearchResults = (props) => {
     const { filters, activeFilterIdx, setFilter, status, errorText } = props;
     const texts = (0, i18n_1.getTexts)(props, defaultTexts);
     const domid = (0, hooks_1.useDomid)();
-    return (<div className={(0, getBemClass_1.default)('SearchResults', status !== 'results' && status)}>
-      {renderTitle(props, texts)}
-
-      <SearchResults_Tabs domid={domid} filters={filters} activeIdx={activeFilterIdx} setFilter={setFilter} lang={texts.lang}/>
-
-      <div className="SearchResults__results" id={domid}>
-        {renderResults(props)}
-        {status === 'error' && (<Alert_1.default type="error">{errorText || renderDefaultErrorText()}</Alert_1.default>)}
-        {renderLoadMore(props, texts)}
-      </div>
-    </div>);
+    return (react_1.default.createElement("div", { className: (0, getBemClass_1.default)('SearchResults', status !== 'results' && status) },
+        renderTitle(props, texts),
+        react_1.default.createElement(SearchResults_Tabs, { domid: domid, filters: filters, activeIdx: activeFilterIdx, setFilter: setFilter, lang: texts.lang }),
+        react_1.default.createElement("div", { className: "SearchResults__results", id: domid },
+            renderResults(props),
+            status === 'error' && (react_1.default.createElement(Alert_1.default, { type: "error" }, errorText || renderDefaultErrorText())),
+            renderLoadMore(props, texts))));
 };
 exports.default = SearchResults;

package/{SeenEffect.jsx → SeenEffect.js}

@@ -19,6 +19,6 @@ const seenEffect_1 = require("./utils/seenEffect");
 const SeenEffect = (props) => {
     const { effectType, startSeen } = props, divProps = __rest(props, ["effectType", "startSeen"]);
     const [ref] = (0, seenEffect_1.useSeenEffect)(startSeen);
-    return <div {...divProps} ref={ref} {...(0, seenEffect_1.getEffectAttr)(effectType)}/>;
+    return react_1.default.createElement("div", Object.assign({}, divProps, { ref: ref }, (0, seenEffect_1.getEffectAttr)(effectType)));
 };
 exports.default = SeenEffect;