sunpeak 0.5.36 → 0.5.41
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chatgpt/mock-openai.d.ts +2 -2
- package/dist/chatgpt/simple-sidebar.d.ts +2 -1
- package/dist/hooks/use-max-height.d.ts +1 -1
- package/dist/index.cjs +176 -121
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +176 -121
- package/dist/index.js.map +1 -1
- package/dist/providers/openai/types.d.ts +1 -1
- package/dist/providers/types.d.ts +1 -1
- package/dist/style.css +155 -36
- package/package.json +1 -1
- package/template/dist/chatgpt/albums.js +10 -10
- package/template/dist/chatgpt/carousel.js +2 -2
- package/template/dist/chatgpt/counter.js +7 -7
- package/template/node_modules/.vite/deps/@openai_apps-sdk-ui_components_Button.js +3 -3
- package/template/node_modules/.vite/deps/@openai_apps-sdk-ui_components_SegmentedControl.js +4 -4
- package/template/node_modules/.vite/deps/@openai_apps-sdk-ui_components_Select.js +19 -19
- package/template/node_modules/.vite/deps/@openai_apps-sdk-ui_components_Textarea.js +3 -3
- package/template/node_modules/.vite/deps/_metadata.json +30 -30
- package/template/node_modules/.vite/deps/{chunk-675LFNY2.js → chunk-EVJ3DVH5.js} +8 -8
- package/template/node_modules/.vite/vitest/da39a3ee5e6b4b0d3255bfef95601890afd80709/results.json +1 -1
- package/template/src/components/album/albums.test.tsx +7 -2
- package/template/src/components/album/albums.tsx +1 -1
- package/template/src/components/album/fullscreen-viewer.test.tsx +12 -24
- package/template/src/components/album/fullscreen-viewer.tsx +55 -34
- package/template/src/components/carousel/carousel.tsx +1 -1
- package/template/src/components/resources/albums-resource.tsx +1 -0
- package/template/src/components/resources/counter-resource.tsx +8 -0
- package/template/src/simulations/albums-simulation.ts +5 -1
- package/template/src/simulations/carousel-simulation.ts +5 -1
- package/template/src/simulations/counter-simulation.ts +6 -1
- package/template/src/simulations/widget-config.ts +42 -0
- /package/template/node_modules/.vite/deps/{chunk-675LFNY2.js.map → chunk-EVJ3DVH5.js.map} +0 -0
|
@@ -4,7 +4,7 @@ declare class MockOpenAI implements OpenAiAPI, OpenAiGlobals {
|
|
|
4
4
|
theme: Theme;
|
|
5
5
|
userAgent: OpenAiGlobals['userAgent'];
|
|
6
6
|
locale: string;
|
|
7
|
-
maxHeight: number;
|
|
7
|
+
maxHeight: number | undefined;
|
|
8
8
|
displayMode: DisplayMode;
|
|
9
9
|
safeArea: {
|
|
10
10
|
insets: {
|
|
@@ -42,7 +42,7 @@ declare class MockOpenAI implements OpenAiAPI, OpenAiGlobals {
|
|
|
42
42
|
setTheme(theme: Theme): void;
|
|
43
43
|
setUserAgent(userAgent: OpenAiGlobals['userAgent']): void;
|
|
44
44
|
setLocale(locale: string): void;
|
|
45
|
-
setMaxHeight(maxHeight: number): void;
|
|
45
|
+
setMaxHeight(maxHeight: number | undefined): void;
|
|
46
46
|
setDisplayMode(displayMode: DisplayMode): void;
|
|
47
47
|
setSafeArea(safeArea: OpenAiGlobals['safeArea']): void;
|
|
48
48
|
setView(view: View | null): void;
|
|
@@ -30,8 +30,9 @@ interface SidebarInputProps {
|
|
|
30
30
|
onChange: (value: string) => void;
|
|
31
31
|
placeholder?: string;
|
|
32
32
|
type?: 'text' | 'number';
|
|
33
|
+
disabled?: boolean;
|
|
33
34
|
}
|
|
34
|
-
export declare function SidebarInput({ value, onChange, placeholder, type }: SidebarInputProps): import("react/jsx-runtime").JSX.Element;
|
|
35
|
+
export declare function SidebarInput({ value, onChange, placeholder, type, disabled, }: SidebarInputProps): import("react/jsx-runtime").JSX.Element;
|
|
35
36
|
interface SidebarCheckboxProps {
|
|
36
37
|
checked: boolean;
|
|
37
38
|
onChange: (checked: boolean) => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const useMaxHeight: () => number | null;
|
|
1
|
+
export declare const useMaxHeight: () => number | null | undefined;
|
package/dist/index.cjs
CHANGED
|
@@ -7427,7 +7427,13 @@ function SidebarSelect({ value, onChange, options, placeholder }) {
|
|
|
7427
7427
|
}
|
|
7428
7428
|
);
|
|
7429
7429
|
}
|
|
7430
|
-
function SidebarInput({
|
|
7430
|
+
function SidebarInput({
|
|
7431
|
+
value,
|
|
7432
|
+
onChange,
|
|
7433
|
+
placeholder,
|
|
7434
|
+
type = "text",
|
|
7435
|
+
disabled = false
|
|
7436
|
+
}) {
|
|
7431
7437
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
7432
7438
|
Input,
|
|
7433
7439
|
{
|
|
@@ -7435,7 +7441,8 @@ function SidebarInput({ value, onChange, placeholder, type = "text" }) {
|
|
|
7435
7441
|
value,
|
|
7436
7442
|
onChange: (e) => onChange(e.target.value),
|
|
7437
7443
|
placeholder,
|
|
7438
|
-
size: "2xs"
|
|
7444
|
+
size: "2xs",
|
|
7445
|
+
disabled
|
|
7439
7446
|
}
|
|
7440
7447
|
);
|
|
7441
7448
|
}
|
|
@@ -7511,120 +7518,148 @@ function Conversation({
|
|
|
7511
7518
|
api.requestDisplayMode({ mode: "inline" });
|
|
7512
7519
|
}
|
|
7513
7520
|
};
|
|
7514
|
-
return /* @__PURE__ */ jsxRuntime.
|
|
7515
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-subtle bg-surface z-10 grid h-12 grid-cols-[1fr_auto_1fr] border-b px-2", children: [
|
|
7516
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-start gap-3", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
7517
|
-
"button",
|
|
7518
|
-
{
|
|
7519
|
-
onClick: handleClose,
|
|
7520
|
-
"aria-label": "Close",
|
|
7521
|
-
className: "h-7 w-7 flex items-center justify-center hover:bg-subtle rounded-md transition-colors text-primary",
|
|
7522
|
-
type: "button",
|
|
7523
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(CloseBold, {})
|
|
7524
|
-
}
|
|
7525
|
-
) }),
|
|
7526
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-primary flex items-center justify-center text-base", children: appName }),
|
|
7527
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-end" })
|
|
7528
|
-
] }),
|
|
7529
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative overflow-hidden flex-1", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full w-full max-w-full overflow-auto", children }) }),
|
|
7530
|
-
/* @__PURE__ */ jsxRuntime.jsx("footer", { className: "bg-surface", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-[48rem] mx-auto px-4 py-4", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
7531
|
-
"input",
|
|
7532
|
-
{
|
|
7533
|
-
type: "text",
|
|
7534
|
-
name: "userInput",
|
|
7535
|
-
disabled: true,
|
|
7536
|
-
placeholder: "Message SimGPT",
|
|
7537
|
-
className: "w-full bg-[var(--color-background-primary)] dark:bg-[#303030] text-secondary-foreground placeholder:text-muted-foreground rounded-3xl px-5 py-3 pr-12 shadow-md light:border border-[#0000000f]"
|
|
7538
|
-
}
|
|
7539
|
-
) }) }) })
|
|
7540
|
-
] });
|
|
7541
|
-
}
|
|
7542
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col bg-surface w-full h-full flex-1", children: [
|
|
7543
|
-
/* @__PURE__ */ jsxRuntime.jsx("header", { className: "h-12 bg-surface flex items-center px-4 text-lg sticky top-0 z-40", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary", children: "SimGPT" }) }),
|
|
7544
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
7521
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
7545
7522
|
"div",
|
|
7546
7523
|
{
|
|
7547
|
-
className: "flex flex-col
|
|
7548
|
-
style: {
|
|
7549
|
-
children:
|
|
7550
|
-
|
|
7551
|
-
|
|
7552
|
-
|
|
7553
|
-
|
|
7554
|
-
|
|
7524
|
+
className: "flex flex-col bg-surface w-full h-full flex-1 items-center relative",
|
|
7525
|
+
style: { transform: "translate(0)" },
|
|
7526
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
7527
|
+
"div",
|
|
7528
|
+
{
|
|
7529
|
+
className: "no-scrollbar fixed start-0 end-0 top-0 bottom-0 z-50 mx-auto flex w-auto flex-col overflow-hidden",
|
|
7530
|
+
style: { maxWidth: containerWidth },
|
|
7531
|
+
children: [
|
|
7532
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-subtle bg-token-bg-primary sm:bg-token-bg-primary z-10 grid h-[3.25rem] grid-cols-[1fr_auto_1fr] border-b px-2", children: [
|
|
7533
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-start gap-3", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
7534
|
+
"button",
|
|
7535
|
+
{
|
|
7536
|
+
onClick: handleClose,
|
|
7537
|
+
"aria-label": "Close",
|
|
7538
|
+
className: "h-7 w-7 flex items-center justify-center hover:bg-subtle rounded-md transition-colors text-primary",
|
|
7539
|
+
type: "button",
|
|
7540
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(CloseBold, {})
|
|
7541
|
+
}
|
|
7542
|
+
) }),
|
|
7543
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-primary flex items-center justify-center text-base", children: appName }),
|
|
7544
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-end" })
|
|
7545
|
+
] }),
|
|
7546
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative overflow-hidden flex-1 min-h-0", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full w-full max-w-full overflow-auto", children }) }),
|
|
7547
|
+
/* @__PURE__ */ jsxRuntime.jsx("footer", { className: "bg-surface", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-[48rem] mx-auto px-4 py-4", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
7548
|
+
"input",
|
|
7555
7549
|
{
|
|
7556
|
-
|
|
7557
|
-
|
|
7558
|
-
|
|
7550
|
+
type: "text",
|
|
7551
|
+
name: "userInput",
|
|
7552
|
+
disabled: true,
|
|
7553
|
+
placeholder: "Message SimGPT",
|
|
7554
|
+
className: "w-full dark:bg-[#303030] text-secondary-foreground placeholder:text-muted-foreground rounded-3xl px-5 py-3 pr-12 shadow-md light:border border-[#0000000f]"
|
|
7559
7555
|
}
|
|
7560
7556
|
) }) }) })
|
|
7561
|
-
]
|
|
7562
|
-
|
|
7563
|
-
|
|
7564
|
-
|
|
7565
|
-
|
|
7566
|
-
|
|
7567
|
-
|
|
7568
|
-
|
|
7569
|
-
|
|
7570
|
-
|
|
7571
|
-
|
|
7572
|
-
|
|
7573
|
-
|
|
7574
|
-
|
|
7575
|
-
|
|
7576
|
-
|
|
7577
|
-
|
|
7578
|
-
|
|
7579
|
-
|
|
7580
|
-
|
|
7581
|
-
|
|
7582
|
-
|
|
7583
|
-
|
|
7557
|
+
]
|
|
7558
|
+
}
|
|
7559
|
+
)
|
|
7560
|
+
}
|
|
7561
|
+
);
|
|
7562
|
+
}
|
|
7563
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
7564
|
+
"div",
|
|
7565
|
+
{
|
|
7566
|
+
className: "flex flex-col bg-surface w-full h-full flex-1 items-center relative",
|
|
7567
|
+
style: { transform: "translate(0)" },
|
|
7568
|
+
children: [
|
|
7569
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
7570
|
+
"header",
|
|
7571
|
+
{
|
|
7572
|
+
className: "h-12 bg-surface flex items-center px-4 text-lg sticky top-0 z-40 w-full",
|
|
7573
|
+
style: { maxWidth: containerWidth },
|
|
7574
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary", children: "SimGPT" })
|
|
7575
|
+
}
|
|
7576
|
+
),
|
|
7577
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
7578
|
+
"div",
|
|
7579
|
+
{
|
|
7580
|
+
className: "flex flex-col flex-1 w-full transition-all duration-200 overflow-hidden",
|
|
7581
|
+
style: { maxWidth: containerWidth },
|
|
7582
|
+
children: [
|
|
7583
|
+
/* @__PURE__ */ jsxRuntime.jsxs("main", { className: "flex-1 overflow-y-auto overflow-x-hidden", children: [
|
|
7584
|
+
/* @__PURE__ */ jsxRuntime.jsxs("article", { className: "text-primary w-full focus:outline-none", dir: "auto", "data-turn": "user", children: [
|
|
7585
|
+
/* @__PURE__ */ jsxRuntime.jsx("h5", { className: "sr-only", children: "You said:" }),
|
|
7586
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-base my-auto mx-auto md:pt-8 px-4", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-[48rem] mx-auto flex-1 relative flex w-full min-w-0 flex-col", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex max-w-full flex-col grow", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
7587
|
+
"div",
|
|
7588
|
+
{
|
|
7589
|
+
"data-message-author-role": "user",
|
|
7590
|
+
className: "min-h-8 relative flex w-full flex-col items-end gap-2 text-start break-words whitespace-normal",
|
|
7591
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-full flex-col gap-1 empty:hidden items-end", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-[var(--color-background-primary-soft)] relative rounded-[18px] px-4 py-3 max-w-[70%]", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "whitespace-pre-wrap", children: userMessage }) }) })
|
|
7592
|
+
}
|
|
7593
|
+
) }) }) })
|
|
7594
|
+
] }),
|
|
7595
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
7596
|
+
"article",
|
|
7597
|
+
{
|
|
7598
|
+
className: "text-primary w-full focus:outline-none",
|
|
7599
|
+
dir: "auto",
|
|
7600
|
+
"data-turn": "assistant",
|
|
7601
|
+
children: [
|
|
7602
|
+
/* @__PURE__ */ jsxRuntime.jsxs("h6", { className: "sr-only", children: [
|
|
7603
|
+
appName,
|
|
7604
|
+
" said:"
|
|
7605
|
+
] }),
|
|
7606
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-base my-auto mx-auto pb-10 px-4", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-[48rem] mx-auto flex-1 relative flex w-full min-w-0 flex-col", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex max-w-full flex-col grow", children: [
|
|
7607
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 my-3", children: [
|
|
7608
|
+
appIcon ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "size-6 flex items-center justify-center text-base", children: appIcon }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "size-6 rounded-full bg-primary flex items-center justify-center text-primary-foreground font-medium text-xs", children: "AI" }),
|
|
7609
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-sm", children: appName })
|
|
7610
|
+
] }),
|
|
7611
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
7584
7612
|
"div",
|
|
7585
7613
|
{
|
|
7586
|
-
|
|
7587
|
-
|
|
7588
|
-
children:
|
|
7589
|
-
|
|
7590
|
-
|
|
7591
|
-
|
|
7592
|
-
|
|
7593
|
-
|
|
7594
|
-
|
|
7614
|
+
"data-message-author-role": "assistant",
|
|
7615
|
+
className: "min-h-8 relative flex w-full flex-col items-start gap-2 text-start break-words whitespace-normal",
|
|
7616
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-full flex-col gap-1 empty:hidden", children: displayMode === "pip" ? /* @__PURE__ */ jsxRuntime.jsxs(
|
|
7617
|
+
"div",
|
|
7618
|
+
{
|
|
7619
|
+
className: "no-scrollbar @w-xl/main:top-4 fixed start-4 end-4 top-4 z-50 mx-auto max-w-[40rem] lg:max-w-[48rem] sm:start-0 sm:end-0 sm:top-[3.25rem] sm:w-full overflow-visible",
|
|
7620
|
+
style: { maxHeight: "480px" },
|
|
7621
|
+
children: [
|
|
7622
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
7623
|
+
"button",
|
|
7624
|
+
{
|
|
7625
|
+
onClick: () => {
|
|
7626
|
+
if (api == null ? void 0 : api.requestDisplayMode) {
|
|
7627
|
+
api.requestDisplayMode({ mode: "inline" });
|
|
7628
|
+
}
|
|
7629
|
+
},
|
|
7630
|
+
className: "absolute -start-2 -top-1.5 z-10 rounded-full bg-[#3a3a3a] p-1.5 text-white shadow-[0px_0px_0px_1px_#fff3,0px_4px_12px_rgba(0,0,0,0.12)] hover:bg-[#6a6a6a]",
|
|
7631
|
+
"aria-label": "Close picture-in-picture",
|
|
7632
|
+
type: "button",
|
|
7633
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(CloseBold, { className: "h-4 w-4" })
|
|
7595
7634
|
}
|
|
7596
|
-
|
|
7597
|
-
className: "
|
|
7598
|
-
|
|
7599
|
-
|
|
7600
|
-
|
|
7601
|
-
}
|
|
7602
|
-
),
|
|
7603
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative overflow-hidden h-full rounded-2xl sm:rounded-3xl shadow-[0px_0px_0px_1px_var(--border-heavy),0px_6px_20px_rgba(0,0,0,0.1)] border border-subtle", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full w-full max-w-full overflow-auto bg-surface", children }) })
|
|
7604
|
-
]
|
|
7635
|
+
),
|
|
7636
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative overflow-hidden h-full rounded-2xl sm:rounded-3xl shadow-[0px_0px_0px_1px_#fff3,0px_6px_20px_rgba(0,0,0,0.1)] md:-mx-4", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full w-full max-w-full overflow-auto bg-[#212121]", children }) })
|
|
7637
|
+
]
|
|
7638
|
+
}
|
|
7639
|
+
) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "no-scrollbar relative mb-2 @w-sm/main:w-full mx-0 max-sm:-mx-[1rem] max-sm:w-[100cqw] max-sm:overflow-hidden overflow-visible", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative overflow-hidden h-full", children }) }) })
|
|
7605
7640
|
}
|
|
7606
|
-
)
|
|
7607
|
-
}
|
|
7608
|
-
|
|
7609
|
-
|
|
7610
|
-
|
|
7611
|
-
}
|
|
7612
|
-
|
|
7613
|
-
|
|
7614
|
-
|
|
7615
|
-
|
|
7616
|
-
|
|
7617
|
-
|
|
7618
|
-
|
|
7619
|
-
|
|
7620
|
-
|
|
7621
|
-
|
|
7622
|
-
|
|
7623
|
-
|
|
7624
|
-
|
|
7625
|
-
|
|
7626
|
-
|
|
7627
|
-
|
|
7641
|
+
)
|
|
7642
|
+
] }) }) })
|
|
7643
|
+
]
|
|
7644
|
+
}
|
|
7645
|
+
)
|
|
7646
|
+
] }),
|
|
7647
|
+
/* @__PURE__ */ jsxRuntime.jsx("footer", { className: "bg-surface", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-[48rem] mx-auto px-4 py-4", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
7648
|
+
"input",
|
|
7649
|
+
{
|
|
7650
|
+
type: "text",
|
|
7651
|
+
name: "userInput",
|
|
7652
|
+
disabled: true,
|
|
7653
|
+
placeholder: "Message SimGPT",
|
|
7654
|
+
className: "w-full dark:bg-[#303030] text-secondary-foreground placeholder:text-muted-foreground rounded-3xl px-5 py-3 pr-12 shadow-md light:border border-[#0000000f]"
|
|
7655
|
+
}
|
|
7656
|
+
) }) }) })
|
|
7657
|
+
]
|
|
7658
|
+
}
|
|
7659
|
+
)
|
|
7660
|
+
]
|
|
7661
|
+
}
|
|
7662
|
+
);
|
|
7628
7663
|
}
|
|
7629
7664
|
class MockOpenAI {
|
|
7630
7665
|
constructor() {
|
|
@@ -7637,7 +7672,7 @@ class MockOpenAI {
|
|
|
7637
7672
|
}
|
|
7638
7673
|
});
|
|
7639
7674
|
__publicField(this, "locale", "en-US");
|
|
7640
|
-
__publicField(this, "maxHeight"
|
|
7675
|
+
__publicField(this, "maxHeight");
|
|
7641
7676
|
__publicField(this, "displayMode", "inline");
|
|
7642
7677
|
__publicField(this, "safeArea", {
|
|
7643
7678
|
insets: {
|
|
@@ -7698,7 +7733,8 @@ class MockOpenAI {
|
|
|
7698
7733
|
}
|
|
7699
7734
|
setDisplayMode(displayMode) {
|
|
7700
7735
|
this.displayMode = displayMode;
|
|
7701
|
-
this.
|
|
7736
|
+
this.maxHeight = displayMode === "pip" ? 480 : void 0;
|
|
7737
|
+
this.emitUpdate({ displayMode, maxHeight: this.maxHeight });
|
|
7702
7738
|
}
|
|
7703
7739
|
setSafeArea(safeArea) {
|
|
7704
7740
|
this.safeArea = safeArea;
|
|
@@ -7818,6 +7854,7 @@ function ChatGPTSimulator({
|
|
|
7818
7854
|
appIcon
|
|
7819
7855
|
}) {
|
|
7820
7856
|
const [screenWidth, setScreenWidth] = React__namespace.useState("full");
|
|
7857
|
+
const isMobileWidth = (width) => width === "mobile-s" || width === "mobile-l";
|
|
7821
7858
|
const getSimulationKey = (sim) => `${sim.resource.name}-${sim.tool.name}`;
|
|
7822
7859
|
const [selectedKey, setSelectedKey] = React__namespace.useState(
|
|
7823
7860
|
simulations.length > 0 ? getSimulationKey(simulations[0]) : ""
|
|
@@ -7832,7 +7869,7 @@ function ChatGPTSimulator({
|
|
|
7832
7869
|
[]
|
|
7833
7870
|
);
|
|
7834
7871
|
React.useEffect(() => {
|
|
7835
|
-
var _a2, _b2, _c, _d, _e, _f, _g, _h, _i, _j;
|
|
7872
|
+
var _a2, _b2, _c, _d, _e, _f, _g, _h, _i, _j, _k;
|
|
7836
7873
|
if (selectedSim) {
|
|
7837
7874
|
if (((_a2 = selectedSim.simulationGlobals) == null ? void 0 : _a2.theme) !== void 0) {
|
|
7838
7875
|
mock.theme = selectedSim.simulationGlobals.theme;
|
|
@@ -7846,12 +7883,13 @@ function ChatGPTSimulator({
|
|
|
7846
7883
|
}
|
|
7847
7884
|
mock.userAgent = ((_c = selectedSim.simulationGlobals) == null ? void 0 : _c.userAgent) ?? mock.userAgent;
|
|
7848
7885
|
mock.locale = ((_d = selectedSim.simulationGlobals) == null ? void 0 : _d.locale) ?? "en-US";
|
|
7849
|
-
|
|
7850
|
-
mock.
|
|
7851
|
-
mock.
|
|
7852
|
-
mock.
|
|
7853
|
-
mock.
|
|
7854
|
-
mock.
|
|
7886
|
+
const currentDisplayMode = ((_e = selectedSim.simulationGlobals) == null ? void 0 : _e.displayMode) ?? DEFAULT_DISPLAY_MODE;
|
|
7887
|
+
mock.maxHeight = currentDisplayMode === "pip" ? ((_f = selectedSim.simulationGlobals) == null ? void 0 : _f.maxHeight) ?? 480 : void 0;
|
|
7888
|
+
mock.safeArea = ((_g = selectedSim.simulationGlobals) == null ? void 0 : _g.safeArea) ?? mock.safeArea;
|
|
7889
|
+
mock.view = ((_h = selectedSim.simulationGlobals) == null ? void 0 : _h.view) ?? null;
|
|
7890
|
+
mock.toolInput = ((_i = selectedSim.simulationGlobals) == null ? void 0 : _i.toolInput) ?? {};
|
|
7891
|
+
mock.widgetState = ((_j = selectedSim.simulationGlobals) == null ? void 0 : _j.widgetState) ?? null;
|
|
7892
|
+
mock.toolOutput = ((_k = selectedSim.toolCall) == null ? void 0 : _k.structuredContent) ?? null;
|
|
7855
7893
|
}
|
|
7856
7894
|
}, [selectedKey, selectedSim, mock]);
|
|
7857
7895
|
const theme = useTheme() ?? DEFAULT_THEME;
|
|
@@ -7916,6 +7954,11 @@ function ChatGPTSimulator({
|
|
|
7916
7954
|
}
|
|
7917
7955
|
};
|
|
7918
7956
|
}, []);
|
|
7957
|
+
React.useEffect(() => {
|
|
7958
|
+
if (isMobileWidth(screenWidth) && displayMode === "pip") {
|
|
7959
|
+
mock.setDisplayMode("fullscreen");
|
|
7960
|
+
}
|
|
7961
|
+
}, [screenWidth, displayMode, mock]);
|
|
7919
7962
|
React.useEffect(() => {
|
|
7920
7963
|
if (editingField !== "toolInput") {
|
|
7921
7964
|
setToolInputJson(JSON.stringify(toolInput ?? {}, null, 2));
|
|
@@ -8017,7 +8060,14 @@ function ChatGPTSimulator({
|
|
|
8017
8060
|
SidebarToggle,
|
|
8018
8061
|
{
|
|
8019
8062
|
value: displayMode,
|
|
8020
|
-
onChange: (value) =>
|
|
8063
|
+
onChange: (value) => {
|
|
8064
|
+
const newMode = value;
|
|
8065
|
+
if (isMobileWidth(screenWidth) && newMode === "pip") {
|
|
8066
|
+
mock.setDisplayMode("fullscreen");
|
|
8067
|
+
} else {
|
|
8068
|
+
mock.setDisplayMode(newMode);
|
|
8069
|
+
}
|
|
8070
|
+
},
|
|
8021
8071
|
options: [
|
|
8022
8072
|
{ value: "inline", label: "Inline" },
|
|
8023
8073
|
{ value: "pip", label: "PiP" },
|
|
@@ -8034,13 +8084,18 @@ function ChatGPTSimulator({
|
|
|
8034
8084
|
placeholder: "e.g. en-US"
|
|
8035
8085
|
}
|
|
8036
8086
|
) }),
|
|
8037
|
-
/* @__PURE__ */ jsxRuntime.jsx(SidebarControl, { label: "Max Height", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
8087
|
+
/* @__PURE__ */ jsxRuntime.jsx(SidebarControl, { label: "Max Height (PiP)", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
8038
8088
|
SidebarInput,
|
|
8039
8089
|
{
|
|
8040
8090
|
type: "number",
|
|
8041
|
-
value: String(maxHeight),
|
|
8042
|
-
onChange: (value) =>
|
|
8043
|
-
|
|
8091
|
+
value: displayMode === "pip" && maxHeight !== void 0 ? String(maxHeight) : "",
|
|
8092
|
+
onChange: (value) => {
|
|
8093
|
+
if (displayMode === "pip") {
|
|
8094
|
+
mock.setMaxHeight(value ? Number(value) : 480);
|
|
8095
|
+
}
|
|
8096
|
+
},
|
|
8097
|
+
placeholder: displayMode === "pip" ? "480" : "-",
|
|
8098
|
+
disabled: displayMode !== "pip"
|
|
8044
8099
|
}
|
|
8045
8100
|
) })
|
|
8046
8101
|
] }),
|