@turnipxenon/pineapple 2.9.0 → 3.0.0-alpha-3

package/.svelte-kit/__package__/components/overrideable_meta/OverridableMeta.svelte

@@ -1,51 +0,0 @@
-<!--
-OverridableMeta is convenient Svelte component allowing each page to override the head meta values
-based on their +page.ts.
-
-For example:
-<code>
-// +page.ts
-
-import type { OverridableMetaProps } from "../..";
-
-export const load = async (): Promise<OverridableMetaProps> => {
-	return {
-		title: "CustomTitle",
-	};
-};
-</code>
--->
-
-<script>import WebThumbnailImage from "../../assets/placeholder/placeholder_circle.png";
-export let rootUrl = "http://localhost:5173";
-export let title = "Welcome to my portfolio";
-export let ogTitle = "Turnip time!";
-export let ogDescription = "Welcome to Turnip's test portfolio";
-export let ogImage = WebThumbnailImage;
-import { page } from "$app/stores";
-const data = {
-  title: "Welcome to my portfolio",
-  ogUrl: "https://www.crouton.net/",
-  ogTitle: "Turnip time!",
-  ogDescription: "Welcome to Turnip's test portfolio",
-  ogImage: WebThumbnailImage
-};
-page.subscribe((p) => {
-  const pageData = p.data;
-  data.title = pageData.title ?? title;
-  data.ogUrl = `${rootUrl}${p.url.pathname}`;
-  data.ogTitle = pageData.ogTitle ?? ogTitle;
-  data.ogDescription = pageData.ogDescription ?? ogDescription;
-  data.ogImage = pageData.ogImage ?? ogImage;
-});
-</script>
-
-<svelte:head>
-	<meta charset="utf-8" />
-	<title>{data.title}</title>
-	<meta name="twitter:card" content="summary" />
-	<meta property="og:url" content={data.ogUrl} />
-	<meta property="og:title" content={data.ogTitle} />
-	<meta property="og:description" content={data.ogDescription} />
-	<meta property="og:image" content={data.ogImage} />
-</svelte:head>

package/.svelte-kit/__package__/components/overrideable_meta/OverridableMeta.svelte.d.ts

@@ -1,20 +0,0 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        rootUrl?: string | undefined;
-        title?: string | undefined;
-        ogTitle?: string | undefined;
-        ogDescription?: string | undefined;
-        ogImage?: any;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-type OverridableMetaProps_ = typeof __propDef.props;
-export { OverridableMetaProps_ as OverridableMetaProps };
-export type OverridableMetaEvents = typeof __propDef.events;
-export type OverridableMetaSlots = typeof __propDef.slots;
-export default class OverridableMeta extends SvelteComponent<OverridableMetaProps_, OverridableMetaEvents, OverridableMetaSlots> {
-}

package/.svelte-kit/__package__/components/overrideable_meta/OverridableMetaProps.d.ts

@@ -1,9 +0,0 @@
-export interface OverridableMetaProps {
-    title?: string;
-    ogUrl?: string;
-    ogTitle?: string;
-    ogDescription?: string;
-    ogImage?: string;
-    datePublished?: string;
-    lastUpdated?: string;
-}

package/.svelte-kit/__package__/components/overrideable_meta/OverridableMetaProps.js

@@ -1 +0,0 @@
-export {};

package/.svelte-kit/__package__/components/overrideable_meta/index.d.ts

@@ -1,2 +0,0 @@
-export { default as OverridableMeta } from "./OverridableMeta.svelte";
-export * from "./OverridableMetaProps";

package/.svelte-kit/__package__/components/overrideable_meta/index.js

@@ -1,3 +0,0 @@
-// noinspection JSUnusedGlobalSymbols
-export { default as OverridableMeta } from "./OverridableMeta.svelte";
-export * from "./OverridableMetaProps";

package/.svelte-kit/__package__/components/pineapple/PineappleBaseLayout.svelte

