create-pixi-vn 2.0.14 → 2.1.0

package/template-nqtr-react-vite-muijoy-ink/src/components/ui/textarea.tsx

@@ -0,0 +1,18 @@
+import * as React from "react";
+
+import { cn } from "@/lib/utils";
+
+function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
+    return (
+        <textarea
+            data-slot="textarea"
+            className={cn(
+                "flex field-sizing-content min-h-16 w-full rounded-lg border border-input bg-transparent px-2.5 py-2 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
+                className,
+            )}
+            {...props}
+        />
+    );
+}
+
+export { Textarea };

package/template-nqtr-react-vite-muijoy-ink/src/components/ui/toggle.tsx

@@ -0,0 +1,43 @@
+import { Toggle as TogglePrimitive } from "@base-ui/react/toggle";
+import { cva, type VariantProps } from "class-variance-authority";
+
+import { cn } from "@/lib/utils";
+
+const toggleVariants = cva(
+    "group/toggle inline-flex items-center justify-center gap-1 rounded-lg text-sm font-medium whitespace-nowrap transition-all outline-none hover:bg-muted hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 aria-pressed:bg-muted data-[state=on]:bg-muted dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+    {
+        variants: {
+            variant: {
+                default: "bg-transparent",
+                outline: "border border-input bg-transparent hover:bg-muted",
+            },
+            size: {
+                default:
+                    "h-8 min-w-8 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+                sm: "h-7 min-w-7 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
+                lg: "h-9 min-w-9 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+            },
+        },
+        defaultVariants: {
+            variant: "default",
+            size: "default",
+        },
+    },
+);
+
+function Toggle({
+    className,
+    variant = "default",
+    size = "default",
+    ...props
+}: TogglePrimitive.Props & VariantProps<typeof toggleVariants>) {
+    return (
+        <TogglePrimitive
+            data-slot="toggle"
+            className={cn(toggleVariants({ variant, size, className }))}
+            {...props}
+        />
+    );
+}
+
+export { Toggle, toggleVariants };

package/template-nqtr-react-vite-muijoy-ink/src/components/ui/tooltip.tsx

@@ -0,0 +1,54 @@
+"use client";
+
+import { Tooltip as TooltipPrimitive } from "@base-ui/react/tooltip";
+
+import { cn } from "@/lib/utils";
+
+function TooltipProvider({ delay = 0, ...props }: TooltipPrimitive.Provider.Props) {
+    return <TooltipPrimitive.Provider data-slot="tooltip-provider" delay={delay} {...props} />;
+}
+
+function Tooltip({ ...props }: TooltipPrimitive.Root.Props) {
+    return <TooltipPrimitive.Root data-slot="tooltip" {...props} />;
+}
+
+function TooltipTrigger({ ...props }: TooltipPrimitive.Trigger.Props) {
+    return <TooltipPrimitive.Trigger data-slot="tooltip-trigger" {...props} />;
+}
+
+function TooltipContent({
+    className,
+    side = "top",
+    sideOffset = 4,
+    align = "center",
+    alignOffset = 0,
+    children,
+    ...props
+}: TooltipPrimitive.Popup.Props &
+    Pick<TooltipPrimitive.Positioner.Props, "align" | "alignOffset" | "side" | "sideOffset">) {
+    return (
+        <TooltipPrimitive.Portal>
+            <TooltipPrimitive.Positioner
+                align={align}
+                alignOffset={alignOffset}
+                side={side}
+                sideOffset={sideOffset}
+                className="isolate z-50"
+            >
+                <TooltipPrimitive.Popup
+                    data-slot="tooltip-content"
+                    className={cn(
+                        "z-50 inline-flex w-fit max-w-xs origin-(--transform-origin) items-center gap-1.5 rounded-md bg-foreground px-3 py-1.5 text-xs text-background has-data-[slot=kbd]:pr-1.5 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
+                        className,
+                    )}
+                    {...props}
+                >
+                    {children}
+                    <TooltipPrimitive.Arrow className="z-50 size-2.5 translate-y-[calc(-50%-2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground data-[side=bottom]:top-1 data-[side=inline-end]:top-1/2! data-[side=inline-end]:-left-1 data-[side=inline-end]:-translate-y-1/2 data-[side=inline-start]:top-1/2! data-[side=inline-start]:-right-1 data-[side=inline-start]:-translate-y-1/2 data-[side=left]:top-1/2! data-[side=left]:-right-1 data-[side=left]:-translate-y-1/2 data-[side=right]:top-1/2! data-[side=right]:-left-1 data-[side=right]:-translate-y-1/2 data-[side=top]:-bottom-2.5" />
+                </TooltipPrimitive.Popup>
+            </TooltipPrimitive.Positioner>
+        </TooltipPrimitive.Portal>
+    );
+}
+
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };

