windmill-components 1.46.3 → 1.55.0

package/components/home/ItemsList.svelte

@@ -0,0 +1,265 @@
+<script>import CenteredPage from '../CenteredPage.svelte';
+import { AppService, FlowService, ListableApp, Script, ScriptService } from '../../gen';
+import { superadmin, userStore, workspaceStore } from '../../stores';
+import { Skeleton, ToggleButton, ToggleButtonGroup } from '../common';
+import { canWrite } from '../../utils';
+import ShareModal from '../ShareModal.svelte';
+import { Code2, LayoutDashboard } from 'lucide-svelte';
+export let filter = '';
+import ScriptRow from '../common/table/ScriptRow.svelte';
+import FlowRow from '../common/table/FlowRow.svelte';
+import AppRow from '../common/table/AppRow.svelte';
+import NoItemFound from './NoItemFound.svelte';
+import ListFilters from './ListFilters.svelte';
+import SearchItems from '../SearchItems.svelte';
+import { Icon } from 'svelte-awesome';
+import { faBarsStaggered } from '@fortawesome/free-solid-svg-icons';
+let scripts;
+let flows;
+let apps;
+let filteredItems = [];
+let itemKind = 'all';
+let shareModalScripts;
+let shareModalFlows;
+let loading = true;
+async function loadScripts() {
+    const loadedScripts = await ScriptService.listScripts({
+        workspace: $workspaceStore,
+        perPage: 300
+    });
+    scripts = loadedScripts.map((script) => {
+        return {
+            canWrite: canWrite(script.path, script.extra_perms, $userStore) &&
+                script.workspace_id == $workspaceStore &&
+                !$userStore?.operator,
+            ...script
+        };
+    });
+    loading = false;
+}
+async function loadFlows() {
+    flows = (await FlowService.listFlows({ workspace: $workspaceStore })).map((x) => {
+        return {
+            canWrite: canWrite(x.path, x.extra_perms, $userStore) &&
+                x.workspace_id == $workspaceStore &&
+                !$userStore?.operator,
+            ...x
+        };
+    });
+    loading = false;
+}
+async function loadApps() {
+    apps = (await AppService.listApps({ workspace: $workspaceStore })).map((app) => {
+        return {
+            canWrite: canWrite(app.path, app.extra_perms, $userStore) &&
+                app.workspace_id == $workspaceStore &&
+                !$userStore?.operator,
+            ...app
+        };
+    });
+    loading = false;
+}
+$: owners = Array.from(new Set(filteredItems?.map((x) => x.path.split('/').slice(0, 2).join('/')) ?? [])).sort();
+let combinedItems = undefined;
+$: combinedItems =
+    flows == undefined || scripts == undefined || apps == undefined
+        ? undefined
+        : [
+            ...flows.map((x) => ({
+                ...x,
+                type: 'flow',
+                time: new Date(x.edited_at).getTime()
+            })),
+            ...scripts.map((x) => ({
+                ...x,
+                type: 'script',
+                time: new Date(x.created_at).getTime()
+            })),
+            ...apps.map((x) => ({
+                ...x,
+                type: 'app',
+                time: new Date(x.edited_at).getTime()
+            }))
+        ].sort((a, b) => a.starred != b.starred ? (a.starred ? -1 : 1) : a.time - b.time > 0 ? -1 : 1);
+$: preFilteredItems =
+    ownerFilter != undefined
+        ? combinedItems?.filter((x) => x.path.startsWith(ownerFilter ?? '') && (x.type == itemKind || itemKind == 'all'))
+        : combinedItems?.filter((x) => x.type == itemKind || itemKind == 'all');
+let ownerFilter = undefined;
+$: {
+    if (($userStore || $superadmin) && $workspaceStore) {
+        loadScripts();
+        loadFlows();
+        loadApps();
+    }
+}
+const cmp = new Intl.Collator('en').compare;
+const opts = {
+    sort: (info, haystack, needle) => {
+        let { idx, chars, terms, interLft2, interLft1, 
+        //	interRgt2,
+        //	interRgt1,
+        start, intraIns, interIns } = info;
+        const sortResult = idx
+            .map((v, i) => i)
+            .sort((ia, ib) => 
+        // most contig chars matched
+        chars[ib] - chars[ia] ||
+            // least char intra-fuzz (most contiguous)
+            intraIns[ia] - intraIns[ib] ||
+            // most prefix bounds, boosted by full term matches
+            terms[ib] +
+                interLft2[ib] +
+                0.5 * interLft1[ib] -
+                (terms[ia] + interLft2[ia] + 0.5 * interLft1[ia]) ||
+            // highest density of match (least span)
+            //	span[ia] - span[ib] ||
+            // highest density of match (least term inter-fuzz)
+            interIns[ia] - interIns[ib] ||
+            // earliest start of match
+            start[ia] - start[ib] ||
+            // alphabetic
+            cmp(haystack[idx[ia]], haystack[idx[ib]]) +
+                (preFilteredItems?.[idx[ib]]?.starred ? 100 : 0) -
+                (preFilteredItems?.[idx[ia]]?.starred ? 100 : 0));
+        return sortResult;
+    }
+};
+$: items = filter !== '' ? filteredItems : preFilteredItems;
+function resetScroll() {
+    const element = document.getElementsByTagName('svelte-virtual-list-viewport');
+    const firstElement = element.item(0);
+    if (firstElement) {
+        firstElement.scrollTop = 0;
+    }
+}
+$: items && resetScroll();
+</script>
+
+<SearchItems
+	{filter}
+	items={preFilteredItems}
+	bind:filteredItems
+	f={(x) => (x.summary ? x.summary + ' (' + x.path + ')' : x.path)}
+	{opts}
+/>
+
+<ShareModal
+	bind:this={shareModalScripts}
+	kind="script"
+	on:change={() => {
+		loadScripts()
+	}}
+/>
+
+<ShareModal
+	bind:this={shareModalFlows}
+	kind="flow"
+	on:change={() => {
+		loadFlows()
+	}}
+/>
+
+<CenteredPage>
+	<div class="flex flex-col md:flex-row gap-2 items-center sm:justify-between w-full">
+		<div>
+			<ToggleButtonGroup bind:selected={itemKind}>
+				<ToggleButton light position="left" value="all" size="sm">All</ToggleButton>
+				<ToggleButton light position="center" value="script" size="sm">
+					<div class="flex gap-1 items-center">
+						<Code2 size={16} />
+						Scripts
+					</div>
+				</ToggleButton>
+				<ToggleButton light position="center" value="flow" size="sm">
+					<div class="flex gap-1 items-center">
+						<Icon data={faBarsStaggered} scale={0.8} class="mr-1" />
+						Flows
+					</div>
+				</ToggleButton>
+				<ToggleButton light position="right" value="app" size="sm">
+					<div class="flex gap-1 items-center">
+						<LayoutDashboard size={16} />
+						Apps
+					</div>
+				</ToggleButton>
+			</ToggleButtonGroup>
+		</div>
+
+		<div class="relative text-gray-600 w-full">
+			<!-- svelte-ignore a11y-autofocus -->
+			<input
+				autofocus
+				placeholder="Search Scripts, Flows & Apps"
+				bind:value={filter}
+				class="bg-white !h-10 !px-4 !pr-10 !rounded-lg text-sm focus:outline-none"
+			/>
+			<button type="submit" class="absolute right-0 top-0 mt-3 mr-4">
+				<svg
+					class="h-4 w-4 fill-current"
+					xmlns="http://www.w3.org/2000/svg"
+					xmlns:xlink="http://www.w3.org/1999/xlink"
+					version="1.1"
+					id="Capa_1"
+					x="0px"
+					y="0px"
+					viewBox="0 0 56.966 56.966"
+					style="enable-background:new 0 0 56.966 56.966;"
+					xml:space="preserve"
+					width="512px"
+					height="512px"
+				>
+					<path
+						d="M55.146,51.887L41.588,37.786c3.486-4.144,5.396-9.358,5.396-14.786c0-12.682-10.318-23-23-23s-23,10.318-23,23  s10.318,23,23,23c4.761,0,9.298-1.436,13.177-4.162l13.661,14.208c0.571,0.593,1.339,0.92,2.162,0.92  c0.779,0,1.518-0.297,2.079-0.837C56.255,54.982,56.293,53.08,55.146,51.887z M23.984,6c9.374,0,17,7.626,17,17s-7.626,17-17,17  s-17-7.626-17-17S14.61,6,23.984,6z"
+					/>
+				</svg>
+			</button>
+		</div>
+	</div>
+
+	<ListFilters bind:selectedFilter={ownerFilter} filters={owners} />
+	<div>
+		{#if filteredItems == undefined}
+			<div class="mt-4" />
+			<Skeleton layout={[[2], 1]} />
+			{#each new Array(6) as _}
+				<Skeleton layout={[[4], 0.5]} />
+			{/each}
+		{:else if filteredItems.length === 0}
+			<NoItemFound />
+		{:else}
+			<div class="border rounded-md divide-y divide-gray-200 mb-80">
+				<!-- <VirtualList {items} let:item bind:start bind:end> -->
+				{#each items ?? [] as item, i (item.type + '/' + item.path)}
+					{#if item.type == 'script'}
+						<ScriptRow
+							starred={item.starred ?? false}
+							marked={item.marked}
+							on:change={loadScripts}
+							script={item}
+							shareModal={shareModalScripts}
+						/>
+					{:else if item.type == 'flow'}
+						<FlowRow
+							starred={item.starred ?? false}
+							marked={item.marked}
+							on:change={loadFlows}
+							flow={item}
+							shareModal={shareModalFlows}
+						/>
+					{:else if item.type == 'app'}
+						<AppRow
+							starred={item.starred ?? false}
+							marked={item.marked}
+							on:change={loadApps}
+							app={item}
+						/>
+					{/if}
+				{/each}
+				<!-- </VirtualList> -->
+			</div>
+			<!-- <span class="text-xs">{pluralize(items?.length ?? 0, 'item')}</span>
+			<span class="text-xs">{`(${start} - ${end})`}</span> -->
+		{/if}
+	</div>
+</CenteredPage>

package/components/home/ItemsList.svelte.d.ts

@@ -0,0 +1,16 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        filter?: string | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type ItemsListProps = typeof __propDef.props;
+export type ItemsListEvents = typeof __propDef.events;
+export type ItemsListSlots = typeof __propDef.slots;
+export default class ItemsList extends SvelteComponentTyped<ItemsListProps, ItemsListEvents, ItemsListSlots> {
+}
+export {};

package/components/home/ListFilters.svelte

@@ -0,0 +1,37 @@
+<script>import { classNames } from '../../utils';
+import { flip } from 'svelte/animate';
+import { fade } from 'svelte/transition';
+import { Badge } from '../common';
+import { APP_TO_ICON_COMPONENT } from '../icons';
+export let filters;
+export let selectedFilter = undefined;
+export let resourceType = false;
+</script>
+
+{#if Array.isArray(filters) && filters.length > 0}
+	<div class="gap-2 w-full flex flex-wrap my-4">
+		{#each filters as filter (filter)}
+			<div in:fade={{ duration: 50 }} animate:flip={{ duration: 100 }}>
+				<Badge
+					class={classNames(
+						'cursor-pointer inline-flex items-center gap-1 align-middle',
+						filter === selectedFilter ? 'hover:bg-blue-200' : 'hover:bg-gray-200'
+					)}
+					on:click={() => {
+						selectedFilter = selectedFilter == filter ? undefined : filter
+					}}
+					color={filter === selectedFilter ? 'blue' : 'gray'}
+					baseClass={filter === selectedFilter ? 'border border-blue-500' : 'border'}
+				>
+					<span style="height: 12px" class="-mt-0.5">
+						{#if resourceType}
+							<svelte:component this={APP_TO_ICON_COMPONENT[filter]} height="14px" width="14px" />
+						{/if}
+					</span>
+					{filter}
+					{#if filter === selectedFilter}&cross;{/if}
+				</Badge>
+			</div>
+		{/each}
+	</div>
+{/if}

package/components/home/ListFilters.svelte.d.ts

@@ -0,0 +1,18 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        filters: string[];
+        selectedFilter?: string | undefined;
+        resourceType?: boolean | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type ListFiltersProps = typeof __propDef.props;
+export type ListFiltersEvents = typeof __propDef.events;
+export type ListFiltersSlots = typeof __propDef.slots;
+export default class ListFilters extends SvelteComponentTyped<ListFiltersProps, ListFiltersEvents, ListFiltersSlots> {
+}
+export {};

package/components/home/NoItemFound.svelte

@@ -0,0 +1,6 @@
+<div class="flex justify-center items-center h-48">
+	<div class="text-gray-500 text-center">
+		<div class="text-2xl font-bold">No items found</div>
+		<div class="text-sm">Try changing your search or filters</div>
+	</div>
+</div>

package/components/home/NoItemFound.svelte.d.ts

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

package/components/icons/AirtableIcon.svelte.d.ts

@@ -9,9 +9,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type AirtableIconProps = typeof __propDef.props;
-export declare type AirtableIconEvents = typeof __propDef.events;
-export declare type AirtableIconSlots = typeof __propDef.slots;
+export type AirtableIconProps = typeof __propDef.props;
+export type AirtableIconEvents = typeof __propDef.events;
+export type AirtableIconSlots = typeof __propDef.slots;
 export default class AirtableIcon extends SvelteComponentTyped<AirtableIconProps, AirtableIconEvents, AirtableIconSlots> {
 }
 export {};

package/components/icons/DatadogIcon.svelte

@@ -0,0 +1,48 @@
+<script>export let height = '24px';
+export let width = '24px';
+</script>
+
+<svg
+	version="1.1"
+	id="Layer_1"
+	xmlns="http://www.w3.org/2000/svg"
+	xmlns:xlink="http://www.w3.org/1999/xlink"
+	{width}
+	{height}
+	x="0px"
+	y="0px"
+	viewBox="0 0 500 500"
+	enable-background="new 0 0 500 500"
+	xml:space="preserve"
+>
+	<path
+		id="Bits"
+		fill-rule="evenodd"
+		clip-rule="evenodd"
+		fill="#000000"
+		d="M350.2,268.3l-27.3-18.1l-22.8,38.1l-26.5-7.8
+	l-23.3,35.7l1.2,11.2l126.7-23.4l-7.4-79.4L350.2,268.3z M232,234l20.3-2.8c3.3,1.5,5.6,2,9.5,3.1c6.1,1.6,13.3,3.1,23.8-2.2
+	c2.5-1.2,7.6-5.9,9.6-8.6l83.3-15.2l8.5,103.2l-142.7,25.8L232,234z M386.7,196.8l-8.2,1.6L362.7,34.7L93.5,66l33.2,270l31.5-4.6
+	c-2.5-3.6-6.4-8-13.1-13.5c-9.3-7.7-6-20.9-0.5-29.2c7.2-14,44.6-31.8,42.4-54.2c-0.8-8.1-2-18.7-9.6-26c-0.3,3,0.2,5.9,0.2,5.9
+	s-3.1-4-4.6-9.4c-1.5-2.1-2.7-2.7-4.4-5.5c-1.2,3.2-1,6.9-1,6.9s-2.5-6-2.9-11.1c-1.5,2.3-1.9,6.6-1.9,6.6s-3.3-9.5-2.5-14.6
+	c-1.5-4.4-6-13.2-4.7-33.2c8.2,5.8,26.3,4.4,33.4-6c2.3-3.5,3.9-12.9-1.2-31.4c-3.3-11.9-11.4-29.6-14.6-36.4l-0.4,0.3
+	c1.7,5.4,5.1,16.8,6.4,22.3c4,16.7,5.1,22.5,3.2,30.2c-1.6,6.7-5.4,11.1-15.1,16c-9.7,4.9-22.6-7-23.4-7.7
+	c-9.4-7.5-16.7-19.8-17.5-25.8c-0.8-6.5,3.8-10.5,6.1-15.8c-3.3,1-7,2.6-7,2.6s4.4-4.6,9.9-8.6c2.3-1.5,3.6-2.5,6-4.4
+	c-3.4-0.1-6.2,0-6.2,0s5.7-3.1,11.7-5.4c-4.4-0.2-8.5,0-8.5,0s12.8-5.7,22.9-10c7-2.9,13.8-2,17.6,3.5c5,7.3,10.3,11.2,21.4,13.6
+	c6.9-3,8.9-4.6,17.5-7c7.6-8.4,13.5-9.4,13.5-9.4s-3,2.7-3.7,7c4.3-3.4,9-6.2,9-6.2s-1.8,2.3-3.5,5.8l0.4,0.6c5-3,10.9-5.4,10.9-5.4
+	s-1.7,2.1-3.7,4.9c3.8,0,11.5,0.2,14.4,0.5c17.6,0.4,21.2-18.8,28-21.2c8.4-3,12.2-4.9,26.6,9.3c12.3,12.2,22,33.9,17.2,38.8
+	c-4,4-11.9-1.6-20.7-12.6c-4.6-5.8-8.1-12.7-9.8-21.4c-1.4-7.4-6.8-11.6-6.8-11.6s3.1,7,3.1,13.2c0,3.4,0.4,16,5.8,23
+	c-0.5,1-0.8,5.1-1.4,5.9c-6.3-7.6-19.7-13-21.9-14.6c7.4,6.1,24.5,20.1,31.1,33.6c6.2,12.7,2.5,24.4,5.7,27.4
+	c0.9,0.9,13.3,16.4,15.7,24.2c4.2,13.6,0.2,27.9-5.2,36.8l-15.3,2.4c-2.2-0.6-3.7-0.9-5.7-2.1c1.1-2,3.3-6.8,3.3-7.9l-0.9-1.5
+	c-4.7,6.7-12.7,13.3-19.3,17.1c-8.7,4.9-18.6,4.2-25.1,2.1c-18.4-5.7-35.9-18.2-40.1-21.5c0,0-0.1,2.6,0.7,3.2
+	c4.6,5.3,15.3,14.8,25.6,21.4l-21.9,2.4l10.4,81c-4.6,0.7-5.3,1-10.3,1.7c-4.4-15.7-12.9-26-22.2-32c-8.2-5.3-19.5-6.5-30.3-4.3
+	l-0.7,0.8c7.5-0.8,16.4,0.3,25.5,6.1c8.9,5.7,16.1,20.3,18.8,29.1c3.4,11.3,5.7,23.3-3.4,36.1c-6.5,9.1-25.5,14.1-40.8,3.2
+	c4.1,6.6,9.6,12,17.1,13c11.1,1.5,21.6-0.4,28.8-7.9c6.2-6.4,9.4-19.7,8.6-33.7l9.8-1.4l3.5,25.2l161.6-19.5L386.7,196.8z
+	 M288.4,128.5c-0.5,1-1.2,1.7-0.1,5.1l0.1,0.2l0.2,0.4l0.4,1c1.9,3.9,4,7.6,7.5,9.5c0.9-0.2,1.9-0.3,2.8-0.3
+	c3.3-0.1,5.4,0.4,6.7,1.1c0.1-0.7,0.1-1.6,0.1-3.1c-0.3-5,1-13.5-8.6-17.9c-3.6-1.7-8.7-1.2-10.3,0.9c0.3,0,0.6,0.1,0.8,0.2
+	C290.6,126.6,288.8,127.5,288.4,128.5 M315.2,175c-1.3-0.7-7.1-0.4-11.2,0.1c-7.8,0.9-16.3,3.7-18.2,5.1c-3.4,2.6-1.8,7.2,0.7,9
+	c7,5.2,13.1,8.7,19.6,7.9c4-0.5,7.5-6.8,9.9-12.5C317.6,180.7,317.6,176.4,315.2,175 M245.8,134.7c2.2-2.1-11-4.9-21.3,2.1
+	c-7.6,5.2-7.8,16.3-0.6,22.6c0.7,0.6,1.3,1.1,1.9,1.4c2.1-1,4.5-2,7.3-2.9c4.7-1.5,8.6-2.3,11.8-2.7c1.5-1.7,3.3-4.7,2.9-10.2
+	C247.2,137.6,241.6,138.7,245.8,134.7"
+	/>
+</svg>

package/components/icons/DatadogIcon.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        height?: string | undefined;
+        width?: string | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type DatadogIconProps = typeof __propDef.props;
+export type DatadogIconEvents = typeof __propDef.events;
+export type DatadogIconSlots = typeof __propDef.slots;
+export default class DatadogIcon extends SvelteComponentTyped<DatadogIconProps, DatadogIconEvents, DatadogIconSlots> {
+}
+export {};

package/components/icons/DbIcon.svelte.d.ts

@@ -9,9 +9,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type DbIconProps = typeof __propDef.props;
-export declare type DbIconEvents = typeof __propDef.events;
-export declare type DbIconSlots = typeof __propDef.slots;
+export type DbIconProps = typeof __propDef.props;
+export type DbIconEvents = typeof __propDef.events;
+export type DbIconSlots = typeof __propDef.slots;
 export default class DbIcon extends SvelteComponentTyped<DbIconProps, DbIconEvents, DbIconSlots> {
 }
 export {};

package/components/icons/DiscordIcon.svelte.d.ts

@@ -9,9 +9,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type DiscordIconProps = typeof __propDef.props;
-export declare type DiscordIconEvents = typeof __propDef.events;
-export declare type DiscordIconSlots = typeof __propDef.slots;
+export type DiscordIconProps = typeof __propDef.props;
+export type DiscordIconEvents = typeof __propDef.events;
+export type DiscordIconSlots = typeof __propDef.slots;
 export default class DiscordIcon extends SvelteComponentTyped<DiscordIconProps, DiscordIconEvents, DiscordIconSlots> {
 }
 export {};

package/components/icons/FunkwhaleIcon.svelte

@@ -0,0 +1,90 @@
+<script>export let height = '24px';
+export let width = '24px';
+</script>
+
+<svg
+	version="1.1"
+	id="Calque_1"
+	x="0px"
+	y="0px"
+	viewBox="0 0 252.65424 228.43591"
+	xml:space="preserve"
+	{width}
+	{height}
+	><metadata id="metadata25"
+		><rdf:RDF
+			><cc:Work rdf:about=""
+				><dc:format>image/svg+xml</dc:format><dc:type
+					rdf:resource="http://purl.org/dc/dcmitype/StillImage"
+				/><dc:title /></cc:Work
+			></rdf:RDF
+		></metadata
+	><defs id="defs23" /><sodipodi:namedview
+		pagecolor="#ffffff"
+		bordercolor="#666666"
+		borderopacity="1"
+		objecttolerance="10"
+		gridtolerance="10"
+		guidetolerance="10"
+		inkscape:pageopacity="0"
+		inkscape:pageshadow="2"
+		inkscape:window-width="1920"
+		inkscape:window-height="1043"
+		id="namedview21"
+		showgrid="true"
+		inkscape:zoom="1.84375"
+		inkscape:cx="210.72257"
+		inkscape:cy="88.813847"
+		inkscape:window-x="0"
+		inkscape:window-y="0"
+		inkscape:window-maximized="1"
+		inkscape:current-layer="Calque_1"
+		><inkscape:grid
+			type="xygrid"
+			id="grid4535"
+			originx="-1.1305091"
+			originy="-14.869552"
+		/></sodipodi:namedview
+	>
+	<style id="style2">
+		.st0 {
+			fill: #ffffff;
+		}
+		.st1 {
+			fill: #009fe3;
+		}
+		.st2 {
+			fill: #3c3c3b;
+		}</style>
+
+	<g id="g18" transform="matrix(1.3627521,0,0,1.3627521,-48.105149,-68.371499)">
+		<g id="g16">
+			<g id="g12">
+				<path
+					class="st1"
+					d="m 128,157.1 c 17.7,0 32.1,-14.4 32.1,-32.1 0,-0.9 -0.8,-1.7 -1.7,-1.7 h -12.1 c -0.9,0 -1.7,0.8 -1.7,1.7 0,9.1 -7.4,16.6 -16.6,16.6 -9.1,0 -16.6,-7.4 -16.6,-16.6 0,-0.9 -0.8,-1.7 -1.7,-1.7 H 97.6 c -0.9,0 -1.7,0.8 -1.7,1.7 0,17.8 14.4,32.1 32.1,32.1 z"
+					id="path6"
+					style="fill:#000000"
+				/>
+				<path
+					class="st1"
+					d="m 128,187.4 c 34.3,0 62.3,-28 62.3,-62.3 0,-0.9 -0.8,-1.7 -1.7,-1.7 h -12.1 c -0.9,0 -1.7,0.8 -1.7,1.7 0,25.9 -21,46.9 -46.9,46.9 C 102,172 81,151 81,125.1 c 0,-0.9 -0.8,-1.7 -1.7,-1.7 H 67.4 c -0.9,0 -1.7,0.8 -1.7,1.7 -0.2,34.3 27.8,62.3 62.3,62.3 z"
+					id="path8"
+					style="fill:#000000"
+				/>
+				<path
+					class="st1"
+					d="m 219,123.4 h -12.1 c -0.9,0 -1.7,0.8 -1.7,1.7 0,42.6 -34.8,77.3 -77.3,77.3 -42.6,0 -77.3,-34.6 -77.3,-77.3 0,-0.9 -0.8,-1.7 -1.7,-1.7 H 37 c -0.9,0 -1.7,0.8 -1.7,1.7 0,51.1 41.6,92.7 92.7,92.7 51.1,0 92.7,-41.6 92.7,-92.7 0,-0.9 -0.8,-1.7 -1.7,-1.7 z"
+					id="path10"
+					style="fill:#000000"
+				/>
+			</g>
+			<path
+				class="st2"
+				d="m 86.3,83.3 c 6.2,3.2 12.9,3.8 18.9,7.3 3.9,2.3 6.4,4.8 8.8,8.6 3.8,5.7 3.6,12.9 3.6,12.9 l 0.5,7.9 c 0,0 3,7.9 9.7,7.9 7.1,0 9.7,-7.9 9.7,-7.9 l 0.5,-7.9 c 0,0 -0.2,-7.1 3.6,-12.9 2.4,-3.8 4.8,-6.5 8.8,-8.6 6,-3.5 12.7,-4.1 18.9,-7.3 6.2,-3.2 12.2,-7.3 16.3,-13 4.1,-5.7 6,-13.3 3.8,-20 -11.8,-0.6 -25.4,0.8 -35.8,6.4 -14.5,7.7 -23.3,5 -25.9,16.5 h -0.2 c -2.6,-11.6 -11.3,-8.8 -25.9,-16.5 -10.4,-5.6 -24,-7 -35.8,-6.4 -2.3,6.7 -0.3,14.2 3.8,20 4.4,5.8 10.5,9.9 16.7,13 z"
+				id="path14"
+				style="fill:#3c3c3b"
+			/>
+		</g>
+	</g>
+</svg>

package/components/icons/FunkwhaleIcon.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        height?: string | undefined;
+        width?: string | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type FunkwhaleIconProps = typeof __propDef.props;
+export type FunkwhaleIconEvents = typeof __propDef.events;
+export type FunkwhaleIconSlots = typeof __propDef.slots;
+export default class FunkwhaleIcon extends SvelteComponentTyped<FunkwhaleIconProps, FunkwhaleIconEvents, FunkwhaleIconSlots> {
+}
+export {};

package/components/icons/GCloudIcon.svelte.d.ts

@@ -9,9 +9,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type GCloudIconProps = typeof __propDef.props;
-export declare type GCloudIconEvents = typeof __propDef.events;
-export declare type GCloudIconSlots = typeof __propDef.slots;
+export type GCloudIconProps = typeof __propDef.props;
+export type GCloudIconEvents = typeof __propDef.events;
+export type GCloudIconSlots = typeof __propDef.slots;
 export default class GCloudIcon extends SvelteComponentTyped<GCloudIconProps, GCloudIconEvents, GCloudIconSlots> {
 }
 export {};

package/components/icons/GItlabIcon.svelte.d.ts

@@ -9,9 +9,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type GItlabIconProps = typeof __propDef.props;
-export declare type GItlabIconEvents = typeof __propDef.events;
-export declare type GItlabIconSlots = typeof __propDef.slots;
+export type GItlabIconProps = typeof __propDef.props;
+export type GItlabIconEvents = typeof __propDef.events;
+export type GItlabIconSlots = typeof __propDef.slots;
 export default class GItlabIcon extends SvelteComponentTyped<GItlabIconProps, GItlabIconEvents, GItlabIconSlots> {
 }
 export {};

package/components/icons/GSheetsIcon.svelte.d.ts

@@ -9,9 +9,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type GSheetsIconProps = typeof __propDef.props;
-export declare type GSheetsIconEvents = typeof __propDef.events;
-export declare type GSheetsIconSlots = typeof __propDef.slots;
+export type GSheetsIconProps = typeof __propDef.props;
+export type GSheetsIconEvents = typeof __propDef.events;
+export type GSheetsIconSlots = typeof __propDef.slots;
 export default class GSheetsIcon extends SvelteComponentTyped<GSheetsIconProps, GSheetsIconEvents, GSheetsIconSlots> {
 }
 export {};

package/components/icons/GcalIcon.svelte.d.ts

@@ -9,9 +9,9 @@ declare const __propDef: {
     };
     slots: {};
 };
-export declare type GcalIconProps = typeof __propDef.props;
-export declare type GcalIconEvents = typeof __propDef.events;
-export declare type GcalIconSlots = typeof __propDef.slots;
+export type GcalIconProps = typeof __propDef.props;
+export type GcalIconEvents = typeof __propDef.events;
+export type GcalIconSlots = typeof __propDef.slots;
 export default class GcalIcon extends SvelteComponentTyped<GcalIconProps, GcalIconEvents, GcalIconSlots> {
 }
 export {};

package/components/icons/GdocsIcon.svelte

@@ -0,0 +1,9 @@
+<script>export let height = '24px';
+export let width = '24px';
+</script>
+
+<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" {width} {height} viewBox="0 0 50 50">
+	<path
+		d="M 28.90625 1.96875 C 28.863281 1.976563 28.820313 1.988281 28.78125 2 L 11.5 2 C 9.585938 2 8 3.558594 8 5.46875 L 8 43.90625 C 8 46.160156 9.867188 48 12.125 48 L 37.875 48 C 40.132813 48 42 46.160156 42 43.90625 L 42 15.1875 C 42.027344 15.054688 42.027344 14.914063 42 14.78125 L 42 14.5 C 42.007813 14.234375 41.90625 13.972656 41.71875 13.78125 L 30.21875 2.28125 C 30.027344 2.09375 29.765625 1.992188 29.5 2 L 29.1875 2 C 29.097656 1.976563 29 1.964844 28.90625 1.96875 Z M 11.5 4 L 28 4 L 28 12.34375 C 28 14.355469 29.644531 16 31.65625 16 L 40 16 L 40 43.90625 C 40 45.074219 39.054688 46 37.875 46 L 12.125 46 C 10.945313 46 10 45.074219 10 43.90625 L 10 5.46875 C 10 4.644531 10.660156 4 11.5 4 Z M 30 4.9375 L 39.0625 14 L 31.65625 14 C 30.722656 14 30 13.277344 30 12.34375 Z M 17 24 L 17 26 L 33 26 L 33 24 Z M 17 28 L 17 30 L 33 30 L 33 28 Z M 17 32 L 17 34 L 33 34 L 33 32 Z M 17 36 L 17 38 L 26 38 L 26 36 Z"
+	/>
+</svg>