@searchcraft/javascript-sdk 0.15.1 → 0.16.0

package/dist/types/components.d.ts

@@ -5,9 +5,9 @@
  * It contains typing information for all components that exist in this project.
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
-import { AdClientResponseItem, FilterItem, PopoverButtonTemplate, PopoverResultMappings, ResultsInfoTemplate, SearchClientResponseItem, SearchResultTemplate, SearchResultTemplateData } from "./types/index";
+import { AdClientResponseItem, FilterItem, PopoverButtonTemplate, PopoverNoResultsTemplate, PopoverResultMappings, ResultsInfoTemplate, SearchClientResponseItem, SearchResultTemplate, SearchResultTemplateData } from "./types/index";
 import { SearchcraftSelectOption } from "./components/searchcraft-select/searchcraft-select";
-export { AdClientResponseItem, FilterItem, PopoverButtonTemplate, PopoverResultMappings, ResultsInfoTemplate, SearchClientResponseItem, SearchResultTemplate, SearchResultTemplateData } from "./types/index";
+export { AdClientResponseItem, FilterItem, PopoverButtonTemplate, PopoverNoResultsTemplate, PopoverResultMappings, ResultsInfoTemplate, SearchClientResponseItem, SearchResultTemplate, SearchResultTemplateData } from "./types/index";
 export { SearchcraftSelectOption } from "./components/searchcraft-select/searchcraft-select";
 export namespace Components {
     /**
@@ -349,6 +349,11 @@ export namespace Components {
      * ```
      */
     interface SearchcraftPopoverButton {
+        /**
+          * The placeholder text shown in the `skeuomorphic` button, and the accessible label of the `magnifying-glass` button. Set it to the same value as the `placeholderValue` of `searchcraft-popover-form` so the button matches the form it opens. When it is blank, the `magnifying-glass` button is labeled "Search".
+          * @default 'Search'
+         */
+        "placeholderValue"?: string;
         /**
           * The id of the Searchcraft instance that this component should use.
          */
@@ -400,6 +405,14 @@ export namespace Components {
      * // index.js
      * const popoverForm = document.querySelector('searchcraft-popover-form');
      * popoverForm.popoverResultMappings = {};
+     * // Or render each result with a template instead of `popoverResultMappings`.
+     * popoverForm.template = (item, index, { html, safeUrl }) => html`
+     *  <a href="${safeUrl(item.url)}">${item.title}</a>
+     * `;
+     * // Change the message shown when a search returns no results.
+     * popoverForm.noResultsTemplate = ({ searchTerm }, { html }) => html`
+     *  <p>Nothing matched "${searchTerm}".</p>
+     * `;
      * ```
      * @react-example ```jsx
      * <SearchcraftPopoverForm type="inline" popoverResultMappings={[]} />
@@ -419,6 +432,10 @@ export namespace Components {
           * @default 'meta'
          */
         "hotkeyModifier"?: 'ctrl' | 'meta' | 'alt' | 'option';
+        /**
+          * A callback function responsible for rendering the message shown when a search returns no results. When it is not provided, the popover shows `No results found for "<search term>".` The returned markup is sanitized with DOMPurify, which removes scripts, event handler attributes such as `onclick`, and links with schemes it does not allow, such as an app's own scheme.
+         */
+        "noResultsTemplate"?: PopoverNoResultsTemplate;
         /**
           * The placeholder's render behavior. 'hide-on-focus' - Hide the placeholder text immediately when the input form gains focus. 'hide-on-text-entered' - Only hide the placeholder when the input form has text entered into it.
          */
@@ -446,6 +463,10 @@ export namespace Components {
           * @default false
          */
         "showSummaryBox"?: boolean;
+        /**
+          * A callback function responsible for rendering a result. When provided, it is used instead of `popoverResultMappings`. Pass URLs from the result through the `safeUrl` helper before placing them in an `href` or `src`. Never place result values in event handler attributes such as `onclick`, or in `style`.
+         */
+        "template"?: SearchResultTemplate<SearchResultTemplateData>;
         /**
           * The type of popover form to render. - `inline` - Renders inline with the rest of the content on the page. The search results pop over the page content. - `fullscreen` - Renders in fullscreen view. Used together with the `searchcraft-popover-button` component. - `modal` - Renders in a modal view. Used together with the `searchcraft-popover-button` component.
           * @default 'inline'
@@ -469,12 +490,21 @@ export namespace Components {
           * @default 0
          */
         "documentPosition": number;
+        /**
+          * The index of the result in the list view. Passed to the `template` callback.
+          * @default 0
+         */
+        "index": number;
         "item": SearchClientResponseItem | undefined;
         "popoverResultMappings": PopoverResultMappings | undefined;
         /**
           * The id of the Searchcraft instance that this component should use.
          */
         "searchcraftId"?: string;
+        /**
+          * A callback function responsible for rendering the result. When provided, it is used instead of `popoverResultMappings`, which are still used if the template throws.
+         */
+        "template"?: SearchResultTemplate<SearchResultTemplateData>;
     }
     /**
      * This web component is designed to display a list of results within a popover interface.
@@ -499,6 +529,10 @@ export namespace Components {
           * The id of the Searchcraft instance that this component should use.
          */
         "searchcraftId"?: string;
+        /**
+          * A callback function responsible for rendering a result. Passed to `searchcraft-popover-list-item`.
+         */
+        "template"?: SearchResultTemplate<SearchResultTemplateData>;
     }
     /**
      * This web component is designed to display the number of results returned from a search query.
@@ -604,10 +638,7 @@ export namespace Components {
      * ```
      * @js-example ```html
      * <!-- index.html -->
-     * <searchcraft-search-results
-     *   ad-interval="4"
-     *   place-ad-at-start="true"
-     * />
+     * <searchcraft-search-results></searchcraft-search-results>
      * ```
      * ```js
      * // index.js
@@ -618,8 +649,6 @@ export namespace Components {
      * ```
      * @react-example ```jsx
      * <SearchcraftSearchResults
-     *   adInterval={4}
-     *   placeAdAtState={true}
      *   template={(item, index, { html }) => html`
      *     <h2>${item.title}</h2>
      *   `}
@@ -627,8 +656,6 @@ export namespace Components {
      * ```
      * @vue-example ```jsx
      * <SearchcraftSearchResults
-     *   adInterval={4}
-     *   placeAdAtState={true}
      *   :template={(item, index, { html }) => html`
      *     <h2>${item.title}</h2>
      *   `}
@@ -645,7 +672,7 @@ export namespace Components {
          */
         "searchcraftId"?: string;
         /**
-          * A callback function responsible for rendering a result. Passed to `searchcraft-search-result`.
+          * A callback function responsible for rendering a result. Passed to `searchcraft-search-result`. Pass URLs from the result through the `safeUrl` helper before placing them in an `href` or `src`. Never place result values in event handler attributes such as `onclick`, or in `style`.
          */
         "template"?: SearchResultTemplate<SearchResultTemplateData>;
     }
@@ -1121,6 +1148,14 @@ declare global {
      * // index.js
      * const popoverForm = document.querySelector('searchcraft-popover-form');
      * popoverForm.popoverResultMappings = {};
+     * // Or render each result with a template instead of `popoverResultMappings`.
+     * popoverForm.template = (item, index, { html, safeUrl }) => html`
+     *  <a href="${safeUrl(item.url)}">${item.title}</a>
+     * `;
+     * // Change the message shown when a search returns no results.
+     * popoverForm.noResultsTemplate = ({ searchTerm }, { html }) => html`
+     *  <p>Nothing matched "${searchTerm}".</p>
+     * `;
      * ```
      * @react-example ```jsx
      * <SearchcraftPopoverForm type="inline" popoverResultMappings={[]} />
@@ -1243,10 +1278,7 @@ declare global {
      * ```
      * @js-example ```html
      * <!-- index.html -->
-     * <searchcraft-search-results
-     *   ad-interval="4"
-     *   place-ad-at-start="true"
-     * />
+     * <searchcraft-search-results></searchcraft-search-results>
      * ```
      * ```js
      * // index.js
@@ -1257,8 +1289,6 @@ declare global {
      * ```
      * @react-example ```jsx
      * <SearchcraftSearchResults
-     *   adInterval={4}
-     *   placeAdAtState={true}
      *   template={(item, index, { html }) => html`
      *     <h2>${item.title}</h2>
      *   `}
@@ -1266,8 +1296,6 @@ declare global {
      * ```
      * @vue-example ```jsx
      * <SearchcraftSearchResults
-     *   adInterval={4}
-     *   placeAdAtState={true}
      *   :template={(item, index, { html }) => html`
      *     <h2>${item.title}</h2>
      *   `}
@@ -1804,6 +1832,11 @@ declare namespace LocalJSX {
      * ```
      */
     interface SearchcraftPopoverButton {
+        /**
+          * The placeholder text shown in the `skeuomorphic` button, and the accessible label of the `magnifying-glass` button. Set it to the same value as the `placeholderValue` of `searchcraft-popover-form` so the button matches the form it opens. When it is blank, the `magnifying-glass` button is labeled "Search".
+          * @default 'Search'
+         */
+        "placeholderValue"?: string;
         /**
           * The id of the Searchcraft instance that this component should use.
          */
@@ -1850,6 +1883,14 @@ declare namespace LocalJSX {
      * // index.js
      * const popoverForm = document.querySelector('searchcraft-popover-form');
      * popoverForm.popoverResultMappings = {};
+     * // Or render each result with a template instead of `popoverResultMappings`.
+     * popoverForm.template = (item, index, { html, safeUrl }) => html`
+     *  <a href="${safeUrl(item.url)}">${item.title}</a>
+     * `;
+     * // Change the message shown when a search returns no results.
+     * popoverForm.noResultsTemplate = ({ searchTerm }, { html }) => html`
+     *  <p>Nothing matched "${searchTerm}".</p>
+     * `;
      * ```
      * @react-example ```jsx
      * <SearchcraftPopoverForm type="inline" popoverResultMappings={[]} />
@@ -1869,6 +1910,10 @@ declare namespace LocalJSX {
           * @default 'meta'
          */
         "hotkeyModifier"?: 'ctrl' | 'meta' | 'alt' | 'option';
+        /**
+          * A callback function responsible for rendering the message shown when a search returns no results. When it is not provided, the popover shows `No results found for "<search term>".` The returned markup is sanitized with DOMPurify, which removes scripts, event handler attributes such as `onclick`, and links with schemes it does not allow, such as an app's own scheme.
+         */
+        "noResultsTemplate"?: PopoverNoResultsTemplate;
         /**
           * The placeholder's render behavior. 'hide-on-focus' - Hide the placeholder text immediately when the input form gains focus. 'hide-on-text-entered' - Only hide the placeholder when the input form has text entered into it.
          */
@@ -1891,6 +1936,10 @@ declare namespace LocalJSX {
           * @default false
          */
         "showSummaryBox"?: boolean;
+        /**
+          * A callback function responsible for rendering a result. When provided, it is used instead of `popoverResultMappings`. Pass URLs from the result through the `safeUrl` helper before placing them in an `href` or `src`. Never place result values in event handler attributes such as `onclick`, or in `style`.
+         */
+        "template"?: SearchResultTemplate<SearchResultTemplateData>;
         /**
           * The type of popover form to render. - `inline` - Renders inline with the rest of the content on the page. The search results pop over the page content. - `fullscreen` - Renders in fullscreen view. Used together with the `searchcraft-popover-button` component. - `modal` - Renders in a modal view. Used together with the `searchcraft-popover-button` component.
           * @default 'inline'
@@ -1914,12 +1963,21 @@ declare namespace LocalJSX {
           * @default 0
          */
         "documentPosition"?: number;
+        /**
+          * The index of the result in the list view. Passed to the `template` callback.
+          * @default 0
+         */
+        "index"?: number;
         "item"?: SearchClientResponseItem | undefined;
         "popoverResultMappings"?: PopoverResultMappings | undefined;
         /**
           * The id of the Searchcraft instance that this component should use.
          */
         "searchcraftId"?: string;
+        /**
+          * A callback function responsible for rendering the result. When provided, it is used instead of `popoverResultMappings`, which are still used if the template throws.
+         */
+        "template"?: SearchResultTemplate<SearchResultTemplateData>;
     }
     /**
      * This web component is designed to display a list of results within a popover interface.
@@ -1944,6 +2002,10 @@ declare namespace LocalJSX {
           * The id of the Searchcraft instance that this component should use.
          */
         "searchcraftId"?: string;
+        /**
+          * A callback function responsible for rendering a result. Passed to `searchcraft-popover-list-item`.
+         */
+        "template"?: SearchResultTemplate<SearchResultTemplateData>;
     }
     /**
      * This web component is designed to display the number of results returned from a search query.
@@ -2049,10 +2111,7 @@ declare namespace LocalJSX {
      * ```
      * @js-example ```html
      * <!-- index.html -->
-     * <searchcraft-search-results
-     *   ad-interval="4"
-     *   place-ad-at-start="true"
-     * />
+     * <searchcraft-search-results></searchcraft-search-results>
      * ```
      * ```js
      * // index.js
@@ -2063,8 +2122,6 @@ declare namespace LocalJSX {
      * ```
      * @react-example ```jsx
      * <SearchcraftSearchResults
-     *   adInterval={4}
-     *   placeAdAtState={true}
      *   template={(item, index, { html }) => html`
      *     <h2>${item.title}</h2>
      *   `}
@@ -2072,8 +2129,6 @@ declare namespace LocalJSX {
      * ```
      * @vue-example ```jsx
      * <SearchcraftSearchResults
-     *   adInterval={4}
-     *   placeAdAtState={true}
      *   :template={(item, index, { html }) => html`
      *     <h2>${item.title}</h2>
      *   `}
@@ -2090,7 +2145,7 @@ declare namespace LocalJSX {
          */
         "searchcraftId"?: string;
         /**
-          * A callback function responsible for rendering a result. Passed to `searchcraft-search-result`.
+          * A callback function responsible for rendering a result. Passed to `searchcraft-search-result`. Pass URLs from the result through the `safeUrl` helper before placing them in an `href` or `src`. Never place result values in event handler attributes such as `onclick`, or in `style`.
          */
         "template"?: SearchResultTemplate<SearchResultTemplateData>;
     }
@@ -2493,6 +2548,14 @@ declare module "@stencil/core" {
              * // index.js
              * const popoverForm = document.querySelector('searchcraft-popover-form');
              * popoverForm.popoverResultMappings = {};
+             * // Or render each result with a template instead of `popoverResultMappings`.
+             * popoverForm.template = (item, index, { html, safeUrl }) => html`
+             *  <a href="${safeUrl(item.url)}">${item.title}</a>
+             * `;
+             * // Change the message shown when a search returns no results.
+             * popoverForm.noResultsTemplate = ({ searchTerm }, { html }) => html`
+             *  <p>Nothing matched "${searchTerm}".</p>
+             * `;
              * ```
              * @react-example ```jsx
              * <SearchcraftPopoverForm type="inline" popoverResultMappings={[]} />
@@ -2585,10 +2648,7 @@ declare module "@stencil/core" {
              * ```
              * @js-example ```html
              * <!-- index.html -->
-             * <searchcraft-search-results
-             *   ad-interval="4"
-             *   place-ad-at-start="true"
-             * />
+             * <searchcraft-search-results></searchcraft-search-results>
              * ```
              * ```js
              * // index.js
@@ -2599,8 +2659,6 @@ declare module "@stencil/core" {
              * ```
              * @react-example ```jsx
              * <SearchcraftSearchResults
-             *   adInterval={4}
-             *   placeAdAtState={true}
              *   template={(item, index, { html }) => html`
              *     <h2>${item.title}</h2>
              *   `}
@@ -2608,8 +2666,6 @@ declare module "@stencil/core" {
              * ```
              * @vue-example ```jsx
              * <SearchcraftSearchResults
-             *   adInterval={4}
-             *   placeAdAtState={true}
              *   :template={(item, index, { html }) => html`
              *     <h2>${item.title}</h2>
              *   `}

package/dist/types/types/sdk-types/templates.types.d.ts

@@ -1,7 +1,39 @@
 import type { ADMAd } from '..';
 export type TemplateHtml = (strings: TemplateStringsArray, ...values: (string | number | undefined)[]) => string;
-export type SearchResultTemplate<T> = (data: T, index: number, utils: {
+/**
+ * Options for the `safeUrl` template helper.
+ */
+export type SafeUrlOptions = {
+    /**
+     * More URL schemes to allow, such as an app's own scheme (`['myapp']`). A link with such a
+     * scheme must be written in the template's own markup. If its markup is placed as a value in
+     * the text of another `html` call, DOMPurify removes the URL.
+     */
+    schemes?: string[];
+};
+/**
+ * Returns `url` unchanged when it is safe to place in an `href` or `src` attribute, and `#` when
+ * it is not. Relative URLs, `http:`, `https:`, `mailto:`, `tel:`, `sms:` and `data:image/` URLs
+ * are safe, along with any scheme passed in `options.schemes`.
+ */
+export type SafeUrl = (url: unknown, options?: SafeUrlOptions) => string;
+/**
+ * The helpers passed to every template.
+ */
+export type TemplateUtils = {
+    /**
+     * Builds the template's markup. Values in text are sanitized, and values in attributes are
+     * escaped so they stay inside their attribute. Values in event handler attributes such as
+     * `onclick`, or in `style`, are not made safe, so never place result values there.
+     */
     html: TemplateHtml;
+    /**
+     * Checks a URL before it is placed in an `href` or `src`. Returns `#` for unsafe URLs,
+     * such as `javascript:` URLs.
+     */
+    safeUrl: SafeUrl;
+};
+export type SearchResultTemplate<T> = (data: T, index: number, utils: TemplateUtils & {
     source_index?: string;
 }) => string;
 export type SearchResultTemplateData = any;
@@ -9,21 +41,16 @@ export type ResultsInfoTemplate = (data: {
     range: [number, number];
     count: number;
     responseTime: string;
-}, utils: {
-    html: TemplateHtml;
-}) => string;
+}, utils: TemplateUtils) => string;
 export type CustomAdTemplate = (data: {
     adContainerId: string;
     searchTerm: string;
-}, utils: {
-    html: TemplateHtml;
-}) => string;
+}, utils: TemplateUtils) => string;
 export type PopoverButtonTemplate = (data: {
     isPopoverVisible: boolean;
-}, utils: {
-    html: TemplateHtml;
-}) => string;
-export type ADMAdTemplate = (data: ADMAd, utils: {
-    html: TemplateHtml;
-}) => string;
+}, utils: TemplateUtils) => string;
+export type PopoverNoResultsTemplate = (data: {
+    searchTerm: string;
+}, utils: TemplateUtils) => string;
+export type ADMAdTemplate = (data: ADMAd, utils: TemplateUtils) => string;
 //# sourceMappingURL=templates.types.d.ts.map

package/dist/types/utils/html.d.ts

@@ -1,6 +1,28 @@
 import type { TemplateHtml } from "../types/index";
 /**
  * This allows you to parse a template string with a function.
+ *
+ * Each value is made safe for where it lands in the markup:
+ * - In text, the value is sanitized with DOMPurify, so it can contain markup but no scripts.
+ *   DOMPurify also removes URLs it does not allow, so a link with a custom scheme that `safeUrl`
+ *   allowed loses its `href` when its markup is placed as a value in text, as in a list built
+ *   from nested `html` calls. Write such links in the template's own markup instead.
+ * - In a quoted attribute value, the quote that would end the value is escaped. The browser
+ *   decodes it again, so quotes display as given. Character references in the value, such as
+ *   `&`, are decoded by the browser as before.
+ * - In an unquoted attribute value, spaces, quotes and `=<>` are escaped.
+ * - Inside a tag but not in an attribute value, such as `<a ${attributes}>`, the value is placed
+ *   as is. Use this only for attributes the template writes itself, such as the output of a
+ *   nested `html` call, never for indexed data.
+ *
+ * A template can also be a list of attributes, such as `aria-label="${label}"`, that another
+ * template places inside a tag. Until its first tag ends, a value that could be in an attribute
+ * value is escaped for that attribute, and `<` is escaped so it cannot start a tag either.
+ *
+ * Escaping keeps a value inside its attribute but does not make every attribute safe. A value in
+ * an event handler such as `onclick` still runs as script, and a value in `style` still applies
+ * as CSS. URLs from indexed data should go through `safeUrl` before they are placed in an
+ * `href` or `src`.
  */
 export declare const html: TemplateHtml;
 //# sourceMappingURL=html.d.ts.map

package/dist/types/utils/index.d.ts

@@ -1,4 +1,5 @@
 export * from './facets';
 export * from './units';
 export * from './html';
+export * from './safeUrl';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/utils/safeUrl.d.ts

@@ -0,0 +1,17 @@
+import type { SafeUrl } from "../types/index";
+/**
+ * Returns `url` unchanged when it is safe to place in an `href` or `src` attribute, and `#`
+ * when it is not.
+ *
+ * Relative URLs, `http:`, `https:`, `mailto:`, `tel:`, `sms:` and `data:image/` URLs are safe,
+ * along with any scheme passed in `options.schemes`. Every other scheme, such as `javascript:`,
+ * is blocked, including when it is written in mixed case, has leading spaces or contains tabs,
+ * newlines or character references.
+ *
+ * ```js
+ * html`<a href="${safeUrl(item.url)}">${item.title}</a>`;
+ * html`<a href="${safeUrl(item.appUrl, { schemes: ['myapp'] })}">Open in app</a>`;
+ * ```
+ */
+export declare const safeUrl: SafeUrl;
+//# sourceMappingURL=safeUrl.d.ts.map

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@searchcraft/javascript-sdk",
   "private": false,
-  "version": "0.15.1",
+  "version": "0.16.0",
   "description": "Searchcraft Javascript SDK",
   "author": "Searchcraft Inc.",
   "license": "Apache-2.0",
@@ -52,8 +52,9 @@
     "build": "stencil build",
     "docs": "typedoc --options typedoc.json",
     "dev": "stencil build --dev --watch",
-    "test": "stencil test --spec --e2e",
-    "test.watch": "stencil test --spec --e2e --watchAll",
+    "test": "vitest --watch=false",
+    "test.watch": "vitest",
+    "type-check": "tsc --noEmit -p tsconfig.json",
     "generate": "stencil generate"
   },
   "dependencies": {
@@ -66,11 +67,12 @@
     "@stencil/core": "4.39.0",
     "@stencil/react-output-target": "^1.2.0",
     "@stencil/sass": "^3.0.12",
+    "@stencil/vitest": "^1.16.1",
     "@stencil/vue-output-target": "^0.9.2",
     "@thumbmarkjs/thumbmarkjs": "^0.16.1",
-    "@types/node": "^16.18.11",
+    "@types/node": "^24.19.2",
     "nanoid": "^5.0.9",
     "zustand": "^5.0.1"
   },