package/template-nqtr-react-vite-muijoy-ink/src/constants.ts

@@ -0,0 +1,17 @@
+export const CANVAS_UI_LAYER_NAME = "ui";
+export const CANVAS_MINIGAME_LAYER_NAME = "minigame";
+export const HTML_UI_LAYER_NAME = "ui";
+export const HTML_CANVAS_LAYER_NAME = "canvas";
+
+export const AUDIO_BUNDLE_NAME = "audio";
+export const BGM_CHANNEL_NAME = "bgm";
+export const SFX_CHANNEL_NAME = "sfx";
+
+export const SKIP_DELAY = 100;
+
+export const INTERFACE_DATA_USE_QUERY_KEY = "interface_data_use_query_key";
+
+/** Text-shadow that outlines text with black so it remains legible over any image or canvas background. */
+export const overlayTextShadowClass = "[text-shadow:0_0_3px_black,0_0_6px_black]";
+
+export const BACKGROUND_ID = "background";

package/template-nqtr-react-vite-muijoy-ink/src/content/activities.tsx

@@ -0,0 +1,77 @@
+import { ActivityBaseButton } from "@/components/screens/navigation/activity-buttons";
+import Activity from "@/models/nqtr/Activity";
+import { RegisteredActivities, timeTracker } from "@drincs/nqtr";
+import { narration } from "@drincs/pixi-vn";
+import { Bed, Package, ShoppingCart } from "lucide-react";
+
+export const bed = new Activity(
+    "bed",
+    async (_, props) => {
+        await props.navigate({ to: "/game/narration" });
+        if (timeTracker.nowIsBetween(5, 22)) {
+            await narration.jump("nap", props);
+        } else {
+            await narration.jump("sleep", props);
+        }
+    },
+    {
+        name: "bed",
+        icon: (activity, props) => {
+            return (
+                <ActivityBaseButton
+                    disabled={activity.disabled}
+                    onClick={() => activity.run(props)}
+                    ariaLabel={props.uiTransition(activity.name)}
+                >
+                    <Bed className="size-6 sm:size-8 md:size-10 lg:size-12 xl:size-14" />
+                </ActivityBaseButton>
+            );
+        },
+    },
+);
+
+export const orderProduct = new Activity(
+    "order_product",
+    async (_, props) => {
+        await props.navigate({ to: "/game/narration" });
+        await narration.jump("order_product", props);
+    },
+    {
+        name: "order_product",
+        icon: (activity, props) => {
+            return (
+                <ActivityBaseButton
+                    disabled={activity.disabled}
+                    onClick={() => activity.run(props)}
+                    ariaLabel={props.uiTransition(activity.name)}
+                >
+                    <ShoppingCart className="size-6 sm:size-8 md:size-10 lg:size-12 xl:size-14" />
+                </ActivityBaseButton>
+            );
+        },
+    },
+);
+
+export const takeProduct = new Activity(
+    "take_product",
+    async (_, props) => {
+        await props.navigate({ to: "/game/narration" });
+        await narration.jump("take_product", props);
+    },
+    {
+        name: "take_product",
+        icon: (activity, props) => {
+            return (
+                <ActivityBaseButton
+                    disabled={activity.disabled}
+                    onClick={() => activity.run(props)}
+                    ariaLabel={props.uiTransition(activity.name)}
+                >
+                    <Package className="size-6 sm:size-8 md:size-10 lg:size-12 xl:size-14" />
+                </ActivityBaseButton>
+            );
+        },
+    },
+);
+
+RegisteredActivities.add(bed, orderProduct, takeProduct);

