From b7e39b59fd0fc7b5610ebff29035bf622079e0d8 Mon Sep 17 00:00:00 2001
From: ivarlovlie <git@ivarlovlie.no>
Date: Wed, 5 Oct 2022 20:45:21 +0800
Subject: refactor: Change file structure

---
 apps/kit/src/lib/components/alert.svelte           | 268 ---------------------
 apps/kit/src/lib/components/button.svelte          | 103 --------
 apps/kit/src/lib/components/checkbox.svelte        |  24 --
 .../src/lib/components/icons/adjustments.svelte    |  14 --
 .../lib/components/icons/bars-3-center-left.svelte |  15 --
 apps/kit/src/lib/components/icons/calendar.svelte  |  14 --
 .../src/lib/components/icons/check-circle.svelte   |  13 -
 .../lib/components/icons/chevron-up-down.svelte    |  13 -
 apps/kit/src/lib/components/icons/database.svelte  |  14 --
 .../lib/components/icons/exclamation-circle.svelte |  13 -
 .../components/icons/exclamation-triangle.svelte   |  13 -
 .../src/lib/components/icons/folder-open.svelte    |  14 --
 apps/kit/src/lib/components/icons/home.svelte      |  14 --
 apps/kit/src/lib/components/icons/index.ts         |  41 ----
 .../lib/components/icons/information-circle.svelte |  13 -
 .../lib/components/icons/magnifying-glass.svelte   |  13 -
 apps/kit/src/lib/components/icons/megaphone.svelte |  14 --
 apps/kit/src/lib/components/icons/menu.svelte      |  14 --
 .../kit/src/lib/components/icons/queue-list.svelte |  14 --
 apps/kit/src/lib/components/icons/spinner.svelte   |  20 --
 apps/kit/src/lib/components/icons/x-circle.svelte  |  13 -
 apps/kit/src/lib/components/icons/x-mark.svelte    |  11 -
 apps/kit/src/lib/components/icons/x.svelte         |  14 --
 apps/kit/src/lib/components/index.ts               |  15 --
 apps/kit/src/lib/components/input.svelte           | 103 --------
 apps/kit/src/lib/components/locale-switcher.svelte |  55 -----
 apps/kit/src/lib/components/switch.svelte          | 143 -----------
 27 files changed, 1015 deletions(-)
 delete mode 100644 apps/kit/src/lib/components/alert.svelte
 delete mode 100644 apps/kit/src/lib/components/button.svelte
 delete mode 100644 apps/kit/src/lib/components/checkbox.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/adjustments.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/bars-3-center-left.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/calendar.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/check-circle.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/chevron-up-down.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/database.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/exclamation-circle.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/exclamation-triangle.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/folder-open.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/home.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/index.ts
 delete mode 100644 apps/kit/src/lib/components/icons/information-circle.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/magnifying-glass.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/megaphone.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/menu.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/queue-list.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/spinner.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/x-circle.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/x-mark.svelte
 delete mode 100644 apps/kit/src/lib/components/icons/x.svelte
 delete mode 100644 apps/kit/src/lib/components/index.ts
 delete mode 100644 apps/kit/src/lib/components/input.svelte
 delete mode 100644 apps/kit/src/lib/components/locale-switcher.svelte
 delete mode 100644 apps/kit/src/lib/components/switch.svelte

(limited to 'apps/kit/src/lib/components')