-  "gitHead": "61b925588b1d955078e63a17eb5c6df16bb8ed03"
+  "gitHead": "fd6b8f060a69756336364e23a12bf4ec741a8aa6"
 }

package/dist/components/html.js

@@ -1,18 +0,0 @@
-import { p as purify } from './purify.es.js?scv=0.15.1';
-
-/**
- * This allows you to parse a template string with a function.
- */
-const html = (strings, ...values) => {
-    let result = strings[0];
-    for (let i = 0; i < values.length; i++) {
-        result +=
-            purify.sanitize(values[i] ? String(values[i]) : '') + strings[i + 1];
-    }
-    return result || '';
-};
-
-export { html as h };
-//# sourceMappingURL=html.js.map
-
-//# sourceMappingURL=html.js.map

package/dist/components/html.js.map

@@ -1 +0,0 @@
-{"file":"html.js","mappings":";;AAGA;;AAEG;AACU,MAAA,IAAI,GAAiB,CAAC,OAAO,EAAE,GAAG,MAAM,KAAI;AACvD,IAAA,IAAI,MAAM,GAAG,OAAO,CAAC,CAAC,CAAC;AAEvB,IAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;QACtC,MAAM;AACJ,YAAAA,MAAS,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,GAAG,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC;;IAG3E,OAAO,MAAM,IAAI,EAAE;AACrB;;;;","names":["DOMPurify"],"sources":["src/utils/html.ts"],"sourcesContent":["import DOMPurify from 'dompurify';\n\nimport type { TemplateHtml } from '@types';\n/**\n * This allows you to parse a template string with a function.\n */\nexport const html: TemplateHtml = (strings, ...values) => {\n  let result = strings[0];\n\n  for (let i = 0; i < values.length; i++) {\n    result +=\n      DOMPurify.sanitize(values[i] ? String(values[i]) : '') + strings[i + 1];\n  }\n\n  return result || '';\n};\n"],"version":3}