package/template-nqtr-react-vite-muijoy-ink/src/content/characters.ts

@@ -0,0 +1,15 @@
+import Character from "@/models/Character";
+import { RegisteredCharacters } from "@drincs/pixi-vn";
+
+export const mc = new Character("mc", {
+    name: "Liam",
+});
+
+export const alice = new Character("alice", {
+    name: "Alice",
+    age: 25,
+    icon: "https://raw.githubusercontent.com/DRincs-Productions/NQTR-System/refs/heads/main/game/images/icon/Alice.webp",
+    color: "#5a129e",
+});
+
+RegisteredCharacters.add([mc, alice]);

package/template-nqtr-react-vite-muijoy-ink/src/content/index.ts

@@ -0,0 +1,4 @@
+// Auto-load every content module for side effects (e.g. narration registrations).
+void import.meta.glob(["./**/*.ts", "./**/*.tsx", "!./index.ts"], {
+    eager: true,
+});

package/template-nqtr-react-vite-muijoy-ink/src/content/ink/hashtag-commands.ts

@@ -0,0 +1,50 @@
+import { nqtrActivityIds, nqtrCommitmentIds, nqtrQuestIds, nqtrRoomIds } from "@/nqtr.keys.gen";
+import { assetAliasIds, bundleIds, characterIdsEnum } from "@/pixi-vn.keys.gen";
+import { createNqtrHandler } from "@drincs/nqtr/ink";
+import { addBaseHashtagCommands, HashtagCommands } from "@drincs/pixi-vn-ink";
+import { RegisteredCharacters } from "@drincs/pixi-vn/characters";
+import zod from "zod";
+
+addBaseHashtagCommands({ bundleIds, assetAliasIds });
+
+createNqtrHandler({
+    activityIds: nqtrActivityIds,
+    commitmentIds: nqtrCommitmentIds,
+    questIds: nqtrQuestIds,
+    roomIds: nqtrRoomIds,
+});
+
+HashtagCommands.add(
+    async (script, { navigate }) => {
+        await navigate({ to: script[1] });
+        return true;
+    },
+    {
+        name: "navigate",
+        description: `Navigates to a specified route within the game.
+
+\`\`\`ink
+# navigate <route>
+\`\`\``,
+        validation: zod.tuple([zod.literal("navigate"), zod.string()]),
+    },
+);
+
+HashtagCommands.add(
+    async (script) => {
+        const character = RegisteredCharacters.get(script[1]);
+        if (character) {
+            character.name = script[2];
+        }
+        return true;
+    },
+    {
+        name: "character rename",
+        description: `Renames a character in the game.
+
+\`\`\`ink
+# rename <characterId> <newName>
+\`\`\``,
+        validation: zod.tuple([zod.literal("rename"), zod.enum(characterIdsEnum), zod.string()]),
+    },
+);

package/template-nqtr-react-vite-muijoy-ink/src/content/ink/text-replaces.ts

@@ -0,0 +1,19 @@
+import { TextReplaces } from "@drincs/pixi-vn-ink";
+import { RegisteredCharacters } from "@drincs/pixi-vn/characters";
+
+TextReplaces.add((key) => RegisteredCharacters.get(key)?.name, {
+    name: "character name",
+    validation: "characterId",
+    type: "after-translation",
+    i18nInterpolation: true,
+    description: "Replaces a character ID with the character's name in the game.",
+});
+
+TextReplaces.add(() => "Stephanie", {
+    name: "steph_fullname",
+    validation: /steph_fullname/,
+    type: "after-translation",
+    i18nInterpolation: true,
+    description:
+        "Replaces the placeholder 'steph_fullname' with the full name of the character Stephanie.",
+});

package/template-nqtr-react-vite-muijoy-ink/src/content/labels/sleep.label.ts

