tecitheme 0.7.6 → 0.8.1

package/dist/components/Header.svelte.d.ts

@@ -1,30 +0,0 @@
-/** @typedef {typeof __propDef.props}  HeaderProps */
-/** @typedef {typeof __propDef.events}  HeaderEvents */
-/** @typedef {typeof __propDef.slots}  HeaderSlots */
-export default class Header extends SvelteComponent<{
-    clickOutside?: (node: any) => {
-        destroy(): void;
-    };
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> {
-    get clickOutside(): (node: any) => {
-        destroy(): void;
-    };
-}
-export type HeaderProps = typeof __propDef.props;
-export type HeaderEvents = typeof __propDef.events;
-export type HeaderSlots = typeof __propDef.slots;
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        clickOutside?: (node: any) => {
-            destroy(): void;
-        };
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export {};

package/dist/components/HeadingCentered.svelte

@@ -1,38 +0,0 @@
-<script>
-  //Based on: https://tailwindui.com/components/marketing/sections/header#component-2c3b25e7b9e4490edd7b6950692c0a11
-  import Icon from "./Icon.svelte";
-  export let data = {};
-  let id
-
-  if (data.name) {
-    id = encodeURIComponent(data.name).toLowerCase()
-  }
-</script>
-
-<!-- This example requires Tailwind CSS v2.0+ -->
-<section {id} class="w-full text-center">
-  {#if data.toptext}
-    <p class="text-base font-semibold uppercase text-teci-blue-dark">
-      {data.toptext}
-    </p>
-  {/if}
-  {#if data.title || data.logo}
-    {#if data.logo}
-      <div class="grid place-items-center">
-        <h1 class="sr-only">{data.title}</h1>
-        <Icon classes={data.classes} icon={data.logo} />
-      </div>
-    {:else}
-      <h1
-        class="mt-1 text-4xl font-bold text-gray-900 sm:text-5xl sm:tracking-tight lg:text-6xl"
-      >
-        {data.title}
-      </h1>
-    {/if}
-  {/if}
-  {#if data.subtitle}
-    <p class="mx-auto mt-5 max-w-4xl text-xl text-gray-500">
-      {data.subtitle}
-    </p>
-  {/if}
-</section>

package/dist/components/HeadingCentered.svelte.d.ts

@@ -1,23 +0,0 @@
-/** @typedef {typeof __propDef.props}  HeadingCenteredProps */
-/** @typedef {typeof __propDef.events}  HeadingCenteredEvents */
-/** @typedef {typeof __propDef.slots}  HeadingCenteredSlots */
-export default class HeadingCentered extends SvelteComponent<{
-    data?: {};
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> {
-}
-export type HeadingCenteredProps = typeof __propDef.props;
-export type HeadingCenteredEvents = typeof __propDef.events;
-export type HeadingCenteredSlots = typeof __propDef.slots;
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        data?: {};
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export {};

package/dist/components/Hero.svelte

@@ -1,82 +0,0 @@
-<script>
-import Icon from './Icon.svelte'
-
-  import { getColorStyles } from '../utils'
-  export let data = {};
-  let id
-
-  if (data.name) {
-    id = encodeURIComponent(data.name).toLowerCase()
-  }
-</script>
-
-<section {id} class="relative">
-  <div class="mx-auto max-w-7xl md:grid md:grid-cols-12 md:gap-x-8 md:px-0">
-    <div class="pt-0 pb-0 md:col-span-8 lg:col-span-7 xl:col-span-6">
-      <div class="mx-auto">
-        {#if data.logo}
-          <span class="sr-only">{data.title}</span>
-          <Icon icon={data.logo} classes="h-12 sm:h-20" />
-        {:else}
-          <h1 class="z-10 text-4xl font-bold tracking-tight sm:text-center sm:text-6xl">
-            {data.heading}
-          </h1>
-        {/if}
-        {#if data.banner_text}
-        <div class="mt-6 sm:mt-8 lg:mt-4 inline-flex space-x-6">
-          <a href={data.banner_url}>
-            <span class="rounded-full bg-gray-300/10 border px-3 py-1 text-sm font-semibold leading-6 {getColorStyles('text', data.color)}">
-              {data.banner_text}
-            </span>
-          </a>
-          <a href={data.banner_link_url}>
-            <span class="inline-flex items-center space-x-1 text-sm font-medium leading-6 text-gray-500">
-              <span>{data.banner_link_text}</span>
-              <!-- Heroicon name: mini/chevron-right -->
-              <svg class="h-5 w-5 {getColorStyles('text', data.color)}" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
-                <path fill-rule="evenodd" d="M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z" clip-rule="evenodd" />
-              </svg>
-            </span>
-          </a>
-        </div>
-        {/if}
-        <h2 class="mt-10 text-4xl font-bold tracking-tight text-gray-900 sm:text-6xl">{data.tagline}</h2>
-        <p class="mt-6 text-lg leading-8">{data.text}</p>
-        {#if data.ctas}
-          <div class="mt-10 flex gap-x-8 sm:justify-left">
-            {#each data.ctas as cta}
-              <a href={cta.url} class="inline-block btn {getColorStyles('button', cta.color)}">
-                {cta.text}
-                <span class="hidden sm:inline" aria-hidden="true">&rarr;</span>
-              </a>
-            {/each}
-          </div>
-        {/if}
-        <div class="mt-16">
-          <section class="{getColorStyles('background', data.color)}">
-            <div class="text-center mx-auto max-w-4xl py-10 px-6 sm:py-10 lg:px-8">
-              <h2 class="text-3xl font-bold tracking-tight text-white sm:text-2xl">
-                <span class="block">{@html data.heading}</span>
-              </h2>
-              <p class="mt-4 text-lg leading-6 text-gray-200">{@html data.body}</p>
-              <a href={data.cta_url} class="mt-8 inline-block btn {getColorStyles('button', data.cta_color)}">
-                {@html data.cta}
-              </a>
-            </div>
-          </section>
-        </div>
-      </div>
-    </div>
-    <div class="relative hidden md:block md:col-span-4 lg:col-span-5 xl:col-span-6">
-      {#if data.video}
-      <video src="https://teci.imgix.net/www/videos/{data.video}" autoplay="true" loop muted 
-        class="absolute object-cover h-full w-full">
-      </video>
-      {:else if data.image}
-        <img src="https://teci.imgix.net/www/images/{data.image}?fmt=auto" alt={data.heading}
-        class="absolute object-cover h-full w-full"
-        >
-      {/if}
-    </div>
-  </div>
-</section>

package/dist/components/Hero.svelte.d.ts

@@ -1,23 +0,0 @@
-/** @typedef {typeof __propDef.props}  HeroProps */
-/** @typedef {typeof __propDef.events}  HeroEvents */
-/** @typedef {typeof __propDef.slots}  HeroSlots */
-export default class Hero extends SvelteComponent<{
-    data?: {};
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> {
-}
-export type HeroProps = typeof __propDef.props;
-export type HeroEvents = typeof __propDef.events;
-export type HeroSlots = typeof __propDef.slots;
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        data?: {};
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export {};

package/dist/components/Icon.svelte

@@ -1,162 +0,0 @@
-<script>
-  // Allows icons from https://fonts.google.com/icons?selected=Material+Icons by name in the format 'icon-XXXX'.
-  export let icon = undefined;
-  export let classes = undefined;
-
-  let id;
-
-  if (icon) {
-    id = encodeURIComponent(icon).toLowerCase()
-  }
-</script>
-
-{#if icon == "pyrosim"}
-  <span {id} class="not-prose">
-    <img
-      class={classes}
-      src="https://teci.imgix.net/www/images/pyrosim_icon.svg"
-      alt="PyroSim"
-      title="PyroSim Icon"
-    />
-  </span>
-{:else if icon == "pyrosim-results"}
-  <span {id} class="not-prose">
-    <img
-      class={classes}
-      src="https://teci.imgix.net/www/images/pyrosim-results_icon.svg"
-      alt="PyroSim Results"
-      title="PyroSim Results Icon"
-    />
-  </span>
-{:else if icon == "pyrosim-logo"}
-  <span {id} class="not-prose">
-    <img
-      class={classes}
-      src="https://teci.imgix.net/www/images/pyrosim_logo.svg"
-      alt="PyroSim Logo"
-      title="PyroSim Logo"
-    />
-  </span>
-{:else if icon == "pathfinder"}
-  <span {id} class="not-prose">
-    <img
-      class={classes}
-      src="https://teci.imgix.net/www/images/pathfinder_icon.svg"
-      alt="Pathfinder"
-      title="Pathfinder Icon"
-    />
-  </span>
-{:else if icon == "pathfinder-results"}
-  <span {id} class="not-prose">
-    <img
-      class={classes}
-      src="https://teci.imgix.net/www/images/pathfinder-results_icon.svg"
-      alt="Pathfinder Results"
-      title="Pathfinder Results Icon"
-    />
-  </span>
-{:else if icon == "pathfinder-logo"}
-  <span {id} class="not-prose">
-    <img
-      class={classes}
-      src="https://teci.imgix.net/www/images/pathfinder_logo.svg"
-      alt="Pathfinder Logo"
-      title="Pathfinder Logo"
-    />
-  </span>
-  {:else if icon == "ventus"}
-  <span {id} class="not-prose">
-    <img
-      class={classes}
-      src="https://teci.imgix.net/www/images/ventus_icon.svg"
-      alt="Ventus"
-      title="Ventus Icon"
-    />
-  </span>
-{:else if icon == "ventus-logo"}
-  <span {id} class="not-prose">
-    <img
-      class={classes}
-      src="https://teci.imgix.net/www/images/ventus_logo.svg"
-      alt="Ventus Logo"
-      title="Ventus Logo"
-    />
-  </span>
-{:else if icon == "petrasim"}
-  <span {id} class="not-prose">
-    <img
-      class={classes}
-      src="https://teci.imgix.net/www/images/petrasim_icon.svg"
-      alt="PetraSim"
-      title="PetraSim Icon"
-    />
-  </span>
-{:else if icon == "petrasim-logo"}
-  <span {id} class="not-prose">
-    <img
-      class={classes}
-      src="https://teci.imgix.net/www/images/petrasim_logo.svg"
-      alt="PetraSim Logo"
-      title="PetraSim Logo"
-    />
-  </span>
-{:else if icon == "teci-logo"}
-  <span {id} class="not-prose">
-    <img
-      class={classes}
-      src="https://teci.imgix.net/www/images/teci_logo.svg"
-      alt="Thunderhead Logo"
-      title="Thunderhead Logo"
-    />
-  </span>
-{:else if icon == "teci-icon"}
-  <span {id} class="not-prose">
-    <svg
-      class={classes}
-      xmlns="http://www.w3.org/2000/svg"
-      viewBox="0 0 250 250"
-    >
-      <path
-        style="fill:#0c3879;fill-rule:evenodd;stroke:none"
-        d="M88.113 220.536h97.672v97.672H88.113z"
-        transform="matrix(2.5596 0 0 2.5596 -225.533 -564.483)"
-      />
-      <path
-        style="fill:#fff;fill-rule:evenodd;stroke:none"
-        d="M145.864 260.176h22.042c2.792 0 4.883.835 6.559 2.651 1.532 1.673 2.232 3.764 2.232 6.278 0 2.37-.7 4.464-2.232 6.277-1.676 1.675-3.767 2.651-6.559 2.651h-22.042v-17.857m0 23.159h22.042c2.792 0 4.883.838 6.559 2.65 1.532 1.674 2.232 3.768 2.232 6.278 0 2.373-.7 4.464-2.232 6.278-1.676 1.675-3.767 2.65-6.559 2.65h-22.042v-17.856"
-        transform="matrix(2.5596 0 0 2.5596 -225.533 -564.483)"
-      />
-      <path
-        style="fill:#fff;fill-rule:evenodd;stroke:none"
-        d="M132.471 301.192c-5.861 0-8.79-3.07-8.79-8.929l-.138-37.389-20.648-.14c-7.116-1.254-10.185-9.626-5.165-15.206 1.535-1.535 3.63-2.373 6.14-2.651h26.926l1.675.14h35.435c2.792 0 4.883.836 6.559 2.649 1.532 1.675 2.232 3.767 2.232 6.28 0 2.37-.7 4.464-2.232 6.277-1.676 1.673-3.767 2.651-6.559 2.651H141.26V301.192h-8.788"
-        transform="matrix(2.5596 0 0 2.5596 -225.533 -564.483)"
-      />
-    </svg>
-  </span>
-{:else if icon?.startsWith("icon-")}
-  <span {id} class="material-icons-outlined {classes}">{icon?.slice(5)}</span>
-{:else}
-  <span {id} class="not-prose">
-    <svg
-      class={classes}
-      xmlns="http://www.w3.org/2000/svg"
-      viewBox="0 0 250 250"
-    >
-      <path
-        style="fill:#0c3879;fill-rule:evenodd;stroke:none"
-        d="M88.113 220.536h97.672v97.672H88.113z"
-        transform="matrix(2.5596 0 0 2.5596 -225.533 -564.483)"
-      />
-      <path
-        style="fill:#fff;fill-rule:evenodd;stroke:none"
-        d="M145.864 260.176h22.042c2.792 0 4.883.835 6.559 2.651 1.532 1.673 2.232 3.764 2.232 6.278 0 2.37-.7 4.464-2.232 6.277-1.676 1.675-3.767 2.651-6.559 2.651h-22.042v-17.857m0 23.159h22.042c2.792 0 4.883.838 6.559 2.65 1.532 1.674 2.232 3.768 2.232 6.278 0 2.373-.7 4.464-2.232 6.278-1.676 1.675-3.767 2.65-6.559 2.65h-22.042v-17.856"
-        transform="matrix(2.5596 0 0 2.5596 -225.533 -564.483)"
-      />
-      <path
-        style="fill:#fff;fill-rule:evenodd;stroke:none"
-        d="M132.471 301.192c-5.861 0-8.79-3.07-8.79-8.929l-.138-37.389-20.648-.14c-7.116-1.254-10.185-9.626-5.165-15.206 1.535-1.535 3.63-2.373 6.14-2.651h26.926l1.675.14h35.435c2.792 0 4.883.836 6.559 2.649 1.532 1.675 2.232 3.767 2.232 6.28 0 2.37-.7 4.464-2.232 6.277-1.676 1.673-3.767 2.651-6.559 2.651H141.26V301.192h-8.788"
-        transform="matrix(2.5596 0 0 2.5596 -225.533 -564.483)"
-      />
-    </svg>
-  </span>
-{/if}

package/dist/components/Icon.svelte.d.ts

@@ -1,25 +0,0 @@
-/** @typedef {typeof __propDef.props}  IconProps */
-/** @typedef {typeof __propDef.events}  IconEvents */
-/** @typedef {typeof __propDef.slots}  IconSlots */
-export default class Icon extends SvelteComponent<{
-    icon?: any;
-    classes?: any;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> {
-}
-export type IconProps = typeof __propDef.props;
-export type IconEvents = typeof __propDef.events;
-export type IconSlots = typeof __propDef.slots;
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        icon?: any;
-        classes?: any;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export {};

package/dist/components/LogoCloud.svelte

@@ -1,25 +0,0 @@
-<div class="bg-white">
-  <div class="mx-auto max-w-7xl py-12 px-6 lg:py-16 lg:px-8">
-    <p class="text-center text-lg font-semibold">Trusted by fire protection experts all over the world</p>
-    <div class="mt-6 grid grid-cols-2 gap-0.5 md:grid-cols-3 lg:mt-8">
-      <div class="col-span-1 flex justify-center bg-gray-50 py-8 px-8">
-        <img class="max-h-12" src="https://tailwindui.com/img/logos/transistor-logo-gray-400.svg" alt="Workcation">
-      </div>
-      <div class="col-span-1 flex justify-center bg-gray-50 py-8 px-8">
-        <img class="max-h-12" src="https://tailwindui.com/img/logos/mirage-logo-gray-400.svg" alt="Mirage">
-      </div>
-      <div class="col-span-1 flex justify-center bg-gray-50 py-8 px-8">
-        <img class="max-h-12" src="https://tailwindui.com/img/logos/tuple-logo-gray-400.svg" alt="Tuple">
-      </div>
-      <div class="col-span-1 flex justify-center bg-gray-50 py-8 px-8">
-        <img class="max-h-12" src="https://tailwindui.com/img/logos/laravel-logo-gray-400.svg" alt="Laravel">
-      </div>
-      <div class="col-span-1 flex justify-center bg-gray-50 py-8 px-8">
-        <img class="max-h-12" src="https://tailwindui.com/img/logos/statickit-logo-gray-400.svg" alt="StaticKit">
-      </div>
-      <div class="col-span-1 flex justify-center bg-gray-50 py-8 px-8">
-        <img class="max-h-12" src="https://tailwindui.com/img/logos/statamic-logo-gray-400.svg" alt="Statamic">
-      </div>
-    </div>
-  </div>
-</div>

package/dist/components/LogoCloud.svelte.d.ts

@@ -1,23 +0,0 @@
-/** @typedef {typeof __propDef.props}  LogoCloudProps */
-/** @typedef {typeof __propDef.events}  LogoCloudEvents */
-/** @typedef {typeof __propDef.slots}  LogoCloudSlots */
-export default class LogoCloud extends SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> {
-}
-export type LogoCloudProps = typeof __propDef.props;
-export type LogoCloudEvents = typeof __propDef.events;
-export type LogoCloudSlots = typeof __propDef.slots;
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        [x: string]: never;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export {};

package/dist/components/Math.svelte

@@ -1,24 +0,0 @@
-<script>
-  // Based on: https://svelte.dev/repl/49ff6c089825418888cf804d9dde77bc?version=3.46.4
-  import katex from "katex";
-  export let math = undefined;
-  export let displayMode = false;
-
-  const options = {
-    displayMode: displayMode,
-    throwOnError: false,
-  };
-
-  $: katexString = katex.renderToString(math, options);
-</script>
-
-<svelte:head>
-  <link
-    rel="stylesheet"
-    href="https://cdn.jsdelivr.net/npm/katex@0.12.0/dist/katex.min.css"
-    integrity="sha384-AfEj0r4/OFrOo5t7NnNe46zW/tFgW6x/bCJG8FqQCEo3+Aro6EYUG4+cU+KJWu/X"
-    crossorigin="anonymous"
-  />
-</svelte:head>
-
-{@html katexString}

package/dist/components/Math.svelte.d.ts

@@ -1,25 +0,0 @@
-/** @typedef {typeof __propDef.props}  MathProps */
-/** @typedef {typeof __propDef.events}  MathEvents */
-/** @typedef {typeof __propDef.slots}  MathSlots */
-export default class Math extends SvelteComponent<{
-    math?: any;
-    displayMode?: boolean;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> {
-}
-export type MathProps = typeof __propDef.props;
-export type MathEvents = typeof __propDef.events;
-export type MathSlots = typeof __propDef.slots;
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        math?: any;
-        displayMode?: boolean;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export {};

package/dist/components/MediaFeature.svelte

@@ -1,76 +0,0 @@
-<script>
-import Video from './Video.svelte'
-
-  import { getColorStyles } from '../utils'
-  export let data = {};
-
-  let figureImage;
-  let figureLink;
-  let id
-
-  if (data.name) {
-    id = encodeURIComponent(data.name).toLowerCase()
-  }
-
-  if (data.image) {
-    if (data.image.startsWith("http")) {
-      figureImage = data.image;
-      figureLink = data.link ? data.link : data.image;
-    } else if (data.image.includes("gif")) {
-      figureImage = "https://teci.imgix.net/www/images/" + data.image;
-      figureLink = data.link
-        ? data.link
-        : "https://teci.imgix.net/www/images/" + data.image;
-    } else {
-      figureImage =
-        "https://teci.imgix.net/www/images/" +
-        data.image +
-        "?w=576&ar=16:9&fit=crop&auto=compress&auto=format";
-      figureLink = data.link
-        ? data.link
-        : "https://teci.imgix.net/www/images/" + data.image;
-    }
-  }
-</script>
-
-<section {id}
-  class="mx-auto flex w-full flex-col items-center justify-center md:flex-row md:items-start"
->
-  {#if data.v}
-    <div class="mb-4 block w-full max-w-xl md:mb-0">
-      <Video bind:data />
-    </div>
-  {:else if data.image}
-    <div class="mb-4 block w-full max-w-xl md:mb-0">
-      <figure>
-        <a href={figureLink}>
-          <img
-            class="aspect-video w-full border border-gray-200 bg-black object-cover shadow-md {data.imageClass
-              ? data.imageClass
-              : ''}"
-            src={figureImage}
-            alt={data.name}
-          />
-        </a>
-      </figure>
-    </div>
-  {/if}
-  <div
-    class="flex w-full max-w-xl flex-col justify-center {data.position ===
-    'right'
-      ? 'md:order-last md:ml-8'
-      : 'md:order-first md:mr-8'}"
-  >
-    <div class="w-full max-w-3xl">
-      <h2 class="pb-4 text-lg font-bold">{data.name}</h2>
-      <span class="prose">{@html data.text}</span>
-    </div>
-    {#if data.ctaText}
-      <div class="mt-4 text-right md:text-left">
-        <a class="btn {getColorStyles('button', data.ctaColor)}" href={data.ctaURL}>
-          {data.ctaText}
-        </a>
-      </div>
-    {/if}
-  </div>
-</section>

package/dist/components/MediaFeature.svelte.d.ts

@@ -1,23 +0,0 @@
-/** @typedef {typeof __propDef.props}  MediaFeatureProps */
-/** @typedef {typeof __propDef.events}  MediaFeatureEvents */
-/** @typedef {typeof __propDef.slots}  MediaFeatureSlots */
-export default class MediaFeature extends SvelteComponent<{
-    data?: {};
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> {
-}
-export type MediaFeatureProps = typeof __propDef.props;
-export type MediaFeatureEvents = typeof __propDef.events;
-export type MediaFeatureSlots = typeof __propDef.slots;
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        data?: {};
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export {};

package/dist/components/Modal.svelte

@@ -1,69 +0,0 @@
-<script>
-  import Button from "./Button.svelte";
-  export let data = {};
-  let shown = false;
-
-  export function show() {
-    shown = true;
-  }
-  export function hide() {
-    shown = false;
-  }
-</script>
-
-<svelte:window
-  on:keydown={(e) => {
-    if (e.keyCode == 27) {
-      hide();
-    }
-  }}
-/>
-
-{#if (data.title || data.text || data.buttonText)}
-  <div class="prose max-w-none">
-    {#if data.title}
-      <h2>{data.title}</h2>
-    {/if}
-    {#if data.text}
-      <p>{data.text}</p>
-    {/if}
-    {#if data.buttonText}
-      <Button on:click={show} action=true text={data.buttonText} color={data.buttonColor} justify='left' />
-    {/if}
-  </div>
-{/if}
-
-{#if shown}
-  <div
-    class="fixed inset-0 z-50 !mt-0 h-full w-full overflow-y-auto bg-gray-900 bg-opacity-50"
-  >
-    <div class="relative top-20 mx-auto w-96 border bg-white p-5 shadow-lg">
-      <button
-        type="button"
-        on:click={hide}
-        class="absolute top-0 right-0 mr-2 mt-2 inline-flex items-center justify-center bg-white p-1 text-teci-blue-light hover:bg-teci-blue-dark hover:text-white focus:outline-none focus:ring-2 focus:ring-inset focus:ring-teci-blue-dark"
-      >
-        <span class="sr-only">Close menu</span>
-        <!-- Heroicon name: outline/x -->
-        <svg
-          class="h-6 w-6"
-          xmlns="http://www.w3.org/2000/svg"
-          fill="none"
-          viewBox="0 0 24 24"
-          stroke="currentColor"
-          aria-hidden="true"
-        >
-          <path
-            stroke-linecap="round"
-            stroke-linejoin="round"
-            stroke-width="2"
-            d="M6 18L18 6M6 6l12 12"
-          />
-        </svg>
-      </button>
-      <div class="mt-3 text-center">
-        {@html data.modalContent}
-      </div>
-    </div>
-  </div>
-{/if}