@taprootio/espalier 4.11.0 → 4.13.0

package/dist/font-picker/esp-font-picker.d.ts

@@ -1,28 +1,10 @@
 import "../pickers/esp-pick-one.js";
+import "../tooltip/esp-tooltip.js";
 import { EspalierElementBase } from "../shared/esp-element-base.js";
 import { type EspalierFormField } from "../form-item/esp-form-item.js";
 import { type PropertyValues } from "lit";
-export type GoogleFont = {
-    family: string;
-    variants: string[];
-    subsets: string[];
-    version: string;
-    lastModified: string;
-    files?: Record<string, string>;
-    category: FontCategory;
-    kind: string;
-};
-export type FontCategory = "serif" | "sans-serif" | "display" | "handwriting" | "monospace" | "not-display";
-export type FontSource = "google" | "web-safe";
-export type WebSafeFont = {
-    family: string;
-    stack: string;
-    category: Extract<FontCategory, "serif" | "sans-serif" | "monospace">;
-    kind: "web-safe";
-};
-export type FontPickerFont = GoogleFont | WebSafeFont;
-export type FontPickerValueChangedDetail = FontPickerFont | undefined;
-export declare const WEB_SAFE_FONTS: Array<WebSafeFont>;
+import { type FontCategory, type FontPickerFont, type FontSource, type GoogleFont } from "./font-types.js";
+export { DEVICE_DEFAULT_WEIGHTS, SYSTEM_TEXT_WEIGHTS, WEB_SAFE_FONTS, type FontCategory, type FontPickerFont, type FontPickerValueChangedDetail, type FontSource, type GoogleFont, type WebSafeCategory, type WebSafeFont, } from "./font-types.js";
 /**
  * Load the font catalog from the build-generated `font-definitions.json`
  * file served alongside the font CSS files.  The JSON is fetched from
@@ -30,6 +12,8 @@ export declare const WEB_SAFE_FONTS: Array<WebSafeFont>;
  * the nearest `<esp-root>` element's `font-css-root` attribute.
  *
  * Results are cached at the module level so only one fetch occurs per page.
+ * A failed request is not cached: it rejects every caller waiting on it,
+ * and the next call retries.
  */
 export declare const getGoogleFonts: () => Promise<Array<GoogleFont>>;
 /**
@@ -97,7 +81,11 @@ export declare class EspalierFontPicker extends EspalierElementBase implements E
     /**
      * Source of fonts to display. `google` preserves the default Google
      * Fonts catalog behavior. `web-safe` shows email-safe/system CSS
-     * font stacks and does not load Google font assets.
+     * font stacks and does not load Google font assets. `all` lists the
+     * device stacks above the Google catalog; every row carries a kind
+     * icon, a desktop for a device font and Google's mark for a catalog
+     * font, with a tooltip (ESP0206). Selecting a device row loads no
+     * preview CSS and no Google stylesheet.
      *
      * ```html
      * <esp-box>
@@ -115,7 +103,13 @@ export declare class EspalierFontPicker extends EspalierElementBase implements E
      * In the default Google Fonts mode this is the font family name, such
      * as `"Aclonica"`. In `font-source="web-safe"` mode this is the full CSS
      * font stack, such as `"Arial, Helvetica, sans-serif"`, so pre-selection
-     * via the `value` attribute must use the stack value.
+     * via the `value` attribute must use the stack value. In
+     * `font-source="all"` either form works: a catalog family (or a stack
+     * leading with one) selects the Google font, and a device stack selects
+     * the preset it is equivalent to — `system-ui, "Segoe UI", sans-serif`
+     * shows System Sans — or, when it matches no preset, shows as its own
+     * custom-stack row. Recognition never rewrites this value; only a user
+     * selection does.
      *
      * ```html
      * <esp-box>

package/dist/font-picker/esp-font-picker.js

@@ -1,9 +1,9 @@
-var u=function(t,e,o,s){var n=arguments.length,i=n<3?e:s===null?s=Object.getOwnPropertyDescriptor(e,o):s,l;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(t,e,o,s);else for(var c=t.length-1;c>=0;c--)(l=t[c])&&(i=(n<3?l(i):n>3?l(e,o,i):l(e,o))||i);return n>3&&i&&Object.defineProperty(e,o,i),i};import"../pickers/esp-pick-one.js";import{customElement as E,property as m,state as G}from"lit/decorators.js";import{EspalierElementBase as L}from"../shared/esp-element-base.js";import{html as N}from"lit";import{getFallbackFont as V,removeRuntimeGoogleFontLink as A,syncRuntimeGoogleFontLink as x}from"../shared/font-helpers.js";import{fontFallbackAliases as D}from"../shared/font-plan.js";const w=[{family:"Arial / Helvetica",stack:"Arial, Helvetica, sans-serif",category:"sans-serif",kind:"web-safe"},{family:"Georgia / Times New Roman",stack:'Georgia, "Times New Roman", Times, serif',category:"serif",kind:"web-safe"},{family:"Verdana / Geneva",stack:"Verdana, Geneva, sans-serif",category:"sans-serif",kind:"web-safe"},{family:"Tahoma / Geneva",stack:"Tahoma, Geneva, sans-serif",category:"sans-serif",kind:"web-safe"},{family:"Trebuchet MS",stack:'"Trebuchet MS", Arial, sans-serif',category:"sans-serif",kind:"web-safe"},{family:"Courier New",stack:'"Courier New", Courier, monospace',category:"monospace",kind:"web-safe"},{family:"System Sans",stack:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',category:"sans-serif",kind:"web-safe"},{family:"System Serif",stack:'ui-serif, Georgia, Cambria, "Times New Roman", Times, serif',category:"serif",kind:"web-safe"},{family:"System Monospace",stack:'ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", "Courier New", monospace',category:"monospace",kind:"web-safe"}];let f,p=!1;const U=async()=>{if(f)return f;if(p){for(;!f;)await new Promise(s=>setTimeout(s,100));return f}p=!0;const t=document.getElementsByTagName("esp-root")[0];if(!t)throw new Error("<esp-font-picker> requires an <esp-root> ancestor. Wrap your application in <esp-root> to use the font picker.");const e=t.fontDefinitionsUrl||`${t.fontCSSRoot}font-definitions.json`,o=await fetch(e);if(!o.ok)throw p=!1,new Error(`Failed to load font definitions from ${e} (${o.status}). Run 'npm run build-fonts' to generate the font catalog.`);return f=await o.json(),f},k="esp-preview-",B=t=>`${k}${t}`,d=new Map,g=async t=>{if(d.has(t))return!0;try{const e=document.getElementsByTagName("esp-root")[0];if(!e)return!1;const o=t.replaceAll(" ","-"),s=await fetch(`${e.fontCSSRoot}${o}.css`);if(!s.ok)return!1;let n=await s.text();n=n.replace(/font-family:\s*'([^']+)'/g,(l,c)=>`font-family: '${k}${c}'`);const i=document.createElement("style");return i.textContent=n,i.dataset.font=t,document.head.appendChild(i),d.set(t,i),!0}catch(e){return console.warn(`Failed to load CSS for font ${t}:`,e),!1}},F=t=>{const e=d.get(t);e&&(e.remove(),d.delete(t))},v="data-esp-font-picker",b="data-esp-font-picker-root",I=t=>t.closest("esp-root"),R=t=>I(t)?.correlationId??"",M=(t,e)=>`link[${v}="${CSS.escape(t)}"][${b}="${CSS.escape(e)}"]`,C=(t,e)=>`picker:${e}:${t}`,S=(t,e)=>{if(!e)return;const o=I(t),s=o?.correlationId??"";if(o?.googleFontLoading==="none"){h(t,e);return}x({owner:C(e,s),family:e,enabled:!0,attributes:{[v]:e,[b]:s}})},h=(t,e)=>{if(!e)return;const o=R(t);Array.from(document.getElementsByTagName("esp-font-picker")).some(n=>R(n)===o&&n.fontSource==="google"&&n.value===e)||(A(C(e,o)),document.head.querySelector(M(e,o))?.remove())},_=t=>t.kind!=="web-safe",y=t=>_(t)?t.family:t.stack,O=t=>{if(!_(t))return t.stack;const e=D(t.family,400,t.category);return[`"${t.family}"`,...e,`"${B(t.family)}"`,V(t.category)].join(", ")},$=(t,e)=>t.filter(o=>{switch(e){case"not-display":return o.category!=="display";default:return o.category===e}});let r=class extends L{constructor(){super(...arguments),this.loadedFonts=new Set,this.formItemDescription=null,this.formItemLabel=null,this._rangeGeneration=0,this._initGeneration=0,this._fontsReady=Promise.resolve(),this.fonts=[],this.category=null,this.fontSource="google",this.value="",this.placeholder="Choose a font...",this.handleItemsInViewEvent=e=>{e.stopPropagation(),this.handleItemsInView(e.detail)}}focus(){this.shadowRoot?.querySelector("esp-pick-one")?.focus()}setFormItemDescription(e){this.formItemDescription=e,this.syncFormItemDescription()}setFormItemLabel(e){this.formItemLabel=e,this.syncFormItemDescription()}syncFormItemDescription(){const e=this.shadowRoot?.querySelector("esp-pick-one");e?.setFormItemDescription?.(this.formItemDescription),e?.setFormItemLabel?.(this.formItemLabel)}async getUpdateComplete(){const e=await super.getUpdateComplete();return await this._fontsReady,e}firstUpdated(e){super.firstUpdated(e),this._fontsReady=this.initFonts()}updated(e){super.updated(e),this.syncFormItemDescription();const o=e.has("fontSource")&&e.get("fontSource")!==void 0,s=e.has("category")&&e.get("category")!==void 0;if(o||s){if(e.get("fontSource")==="google"&&this.fontSource==="web-safe"){const n=this.value;for(const i of this.loadedFonts)F(i);this.loadedFonts.clear(),this.value="",n&&h(this,n)}this._fontsReady=this.initFonts()}if(e.has("value")&&this.value&&this.fontSource==="google"){const n=e.get("value");n!==this.value&&this.ensureFontLoaded(this.value,n)}}async ensureFontLoaded(e,o){await g(e)&&this.loadedFonts.add(e),this.value===e&&(S(this,e),o&&o!==e&&h(this,o))}async initFonts(){const e=++this._initGeneration;if(this.fontSource==="web-safe"){this.fonts=this.category?$(w,this.category):w;return}const o=await U();if(!(e!==this._initGeneration||this.fontSource!=="google")&&(this.fonts=this.category?$(o,this.category):o,this.value&&this.fonts.some(s=>y(s)===this.value))){const s=this.value;if(await g(s)){if(e!==this._initGeneration||this.fontSource!=="google"||this.value!==s){F(s);return}this.loadedFonts.add(s)}if(e!==this._initGeneration||this.fontSource!=="google"||this.value!==s)return;S(this,s)}}async handleItemsInView(e){if(this.fontSource==="web-safe")return;const o=++this._rangeGeneration,s=3,n=e.items??[],i=new Set,l=Math.max(0,e.first),c=Math.min(e.last+s,n.length);for(let a=l;a<c;a++)i.add(n[a].value);for(const a of i)this.loadedFonts.has(a)||await g(a)&&this.loadedFonts.add(a);if(o!==this._rangeGeneration)return;const T=new Set(Array.from(document.getElementsByTagName("esp-font-picker")).map(a=>a.value).filter(Boolean));for(const a of this.loadedFonts)T.has(a)||i.has(a)||(this.loadedFonts.delete(a),F(a))}render(){return N`<esp-pick-one
+var h=function(e,t,o,i){var s=arguments.length,n=s<3?t:i===null?i=Object.getOwnPropertyDescriptor(t,o):i,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")n=Reflect.decorate(e,t,o,i);else for(var l=e.length-1;l>=0;l--)(a=e[l])&&(n=(s<3?a(n):s>3?a(t,o,n):a(t,o))||n);return s>3&&n&&Object.defineProperty(t,o,n),n};import"../pickers/esp-pick-one.js";import"../tooltip/esp-tooltip.js";import{customElement as A,property as F,state as L}from"lit/decorators.js";import{EspalierElementBase as x}from"../shared/esp-element-base.js";import{html as N}from"lit";import{extractFamily as U,getFallbackFont as B,removeRuntimeGoogleFontLink as O,syncRuntimeGoogleFontLink as q}from"../shared/font-helpers.js";import{fontFallbackAliases as W}from"../shared/font-plan.js";import{customWebSafeFont as I,matchWebSafeFont as j}from"../shared/font-stacks.js";import{getIconHrefForHost as P}from"../shared/intent-values.js";import{WEB_SAFE_FONTS as E,isSystemPreset as _}from"./font-types.js";import{DEVICE_DEFAULT_WEIGHTS as ft,SYSTEM_TEXT_WEIGHTS as dt,WEB_SAFE_FONTS as ht}from"./font-types.js";let y,m;const M=async()=>{const e=document.getElementsByTagName("esp-root")[0];if(!e)throw new Error("<esp-font-picker> requires an <esp-root> ancestor. Wrap your application in <esp-root> to use the font picker.");const t=e.fontDefinitionsUrl||`${e.fontCSSRoot}font-definitions.json`,o=await fetch(t);if(!o.ok)throw new Error(`Failed to load font definitions from ${t} (${o.status}). Run 'npm run build-fonts' to generate the font catalog.`);return await o.json()},z=async()=>{if(y)return y;if(!m){const e=M().then(t=>(y=t,t),t=>{throw m===e&&(m=void 0),t});m=e}return m},k="esp-preview-",H=e=>`${k}${e}`,g=new Map,v=async e=>{if(g.has(e))return!0;try{const t=document.getElementsByTagName("esp-root")[0];if(!t)return!1;const o=e.replaceAll(" ","-"),i=await fetch(`${t.fontCSSRoot}${o}.css`);if(!i.ok)return!1;let s=await i.text();s=s.replace(/font-family:\s*'([^']+)'/g,(a,l)=>`font-family: '${k}${l}'`);const n=document.createElement("style");return n.textContent=s,n.dataset.font=e,document.head.appendChild(n),g.set(e,n),!0}catch(t){return console.warn(`Failed to load CSS for font ${e}:`,t),!1}},S=e=>{const t=g.get(e);t&&(t.remove(),g.delete(e))},w="data-esp-font-picker",R="data-esp-font-picker-root",$=e=>e.closest("esp-root"),V=e=>$(e)?.correlationId??"",X=(e,t)=>`link[${w}="${CSS.escape(e)}"][${R}="${CSS.escape(t)}"]`,C=(e,t)=>`picker:${t}:${e}`,b=(e,t)=>{if(!t)return;const o=$(e),i=o?.correlationId??"";if(o?.googleFontLoading==="none"){p(e,t);return}q({owner:C(t,i),family:t,enabled:!0,attributes:{[w]:t,[R]:i}})},p=(e,t)=>{if(!t)return;const o=V(e);Array.from(document.getElementsByTagName("esp-font-picker")).some(s=>V(s)===o&&s.selectedGoogleFamily===t)||(O(C(t,o)),document.head.querySelector(X(t,o))?.remove())},f=e=>e.kind!=="web-safe",G="http://www.w3.org/2000/svg",K=(e,t)=>{const o=document.createElement("esp-tooltip");o.setAttribute("text",t==="device"?"Device font, no download":"Google font"),o.setAttribute("trigger-tabindex","-1"),o.setAttribute("style","display: grid; place-self: center;");const i=document.createElementNS(G,"svg");i.setAttribute("aria-hidden","true"),i.setAttribute("style","display: block; width: var(--esp-size-medium); height: var(--esp-size-medium); margin: var(--esp-size-tiny);");const s=document.createElementNS(G,"use");return s.setAttribute("href",P(t==="device"?"device-desktop":"brand-google",e)),i.append(s),o.append(i),o},T=e=>f(e)?e.family:e.stack,Y=e=>{if(!f(e))return e.stack;const t=W(e.family,400,e.category);return[`"${e.family}"`,...t,`"${H(e.family)}"`,B(e.category)].join(", ")},D=(e,t)=>e.filter(o=>{switch(t){case"not-display":return o.category!=="display";default:return o.category===t}});let d=class extends x{constructor(){super(...arguments),this.loadedFonts=new Set,this.formItemDescription=null,this.formItemLabel=null,this._rangeGeneration=0,this._initGeneration=0,this._fontsReady=Promise.resolve(),this.fonts=[],this.category=null,this.fontSource="google",this.value="",this.placeholder="Choose a font...",this.handleItemsInViewEvent=t=>{t.stopPropagation(),this.handleItemsInView(t.detail)}}focus(){this.shadowRoot?.querySelector("esp-pick-one")?.focus()}setFormItemDescription(t){this.formItemDescription=t,this.syncFormItemDescription()}setFormItemLabel(t){this.formItemLabel=t,this.syncFormItemDescription()}syncFormItemDescription(){const t=this.shadowRoot?.querySelector("esp-pick-one");t?.setFormItemDescription?.(this.formItemDescription),t?.setFormItemLabel?.(this.formItemLabel)}async getUpdateComplete(){const t=await super.getUpdateComplete();return await this._fontsReady,t}firstUpdated(t){super.firstUpdated(t),this._fontsReady=this.initFonts()}updated(t){super.updated(t),this.syncFormItemDescription();const o=t.has("fontSource")&&t.get("fontSource")!==void 0,i=t.has("category")&&t.get("category")!==void 0;if(o||i){if(o&&this.fontSource==="web-safe"){const s=this.value;for(const n of this.loadedFonts)S(n);this.loadedFonts.clear(),this.value="",s&&p(this,s)}this._fontsReady=this.initFonts()}if(t.has("value")&&this.value&&this.fontSource!=="web-safe"){const s=t.get("value"),n=this.googleFamilyFor(this.value),a=s?this.googleFamilyFor(s)??void 0:void 0;n&&s!==this.value?this.ensureFontLoaded(n,this.value,a):!n&&a&&p(this,a)}}get selectedGoogleFamily(){return this.fontSource==="web-safe"?null:this.googleFamilyFor(this.value)}googleFamilyFor(t){if(!t)return null;const o=this.fonts.filter(f);if(o.some(s=>s.family===t))return t;const i=U(t);return o.some(s=>s.family===i)?i:null}resolveSelection(){const t=this.value;if(!t||this.fonts.length===0)return{font:null,rowValue:t};const o=this.fontSource==="web-safe"?null:this.googleFamilyFor(t);if(o)return{font:this.fonts.find(l=>f(l)&&l.family===o)??null,rowValue:o};if(this.fontSource==="google")return{font:null,rowValue:t};const i=this.fonts.filter(a=>!f(a)),s=j(t,i);if(s)return{font:s,rowValue:s.stack};const n=I(t);return{font:n,rowValue:n?.stack??t}}async ensureFontLoaded(t,o,i){await v(t)&&this.loadedFonts.add(t),this.value===o&&(b(this,t),i&&i!==t&&p(this,i))}async initFonts(){const t=++this._initGeneration,o=this.fontSource,i=this.category?D(E,this.category):E;if(o==="web-safe"){this.fonts=i;return}const s=[...i.filter(_),...i.filter(u=>!_(u))];o==="all"&&(this.fonts=s);let n;try{n=await z()}catch(u){if(o!=="all")throw u;console.warn("esp-font-picker: the Google catalog is unavailable; listing device fonts only.",u);return}if(t!==this._initGeneration||this.fontSource!==o)return;const a=this.category?D(n,this.category):n;this.fonts=o==="all"?[...s,...a]:a;const l=this.value,c=this.googleFamilyFor(l);if(c){if(await v(c)){if(t!==this._initGeneration||this.fontSource!==o||this.value!==l){S(c);return}this.loadedFonts.add(c)}if(t!==this._initGeneration||this.fontSource!==o||this.value!==l)return;b(this,c)}}async handleItemsInView(t){if(this.fontSource==="web-safe")return;const o=++this._rangeGeneration,i=3,s=t.items??[],n=new Set,a=new Set(this.fonts.filter(f).map(r=>r.family)),l=Math.max(0,t.first),c=Math.min(t.last+i,s.length);for(let r=l;r<c;r++)a.has(s[r].value)&&n.add(s[r].value);for(const r of n)this.loadedFonts.has(r)||await v(r)&&this.loadedFonts.add(r);if(o!==this._rangeGeneration)return;const u=new Set(Array.from(document.getElementsByTagName("esp-font-picker")).map(r=>r.selectedGoogleFamily).filter(r=>!!r));for(const r of this.loadedFonts)u.has(r)||n.has(r)||(this.loadedFonts.delete(r),S(r))}render(){const t=this.resolveSelection(),o=this.fontSource==="all",s=[...t.font&&!this.fonts.includes(t.font)?[t.font]:[],...this.fonts].map(n=>({text:n.family,value:T(n),selected:t.font===n,styles:{fontFamily:Y(n)},...o?{slotNodes:[K(this,f(n)?"google":"device")]}:{}}));return N`<esp-pick-one
       typeahead
-      .pickerItems=${this.fonts.map(e=>({text:e.family,value:y(e),selected:this.value===y(e),styles:{fontFamily:O(e)}}))}
-      .value=${this.value}
+      .pickerItems=${s}
+      .value=${t.rowValue}
       .placeholder=${this.placeholder}
       @esp-picker-menu-range-changed=${this.handleItemsInViewEvent}
-      @esp-value-changed=${async e=>{e.stopPropagation();const o=this.value;if(!e.detail){this.value="",o&&h(this,o),this.emitValueChanged(void 0);return}const s=this.fonts.find(n=>y(n)===e.detail.value);this.value=e.detail.value,this.fontSource==="google"&&(await g(this.value)&&this.loadedFonts.add(this.value),S(this,this.value),o&&o!==this.value&&h(this,o)),this.emitValueChanged(s)}}
+      @esp-value-changed=${async n=>{n.stopPropagation();const a=this.value;if(!n.detail){const r=a?this.googleFamilyFor(a):null;this.value="",r&&p(this,r),this.emitValueChanged(void 0);return}const l=this.fonts.find(r=>T(r)===n.detail.value)??(this.fontSource==="all"?I(n.detail.value)??void 0:void 0),c=n.detail.value;this.value=c,this.emitValueChanged(l);const u=a?this.googleFamilyFor(a):null;if(u&&u!==c&&p(this,u),l&&f(l)){if(await v(c)&&this.loadedFonts.add(c),this.value!==c)return;b(this,c)}}}
     >
-    </esp-pick-one>`}};u([G()],r.prototype,"fonts",void 0),u([m({attribute:"category",type:String})],r.prototype,"category",void 0),u([m({attribute:"font-source",type:String})],r.prototype,"fontSource",void 0),u([m({type:String})],r.prototype,"value",void 0),u([m({type:String})],r.prototype,"placeholder",void 0),r=u([E("esp-font-picker")],r);const J=()=>{f=void 0,p=!1;for(const t of document.head.querySelectorAll("style[data-font]"))t.remove();d.clear();for(const t of document.head.querySelectorAll(`link[${v}]`))t.remove()};export{r as EspalierFontPicker,w as WEB_SAFE_FONTS,O as getFontPreviewFamily,U as getGoogleFonts,B as previewFontFamily,J as resetFontCache};
+    </esp-pick-one>`}};h([L()],d.prototype,"fonts",void 0),h([F({attribute:"category",type:String})],d.prototype,"category",void 0),h([F({attribute:"font-source",type:String})],d.prototype,"fontSource",void 0),h([F({type:String})],d.prototype,"value",void 0),h([F({type:String})],d.prototype,"placeholder",void 0),d=h([A("esp-font-picker")],d);const lt=()=>{y=void 0,m=void 0;for(const e of document.head.querySelectorAll("style[data-font]"))e.remove();g.clear();for(const e of document.head.querySelectorAll(`link[${w}]`))e.remove()};export{ft as DEVICE_DEFAULT_WEIGHTS,d as EspalierFontPicker,dt as SYSTEM_TEXT_WEIGHTS,ht as WEB_SAFE_FONTS,Y as getFontPreviewFamily,z as getGoogleFonts,H as previewFontFamily,lt as resetFontCache};

package/dist/font-picker/font-types.d.ts

@@ -0,0 +1,49 @@
+/**
+ * The font picker's data vocabulary: catalog entries, device (web-safe)
+ * stacks, and the union the picker reports. Kept free of DOM and network
+ * code so `shared/font-helpers` and `shared/font-stacks` can consume it
+ * without importing the component.
+ */
+export type GoogleFont = {
+    family: string;
+    variants: string[];
+    subsets: string[];
+    version: string;
+    lastModified: string;
+    files?: Record<string, string>;
+    category: FontCategory;
+    kind: string;
+};
+export type FontCategory = "serif" | "sans-serif" | "display" | "handwriting" | "monospace" | "not-display";
+/**
+ * `google` lists the generated catalog; `web-safe` lists only device stacks;
+ * `all` (ESP0206) lists the device stacks above the catalog.
+ */
+export type FontSource = "google" | "web-safe" | "all";
+export type WebSafeCategory = Extract<FontCategory, "serif" | "sans-serif" | "monospace">;
+/**
+ * A CSS font stack that resolves to faces already on the reader's device,
+ * so choosing it downloads nothing.
+ */
+export type WebSafeFont = {
+    family: string;
+    stack: string;
+    category: WebSafeCategory;
+    kind: "web-safe";
+    /**
+     * Numeric weights the stack's device faces are expected to carry. Devices
+     * snap to the nearest weight they have and may synthesize bold, so this is
+     * a reasonable offer rather than a guarantee. Absent means 400 and 700.
+     */
+    weights?: string[];
+};
+export type FontPickerFont = GoogleFont | WebSafeFont;
+export type FontPickerValueChangedDetail = FontPickerFont | undefined;
+/** Weights the platform UI faces (SF, Segoe UI Variable, Roboto) reliably carry. */
+export declare const SYSTEM_TEXT_WEIGHTS: ReadonlyArray<string>;
+/** Weights a device monospace or classic web-safe face reliably carries. */
+export declare const DEVICE_DEFAULT_WEIGHTS: ReadonlyArray<string>;
+/** The device stacks in their long-standing `web-safe` order; the combined source lists the System entries first. */
+export declare const WEB_SAFE_FONTS: Array<WebSafeFont>;
+/** Whether a preset is one of the platform System entries the combined source leads with. */
+export declare const isSystemPreset: (font: WebSafeFont) => boolean;