@@ -0,0 +1,60 @@
+import { BACKGROUND_ID } from "@/constants";
+import { mcRoomBackground } from "@/content/rooms";
+import {
+    narration,
+    newChoiceOption,
+    newCloseChoiceOption,
+    newLabel,
+    showImage,
+} from "@drincs/pixi-vn";
+
+newLabel<{
+    hour: number;
+}>("sleep_1_hour", [
+    ({ hour: wakeupHour, ...props }) => {
+        props.sleep(wakeupHour, props);
+        narration.continue(props);
+    },
+]);
+
+newLabel<{
+    hour: number;
+}>("nap_1_hour", [
+    ({ hour, ...props }) => {
+        props.wait(hour);
+        narration.continue(props);
+    },
+]);
+
+export const sleepLabel = newLabel("sleep", [
+    async (props) => {
+        await showImage(BACKGROUND_ID, mcRoomBackground.src);
+        narration.dialogue = "What time do you want to set the alarm?";
+        narration.choices = [
+            newChoiceOption(props.uiTransition("allarm_menu_item", { hour: 8 }), "sleep_1_hour", {
+                hour: 8,
+            }),
+            newChoiceOption(props.uiTransition("allarm_menu_item", { hour: 9 }), "sleep_1_hour", {
+                hour: 9,
+            }),
+            newChoiceOption(props.uiTransition("allarm_menu_item", { hour: 10 }), "sleep_1_hour", {
+                hour: 10,
+            }),
+            newCloseChoiceOption("Cancel"),
+        ];
+    },
+]);
+
+export const napLabel = newLabel("nap", [
+    async (props) => {
+        await showImage(BACKGROUND_ID, mcRoomBackground.src);
+        narration.dialogue = "You are tired and decide to take a nap.";
+        narration.choices = [
+            newChoiceOption(props.uiTransition("nap_menu_item", { hour: 3 }), "nap_1_hour", {
+                hour: 3,
+            }),
+            newChoiceOption(props.uiTransition("sleep"), "sleep", { hour: 3 }),
+            newCloseChoiceOption("Cancel"),
+        ];
+    },
+]);

package/template-nqtr-react-vite-muijoy-ink/src/content/locations.tsx

@@ -0,0 +1,59 @@
+import { mainMap } from "@/content/maps";
+import Location from "@/models/nqtr/Location";
+import { navigator, RegisteredLocations } from "@drincs/nqtr";
+import { Assets, Sprite, type Texture } from "@drincs/pixi-vn/pixi.js";
+
+export const mcHome = new Location("mc_home", mainMap, {
+    name: "MC Home",
+    sprite: async (location, { navigate }) => {
+        const texture = await Assets.load<Texture>("icon_location_home");
+        const icon = new Sprite({
+            texture,
+            x: 300,
+            y: 200,
+            height: 120,
+            width: 120,
+            eventMode: "static",
+            cursor: "pointer",
+        });
+        icon.on("pointerdown", () => {
+            const entrance = location.entrance;
+            if (entrance) {
+                navigator.currentRoom = entrance;
+                navigate({ to: "/game/navigation" });
+            }
+        });
+        return icon;
+    },
+});
+
+export const gym = new Location("gym", mainMap, {
+    name: "Gym",
+    sprite: async (location, { navigate }) => {
+        const texture = await Assets.load<Texture>("icon_location_gym");
+        const icon = new Sprite({
+            texture,
+            x: 500,
+            y: 300,
+            height: 120,
+            width: 120,
+            eventMode: "static",
+            cursor: "pointer",
+        });
+        icon.on("pointerdown", () => {
+            const entrance = location.entrance;
+            if (entrance) {
+                navigator.currentRoom = entrance;
+                navigate({ to: "/game/navigation" });
+            }
+        });
+        return icon;
+    },
+});
+
+export const school = new Location("school", mainMap, {
+    name: "School",
+    sprite: () => new Sprite(),
+});
+
+RegisteredLocations.add(mcHome, gym, school);

package/template-nqtr-react-vite-muijoy-ink/src/content/maps.tsx

@@ -0,0 +1,26 @@
+import MapClass from "@/models/nqtr/Map";
+import TimeSlotsImage from "@/models/TimeSlotsImage";
+import { RegisteredMaps } from "@drincs/nqtr";
+
+export const mainMap = new MapClass("main_map", {
+    name: "Main Map",
+    background: new TimeSlotsImage({
+        morning: "map-0",
+        afternoon: "map-1",
+        evening: "map-2",
+        night: "map-3",
+    }),
+    neighboringMaps: {
+        north: "nightcity_map",
+    },
+});
+
+export const nightcityMap = new MapClass("nightcity_map", {
+    name: "Nightcity",
+    background: "map-nightcity",
+    neighboringMaps: {
+        south: "main_map",
+    },
+});
+
+RegisteredMaps.add(mainMap, nightcityMap);