@@ -1,290 +0,0 @@
-<script>export let showDialogByDefault = false;
-import { AppBar, AppShell, autoModeWatcher, LightSwitch } from "@skeletonlabs/skeleton";
-import RandomizedBackground from "../RandomizedBackground.svelte";
-import { page } from "$app/stores";
-import { enableBackground } from "../../store";
-import AresLogo from "../../assets/characters/ares/ares_logo.webp";
-import FABIcon from "../../assets/bg_tiled/bg_tiled_turnip.png";
-import CloseIcon from "../../assets/icons/close.svg";
-import { dialogManager, enableDialogueOverlay } from "../dialog_manager/DialogManagerStore";
-import Toast from "./toast/Toast.svelte";
-import DialogOverlay from "../dialog_overlay/DialogOverlay.svelte";
-import { fade } from "svelte/transition";
-let pages = [];
-const updateBreadcrumb = (pathname) => {
-  pages = [];
-  let basePath = "";
-  pathname.split("/").forEach((value, index) => {
-    if (index === 0) {
-      basePath = "/";
-      pages.push({
-        path: "/",
-        name: "Home"
-      });
-      return;
-    }
-    if (value === "") {
-      return;
-    }
-    basePath += value + "/";
-    pages.push({
-      path: basePath,
-      name: value
-    });
-  });
-  pages = pages;
-};
-$:
-  updateBreadcrumb($page.url.pathname);
-let enableBackgroundValue = true;
-enableBackground.subscribe((value) => {
-  enableBackgroundValue = value;
-});
-let enableDialogueOverlayValue = true;
-enableDialogueOverlay.subscribe((value) => {
-  enableDialogueOverlayValue = value;
-});
-enableDialogueOverlay.set(showDialogByDefault);
-</script>
-
-<!-- App Shell -->
-<svelte:head>
-	{@html `<script>${autoModeWatcher.toString()} autoModeWatcher();</script>`}
-</svelte:head>
-
-<!--todo: turn off hidden when it's time-->
-<button class="fab" on:click={()=>{
-	dialogManager.toggleDialogOverlay()
-}}>
-	{#if (enableDialogueOverlayValue)}
-		<img class="turnip-icon" src={CloseIcon} alt="interactive floating action button represented as a turnip">
-	{:else }
-		<img class="turnip-icon" src={FABIcon} alt="interactive floating action button represented as a turnip">
-	{/if}
-</button>
-
-<AppShell>
-	<svelte:fragment slot="header">
-		<!-- App Bar -->
-		<AppBar
-			background="app-shell-token"
-			slotDefault="place-content-start"
-			slotTrail="place-content-end">
-			<svelte:fragment slot="lead">
-				<!--TODO: add logo or something for the lead in layout-->
-				<img
-					alt="Ares's head titled towards the left with his tongue out and winking"
-					class="ares-logo"
-					src={AresLogo}
-				/>
-				<span class="mr-2" />
-				<ol class="breadcrumb">
-					{#each pages as crumb, i}
-						{#if i < pages.length - 1}
-							<li class="crumb" in:fade>
-								<a href={crumb.path}>{crumb.name.charAt(0).toUpperCase() + crumb.name.slice(1)}</a>
-								&nbsp;&rsaquo;&nbsp;
-							</li>
-						{:else}
-							<li class="crumb" in:fade>{crumb.name.charAt(0).toUpperCase() + crumb.name.slice(1)}</li>
-						{/if}
-					{/each}
-				</ol>
-			</svelte:fragment>
-			<svelte:fragment slot="trail">
-				<LightSwitch bgLight="bg-surface-400" />
-			</svelte:fragment>
-		</AppBar>
-	</svelte:fragment>
-
-	<RandomizedBackground enable={enableBackgroundValue} />
-
-	<Toast></Toast>
-
-	<DialogOverlay></DialogOverlay>
-
-	<div class="default-page-container">
-		<slot />
-		<div class="footer-space" />
-	</div>
-
-</AppShell>
-
-<style>
-    :root {
-        --dialog-start-pad: clamp(0em, 5vw, 2em);
-        --dialog-box-width: min(calc(50em + 4em), calc(100vw - var(--dialog-start-pad) - var(--theme-border-base)));
-        --dialog-box-height: clamp(15em, 50vw, 18em);
-
-        /** FAB icon margin/position calculation origin:
-						Criteria:
-						- We want at mobile (360px) our margin to be at 1em (16px)
-						- We want at web (1960px) our margin to be at 2em (32px)
-
-						A useful scaling factor might vw. At 360px, 16px would be around 4.44vw (360/16).
-						At 360px: margin is at 16px or 1em.
-						At 1960px: 4.44vw is at 87px but that will be clamped to 32px or 2em.
-						The calculation implies that the natural point that the margin becomes 2em is clamped on
-						wider screens is at 727px.
-				*/
-        --fab-margin: clamp(1em, 4.44vw, 2em);
-    }
-
-    .default-page-container {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        width: 100%;
-        padding: 1lh clamp(8px, 10vw, 2em);
-        flex-direction: column;
-        z-index: 0;
-}
-
-    .ares-logo {
-        -o-object-fit: contain;
-           object-fit: contain;
-        height: 2em;
-        margin-inline-end: 0.5em;
-    }
-
-    /* breadcrumb does not work due to a lot of magic stuff i do
-       the code below is from skeleton's tailwind css:
-       https://github.com/skeletonlabs/skeleton/blob/54f4ecedabf2be6d94a670b56dc8821095ca3fc9/packages/plugin/src/styles/components/breadcrumbs.css
-
-       it likely disappeared due to code gen shenanigans and package magic */
-    .breadcrumb,
-    .breadcrumb-nonresponsive {
-        display: flex;
-        width: 100%;
-        align-items: center;
-        overflow-x: auto;
-        /*@apply flex items-center space-x-4 w-full hide-scrollbar overflow-x-auto;*/
-}
-
-    .crumb {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        margin: 0.1em;
-}
-
-    .crumb-separator {
-        display: flex;
-        color: var(--color-text-50);
-}
-
-    /* === Auto-Responsive === */
-
-    .breadcrumb li {
-        display: none;
-}
-
-    @media (min-width: 768px) {
-
-        .breadcrumb li {
-                display: block;
-        }
-}
-
-    .breadcrumb li:nth-last-child(3),
-    .breadcrumb li:nth-last-child(2),
-    .breadcrumb li:nth-last-child(1) {
-        display: block;
-}
-
-    :is(.dark .fab) {
-        --tw-bg-opacity: 1;
-        background-color: rgb(var(--color-tertiary-500) / var(--tw-bg-opacity));
-        color: rgb(var(--on-tertiary));
-}
-
-    .fab:disabled {
-        cursor: not-allowed;
-        opacity: 0.5;
-}
-
-    .fab:disabled:hover {
-        --tw-brightness: brightness(1);
-        filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
-}
-
-    .fab:disabled:active {
-        --tw-scale-x: 1;
-        --tw-scale-y: 1;
-        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-}
-
-    .fab {
-        font-size: 1rem;
-        line-height: 1.5rem;
-        padding-left: 1.25rem;
-        padding-right: 1.25rem;
-        padding-top: 9px;
-        padding-bottom: 9px;
-        white-space: nowrap;
-        text-align: center;
-        display: inline-flex;
-        align-items: center;
-        justify-content: center;
-        transition-property: all;
-        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-        transition-duration: 150ms;
-        border-radius: var(--theme-rounded-base);
-}
-
-    .fab > :not([hidden]) ~ :not([hidden]) {
-        --tw-space-x-reverse: 0;
-        margin-right: calc(0.5rem * var(--tw-space-x-reverse));
-        margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
-}
-
-    .fab:hover {
-        --tw-brightness: brightness(1.15);
-        filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
-}
-
-    .fab:active {
-        --tw-scale-x: 95%;
-        --tw-scale-y: 95%;
-        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-        --tw-brightness: brightness(.9);
-        filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
-}
-
-    .fab {
-        --tw-bg-opacity: 1;
-        background-color: rgb(var(--color-tertiary-500) / var(--tw-bg-opacity));
-        color: rgb(var(--on-tertiary));
-}
-
-    :is(.dark .fab) {
-        --tw-bg-opacity: 1;
-        background-color: rgb(var(--color-tertiary-500) / var(--tw-bg-opacity));
-        color: rgb(var(--on-tertiary));
-}
-
-    .fab {
-        padding: 0;
-        position: fixed;
-        bottom: var(--fab-margin);
-        width: 4em;
-        border-radius: 50%;
-        z-index: 100;
-    }
-
-    .fab > img {
-        width: 100%;
-    }
-
-    .fab:dir(ltr) {
-        right: var(--fab-margin);
-    }
-
-    .fab:dir(rtl) {
-        left: var(--fab-margin);
-    }
-
-    .turnip-icon {
-        margin: 4px;
-    }
-</style>

package/.svelte-kit/__package__/components/pineapple/PineappleBaseLayout.svelte.d.ts

@@ -1,18 +0,0 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        showDialogByDefault?: boolean | undefined;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
-};
-export type PineappleBaseLayoutProps = typeof __propDef.props;
-export type PineappleBaseLayoutEvents = typeof __propDef.events;
-export type PineappleBaseLayoutSlots = typeof __propDef.slots;
-export default class PineappleBaseLayout extends SvelteComponent<PineappleBaseLayoutProps, PineappleBaseLayoutEvents, PineappleBaseLayoutSlots> {
-}
-export {};

package/.svelte-kit/__package__/components/pineapple/toast/DefaultToastBody.d.ts

@@ -1,8 +0,0 @@
-import DefaultToastBody from "./DefaultToastBody.svelte";
-export interface Props {
-    message: string;
-}
-export interface DefaultToastPair {
-    component: typeof DefaultToastBody;
-    props: Props;
-}

package/.svelte-kit/__package__/components/pineapple/toast/DefaultToastBody.js

@@ -1 +0,0 @@
-import DefaultToastBody from "./DefaultToastBody.svelte";

package/.svelte-kit/__package__/components/pineapple/toast/DefaultToastBody.svelte

@@ -1,48 +0,0 @@
-<script>import CloseIcon from "../../../assets/icons/close.svg";
-export let props;
-export let dismissToastCallback;
-export let shouldEnableButton = false;
-</script>
-
-<div class="body-container">
-	<!-- todo: support markdown? -->
-	<button class="btn"
-	        disabled={!shouldEnableButton}
-	        on:click={dismissToastCallback}>
-		<img class="img-icon" src={CloseIcon} alt="close button">
-	</button>
-	<div class="text-container">
-		<span>{props.message}</span>
-	</div>
-</div>
-
-<style>
-    .body-container {
-        display: flex;
-        gap: 1em;
-    }
-
-    .text-container {
-        margin-top: 0.25lh;
-        margin-right: 1em;
-    }
-
-    .text-container:dir(rtl) {
-        margin-left: 1em;
-    }
-
-    .btn {
-        --tw-bg-opacity: 1;
-        background-color: rgb(var(--color-surface-100) / var(--tw-bg-opacity));
-}
-
-    :is(.dark .btn) {
-        --tw-bg-opacity: 1;
-        background-color: rgb(var(--color-surface-900) / var(--tw-bg-opacity));
-}
-
-    .btn {
-        border-radius: 8px;
-		    padding: 0.5em;
-    }
-</style>

package/.svelte-kit/__package__/components/pineapple/toast/DefaultToastBody.svelte.d.ts

@@ -1,20 +0,0 @@
-import { SvelteComponent } from "svelte";
-import type { Props } from "./DefaultToastBody";
-import type { DismissToastCallback } from "./Toast";
-declare const __propDef: {
-    props: {
-        props: Props;
-        dismissToastCallback: DismissToastCallback | undefined;
-        shouldEnableButton?: boolean | undefined;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type DefaultToastBodyProps = typeof __propDef.props;
-export type DefaultToastBodyEvents = typeof __propDef.events;
-export type DefaultToastBodySlots = typeof __propDef.slots;
-export default class DefaultToastBody extends SvelteComponent<DefaultToastBodyProps, DefaultToastBodyEvents, DefaultToastBodySlots> {
-}
-export {};

package/.svelte-kit/__package__/components/pineapple/toast/Toast.d.ts

@@ -1,27 +0,0 @@
-/// <reference types="svelte" />
-import type { DefaultToastPair } from "./DefaultToastBody";
-import type { TestCustomToastPair } from "./custom-toast/TestCustomToast";
-/**
- * Default toast duration is 5 seconds
- */
-export declare const DefaultToastParamsDuration = 5000;
-export type CustomToastPairs = DefaultToastPair | TestCustomToastPair;
-export type DismissToastCallback = () => void;
-export interface ToastParams {
-    componentAndProps: CustomToastPairs;
-    /**
-     * Time in millisecond. If undefined, defaults to DefaultToastParamsDuration
-     */
-    duration?: number;
-}
-/**
- * todo: do not call directly documentation
- */
-export declare const activeToast: import("svelte/store").Writable<ToastParams | undefined>;
-export declare const toastQueue: ToastParams[];
-/**
- *
- * @param newToast
- */
-export declare const showComponentInToast: (newToast: ToastParams) => void;
-export declare const showTextInToast: (message: string) => void;

package/.svelte-kit/__package__/components/pineapple/toast/Toast.js

@@ -1,37 +0,0 @@
-import { writable } from "svelte/store";
-import DefaultToastBody from "./DefaultToastBody.svelte";
-/**
- * Default toast duration is 5 seconds
- */
-export const DefaultToastParamsDuration = 5000;
-/**
- * todo: do not call directly documentation
- */
-export const activeToast = writable();
-export const toastQueue = [];
-/**
- *
- * @param newToast
- */
-export const showComponentInToast = (newToast) => {
-    // todo: queue component
-    activeToast.update((currentToast) => {
-        if (currentToast !== undefined) {
-            toastQueue.push(newToast);
-            return currentToast;
-        }
-        else {
-            return newToast;
-        }
-    });
-};
-export const showTextInToast = (message) => {
-    showComponentInToast({
-        componentAndProps: {
-            component: DefaultToastBody,
-            props: {
-                message
-            }
-        }
-    });
-};

package/.svelte-kit/__package__/components/pineapple/toast/Toast.svelte

@@ -1,92 +0,0 @@
-<script>import {
-  activeToast,
-  DefaultToastParamsDuration,
-  toastQueue
-} from "./Toast";
-import {} from "svelte";
-import Card from "../../Card.svelte";
-import { spring, tweened } from "svelte/motion";
-let localComponent;
-let localProps;
-const HIDDEN_VALUE = -15;
-const SHOWN_VALUE = 0;
-const progress = tweened(0, { duration: DefaultToastParamsDuration });
-const position = spring(HIDDEN_VALUE);
-position.damping = 0.4;
-let isDismissed = false;
-let shouldEnableButton = false;
-const onToastDisappear = () => {
-  localComponent = void 0;
-  activeToast.update(() => {
-    if (toastQueue.length === 0) {
-      return void 0;
-    }
-    return toastQueue.shift();
-  });
-};
-activeToast.subscribe((params) => {
-  if (!params) {
-    return;
-  }
-  if (params.componentAndProps?.component === localComponent) {
-    return;
-  }
-  localComponent = params.componentAndProps.component;
-  localProps = params.componentAndProps.props;
-  progress.set(0, { duration: 0 }).then(() => {
-    position.set(SHOWN_VALUE).then(() => {
-      shouldEnableButton = true;
-      progress.set(100, { delay: 500, duration: params.duration ?? DefaultToastParamsDuration }).then(() => {
-        shouldEnableButton = false;
-        if (isDismissed) {
-          return;
-        }
-        position.set(HIDDEN_VALUE).then(onToastDisappear);
-      });
-    });
-  });
-});
-const dismissToast = () => {
-  shouldEnableButton = false;
-  isDismissed = true;
-  position.set(HIDDEN_VALUE).then(onToastDisappear);
-};
-</script>
-
-{#if (localComponent !== undefined)}
-	<div class="toast-positioner" style={`bottom: ${$position}lh;`}>
-		<!-- todo: adjust shadow to be more dynamic or transparent -->
-		<Card marginBottom="1lh"
-		      turnOnLightModeBorder={false}
-		      overrideStyle="box-shadow: 3px 3px 3px var(--shadow-color);">
-			<div slot="content">
-				{#if (localProps !== undefined)}
-					<svelte:component this={localComponent}
-					                  props={localProps}
-					                  dismissToastCallback={dismissToast}
-					                  shouldEnableButton={shouldEnableButton} />
-				{:else }
-					<svelte:component this={localComponent} />
-				{/if}
-				<progress id="toast-progress" value={$progress/100}></progress>
-			</div>
-		</Card>
-	</div>
-{/if}
-
-<style>
-    .toast-positioner {
-        position: fixed;
-        /* 12em = this component's margin (4em) + fab margin + width (8em) */
-        max-width: calc(100vw - 12em);
-        z-index: 100;
-    }
-
-    .toast-positioner:dir(ltr) {
-        left: 2em;
-    }
-
-    .toast-positioner:dir(rtl) {
-        right: 2em;
-    }
-</style>

package/.svelte-kit/__package__/components/pineapple/toast/Toast.svelte.d.ts

@@ -1,14 +0,0 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: Record<string, never>;
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type ToastProps = typeof __propDef.props;
-export type ToastEvents = typeof __propDef.events;
-export type ToastSlots = typeof __propDef.slots;
-export default class Toast extends SvelteComponent<ToastProps, ToastEvents, ToastSlots> {
-}
-export {};

package/.svelte-kit/__package__/components/pineapple/toast/custom-toast/TestCustomToast.d.ts

@@ -1,5 +0,0 @@
-import TestCustomToast from "./TestCustomToast.svelte";
-export interface TestCustomToastPair {
-    component: typeof TestCustomToast;
-    props: undefined;
-}

package/.svelte-kit/__package__/components/pineapple/toast/custom-toast/TestCustomToast.js

@@ -1 +0,0 @@
-import TestCustomToast from "./TestCustomToast.svelte";

package/.svelte-kit/__package__/components/pineapple/toast/custom-toast/TestCustomToast.svelte

@@ -1 +0,0 @@
-<h1>Testing bad custom card</h1>