tecitheme 0.2.8 → 0.3.1

package/components/CTABranded.svelte

@@ -0,0 +1,15 @@
+<script>
+  export let data
+</script>
+
+<section class="{(data.color == "pyrosim" ? "bg-pyrosim" : (data.color == "pathfinder" ? "bg-pathfinder" : "bg-teci-blue-dark"))}">
+  <div class="mx-auto max-w-4xl py-10 px-6 text-center sm:py-10 lg:px-8">
+    <h2 class="text-3xl font-bold tracking-tight text-white sm:text-4xl">
+      <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-flex w-full items-center justify-center border border-transparent bg-white px-5 py-3 text-base font-medium text-gray-900 hover:bg-indigo-50 sm:w-auto">
+      {data.cta}
+    </a>
+  </div>
+</section>

package/components/CTABranded.svelte.d.ts

@@ -0,0 +1,23 @@
+/** @typedef {typeof __propDef.props}  CtaBrandedProps */
+/** @typedef {typeof __propDef.events}  CtaBrandedEvents */
+/** @typedef {typeof __propDef.slots}  CtaBrandedSlots */
+export default class CtaBranded extends SvelteComponentTyped<{
+    data: any;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}> {
+}
+export type CtaBrandedProps = typeof __propDef.props;
+export type CtaBrandedEvents = typeof __propDef.events;
+export type CtaBrandedSlots = typeof __propDef.slots;
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        data: any;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export {};

package/components/CTASplitImage.svelte

