sunpeak 0.4.4 → 0.5.3
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/chatgpt-simulator-types.d.ts +1 -1
- package/dist/chatgpt/chatgpt-simulator.d.ts +4 -15
- package/dist/chatgpt/index.d.ts +1 -1
- package/dist/chatgpt/mock-openai.d.ts +4 -16
- package/dist/index.cjs +69 -40
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +69 -40
- package/dist/index.js.map +1 -1
- package/dist/mcp/index.cjs +76 -112
- package/dist/mcp/index.cjs.map +1 -1
- package/dist/mcp/index.d.ts +2 -1
- package/dist/mcp/index.js +76 -112
- package/dist/mcp/index.js.map +1 -1
- package/dist/mcp/server.d.ts +2 -4
- package/dist/mcp/types.d.ts +16 -62
- package/dist/providers/index.d.ts +1 -3
- package/dist/providers/openai/index.d.ts +7 -0
- package/dist/{chatgpt/openai-provider.d.ts → providers/openai/provider.d.ts} +1 -1
- package/dist/{chatgpt/openai-types.d.ts → providers/openai/types.d.ts} +3 -32
- package/dist/providers/types.d.ts +4 -5
- package/dist/runtime/index.d.ts +7 -0
- package/dist/runtime/provider-detection.d.ts +17 -0
- package/dist/types/index.d.ts +2 -1
- package/dist/types/runtime.d.ts +34 -0
- package/dist/types/simulation.d.ts +47 -0
- package/package.json +2 -2
- package/template/README.md +6 -7
- package/template/dev/main.tsx +38 -3
- package/template/mcp/server.ts +9 -6
- package/template/nodemon.json +7 -0
- package/template/package.json +4 -2
- package/template/scripts/build-all.mjs +108 -0
- package/template/scripts/validate.mjs +16 -7
- package/template/src/components/index.ts +1 -1
- package/template/src/components/resources/AlbumsResource.tsx +13 -0
- package/template/src/components/{apps/PlacesApp.tsx → resources/CarouselResource.tsx} +11 -10
- package/template/src/components/{apps/App.tsx → resources/CounterResource.tsx} +5 -14
- package/template/src/components/resources/index.ts +3 -0
- package/template/src/index-resource.tsx +11 -0
- package/template/src/simulations/albums-simulation.ts +35 -9
- package/template/src/simulations/carousel-simulation.ts +35 -9
- package/template/src/simulations/counter-simulation.ts +41 -0
- package/template/src/simulations/index.ts +10 -10
- package/template/vite.config.build.ts +21 -15
- package/dist/chatgpt/mcp-provider.d.ts +0 -25
- package/dist/style.css +0 -4420
- package/template/src/components/apps/AlbumsApp.tsx +0 -13
- package/template/src/components/apps/active-app.ts +0 -11
- package/template/src/components/apps/index.ts +0 -3
- package/template/src/index.chatgpt.tsx +0 -9
- package/template/src/index.ts +0 -2
- package/template/src/simulations/app-configs.ts +0 -30
- package/template/src/simulations/app-simulation.ts +0 -15
- package/template/src/simulations/simulations.ts +0 -74
|
@@ -1,21 +1,10 @@
|
|
|
1
|
+
import { Simulation } from '../types/simulation';
|
|
1
2
|
import * as React from 'react';
|
|
2
|
-
/**
|
|
3
|
-
* A simulation packages a component with its example data and metadata.
|
|
4
|
-
* Each simulation represents a complete app experience in the simulator.
|
|
5
|
-
*/
|
|
6
|
-
export interface Simulation {
|
|
7
|
-
value: string;
|
|
8
|
-
label: string;
|
|
9
|
-
component: React.ComponentType;
|
|
10
|
-
appName?: string;
|
|
11
|
-
appIcon?: string;
|
|
12
|
-
userMessage?: string;
|
|
13
|
-
toolOutput?: Record<string, unknown> | null;
|
|
14
|
-
widgetState?: Record<string, unknown> | null;
|
|
15
|
-
}
|
|
16
3
|
interface ChatGPTSimulatorProps {
|
|
17
4
|
children?: React.ReactNode;
|
|
18
5
|
simulations?: Simulation[];
|
|
6
|
+
appName?: string;
|
|
7
|
+
appIcon?: string;
|
|
19
8
|
}
|
|
20
|
-
export declare function ChatGPTSimulator({ children, simulations, }: ChatGPTSimulatorProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare function ChatGPTSimulator({ children, simulations, appName, appIcon, }: ChatGPTSimulatorProps): import("react/jsx-runtime").JSX.Element;
|
|
21
10
|
export {};
|
package/dist/chatgpt/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
export { ChatGPTSimulator } from './chatgpt-simulator';
|
|
2
|
-
export type { Simulation } from '
|
|
2
|
+
export type { Simulation, SimulationCallToolResult, SimulationGlobals } from '../types/simulation';
|
|
3
3
|
export { initMockOpenAI } from './mock-openai';
|
|
4
4
|
export * from './theme-provider';
|
|
@@ -1,15 +1,8 @@
|
|
|
1
|
-
import { OpenAiGlobals, OpenAiAPI
|
|
1
|
+
import { OpenAiGlobals, OpenAiAPI } from '../providers/openai';
|
|
2
|
+
import { Theme, DisplayMode, View, ViewMode, UnknownObject } from '../types/runtime';
|
|
2
3
|
declare class MockOpenAI implements OpenAiAPI, OpenAiGlobals {
|
|
3
4
|
theme: Theme;
|
|
4
|
-
userAgent:
|
|
5
|
-
device: {
|
|
6
|
-
type: "desktop";
|
|
7
|
-
};
|
|
8
|
-
capabilities: {
|
|
9
|
-
hover: boolean;
|
|
10
|
-
touch: boolean;
|
|
11
|
-
};
|
|
12
|
-
};
|
|
5
|
+
userAgent: OpenAiGlobals['userAgent'];
|
|
13
6
|
locale: string;
|
|
14
7
|
maxHeight: number;
|
|
15
8
|
displayMode: DisplayMode;
|
|
@@ -52,10 +45,5 @@ declare class MockOpenAI implements OpenAiAPI, OpenAiGlobals {
|
|
|
52
45
|
setWidgetStateExternal(widgetState: Record<string, unknown> | null): void;
|
|
53
46
|
emitUpdate(globals: Partial<OpenAiGlobals>): void;
|
|
54
47
|
}
|
|
55
|
-
export declare function initMockOpenAI(initialData?:
|
|
56
|
-
theme?: Theme;
|
|
57
|
-
displayMode?: DisplayMode;
|
|
58
|
-
toolOutput?: Record<string, unknown> | null;
|
|
59
|
-
widgetState?: Record<string, unknown> | null;
|
|
60
|
-
}): MockOpenAI;
|
|
48
|
+
export declare function initMockOpenAI(initialData?: Partial<OpenAiGlobals>): MockOpenAI;
|
|
61
49
|
export type { MockOpenAI };
|
package/dist/index.cjs
CHANGED
|
@@ -23,12 +23,6 @@ function _interopNamespaceDefault(e) {
|
|
|
23
23
|
}
|
|
24
24
|
const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
|
|
25
25
|
const SET_GLOBALS_EVENT_TYPE = "openai:set_globals";
|
|
26
|
-
class SetGlobalsEvent extends CustomEvent {
|
|
27
|
-
constructor() {
|
|
28
|
-
super(...arguments);
|
|
29
|
-
__publicField(this, "type", SET_GLOBALS_EVENT_TYPE);
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
26
|
function isOpenAiAvailable() {
|
|
33
27
|
return typeof window !== "undefined" && window.openai != null;
|
|
34
28
|
}
|
|
@@ -85,7 +79,7 @@ function getOpenAiProvider() {
|
|
|
85
79
|
}
|
|
86
80
|
let cachedProvider = null;
|
|
87
81
|
let detectionComplete = false;
|
|
88
|
-
function
|
|
82
|
+
function detectProvider() {
|
|
89
83
|
if (detectionComplete) {
|
|
90
84
|
return cachedProvider;
|
|
91
85
|
}
|
|
@@ -95,8 +89,18 @@ function getProvider() {
|
|
|
95
89
|
detectionComplete = true;
|
|
96
90
|
return cachedProvider;
|
|
97
91
|
}
|
|
92
|
+
function isProviderAvailable$1() {
|
|
93
|
+
return detectProvider() !== null;
|
|
94
|
+
}
|
|
95
|
+
function resetProviderCache$1() {
|
|
96
|
+
cachedProvider = null;
|
|
97
|
+
detectionComplete = false;
|
|
98
|
+
}
|
|
99
|
+
function getProvider() {
|
|
100
|
+
return detectProvider();
|
|
101
|
+
}
|
|
98
102
|
function isProviderAvailable() {
|
|
99
|
-
return
|
|
103
|
+
return isProviderAvailable$1();
|
|
100
104
|
}
|
|
101
105
|
function getGlobal(key) {
|
|
102
106
|
const provider = getProvider();
|
|
@@ -112,8 +116,7 @@ function getAPI() {
|
|
|
112
116
|
return (provider == null ? void 0 : provider.getAPI()) ?? null;
|
|
113
117
|
}
|
|
114
118
|
function resetProviderCache() {
|
|
115
|
-
|
|
116
|
-
detectionComplete = false;
|
|
119
|
+
resetProviderCache$1();
|
|
117
120
|
}
|
|
118
121
|
function useWidgetGlobal(key) {
|
|
119
122
|
return React.useSyncExternalStore(
|
|
@@ -3395,7 +3398,7 @@ const SCREEN_WIDTHS = {
|
|
|
3395
3398
|
function Conversation({
|
|
3396
3399
|
children,
|
|
3397
3400
|
screenWidth,
|
|
3398
|
-
appName = "
|
|
3401
|
+
appName = "Sunpeak App",
|
|
3399
3402
|
appIcon,
|
|
3400
3403
|
userMessage = "What have you got for me today?"
|
|
3401
3404
|
}) {
|
|
@@ -3572,12 +3575,33 @@ function initMockOpenAI(initialData) {
|
|
|
3572
3575
|
if ((initialData == null ? void 0 : initialData.theme) !== void 0) {
|
|
3573
3576
|
mock.theme = initialData.theme;
|
|
3574
3577
|
}
|
|
3578
|
+
if ((initialData == null ? void 0 : initialData.userAgent) !== void 0) {
|
|
3579
|
+
mock.userAgent = initialData.userAgent;
|
|
3580
|
+
}
|
|
3581
|
+
if ((initialData == null ? void 0 : initialData.locale) !== void 0) {
|
|
3582
|
+
mock.locale = initialData.locale;
|
|
3583
|
+
}
|
|
3584
|
+
if ((initialData == null ? void 0 : initialData.maxHeight) !== void 0) {
|
|
3585
|
+
mock.maxHeight = initialData.maxHeight;
|
|
3586
|
+
}
|
|
3575
3587
|
if ((initialData == null ? void 0 : initialData.displayMode) !== void 0) {
|
|
3576
3588
|
mock.displayMode = initialData.displayMode;
|
|
3577
3589
|
}
|
|
3590
|
+
if ((initialData == null ? void 0 : initialData.safeArea) !== void 0) {
|
|
3591
|
+
mock.safeArea = initialData.safeArea;
|
|
3592
|
+
}
|
|
3593
|
+
if ((initialData == null ? void 0 : initialData.view) !== void 0) {
|
|
3594
|
+
mock.view = initialData.view;
|
|
3595
|
+
}
|
|
3596
|
+
if ((initialData == null ? void 0 : initialData.toolInput) !== void 0) {
|
|
3597
|
+
mock.toolInput = initialData.toolInput;
|
|
3598
|
+
}
|
|
3578
3599
|
if ((initialData == null ? void 0 : initialData.toolOutput) !== void 0) {
|
|
3579
3600
|
mock.toolOutput = initialData.toolOutput;
|
|
3580
3601
|
}
|
|
3602
|
+
if ((initialData == null ? void 0 : initialData.toolResponseMetadata) !== void 0) {
|
|
3603
|
+
mock.toolResponseMetadata = initialData.toolResponseMetadata;
|
|
3604
|
+
}
|
|
3581
3605
|
if ((initialData == null ? void 0 : initialData.widgetState) !== void 0) {
|
|
3582
3606
|
mock.widgetState = initialData.widgetState;
|
|
3583
3607
|
}
|
|
@@ -3626,38 +3650,42 @@ const DEFAULT_THEME = "dark";
|
|
|
3626
3650
|
const DEFAULT_DISPLAY_MODE = "inline";
|
|
3627
3651
|
function ChatGPTSimulator({
|
|
3628
3652
|
children,
|
|
3629
|
-
simulations = []
|
|
3653
|
+
simulations = [],
|
|
3654
|
+
appName = "Sunpeak App",
|
|
3655
|
+
appIcon
|
|
3630
3656
|
}) {
|
|
3631
3657
|
const [screenWidth, setScreenWidth] = React__namespace.useState("full");
|
|
3658
|
+
const getSimulationKey = (sim) => `${sim.resource.name}-${sim.tool.name}`;
|
|
3632
3659
|
const [selectedKey, setSelectedKey] = React__namespace.useState(
|
|
3633
|
-
simulations.length > 0 ? simulations[0]
|
|
3660
|
+
simulations.length > 0 ? getSimulationKey(simulations[0]) : ""
|
|
3634
3661
|
);
|
|
3635
|
-
const selectedSim = simulations.find((sim) => sim
|
|
3636
|
-
const appName = selectedSim == null ? void 0 : selectedSim.appName;
|
|
3637
|
-
const appIcon = selectedSim == null ? void 0 : selectedSim.appIcon;
|
|
3662
|
+
const selectedSim = simulations.find((sim) => getSimulationKey(sim) === selectedKey);
|
|
3638
3663
|
const userMessage = selectedSim == null ? void 0 : selectedSim.userMessage;
|
|
3639
|
-
const toolOutput = (selectedSim == null ? void 0 : selectedSim.toolOutput) ?? null;
|
|
3640
|
-
const widgetState = (selectedSim == null ? void 0 : selectedSim.widgetState) ?? null;
|
|
3641
3664
|
const mock = React.useMemo(
|
|
3642
|
-
() =>
|
|
3643
|
-
|
|
3644
|
-
|
|
3645
|
-
|
|
3646
|
-
|
|
3665
|
+
() => {
|
|
3666
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
|
|
3667
|
+
return initMockOpenAI({
|
|
3668
|
+
theme: ((_a = selectedSim == null ? void 0 : selectedSim.simulationGlobals) == null ? void 0 : _a.theme) ?? DEFAULT_THEME,
|
|
3669
|
+
userAgent: (_b = selectedSim == null ? void 0 : selectedSim.simulationGlobals) == null ? void 0 : _b.userAgent,
|
|
3670
|
+
locale: (_c = selectedSim == null ? void 0 : selectedSim.simulationGlobals) == null ? void 0 : _c.locale,
|
|
3671
|
+
maxHeight: (_d = selectedSim == null ? void 0 : selectedSim.simulationGlobals) == null ? void 0 : _d.maxHeight,
|
|
3672
|
+
displayMode: ((_e = selectedSim == null ? void 0 : selectedSim.simulationGlobals) == null ? void 0 : _e.displayMode) ?? DEFAULT_DISPLAY_MODE,
|
|
3673
|
+
safeArea: (_f = selectedSim == null ? void 0 : selectedSim.simulationGlobals) == null ? void 0 : _f.safeArea,
|
|
3674
|
+
view: (_g = selectedSim == null ? void 0 : selectedSim.simulationGlobals) == null ? void 0 : _g.view,
|
|
3675
|
+
toolInput: (_h = selectedSim == null ? void 0 : selectedSim.simulationGlobals) == null ? void 0 : _h.toolInput,
|
|
3676
|
+
widgetState: ((_i = selectedSim == null ? void 0 : selectedSim.simulationGlobals) == null ? void 0 : _i.widgetState) ?? null,
|
|
3677
|
+
toolOutput: ((_j = selectedSim == null ? void 0 : selectedSim.toolCall) == null ? void 0 : _j.structuredContent) ?? null
|
|
3678
|
+
});
|
|
3679
|
+
},
|
|
3680
|
+
[selectedSim]
|
|
3647
3681
|
);
|
|
3648
3682
|
const theme = useTheme() ?? DEFAULT_THEME;
|
|
3649
3683
|
const displayMode = useDisplayMode() ?? DEFAULT_DISPLAY_MODE;
|
|
3650
3684
|
React.useLayoutEffect(() => {
|
|
3651
3685
|
if (mock && typeof window !== "undefined") {
|
|
3652
3686
|
window.openai = mock;
|
|
3653
|
-
if (toolOutput !== void 0) {
|
|
3654
|
-
mock.setToolOutput(toolOutput);
|
|
3655
|
-
}
|
|
3656
|
-
if (widgetState !== void 0) {
|
|
3657
|
-
mock.setWidgetStateExternal(widgetState);
|
|
3658
|
-
}
|
|
3659
3687
|
}
|
|
3660
|
-
}, [mock
|
|
3688
|
+
}, [mock]);
|
|
3661
3689
|
React.useEffect(() => {
|
|
3662
3690
|
return () => {
|
|
3663
3691
|
if (typeof window !== "undefined") {
|
|
@@ -3665,7 +3693,7 @@ function ChatGPTSimulator({
|
|
|
3665
3693
|
}
|
|
3666
3694
|
};
|
|
3667
3695
|
}, []);
|
|
3668
|
-
const SelectedComponent = selectedSim == null ? void 0 : selectedSim.
|
|
3696
|
+
const SelectedComponent = selectedSim == null ? void 0 : selectedSim.resourceComponent;
|
|
3669
3697
|
const content = SelectedComponent ? /* @__PURE__ */ jsxRuntime.jsx(SelectedComponent, {}) : children;
|
|
3670
3698
|
return /* @__PURE__ */ jsxRuntime.jsx(ThemeProvider, { theme, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3671
3699
|
SimpleSidebar,
|
|
@@ -3676,10 +3704,14 @@ function ChatGPTSimulator({
|
|
|
3676
3704
|
{
|
|
3677
3705
|
value: selectedKey,
|
|
3678
3706
|
onChange: (value) => setSelectedKey(value),
|
|
3679
|
-
options: simulations.map((sim) =>
|
|
3680
|
-
|
|
3681
|
-
|
|
3682
|
-
|
|
3707
|
+
options: simulations.map((sim) => {
|
|
3708
|
+
const resourceTitle = sim.resource.title || sim.resource.name;
|
|
3709
|
+
const toolTitle = sim.tool.title || sim.tool.name;
|
|
3710
|
+
return {
|
|
3711
|
+
value: getSimulationKey(sim),
|
|
3712
|
+
label: `${resourceTitle}: ${toolTitle}`
|
|
3713
|
+
};
|
|
3714
|
+
})
|
|
3683
3715
|
}
|
|
3684
3716
|
) }),
|
|
3685
3717
|
/* @__PURE__ */ jsxRuntime.jsx(SidebarControl, { label: "Theme", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -3727,24 +3759,21 @@ function ChatGPTSimulator({
|
|
|
3727
3759
|
appIcon,
|
|
3728
3760
|
userMessage,
|
|
3729
3761
|
children: content
|
|
3730
|
-
}
|
|
3762
|
+
},
|
|
3763
|
+
selectedKey
|
|
3731
3764
|
)
|
|
3732
3765
|
}
|
|
3733
3766
|
) });
|
|
3734
3767
|
}
|
|
3735
3768
|
exports.ChatGPTSimulator = ChatGPTSimulator;
|
|
3736
3769
|
exports.SCREEN_WIDTHS = SCREEN_WIDTHS;
|
|
3737
|
-
exports.SET_GLOBALS_EVENT_TYPE = SET_GLOBALS_EVENT_TYPE;
|
|
3738
|
-
exports.SetGlobalsEvent = SetGlobalsEvent;
|
|
3739
3770
|
exports.ThemeProvider = ThemeProvider;
|
|
3740
3771
|
exports.cn = cn;
|
|
3741
3772
|
exports.getAPI = getAPI;
|
|
3742
3773
|
exports.getGlobal = getGlobal;
|
|
3743
|
-
exports.getOpenAiProvider = getOpenAiProvider;
|
|
3744
3774
|
exports.getProvider = getProvider;
|
|
3745
3775
|
exports.initMockOpenAI = initMockOpenAI;
|
|
3746
3776
|
exports.isHoverAvailable = isHoverAvailable;
|
|
3747
|
-
exports.isOpenAiAvailable = isOpenAiAvailable;
|
|
3748
3777
|
exports.isPrimarilyTouchDevice = isPrimarilyTouchDevice;
|
|
3749
3778
|
exports.isProviderAvailable = isProviderAvailable;
|
|
3750
3779
|
exports.prefersReducedMotion = prefersReducedMotion;
|