@turnipxenon/pineapple 3.1.0-alpha.5 → 3.1.0-alpha.7

package/dist/components/dialog_manager/DialogManager.d.ts

@@ -16,7 +16,7 @@ export declare class DialogManager implements IDialogManager {
     previousTimestamp: number;
     isDoneTransition: boolean;
     currentPortrait: import("svelte/store").Writable<string>;
-    portraitMap: Map<string, any>;
+    portraitMap: Map<string, string>;
     currentState: DialogState;
     currentReadableState: import("svelte/store").Writable<DialogState>;
     hidePercent: import("svelte/motion").Tweened<number>;
@@ -80,3 +80,4 @@ export declare class DialogManager implements IDialogManager {
     toggleDialogOverlay(): void;
     parseAndSetDialogTree(dialogYarn: string): Promise<DialogDetail[]>;
 }
+export declare const dialogManager: DialogManager;

package/dist/components/dialog_manager/DialogManager.js

@@ -37,13 +37,14 @@ export class DialogManager {
         easing: backOut
     }); // 100 = 100%
     skipNextActiveTime = 0;
-    dialogProcessor = new DialogProcessor();
+    dialogProcessor;
     // for queueing actions
     _setDialogChoiceQueue = [];
     _setDialogChoiceMutex = false;
     onSetDialogListeners = [];
     enableDialogueOverlayCache = false;
     constructor() {
+        this.dialogProcessor = new DialogProcessor(this);
         enableDialogueOverlay.subscribe((value) => {
             // todo: investigate why we cant put setDialogDefault inside the then clause
             // ISSUE #82 https://github.com/TurnipXenon/pineapple/issues/82
@@ -162,7 +163,7 @@ export class DialogManager {
         // set the portrait
         let portraitValue = AresHappy;
         if (this.currentMessageMeta.portraitType) {
-            portraitValue = this.portraitMap.get(this.currentMessageMeta.portraitType);
+            portraitValue = this.portraitMap.get(this.currentMessageMeta.portraitType ?? AresHappy);
         }
         if (portraitValue) {
             this.currentPortrait.update(() => portraitValue);
@@ -212,7 +213,7 @@ export class DialogManager {
         if (!this.isDoneTransition && this.currentIndex > this.fullCurrentMessage.length) {
             const elementList = document.getElementsByClassName("dialog-choice");
             for (const el of elementList) {
-                el.addEventListener("click", (event) => {
+                el.addEventListener("click", () => {
                     // todo: make more robust; for now we're assuming first class is our choice
                     const choice = el.classList[0].split("-")[1];
                     this.setDialogChoice(this.dialogMessageMap.get(choice));
@@ -261,3 +262,4 @@ export class DialogManager {
         });
     }
 }
+export const dialogManager = new DialogManager();

package/dist/components/dialog_manager/DialogProcessor.d.ts

@@ -1,10 +1,12 @@
 import type { DialogDetail } from "../../types/pineapple_fiber/DialogDetail";
-import { LineSelectorNode } from "./behavior_tree/line_core/LineSelectorNode";
+import type { IDialogManager } from "../..";
 /**
  * DialogProcessor processes dialogs
  */
 export declare class DialogProcessor {
-    processingTree: LineSelectorNode;
+    private readonly dialogManager;
+    private processingTree;
+    constructor(dialogManager: IDialogManager);
     /**
      * process the dialog line by line and return a presentable string
      * @param dialogDetail

package/dist/components/dialog_manager/DialogProcessor.js

@@ -17,24 +17,29 @@ import { UnvisitCommand } from "./behavior_tree/line_processors/commands/Unvisit
  * DialogProcessor processes dialogs
  */
 export class DialogProcessor {
-    processingTree = new LineSelectorNode([
-        /*region comment based formats*/
-        new IgnoreJumpNode(), // must be prioritized above line comment node
-        new LineCommentNode(),
-        /*endregion commend based formats*/
-        new EndIfNode(),
-        new ElseIfNode(),
-        new ElseNode(),
-        new IfNode(),
-        new IgnoreGuardNode(),
-        /*region commands*/
-        new SetVariableNode(),
-        new DeclareCommand(),
-        new JumpCommand(),
-        new UnvisitCommand(),
-        /*endregion commands*/
-        new NormalLineProcessorNode()
-    ]);
+    dialogManager;
+    processingTree;
+    constructor(dialogManager) {
+        this.dialogManager = dialogManager;
+        this.processingTree = new LineSelectorNode([
+            /*region comment based formats*/
+            new IgnoreJumpNode(), // must be prioritized above line comment node
+            new LineCommentNode(),
+            /*endregion commend based formats*/
+            new EndIfNode(),
+            new ElseIfNode(),
+            new ElseNode(),
+            new IfNode(),
+            new IgnoreGuardNode(),
+            /*region commands*/
+            new SetVariableNode(),
+            new DeclareCommand(),
+            new JumpCommand(this.dialogManager),
+            new UnvisitCommand(),
+            /*endregion commands*/
+            new NormalLineProcessorNode()
+        ]);
+    }
     /**
      * process the dialog line by line and return a presentable string
      * @param dialogDetail

package/dist/components/dialog_manager/IDialogManager.d.ts

@@ -7,7 +7,6 @@ import type { OnSetDialogChoiceCallback } from "./DialogManager";
 export interface IDialogManager {
     dialogMessageMap: Map<string, DialogDetail>;
     currentDialogTree: DialogDetail[];
-    fullCurrentMessage: string;
     currentMessageMeta: DialogDetail;
     currentMessage: Writable<string>;
     currentIndex: number;

package/dist/components/dialog_manager/behavior_tree/line_processors/commands/JumpCommand.d.ts

@@ -5,7 +5,7 @@ import { SetVariableNode } from "../SetVariableNode";
 import type { IDialogManager } from "../../../IDialogManager";
 export declare class JumpCommand implements LineBehaviorNode {
     setVariableNode: SetVariableNode;
-    dialogManager: undefined | IDialogManager;
-    constructor();
+    dialogManager: IDialogManager;
+    constructor(dialogManager: IDialogManager);
     process(nodeArgs: LineNodeArguments): LineBehaviorResult;
 }

package/dist/components/dialog_manager/behavior_tree/line_processors/commands/JumpCommand.js

@@ -1,16 +1,15 @@
 import { BehaviorStatus } from "../../core/BehaviorStatus";
 import { SetVariableNode } from "../SetVariableNode";
 import { btreeUtils } from "../../core/BTreeUtils";
-import { getDialogManager } from "../../../DialogMangerInit";
 export class JumpCommand {
     setVariableNode = new SetVariableNode();
-    dialogManager = undefined;
-    constructor() {
-        getDialogManager().then(dm => this.dialogManager = dm);
+    dialogManager;
+    constructor(dialogManager) {
+        this.dialogManager = dialogManager;
     }
     process(nodeArgs) {
         if (this.dialogManager === undefined) {
-            console.warn('Dialog Manger not yet initialized');
+            console.warn("Dialog Manger not yet initialized");
             return {
                 renderedLine: "",
                 nextState: nodeArgs.initState,

package/dist/components/dialog_overlay/DialogOverlay.svelte

@@ -2,8 +2,7 @@
 	import AresHappy from "../../assets/characters/ares/ares_happy.webp";
 	import { onMount } from "svelte";
 	import { DialogState } from "../../types/pineapple_fiber/DialogState";
-	import { getDialogManager } from "../dialog_manager/DialogMangerInit";
-	import type { IDialogManager } from "../dialog_manager/IDialogManager";
+	import { dialogManager } from "../dialog_manager/DialogManager";
 	import PinyaCard from "../../ui/elements/PinyaCard/PinyaCard.svelte";
 	import { appState } from "../../ui/templates/index";
 	import CloseIcon from "../../assets/icons/close.svg";
@@ -18,34 +17,31 @@
 
 	let hidePercent = $state(100);
 	let isHidden = $state(true);
-	let dialogManager: IDialogManager | undefined = $state(undefined);
 	onMount(() => {
-		getDialogManager()
-			.then(dm => {
-				dialogManager = dm;
 
-				dialogManager.currentMessage.subscribe((value) => {
-					currentMessage = value;
-				});
+		dialogManager.currentMessage.subscribe((value) => {
+			currentMessage = value;
+		});
 
-				dialogManager.currentPortrait.subscribe((value) => {
-					if (value) {
-						currentPortrait = value;
-					}
-				});
+		dialogManager.currentPortrait.subscribe((value) => {
+			console.log("sub value", value);
+			if (value) {
+				currentPortrait = value;
+			}
+		});
 
-				dialogManager.hidePercent.subscribe((value) => {
-					hidePercent = value * 0.4;
-					isHidden = false;
-				});
+		dialogManager.hidePercent.subscribe((value) => {
+			hidePercent = value * 0.4;
+			isHidden = false;
+		});
 
-				dialogManager.currentReadableState.subscribe((value) => {
-					isHidden = value === DialogState.Invisible;
-				});
+		dialogManager.currentReadableState.subscribe((value) => {
+			isHidden = value === DialogState.Invisible;
+		});
 
-				dialogManager.update(0);
-				isMounted = true;
-			});
+		console.log("CAlling update");
+		dialogManager.update(0);
+		isMounted = true;
 
 	});
 
@@ -84,13 +80,13 @@
 			paddingClass=""
 			className="dialog-name"
 		>
-			<div>
-				<b class="fake-h1">Turnip</b>
-			</div>
+			<div class="fake-h1">Turnip</div>
 		</PinyaCard>
 		<PinyaCard
 			widthClass="w-full"
 			className="dialog-text"
+			colorClass=""
+			flexClass=""
 		>
 			<!-- Made for 140 characters, like the original tweets -->
 			{@html currentMessage}
@@ -103,9 +99,8 @@
 	<div class="fab-container" in:slide>
 		<PinyaButton
 			classes="fab"
-			onclick={()=>{
-	getDialogManager().then(dm => dm.toggleDialogOverlay());
-}}>
+			onclick={()=>{dialogManager.toggleDialogOverlay();}}
+		>
 			{#if (enableDialogueOverlayValue)}
 				<img class="turnip-icon" src={CloseIcon} alt="interactive floating action button represented as a turnip">
 			{:else }
@@ -121,9 +116,9 @@
         padding: 1.2lh 2rem 0.5lh;
     }
 
-    :global(.dialog-box *,.dialog-name *) {
-        font-size: clamp(1em, 5vw, 1.3em);
-        line-height: 1.5em;
+    :global(.dialog-text) {
+        font-size: clamp(1em, 3vw, 1.75em);
+        line-height: 1.5lh;
     }
 
     .dialog-elements {
@@ -143,16 +138,6 @@
         transform: translateY(var(--hidePercentHeight));
     }
 
-
-    .dialog-padding :global(p) {
-        font-size: clamp(1em, 5vw, 1.3em) !important;
-        line-height: 1.5em !important;
-    }
-
-    .dialog-padding {
-        padding: clamp(1.5em, 5vw, 1.75em) clamp(0em, 5vw - 0.5em, 2em) 0;
-    }
-
     :global(.dialog-name) {
         padding-left: 2rem;
         padding-right: 2rem;
@@ -194,9 +179,16 @@
         transform: scaleX(-1);
     }
 
+    :global(html) {
+        --bg-dialog: rgba(255, 247, 225, 0.9);
+    }
+
+    :global(html.dark) {
+        --bg-dialog: rgba(76, 71, 59, 0.9);
+    }
 
     .dialog-box {
-        background-color: var(--color-surface-500);
+        background-color: var(--bg-dialog);
         position: fixed;
         bottom: 0;
         width: var(--dialog-box-width); /*75em + 4em padding*/
@@ -205,12 +197,6 @@
         border-radius: 1rem;
     }
 
-    .dark .dialog-box {
-        background-color: rgb(var(--color-surface-900) / 0.95);
-        --tw-ring-color: rgb(var(--color-text-400));
-        /*background-color: red;*/
-    }
-
     :global(.fab) {
         /*@apply btn preset-filled-tertiary-500;*/
         background-color: var(--color-tertiary-500);
@@ -224,7 +210,7 @@
 
     .fab-container {
         position: fixed;
-		    bottom: 0;
+        bottom: 0;
     }
 
     .fab-container:dir(ltr) {

package/dist/components/pineapple/PineappleBaseLayout.svelte

@@ -20,7 +20,7 @@
 	import Toast from "./toast/Toast.svelte";
 	import DialogOverlay from "../dialog_overlay/DialogOverlay.svelte";
 	import { fade } from "svelte/transition";
-	import { getDialogManager } from "../dialog_manager/DialogMangerInit";
+	import { dialogManager } from "../dialog_manager/DialogManager";
 
 	interface Props {
 		showDialogByDefault?: boolean;
@@ -77,7 +77,7 @@
 
 <!--todo: turn off hidden when it's time-->
 <button class="fab" onclick={()=>{
-	getDialogManager().then(dm => dm.toggleDialogOverlay());
+	dialogManager.toggleDialogOverlay();
 }}>
 	{#if (enableDialogueOverlayValue)}
 		<img class="turnip-icon" src={CloseIcon} alt="interactive floating action button represented as a turnip">

package/dist/index.d.ts

@@ -11,4 +11,4 @@ export * from "./types/pineapple_fiber/DialogDetail";
 export * from "./util/util";
 export * from "./api/index";
 export type { IDialogManager } from "./components/dialog_manager/IDialogManager";
-export { getDialogManager } from "./components/dialog_manager/DialogMangerInit";
+export { dialogManager } from "./components/dialog_manager/DialogManager";

package/dist/index.js

@@ -11,4 +11,4 @@ export * from "./types/pineapple_fiber/PortraitType";
 export * from "./types/pineapple_fiber/DialogDetail";
 export * from "./util/util";
 export * from "./api/index";
-export { getDialogManager } from "./components/dialog_manager/DialogMangerInit";
+export { dialogManager } from "./components/dialog_manager/DialogManager";

package/dist/scripts/pineapple_fiber/PineappleWeaver.js

@@ -44,7 +44,7 @@ const pineappleWeaverRun = () => {
         const template = `// this file was generated by PineappleWeaver.ts
 // do not edit!
 			
-import { type DialogDetail, getDialogManager, PortraitType } from "@turnipxenon/pineapple";
+import { type DialogDetail, dialogManager, PortraitType } from "@turnipxenon/pineapple";
 
 class _${fileName}Yarn {
 	dialogList: DialogDetail[] = [
@@ -53,7 +53,7 @@ ${dialogDetailListToString(dialogDetailList)}
 	
 	/* Remember to call DialogManager.subscribeToSetDialogChoice before calling this in Svelte */
 	setDialogTree = () => {
-		getDialogManager().then((dm) => dm?.setDialogTree(this.dialogList));
+		dialogManager.setDialogTree(this.dialogList);
 	};
 }
 

package/dist/styles/app.css

@@ -22,13 +22,15 @@ html {
     height: calc(var(--dialog-box-height) + 4em);
 }
 
-a.dialog-choice {
+.dialog-box a, .dialog-box b, .dialog-box i {
     font-size: inherit;
+}
+
+a.dialog-choice {
     cursor: url("$pkg/assets/icons/chat-cursor.svg"), auto;
 }
 
 a.external-link {
-    font-size: inherit;
     cursor: url("$pkg/assets/icons/external-link.svg"), auto;
 }
 

package/dist/styles/turnip-theme.css

@@ -250,7 +250,7 @@ blockquote {
     filter: brightness(140%);
 }
 
-h1, h2, h3, h4, h5, h6, .fake-h2, .fake-h3, .fake-h4 {
+h1, h2, h3, h4, h5, h6, .fake-h1, .fake-h2, .fake-h3, .fake-h4 {
     text-align: center;
     margin-top: 0;
     font-weight: bolder;
@@ -265,7 +265,7 @@ h1 + p, h2 + p, h3 + p, h4 + p, h5 + p, h6 + p, .fake-h2 + p, .fake-h3 + p, .fak
     margin-top: 0.5lh;
 }
 
-h1 {
+h1, .fake-h1 {
     @apply text-4xl;
 }
 

package/dist/ui/elements/PinyaCard/PinyaCard.svelte

@@ -8,14 +8,15 @@ let {
 	flexClass = "flex flex-col",
 	widthClass = "w-full max-w-md",
 	borderClass = "border-[2px] border-primary-500 dark:border-0",
+	colorClass = "bg-surface-200 dark:bg-surface-900",
 	marginClass = "",
 	className,
 	includeDataNoSnippet = false,
 	children
 }: PinyaCardProps = $props();
 
-let cardClass = $derived(`card bg-surface-200 dark:bg-surface-900 text-start rounded-xl
-	${paddingClass} ${flexClass} ${className} ${widthClass} ${borderClass} ${marginClass}`);
+let cardClass = $derived(`card text-start rounded-xl
+	${paddingClass} ${flexClass} ${className} ${widthClass} ${borderClass} ${marginClass} ${colorClass}`);
 </script>
 
 {#if includeDataNoSnippet}

package/dist/ui/elements/PinyaCard/PinyaCardProps.d.ts

@@ -6,5 +6,6 @@ export interface PinyaCardProps extends WrapperProps {
     widthClass?: string;
     borderClass?: string;
     marginClass?: string;
+    colorClass?: string;
     includeDataNoSnippet?: boolean;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@turnipxenon/pineapple",
   "description": "personal package for base styling for other personal projects",
-  "version": "3.1.0-alpha.5",
+  "version": "3.1.0-alpha.7",
   "scripts": {
     "dev": "vite dev",
     "build": "vite build && yarn package",

package/src/lib/styles/app.css

@@ -22,13 +22,15 @@ html {
     height: calc(var(--dialog-box-height) + 4em);
 }
 
-a.dialog-choice {
+.dialog-box a, .dialog-box b, .dialog-box i {
     font-size: inherit;
+}
+
+a.dialog-choice {
     cursor: url("$pkg/assets/icons/chat-cursor.svg"), auto;
 }
 
 a.external-link {
-    font-size: inherit;
     cursor: url("$pkg/assets/icons/external-link.svg"), auto;
 }
 

package/dist/components/dialog_manager/DialogMangerInit.d.ts

@@ -1,2 +0,0 @@
-import type { IDialogManager } from "./IDialogManager";
-export declare const getDialogManager: () => Promise<IDialogManager>;

package/dist/components/dialog_manager/DialogMangerInit.js

@@ -1,21 +0,0 @@
-/**
- * strictly must be declared last! or you might receive a weird error that looks like:
- *
- * 2:04:21 AM [vite] Error when evaluating SSR module /src/lib/components/dialog_manager/DialogManagerStore.ts:
- * |- TypeError: Cannot read properties of undefined (reading '0')
- *     at <instance_members_initializer> (/src/lib/components/dialog_manager/DialogManager.ts:38:67)
- *     at new DialogManager (/src/lib/components/dialog_manager/DialogManager.ts:53:14)
- *     at eval (/src/lib/components/dialog_manager/DialogManagerStore.ts:15:23)
- *     at async instantiateModule (file:///C:/Users/Pumpkin/Projects/Web/pineapple/node_modules/vite/dist/node/chunks/dep-934dbc7c.js:54360:9)
- *
- * what this means is that one member of dialogManager cannot be initialized. in our case, it was the
- * defaultDialogMessage not yet being initialized
- */
-let _dialogManager = undefined;
-export const getDialogManager = async () => {
-    if (_dialogManager === undefined) {
-        const dm = await import('./DialogManager');
-        _dialogManager = new dm.DialogManager();
-    }
-    return _dialogManager;
-};

package/dist/components/dialog_manager/index.d.ts

@@ -1 +0,0 @@
-export * from "./DialogMangerInit";

package/dist/components/dialog_manager/index.js

@@ -1 +0,0 @@
-export * from "./DialogMangerInit";