@@ -0,0 +1,27 @@
+<script>
+  export let data
+</script>
+
+<div class="relative {(data.color == "pyrosim" ? "bg-pyrosim" : (data.color == "pathfinder" ? "bg-pathfinder" : "bg-teci-blue-dark"))}">
+  <div class="h-56 sm:h-72 md:absolute md:left-0 md:h-full md:w-1/2">
+    <img class="h-full w-full object-cover" src="https://teci-files.imgix.net/www/images/{data.image}?w=608&fit=clip&auto=compress&auto=format" alt="Image for {data.preheading}">
+  </div>
+  <div class="relative mx-auto max-w-7xl py-12 px-6 lg:px-8 lg:py-16">
+    <div class="md:ml-auto md:w-1/2 md:pl-10">
+      <h2 class="text-lg font-semibold text-gray-300">{data.preheading}</h2>
+      <p class="mt-2 text-3xl font-bold tracking-tight text-white sm:text-4xl">{data.heading}</p>
+      <ol class="mt-3 text-lg text-gray-300 list-decimal pl-6">
+        {#each data.items as item}
+          <li>{item.text}</li>
+        {/each}
+      </ol>
+      <div class="mt-8">
+        <div class="inline-flex shadow">
+          <a href={data.cta_url} class="inline-flex items-center justify-center border border-transparent bg-white px-5 py-3 text-base font-medium text-gray-900 hover:bg-gray-50">
+            {data.cta}
+          </a>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>

package/components/CTASplitImage.svelte.d.ts

@@ -0,0 +1,23 @@
+/** @typedef {typeof __propDef.props}  CtaSplitImageProps */
+/** @typedef {typeof __propDef.events}  CtaSplitImageEvents */
+/** @typedef {typeof __propDef.slots}  CtaSplitImageSlots */
+export default class CtaSplitImage extends SvelteComponentTyped<{
+    data: any;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}> {
+}
+export type CtaSplitImageProps = typeof __propDef.props;
+export type CtaSplitImageEvents = typeof __propDef.events;
+export type CtaSplitImageSlots = typeof __propDef.slots;
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        data: any;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export {};

package/components/Card.svelte

@@ -1,5 +1,4 @@
 <script>
-  import { dev } from "$app/environment";
   //Allows icons from https://fonts.google.com/icons?selected=Material+Icons by name in the format 'icon-XXXX'.
   import Icon from "./Icon.svelte";
   import Wrap from "./Wrap.svelte";
@@ -8,14 +7,12 @@
 
   let backgroundImage;
 
-  if (dev && data.image) {
-    backgroundImage = data.image;
-  } else if (data.image) {
+  if (data.image) {
     if (data.image.includes("gif")) {
-      backgroundImage = "https://thunderheadeng-www.imgix.net" + data.image;
+      backgroundImage = "https://teci-files.imgix.net/www/images/" + data.image;
     } else {
       backgroundImage =
-        "https://thunderheadeng-www.imgix.net" +
+        "https://teci-files.imgix.net/www/images/" +
         data.image +
         "?w=1200&h=627&fit=crop&auto=compress&auto=format";
     }

package/components/ContentTwoColumns.svelte

@@ -0,0 +1,47 @@
+<script>
+  export let data
+</script>
+
+<div class="overflow-hidden mx-auto max-w-max lg:max-w-7xl">
+  <div class="relative z-10 mb-8 md:mb-2">
+    <div class="max-w-prose text-base lg:max-w-none">
+      <h2 class="font-semibold leading-6 {(data.color == "pyrosim" ? "text-pyrosim" : (data.color == "pathfinder" ? "text-pathfinder" : "text-teci-blue-dark"))}">{data.preheading}</h2>
+      <p class="mt-2 text-3xl font-bold leading-8 tracking-tight text-gray-900 sm:text-4xl">{data.heading}</p>
+    </div>
+  </div>
+  <div class="relative">
+    <svg class="absolute top-0 right-0 -mt-20 -mr-20 hidden md:block md:[overflow-anchor:none]" width="404" height="384" fill="none" viewBox="0 0 404 384" aria-hidden="true">
+      <defs>
+        <pattern id="95e8f2de-6d30-4b7e-8159-f791729db21b" x="0" y="0" width="20" height="20" patternUnits="userSpaceOnUse">
+          <rect x="0" y="0" width="4" height="4" class="text-gray-200" fill="currentColor" />
+        </pattern>
+      </defs>
+      <rect width="404" height="384" fill="url(#95e8f2de-6d30-4b7e-8159-f791729db21b)" />
+    </svg>
+    <svg class="absolute bottom-0 left-0 -mb-20 -ml-20 hidden md:block md:[overflow-anchor:none]" width="404" height="384" fill="none" viewBox="0 0 404 384" aria-hidden="true">
+      <defs>
+        <pattern id="7a00fe67-0343-4a3c-8e81-c145097a3ce0" x="0" y="0" width="20" height="20" patternUnits="userSpaceOnUse">
+          <rect x="0" y="0" width="4" height="4" class="text-gray-200" fill="currentColor" />
+        </pattern>
+      </defs>
+      <rect width="404" height="384" fill="url(#7a00fe67-0343-4a3c-8e81-c145097a3ce0)" />
+    </svg>
+    <div class="relative md:m-4 p-2 bg-white">
+      <div class="prose prose-lg columns-1 text-gray-600 lg:columns-2 lg:max-w-none">
+        {@html data.body}
+      </div>
+      {#if data.ctas}
+      <div class="mt-8 flex gap-x-4 float-right py-1">
+        {#each data.ctas as cta}
+          <a href={cta.url} class="inline-block px-4 py-1.5 text-base font-semibold leading-7 shadow-sm ring-1 ring-gray-900/10 hover:ring-gray-900/20 hover:bg-teci-blue-dark
+          {(cta.color == "pyrosim" ? "bg-pyrosim text-white" : (cta.color == "pathfinder" ? "bg-pathfinder text-white" : (cta.color == "white" ? "bg-white text-gray-600 hover:text-white" : "bg-teci-blue-dark text-white")))}
+          ">
+            {cta.text}
+            <span class="hidden sm:inline {(cta.color == "white" ? "text-gray-600" : "text-white")}" aria-hidden="true">&rarr;</span>
+          </a>
+        {/each}
+      </div>
+      {/if}
+    </div>
+  </div>
+</div>

package/components/ContentTwoColumns.svelte.d.ts

@@ -0,0 +1,23 @@
+/** @typedef {typeof __propDef.props}  ContentTwoColumnsProps */
+/** @typedef {typeof __propDef.events}  ContentTwoColumnsEvents */
+/** @typedef {typeof __propDef.slots}  ContentTwoColumnsSlots */
+export default class ContentTwoColumns extends SvelteComponentTyped<{
+    data: any;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}> {
+}
+export type ContentTwoColumnsProps = typeof __propDef.props;
+export type ContentTwoColumnsEvents = typeof __propDef.events;
+export type ContentTwoColumnsSlots = typeof __propDef.slots;
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        data: any;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export {};

package/components/FeatureGrid.svelte

@@ -0,0 +1,42 @@
+<script>
+import Icon from './Icon.svelte'
+
+  export let data
+</script>
+
+<section>
+  <div class="sm:text-center">
+    {#if data.preheading}
+    <p class="mb-2 text-lg font-semibold leading-8 
+      {(data.color == "pyrosim" ? "text-pyrosim" : (data.color == "pathfinder" ? "text-pathfinder" : "text-teci-blue-dark"))}
+    ">
+        {data.preheading}
+    </p>
+    {/if}
+    <h2 class="text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">
+      {data.heading}
+    </h2>
+    {#if data.subheading}
+      <p class="mx-auto mt-6 max-w-2xl text-lg leading-8 text-gray-600">
+        {data.subheading}
+      </p>
+    {/if}
+  </div>
+  <div class="mt-12 max-w-lg sm:mx-auto md:max-w-none">
+    <div class="grid grid-cols-1 gap-y-8 md:grid-cols-2 md:gap-x-12">
+      {#each data.blocks as block}
+        <div class="relative flex flex-row gap-6">
+          <div class="hidden sm:flex h-12 w-12 items-center justify-center text-white sm:shrink-0 flex-shrink-0 
+          {(data.color == "pyrosim" ? "bg-pyrosim" : (data.color == "pathfinder" ? "bg-pathfinder" : "bg-teci-blue-dark"))}
+          ">
+            <Icon classes="w-auto" icon={block.icon} />
+          </div>
+          <div class="sm:min-w-0 sm:flex-1">
+            <p class="text-lg font-semibold leading-8 text-gray-900">{block.heading}</p>
+            <p class="mt-2 text-base leading-7 text-gray-600">{block.body}</p>
+          </div>
+        </div>
+      {/each}
+    </div>
+  </div>
+</section>

package/components/FeatureGrid.svelte.d.ts

@@ -0,0 +1,23 @@
+/** @typedef {typeof __propDef.props}  FeatureGridProps */
+/** @typedef {typeof __propDef.events}  FeatureGridEvents */
+/** @typedef {typeof __propDef.slots}  FeatureGridSlots */
+export default class FeatureGrid extends SvelteComponentTyped<{
+    data: any;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}> {
+}
+export type FeatureGridProps = typeof __propDef.props;
+export type FeatureGridEvents = typeof __propDef.events;
+export type FeatureGridSlots = typeof __propDef.slots;
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        data: any;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export {};

package/components/Figure.svelte

@@ -1,6 +1,4 @@
 <script>
-  import { dev } from "$app/environment";
-
   export let image;
   export let title;
   export let caption;
@@ -9,23 +7,17 @@
   let figureImage;
   let figureLink;
 
-  if (dev && image) {
+  if (image.startsWith("http")) {
     figureImage = image;
     figureLink = link ? link : image;
-  } else if (image) {
-    if (image.startsWith("http")) {
-      figureImage = image;
-      figureLink = link ? link : image;
-    } else if (image.includes("gif")) {
-      figureImage = "https://thunderheadeng-www.imgix.net" + image;
-      figureLink = link ? link : "https://thunderheadeng-www.imgix.net" + image;
-    } else {
-      figureImage =
-        "https://thunderheadeng-www.imgix.net" +
-        image +
-        "?auto=compress&auto=format";
-      figureLink = link ? link : "https://thunderheadeng-www.imgix.net" + image;
-    }
+  } else if (image.includes("gif")) {
+    figureImage = "https://teci-files.imgix.net/www/images/" + image;
+    figureLink = link ? link : "https://teci-files.imgix.net/www/images/" + image;
+  } else {
+    figureImage = "https://teci-files.imgix.net/www/images/" +
+      image +
+      "?auto=compress&auto=format";
+    figureLink = link ? link : "https://teci-files.imgix.net/www/images/" + image;
   }
 </script>
 

package/components/Hero.svelte

@@ -0,0 +1,74 @@
+<script>
+import Icon from './Icon.svelte'
+
+  export let data
+</script>
+
+<section class="relative bg-white">
+  <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">
+          <a href={data.banner_link_url} class="inline-flex space-x-6">
+            <span class="rounded-full bg-gray-300/10 px-3 py-1 text-sm font-semibold leading-6 {(data.color == "pyrosim" ? "text-pyrosim" : (data.color == "pathfinder" ? "text-pathfinder" : "text-teci-blue-dark"))} ring-1 ring-inset {(data.color == "pyrosim" ? "ring-pyrosim/20" : (data.color == "pathfinder" ? "ring-pathfinder/20" : "ring-teci-blue-dark/20"))}">{data.banner_text}</span>
+            <span class="inline-flex items-center space-x-1 text-sm font-medium leading-6 text-gray-400">
+              <span>{data.banner_link_text}</span>
+              <!-- Heroicon name: mini/chevron-right -->
+              <svg class="h-5 w-5 {(data.color == "pyrosim" ? "text-pyrosim" : (data.color == "pathfinder" ? "text-pathfinder" : "text-teci-blue-dark"))}" 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 text-gray-600">{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 px-4 py-1.5 text-base font-semibold leading-7 shadow-sm ring-1 ring-gray-900/10 hover:ring-gray-900/20 hover:bg-teci-blue-dark
+              {(cta.color == "pyrosim" ? "bg-pyrosim text-white" : (cta.color == "pathfinder" ? "bg-pathfinder text-white" : (cta.color == "white" ? "bg-white text-gray-600 hover:text-white" : "bg-teci-blue-dark text-white")))}
+              ">
+                {cta.text}
+                <span class="hidden sm:inline {(cta.color == "white" ? "text-gray-600" : "text-white")}" aria-hidden="true">&rarr;</span>
+              </a>
+            {/each}
+          </div>
+        {/if}
+        <div class="mt-16">
+          <section class="{(data.color == "pyrosim" ? "bg-pyrosim" : (data.color == "pathfinder" ? "bg-pathfinder" : "bg-teci-blue-dark"))}">
+            <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-flex w-full items-center justify-center border border-transparent bg-white px-5 py-3 text-base font-medium text-gray-900 hover:bg-indigo-50 sm:w-auto">
+                {@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-files.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-files.imgix.net/www/images/{data.image}?fmt=auto" alt={data.heading}
+        class="absolute object-cover h-full w-full"
+        >
+      {/if}
+    </div>
+  </div>
+</section>

package/components/Hero.svelte.d.ts

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

package/components/LogoCloud.svelte

@@ -0,0 +1,25 @@
+<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 text-gray-600">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/components/LogoCloud.svelte.d.ts

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

package/components/MediaFeature.svelte

@@ -1,46 +1,28 @@
 <script>
 import Video from './Video.svelte'
 
-  import { dev } from "$app/environment";
   export let data;
 
   let figureImage;
   let figureLink;
 
-  if (dev && data.image) {
-    figureImage = data.image;
-    figureLink = data.image;
-  } else if (data.image) {
-    figureImage = data.image.startsWith("http")
-      ? data.image
-      : "https://thunderheadeng-www.imgix.net" +
-        data.image +
-        "?w=576&ar=16:9&fit=crop&auto=compress&auto=format";
-    figureLink = data.image.startsWith("http")
-      ? data.image
-      : "https://thunderheadeng-www.imgix.net" + data.image;
-  }
-
-  if (dev && data.image) {
-    figureImage = data.image;
-    figureLink = data.link ? data.link : data.image;
-  } else if (data.image) {
+  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://thunderheadeng-www.imgix.net" + data.image;
+      figureImage = "https://teci-files.imgix.net/www/images/" + data.image;
       figureLink = data.link
         ? data.link
-        : "https://thunderheadeng-www.imgix.net" + data.image;
+        : "https://teci-files.imgix.net/www/images/" + data.image;
     } else {
       figureImage =
-        "https://thunderheadeng-www.imgix.net" +
+        "https://teci-files.imgix.net/www/images/" +
         data.image +
         "?w=576&ar=16:9&fit=crop&auto=compress&auto=format";
       figureLink = data.link
         ? data.link
-        : "https://thunderheadeng-www.imgix.net" + data.image;
+        : "https://teci-files.imgix.net/www/images/" + data.image;
     }
   }
 </script>

package/components/PricingTable.svelte

@@ -0,0 +1,84 @@
+<script>
+  export let data
+  let toggleID = data.groups[0].id
+
+  function toggleSelection(id) {
+    toggleID = id
+  }
+</script>
+
+<section class="overflow-hidden">
+  <div class="sm:align-center sm:flex sm:flex-col">
+    <h1 class="text-5xl font-bold tracking-tight text-gray-900 sm:text-center">{data.heading}</h1>
+    <p class="mt-5 text-xl text-gray-500 sm:text-center">{data.subheading}</p>
+    <div class="relative mt-6 max-w-xs w-full flex flex-row space-x-4 self-center justify-evenly rounded-lg bg-gray-100 p-0.5 sm:mt-8">
+      {#each data.groups as group}
+        <button type="button" 
+          on:click={toggleSelection(group.id)}
+          id={group.id}
+          class="relative w-full whitespace-nowrap rounded-md py-2 text-sm font-medium border focus:z-10 focus:outline-none focus:ring-2 focus:ring-teci-blue-light
+          {toggleID == group.id ? "border-gray-200 bg-white text-gray-900 shadow-sm" : "border-transparent text-gray-700"}
+          ">
+          {group.label}
+        </button>
+      {/each}
+    </div>
+    <p class="mt-4 text-md max-w-xl mx-auto text-gray-500 sm:text-center">{data.groups.find(x => x.id === toggleID).description}</p>
+  </div>
+  <div class="mt-8 space-y-4 sm:grid sm:grid-cols-2 sm:gap-6 sm:space-y-0 lg:mx-auto lg:max-w-4xl xl:mx-0 xl:max-w-none xl:grid-cols-4">
+    {#each data.groups as group}
+      {#if (group.id == toggleID)}
+        {#each group.options as option}
+          <div class="max-w-xs mx-auto sm:odd:mr-0 sm:even:ml-0 divide-y divide-gray-200 border border-gray-200 {option.highlight ? "shadow-[inset_0_0_6px_0_rgb(0,43,127,1.0)]":"shadow-md"}">
+            <div class="p-6">
+              <h2 class="text-lg font-medium leading-6 text-gray-900">{option.label}</h2>
+                <p class="mt-4 text-sm text-gray-500">{option.text}</p>
+              <p class="mt-8">
+                {#if option.unit}
+                  <span class="text-2xl align-super font-medium text-gray-500">{option.unit}</span>
+                {/if}
+                  <span class="text-4xl font-bold tracking-tight text-gray-900">{option.price}</span>
+                {#if option.divisor}
+                  <span class="text-base font-medium text-gray-500">{option.divisor}</span>  
+                {/if}
+              </p>
+              <a href={option.cta_url} class="mt-8 block w-full border {(option.cta_color == "pyrosim" ? "border-pyrosim bg-pyrosim" : (data.color == "pathfinder" ? "border-pathfinder bg-pathfinder" : "border-teci-blue-dark bg-teci-blue-dark"))} py-2 text-center text-sm font-semibold text-white hover:bg-teci-blue-dark">{option.cta_label}</a>
+            </div>
+            <div class="px-6 pt-6 pb-8">
+              <h3 class="text-sm font-medium text-gray-900">{option.features_text}</h3>
+              <ul class="mt-6 space-y-4">
+                {#each option.features as feature}
+                  <li class="flex space-x-3">
+                    <!-- Heroicon name: mini/check -->
+                    <svg class="h-5 w-5 flex-shrink-0 text-green-500" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
+                      <path fill-rule="evenodd" d="M16.704 4.153a.75.75 0 01.143 1.052l-8 10.5a.75.75 0 01-1.127.075l-4.5-4.5a.75.75 0 011.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 011.05-.143z" clip-rule="evenodd" />
+                    </svg>
+                    <span class="text-sm text-gray-500">{feature.text}</span>
+                  </li>
+                {/each}
+              </ul>
+            </div>
+          </div>
+        {/each}
+      {/if}
+    {/each}
+  </div>
+  <section class="mt-12 text-xl text-gray-500 sm:text-center">
+    <p>Apply for free academic or government review licenses.</p>
+  </section>
+  <section class="mt-4 text-md max-w-4xl mx-auto text-gray-500 sm:text-center">
+    <p>Educational licenses are available to students and instructors for academic, non-commercial use.</p><p>Review licenses are available to authorities (AHJs) for regulatory, non-commercial use..</p>
+  </section>
+  {#if data.ctas}
+      <div class="mt-4 flex gap-x-4 py-1 sm:justify-center">
+        {#each data.ctas as cta}
+          <a href={cta.url} class="inline-block px-4 py-1.5 text-base font-semibold leading-7 shadow-sm ring-1 ring-gray-900/10 hover:ring-gray-900/20 hover:bg-teci-blue-dark
+          {(cta.color == "pyrosim" ? "bg-pyrosim text-white" : (cta.color == "pathfinder" ? "bg-pathfinder text-white" : (cta.color == "white" ? "bg-white text-gray-600 hover:text-white" : "bg-teci-blue-dark text-white")))}
+          ">
+            {cta.text}
+            <span class="hidden sm:inline {(cta.color == "white" ? "text-gray-600" : "text-white")}" aria-hidden="true">&rarr;</span>
+          </a>
+        {/each}
+      </div>
+    {/if}
+</section>

package/components/PricingTable.svelte.d.ts

@@ -0,0 +1,23 @@
+/** @typedef {typeof __propDef.props}  PricingTableProps */
+/** @typedef {typeof __propDef.events}  PricingTableEvents */
+/** @typedef {typeof __propDef.slots}  PricingTableSlots */
+export default class PricingTable extends SvelteComponentTyped<{
+    data: any;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}> {
+}
+export type PricingTableProps = typeof __propDef.props;
+export type PricingTableEvents = typeof __propDef.events;
+export type PricingTableSlots = typeof __propDef.slots;
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        data: any;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export {};

package/components/Stats.svelte

@@ -0,0 +1,34 @@
+<script>
+  export let data
+</script>
+
+<section class="bg-gray-50">
+  <div class="mx-auto max-w-7xl p-6 lg:p-8">
+    <div class="mx-auto max-w-4xl text-center">
+      <h2 class="text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">{data.heading}</h2>
+      {#if data.subheading}
+        <p class="mt-3 text-xl text-gray-500 sm:mt-4">{data.subheading}</p>
+      {/if}
+    </div>
+  </div>
+  <div class="bg-white">
+    <div class="relative">
+      <div class="absolute inset-0 bg-gray-50"></div>
+      <div class="relative mx-auto max-w-7xl px-6 lg:px-8">
+        <div class="mx-auto max-w-4xl">
+          <dl class="bg-white shadow-lg sm:grid sm:grid-cols-3">
+            {#each data.stats as stat, i}
+            <div id="stat-{i}" class="flex flex-col border-b border-gray-100 p-6 text-center sm:border-0 sm:border-r sm:border-l">
+              <dt class="order-2 mt-2 text-lg font-medium leading-6 text-gray-500">{stat.label}</dt>
+              <dd class="order-1 text-5xl font-bold tracking-tight {(data.color == "pyrosim" ? "text-pyrosim" : (data.color == "pathfinder" ? "text-pathfinder" : "text-teci-blue-dark"))}">{stat.value}</dd>
+            </div>
+            {/each}
+          </dl>
+        </div>
+        <figure>
+          <img class="w-full" alt="World map with colored countries for Thunderhead software customers." src="https://teci-files.imgix.net/www/images/{data.image}?auto=compress&auto=format">
+        </figure>
+      </div>
+    </div>
+  </div>
+</section>

package/components/Stats.svelte.d.ts

@@ -0,0 +1,23 @@
+/** @typedef {typeof __propDef.props}  StatsProps */
+/** @typedef {typeof __propDef.events}  StatsEvents */
+/** @typedef {typeof __propDef.slots}  StatsSlots */
+export default class Stats extends SvelteComponentTyped<{
+    data: any;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}> {
+}
+export type StatsProps = typeof __propDef.props;
+export type StatsEvents = typeof __propDef.events;
+export type StatsSlots = typeof __propDef.slots;
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        data: any;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export {};

package/components/Testimonial.svelte

@@ -0,0 +1,171 @@
+<script>
+import Icon from './Icon.svelte'
+
+  import { slide } from 'svelte/transition';
+  import { onMount } from 'svelte'
+
+  export let data;
+
+  let anchor;
+  let index = 0;
+  let interval = 12000;
+  let auto = true;
+  let slideInterval;
+
+  onMount(() => {
+    anchor = document.getElementById('slider');
+    setSlideAutomation();
+  })
+
+  function setSlideAutomation() {
+    if (auto) {
+      clearInterval(slideInterval);
+      slideInterval = setInterval(next, interval);
+    }
+  }
+
+  const prev = () => {
+    let amount;
+    if (index == 0) {
+      index = data.quotes.length - 1;
+    } else if (index <= data.quotes.length) {
+      index = (index - 1) % data.quotes.length;
+    }
+    setSlideAutomation();
+  };
+
+  const next = () => {
+    index = (index + 1) % data.quotes.length;
+    setSlideAutomation();
+  };
+
+  function fadeSlide(node, options) {
+    const slideTrans = slide(node, options);
+    return {
+      duration: options.duration,
+      css: (t) => `
+				${slideTrans.css(t)}
+				opacity: ${t};
+			`,
+    };
+  }
+</script>
+
+<section id="slider" class="overflow-hidden">
+  <div class="relative mx-auto max-w-4xl lg:max-w-none mt-10 lg:px-4 lg:py-8 lg:mt-0">
+    <svg
+      class="absolute right-full top-1/2 hidden translate-x-1/2 -translate-y-1/2 transform lg:block"
+      width="404"
+      height="784"
+      fill="none"
+      viewBox="0 0 404 784"
+      aria-hidden="true"
+    >
+      <defs>
+        <pattern
+          id="56409614-3d62-4985-9a10-7ca758a8f4f0"
+          x="0"
+          y="0"
+          width="20"
+          height="20"
+          patternUnits="userSpaceOnUse"
+        >
+          <rect
+            x="0"
+            y="0"
+            width="4"
+            height="4"
+            class="text-gray-200"
+            fill="currentColor"></rect>
+        </pattern>
+      </defs>
+      <rect
+        width="404"
+        height="784"
+        fill="url(#56409614-3d62-4985-9a10-7ca758a8f4f0)"></rect>
+    </svg>
+    <div
+      class="relative flex h-auto flex-col items-center justify-items-center"
+    >
+      {#each [data.quotes[index]] as quote (index)}
+        <div
+          transition:fadeSlide="{{ duration: 300 }}"
+          class="relative mx-auto w-full lg:flex lg:items-center"
+        >
+          <div class="hidden lg:block lg:flex-shrink-0">
+            <img
+              class="h-64 w-64 rounded-full xl:h-80 xl:w-80"
+              src="https://teci-files.imgix.net/www/images/{quote.image}?w=320&fit=facearea,crop&facepad=3&monochrome=9B9B9B&auto=compress&auto=format"
+              alt="Image of {quote.fullname}"
+              title="{quote.fullname}"
+            />
+          </div>
+          <div class="relative w-full lg:ml-10">
+            <svg
+              class="absolute top-0 left-0 h-24 w-24 -translate-x-0 -translate-y-12 transform text-teci-blue-light opacity-10 lg:-translate-x-8 lg:-translate-y-10"
+              stroke="currentColor"
+              fill="none"
+              viewBox="0 0 144 144"
+              aria-hidden="true"
+            >
+              <path
+                stroke-width="2"
+                d="M41.485 15C17.753 31.753 1 59.208 1 89.455c0 24.664 14.891 39.09 32.109 39.09 16.287 0 28.386-13.03 28.386-28.387 0-15.356-10.703-26.524-24.663-26.524-2.792 0-6.515.465-7.446.93 2.327-15.821 17.218-34.435 32.11-43.742L41.485 15zm80.04 0c-23.268 16.753-40.02 44.208-40.02 74.455 0 24.664 14.891 39.09 32.109 39.09 15.822 0 28.386-13.03 28.386-28.387 0-15.356-11.168-26.524-25.129-26.524-2.792 0-6.049.465-6.98.93 2.327-15.821 16.753-34.435 31.644-43.742L121.525 15z"
+              ></path>
+            </svg>
+            <blockquote class="relative block w-full min-w-full">
+              <div class="relative w-full text-2xl font-medium leading-9 text-gray-700">
+                <p>{@html quote.text}</p>
+                <svg
+                  class="absolute bottom-0 right-0 h-24 w-24 translate-y-8 rotate-180 transform text-teci-blue-light opacity-10"
+                  stroke="currentColor"
+                  fill="none"
+                  viewBox="0 0 144 144"
+                  aria-hidden="true"
+                >
+                  <path
+                    stroke-width="2"
+                    d="M41.485 15C17.753 31.753 1 59.208 1 89.455c0 24.664 14.891 39.09 32.109 39.09 16.287 0 28.386-13.03 28.386-28.387 0-15.356-10.703-26.524-24.663-26.524-2.792 0-6.515.465-7.446.93 2.327-15.821 17.218-34.435 32.11-43.742L41.485 15zm80.04 0c-23.268 16.753-40.02 44.208-40.02 74.455 0 24.664 14.891 39.09 32.109 39.09 15.822 0 28.386-13.03 28.386-28.387 0-15.356-11.168-26.524-25.129-26.524-2.792 0-6.049.465-6.98.93 2.327-15.821 16.753-34.435 31.644-43.742L121.525 15z"
+                  ></path>
+                </svg>
+              </div>
+              <footer class="mt-8">
+                <div class="flex">
+                  <div class="flex-shrink-0 lg:hidden">
+                    <img
+                      class="h-12 w-12 rounded-full"
+                      src="https://teci-files.imgix.net/www/images/{quote.image}?w=48&fit=clip&monochrome=9B9B9B&auto=compress&auto=format"
+                      alt="Thumbnail Image of {quote.fullname}"
+                    />
+                  </div>
+                  <div class="ml-4 lg:ml-0">
+                    <div class="text-base text-gray-900">
+                      {quote.fullname}
+                    </div>
+                    <div
+                      class="text-base font-medium {data.color == 'pyrosim'
+                        ? 'text-pyrosim'
+                        : data.color == 'pathfinder'
+                        ? 'text-pathfinder'
+                        : 'text-teci-blue-dark'}"
+                    >
+                      {quote.fulltitle}
+                    </div>
+                  </div>
+                </div>
+              </footer>
+            </blockquote>
+          </div>
+        </div>
+      {/each}
+      <div class="bg-white relative w-half pt-6 md:pt-2 lg:pt-4 flex flex-row space-x-8 justify-center">
+        <button type="button" title="Previous" on:click="{prev}">
+          <Icon icon="icon-arrow_left" classes="text-4xl text-gray-400" />
+        </button>
+        <button type="button" title="Next" on:click="{next}">
+          <Icon icon="icon-arrow_right" classes="text-4xl text-gray-400" />
+        </button>
+    </div>
+  </div>
+</div>
+</section>

package/components/Testimonial.svelte.d.ts

@@ -0,0 +1,23 @@
+/** @typedef {typeof __propDef.props}  TestimonialProps */
+/** @typedef {typeof __propDef.events}  TestimonialEvents */
+/** @typedef {typeof __propDef.slots}  TestimonialSlots */
+export default class Testimonial extends SvelteComponentTyped<{
+    data: any;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}> {
+}
+export type TestimonialProps = typeof __propDef.props;
+export type TestimonialEvents = typeof __propDef.events;
+export type TestimonialSlots = typeof __propDef.slots;
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        data: any;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export {};

package/components/Video.svelte

@@ -1,24 +1,118 @@
 <script>
-  export let data = {};
-  export let v = "";
-  let id;
+  import { onMount } from 'svelte'
+
+  export let data={};
+  export let v="";
+  export let thumbnail="";
+
+  let id="";
+  let thumb="";
+  let youtube=false;
+  let videoURL="";
+
+  onMount(() => {
+    var lazyVideos = [].slice.call(document.querySelectorAll("video.lazy"));
+
+    if ("IntersectionObserver" in window) {
+      var lazyVideoObserver = new IntersectionObserver(function(entries, observer) {
+        entries.forEach(function(video) {
+          if (video.isIntersecting) {
+            for (var source in video.target.children) {
+              var videoSource = video.target.children[source];
+              if (typeof videoSource.tagName === "string" && videoSource.tagName === "SOURCE") {
+                videoSource.src = videoSource.dataset.src;
+              }
+            }
+
+            video.target.load();
+            video.target.classList.remove("lazy");
+            lazyVideoObserver.unobserve(video.target);
+          }
+        });
+      });
+
+      lazyVideos.forEach(function(lazyVideo) {
+        lazyVideoObserver.observe(lazyVideo);
+      });
+    }
+  })
 
   if (v) {
-    id = v;
-  } else if (data) {
-    id = data.v;
+    if (v.includes("mp4")) {
+      youtube = false;
+      videoURL = `https://teci-files.imgix.net/www/videos/${v}`;
+    } else {
+      youtube = true;
+      id = v;
+    };
+  } else if (data.v) {
+    if (data.v.includes("mp4")) {
+      youtube = false;
+      videoURL = `https://teci-files.imgix.net/www/videos/${data.v}`;
+    } else {
+      youtube = true;
+      id = data.v;
+    };
   } else {
     id = "";
+    videoURL = "";
+  };
+
+  if (thumbnail) {
+    thumb = `https://teci-files.imgix.net/www/images/${thumbnail}?w=1214&fit=clip&auto=compress&auto=format`;
+  } else if (data.thumbnail) {
+    thumb = `https://teci-files.imgix.net/www/images/${data.thumbnail}?w=1214&fit=clip&auto=compress&auto=format`;
+  } else if (id) {
+    if (youtube) {
+      thumb = `https://img.youtube.com/vi/${id}/hqdefault.jpg`;
+    }
   }
 </script>
 
-<section class="aspect-video w-full border border-gray-200 bg-black shadow-md">
-  <iframe
-    src="https://www.youtube.com/embed/{id}"
+<section class="aspect-video not-prose w-full border border-gray-200 bg-black shadow-md">
+  {#if youtube}
+    <iframe
     title="YouTube Video ID {id}"
     class="aspect-video w-full"
     frameborder="0"
-    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+    allow="autoplay; encrypted-media"
     allowfullscreen
+    src="https://www.youtube.com/embed/${id}?autoplay=1&start=0&mute=1"
+    srcdoc="{`
+      <style>
+        body, .youtubeembed {
+        width: 100%;
+        height: 100%;
+        margin: 0;
+        position: absolute;
+        display: flex;
+        justify-content: center;
+        object-fit: cover;
+        }
+      </style>
+      <a
+        href='https://www.youtube.com/embed/${id}?autoplay=1&start=0&mute=1'
+        class='youtubeembed'
+      >
+        <img
+          src='${thumb}'
+          class='youtubeembed'
+        />
+        <svg
+          version='1.1'
+          viewBox='0 0 68 48'
+          width='68px'
+          style='position: relative;'
+        >
+          <path d='M66.52,7.74c-0.78-2.93-2.49-5.41-5.42-6.19C55.79,.13,34,0,34,0S12.21,.13,6.9,1.55 C3.97,2.33,2.27,4.81,1.48,7.74C0.06,13.05,0,24,0,24s0.06,10.95,1.48,16.26c0.78,2.93,2.49,5.41,5.42,6.19 C12.21,47.87,34,48,34,48s21.79-0.13,27.1-1.55c2.93-0.78,4.64-3.26,5.42-6.19C67.94,34.95,68,24,68,24S67.94,13.05,66.52,7.74z' fill='#f00'></path>
+          <path d='M 45,24 27,14 27,34' fill='#fff'></path>
+        </svg>
+      </a>
+    `}"
   />
-</section>
+  {:else}
+    <video class="lazy aspect-video w-full" autoplay muted loop playsinline controls poster={thumb}>
+      <source data-src={videoURL} type="video/mp4">
+    </video>
+  {/if}  
+</section>

package/components/Video.svelte.d.ts

@@ -4,6 +4,7 @@
 export default class Video extends SvelteComponentTyped<{
     data?: {};
     v?: string;
+    thumbnail?: string;
 }, {
     [evt: string]: CustomEvent<any>;
 }, {}> {
@@ -16,6 +17,7 @@ declare const __propDef: {
     props: {
         data?: {};
         v?: string;
+        thumbnail?: string;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/layouts/blocks.svelte

@@ -12,6 +12,15 @@
   import TrialForm from "../components/TrialForm.svelte";
   import Video from "../components/Video.svelte";
   import MetaSocial from "../components/MetaSocial.svelte";
+  import Hero from "../components/Hero.svelte";
+  import CTABranded from "../components/CTABranded.svelte";
+  import FeatureGrid from "../components/FeatureGrid.svelte";
+  import LogoCloud from "../components/LogoCloud.svelte";
+  import CtaSplitImage from "../components/CTASplitImage.svelte";
+  import ContentTwoColumns from "../components/ContentTwoColumns.svelte";
+  import PricingTable from "../components/PricingTable.svelte";
+  import Stats from "../components/Stats.svelte";
+  import Testimonial from "../components/Testimonial.svelte";
 
   let blocks = [
     { ref: "cta-center", component: CTA },
@@ -23,6 +32,15 @@
     { ref: "three-column", component: ThreeColumn },
     { ref: "trial-form", component: TrialForm },
     { ref: "video", component: Video },
+    { ref: "hero", component: Hero },
+    { ref: "cta-branded", component: CTABranded },
+    { ref: "feature-grid", component: FeatureGrid },
+    { ref: "logo-cloud", component: LogoCloud },
+    { ref: "cta-split-image", component: CtaSplitImage },
+    { ref: "content-two-columns", component: ContentTwoColumns },
+    { ref: "pricing-table", component: PricingTable },
+    { ref: "stats", component: Stats },
+    { ref: "testimonial", component: Testimonial },
   ];
 
   export let title;
@@ -45,13 +63,13 @@
       featuredImage = images[0];
     } else {
       featuredImage =
-        "https://thunderheadeng-www.imgix.net" +
+        "https://teci-files.imgix.net/www/images/" +
         images[0] +
         "?w=1200&h=627&fit=crop&auto=compress&auto=format";
     }
   } else {
     featuredImage =
-      "https://files.thunderheadeng.com/www/images/teci_icon_250.png";
+      "https://teci-files.imgix.net/www/images/teci_icon_250.png";
   }
 </script>
 
@@ -63,7 +81,7 @@
   {/if}
 </svelte:head>
 
-<article class="flex flex-col space-y-12 {layout}">
+<article class="flex flex-col space-y-16 {layout}">
   {#each page_sections as section}
     {#if section && section.fieldGroup === "sidebar-content"}
       <svelte:component

package/package.json

@@ -1,51 +1,51 @@
 {
   "name": "tecitheme",
-  "version": "0.2.8",
+  "version": "0.3.1",
   "svelte": true,
   "devDependencies": {
     "@jsdevtools/rehype-toc": "^3.0.2",
-    "@sveltejs/adapter-netlify": "1.0.0-next.84",
-    "@sveltejs/kit": "1.0.0-next.551",
-    "@sveltejs/package": "^1.0.0-next.6",
+    "@sveltejs/adapter-netlify": "2.0.4",
+    "@sveltejs/kit": "1.6.0",
+    "@sveltejs/package": "^1.0.2",
     "@tailwindcss/forms": "^0.5.3",
-    "@tailwindcss/typography": "^0.5.8",
+    "@tailwindcss/typography": "^0.5.9",
     "@types/cookie": "^0.5.1",
-    "@typescript-eslint/eslint-plugin": "^5.43.0",
-    "@typescript-eslint/parser": "^5.43.0",
+    "@typescript-eslint/eslint-plugin": "^5.52.0",
+    "@typescript-eslint/parser": "^5.52.0",
     "autoprefixer": "^10.4.13",
     "dotenv": "^16.0.3",
     "encoding": "^0.1.13",
-    "eslint": "^8.27.0",
-    "eslint-config-prettier": "^8.5.0",
+    "eslint": "^8.34.0",
+    "eslint-config-prettier": "^8.6.0",
     "eslint-plugin-svelte3": "^4.0.0",
-    "html-to-text": "^8.2.1",
+    "html-to-text": "^9.0.4",
     "markdown-yaml-metadata-parser": "^3.0.0",
     "mdsvex": "^0.10.6",
-    "postcss": "^8.4.19",
-    "prettier": "^2.7.1",
-    "prettier-plugin-tailwindcss": "^0.1.13",
+    "postcss": "^8.4.21",
+    "prettier": "^2.8.4",
+    "prettier-plugin-tailwindcss": "^0.2.2",
     "rehype-parse": "^8.0.4",
     "rehype-slug": "^5.1.0",
     "rehype-stringify": "^9.0.3",
     "stream": "^0.0.2",
-    "svelte": "^3.53.1",
-    "svelte-check": "^2.9.2",
+    "svelte": "^3.55.1",
+    "svelte-check": "^3.0.3",
     "svelte-paginate": "^0.1.0",
-    "svelte-preprocess": "^4.10.7",
-    "svelte2tsx": "^0.5.20",
-    "tailwindcss": "^3.2.4",
-    "tslib": "^2.4.1",
-    "typescript": "^4.9.3",
+    "svelte-preprocess": "^5.0.1",
+    "svelte2tsx": "^0.6.1",
+    "tailwindcss": "^3.2.6",
+    "tslib": "^2.5.0",
+    "typescript": "^4.9.5",
     "uuid-by-string": "^4.0.0",
-    "vite": "^3.2.4",
+    "vite": "^4.1.1",
     "vite-plugin-autoimport": "^1.6.6"
   },
   "type": "module",
   "dependencies": {
     "@lukeed/uuid": "^2.0.0",
     "cookie": "^0.5.0",
-    "katex": "^0.16.3",
-    "svelte": "^3.53.1"
+    "katex": "^0.16.4",
+    "svelte": "^3.55.1"
   },
   "exports": {
     "./package.json": "./package.json",
@@ -53,20 +53,29 @@
     "./components/Banner.svelte": "./components/Banner.svelte",
     "./components/Button.svelte": "./components/Button.svelte",
     "./components/CTA.svelte": "./components/CTA.svelte",
+    "./components/CTABranded.svelte": "./components/CTABranded.svelte",
+    "./components/CTASplitImage.svelte": "./components/CTASplitImage.svelte",
     "./components/Card.svelte": "./components/Card.svelte",
+    "./components/ContentTwoColumns.svelte": "./components/ContentTwoColumns.svelte",
     "./components/CountrySelector.svelte": "./components/CountrySelector.svelte",
+    "./components/FeatureGrid.svelte": "./components/FeatureGrid.svelte",
     "./components/Figure.svelte": "./components/Figure.svelte",
     "./components/Footer.svelte": "./components/Footer.svelte",
     "./components/Header.svelte": "./components/Header.svelte",
     "./components/HeadingCentered.svelte": "./components/HeadingCentered.svelte",
+    "./components/Hero.svelte": "./components/Hero.svelte",
     "./components/Icon.svelte": "./components/Icon.svelte",
+    "./components/LogoCloud.svelte": "./components/LogoCloud.svelte",
     "./components/Math.svelte": "./components/Math.svelte",
     "./components/MediaFeature.svelte": "./components/MediaFeature.svelte",
     "./components/MetaSocial.svelte": "./components/MetaSocial.svelte",
     "./components/Modal.svelte": "./components/Modal.svelte",
     "./components/NewsGrid.svelte": "./components/NewsGrid.svelte",
+    "./components/PricingTable.svelte": "./components/PricingTable.svelte",
     "./components/SidebarContent.svelte": "./components/SidebarContent.svelte",
+    "./components/Stats.svelte": "./components/Stats.svelte",
     "./components/Subscribe.svelte": "./components/Subscribe.svelte",
+    "./components/Testimonial.svelte": "./components/Testimonial.svelte",
     "./components/ThreeColumn.svelte": "./components/ThreeColumn.svelte",
     "./components/TrialForm.svelte": "./components/TrialForm.svelte",
     "./components/Video.svelte": "./components/Video.svelte",

package/site_config.json

@@ -1,5 +1,5 @@
 {
-  "showBanner": true,
+  "showBanner": false,
   "bannerData": {
     "showCTA": true,
     "shortText": "Short text in a few words to show how it works.",