package/template-nqtr-react-vite-muijoy-ink/src/content/quests/alice.quest.tsx

@@ -0,0 +1,54 @@
+import { mcRoom, terrace } from "@/content/rooms";
+import Quest from "@/models/nqtr/Quest";
+import Stage from "@/models/nqtr/Stage";
+import { RegisteredQuests } from "@drincs/nqtr";
+
+export const aliceQuest = new Quest(
+    "aliceQuest",
+    [
+        // stages
+        new Stage("talk_alice1", {
+            onStart: () => {
+                terrace.addCommitment("alice_quest_talk");
+            },
+            name: "Talk to Alice",
+            description: "Talk to Alice on the terrace",
+        }),
+        new Stage("order_products", {
+            onStart: () => {
+                mcRoom.addActivity("order_product");
+            },
+            name: "Order products",
+            description: "Order the products with your PC",
+        }),
+        new Stage("take_products", {
+            onStart: (_, { toast }) => {
+                terrace.addActivity("take_product");
+                toast("You can take the products on the Terrace");
+            },
+            name: "Take products",
+            description: "Take products on the Terrace",
+            requestDescriptionToStart: "Wait for the products you ordered to arrive (2 day)",
+            deltaDateRequired: 2,
+        }),
+        new Stage("talk_alice2", {
+            name: "Talk to Alice",
+            description: "Talk to Alice on the terrace",
+        }),
+    ],
+    {
+        // props
+        name: "Help Alice",
+        description:
+            'To learn more about how the repo works, Talk to Alice. \nGoing when she is there will automatically start an "Event" (see aliceQuest.tsx to learn more). \nAfter that an action will be added to open the pc, in MC room. \n\n(during the quest you can talk to Alice and you will see her talking during the quests of the same Quest)',
+        image: "alice_terrace0A",
+        onStart: (quest, { toast, uiTransition }) => {
+            toast(uiTransition("notify_quest_is_started", { quest: quest.name }));
+        },
+        onContinue: (stage, { toast, uiTransition }) => {
+            toast(uiTransition("notify_quest_is_updated", { quest: stage.name }));
+        },
+    },
+);
+
+RegisteredQuests.add(aliceQuest);

package/template-nqtr-react-vite-muijoy-ink/src/content/rooms.tsx

@@ -0,0 +1,80 @@
+import { gym, mcHome, school } from "@/content/locations";
+import Room from "@/models/nqtr/Room";
+import TimeSlotsImage from "@/models/TimeSlotsImage";
+import { navigator, RegisteredRooms } from "@drincs/nqtr";
+
+export const mcRoomBackground = new TimeSlotsImage({
+    morning: "location_myroom-0",
+    afternoon: "location_myroom-1",
+    evening: "location_myroom-2",
+    night: "location_myroom-3",
+});
+export const mcRoom = new Room("mc_room", mcHome, {
+    name: "MC room",
+    background: mcRoomBackground,
+    activities: ["bed"],
+});
+
+export const aliceRoom = new Room("alice_room", mcHome, {
+    name: "Alice room",
+    background: new TimeSlotsImage({
+        morning: "location_aliceroom-0",
+        afternoon: "location_aliceroom-1",
+        evening: "location_aliceroom-2",
+        night: "location_aliceroom-3",
+    }),
+    routine: ["alice_sleep"],
+});
+
+export const annRoom = new Room("ann_room", mcHome, {
+    name: "Ann room",
+    background: new TimeSlotsImage({
+        morning: "location_annroom-0",
+        afternoon: "location_annroom-1",
+        evening: "location_annroom-2",
+        night: "location_annroom-3",
+    }),
+});
+
+export const bathroom = new Room("bathroom", mcHome, {
+    name: "Bathroom",
+    background: "location_bathroom",
+});
+
+export const lounge = new Room("lounge", mcHome, {
+    name: "Lounge",
+    background: new TimeSlotsImage({
+        morning: "location_lounge-0",
+        afternoon: "location_lounge-1",
+        evening: "location_lounge-2",
+        night: "location_lounge-3",
+    }),
+});
+
+export const terrace = new Room("terrace", mcHome, {
+    name: "Terrace",
+    isEntrance: true,
+    background: new TimeSlotsImage({
+        morning: "location_terrace-0",
+        afternoon: "location_terrace-1",
+        evening: "location_terrace-2",
+        night: "location_terrace-3",
+    }),
+    routine: ["alice_smokes"],
+});
+
+export const gymRoom = new Room("gym_room", gym, {
+    name: "Gym",
+    background: "location_gym",
+});
+
+export const classRoom = new Room("class_room", school, {
+    name: "School",
+    background: "",
+    routine: ["alice_go_school"],
+});
+
+RegisteredRooms.add(mcRoom, aliceRoom, annRoom, bathroom, lounge, terrace, gymRoom, classRoom);
+
+// default room to prevent errors when accessing navigator.currentRoom before any room is loaded.
+navigator.currentRoom = mcRoom;

