@vibes.diy/use-vibes-base 0.18.8 → 0.18.9-dev-vibes-refactor
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/components/ImgGen.js.map +1 -1
- package/constants.d.ts +0 -3
- package/constants.js +0 -3
- package/constants.js.map +1 -1
- package/hooks/image-gen/use-image-gen.js +0 -1
- package/hooks/image-gen/use-image-gen.js.map +1 -1
- package/hooks/useMobile.d.ts +1 -0
- package/hooks/useMobile.js +20 -0
- package/hooks/useMobile.js.map +1 -0
- package/hooks/useThemeDetection.d.ts +1 -0
- package/hooks/useThemeDetection.js +15 -0
- package/hooks/useThemeDetection.js.map +1 -0
- package/hooks/vibes-gen/use-vibes.js +0 -2
- package/hooks/vibes-gen/use-vibes.js.map +1 -1
- package/index.d.ts +3 -18
- package/index.js +11 -119
- package/index.js.map +1 -1
- package/package.json +11 -10
- package/tsconfig.json +2 -0
- package/utils/vibe-control-styles.js +52 -11
- package/utils/vibe-control-styles.js.map +1 -1
- package/components/BrutalistCard/BrutalistCard.d.ts +0 -9
- package/components/BrutalistCard/BrutalistCard.js +0 -24
- package/components/BrutalistCard/BrutalistCard.js.map +0 -1
- package/components/BrutalistCard/BrutalistCard.styles.d.ts +0 -4
- package/components/BrutalistCard/BrutalistCard.styles.js +0 -73
- package/components/BrutalistCard/BrutalistCard.styles.js.map +0 -1
- package/components/BrutalistCard/index.d.ts +0 -3
- package/components/BrutalistCard/index.js +0 -2
- package/components/BrutalistCard/index.js.map +0 -1
- package/components/HiddenMenuWrapper/HiddenMenuWrapper.d.ts +0 -8
- package/components/HiddenMenuWrapper/HiddenMenuWrapper.js +0 -181
- package/components/HiddenMenuWrapper/HiddenMenuWrapper.js.map +0 -1
- package/components/HiddenMenuWrapper/HiddenMenuWrapper.styles.d.ts +0 -31
- package/components/HiddenMenuWrapper/HiddenMenuWrapper.styles.js +0 -86
- package/components/HiddenMenuWrapper/HiddenMenuWrapper.styles.js.map +0 -1
- package/components/ImgGen.css +0 -675
- package/components/VibeControl.d.ts +0 -13
- package/components/VibeControl.js +0 -74
- package/components/VibeControl.js.map +0 -1
- package/components/VibesButton/VibesButton.d.ts +0 -10
- package/components/VibesButton/VibesButton.js +0 -37
- package/components/VibesButton/VibesButton.js.map +0 -1
- package/components/VibesButton/VibesButton.styles.d.ts +0 -6
- package/components/VibesButton/VibesButton.styles.js +0 -32
- package/components/VibesButton/VibesButton.styles.js.map +0 -1
- package/components/VibesPanel/VibesPanel.d.ts +0 -8
- package/components/VibesPanel/VibesPanel.js +0 -119
- package/components/VibesPanel/VibesPanel.js.map +0 -1
- package/components/VibesPanel/index.d.ts +0 -1
- package/components/VibesPanel/index.js +0 -2
- package/components/VibesPanel/index.js.map +0 -1
- package/components/VibesSwitch/VibesSwitch.d.ts +0 -6
- package/components/VibesSwitch/VibesSwitch.js +0 -54
- package/components/VibesSwitch/VibesSwitch.js.map +0 -1
- package/components/VibesSwitch/VibesSwitch.styles.d.ts +0 -4
- package/components/VibesSwitch/VibesSwitch.styles.js +0 -5
- package/components/VibesSwitch/VibesSwitch.styles.js.map +0 -1
- package/events.d.ts +0 -7
- package/events.js +0 -4
- package/events.js.map +0 -1
- package/hooks/use-image-gen.d.ts +0 -1
- package/hooks/use-image-gen.js +0 -2
- package/hooks/use-image-gen.js.map +0 -1
- package/mounting/index.d.ts +0 -4
- package/mounting/index.js +0 -4
- package/mounting/index.js.map +0 -1
- package/mounting/mountVibeCode.d.ts +0 -15
- package/mounting/mountVibeCode.js +0 -66
- package/mounting/mountVibeCode.js.map +0 -1
- package/mounting/mountVibeWithCleanup.d.ts +0 -1
- package/mounting/mountVibeWithCleanup.js +0 -55
- package/mounting/mountVibeWithCleanup.js.map +0 -1
- package/mounting/types.d.ts +0 -10
- package/mounting/types.js +0 -7
- package/mounting/types.js.map +0 -1
- package/stories/VibeControl.stories.d.ts +0 -13
- package/stories/VibeControl.stories.js +0 -195
- package/stories/VibeControl.stories.js.map +0 -1
- package/vibe-app-mount.d.ts +0 -13
- package/vibe-app-mount.js +0 -39
- package/vibe-app-mount.js.map +0 -1
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
import { ResolveOnce } from '@adviser/cement';
|
|
2
|
-
import { mountVibeCode } from './mountVibeCode.js';
|
|
3
|
-
import { isVibesMountReadyEvent, isVibesMountErrorEvent } from './types.js';
|
|
4
|
-
export async function mountVibeWithCleanup(code, containerId, titleId, installId, transformImports, showVibesSwitch = true, apiKey, chatUrl, imgUrl) {
|
|
5
|
-
return new Promise((resolve) => {
|
|
6
|
-
const resolveOnce = new ResolveOnce();
|
|
7
|
-
let timeoutId = null;
|
|
8
|
-
const cleanup = () => {
|
|
9
|
-
document.removeEventListener('vibes-mount-ready', handleMountReady);
|
|
10
|
-
document.removeEventListener('vibes-mount-error', handleMountError);
|
|
11
|
-
if (timeoutId)
|
|
12
|
-
clearTimeout(timeoutId);
|
|
13
|
-
};
|
|
14
|
-
const handleMountReady = (event) => {
|
|
15
|
-
if (!isVibesMountReadyEvent(event))
|
|
16
|
-
return;
|
|
17
|
-
const { unmount, containerId: eventContainerId } = event.detail;
|
|
18
|
-
if (eventContainerId === containerId) {
|
|
19
|
-
resolveOnce.once(() => {
|
|
20
|
-
cleanup();
|
|
21
|
-
resolve(unmount);
|
|
22
|
-
});
|
|
23
|
-
}
|
|
24
|
-
};
|
|
25
|
-
const handleMountError = (event) => {
|
|
26
|
-
if (!isVibesMountErrorEvent(event))
|
|
27
|
-
return;
|
|
28
|
-
const { error: _error, containerId: eventContainerId } = event.detail;
|
|
29
|
-
if (eventContainerId === containerId) {
|
|
30
|
-
resolveOnce.once(() => {
|
|
31
|
-
cleanup();
|
|
32
|
-
resolve(() => {
|
|
33
|
-
});
|
|
34
|
-
});
|
|
35
|
-
}
|
|
36
|
-
};
|
|
37
|
-
timeoutId = setTimeout(() => {
|
|
38
|
-
resolveOnce.once(() => {
|
|
39
|
-
cleanup();
|
|
40
|
-
resolve(() => {
|
|
41
|
-
});
|
|
42
|
-
});
|
|
43
|
-
}, 5000);
|
|
44
|
-
document.addEventListener('vibes-mount-ready', handleMountReady);
|
|
45
|
-
document.addEventListener('vibes-mount-error', handleMountError);
|
|
46
|
-
mountVibeCode(code, containerId, titleId, installId, transformImports, showVibesSwitch, apiKey, chatUrl, imgUrl).catch((_err) => {
|
|
47
|
-
resolveOnce.once(() => {
|
|
48
|
-
cleanup();
|
|
49
|
-
resolve(() => {
|
|
50
|
-
});
|
|
51
|
-
});
|
|
52
|
-
});
|
|
53
|
-
});
|
|
54
|
-
}
|
|
55
|
-
//# sourceMappingURL=mountVibeWithCleanup.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"mountVibeWithCleanup.js","sourceRoot":"","sources":["../../jsr/mounting/mountVibeWithCleanup.ts"],"names":[],"mappings":"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"}
|
package/mounting/types.d.ts
DELETED
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
export interface VibesMountReadyDetail {
|
|
2
|
-
unmount(): void;
|
|
3
|
-
readonly containerId: string;
|
|
4
|
-
}
|
|
5
|
-
export interface VibesMountErrorDetail {
|
|
6
|
-
readonly error: string;
|
|
7
|
-
readonly containerId: string;
|
|
8
|
-
}
|
|
9
|
-
export declare function isVibesMountReadyEvent(event: Event): event is CustomEvent<VibesMountReadyDetail>;
|
|
10
|
-
export declare function isVibesMountErrorEvent(event: Event): event is CustomEvent<VibesMountErrorDetail>;
|
package/mounting/types.js
DELETED
package/mounting/types.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../jsr/mounting/types.ts"],"names":[],"mappings":"AAaA,MAAM,UAAU,sBAAsB,CAAC,KAAY,EAA+C;IAChG,OAAO,KAAK,CAAC,IAAI,KAAK,mBAAmB,CAAC;AAAA,CAC3C;AAED,MAAM,UAAU,sBAAsB,CAAC,KAAY,EAA+C;IAChG,OAAO,KAAK,CAAC,IAAI,KAAK,mBAAmB,CAAC;AAAA,CAC3C"}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
-
import type { VibeControlProps } from '../components/VibeControl.js';
|
|
3
|
-
declare const meta: Meta<VibeControlProps>;
|
|
4
|
-
export default meta;
|
|
5
|
-
type Story = StoryObj<VibeControlProps>;
|
|
6
|
-
export declare const Default: Story;
|
|
7
|
-
export declare const BottomLeft: Story;
|
|
8
|
-
export declare const TopRight: Story;
|
|
9
|
-
export declare const TopLeft: Story;
|
|
10
|
-
export declare const WithCustomContent: Story;
|
|
11
|
-
export declare const WithRichContent: Story;
|
|
12
|
-
export declare const Hidden: Story;
|
|
13
|
-
export declare const WithCustomStyling: Story;
|
|
@@ -1,195 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { VibeControl } from '../components/VibeControl.js';
|
|
3
|
-
const meta = {
|
|
4
|
-
title: 'Components/VibeControl',
|
|
5
|
-
component: VibeControl,
|
|
6
|
-
parameters: {
|
|
7
|
-
layout: 'fullscreen',
|
|
8
|
-
docs: {
|
|
9
|
-
description: {
|
|
10
|
-
component: `
|
|
11
|
-
A floating action button that opens a full-screen overlay. Perfect for adding controls, settings, or additional content that doesn't interfere with the main UI.
|
|
12
|
-
|
|
13
|
-
### Features
|
|
14
|
-
- **Configurable positioning** - Choose from 4 corner positions
|
|
15
|
-
- **Portal rendering** - Avoids z-index conflicts
|
|
16
|
-
- **Keyboard navigation** - Escape key to close
|
|
17
|
-
- **Custom content** - Any React children supported
|
|
18
|
-
- **Event callbacks** - onOpen/onClose integration hooks
|
|
19
|
-
- **Responsive design** - Works on mobile and desktop
|
|
20
|
-
`,
|
|
21
|
-
},
|
|
22
|
-
},
|
|
23
|
-
},
|
|
24
|
-
argTypes: {
|
|
25
|
-
position: {
|
|
26
|
-
control: { type: 'select' },
|
|
27
|
-
options: ['bottom-right', 'bottom-left', 'top-right', 'top-left'],
|
|
28
|
-
description: 'Position of the floating button',
|
|
29
|
-
},
|
|
30
|
-
label: {
|
|
31
|
-
control: { type: 'text' },
|
|
32
|
-
description: 'Text displayed on the button',
|
|
33
|
-
},
|
|
34
|
-
visible: {
|
|
35
|
-
control: { type: 'boolean' },
|
|
36
|
-
description: 'Whether to show the component',
|
|
37
|
-
},
|
|
38
|
-
onOpen: {
|
|
39
|
-
action: 'opened',
|
|
40
|
-
description: 'Callback when overlay opens',
|
|
41
|
-
},
|
|
42
|
-
onClose: {
|
|
43
|
-
action: 'closed',
|
|
44
|
-
description: 'Callback when overlay closes',
|
|
45
|
-
},
|
|
46
|
-
children: {
|
|
47
|
-
control: { type: 'text' },
|
|
48
|
-
description: 'Custom content for the overlay',
|
|
49
|
-
},
|
|
50
|
-
},
|
|
51
|
-
};
|
|
52
|
-
export default meta;
|
|
53
|
-
export const Default = {
|
|
54
|
-
args: {
|
|
55
|
-
label: 'Open Vibes',
|
|
56
|
-
position: 'bottom-right',
|
|
57
|
-
visible: true,
|
|
58
|
-
},
|
|
59
|
-
};
|
|
60
|
-
export const BottomLeft = {
|
|
61
|
-
args: {
|
|
62
|
-
label: 'Bottom Left',
|
|
63
|
-
position: 'bottom-left',
|
|
64
|
-
visible: true,
|
|
65
|
-
},
|
|
66
|
-
};
|
|
67
|
-
export const TopRight = {
|
|
68
|
-
args: {
|
|
69
|
-
label: 'Top Right',
|
|
70
|
-
position: 'top-right',
|
|
71
|
-
visible: true,
|
|
72
|
-
},
|
|
73
|
-
};
|
|
74
|
-
export const TopLeft = {
|
|
75
|
-
args: {
|
|
76
|
-
label: 'Top Left',
|
|
77
|
-
position: 'top-left',
|
|
78
|
-
visible: true,
|
|
79
|
-
},
|
|
80
|
-
};
|
|
81
|
-
export const WithCustomContent = {
|
|
82
|
-
args: {
|
|
83
|
-
label: 'Settings',
|
|
84
|
-
position: 'bottom-right',
|
|
85
|
-
visible: true,
|
|
86
|
-
children: (React.createElement("div", null,
|
|
87
|
-
React.createElement("h3", { style: { margin: '0 0 16px 0', fontSize: '24px', fontWeight: '700' } }, "Settings Panel"),
|
|
88
|
-
React.createElement("div", { style: { marginBottom: '16px' } },
|
|
89
|
-
React.createElement("label", { style: { display: 'block', marginBottom: '8px', fontWeight: '600' } }, "Theme Preference"),
|
|
90
|
-
React.createElement("select", { style: { width: '100%', padding: '8px', borderRadius: '4px', border: '1px solid #ccc' } },
|
|
91
|
-
React.createElement("option", null, "Light"),
|
|
92
|
-
React.createElement("option", null, "Dark"),
|
|
93
|
-
React.createElement("option", null, "Auto"))),
|
|
94
|
-
React.createElement("div", { style: { marginBottom: '16px' } },
|
|
95
|
-
React.createElement("label", { style: { display: 'flex', alignItems: 'center', gap: '8px' } },
|
|
96
|
-
React.createElement("input", { type: "checkbox", defaultChecked: true }),
|
|
97
|
-
React.createElement("span", null, "Enable notifications"))),
|
|
98
|
-
React.createElement("div", { style: { marginBottom: '16px' } },
|
|
99
|
-
React.createElement("label", { style: { display: 'flex', alignItems: 'center', gap: '8px' } },
|
|
100
|
-
React.createElement("input", { type: "checkbox" }),
|
|
101
|
-
React.createElement("span", null, "Auto-save changes"))),
|
|
102
|
-
React.createElement("div", { style: { display: 'flex', gap: '8px', marginTop: '20px' } },
|
|
103
|
-
React.createElement("button", { style: {
|
|
104
|
-
padding: '8px 16px',
|
|
105
|
-
backgroundColor: '#0066cc',
|
|
106
|
-
color: 'white',
|
|
107
|
-
border: 'none',
|
|
108
|
-
borderRadius: '4px',
|
|
109
|
-
cursor: 'pointer',
|
|
110
|
-
} }, "Save Changes"),
|
|
111
|
-
React.createElement("button", { style: {
|
|
112
|
-
padding: '8px 16px',
|
|
113
|
-
backgroundColor: '#f5f5f5',
|
|
114
|
-
color: '#333',
|
|
115
|
-
border: '1px solid #ccc',
|
|
116
|
-
borderRadius: '4px',
|
|
117
|
-
cursor: 'pointer',
|
|
118
|
-
} }, "Cancel")))),
|
|
119
|
-
},
|
|
120
|
-
};
|
|
121
|
-
export const WithRichContent = {
|
|
122
|
-
args: {
|
|
123
|
-
label: 'Help & Info',
|
|
124
|
-
position: 'bottom-right',
|
|
125
|
-
visible: true,
|
|
126
|
-
children: (React.createElement("div", null,
|
|
127
|
-
React.createElement("h3", { style: { margin: '0 0 16px 0', fontSize: '24px', fontWeight: '700' } }, "Welcome to VibeControl"),
|
|
128
|
-
React.createElement("div", { style: { marginBottom: '20px', lineHeight: '1.6' } },
|
|
129
|
-
React.createElement("p", null, "VibeControl provides a floating action button that opens rich overlay content. Perfect for settings, help content, or any additional functionality.")),
|
|
130
|
-
React.createElement("div", { style: {
|
|
131
|
-
marginBottom: '20px',
|
|
132
|
-
padding: '16px',
|
|
133
|
-
backgroundColor: '#f0f8ff',
|
|
134
|
-
borderRadius: '8px',
|
|
135
|
-
border: '1px solid #bbdefb',
|
|
136
|
-
} },
|
|
137
|
-
React.createElement("h4", { style: { margin: '0 0 8px 0', color: '#1976d2' } }, "Key Features"),
|
|
138
|
-
React.createElement("ul", { style: { margin: 0, paddingLeft: '20px', color: '#1976d2' } },
|
|
139
|
-
React.createElement("li", null, "Portal rendering avoids z-index issues"),
|
|
140
|
-
React.createElement("li", null, "Escape key and backdrop click to close"),
|
|
141
|
-
React.createElement("li", null, "Four corner position options"),
|
|
142
|
-
React.createElement("li", null, "Fully customizable overlay content"),
|
|
143
|
-
React.createElement("li", null, "Event callbacks for integration"))),
|
|
144
|
-
React.createElement("div", { style: {
|
|
145
|
-
marginBottom: '20px',
|
|
146
|
-
padding: '16px',
|
|
147
|
-
backgroundColor: '#f3e5f5',
|
|
148
|
-
borderRadius: '8px',
|
|
149
|
-
border: '1px solid #e1bee7',
|
|
150
|
-
} },
|
|
151
|
-
React.createElement("h4", { style: { margin: '0 0 8px 0', color: '#7b1fa2' } }, "Usage Examples"),
|
|
152
|
-
React.createElement("ul", { style: { margin: 0, paddingLeft: '20px', color: '#7b1fa2' } },
|
|
153
|
-
React.createElement("li", null, "Application settings and preferences"),
|
|
154
|
-
React.createElement("li", null, "User help and documentation"),
|
|
155
|
-
React.createElement("li", null, "Additional navigation or tools"),
|
|
156
|
-
React.createElement("li", null, "Context-sensitive controls"))),
|
|
157
|
-
React.createElement("button", { style: {
|
|
158
|
-
width: '100%',
|
|
159
|
-
padding: '12px',
|
|
160
|
-
backgroundColor: '#4caf50',
|
|
161
|
-
color: 'white',
|
|
162
|
-
border: 'none',
|
|
163
|
-
borderRadius: '4px',
|
|
164
|
-
fontSize: '16px',
|
|
165
|
-
cursor: 'pointer',
|
|
166
|
-
}, onClick: () => alert('Action triggered!') }, "Try It Out!"))),
|
|
167
|
-
},
|
|
168
|
-
};
|
|
169
|
-
export const Hidden = {
|
|
170
|
-
args: {
|
|
171
|
-
label: "This Won't Show",
|
|
172
|
-
position: 'bottom-right',
|
|
173
|
-
visible: false,
|
|
174
|
-
},
|
|
175
|
-
};
|
|
176
|
-
export const WithCustomStyling = {
|
|
177
|
-
args: {
|
|
178
|
-
label: '🎨 Styled',
|
|
179
|
-
position: 'bottom-right',
|
|
180
|
-
visible: true,
|
|
181
|
-
classes: {
|
|
182
|
-
button: 'custom-button',
|
|
183
|
-
backdrop: 'custom-backdrop',
|
|
184
|
-
overlay: 'custom-overlay',
|
|
185
|
-
overlayTitle: 'custom-title',
|
|
186
|
-
closeButton: 'custom-close',
|
|
187
|
-
content: 'custom-content',
|
|
188
|
-
},
|
|
189
|
-
children: (React.createElement("div", null,
|
|
190
|
-
React.createElement("h3", null, "Custom Styled Overlay"),
|
|
191
|
-
React.createElement("p", null, "This example shows how you can customize the styling using CSS classes."),
|
|
192
|
-
React.createElement("p", null, "You can override the default styles by providing custom classes for each element of the component."))),
|
|
193
|
-
},
|
|
194
|
-
};
|
|
195
|
-
//# sourceMappingURL=VibeControl.stories.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"VibeControl.stories.js","sourceRoot":"","sources":["../../jsr/stories/VibeControl.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAG3D,MAAM,IAAI,GAA2B;IACnC,KAAK,EAAE,wBAAwB;IAC/B,SAAS,EAAE,WAAW;IACtB,UAAU,EAAE;QACV,MAAM,EAAE,YAAY;QACpB,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE;;;;;;;;;;SAUV;aACF;SACF;KACF;IACD,QAAQ,EAAE;QACR,QAAQ,EAAE;YACR,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;YAC3B,OAAO,EAAE,CAAC,cAAc,EAAE,aAAa,EAAE,WAAW,EAAE,UAAU,CAAC;YACjE,WAAW,EAAE,iCAAiC;SAC/C;QACD,KAAK,EAAE;YACL,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;YACzB,WAAW,EAAE,8BAA8B;SAC5C;QACD,OAAO,EAAE;YACP,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE;YAC5B,WAAW,EAAE,+BAA+B;SAC7C;QACD,MAAM,EAAE;YACN,MAAM,EAAE,QAAQ;YAChB,WAAW,EAAE,6BAA6B;SAC3C;QACD,OAAO,EAAE;YACP,MAAM,EAAE,QAAQ;YAChB,WAAW,EAAE,8BAA8B;SAC5C;QACD,QAAQ,EAAE;YACR,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;YACzB,WAAW,EAAE,gCAAgC;SAC9C;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE;QACJ,KAAK,EAAE,YAAY;QACnB,QAAQ,EAAE,cAAc;QACxB,OAAO,EAAE,IAAI;KACd;CACF,CAAC;AAGF,MAAM,CAAC,MAAM,UAAU,GAAU;IAC/B,IAAI,EAAE;QACJ,KAAK,EAAE,aAAa;QACpB,QAAQ,EAAE,aAAa;QACvB,OAAO,EAAE,IAAI;KACd;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC7B,IAAI,EAAE;QACJ,KAAK,EAAE,WAAW;QAClB,QAAQ,EAAE,WAAW;QACrB,OAAO,EAAE,IAAI;KACd;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE;QACJ,KAAK,EAAE,UAAU;QACjB,QAAQ,EAAE,UAAU;QACpB,OAAO,EAAE,IAAI;KACd;CACF,CAAC;AAGF,MAAM,CAAC,MAAM,iBAAiB,GAAU;IACtC,IAAI,EAAE;QACJ,KAAK,EAAE,UAAU;QACjB,QAAQ,EAAE,cAAc;QACxB,OAAO,EAAE,IAAI;QACb,QAAQ,EAAE,CACR;YACE,4BAAI,KAAK,EAAE,EAAE,MAAM,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,qBAEnE;YACL,6BAAK,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,EAAE;gBAClC,+BAAO,KAAK,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,uBAElE;gBACR,gCACE,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,EAAE,gBAAgB,EAAE;oBAEvF,4CAAsB;oBACtB,2CAAqB;oBACrB,2CAAqB,CACd,CACL;YACN,6BAAK,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,EAAE;gBAClC,+BAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,KAAK,EAAE;oBACjE,+BAAO,IAAI,EAAC,UAAU,EAAC,cAAc,SAAG;oBACxC,yDAAiC,CAC3B,CACJ;YACN,6BAAK,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,EAAE;gBAClC,+BAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,KAAK,EAAE;oBACjE,+BAAO,IAAI,EAAC,UAAU,GAAG;oBACzB,sDAA8B,CACxB,CACJ;YACN,6BAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE;gBAC5D,gCACE,KAAK,EAAE;wBACL,OAAO,EAAE,UAAU;wBACnB,eAAe,EAAE,SAAS;wBAC1B,KAAK,EAAE,OAAO;wBACd,MAAM,EAAE,MAAM;wBACd,YAAY,EAAE,KAAK;wBACnB,MAAM,EAAE,SAAS;qBAClB,mBAGM;gBACT,gCACE,KAAK,EAAE;wBACL,OAAO,EAAE,UAAU;wBACnB,eAAe,EAAE,SAAS;wBAC1B,KAAK,EAAE,MAAM;wBACb,MAAM,EAAE,gBAAgB;wBACxB,YAAY,EAAE,KAAK;wBACnB,MAAM,EAAE,SAAS;qBAClB,aAGM,CACL,CACF,CACP;KACF;CACF,CAAC;AAGF,MAAM,CAAC,MAAM,eAAe,GAAU;IACpC,IAAI,EAAE;QACJ,KAAK,EAAE,aAAa;QACpB,QAAQ,EAAE,cAAc;QACxB,OAAO,EAAE,IAAI;QACb,QAAQ,EAAE,CACR;YACE,4BAAI,KAAK,EAAE,EAAE,MAAM,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,6BAEnE;YACL,6BAAK,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE;gBACrD,qLAGI,CACA;YAEN,6BACE,KAAK,EAAE;oBACL,YAAY,EAAE,MAAM;oBACpB,OAAO,EAAE,MAAM;oBACf,eAAe,EAAE,SAAS;oBAC1B,YAAY,EAAE,KAAK;oBACnB,MAAM,EAAE,mBAAmB;iBAC5B;gBAED,4BAAI,KAAK,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,SAAS,EAAE,mBAAmB;gBACvE,4BAAI,KAAK,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,WAAW,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE;oBAC7D,yEAA+C;oBAC/C,yEAA+C;oBAC/C,+DAAqC;oBACrC,qEAA2C;oBAC3C,kEAAwC,CACrC,CACD;YAEN,6BACE,KAAK,EAAE;oBACL,YAAY,EAAE,MAAM;oBACpB,OAAO,EAAE,MAAM;oBACf,eAAe,EAAE,SAAS;oBAC1B,YAAY,EAAE,KAAK;oBACnB,MAAM,EAAE,mBAAmB;iBAC5B;gBAED,4BAAI,KAAK,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,SAAS,EAAE,qBAAqB;gBACzE,4BAAI,KAAK,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,WAAW,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE;oBAC7D,uEAA6C;oBAC7C,8DAAoC;oBACpC,iEAAuC;oBACvC,6DAAmC,CAChC,CACD;YAEN,gCACE,KAAK,EAAE;oBACL,KAAK,EAAE,MAAM;oBACb,OAAO,EAAE,MAAM;oBACf,eAAe,EAAE,SAAS;oBAC1B,KAAK,EAAE,OAAO;oBACd,MAAM,EAAE,MAAM;oBACd,YAAY,EAAE,KAAK;oBACnB,QAAQ,EAAE,MAAM;oBAChB,MAAM,EAAE,SAAS;iBAClB,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,mBAAmB,CAAC,kBAGlC,CACL,CACP;KACF;CACF,CAAC;AAGF,MAAM,CAAC,MAAM,MAAM,GAAU;IAC3B,IAAI,EAAE;QACJ,KAAK,EAAE,iBAAiB;QACxB,QAAQ,EAAE,cAAc;QACxB,OAAO,EAAE,KAAK;KACf;CACF,CAAC;AAGF,MAAM,CAAC,MAAM,iBAAiB,GAAU;IACtC,IAAI,EAAE;QACJ,KAAK,EAAE,aAAU;QACjB,QAAQ,EAAE,cAAc;QACxB,OAAO,EAAE,IAAI;QACb,OAAO,EAAE;YACP,MAAM,EAAE,eAAe;YACvB,QAAQ,EAAE,iBAAiB;YAC3B,OAAO,EAAE,gBAAgB;YACzB,YAAY,EAAE,cAAc;YAC5B,WAAW,EAAE,cAAc;YAC3B,OAAO,EAAE,gBAAgB;SAC1B;QACD,QAAQ,EAAE,CACR;YACE,wDAA8B;YAC9B,yGAA8E;YAC9E,oIAGI,CACA,CACP;KACF;CACF,CAAC"}
|
package/vibe-app-mount.d.ts
DELETED
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { type VibeMetadata } from './contexts/VibeContext.js';
|
|
3
|
-
export interface MountVibesAppOptions {
|
|
4
|
-
readonly container: HTMLElement;
|
|
5
|
-
readonly appComponent?: React.ComponentType;
|
|
6
|
-
readonly showVibesSwitch?: boolean;
|
|
7
|
-
readonly vibeMetadata?: VibeMetadata;
|
|
8
|
-
}
|
|
9
|
-
export interface MountVibesAppResult {
|
|
10
|
-
unmount: () => void;
|
|
11
|
-
getContainer: () => HTMLElement;
|
|
12
|
-
}
|
|
13
|
-
export declare function mountVibesApp(options: MountVibesAppOptions): MountVibesAppResult;
|
package/vibe-app-mount.js
DELETED
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import * as ReactDOM from 'react-dom/client';
|
|
3
|
-
import { HiddenMenuWrapper } from './components/HiddenMenuWrapper/HiddenMenuWrapper.js';
|
|
4
|
-
import { VibesPanel } from './components/VibesPanel/VibesPanel.js';
|
|
5
|
-
import { VibeContextProvider, validateVibeMetadata, VibeMetadataValidationError, } from './contexts/VibeContext.js';
|
|
6
|
-
function VibesApp({ showVibesSwitch = true, vibeMetadata, children, }) {
|
|
7
|
-
const content = showVibesSwitch ? (React.createElement(HiddenMenuWrapper, { menuContent: React.createElement(VibesPanel, null), showVibesSwitch: true }, children)) : (React.createElement(React.Fragment, null, children));
|
|
8
|
-
if (vibeMetadata) {
|
|
9
|
-
return React.createElement(VibeContextProvider, { metadata: vibeMetadata }, content);
|
|
10
|
-
}
|
|
11
|
-
return content;
|
|
12
|
-
}
|
|
13
|
-
export function mountVibesApp(options) {
|
|
14
|
-
const { container, appComponent, showVibesSwitch, vibeMetadata } = options;
|
|
15
|
-
if (vibeMetadata) {
|
|
16
|
-
try {
|
|
17
|
-
validateVibeMetadata(vibeMetadata);
|
|
18
|
-
}
|
|
19
|
-
catch (error) {
|
|
20
|
-
if (error instanceof VibeMetadataValidationError) {
|
|
21
|
-
throw new Error(`Failed to mount Vibes app: ${error.message} (code: ${error.code}). ` +
|
|
22
|
-
`Received vibeMetadata: ${JSON.stringify(vibeMetadata)}`);
|
|
23
|
-
}
|
|
24
|
-
throw error;
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
const root = ReactDOM.createRoot(container);
|
|
28
|
-
const AppComponent = appComponent;
|
|
29
|
-
root.render(React.createElement(VibesApp, { ...(showVibesSwitch !== undefined && { showVibesSwitch }), ...(vibeMetadata !== undefined && { vibeMetadata }) }, AppComponent && React.createElement(AppComponent, null)));
|
|
30
|
-
return {
|
|
31
|
-
unmount: () => {
|
|
32
|
-
setTimeout(() => {
|
|
33
|
-
root.unmount();
|
|
34
|
-
}, 0);
|
|
35
|
-
},
|
|
36
|
-
getContainer: () => container,
|
|
37
|
-
};
|
|
38
|
-
}
|
|
39
|
-
//# sourceMappingURL=vibe-app-mount.js.map
|
package/vibe-app-mount.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"vibe-app-mount.js","sourceRoot":"","sources":["../jsr/vibe-app-mount.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,QAAQ,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,iBAAiB,EAAE,MAAM,qDAAqD,CAAC;AACxF,OAAO,EAAE,UAAU,EAAE,MAAM,uCAAuC,CAAC;AACnE,OAAO,EACL,mBAAmB,EAEnB,oBAAoB,EACpB,2BAA2B,GAC5B,MAAM,2BAA2B,CAAC;AAmBnC,SAAS,QAAQ,CAAC,EAChB,eAAe,GAAG,IAAI,EACtB,YAAY,EACZ,QAAQ,GAKT,EAAE;IAID,MAAM,OAAO,GAAG,eAAe,CAAC,CAAC,CAAC,CAChC,oBAAC,iBAAiB,IAAC,WAAW,EAAE,oBAAC,UAAU,OAAG,EAAE,eAAe,EAAE,IAAI,IAClE,QAAQ,CACS,CACrB,CAAC,CAAC,CAAC,CACF,0CAAG,QAAQ,CAAI,CAChB,CAAC;IAGF,IAAI,YAAY,EAAE,CAAC;QACjB,OAAO,oBAAC,mBAAmB,IAAC,QAAQ,EAAE,YAAY,IAAG,OAAO,CAAuB,CAAC;IACtF,CAAC;IAED,OAAO,OAAO,CAAC;AAAA,CAChB;AAED,MAAM,UAAU,aAAa,CAAC,OAA6B,EAAuB;IAChF,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,eAAe,EAAE,YAAY,EAAE,GAAG,OAAO,CAAC;IAG3E,IAAI,YAAY,EAAE,CAAC;QACjB,IAAI,CAAC;YACH,oBAAoB,CAAC,YAAY,CAAC,CAAC;QACrC,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,IAAI,KAAK,YAAY,2BAA2B,EAAE,CAAC;gBACjD,MAAM,IAAI,KAAK,CACb,8BAA8B,KAAK,CAAC,OAAO,WAAW,KAAK,CAAC,IAAI,KAAK;oBACnE,0BAA0B,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,EAAE,CAC3D,CAAC;YACJ,CAAC;YACD,MAAM,KAAK,CAAC;QACd,CAAC;IACH,CAAC;IAED,MAAM,IAAI,GAAG,QAAQ,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC;IAE5C,MAAM,YAAY,GAAG,YAAY,CAAC;IAElC,IAAI,CAAC,MAAM,CACT,oBAAC,QAAQ,OACH,CAAC,eAAe,KAAK,SAAS,IAAI,EAAE,eAAe,EAAE,CAAC,KACtD,CAAC,YAAY,KAAK,SAAS,IAAI,EAAE,YAAY,EAAE,CAAC,IAEnD,YAAY,IAAI,oBAAC,YAAY,OAAG,CACxB,CACZ,CAAC;IAEF,OAAO;QACL,OAAO,EAAE,GAAG,EAAE,CAAC;YACb,UAAU,CAAC,GAAG,EAAE,CAAC;gBACf,IAAI,CAAC,OAAO,EAAE,CAAC;YAAA,CAChB,EAAE,CAAC,CAAC,CAAC;QAAA,CACP;QAED,YAAY,EAAE,GAAG,EAAE,CAAC,SAAS;KAC9B,CAAC;AAAA,CACH"}
|