package/dist/font-picker/font-types.js

@@ -0,0 +1 @@
+const e=["300","400","500","600","700"],s=["400","700"],i=[{family:"Arial / Helvetica",stack:"Arial, Helvetica, sans-serif",category:"sans-serif",kind:"web-safe"},{family:"Georgia / Times New Roman",stack:'Georgia, "Times New Roman", Times, serif',category:"serif",kind:"web-safe"},{family:"Verdana / Geneva",stack:"Verdana, Geneva, sans-serif",category:"sans-serif",kind:"web-safe"},{family:"Tahoma / Geneva",stack:"Tahoma, Geneva, sans-serif",category:"sans-serif",kind:"web-safe"},{family:"Trebuchet MS",stack:'"Trebuchet MS", Arial, sans-serif',category:"sans-serif",kind:"web-safe"},{family:"Courier New",stack:'"Courier New", Courier, monospace',category:"monospace",kind:"web-safe"},{family:"System Sans",stack:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',category:"sans-serif",kind:"web-safe",weights:[...e]},{family:"System Serif",stack:'ui-serif, Georgia, Cambria, "Times New Roman", Times, serif',category:"serif",kind:"web-safe",weights:[...e]},{family:"System Monospace",stack:'ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", "Courier New", monospace',category:"monospace",kind:"web-safe"}],o=a=>a.family.startsWith("System ");export{s as DEVICE_DEFAULT_WEIGHTS,e as SYSTEM_TEXT_WEIGHTS,i as WEB_SAFE_FONTS,o as isSystemPreset};

package/dist/help/esp-help-button.d.ts

@@ -51,7 +51,7 @@ export declare class EspalierHelpButton extends EspalierElementBase {
     /** Forward focus to the composed native control. */
     focus(options?: FocusOptions): void;
     protected updated(changed: PropertyValues): void;
-    protected render(): typeof nothing | import("lit-html").TemplateResult<1>;
+    protected render(): import("lit-html").TemplateResult<1> | typeof nothing;
     static styles: import("lit").CSSResult[];
 }
 declare global {

package/dist/icons/icon-sprite.generated.d.ts

@@ -14,4 +14,4 @@ export declare const ICON_SPRITE_ID = "esp-icons";
  * hidden from rendering and the accessibility tree. Inline it once per
  * document, then point a root at it: `icon-sprite-url="#esp-icons"`.
  */
-export declare const ICON_SPRITE = "<svg id=\"esp-icons\" data-esp-icon-sprite=\"\" aria-hidden=\"true\" style=\"display: none\" xmlns=\"http://www.w3.org/2000/svg\">\n  <defs>\n    <symbol\n      id=\"taproot-logo\"\n      viewBox=\"0 0 1000 1000\"\n      fill=\"currentColor\"\n    >\n      <path\n        d=\"M282.2,260.1c11.4-17.2,34.6-21.9,51.8-10.5l128.7,85.2v-62.6l-88.3-59.1c-17.2-11.5-21.7-34.7-10.3-51.8,11.5-17.1,34.7-21.7,51.8-10.3l46.8,31.3v-100.5c0-20.6,16.7-37.3,37.3-37.3s37.4,16.7,37.4,37.3v41.4l28.5-20c16.9-11.9,40.2-7.8,52,9.1,11.9,16.9,7.8,40.2-9.1,52l-71.4,50.2v37.5h0v24.6l110.8-75.2c17.1-11.6,40.3-7.2,51.9,9.9,11.6,17.1,7.2,40.3-9.9,51.9l-152.7,103.8v37h0v257.3c0,20.6-16.7,37.4-37.4,37.4s-37.3-16.7-37.3-37.4v-236.8l-170-112.6c-17.2-11.4-21.9-34.6-10.5-51.8h0ZM630.2,451.6c-18.1-10-40.8-3.5-50.8,14.6-10,18-3.5,40.7,14.5,50.8,61.8,34.3,100.2,99.3,100.2,169.8,0,107-87.1,194.1-194.1,194.1s-194.1-87.1-194.1-194.1,38.4-135.5,100.2-169.8c18-10,24.5-32.7,14.5-50.8-10-18.1-32.7-24.6-50.8-14.6-85.5,47.4-138.6,137.5-138.6,235.1,0,148.2,120.5,268.8,268.7,268.8s268.8-120.6,268.8-268.8c0-97.6-53.1-187.7-138.6-235.1Z\"\n      />\n    </symbol>\n\n    <symbol id=\"album\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M7 3m0 2.667a2.667 2.667 0 0 1 2.667 -2.667h8.666a2.667 2.667 0 0 1 2.667 2.667v8.666a2.667 2.667 0 0 1 -2.667 2.667h-8.666a2.667 2.667 0 0 1 -2.667 -2.667z\" />\n      <path\n        d=\"M4.012 7.26a2.005 2.005 0 0 0 -1.012 1.737v10c0 1.1 .9 2 2 2h10c.75 0 1.158 -.385 1.5 -1\" />\n      <path d=\"M17 7h.01\" />\n      <path d=\"M7 13l3.644 -3.644a1.21 1.21 0 0 1 1.712 0l3.644 3.644\" />\n      <path d=\"M15 12l1.644 -1.644a1.21 1.21 0 0 1 1.712 0l2.644 2.644\" />\n    </symbol>\n    <symbol id=\"align-left\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 6l16 0\" />\n      <path d=\"M4 12l10 0\" />\n      <path d=\"M4 18l14 0\" />\n    </symbol>\n    <symbol id=\"align-center\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 6l16 0\" />\n      <path d=\"M8 12l8 0\" />\n      <path d=\"M6 18l12 0\" />\n    </symbol>\n    <symbol id=\"align-right\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 6l16 0\" />\n      <path d=\"M10 12l10 0\" />\n      <path d=\"M6 18l14 0\" />\n    </symbol>\n\n    <symbol id=\"apple\" viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M4 11.319c0 3.102 .444 5.319 2.222 7.978c1.351 1.797 3.156 2.247 5.08 .988c.426 -.268 .97 -.268 1.397 0c1.923 1.26 3.728 .809 5.079 -.988c1.778 -2.66 2.222 -4.876 2.222 -7.977c0 -2.661 -1.99 -5.32 -4.444 -5.32c-1.267 0 -2.41 .693 -3.22 1.44a.5 .5 0 0 1 -.672 0c-.809 -.746 -1.953 -1.44 -3.22 -1.44c-2.454 0 -4.444 2.66 -4.444 5.319\" />\n      <path d=\"M7 12c0 -1.47 .454 -2.34 1.5 -3\" />\n      <path d=\"M12 7c0 -1.2 .867 -4 3 -4\" />\n    </symbol>\n\n    <symbol id=\"arrow-big-down\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M10 2l-.15 .005a2 2 0 0 0 -1.85 1.995v6.999l-2.586 .001a2 2 0 0 0 -1.414 3.414l6.586 6.586a2 2 0 0 0 2.828 0l6.586 -6.586a2 2 0 0 0 .434 -2.18l-.068 -.145a2 2 0 0 0 -1.78 -1.089l-2.586 -.001v-6.999a2 2 0 0 0 -2 -2h-4z\" />\n    </symbol>\n\n    <symbol id=\"arrow-big-left\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M9.586 4l-6.586 6.586a2 2 0 0 0 0 2.828l6.586 6.586a2 2 0 0 0 2.18 .434l.145 -.068a2 2 0 0 0 1.089 -1.78v-2.586h7a2 2 0 0 0 2 -2v-4l-.005 -.15a2 2 0 0 0 -1.995 -1.85l-7 -.001v-2.585a2 2 0 0 0 -3.414 -1.414z\" />\n    </symbol>\n\n    <symbol id=\"arrow-big-right\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M12.089 3.634a2 2 0 0 0 -1.089 1.78l-.001 2.586h-6.999a2 2 0 0 0 -2 2v4l.005 .15a2 2 0 0 0 1.995 1.85l6.999 -.001l.001 2.587a2 2 0 0 0 3.414 1.414l6.586 -6.586a2 2 0 0 0 0 -2.828l-6.586 -6.586a2 2 0 0 0 -2.18 -.434l-.145 .068z\" />\n    </symbol>\n\n    <symbol id=\"article\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M3 4m0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z\"\n      />\n      <path d=\"M7 8h10\" />\n      <path d=\"M7 12h10\" />\n      <path d=\"M7 16h10\" />\n    </symbol>\n\n    <symbol id=\"bat\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M17 16c.74 -2.286 2.778 -3.762 5 -3c-.173 -2.595 .13 -5.314 -2 -7.5c-1.708 2.648 -3.358 2.557 -5 2.5v-4l-3 2l-3 -2v4c-1.642 .057 -3.292 .148 -5 -2.5c-2.13 2.186 -1.827 4.905 -2 7.5c2.222 -.762 4.26 .714 5 3c2.593 0 3.889 .952 5 4c1.111 -3.048 2.407 -4 5 -4z\" />\n      <path d=\"M9 8a3 3 0 0 0 6 0\" />\n    </symbol>\n\n    <symbol id=\"brand-github\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M5.315 2.1c.791 -.113 1.9 .145 3.333 .966l.272 .161l.16 .1l.397 -.083a13.3 13.3 0 0 1 4.59 -.08l.456 .08l.396 .083l.161 -.1c1.385 -.84 2.487 -1.17 3.322 -1.148l.164 .008l.147 .017l.076 .014l.05 .011l.144 .047a1 1 0 0 1 .53 .514a5.2 5.2 0 0 1 .397 2.91l-.047 .267l-.046 .196l.123 .163c.574 .795 .93 1.728 1.03 2.707l.023 .295l.007 .272c0 3.855 -1.659 5.883 -4.644 6.68l-.245 .061l-.132 .029l.014 .161l.008 .157l.004 .365l-.002 .213l-.003 3.834a1 1 0 0 1 -.883 .993l-.117 .007h-6a1 1 0 0 1 -.993 -.883l-.007 -.117v-.734c-1.818 .26 -3.03 -.424 -4.11 -1.878l-.535 -.766c-.28 -.396 -.455 -.579 -.589 -.644l-.048 -.019a1 1 0 0 1 .564 -1.918c.642 .188 1.074 .568 1.57 1.239l.538 .769c.76 1.079 1.36 1.459 2.609 1.191l.001 -.678l-.018 -.168a5.03 5.03 0 0 1 -.021 -.824l.017 -.185l.019 -.12l-.108 -.024c-2.976 -.71 -4.703 -2.573 -4.875 -6.139l-.01 -.31l-.004 -.292a5.6 5.6 0 0 1 .908 -3.051l.152 -.222l.122 -.163l-.045 -.196a5.2 5.2 0 0 1 .145 -2.642l.1 -.282l.106 -.253a1 1 0 0 1 .529 -.514l.144 -.047l.154 -.03z\" />\n    </symbol>\n\n    <symbol id=\"box\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 3l8 4.5l0 9l-8 4.5l-8 -4.5l0 -9l8 -4.5\" />\n      <path d=\"M12 12l8 -4.5\" />\n      <path d=\"M12 12l0 9\" />\n      <path d=\"M12 12l-8 -4.5\" />\n    </symbol>\n\n    <symbol id=\"box-multiple\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M7 3m0 2a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M17 17v2a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2v-10a2 2 0 0 1 2 -2h2\" />\n    </symbol>\n\n    <symbol id=\"bread\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"/>\n      <path d=\"M18 4a3 3 0 0 1 2 5.235v8.765a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-8.764a3 3 0 0 1 1.824 -5.231h12.176v-.005\" />\n    </symbol>\n\n    <symbol id=\"brightness-2\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0\" />\n      <path\n        d=\"M6 6h3.5l2.5 -2.5l2.5 2.5h3.5v3.5l2.5 2.5l-2.5 2.5v3.5h-3.5l-2.5 2.5l-2.5 -2.5h-3.5v-3.5l-2.5 -2.5l2.5 -2.5z\" />\n    </symbol>\n\n    <symbol id=\"building\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M3 21l18 0\" />\n      <path d=\"M9 8l1 0\" />\n      <path d=\"M9 12l1 0\" />\n      <path d=\"M9 16l1 0\" />\n      <path d=\"M14 8l1 0\" />\n      <path d=\"M14 12l1 0\" />\n      <path d=\"M14 16l1 0\" />\n      <path d=\"M5 21v-16a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v16\" />\n    </symbol>\n\n    <symbol id=\"burger\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 15h16a4 4 0 0 1 -4 4h-8a4 4 0 0 1 -4 -4z\" />\n      <path d=\"M12 4c3.783 0 6.953 2.133 7.786 5h-15.572c.833 -2.867 4.003 -5 7.786 -5z\" />\n      <path d=\"M5 12h14\" />\n    </symbol>\n\n    <symbol id=\"button\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 8m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v4a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z\" />\n    </symbol>\n\n    <symbol id=\"calendar\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path d=\"M4 7a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2z\" />\n      <path d=\"M16 3v4\" />\n      <path d=\"M8 3v4\" />\n      <path d=\"M4 11h16\" />\n      <path d=\"M11 15h1\" />\n      <path d=\"M12 15v3\" />\n    </symbol>\n\n    <symbol id=\"cat\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M20 3v10a8 8 0 1 1 -16 0v-10l3.432 3.432a7.963 7.963 0 0 1 4.568 -1.432c1.769 0 3.403 .574 4.728 1.546l3.272 -3.546z\" />\n      <path d=\"M2 16h5l-4 4\" />\n      <path d=\"M22 16h-5l4 4\" />\n      <path d=\"M12 16m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\" />\n      <path d=\"M9 11v.01\" />\n      <path d=\"M15 11v.01\" />\n    </symbol>\n\n    <symbol id=\"category\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 4h6v6h-6z\" />\n      <path d=\"M14 4h6v6h-6z\" />\n      <path d=\"M4 14h6v6h-6z\" />\n      <path d=\"M17 17m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0\" />\n    </symbol>\n\n    <symbol id=\"chef-hat\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M12 3c1.918 0 3.52 1.35 3.91 3.151a4 4 0 0 1 2.09 7.723l0 7.126h-12v-7.126a4 4 0 1 1 2.092 -7.723a4 4 0 0 1 3.908 -3.151z\" />\n      <path d=\"M6.161 17.009l11.839 -.009\" />\n    </symbol>\n\n    <symbol id=\"cherry\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M7.5 16.5m-3.5 0a3.5 3.5 0 1 0 7 0a3.5 3.5 0 1 0 -7 0\" />\n      <path d=\"M17 18m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0\" />\n      <path d=\"M9 13c.366 -2 1.866 -3.873 4.5 -5.6\" />\n      <path d=\"M17 15c-1.333 -2.333 -2.333 -5.333 -1 -9\" />\n      <path d=\"M5 6c3.667 -2.667 7.333 -2.667 11 0c-3.667 2.667 -7.333 2.667 -11 0\" />\n    </symbol>\n\n    <symbol id=\"checkbox\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M9 12l2 2l4 -4\" />\n      <path d=\"M12 3c7.2 0 9 1.8 9 9s-1.8 9 -9 9s-9 -1.8 -9 -9s1.8 -9 9 -9\" />\n    </symbol>\n\n    <symbol id=\"circle-dot\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M8 12a4 4 0 1 0 8 0a4 4 0 1 0 -8 0\" fill=\"currentColor\" />\n      <path d=\"M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0\" />\n    </symbol>\n\n    <symbol id=\"circle-x\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0\" />\n      <path d=\"M10 10l4 4m0 -4l-4 4\" />\n    </symbol>\n\n    <symbol id=\"cog\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z\" />\n      <path d=\"M9 12a3 3 0 1 0 6 0a3 3 0 0 0 -6 0\" />\n    </symbol>\n\n    <symbol id=\"deer\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M3 3c0 2 1 3 4 3c2 0 3 1 3 3\" />\n      <path d=\"M21 3c0 2 -1 3 -4 3c-2 0 -3 .333 -3 3\" />\n      <path d=\"M12 18c-1 0 -4 -3 -4 -6c0 -2 1.333 -3 4 -3s4 1 4 3c0 3 -3 6 -4 6\" />\n      <path d=\"M15.185 14.889l.095 -.18a4 4 0 1 1 -6.56 0\" />\n      <path d=\"M17 3c0 1.333 -.333 2.333 -1 3\" />\n      <path d=\"M7 3c0 1.333 .333 2.333 1 3\" />\n      <path d=\"M7 6c-2.667 .667 -4.333 1.667 -5 3\" />\n      <path d=\"M17 6c2.667 .667 4.333 1.667 5 3\" />\n      <path d=\"M8.5 10l-1.5 -1\" />\n      <path d=\"M15.5 10l1.5 -1\" />\n      <path d=\"M12 15h.01\" />\n    </symbol>\n\n    <symbol id=\"direction-sign\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M3.32 12.774l7.906 7.905c.427 .428 1.12 .428 1.548 0l7.905 -7.905a1.095 1.095 0 0 0 0 -1.548l-7.905 -7.905a1.095 1.095 0 0 0 -1.548 0l-7.905 7.905a1.095 1.095 0 0 0 0 1.548z\" />\n      <path d=\"M8 12h7.5\" />\n      <path d=\"M12 8.5l3.5 3.5l-3.5 3.5\" />\n    </symbol>\n\n    <symbol id=\"directions\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 21v-4\" />\n      <path d=\"M12 13v-4\" />\n      <path d=\"M12 5v-2\" />\n      <path d=\"M10 21h4\" />\n      <path d=\"M8 5v4h11l2 -2l-2 -2z\" />\n      <path d=\"M14 13v4h-8l-2 -2l2 -2z\" />\n    </symbol>\n\n    <symbol id=\"dog\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M11 5h2\" />\n      <path d=\"M19 12c-.667 5.333 -2.333 8 -5 8h-4c-2.667 0 -4.333 -2.667 -5 -8\" />\n      <path d=\"M11 16c0 .667 .333 1 1 1s1 -.333 1 -1h-2z\" />\n      <path d=\"M12 18v2\" />\n      <path d=\"M10 11v.01\" />\n      <path d=\"M14 11v.01\" />\n      <path\n        d=\"M5 4l6 .97l-6.238 6.688a1.021 1.021 0 0 1 -1.41 .111a.953 .953 0 0 1 -.327 -.954l1.975 -6.815z\" />\n      <path\n        d=\"M19 4l-6 .97l6.238 6.688c.358 .408 .989 .458 1.41 .111a.953 .953 0 0 0 .327 -.954l-1.975 -6.815z\" />\n    </symbol>\n\n    <symbol id=\"edit\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1\" />\n      <path d=\"M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z\" />\n      <path d=\"M16 5l3 3\" />\n    </symbol>\n\n    <symbol id=\"external-link\" viewBox=\"0 0 24 24\"\n      fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\n      stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 6h-6a2 2 0 0 0 -2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-6\" />\n      <path d=\"M11 13l9 -9\" />\n      <path d=\"M15 4h5v5\" />\n    </symbol>\n\n    <symbol id=\"flower\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0\" />\n      <path\n        d=\"M12 2a3 3 0 0 1 3 3c0 .562 -.259 1.442 -.776 2.64l-.724 1.36l1.76 -1.893c.499 -.6 .922 -1 1.27 -1.205a2.968 2.968 0 0 1 4.07 1.099a3.011 3.011 0 0 1 -1.09 4.098c-.374 .217 -.99 .396 -1.846 .535l-2.664 .366l2.4 .326c1 .145 1.698 .337 2.11 .576a3.011 3.011 0 0 1 1.09 4.098a2.968 2.968 0 0 1 -4.07 1.098c-.348 -.202 -.771 -.604 -1.27 -1.205l-1.76 -1.893l.724 1.36c.516 1.199 .776 2.079 .776 2.64a3 3 0 0 1 -6 0c0 -.562 .259 -1.442 .776 -2.64l.724 -1.36l-1.76 1.893c-.499 .601 -.922 1 -1.27 1.205a2.968 2.968 0 0 1 -4.07 -1.098a3.011 3.011 0 0 1 1.09 -4.098c.374 -.218 .99 -.396 1.846 -.536l2.664 -.366l-2.4 -.325c-1 -.145 -1.698 -.337 -2.11 -.576a3.011 3.011 0 0 1 -1.09 -4.099a2.968 2.968 0 0 1 4.07 -1.099c.348 .203 .771 .604 1.27 1.205l1.76 1.894c-1 -2.292 -1.5 -3.625 -1.5 -4a3 3 0 0 1 3 -3z\" />\n    </symbol>\n\n    <symbol id=\"focus-centered\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\" />\n      <path d=\"M4 8v-2a2 2 0 0 1 2 -2h2\" />\n      <path d=\"M4 16v2a2 2 0 0 0 2 2h2\" />\n      <path d=\"M16 4h2a2 2 0 0 1 2 2v2\" />\n      <path d=\"M16 20h2a2 2 0 0 0 2 -2v-2\" />\n    </symbol>\n\n    <symbol id=\"forms\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 3a3 3 0 0 0 -3 3v12a3 3 0 0 0 3 3\" />\n      <path d=\"M6 3a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3\" />\n      <path d=\"M13 7h7a1 1 0 0 1 1 1v8a1 1 0 0 1 -1 1h-7\" />\n      <path d=\"M5 7h-1a1 1 0 0 0 -1 1v8a1 1 0 0 0 1 1h1\" />\n      <path d=\"M17 12h.01\" />\n      <path d=\"M13 12h.01\" />\n    </symbol>\n\n    <symbol id=\"info\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 9h.01\" />\n      <path\n        d=\"M3 5a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-14z\"\n      />\n      <path d=\"M11 12h1v4h1\" />\n    </symbol>\n\n    <symbol id=\"info-filled\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M12 2l.117 .007a1 1 0 0 1 .876 .876l.007 .117v4l.005 .15a2 2 0 0 0 1.838 1.844l.157 .006h4l.117 .007a1 1 0 0 1 .876 .876l.007 .117v9a3 3 0 0 1 -2.824 2.995l-.176 .005h-10a3 3 0 0 1 -2.995 -2.824l-.005 -.176v-14a3 3 0 0 1 2.824 -2.995l.176 -.005zm0 12h-1a1 1 0 0 0 0 2v3a1 1 0 0 0 1 1h1a1 1 0 0 0 1 -1l-.007 -.117a1 1 0 0 0 -.876 -.876l-.117 -.007v-3a1 1 0 0 0 -1 -1m.01 -3h-.01a1 1 0 0 0 -.117 1.993l.127 .007a1 1 0 0 0 0 -2\" />\n      <path d=\"M19 7h-4l-.001 -4.001z\" />\n    </symbol>\n\n    <symbol id=\"info-i\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 9h.01\" />\n      <path d=\"M11 12h1v4h1\" />\n    </symbol>\n\n    <symbol id=\"layers-intersect\" viewBox=\"0 0 24 24\"\n      fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\n      stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M8 4m0 2a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M4 8m0 2a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2z\" />\n    </symbol>\n\n    <symbol id=\"layout\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 4m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v1a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M4 13m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v3a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M14 4m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z\" />\n    </symbol>\n\n    <symbol id=\"layout-board\" viewBox=\"0 0 24 24\"\n      fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\n      stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M4 9h8\" />\n      <path d=\"M12 15h8\" />\n      <path d=\"M12 4v16\" />\n    </symbol>\n\n    <symbol id=\"layout-navbar\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M18 3a3 3 0 0 1 2.995 2.824l.005 .176v12a3 3 0 0 1 -2.824 2.995l-.176 .005h-12a3 3 0 0 1 -2.995 -2.824l-.005 -.176v-12a3 3 0 0 1 2.824 -2.995l.176 -.005h12zm1 6h-14v9a1 1 0 0 0 .883 .993l.117 .007h12a1 1 0 0 0 .993 -.883l.007 -.117v-9z\" />\n    </symbol>\n\n    <symbol id=\"lemon\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M18 4a2 2 0 0 1 1.185 3.611c1.55 2.94 .873 6.917 -1.892 9.682c-2.765 2.765 -6.743 3.442 -9.682 1.892a2 2 0 1 1 -2.796 -2.796c-1.55 -2.94 -.873 -6.917 1.892 -9.682c2.765 -2.765 6.743 -3.442 9.682 -1.892a2 2 0 0 1 1.611 -.815z\" />\n    </symbol>\n\n    <symbol id=\"list-details\" viewBox=\"0 0 24 24\"\n      fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\n      stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M13 5h8\" />\n      <path d=\"M13 9h5\" />\n      <path d=\"M13 15h8\" />\n      <path d=\"M13 19h5\" />\n      <path d=\"M3 4m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z\" />\n      <path d=\"M3 14m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z\" />\n    </symbol>\n\n    <symbol id=\"menu-deep\" viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 6h16\" />\n      <path d=\"M7 12h13\" />\n      <path d=\"M10 18h10\" />\n    </symbol>\n\n    <symbol id=\"moon\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M12 1.992a10 10 0 1 0 9.236 13.838c.341 -.82 -.476 -1.644 -1.298 -1.31a6.5 6.5 0 0 1 -6.864 -10.787l.077 -.08c.551 -.63 .113 -1.653 -.758 -1.653h-.266l-.068 -.006l-.06 -.002z\" />\n    </symbol>\n\n    <symbol id=\"navigation\" viewBox=\"0 0 24 24\"\n      fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\n      stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M12 18.5l7.265 2.463c.196 .077 .42 .032 .57 -.116a.548 .548 0 0 0 .134 -.572l-7.969 -17.275l-7.97 17.275c-.07 .2 -.017 .424 .135 .572c.15 .148 .374 .193 .57 .116l7.265 -2.463\" />\n    </symbol>\n\n    <symbol id=\"palette\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M12 21a9 9 0 0 1 0 -18c4.97 0 9 3.582 9 8c0 1.06 -.474 2.078 -1.318 2.828c-.844 .75 -1.989 1.172 -3.182 1.172h-2.5a2 2 0 0 0 -1 3.75a1.3 1.3 0 0 1 -1 2.25\" />\n      <path d=\"M8.5 10.5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\" />\n      <path d=\"M12.5 7.5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\" />\n      <path d=\"M16.5 10.5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\" />\n    </symbol>\n\n    <symbol id=\"palette-filled\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M12 2c5.498 0 10 4.002 10 9c0 1.351 -.6 2.64 -1.654 3.576c-1.03 .914 -2.412 1.424 -3.846 1.424h-2.516a1 1 0 0 0 -.5 1.875a1 1 0 0 1 .194 .14a2.3 2.3 0 0 1 -1.597 3.99l-.156 -.009l.068 .004l-.273 -.004c-5.3 -.146 -9.57 -4.416 -9.716 -9.716l-.004 -.28c0 -5.523 4.477 -10 10 -10m-3.5 6.5a2 2 0 0 0 -1.995 1.85l-.005 .15a2 2 0 1 0 2 -2m8 0a2 2 0 0 0 -1.995 1.85l-.005 .15a2 2 0 1 0 2 -2m-4 -3a2 2 0 0 0 -1.995 1.85l-.005 .15a2 2 0 1 0 2 -2\" />\n    </symbol>\n\n    <symbol id=\"photo\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M15 8h.01\" />\n      <path d=\"M3 6a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3v-12z\" />\n      <path d=\"M3 16l5 -5c.928 -.893 2.072 -.893 3 0l5 5\" />\n      <path d=\"M14 14l1 -1c.928 -.893 2.072 -.893 3 0l3 3\" />\n    </symbol>\n\n    <symbol id=\"photo-up\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M15 8h.01\" />\n      <path d=\"M12.5 21h-6.5a3 3 0 0 1 -3 -3v-12a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v6.5\" />\n      <path d=\"M3 16l5 -5c.928 -.893 2.072 -.893 3 0l3.5 3.5\" />\n      <path d=\"M14 14l1 -1c.679 -.653 1.473 -.829 2.214 -.526\" />\n      <path d=\"M19 22v-6\" />\n      <path d=\"M22 19l-3 -3l-3 3\" />\n    </symbol>\n\n    <symbol id=\"pin\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M15.113 3.21l.094 .083l5.5 5.5a1 1 0 0 1 -1.175 1.59l-3.172 3.171l-1.424 3.797a1 1 0 0 1 -.158 .277l-.07 .08l-1.5 1.5a1 1 0 0 1 -1.32 .082l-.095 -.083l-2.793 -2.792l-3.793 3.792a1 1 0 0 1 -1.497 -1.32l.083 -.094l3.792 -3.793l-2.792 -2.793a1 1 0 0 1 -.083 -1.32l.083 -.094l1.5 -1.5a1 1 0 0 1 .258 -.187l.098 -.042l3.796 -1.425l3.171 -3.17a1 1 0 0 1 1.497 -1.26z\" />\n    </symbol>\n\n    <symbol id=\"pinned\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M16 3a1 1 0 0 1 .117 1.993l-.117 .007v4.764l1.894 3.789a1 1 0 0 1 .1 .331l.006 .116v2a1 1 0 0 1 -.883 .993l-.117 .007h-4v4a1 1 0 0 1 -1.993 .117l-.007 -.117v-4h-4a1 1 0 0 1 -.993 -.883l-.007 -.117v-2a1 1 0 0 1 .06 -.34l.046 -.107l1.894 -3.791v-4.762a1 1 0 0 1 -.117 -1.993l.117 -.007h8z\" />\n    </symbol>\n\n    <symbol id=\"plus\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 5l0 14\" />\n      <path d=\"M5 12l14 0\" />\n    </symbol>\n\n    <symbol id=\"progress\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"/>\n      <path d=\"M10 20.777a8.942 8.942 0 0 1 -2.48 -.969\" />\n      <path d=\"M14 3.223a9.003 9.003 0 0 1 0 17.554\" />\n      <path d=\"M4.579 17.093a8.961 8.961 0 0 1 -1.227 -2.592\" />\n      <path d=\"M3.124 10.5c.16 -.95 .468 -1.85 .9 -2.675l.169 -.305\" />\n      <path d=\"M6.907 4.579a8.954 8.954 0 0 1 3.093 -1.356\" />\n    </symbol>\n\n    <symbol id=\"rectangle\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M3 5m0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z\" />\n    </symbol>\n\n    <symbol id=\"rocket\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M4 13a8 8 0 0 1 7 7a6 6 0 0 0 3 -5a9 9 0 0 0 6 -8a3 3 0 0 0 -3 -3a9 9 0 0 0 -8 6a6 6 0 0 0 -5 3\" />\n      <path d=\"M7 14a6 6 0 0 0 -3 6a6 6 0 0 0 6 -3\" />\n      <path d=\"M15 9m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\" />\n    </symbol>\n\n    <symbol id=\"save\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M6 4h10l4 4v10a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2\" />\n      <path d=\"M12 14m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0\" />\n      <path d=\"M14 4l0 4l-6 0l0 -4\" />\n    </symbol>\n\n    <symbol id=\"search\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <circle cx=\"10\" cy=\"10\" r=\"7\" />\n      <path d=\"M21 21l-6 -6\" />\n    </symbol>\n\n    <symbol id=\"select\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M3 3m0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M9 11l3 3l3 -3\" />\n    </symbol>\n\n    <symbol id=\"sign-in\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M9 8v-2a2 2 0 0 1 2 -2h7a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-7a2 2 0 0 1 -2 -2v-2\" />\n      <path d=\"M3 12h13l-3 -3\" />\n      <path d=\"M13 15l3 -3\" />\n    </symbol>\n\n    <symbol id=\"sign-out\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M10 8v-2a2 2 0 0 1 2 -2h7a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-7a2 2 0 0 1 -2 -2v-2\" />\n      <path d=\"M15 12h-12l3 -3\" />\n      <path d=\"M6 15l-3 -3\" />\n    </symbol>\n\n    <symbol id=\"sitemap\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M3 15m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v2a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M15 15m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v2a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M9 3m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v2a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M6 15v-1a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v1\" />\n      <path d=\"M12 9l0 3\" />\n    </symbol>\n\n    <symbol id=\"sun\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M12 19a1 1 0 0 1 .993 .883l.007 .117v1a1 1 0 0 1 -1.993 .117l-.007 -.117v-1a1 1 0 0 1 1 -1z\" />\n      <path\n        d=\"M18.313 16.91l.094 .083l.7 .7a1 1 0 0 1 -1.32 1.497l-.094 -.083l-.7 -.7a1 1 0 0 1 1.218 -1.567l.102 .07z\" />\n      <path\n        d=\"M7.007 16.993a1 1 0 0 1 .083 1.32l-.083 .094l-.7 .7a1 1 0 0 1 -1.497 -1.32l.083 -.094l.7 -.7a1 1 0 0 1 1.414 0z\" />\n      <path d=\"M4 11a1 1 0 0 1 .117 1.993l-.117 .007h-1a1 1 0 0 1 -.117 -1.993l.117 -.007h1z\" />\n      <path d=\"M21 11a1 1 0 0 1 .117 1.993l-.117 .007h-1a1 1 0 0 1 -.117 -1.993l.117 -.007h1z\" />\n      <path\n        d=\"M6.213 4.81l.094 .083l.7 .7a1 1 0 0 1 -1.32 1.497l-.094 -.083l-.7 -.7a1 1 0 0 1 1.217 -1.567l.102 .07z\" />\n      <path\n        d=\"M19.107 4.893a1 1 0 0 1 .083 1.32l-.083 .094l-.7 .7a1 1 0 0 1 -1.497 -1.32l.083 -.094l.7 -.7a1 1 0 0 1 1.414 0z\" />\n      <path\n        d=\"M12 2a1 1 0 0 1 .993 .883l.007 .117v1a1 1 0 0 1 -1.993 .117l-.007 -.117v-1a1 1 0 0 1 1 -1z\" />\n      <path d=\"M12 7a5 5 0 1 1 -4.995 5.217l-.005 -.217l.005 -.217a5 5 0 0 1 4.995 -4.783z\" />\n    </symbol>\n\n    <symbol id=\"table\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M3 5a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-14z\" />\n      <path d=\"M3 10h18\" />\n      <path d=\"M10 3v18\" />\n    </symbol>\n\n    <symbol id=\"tags\" viewBox=\"0 0 24 24\"\n      fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\n      stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M3 8v4.172a2 2 0 0 0 .586 1.414l5.71 5.71a2.41 2.41 0 0 0 3.408 0l3.592 -3.592a2.41 2.41 0 0 0 0 -3.408l-5.71 -5.71a2 2 0 0 0 -1.414 -.586h-4.172a2 2 0 0 0 -2 2z\" />\n      <path d=\"M18 19l1.592 -1.592a4.82 4.82 0 0 0 0 -6.816l-4.592 -4.592\" />\n      <path d=\"M7 10h-.01\" />\n    </symbol>\n\n    <symbol id=\"tooltip\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"/>\n      <path d=\"M10 18a2 2 0 1 0 4 0a2 2 0 1 0 -4 0\" />\n      <path d=\"M12 13l-1.707 -1.707a1 1 0 0 0 -.707 -.293h-2.586a2 2 0 0 1 -2 -2v-3a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v3a2 2 0 0 1 -2 2h-2.586a1 1 0 0 0 -.707 .293l-1.707 1.707\" />\n    </symbol>\n\n    <symbol id=\"trash\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 7l16 0\" />\n      <path d=\"M10 11l0 6\" />\n      <path d=\"M14 11l0 6\" />\n      <path d=\"M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12\" />\n      <path d=\"M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3\" />\n    </symbol>\n\n    <symbol id=\"typography\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 20l3 0\" />\n      <path d=\"M14 20l7 0\" />\n      <path d=\"M6.9 15l6.9 0\" />\n      <path d=\"M10.2 6.3l5.8 13.7\" />\n      <path d=\"M5 20l6 -16l2 0l7 16\" />\n    </symbol>\n\n    <symbol\n      id=\"upload\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      stroke-width=\"2\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n    >\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-2\" />\n      <path d=\"M7 9l5 -5l5 5\" />\n      <path d=\"M12 4l0 12\" />\n    </symbol>\n\n    <symbol id=\"user\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0\" />\n      <path d=\"M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2\" />\n    </symbol>\n\n    <symbol id=\"user-add\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0\" />\n      <path d=\"M16 19h6\" />\n      <path d=\"M19 16v6\" />\n      <path d=\"M6 21v-2a4 4 0 0 1 4 -4h4\" />\n    </symbol>\n\n    <symbol id=\"user-circle\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0\" />\n      <path d=\"M12 10m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0\" />\n      <path d=\"M6.168 18.849a4 4 0 0 1 3.832 -2.849h4a4 4 0 0 1 3.834 2.855\" />\n    </symbol>\n    <symbol id=\"users\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M9 7m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0\" />\n      <path d=\"M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2\" />\n      <path d=\"M16 3.13a4 4 0 0 1 0 7.75\" />\n      <path d=\"M21 21v-2a4 4 0 0 0 -3 -3.85\" />\n    </symbol>\n    <symbol id=\"wand\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M6 21l15 -15l-3 -3l-15 15l3 3\" />\n      <path d=\"M15 6l3 3\" />\n      <path\n        d=\"M9 3a2 2 0 0 0 2 2a2 2 0 0 0 -2 2a2 2 0 0 0 -2 -2a2 2 0 0 0 2 -2\"\n      />\n      <path\n        d=\"M19 13a2 2 0 0 0 2 2a2 2 0 0 0 -2 2a2 2 0 0 0 -2 -2a2 2 0 0 0 2 -2\"\n      />\n    </symbol>\n    <symbol id=\"code\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M7 8l-4 4l4 4\" />\n      <path d=\"M17 8l4 4l-4 4\" />\n      <path d=\"M14 4l-4 16\" />\n    </symbol>\n  </defs>\n</svg>";
+export declare const ICON_SPRITE = "<svg id=\"esp-icons\" data-esp-icon-sprite=\"\" aria-hidden=\"true\" style=\"display: none\" xmlns=\"http://www.w3.org/2000/svg\">\n  <defs>\n    <symbol\n      id=\"taproot-logo\"\n      viewBox=\"0 0 1000 1000\"\n      fill=\"currentColor\"\n    >\n      <path\n        d=\"M282.2,260.1c11.4-17.2,34.6-21.9,51.8-10.5l128.7,85.2v-62.6l-88.3-59.1c-17.2-11.5-21.7-34.7-10.3-51.8,11.5-17.1,34.7-21.7,51.8-10.3l46.8,31.3v-100.5c0-20.6,16.7-37.3,37.3-37.3s37.4,16.7,37.4,37.3v41.4l28.5-20c16.9-11.9,40.2-7.8,52,9.1,11.9,16.9,7.8,40.2-9.1,52l-71.4,50.2v37.5h0v24.6l110.8-75.2c17.1-11.6,40.3-7.2,51.9,9.9,11.6,17.1,7.2,40.3-9.9,51.9l-152.7,103.8v37h0v257.3c0,20.6-16.7,37.4-37.4,37.4s-37.3-16.7-37.3-37.4v-236.8l-170-112.6c-17.2-11.4-21.9-34.6-10.5-51.8h0ZM630.2,451.6c-18.1-10-40.8-3.5-50.8,14.6-10,18-3.5,40.7,14.5,50.8,61.8,34.3,100.2,99.3,100.2,169.8,0,107-87.1,194.1-194.1,194.1s-194.1-87.1-194.1-194.1,38.4-135.5,100.2-169.8c18-10,24.5-32.7,14.5-50.8-10-18.1-32.7-24.6-50.8-14.6-85.5,47.4-138.6,137.5-138.6,235.1,0,148.2,120.5,268.8,268.7,268.8s268.8-120.6,268.8-268.8c0-97.6-53.1-187.7-138.6-235.1Z\"\n      />\n    </symbol>\n\n    <symbol id=\"album\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M7 3m0 2.667a2.667 2.667 0 0 1 2.667 -2.667h8.666a2.667 2.667 0 0 1 2.667 2.667v8.666a2.667 2.667 0 0 1 -2.667 2.667h-8.666a2.667 2.667 0 0 1 -2.667 -2.667z\" />\n      <path\n        d=\"M4.012 7.26a2.005 2.005 0 0 0 -1.012 1.737v10c0 1.1 .9 2 2 2h10c.75 0 1.158 -.385 1.5 -1\" />\n      <path d=\"M17 7h.01\" />\n      <path d=\"M7 13l3.644 -3.644a1.21 1.21 0 0 1 1.712 0l3.644 3.644\" />\n      <path d=\"M15 12l1.644 -1.644a1.21 1.21 0 0 1 1.712 0l2.644 2.644\" />\n    </symbol>\n    <symbol id=\"align-left\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 6l16 0\" />\n      <path d=\"M4 12l10 0\" />\n      <path d=\"M4 18l14 0\" />\n    </symbol>\n    <symbol id=\"align-center\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 6l16 0\" />\n      <path d=\"M8 12l8 0\" />\n      <path d=\"M6 18l12 0\" />\n    </symbol>\n    <symbol id=\"align-right\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 6l16 0\" />\n      <path d=\"M10 12l10 0\" />\n      <path d=\"M6 18l14 0\" />\n    </symbol>\n\n    <symbol id=\"apple\" viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M4 11.319c0 3.102 .444 5.319 2.222 7.978c1.351 1.797 3.156 2.247 5.08 .988c.426 -.268 .97 -.268 1.397 0c1.923 1.26 3.728 .809 5.079 -.988c1.778 -2.66 2.222 -4.876 2.222 -7.977c0 -2.661 -1.99 -5.32 -4.444 -5.32c-1.267 0 -2.41 .693 -3.22 1.44a.5 .5 0 0 1 -.672 0c-.809 -.746 -1.953 -1.44 -3.22 -1.44c-2.454 0 -4.444 2.66 -4.444 5.319\" />\n      <path d=\"M7 12c0 -1.47 .454 -2.34 1.5 -3\" />\n      <path d=\"M12 7c0 -1.2 .867 -4 3 -4\" />\n    </symbol>\n\n    <symbol id=\"arrow-big-down\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M10 2l-.15 .005a2 2 0 0 0 -1.85 1.995v6.999l-2.586 .001a2 2 0 0 0 -1.414 3.414l6.586 6.586a2 2 0 0 0 2.828 0l6.586 -6.586a2 2 0 0 0 .434 -2.18l-.068 -.145a2 2 0 0 0 -1.78 -1.089l-2.586 -.001v-6.999a2 2 0 0 0 -2 -2h-4z\" />\n    </symbol>\n\n    <symbol id=\"arrow-big-left\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M9.586 4l-6.586 6.586a2 2 0 0 0 0 2.828l6.586 6.586a2 2 0 0 0 2.18 .434l.145 -.068a2 2 0 0 0 1.089 -1.78v-2.586h7a2 2 0 0 0 2 -2v-4l-.005 -.15a2 2 0 0 0 -1.995 -1.85l-7 -.001v-2.585a2 2 0 0 0 -3.414 -1.414z\" />\n    </symbol>\n\n    <symbol id=\"arrow-big-right\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M12.089 3.634a2 2 0 0 0 -1.089 1.78l-.001 2.586h-6.999a2 2 0 0 0 -2 2v4l.005 .15a2 2 0 0 0 1.995 1.85l6.999 -.001l.001 2.587a2 2 0 0 0 3.414 1.414l6.586 -6.586a2 2 0 0 0 0 -2.828l-6.586 -6.586a2 2 0 0 0 -2.18 -.434l-.145 .068z\" />\n    </symbol>\n\n    <symbol id=\"article\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M3 4m0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z\"\n      />\n      <path d=\"M7 8h10\" />\n      <path d=\"M7 12h10\" />\n      <path d=\"M7 16h10\" />\n    </symbol>\n\n    <symbol id=\"bat\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M17 16c.74 -2.286 2.778 -3.762 5 -3c-.173 -2.595 .13 -5.314 -2 -7.5c-1.708 2.648 -3.358 2.557 -5 2.5v-4l-3 2l-3 -2v4c-1.642 .057 -3.292 .148 -5 -2.5c-2.13 2.186 -1.827 4.905 -2 7.5c2.222 -.762 4.26 .714 5 3c2.593 0 3.889 .952 5 4c1.111 -3.048 2.407 -4 5 -4z\" />\n      <path d=\"M9 8a3 3 0 0 0 6 0\" />\n    </symbol>\n\n    <symbol id=\"brand-github\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M5.315 2.1c.791 -.113 1.9 .145 3.333 .966l.272 .161l.16 .1l.397 -.083a13.3 13.3 0 0 1 4.59 -.08l.456 .08l.396 .083l.161 -.1c1.385 -.84 2.487 -1.17 3.322 -1.148l.164 .008l.147 .017l.076 .014l.05 .011l.144 .047a1 1 0 0 1 .53 .514a5.2 5.2 0 0 1 .397 2.91l-.047 .267l-.046 .196l.123 .163c.574 .795 .93 1.728 1.03 2.707l.023 .295l.007 .272c0 3.855 -1.659 5.883 -4.644 6.68l-.245 .061l-.132 .029l.014 .161l.008 .157l.004 .365l-.002 .213l-.003 3.834a1 1 0 0 1 -.883 .993l-.117 .007h-6a1 1 0 0 1 -.993 -.883l-.007 -.117v-.734c-1.818 .26 -3.03 -.424 -4.11 -1.878l-.535 -.766c-.28 -.396 -.455 -.579 -.589 -.644l-.048 -.019a1 1 0 0 1 .564 -1.918c.642 .188 1.074 .568 1.57 1.239l.538 .769c.76 1.079 1.36 1.459 2.609 1.191l.001 -.678l-.018 -.168a5.03 5.03 0 0 1 -.021 -.824l.017 -.185l.019 -.12l-.108 -.024c-2.976 -.71 -4.703 -2.573 -4.875 -6.139l-.01 -.31l-.004 -.292a5.6 5.6 0 0 1 .908 -3.051l.152 -.222l.122 -.163l-.045 -.196a5.2 5.2 0 0 1 .145 -2.642l.1 -.282l.106 -.253a1 1 0 0 1 .529 -.514l.144 -.047l.154 -.03z\" />\n    </symbol>\n\n    <symbol id=\"box\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 3l8 4.5l0 9l-8 4.5l-8 -4.5l0 -9l8 -4.5\" />\n      <path d=\"M12 12l8 -4.5\" />\n      <path d=\"M12 12l0 9\" />\n      <path d=\"M12 12l-8 -4.5\" />\n    </symbol>\n\n    <symbol id=\"box-multiple\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M7 3m0 2a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M17 17v2a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2v-10a2 2 0 0 1 2 -2h2\" />\n    </symbol>\n\n    <symbol id=\"bread\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"/>\n      <path d=\"M18 4a3 3 0 0 1 2 5.235v8.765a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-8.764a3 3 0 0 1 1.824 -5.231h12.176v-.005\" />\n    </symbol>\n\n    <symbol id=\"brightness-2\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0\" />\n      <path\n        d=\"M6 6h3.5l2.5 -2.5l2.5 2.5h3.5v3.5l2.5 2.5l-2.5 2.5v3.5h-3.5l-2.5 2.5l-2.5 -2.5h-3.5v-3.5l-2.5 -2.5l2.5 -2.5z\" />\n    </symbol>\n\n    <symbol id=\"building\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M3 21l18 0\" />\n      <path d=\"M9 8l1 0\" />\n      <path d=\"M9 12l1 0\" />\n      <path d=\"M9 16l1 0\" />\n      <path d=\"M14 8l1 0\" />\n      <path d=\"M14 12l1 0\" />\n      <path d=\"M14 16l1 0\" />\n      <path d=\"M5 21v-16a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v16\" />\n    </symbol>\n\n    <symbol id=\"burger\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 15h16a4 4 0 0 1 -4 4h-8a4 4 0 0 1 -4 -4z\" />\n      <path d=\"M12 4c3.783 0 6.953 2.133 7.786 5h-15.572c.833 -2.867 4.003 -5 7.786 -5z\" />\n      <path d=\"M5 12h14\" />\n    </symbol>\n\n    <symbol id=\"button\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 8m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v4a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z\" />\n    </symbol>\n\n    <symbol id=\"calendar\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path d=\"M4 7a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2z\" />\n      <path d=\"M16 3v4\" />\n      <path d=\"M8 3v4\" />\n      <path d=\"M4 11h16\" />\n      <path d=\"M11 15h1\" />\n      <path d=\"M12 15v3\" />\n    </symbol>\n\n    <symbol id=\"cat\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M20 3v10a8 8 0 1 1 -16 0v-10l3.432 3.432a7.963 7.963 0 0 1 4.568 -1.432c1.769 0 3.403 .574 4.728 1.546l3.272 -3.546z\" />\n      <path d=\"M2 16h5l-4 4\" />\n      <path d=\"M22 16h-5l4 4\" />\n      <path d=\"M12 16m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\" />\n      <path d=\"M9 11v.01\" />\n      <path d=\"M15 11v.01\" />\n    </symbol>\n\n    <symbol id=\"category\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 4h6v6h-6z\" />\n      <path d=\"M14 4h6v6h-6z\" />\n      <path d=\"M4 14h6v6h-6z\" />\n      <path d=\"M17 17m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0\" />\n    </symbol>\n\n    <symbol id=\"chef-hat\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M12 3c1.918 0 3.52 1.35 3.91 3.151a4 4 0 0 1 2.09 7.723l0 7.126h-12v-7.126a4 4 0 1 1 2.092 -7.723a4 4 0 0 1 3.908 -3.151z\" />\n      <path d=\"M6.161 17.009l11.839 -.009\" />\n    </symbol>\n\n    <symbol id=\"cherry\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M7.5 16.5m-3.5 0a3.5 3.5 0 1 0 7 0a3.5 3.5 0 1 0 -7 0\" />\n      <path d=\"M17 18m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0\" />\n      <path d=\"M9 13c.366 -2 1.866 -3.873 4.5 -5.6\" />\n      <path d=\"M17 15c-1.333 -2.333 -2.333 -5.333 -1 -9\" />\n      <path d=\"M5 6c3.667 -2.667 7.333 -2.667 11 0c-3.667 2.667 -7.333 2.667 -11 0\" />\n    </symbol>\n\n    <symbol id=\"checkbox\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M9 12l2 2l4 -4\" />\n      <path d=\"M12 3c7.2 0 9 1.8 9 9s-1.8 9 -9 9s-9 -1.8 -9 -9s1.8 -9 9 -9\" />\n    </symbol>\n\n    <symbol id=\"circle-dot\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M8 12a4 4 0 1 0 8 0a4 4 0 1 0 -8 0\" fill=\"currentColor\" />\n      <path d=\"M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0\" />\n    </symbol>\n\n    <symbol id=\"circle-x\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0\" />\n      <path d=\"M10 10l4 4m0 -4l-4 4\" />\n    </symbol>\n\n    <symbol id=\"cog\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z\" />\n      <path d=\"M9 12a3 3 0 1 0 6 0a3 3 0 0 0 -6 0\" />\n    </symbol>\n\n    <symbol id=\"deer\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M3 3c0 2 1 3 4 3c2 0 3 1 3 3\" />\n      <path d=\"M21 3c0 2 -1 3 -4 3c-2 0 -3 .333 -3 3\" />\n      <path d=\"M12 18c-1 0 -4 -3 -4 -6c0 -2 1.333 -3 4 -3s4 1 4 3c0 3 -3 6 -4 6\" />\n      <path d=\"M15.185 14.889l.095 -.18a4 4 0 1 1 -6.56 0\" />\n      <path d=\"M17 3c0 1.333 -.333 2.333 -1 3\" />\n      <path d=\"M7 3c0 1.333 .333 2.333 1 3\" />\n      <path d=\"M7 6c-2.667 .667 -4.333 1.667 -5 3\" />\n      <path d=\"M17 6c2.667 .667 4.333 1.667 5 3\" />\n      <path d=\"M8.5 10l-1.5 -1\" />\n      <path d=\"M15.5 10l1.5 -1\" />\n      <path d=\"M12 15h.01\" />\n    </symbol>\n\n    <symbol id=\"direction-sign\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M3.32 12.774l7.906 7.905c.427 .428 1.12 .428 1.548 0l7.905 -7.905a1.095 1.095 0 0 0 0 -1.548l-7.905 -7.905a1.095 1.095 0 0 0 -1.548 0l-7.905 7.905a1.095 1.095 0 0 0 0 1.548z\" />\n      <path d=\"M8 12h7.5\" />\n      <path d=\"M12 8.5l3.5 3.5l-3.5 3.5\" />\n    </symbol>\n\n    <symbol id=\"directions\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 21v-4\" />\n      <path d=\"M12 13v-4\" />\n      <path d=\"M12 5v-2\" />\n      <path d=\"M10 21h4\" />\n      <path d=\"M8 5v4h11l2 -2l-2 -2z\" />\n      <path d=\"M14 13v4h-8l-2 -2l2 -2z\" />\n    </symbol>\n\n    <symbol id=\"dog\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M11 5h2\" />\n      <path d=\"M19 12c-.667 5.333 -2.333 8 -5 8h-4c-2.667 0 -4.333 -2.667 -5 -8\" />\n      <path d=\"M11 16c0 .667 .333 1 1 1s1 -.333 1 -1h-2z\" />\n      <path d=\"M12 18v2\" />\n      <path d=\"M10 11v.01\" />\n      <path d=\"M14 11v.01\" />\n      <path\n        d=\"M5 4l6 .97l-6.238 6.688a1.021 1.021 0 0 1 -1.41 .111a.953 .953 0 0 1 -.327 -.954l1.975 -6.815z\" />\n      <path\n        d=\"M19 4l-6 .97l6.238 6.688c.358 .408 .989 .458 1.41 .111a.953 .953 0 0 0 .327 -.954l-1.975 -6.815z\" />\n    </symbol>\n\n    <symbol id=\"edit\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1\" />\n      <path d=\"M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z\" />\n      <path d=\"M16 5l3 3\" />\n    </symbol>\n\n    <symbol id=\"external-link\" viewBox=\"0 0 24 24\"\n      fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\n      stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 6h-6a2 2 0 0 0 -2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-6\" />\n      <path d=\"M11 13l9 -9\" />\n      <path d=\"M15 4h5v5\" />\n    </symbol>\n\n    <symbol id=\"flower\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0\" />\n      <path\n        d=\"M12 2a3 3 0 0 1 3 3c0 .562 -.259 1.442 -.776 2.64l-.724 1.36l1.76 -1.893c.499 -.6 .922 -1 1.27 -1.205a2.968 2.968 0 0 1 4.07 1.099a3.011 3.011 0 0 1 -1.09 4.098c-.374 .217 -.99 .396 -1.846 .535l-2.664 .366l2.4 .326c1 .145 1.698 .337 2.11 .576a3.011 3.011 0 0 1 1.09 4.098a2.968 2.968 0 0 1 -4.07 1.098c-.348 -.202 -.771 -.604 -1.27 -1.205l-1.76 -1.893l.724 1.36c.516 1.199 .776 2.079 .776 2.64a3 3 0 0 1 -6 0c0 -.562 .259 -1.442 .776 -2.64l.724 -1.36l-1.76 1.893c-.499 .601 -.922 1 -1.27 1.205a2.968 2.968 0 0 1 -4.07 -1.098a3.011 3.011 0 0 1 1.09 -4.098c.374 -.218 .99 -.396 1.846 -.536l2.664 -.366l-2.4 -.325c-1 -.145 -1.698 -.337 -2.11 -.576a3.011 3.011 0 0 1 -1.09 -4.099a2.968 2.968 0 0 1 4.07 -1.099c.348 .203 .771 .604 1.27 1.205l1.76 1.894c-1 -2.292 -1.5 -3.625 -1.5 -4a3 3 0 0 1 3 -3z\" />\n    </symbol>\n\n    <symbol id=\"focus-centered\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\" />\n      <path d=\"M4 8v-2a2 2 0 0 1 2 -2h2\" />\n      <path d=\"M4 16v2a2 2 0 0 0 2 2h2\" />\n      <path d=\"M16 4h2a2 2 0 0 1 2 2v2\" />\n      <path d=\"M16 20h2a2 2 0 0 0 2 -2v-2\" />\n    </symbol>\n\n    <symbol id=\"forms\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 3a3 3 0 0 0 -3 3v12a3 3 0 0 0 3 3\" />\n      <path d=\"M6 3a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3\" />\n      <path d=\"M13 7h7a1 1 0 0 1 1 1v8a1 1 0 0 1 -1 1h-7\" />\n      <path d=\"M5 7h-1a1 1 0 0 0 -1 1v8a1 1 0 0 0 1 1h1\" />\n      <path d=\"M17 12h.01\" />\n      <path d=\"M13 12h.01\" />\n    </symbol>\n\n    <symbol id=\"info\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 9h.01\" />\n      <path\n        d=\"M3 5a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-14z\"\n      />\n      <path d=\"M11 12h1v4h1\" />\n    </symbol>\n\n    <symbol id=\"info-filled\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M12 2l.117 .007a1 1 0 0 1 .876 .876l.007 .117v4l.005 .15a2 2 0 0 0 1.838 1.844l.157 .006h4l.117 .007a1 1 0 0 1 .876 .876l.007 .117v9a3 3 0 0 1 -2.824 2.995l-.176 .005h-10a3 3 0 0 1 -2.995 -2.824l-.005 -.176v-14a3 3 0 0 1 2.824 -2.995l.176 -.005zm0 12h-1a1 1 0 0 0 0 2v3a1 1 0 0 0 1 1h1a1 1 0 0 0 1 -1l-.007 -.117a1 1 0 0 0 -.876 -.876l-.117 -.007v-3a1 1 0 0 0 -1 -1m.01 -3h-.01a1 1 0 0 0 -.117 1.993l.127 .007a1 1 0 0 0 0 -2\" />\n      <path d=\"M19 7h-4l-.001 -4.001z\" />\n    </symbol>\n\n    <symbol id=\"info-i\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 9h.01\" />\n      <path d=\"M11 12h1v4h1\" />\n    </symbol>\n\n    <symbol id=\"layers-intersect\" viewBox=\"0 0 24 24\"\n      fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\n      stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M8 4m0 2a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M4 8m0 2a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2z\" />\n    </symbol>\n\n    <symbol id=\"layout\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 4m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v1a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M4 13m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v3a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M14 4m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z\" />\n    </symbol>\n\n    <symbol id=\"layout-board\" viewBox=\"0 0 24 24\"\n      fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\n      stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M4 9h8\" />\n      <path d=\"M12 15h8\" />\n      <path d=\"M12 4v16\" />\n    </symbol>\n\n    <symbol id=\"layout-navbar\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M18 3a3 3 0 0 1 2.995 2.824l.005 .176v12a3 3 0 0 1 -2.824 2.995l-.176 .005h-12a3 3 0 0 1 -2.995 -2.824l-.005 -.176v-12a3 3 0 0 1 2.824 -2.995l.176 -.005h12zm1 6h-14v9a1 1 0 0 0 .883 .993l.117 .007h12a1 1 0 0 0 .993 -.883l.007 -.117v-9z\" />\n    </symbol>\n\n    <symbol id=\"lemon\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M18 4a2 2 0 0 1 1.185 3.611c1.55 2.94 .873 6.917 -1.892 9.682c-2.765 2.765 -6.743 3.442 -9.682 1.892a2 2 0 1 1 -2.796 -2.796c-1.55 -2.94 -.873 -6.917 1.892 -9.682c2.765 -2.765 6.743 -3.442 9.682 -1.892a2 2 0 0 1 1.611 -.815z\" />\n    </symbol>\n\n    <symbol id=\"list-details\" viewBox=\"0 0 24 24\"\n      fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\n      stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M13 5h8\" />\n      <path d=\"M13 9h5\" />\n      <path d=\"M13 15h8\" />\n      <path d=\"M13 19h5\" />\n      <path d=\"M3 4m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z\" />\n      <path d=\"M3 14m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z\" />\n    </symbol>\n\n    <symbol id=\"menu-deep\" viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 6h16\" />\n      <path d=\"M7 12h13\" />\n      <path d=\"M10 18h10\" />\n    </symbol>\n\n    <symbol id=\"moon\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M12 1.992a10 10 0 1 0 9.236 13.838c.341 -.82 -.476 -1.644 -1.298 -1.31a6.5 6.5 0 0 1 -6.864 -10.787l.077 -.08c.551 -.63 .113 -1.653 -.758 -1.653h-.266l-.068 -.006l-.06 -.002z\" />\n    </symbol>\n\n    <symbol id=\"navigation\" viewBox=\"0 0 24 24\"\n      fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\n      stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M12 18.5l7.265 2.463c.196 .077 .42 .032 .57 -.116a.548 .548 0 0 0 .134 -.572l-7.969 -17.275l-7.97 17.275c-.07 .2 -.017 .424 .135 .572c.15 .148 .374 .193 .57 .116l7.265 -2.463\" />\n    </symbol>\n\n    <symbol id=\"palette\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M12 21a9 9 0 0 1 0 -18c4.97 0 9 3.582 9 8c0 1.06 -.474 2.078 -1.318 2.828c-.844 .75 -1.989 1.172 -3.182 1.172h-2.5a2 2 0 0 0 -1 3.75a1.3 1.3 0 0 1 -1 2.25\" />\n      <path d=\"M8.5 10.5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\" />\n      <path d=\"M12.5 7.5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\" />\n      <path d=\"M16.5 10.5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\" />\n    </symbol>\n\n    <symbol id=\"palette-filled\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M12 2c5.498 0 10 4.002 10 9c0 1.351 -.6 2.64 -1.654 3.576c-1.03 .914 -2.412 1.424 -3.846 1.424h-2.516a1 1 0 0 0 -.5 1.875a1 1 0 0 1 .194 .14a2.3 2.3 0 0 1 -1.597 3.99l-.156 -.009l.068 .004l-.273 -.004c-5.3 -.146 -9.57 -4.416 -9.716 -9.716l-.004 -.28c0 -5.523 4.477 -10 10 -10m-3.5 6.5a2 2 0 0 0 -1.995 1.85l-.005 .15a2 2 0 1 0 2 -2m8 0a2 2 0 0 0 -1.995 1.85l-.005 .15a2 2 0 1 0 2 -2m-4 -3a2 2 0 0 0 -1.995 1.85l-.005 .15a2 2 0 1 0 2 -2\" />\n    </symbol>\n\n    <symbol id=\"photo\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M15 8h.01\" />\n      <path d=\"M3 6a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3v-12z\" />\n      <path d=\"M3 16l5 -5c.928 -.893 2.072 -.893 3 0l5 5\" />\n      <path d=\"M14 14l1 -1c.928 -.893 2.072 -.893 3 0l3 3\" />\n    </symbol>\n\n    <symbol id=\"photo-up\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M15 8h.01\" />\n      <path d=\"M12.5 21h-6.5a3 3 0 0 1 -3 -3v-12a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v6.5\" />\n      <path d=\"M3 16l5 -5c.928 -.893 2.072 -.893 3 0l3.5 3.5\" />\n      <path d=\"M14 14l1 -1c.679 -.653 1.473 -.829 2.214 -.526\" />\n      <path d=\"M19 22v-6\" />\n      <path d=\"M22 19l-3 -3l-3 3\" />\n    </symbol>\n\n    <symbol id=\"pin\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M15.113 3.21l.094 .083l5.5 5.5a1 1 0 0 1 -1.175 1.59l-3.172 3.171l-1.424 3.797a1 1 0 0 1 -.158 .277l-.07 .08l-1.5 1.5a1 1 0 0 1 -1.32 .082l-.095 -.083l-2.793 -2.792l-3.793 3.792a1 1 0 0 1 -1.497 -1.32l.083 -.094l3.792 -3.793l-2.792 -2.793a1 1 0 0 1 -.083 -1.32l.083 -.094l1.5 -1.5a1 1 0 0 1 .258 -.187l.098 -.042l3.796 -1.425l3.171 -3.17a1 1 0 0 1 1.497 -1.26z\" />\n    </symbol>\n\n    <symbol id=\"pinned\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M16 3a1 1 0 0 1 .117 1.993l-.117 .007v4.764l1.894 3.789a1 1 0 0 1 .1 .331l.006 .116v2a1 1 0 0 1 -.883 .993l-.117 .007h-4v4a1 1 0 0 1 -1.993 .117l-.007 -.117v-4h-4a1 1 0 0 1 -.993 -.883l-.007 -.117v-2a1 1 0 0 1 .06 -.34l.046 -.107l1.894 -3.791v-4.762a1 1 0 0 1 -.117 -1.993l.117 -.007h8z\" />\n    </symbol>\n\n    <symbol id=\"plus\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 5l0 14\" />\n      <path d=\"M5 12l14 0\" />\n    </symbol>\n\n    <symbol id=\"progress\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"/>\n      <path d=\"M10 20.777a8.942 8.942 0 0 1 -2.48 -.969\" />\n      <path d=\"M14 3.223a9.003 9.003 0 0 1 0 17.554\" />\n      <path d=\"M4.579 17.093a8.961 8.961 0 0 1 -1.227 -2.592\" />\n      <path d=\"M3.124 10.5c.16 -.95 .468 -1.85 .9 -2.675l.169 -.305\" />\n      <path d=\"M6.907 4.579a8.954 8.954 0 0 1 3.093 -1.356\" />\n    </symbol>\n\n    <symbol id=\"rectangle\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M3 5m0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z\" />\n    </symbol>\n\n    <symbol id=\"rocket\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M4 13a8 8 0 0 1 7 7a6 6 0 0 0 3 -5a9 9 0 0 0 6 -8a3 3 0 0 0 -3 -3a9 9 0 0 0 -8 6a6 6 0 0 0 -5 3\" />\n      <path d=\"M7 14a6 6 0 0 0 -3 6a6 6 0 0 0 6 -3\" />\n      <path d=\"M15 9m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\" />\n    </symbol>\n\n    <symbol id=\"save\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M6 4h10l4 4v10a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2\" />\n      <path d=\"M12 14m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0\" />\n      <path d=\"M14 4l0 4l-6 0l0 -4\" />\n    </symbol>\n\n    <symbol id=\"search\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <circle cx=\"10\" cy=\"10\" r=\"7\" />\n      <path d=\"M21 21l-6 -6\" />\n    </symbol>\n\n    <symbol id=\"select\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M3 3m0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M9 11l3 3l3 -3\" />\n    </symbol>\n\n    <symbol id=\"sign-in\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M9 8v-2a2 2 0 0 1 2 -2h7a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-7a2 2 0 0 1 -2 -2v-2\" />\n      <path d=\"M3 12h13l-3 -3\" />\n      <path d=\"M13 15l3 -3\" />\n    </symbol>\n\n    <symbol id=\"sign-out\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M10 8v-2a2 2 0 0 1 2 -2h7a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-7a2 2 0 0 1 -2 -2v-2\" />\n      <path d=\"M15 12h-12l3 -3\" />\n      <path d=\"M6 15l-3 -3\" />\n    </symbol>\n\n    <symbol id=\"sitemap\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M3 15m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v2a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M15 15m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v2a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M9 3m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v2a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z\" />\n      <path d=\"M6 15v-1a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v1\" />\n      <path d=\"M12 9l0 3\" />\n    </symbol>\n\n    <symbol id=\"sun\" viewBox=\"0 0 24 24\"\n      fill=\"currentColor\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M12 19a1 1 0 0 1 .993 .883l.007 .117v1a1 1 0 0 1 -1.993 .117l-.007 -.117v-1a1 1 0 0 1 1 -1z\" />\n      <path\n        d=\"M18.313 16.91l.094 .083l.7 .7a1 1 0 0 1 -1.32 1.497l-.094 -.083l-.7 -.7a1 1 0 0 1 1.218 -1.567l.102 .07z\" />\n      <path\n        d=\"M7.007 16.993a1 1 0 0 1 .083 1.32l-.083 .094l-.7 .7a1 1 0 0 1 -1.497 -1.32l.083 -.094l.7 -.7a1 1 0 0 1 1.414 0z\" />\n      <path d=\"M4 11a1 1 0 0 1 .117 1.993l-.117 .007h-1a1 1 0 0 1 -.117 -1.993l.117 -.007h1z\" />\n      <path d=\"M21 11a1 1 0 0 1 .117 1.993l-.117 .007h-1a1 1 0 0 1 -.117 -1.993l.117 -.007h1z\" />\n      <path\n        d=\"M6.213 4.81l.094 .083l.7 .7a1 1 0 0 1 -1.32 1.497l-.094 -.083l-.7 -.7a1 1 0 0 1 1.217 -1.567l.102 .07z\" />\n      <path\n        d=\"M19.107 4.893a1 1 0 0 1 .083 1.32l-.083 .094l-.7 .7a1 1 0 0 1 -1.497 -1.32l.083 -.094l.7 -.7a1 1 0 0 1 1.414 0z\" />\n      <path\n        d=\"M12 2a1 1 0 0 1 .993 .883l.007 .117v1a1 1 0 0 1 -1.993 .117l-.007 -.117v-1a1 1 0 0 1 1 -1z\" />\n      <path d=\"M12 7a5 5 0 1 1 -4.995 5.217l-.005 -.217l.005 -.217a5 5 0 0 1 4.995 -4.783z\" />\n    </symbol>\n\n    <symbol id=\"table\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M3 5a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-14z\" />\n      <path d=\"M3 10h18\" />\n      <path d=\"M10 3v18\" />\n    </symbol>\n\n    <symbol id=\"tags\" viewBox=\"0 0 24 24\"\n      fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\n      stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path\n        d=\"M3 8v4.172a2 2 0 0 0 .586 1.414l5.71 5.71a2.41 2.41 0 0 0 3.408 0l3.592 -3.592a2.41 2.41 0 0 0 0 -3.408l-5.71 -5.71a2 2 0 0 0 -1.414 -.586h-4.172a2 2 0 0 0 -2 2z\" />\n      <path d=\"M18 19l1.592 -1.592a4.82 4.82 0 0 0 0 -6.816l-4.592 -4.592\" />\n      <path d=\"M7 10h-.01\" />\n    </symbol>\n\n    <symbol id=\"tooltip\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"/>\n      <path d=\"M10 18a2 2 0 1 0 4 0a2 2 0 1 0 -4 0\" />\n      <path d=\"M12 13l-1.707 -1.707a1 1 0 0 0 -.707 -.293h-2.586a2 2 0 0 1 -2 -2v-3a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v3a2 2 0 0 1 -2 2h-2.586a1 1 0 0 0 -.707 .293l-1.707 1.707\" />\n    </symbol>\n\n    <symbol id=\"trash\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 7l16 0\" />\n      <path d=\"M10 11l0 6\" />\n      <path d=\"M14 11l0 6\" />\n      <path d=\"M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12\" />\n      <path d=\"M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3\" />\n    </symbol>\n\n    <symbol id=\"typography\" viewBox=\"0 0 24 24\" fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 20l3 0\" />\n      <path d=\"M14 20l7 0\" />\n      <path d=\"M6.9 15l6.9 0\" />\n      <path d=\"M10.2 6.3l5.8 13.7\" />\n      <path d=\"M5 20l6 -16l2 0l7 16\" />\n    </symbol>\n\n    <symbol\n      id=\"upload\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      stroke-width=\"2\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n    >\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-2\" />\n      <path d=\"M7 9l5 -5l5 5\" />\n      <path d=\"M12 4l0 12\" />\n    </symbol>\n\n    <symbol id=\"user\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0\" />\n      <path d=\"M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2\" />\n    </symbol>\n\n    <symbol id=\"user-add\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0\" />\n      <path d=\"M16 19h6\" />\n      <path d=\"M19 16v6\" />\n      <path d=\"M6 21v-2a4 4 0 0 1 4 -4h4\" />\n    </symbol>\n\n    <symbol id=\"user-circle\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\"\n      fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0\" />\n      <path d=\"M12 10m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0\" />\n      <path d=\"M6.168 18.849a4 4 0 0 1 3.832 -2.849h4a4 4 0 0 1 3.834 2.855\" />\n    </symbol>\n    <symbol id=\"users\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M9 7m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0\" />\n      <path d=\"M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2\" />\n      <path d=\"M16 3.13a4 4 0 0 1 0 7.75\" />\n      <path d=\"M21 21v-2a4 4 0 0 0 -3 -3.85\" />\n    </symbol>\n    <symbol id=\"wand\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2px\" fill=\"none\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M6 21l15 -15l-3 -3l-15 15l3 3\" />\n      <path d=\"M15 6l3 3\" />\n      <path\n        d=\"M9 3a2 2 0 0 0 2 2a2 2 0 0 0 -2 2a2 2 0 0 0 -2 -2a2 2 0 0 0 2 -2\"\n      />\n      <path\n        d=\"M19 13a2 2 0 0 0 2 2a2 2 0 0 0 -2 2a2 2 0 0 0 -2 -2a2 2 0 0 0 2 -2\"\n      />\n    </symbol>\n    <symbol id=\"code\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\n      stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M7 8l-4 4l4 4\" />\n      <path d=\"M17 8l4 4l-4 4\" />\n      <path d=\"M14 4l-4 16\" />\n    </symbol>\n    <symbol id=\"device-desktop\" viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M3 5a1 1 0 0 1 1 -1h16a1 1 0 0 1 1 1v10a1 1 0 0 1 -1 1h-16a1 1 0 0 1 -1 -1z\" />\n      <path d=\"M7 20h10\" />\n      <path d=\"M9 16v4\" />\n      <path d=\"M15 16v4\" />\n    </symbol>\n    <symbol id=\"brand-google\" viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n      <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n      <path d=\"M20.945 11a9 9 0 1 1 -3.284 -5.997l-2.655 2.392a5.5 5.5 0 1 0 2.119 6.605h-4.125v-3h7.945z\" />\n    </symbol>\n  </defs>\n</svg>";

package/dist/icons/icon-sprite.generated.js

@@ -698,5 +698,20 @@ const o="esp-icons",l=`<svg id="esp-icons" data-esp-icon-sprite="" aria-hidden="
       <path d="M17 8l4 4l-4 4" />
       <path d="M14 4l-4 16" />
     </symbol>
+    <symbol id="device-desktop" viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+      <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+      <path d="M3 5a1 1 0 0 1 1 -1h16a1 1 0 0 1 1 1v10a1 1 0 0 1 -1 1h-16a1 1 0 0 1 -1 -1z" />
+      <path d="M7 20h10" />
+      <path d="M9 16v4" />
+      <path d="M15 16v4" />
+    </symbol>
+    <symbol id="brand-google" viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+      <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+      <path d="M20.945 11a9 9 0 1 1 -3.284 -5.997l-2.655 2.392a5.5 5.5 0 1 0 2.119 6.605h-4.125v-3h7.945z" />
+    </symbol>
   </defs>
 </svg>`;export{l as ICON_SPRITE,o as ICON_SPRITE_ID};

package/dist/image-picker/esp-image-picker.d.ts

@@ -0,0 +1,97 @@
+import { type PropertyValues } from "lit";
+import "../pickers/esp-pick-one.js";
+import type { EspalierFormField } from "../form-item/esp-form-item.js";
+import { EspalierElementBase } from "../shared/esp-element-base.js";
+/** A thumbnail candidate shown by {@link EspalierImagePicker}. */
+export type ImagePickerImage = {
+    /** Stable identity reported in `value` and `esp-value-changed`. */
+    id: string;
+    /** URL of the thumbnail to render. */
+    src: string;
+    /** Optional option name. Falls back to alt text, then Image 1, Image 2, etc. */
+    label?: string;
+    /** Alternative text for the selected-image preview. */
+    alt?: string;
+};
+/**
+ * A form-associated image picker with large image choices and a selected preview.
+ *
+ * The component is controlled: set `images` and `value` from consumer state,
+ * then use `esp-value-changed` to persist a user's next selection. An empty
+ * `value` means the Automatic choice. Labels are optional; unlabeled images use
+ * their alternative text or a numbered name. Images are shown without cropping.
+ *
+ * The large preview sits above the control by default. Set
+ * `preview-placement="beside"` for a compact preview beside the control.
+ * Size the preview and option images with the CSS properties below.
+ *
+ * ```html
+ * <esp-form-item label="Page cover">
+ *   <esp-image-picker name="cover" value="field"></esp-image-picker>
+ * </esp-form-item>
+ * <script>
+ *   const picker = document.querySelector("esp-image-picker");
+ *   picker.images = [
+ *     { id: "field", src: "/assets/focus-picker-unsplash.jpg" },
+ *     { id: "paper", src: "/assets/espalier-paper-texture.png" },
+ *   ];
+ *   picker.addEventListener("esp-value-changed", (event) => {
+ *     picker.value = event.detail;
+ *   });
+ * </script>
+ * ```
+ *
+ * @event {CustomEvent<string>} esp-value-changed - Fired when a user chooses an image or Automatic. The detail is the selected image ID, or an empty string for Automatic.
+ * @event {CustomEvent<{ valid: boolean; message: string }>} esp-validity-changed - Fired whenever form validation runs.
+ *
+ * @cssprop --esp-image-picker-preview-height - Height of the large preview above the control. Default 16rem.
+ * @cssprop --esp-image-picker-option-width - Width of dropdown images, capped at 40vw on narrow screens. Default 12rem.
+ * @cssprop --esp-image-picker-option-height - Height of dropdown images. Images retain their aspect ratio. Default 8rem.
+ *
+ * @docPageTitle Image Picker
+ * @docUrl /components/image-picker
+ * @menuGroup Form Controls
+ * @menuLabel Image Picker
+ *
+ * @customElement esp-image-picker
+ */
+export declare class EspalierImagePicker extends EspalierElementBase implements EspalierFormField {
+    static formAssociated: boolean;
+    /** Image candidates, kept in the supplied order. */
+    images: ImagePickerImage[];
+    /** Selected image ID. An empty string selects Automatic. */
+    value: string;
+    /** Preview placement: above (default, large) or beside (compact). */
+    previewPlacement: "above" | "beside";
+    /** Disables the picker trigger. */
+    disabled: boolean;
+    /** Shows a loading state while candidates are being fetched. */
+    loading: boolean;
+    /** Message shown when no image candidates are available. */
+    emptyMessage: string;
+    /** Label for the empty-value choice. */
+    automaticLabel: string;
+    /** The name used when this picker participates in a `<form>`. */
+    name: string;
+    /** Focus the composed picker trigger. */
+    focus(options?: FocusOptions): void;
+    /** Re-run form validation. */
+    validate(): void;
+    /** Check form validity. */
+    checkValidity(): boolean;
+    /** Called by the browser when the owning form resets. */
+    formResetCallback(): void;
+    /** Called by the browser when form state is restored. */
+    formStateRestoreCallback(state: string): void;
+    /** Called by the browser when an ancestor fieldset changes disabled state. */
+    formDisabledCallback(isDisabled: boolean): void;
+    protected willUpdate(changedProperties: PropertyValues): void;
+    protected updated(changedProperties: PropertyValues): void;
+    protected render(): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "esp-image-picker": EspalierImagePicker;
+    }
+}