package/template-nqtr-react-vite-muijoy-ink/src/content/routine.tsx

@@ -0,0 +1,86 @@
+import { ActivityBaseButton } from "@/components/screens/navigation/activity-buttons";
+import Commitment from "@/models/nqtr/Commitment";
+import TimeSlotsImage from "@/models/TimeSlotsImage";
+import { RegisteredCommitments, timeTracker } from "@drincs/nqtr";
+import { narration } from "@drincs/pixi-vn";
+import { MessageCircleQuestion } from "lucide-react";
+
+export const aliceSleep = new Commitment("alice_sleep", "alice", {
+    priority: 1,
+    timeSlot: {
+        from: 20,
+        to: 10,
+    },
+    background: "alice_roomsleep0A",
+    name: "Alice sleeps",
+    icon: (commitment, props) => {
+        return (
+            <ActivityBaseButton
+                disabled={commitment.disabled}
+                onClick={() => {
+                    commitment.run(props);
+                }}
+                ariaLabel={commitment.name}
+            >
+                <MessageCircleQuestion className="size-6 sm:size-8 md:size-10 lg:size-12 xl:size-14" />
+            </ActivityBaseButton>
+        );
+    },
+    onRun: async (_, props) => {
+        await props.navigate({ to: "/game/narration" });
+        await narration.jump("talk_alice_sleep", props);
+    },
+});
+
+export const aliceGoSchool = new Commitment("alice_go_school", "alice", {
+    timeSlot: {
+        from: 8,
+        to: 14,
+    },
+    name: "Alice goes to school",
+    hidden: () => timeTracker.isWeekend,
+    priority: 2,
+});
+
+export const aliceSmokes = new Commitment("alice_smokes", "alice", {
+    timeSlot: {
+        from: 10,
+        to: 20,
+    },
+    background: "alice_terrace0A",
+    name: "Alice smokes",
+    icon: (commitment, props) => {
+        return (
+            <ActivityBaseButton
+                disabled={commitment.disabled}
+                onClick={() => {
+                    commitment.run(props);
+                }}
+                ariaLabel={commitment.name}
+            >
+                <MessageCircleQuestion className="size-6 sm:size-8 md:size-10 lg:size-12 xl:size-14" />
+            </ActivityBaseButton>
+        );
+    },
+    onRun: async (_, props) => {
+        await props.navigate({ to: "/game/narration" });
+        await narration.jump("alice_talk_menu", props);
+    },
+});
+
+const aliceQuest_talk = new Commitment("alice_quest_talk", "alice", {
+    timeSlot: {
+        from: 10,
+        to: 20,
+    },
+    image: new TimeSlotsImage("alice_terrace0A"),
+    executionType: "automatic",
+    priority: 1,
+    onRun: async (_, props) => {
+        await props.navigate({ to: "/game/narration" });
+        await narration.jump("talk_alice", props);
+    },
+    name: "Talk to Alice",
+});
+
+RegisteredCommitments.add(aliceSleep, aliceGoSchool, aliceSmokes, aliceQuest_talk);