diff --git a/apps/kit/src/lib/components/alert.svelte b/apps/kit/src/lib/components/alert.svelte
deleted file mode 100644
index fd57105..0000000
--- a/apps/kit/src/lib/components/alert.svelte
+++ /dev/null
@@ -1,268 +0,0 @@
-<script lang="ts">
-    import { random_string } from "$lib/helpers";
-    import { createEventDispatcher } from "svelte";
-    import { onMount } from "svelte";
-    import pwKey from "$actions/pwKey";
-    import { Temporal } from "temporal-polyfill";
-    import { ExclamationTriangleIcon, CheckCircleIcon, InformationCircleIcon, XCircleIcon, XMarkIcon } from "./icons";
-
-    const dispatch = createEventDispatcher();
-    const noCooldownSetting = "no-cooldown";
-
-    let iconComponent: any;
-    let colorClassPart = "";
-
-    /**
-     * An optional id for this alert, a default is set if not specified.
-     * This value is necessary for closeable cooldown to work.
-     */
-    // if no unique id is supplied, cooldown will not work between page loads.
-    // Therefore we are disabling it with noCooldownSetting in the fallback id.
-    export let id = "alert--" + noCooldownSetting + "--" + random_string(4);
-    /**
-     * The title to communicate, value is optional
-     */
-    export let title = "";
-    /**
-     * The message to communicate, value is optional
-     */
-    export let message = "";
-    /**
-     * Changes the alerts color and icon.
-     */
-    export let type: "info" | "success" | "warning" | "error" = "info";
-    /**
-     * If true the alert can be removed from the DOM by clicking on a X icon on the upper right hand courner
-     */
-    export let closeable = false;
-    /**
-     * The amount of seconds that should go by before this alert is shown again, only works when a unique id is set.
-     * Set to ~ if it should only be shown once per client (State stored in localestorage).
-     **/
-    export let closeableCooldown = "-1";
-    /**
-     * The text that is displayed on the right link
-     */
-    export let rightLinkText = "";
-    /**
-     * An array of list items displayed under the message or title
-     */
-    export let listItems: Array<string> = [];
-    /**
-     * An array of {id:string;text:string;color?:string}, where id is dispatched back as an svelte event with this syntax act$id (ex: on:actcancel).
-     * Text is the button text
-     * Color is the optional tailwind color to used, the value is used in classes like bg-$color-50.
-     */
-    export let actions: Array<{ id: string; text: string; color?: string }> = [];
-    /**
-     * This value is set on a plain anchor tag without any svelte routing,
-     * listen to the on:rightLinkClick if you want to intercept the click without navigating
-     */
-    export let rightLinkHref = "javascript:void(0)";
-    $: cooldownEnabled =
-        id.indexOf(noCooldownSetting) === -1 && closeable && (closeableCooldown === "~" || parseInt(closeableCooldown) > 0);
-    /**
-     * Sets this alerts visibility state, when this is false it is removed from the dom using an {#if} block.
-     */
-    export let visible = closeableCooldown === "~" || parseInt(closeableCooldown) > 0 ? false : true;
-
-    export let _pwKey: string | undefined = undefined;
-
-    const cooldownStorageKey = "lastseen--" + id;
-
-    $: switch (type) {
-        case "info": {
-            colorClassPart = "blue";
-            iconComponent = InformationCircleIcon;
-            break;
-        }
-        case "warning": {
-            colorClassPart = "yellow";
-            iconComponent = ExclamationTriangleIcon;
-            break;
-        }
-        case "error": {
-            colorClassPart = "red";
-            iconComponent = XCircleIcon;
-            break;
-        }
-        case "success": {
-            colorClassPart = "green";
-            iconComponent = CheckCircleIcon;
-            break;
-        }
-    }
-
-    function close() {
-        visible = false;
-        if (cooldownEnabled) {
-            console.log("Cooldown enabled for " + id + ", " + closeableCooldown === "~" ? "with an endless cooldown" : "");
-            localStorage.setItem(cooldownStorageKey, String(Temporal.Now.instant().epochSeconds));
-        }
-    }
-
-    function rightLinkClicked() {
-        dispatch("rightLinkCliked");
-    }
-
-    function actionClicked(name: string) {
-        dispatch("act" + name);
-    }
-
-    // Manages the state of the alert if cooldown is enabled
-    function run_cooldown() {
-        if (!cooldownEnabled) {
-            console.log("Alert cooldown is not enabled for " + id);
-            return;
-        }
-        if (!localStorage.getItem(cooldownStorageKey)) {
-            console.log("Alert " + id + " has not been seen yet, displaying");
-            visible = true;
-            return;
-        }
-        // if (!visible) {
-        //     console.log(
-        //         "Alert " + id + " is not visible, stopping cooldown change"
-        //     );
-        //     return;
-        // }
-        if (closeableCooldown === "~") {
-            console.log("Alert " + id + " has an infinite cooldown, hiding");
-            visible = false;
-            return;
-        }
-
-        const lastSeen = Temporal.Instant.fromEpochSeconds(parseInt(localStorage.getItem(cooldownStorageKey) ?? "-1"));
-        if (Temporal.Instant.compare(Temporal.Now.instant(), lastSeen.add({ seconds: parseInt(closeableCooldown) })) === 1) {
-            console.log(
-                "Alert " +
-                    id +
-                    " has a cooldown of " +
-                    closeableCooldown +
-                    " and was last seen " +
-                    lastSeen.toLocaleString() +
-                    " making it due for a showing"
-            );
-            visible = true;
-        } else {
-            visible = false;
-        }
-    }
-
-    onMount(() => {
-        if (cooldownEnabled) {
-            run_cooldown();
-        }
-
-        if (closeable && closeableCooldown && id.indexOf(noCooldownSetting) !== -1) {
-            // TODO: This prints twice before shutting up as it should, in this example look at the only alert with closeableCooldown in alertsbook.
-            // Looks like svelte mounts three times and that my id is only set on the third. Not sure it does at all after logging the id onMount.
-            console.error("Alert cooldown does not work without specifying a unique id, related id: " + id);
-        }
-    });
-</script>
-
-{#if visible}
-    <div class="rounded-md bg-{colorClassPart}-50 p-4 {$$restProps.class ?? ''}" use:pwKey={_pwKey}>
-        <div class="flex">
-            <div class="flex-shrink-0">
-                <svelte:component this={iconComponent} class="text-{colorClassPart}-400" />
-            </div>
-            <div class="ml-3 text-sm w-full">
-                {#if !rightLinkText}
-                    {#if title}
-                        <h3 class="font-medium text-{colorClassPart}-800">
-                            {title}
-                        </h3>
-                    {/if}
-                    {#if message}
-                        <div class="{title ? 'mt-2' : ''} text-{colorClassPart}-700 justify-start">
-                            <p>
-                                {@html message}
-                            </p>
-                        </div>
-                    {/if}
-                    {#if listItems?.length ?? 0}
-                        <ul class="list-disc space-y-1 pl-5 text-{colorClassPart}-700">
-                            {#each listItems as listItem}
-                                <li>{listItem}</li>
-                            {/each}
-                        </ul>
-                    {/if}
-                {:else}
-                    <div class="flex-1 md:flex md:justify-between">
-                        <div>
-                            {#if title}
-                                <h3 class="font-medium text-{colorClassPart}-800">
-                                    {title}
-                                </h3>
-                            {/if}
-                            {#if message}
-                                <div class="{title ? 'mt-2' : ''} text-{colorClassPart}-700 justify-start">
-                                    <p>
-                                        {@html message}
-                                    </p>
-                                </div>
-                            {/if}
-                            {#if listItems?.length ?? 0}
-                                <ul class="list-disc space-y-1 pl-5 text-{colorClassPart}-700">
-                                    {#each listItems as listItem}
-                                        <li>{listItem}</li>
-                                    {/each}
-                                </ul>
-                            {/if}
-                        </div>
-                        <p class="mt-3 text-sm md:mt-0 md:ml-6 flex items-end">
-                            <a
-                                href={rightLinkHref}
-                                on:click={() => rightLinkClicked()}
-                                class="whitespace-nowrap font-medium text-{colorClassPart}-700 hover:text-{colorClassPart}-600"
-                            >
-                                {rightLinkText}
-                                <span aria-hidden="true"> &rarr;</span>
-                            </a>
-                        </p>
-                    </div>
-                {/if}
-                {#if actions?.length ?? 0}
-                    <div class="ml-2 mt-4">
-                        <div class="-mx-2 -my-1.5 flex gap-1">
-                            {#each actions as action}
-                                {@const color = action?.color ?? colorClassPart}
-                                <button
-                                    type="button"
-                                    on:click={() => actionClicked(action.id)}
-                                    class="rounded-md
-                            bg-{color}-50
-                            px-2 py-1.5 text-sm font-medium
-                            text-{color}-800
-                            hover:bg-{color}-100
-                            focus:outline-none focus:ring-2
-                            focus:ring-{color}-600
-                            focus:ring-offset-2
-                            focus:ring-offset-{color}-50"
-                                >
-                                    {action.text}
-                                </button>
-                            {/each}
-                        </div>
-                    </div>
-                {/if}
-            </div>
-            {#if closeable}
-                <div class="ml-auto pl-3">
-                    <div class="-mx-1.5 -my-1.5">
-                        <button
-                            type="button"
-                            on:click={() => close()}
-                            class="inline-flex rounded-md bg-{colorClassPart}-50 p-1.5 text-{colorClassPart}-500 hover:bg-{colorClassPart}-100 focus:outline-none focus:ring-2 focus:ring-{colorClassPart}-600 focus:ring-offset-2 focus:ring-offset-{colorClassPart}-50"
-                        >
-                            <span class="sr-only">Dismiss</span>
-                            <XMarkIcon />
-                        </button>
-                    </div>
-                </div>
-            {/if}
-        </div>
-    </div>
-{/if}
diff --git a/apps/kit/src/lib/components/button.svelte b/apps/kit/src/lib/components/button.svelte
deleted file mode 100644
index cbc09e2..0000000
--- a/apps/kit/src/lib/components/button.svelte
+++ /dev/null
@@ -1,103 +0,0 @@
-<script context="module" lang="ts">
-    export type ButtonKind = "primary" | "secondary" | "white";
-    export type ButtonSize = "sm" | "lg" | "md" | "xl";
-</script>
-
-<script lang="ts">
-    import pwKey from "$actions/pwKey";
-
-    import { SpinnerIcon } from "./icons";
-
-    export let kind = "primary" as ButtonKind;
-    export let size = "md" as ButtonSize;
-    export let type: "button" | "submit" | "reset" = "button";
-    export let id: string | undefined = undefined;
-    export let tabindex: string | undefined = undefined;
-    export let style: string | undefined = undefined;
-    export let title: string | undefined = undefined;
-    export let disabled: boolean | null = false;
-    export let href: string | undefined = undefined;
-    export let text: string;
-    export let loading = false;
-    export let fullWidth = false;
-    export let _pwKey: string | undefined = undefined;
-
-    let sizeClasses = "";
-    let kindClasses = "";
-    let spinnerTextClasses = "";
-    let spinnerMarginClasses = "";
-
-    $: shared_props = {
-        type: type,
-        id: id || null,
-        title: title || null,
-        disabled: disabled || loading || null,
-        tabindex: tabindex || null,
-        style: style || null,
-    } as any;
-
-    $: switch (size) {
-        case "sm":
-            sizeClasses = "px-2.5 py-1.5 text-xs";
-            spinnerMarginClasses = "mr-2";
-            break;
-        case "md":
-            sizeClasses = "px-3 py-2 text-sm";
-            spinnerMarginClasses = "mr-2";
-            break;
-        case "lg":
-            sizeClasses = "px-3 py-2 text-lg";
-            spinnerMarginClasses = "mr-2";
-            break;
-        case "xl":
-            sizeClasses = "px-6 py-3 text-xl";
-            spinnerMarginClasses = "mr-2";
-            break;
-    }
-
-    $: switch (kind) {
-        case "secondary":
-            kindClasses = "border-transparent text-teal-800 bg-teal-100 hover:bg-teal-200 focus:ring-teal-500";
-            spinnerTextClasses = "teal-800";
-            break;
-        case "primary":
-            kindClasses = "border-transparent text-teal-900 bg-teal-300 hover:bg-teal-400 focus:ring-teal-500";
-            spinnerTextClasses = "text-teal-900";
-            break;
-        case "white":
-            kindClasses = "border-gray-300 text-gray-700 bg-white hover:bg-gray-50 focus:ring-gray-400";
-            spinnerTextClasses = "text-gray-700";
-            break;
-    }
-</script>
-
-{#if href}
-    <a
-        use:pwKey={_pwKey}
-        {...shared_props}
-        {href}
-        class="{sizeClasses} {kindClasses} {loading ? 'disabled:' : ''} {$$restProps.class ?? ''} {fullWidth
-            ? 'w-full justify-center'
-            : ''} inline-flex items-center border font-medium rounded shadow-sm focus:outline-none focus:ring-2"
-    >
-        {#if loading}
-            <SpinnerIcon class={spinnerTextClasses + " " + spinnerMarginClasses} />
-        {/if}
-        {text}
-    </a>
-{:else}
-    <button
-        use:pwKey={_pwKey}
-        {...shared_props}
-        on:click
-        class="{sizeClasses} {kindClasses} {$$restProps.class ?? ''}
-        {fullWidth
-            ? 'w-full justify-center'
-            : ''} inline-flex items-center border font-medium rounded shadow-sm focus:outline-none focus:ring-2"
-    >
-        {#if loading}
-            <SpinnerIcon class={spinnerTextClasses + " " + spinnerMarginClasses} />
-        {/if}
-        {text}
-    </button>
-{/if}
diff --git a/apps/kit/src/lib/components/checkbox.svelte b/apps/kit/src/lib/components/checkbox.svelte
deleted file mode 100644
index b2fcddb..0000000
--- a/apps/kit/src/lib/components/checkbox.svelte
+++ /dev/null
@@ -1,24 +0,0 @@
-<script lang="ts">
-    import pwKey from "$actions/pwKey";
-    import { random_string } from "$lib/helpers";
-
-    export let label: string;
-    export let id: string | undefined = "input__" + random_string(4);
-    export let name: string | undefined = undefined;
-    export let disabled: boolean | null = null;
-    export let checked: boolean;
-    export let _pwKey: string | undefined = undefined;
-</script>
-
-<div class="flex items-center">
-    <input
-        {name}
-        use:pwKey={_pwKey}
-        {disabled}
-        {id}
-        type="checkbox"
-        bind:checked
-        class="h-4 w-4 text-teal-600 focus:ring-teal-500 border-gray-300 rounded"
-    />
-    <label for={id} class="ml-2 block text-sm text-gray-900">{label}</label>
-</div>
diff --git a/apps/kit/src/lib/components/icons/adjustments.svelte b/apps/kit/src/lib/components/icons/adjustments.svelte
deleted file mode 100644
index 83bda27..0000000
--- a/apps/kit/src/lib/components/icons/adjustments.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<svg
-      xmlns="http://www.w3.org/2000/svg"
-      class="h-6 w-6 {$$restProps.class ?? ''}"
-      fill="none"
-      viewBox="0 0 24 24"
-      stroke="currentColor"
-      stroke-width="2"
->
-      <path
-            stroke-linecap="round"
-            stroke-linejoin="round"
-            d="M12 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4"
-      />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/bars-3-center-left.svelte b/apps/kit/src/lib/components/icons/bars-3-center-left.svelte
deleted file mode 100644
index 785ece3..0000000
--- a/apps/kit/src/lib/components/icons/bars-3-center-left.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<svg
-    class="h-6 w-6 {$$restProps.class ?? ''}"
-    xmlns="http://www.w3.org/2000/svg"
-    fill="none"
-    viewBox="0 0 24 24"
-    stroke-width="1.5"
-    stroke="currentColor"
-    aria-hidden="true"
->
-    <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        d="M3.75 6.75h16.5M3.75 12H12m-8.25 5.25h16.5"
-    />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/calendar.svelte b/apps/kit/src/lib/components/icons/calendar.svelte
deleted file mode 100644
index e0053ee..0000000
--- a/apps/kit/src/lib/components/icons/calendar.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<svg
-    xmlns="http://www.w3.org/2000/svg"
-    fill="none"
-    viewBox="0 0 24 24"
-    stroke-width="1.5"
-    stroke="currentColor"
-    class="w-6 h-6 {$$restProps.class ?? ''}"
->
-    <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        d="M6.75 3v2.25M17.25 3v2.25M3 18.75V7.5a2.25 2.25 0 012.25-2.25h13.5A2.25 2.25 0 0121 7.5v11.25m-18 0A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75m-18 0v-7.5A2.25 2.25 0 015.25 9h13.5A2.25 2.25 0 0121 11.25v7.5m-9-6h.008v.008H12v-.008zM12 15h.008v.008H12V15zm0 2.25h.008v.008H12v-.008zM9.75 15h.008v.008H9.75V15zm0 2.25h.008v.008H9.75v-.008zM7.5 15h.008v.008H7.5V15zm0 2.25h.008v.008H7.5v-.008zm6.75-4.5h.008v.008h-.008v-.008zm0 2.25h.008v.008h-.008V15zm0 2.25h.008v.008h-.008v-.008zm2.25-4.5h.008v.008H16.5v-.008zm0 2.25h.008v.008H16.5V15z"
-    />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/check-circle.svelte b/apps/kit/src/lib/components/icons/check-circle.svelte
deleted file mode 100644
index e30778e..0000000
--- a/apps/kit/src/lib/components/icons/check-circle.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<svg
-    class="h-5 w-5 {$$restProps.class ?? ''}"
-    xmlns="http://www.w3.org/2000/svg"
-    viewBox="0 0 20 20"
-    fill="currentColor"
-    aria-hidden="true"
->
-    <path
-        fill-rule="evenodd"
-        d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z"
-        clip-rule="evenodd"
-    />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/chevron-up-down.svelte b/apps/kit/src/lib/components/icons/chevron-up-down.svelte
deleted file mode 100644
index c07aed5..0000000
--- a/apps/kit/src/lib/components/icons/chevron-up-down.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<svg
-    class="h-5 w-5 {$$restProps.class ?? ''}"
-    xmlns="http://www.w3.org/2000/svg"
-    viewBox="0 0 20 20"
-    fill="currentColor"
-    aria-hidden="true"
->
-    <path
-        fill-rule="evenodd"
-        d="M10 3a.75.75 0 01.55.24l3.25 3.5a.75.75 0 11-1.1 1.02L10 4.852 7.3 7.76a.75.75 0 01-1.1-1.02l3.25-3.5A.75.75 0 0110 3zm-3.76 9.2a.75.75 0 011.06.04l2.7 2.908 2.7-2.908a.75.75 0 111.1 1.02l-3.25 3.5a.75.75 0 01-1.1 0l-3.25-3.5a.75.75 0 01.04-1.06z"
-        clip-rule="evenodd"
-    />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/database.svelte b/apps/kit/src/lib/components/icons/database.svelte
deleted file mode 100644
index 6ffdadb..0000000
--- a/apps/kit/src/lib/components/icons/database.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<svg
-    xmlns="http://www.w3.org/2000/svg"
-    class="h-6 w-6 {$$restProps.class ?? ''}"
-    fill="none"
-    viewBox="0 0 24 24"
-    stroke="currentColor"
-    stroke-width="2"
->
-    <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        d="M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4m0 5c0 2.21-3.582 4-8 4s-8-1.79-8-4"
-    />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/exclamation-circle.svelte b/apps/kit/src/lib/components/icons/exclamation-circle.svelte
deleted file mode 100644
index 2ce79b1..0000000
--- a/apps/kit/src/lib/components/icons/exclamation-circle.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<svg
-    class="h-5 w-5 {$$restProps.class ?? ''}"
-    xmlns="http://www.w3.org/2000/svg"
-    viewBox="0 0 20 20"
-    fill="currentColor"
-    aria-hidden="true"
->
-    <path
-        fill-rule="evenodd"
-        d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z"
-        clip-rule="evenodd"
-    />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/exclamation-triangle.svelte b/apps/kit/src/lib/components/icons/exclamation-triangle.svelte
deleted file mode 100644
index 8d807db..0000000
--- a/apps/kit/src/lib/components/icons/exclamation-triangle.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<svg
-    class="h-5 w-5 {$$restProps.class ?? ''}"
-    xmlns="http://www.w3.org/2000/svg"
-    viewBox="0 0 20 20"
-    fill="currentColor"
-    aria-hidden="true"
->
-    <path
-        fill-rule="evenodd"
-        d="M8.485 3.495c.673-1.167 2.357-1.167 3.03 0l6.28 10.875c.673 1.167-.17 2.625-1.516 2.625H3.72c-1.347 0-2.189-1.458-1.515-2.625L8.485 3.495zM10 6a.75.75 0 01.75.75v3.5a.75.75 0 01-1.5 0v-3.5A.75.75 0 0110 6zm0 9a1 1 0 100-2 1 1 0 000 2z"
-        clip-rule="evenodd"
-    />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/folder-open.svelte b/apps/kit/src/lib/components/icons/folder-open.svelte
deleted file mode 100644
index 409c8e2..0000000
--- a/apps/kit/src/lib/components/icons/folder-open.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<svg
-    xmlns="http://www.w3.org/2000/svg"
-    fill="none"
-    viewBox="0 0 24 24"
-    stroke-width="1.5"
-    stroke="currentColor"
-    class="w-6 h-6 {$$restProps.class ?? ''}"
->
-    <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        d="M3.75 9.776c.112-.017.227-.026.344-.026h15.812c.117 0 .232.009.344.026m-16.5 0a2.25 2.25 0 00-1.883 2.542l.857 6a2.25 2.25 0 002.227 1.932H19.05a2.25 2.25 0 002.227-1.932l.857-6a2.25 2.25 0 00-1.883-2.542m-16.5 0V6A2.25 2.25 0 016 3.75h3.879a1.5 1.5 0 011.06.44l2.122 2.12a1.5 1.5 0 001.06.44H18A2.25 2.25 0 0120.25 9v.776"
-    />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/home.svelte b/apps/kit/src/lib/components/icons/home.svelte
deleted file mode 100644
index ee8305d..0000000
--- a/apps/kit/src/lib/components/icons/home.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<svg
-      xmlns="http://www.w3.org/2000/svg"
-      class="h-6 w-6 {$$restProps.class ?? ''}"
-      fill="none"
-      viewBox="0 0 24 24"
-      stroke="currentColor"
-      stroke-width="2"
->
-      <path
-            stroke-linecap="round"
-            stroke-linejoin="round"
-            d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6"
-      />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/index.ts b/apps/kit/src/lib/components/icons/index.ts
deleted file mode 100644
index 8c24873..0000000
--- a/apps/kit/src/lib/components/icons/index.ts
+++ /dev/null
@@ -1,41 +0,0 @@
-import XIcon from "./x.svelte";
-import MenuIcon from "./menu.svelte";
-import AdjustmentsIcon from "./adjustments.svelte";
-import DatabaseIcon from "./database.svelte";
-import HomeIcon from "./home.svelte";
-import InformationCircleIcon from "./information-circle.svelte";
-import ExclamationTriangleIcon from "./exclamation-triangle.svelte";
-import XCircleIcon from "./x-circle.svelte";
-import CheckCircleIcon from "./check-circle.svelte";
-import XMarkIcon from "./x-mark.svelte";
-import SpinnerIcon from "./spinner.svelte";
-import ExclamationCircleIcon from "./exclamation-circle.svelte";
-import ChevronUpDownIcon from "./chevron-up-down.svelte";
-import MagnifyingGlassIcon from "./magnifying-glass.svelte";
-import Bars3CenterLeftIcon from "./bars-3-center-left.svelte";
-import CalendarIcon from "./calendar.svelte";
-import FolderOpenIcon from "./folder-open.svelte";
-import MegaphoneIcon from "./megaphone.svelte";
-import QueueListIcon from "./queue-list.svelte";
-
-export {
-    QueueListIcon,
-    FolderOpenIcon,
-    MegaphoneIcon,
-    CalendarIcon,
-    Bars3CenterLeftIcon,
-    MagnifyingGlassIcon,
-    ChevronUpDownIcon,
-    XIcon,
-    MenuIcon,
-    HomeIcon,
-    DatabaseIcon,
-    AdjustmentsIcon,
-    InformationCircleIcon,
-    ExclamationTriangleIcon,
-    ExclamationCircleIcon,
-    XCircleIcon,
-    CheckCircleIcon,
-    XMarkIcon,
-    SpinnerIcon
-}
\ No newline at end of file
diff --git a/apps/kit/src/lib/components/icons/information-circle.svelte b/apps/kit/src/lib/components/icons/information-circle.svelte
deleted file mode 100644
index 68dbc60..0000000
--- a/apps/kit/src/lib/components/icons/information-circle.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<svg
-    class="h-5 w-5 {$$restProps.class ?? ''}"
-    xmlns="http://www.w3.org/2000/svg"
-    viewBox="0 0 20 20"
-    fill="currentColor"
-    aria-hidden="true"
->
-    <path
-        fill-rule="evenodd"
-        d="M19 10.5a8.5 8.5 0 11-17 0 8.5 8.5 0 0117 0zM8.25 9.75A.75.75 0 019 9h.253a1.75 1.75 0 011.709 2.13l-.46 2.066a.25.25 0 00.245.304H11a.75.75 0 010 1.5h-.253a1.75 1.75 0 01-1.709-2.13l.46-2.066a.25.25 0 00-.245-.304H9a.75.75 0 01-.75-.75zM10 7a1 1 0 100-2 1 1 0 000 2z"
-        clip-rule="evenodd"
-    />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/magnifying-glass.svelte b/apps/kit/src/lib/components/icons/magnifying-glass.svelte
deleted file mode 100644
index f8fdb6e..0000000
--- a/apps/kit/src/lib/components/icons/magnifying-glass.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<svg
-    class="h-5 w-5 {$$restProps.class ?? ''}"
-    xmlns="http://www.w3.org/2000/svg"
-    viewBox="0 0 20 20"
-    fill="currentColor"
-    aria-hidden="true"
->
-    <path
-        fill-rule="evenodd"
-        d="M9 3.5a5.5 5.5 0 100 11 5.5 5.5 0 000-11zM2 9a7 7 0 1112.452 4.391l3.328 3.329a.75.75 0 11-1.06 1.06l-3.329-3.328A7 7 0 012 9z"
-        clip-rule="evenodd"
-    />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/megaphone.svelte b/apps/kit/src/lib/components/icons/megaphone.svelte
deleted file mode 100644
index 7ada5f3..0000000
--- a/apps/kit/src/lib/components/icons/megaphone.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<svg
-    xmlns="http://www.w3.org/2000/svg"
-    fill="none"
-    viewBox="0 0 24 24"
-    stroke-width="1.5"
-    stroke="currentColor"
-    class="w-6 h-6 {$$restProps.class ?? ''}"
->
-    <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        d="M10.34 15.84c-.688-.06-1.386-.09-2.09-.09H7.5a4.5 4.5 0 110-9h.75c.704 0 1.402-.03 2.09-.09m0 9.18c.253.962.584 1.892.985 2.783.247.55.06 1.21-.463 1.511l-.657.38c-.551.318-1.26.117-1.527-.461a20.845 20.845 0 01-1.44-4.282m3.102.069a18.03 18.03 0 01-.59-4.59c0-1.586.205-3.124.59-4.59m0 9.18a23.848 23.848 0 018.835 2.535M10.34 6.66a23.847 23.847 0 008.835-2.535m0 0A23.74 23.74 0 0018.795 3m.38 1.125a23.91 23.91 0 011.014 5.395m-1.014 8.855c-.118.38-.245.754-.38 1.125m.38-1.125a23.91 23.91 0 001.014-5.395m0-3.46c.495.413.811 1.035.811 1.73 0 .695-.316 1.317-.811 1.73m0-3.46a24.347 24.347 0 010 3.46"
-    />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/menu.svelte b/apps/kit/src/lib/components/icons/menu.svelte
deleted file mode 100644
index 471d85f..0000000
--- a/apps/kit/src/lib/components/icons/menu.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<svg
-    xmlns="http://www.w3.org/2000/svg"
-    class="h-6 w-6 {$$restProps.class ?? ''}"
-    fill="none"
-    viewBox="0 0 24 24"
-    stroke="currentColor"
-    stroke-width="2"
->
-    <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        d="M4 6h16M4 12h16M4 18h16"
-    />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/queue-list.svelte b/apps/kit/src/lib/components/icons/queue-list.svelte
deleted file mode 100644
index 6148394..0000000
--- a/apps/kit/src/lib/components/icons/queue-list.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<svg
-    xmlns="http://www.w3.org/2000/svg"
-    fill="none"
-    viewBox="0 0 24 24"
-    stroke-width="1.5"
-    stroke="currentColor"
-    class="w-6 h-6 {$$restProps.class ?? ''}"
->
-    <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        d="M3.75 12h16.5m-16.5 3.75h16.5M3.75 19.5h16.5M5.625 4.5h12.75a1.875 1.875 0 010 3.75H5.625a1.875 1.875 0 010-3.75z"
-    />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/spinner.svelte b/apps/kit/src/lib/components/icons/spinner.svelte
deleted file mode 100644
index 80cc57c..0000000
--- a/apps/kit/src/lib/components/icons/spinner.svelte
+++ /dev/null
@@ -1,20 +0,0 @@
-<svg
-    class="-ml-1 mr-3 h-5 w-5 animate-spin {$$restProps.class ?? ''}"
-    xmlns="http://www.w3.org/2000/svg"
-    fill="none"
-    viewBox="0 0 24 24"
->
-    <circle
-        class="opacity-25"
-        cx="12"
-        cy="12"
-        r="10"
-        stroke="currentColor"
-        stroke-width="4"
-    />
-    <path
-        class="opacity-75"
-        fill="currentColor"
-        d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
-    />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/x-circle.svelte b/apps/kit/src/lib/components/icons/x-circle.svelte
deleted file mode 100644
index 3793b5a..0000000
--- a/apps/kit/src/lib/components/icons/x-circle.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<svg
-    class="h-5 w-5 {$$restProps.class ?? ''}"
-    xmlns="http://www.w3.org/2000/svg"
-    viewBox="0 0 20 20"
-    fill="currentColor"
-    aria-hidden="true"
->
-    <path
-        fill-rule="evenodd"
-        d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.28 7.22a.75.75 0 00-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 101.06 1.06L10 11.06l1.72 1.72a.75.75 0 101.06-1.06L11.06 10l1.72-1.72a.75.75 0 00-1.06-1.06L10 8.94 8.28 7.22z"
-        clip-rule="evenodd"
-    />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/x-mark.svelte b/apps/kit/src/lib/components/icons/x-mark.svelte
deleted file mode 100644
index fd1c6a1..0000000
--- a/apps/kit/src/lib/components/icons/x-mark.svelte
+++ /dev/null
@@ -1,11 +0,0 @@
-<svg
-    class="h-5 w-5 {$$restProps.class ?? ''}"
-    xmlns="http://www.w3.org/2000/svg"
-    viewBox="0 0 20 20"
-    fill="currentColor"
-    aria-hidden="true"
->
-    <path
-        d="M6.28 5.22a.75.75 0 00-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 101.06 1.06L10 11.06l3.72 3.72a.75.75 0 101.06-1.06L11.06 10l3.72-3.72a.75.75 0 00-1.06-1.06L10 8.94 6.28 5.22z"
-    />
-</svg>
diff --git a/apps/kit/src/lib/components/icons/x.svelte b/apps/kit/src/lib/components/icons/x.svelte
deleted file mode 100644
index 6125ab8..0000000
--- a/apps/kit/src/lib/components/icons/x.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<svg
-  xmlns="http://www.w3.org/2000/svg"
-  class="h-6 w-6 {$$restProps.class ?? ''}"
-  fill="none"
-  viewBox="0 0 24 24"
-  stroke="currentColor"
-  stroke-width="2"
->
-  <path
-    stroke-linecap="round"
-    stroke-linejoin="round"
-    d="M6 18L18 6M6 6l12 12"
-  />
-</svg>
diff --git a/apps/kit/src/lib/components/index.ts b/apps/kit/src/lib/components/index.ts
deleted file mode 100644
index a81e0c3..0000000
--- a/apps/kit/src/lib/components/index.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import Alert from "./alert.svelte";
-import Button from "./button.svelte";
-import Checkbox from "./checkbox.svelte";
-import Input from "./input.svelte";
-import LocaleSwitcher from "./locale-switcher.svelte";
-import Switch from "./switch.svelte";
-
-export {
-    Alert,
-    Button,
-    Checkbox,
-    Input,
-    LocaleSwitcher,
-    Switch
-}
\ No newline at end of file
diff --git a/apps/kit/src/lib/components/input.svelte b/apps/kit/src/lib/components/input.svelte
deleted file mode 100644
index c0ed654..0000000
--- a/apps/kit/src/lib/components/input.svelte
+++ /dev/null
@@ -1,103 +0,0 @@
-<script lang="ts">
-    import pwKey from "$actions/pwKey";
-    import { random_string } from "$lib/helpers";
-    import { ExclamationCircleIcon } from "./icons";
-
-    export let label: string | undefined = undefined;
-    export let type: string = "text";
-    export let autocomplete: string | undefined = undefined;
-    export let required: boolean | undefined = undefined;
-    export let id: string | undefined = "input__" + random_string(4);
-    export let name: string | undefined = undefined;
-    export let placeholder: string | undefined = undefined;
-    export let helpText: string | undefined = undefined;
-    export let errorText: string | undefined = undefined;
-    export let disabled = false;
-    export let hideLabel = false;
-    export let cornerHint: string | undefined = undefined;
-    export let icon: any = undefined;
-    export let addon: string | undefined = undefined;
-    export let value: string | undefined;
-    export let wrapperClass: string | undefined = undefined;
-    export let _pwKey: string | undefined = undefined;
-
-    $: ariaErrorDescribedBy = id + "__" + "error";
-    $: attributes = {
-        "aria-describedby": errorText ? ariaErrorDescribedBy : null,
-        "aria-invalid": errorText ? "true" : null,
-        disabled: disabled || null,
-        autocomplete: autocomplete || null,
-        required: required || null,
-    } as any;
-    $: hasBling = icon || addon || errorText;
-    const defaultColorClass = "border-gray-300 focus:border-teal-500 focus:ring-teal-500";
-    let colorClass = defaultColorClass;
-    $: if (errorText) {
-        colorClass = "placeholder-red-300 focus:border-red-500 focus:outline-none focus:ring-red-500 text-red-900 pr-10 border-red-300";
-    } else {
-        colorClass = defaultColorClass;
-    }
-
-    function typeAction(node: HTMLInputElement) {
-        node.type = type;
-    }
-</script>
-
-<div class={wrapperClass}>
-    {#if label && !cornerHint && !hideLabel}
-        <label for={id} class={hideLabel ? "sr-only" : "block text-sm font-medium text-gray-700"}>
-            {label}
-        </label>
-    {:else if cornerHint && !hideLabel}
-        <div class="flex justify-between">
-            {#if label}
-                <label for={id} class={hideLabel ? "sr-only" : "block text-sm font-medium text-gray-700"}>
-                    {label}
-                </label>
-            {/if}
-            <span class="text-sm text-gray-500">
-                {cornerHint}
-            </span>
-        </div>
-    {/if}
-    <div class="mt-1 {hasBling ? 'relative rounded-md' : ''} {addon ? 'flex' : ''}">
-        {#if icon}
-            <div class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3">
-                <svelte:component this={icon} class={errorText ? "text-red-500" : "text-gray-400"} />
-            </div>
-        {:else if addon}
-            <div class="inline-flex items-center rounded-l-md border border-r-0 border-gray-300 bg-gray-50 px-3 text-gray-500 sm:text-sm">
-                <span class="text-gray-500 sm:text-sm">{addon}</span>
-            </div>
-        {/if}
-        <input
-            use:typeAction
-            use:pwKey={_pwKey}
-            {name}
-            {id}
-            {...attributes}
-            bind:value
-            class="block w-full rounded-md shadow-sm sm:text-sm
-                {colorClass}
-                {disabled ? 'disabled:cursor-not-allowed disabled:border-gray-200 disabled:bg-gray-50 disabled:text-gray-500' : ''}
-                {addon ? 'min-w-0 flex-1 rounded-none rounded-r-md' : ''}
-                {icon ? 'pl-10' : ''}"
-            {placeholder}
-        />
-        {#if errorText}
-            <div class="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-3">
-                <ExclamationCircleIcon class="text-red-500" />
-            </div>
-        {/if}
-    </div>
-    {#if helpText && !errorText}
-        <p class="mt-2 text-sm text-gray-500">
-            {helpText}
-        </p>
-    {/if}
-    {#if errorText}
-        <p class="mt-2 text-sm text-red-600" id={ariaErrorDescribedBy}>
-            {errorText}
-        </p>
-    {/if}
-</div>
diff --git a/apps/kit/src/lib/components/locale-switcher.svelte b/apps/kit/src/lib/components/locale-switcher.svelte
deleted file mode 100644
index f880bfb..0000000
--- a/apps/kit/src/lib/components/locale-switcher.svelte
+++ /dev/null
@@ -1,55 +0,0 @@
-<script lang="ts">
-    import pwKey from "$actions/pwKey";
-    import { browser } from "$app/environment";
-    import { page } from "$app/stores";
-    import { CookieNames } from "$lib/configuration";
-    import { setLocale, locale } from "$lib/i18n/i18n-svelte";
-    import type { Locales } from "$lib/i18n/i18n-types";
-    import { locales } from "$lib/i18n/i18n-util";
-    import { loadLocaleAsync } from "$lib/i18n/i18n-util.async";
-    import Cookies from "js-cookie";
-
-    export let _pwKey: string | undefined = undefined;
-
-    async function switch_locale(newLocale: Locales) {
-        if (!newLocale || $locale === newLocale) return;
-        await loadLocaleAsync(newLocale);
-        setLocale(newLocale);
-        document.querySelector("html")?.setAttribute("lang", newLocale);
-        Cookies.set(CookieNames.locale, newLocale, {
-            sameSite: "strict",
-            domain: location.hostname,
-        });
-        console.log("Switched to: " + newLocale);
-    }
-
-    function on_change(event: Event) {
-        const target = event.target as HTMLSelectElement;
-        switch_locale(target.options[target.selectedIndex].value as Locales);
-    }
-
-    $: if (browser) {
-        switch_locale($page.params.lang as Locales);
-    }
-
-    function get_locale_name(iso: string) {
-        switch (iso) {
-            case "nb": {
-                return "Norsk Bokmål";
-            }
-            case "en": {
-                return "English";
-            }
-        }
-    }
-</script>
-
-<select
-    use:pwKey={_pwKey}
-    on:change={on_change}
-    class="mt-1 mr-1 block border-none py-2 pl-3 pr-10 text-base rounded-md right-0 absolute focus:outline-none focus:ring-teal-500 sm:text-sm"
->
-    {#each locales as aLocale}
-        <option value={aLocale}>{get_locale_name(aLocale)}</option>
-    {/each}
-</select>
diff --git a/apps/kit/src/lib/components/switch.svelte b/apps/kit/src/lib/components/switch.svelte
deleted file mode 100644
index 16da23a..0000000
--- a/apps/kit/src/lib/components/switch.svelte
+++ /dev/null
@@ -1,143 +0,0 @@
-<script context="module" lang="ts">
-    export type SwitchType = "short" | "icon" | "default";
-</script>
-
-<script lang="ts">
-    import pwKey from "$actions/pwKey";
-
-
-    export let enabled = false;
-    export let type: SwitchType = "default";
-    export let srText = "Use setting";
-    export let label: string | undefined = undefined;
-    export let description: string | undefined = undefined;
-    export let rightAlignedLabelDescription = false;
-    export let _pwKey:string|undefined = undefined;
-
-    $: colorClass = enabled
-        ? "bg-teal-600 focus:ring-teal-500"
-        : "bg-gray-200 focus:ring-teal-500";
-    $: translateClass = enabled ? "translate-x-5" : "translate-x-0";
-    $: hasLabelOrDescription = label || description;
-
-    function toggle() {
-        enabled = !enabled;
-    }
-</script>
-
-<div
-    class="{hasLabelOrDescription
-        ? 'flex items-center'
-        : ''} {rightAlignedLabelDescription ? '' : 'justify-between'}"
->
-    {#if hasLabelOrDescription && !rightAlignedLabelDescription}
-        <span class="flex flex-grow flex-col">
-            {#if label}
-                <span class="text-sm font-medium text-gray-900">{label}</span>
-            {/if}
-            {#if description}
-                <span class="text-sm text-gray-500">{description}</span>
-            {/if}
-        </span>
-    {/if}
-    {#if type === "short"}
-        <button
-            type="button"
-            class="group relative inline-flex h-5 w-10 flex-shrink-0 cursor-pointer items-center justify-center rounded-full focus:outline-none focus:ring-2 focus:ring-offset-2"
-            role="switch"
-            aria-checked={enabled}
-            use:pwKey={_pwKey}
-            on:click={toggle}
-        >
-            <span class="sr-only">{srText}</span>
-            <span
-                aria-hidden="true"
-                class="pointer-events-none absolute h-full w-full rounded-md"
-            />
-            <span
-                aria-hidden="true"
-                class="{colorClass} pointer-events-none absolute mx-auto h-4 w-9 rounded-full transition-colors duration-200 ease-in-out"
-            />
-            <span
-                aria-hidden="true"
-                class="{translateClass} pointer-events-none absolute left-0 inline-block h-5 w-5 transform rounded-full border border-gray-200 bg-white shadow ring-0 transition-transform duration-200 ease-in-out"
-            />
-        </button>
-    {:else if type === "icon"}
-        <button
-            type="button"
-            class="{colorClass} relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-offset-2"
-            role="switch"
-            aria-checked={enabled}
-            use:pwKey={_pwKey}
-            on:click={toggle}
-        >
-            <span class="sr-only">{srText}</span>
-            <span
-                class="{translateClass} pointer-events-none relative inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out"
-            >
-                <span
-                    class="{enabled
-                        ? 'opacity-0 ease-out duration-100'
-                        : 'opacity-100 ease-in duration-200'} absolute inset-0 flex h-full w-full items-center justify-center transition-opacity"
-                    aria-hidden="true"
-                >
-                    <svg
-                        class="h-3 w-3 text-gray-400"
-                        fill="none"
-                        viewBox="0 0 12 12"
-                    >
-                        <path
-                            d="M4 8l2-2m0 0l2-2M6 6L4 4m2 2l2 2"
-                            stroke="currentColor"
-                            stroke-width="2"
-                            stroke-linecap="round"
-                            stroke-linejoin="round"
-                        />
-                    </svg>
-                </span>
-                <span
-                    class="{enabled
-                        ? 'opacity-100 ease-in duration-200'
-                        : 'opacity-0 ease-out duration-100'} absolute inset-0 flex h-full w-full items-center justify-center transition-opacity"
-                    aria-hidden="true"
-                >
-                    <svg
-                        class="h-3 w-3 text-indigo-600"
-                        fill="currentColor"
-                        viewBox="0 0 12 12"
-                    >
-                        <path
-                            d="M3.707 5.293a1 1 0 00-1.414 1.414l1.414-1.414zM5 8l-.707.707a1 1 0 001.414 0L5 8zm4.707-3.293a1 1 0 00-1.414-1.414l1.414 1.414zm-7.414 2l2 2 1.414-1.414-2-2-1.414 1.414zm3.414 2l4-4-1.414-1.414-4 4 1.414 1.414z"
-                        />
-                    </svg>
-                </span>
-            </span>
-        </button>
-    {:else if type === "default"}
-        <button
-            type="button"
-            class="{colorClass} relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-offset-2"
-            role="switch"
-            aria-checked={enabled}
-            use:pwKey={_pwKey}
-            on:click={toggle}
-        >
-            <span class="sr-only">{srText}</span>
-            <span
-                aria-hidden="true"
-                class="{translateClass} pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out"
-            />
-        </button>
-    {/if}
-    {#if hasLabelOrDescription && rightAlignedLabelDescription}
-        <span class="ml-3">
-            {#if label}
-                <span class="text-sm font-medium text-gray-900">{label}</span>
-            {/if}
-            {#if description}
-                <span class="text-sm text-gray-500">{description}</span>
-            {/if}
-        </span>
-    {/if}
-</div>
-- 
cgit v1.3