artifactuse 0.2.2 → 0.2.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/README.md +1 -0
- package/dist/core/index.d.ts +4 -0
- package/dist/core/state.d.ts +2 -0
- package/dist/{index-INYOxlcg.js → index-B4BEvWtI.js} +520 -504
- package/dist/index.js +1 -1
- package/dist/react/index.js +392 -389
- package/dist/svelte/index.d.ts +15 -0
- package/dist/svelte/index.js +1436 -1415
- package/dist/vue/index.d.ts +12 -0
- package/dist/vue/index.js +1143 -1129
- package/dist/vue2/composables.d.ts +12 -0
- package/dist/vue2/index.js +118 -29
- package/package.json +1 -1
package/dist/react/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import e, { useState as w, useMemo as C, useCallback as p, useRef as B, useEffect as z, createContext as
|
|
2
|
-
import { g as Ue, f as ht, a as at, b as rt, n as Rt, i as pt, c as qt, D as gt, d as Dt } from "../index-
|
|
1
|
+
import e, { useState as w, useMemo as C, useCallback as p, useRef as B, useEffect as z, createContext as Wt, useContext as zt } from "react";
|
|
2
|
+
import { g as Ue, f as ht, a as at, b as rt, n as Rt, i as pt, c as qt, D as gt, d as Dt } from "../index-B4BEvWtI.js";
|
|
3
3
|
import { J as Ut } from "../jszip.min-CdmYyw5L.js";
|
|
4
4
|
import { createPortal as jt } from "react-dom";
|
|
5
5
|
function Ot({
|
|
@@ -7,15 +7,15 @@ function Ot({
|
|
|
7
7
|
isActive: a = !1,
|
|
8
8
|
onOpen: l,
|
|
9
9
|
onCopy: n,
|
|
10
|
-
onDownload:
|
|
11
|
-
className:
|
|
10
|
+
onDownload: o,
|
|
11
|
+
className: u = ""
|
|
12
12
|
}) {
|
|
13
|
-
const [
|
|
13
|
+
const [i, r] = w(!1), x = C(() => Ue(t.language), [t.language]), m = C(() => {
|
|
14
14
|
var c;
|
|
15
15
|
return ht(t.size || ((c = t.code) == null ? void 0 : c.length) || 0);
|
|
16
|
-
}, [t.size, t.code]), k = C(() => at(t.language), [t.language]),
|
|
16
|
+
}, [t.size, t.code]), k = C(() => at(t.language), [t.language]), T = p((c) => {
|
|
17
17
|
c.stopPropagation(), l && l(t);
|
|
18
|
-
}, [t, l]),
|
|
18
|
+
}, [t, l]), M = p(async (c) => {
|
|
19
19
|
c.stopPropagation();
|
|
20
20
|
try {
|
|
21
21
|
await navigator.clipboard.writeText(t.code), r(!0), n && n(t), setTimeout(() => {
|
|
@@ -36,14 +36,14 @@ function Ot({
|
|
|
36
36
|
}, [t, n]), $ = p((c) => {
|
|
37
37
|
var q;
|
|
38
38
|
c.stopPropagation();
|
|
39
|
-
const E = new Blob([t.code], { type: "text/plain" }), g = URL.createObjectURL(E), D = document.createElement("a"), J = rt(t.language),
|
|
40
|
-
D.href = g, D.download = `${
|
|
41
|
-
}, [t,
|
|
39
|
+
const E = new Blob([t.code], { type: "text/plain" }), g = URL.createObjectURL(E), D = document.createElement("a"), J = rt(t.language), A = ((q = t.title) == null ? void 0 : q.replace(/[^a-z0-9]/gi, "_").toLowerCase()) || "code";
|
|
40
|
+
D.href = g, D.download = `${A}.${J}`, document.body.appendChild(D), D.click(), document.body.removeChild(D), URL.revokeObjectURL(g), o && o(t);
|
|
41
|
+
}, [t, o]), h = [
|
|
42
42
|
"artifactuse-card",
|
|
43
43
|
a && "artifactuse-card--active",
|
|
44
|
-
|
|
44
|
+
u
|
|
45
45
|
].filter(Boolean).join(" ");
|
|
46
|
-
return /* @__PURE__ */ e.createElement("div", { className: h, onClick:
|
|
46
|
+
return /* @__PURE__ */ e.createElement("div", { className: h, onClick: T }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-card__icon" }, /* @__PURE__ */ e.createElement(
|
|
47
47
|
"svg",
|
|
48
48
|
{
|
|
49
49
|
viewBox: "0 0 24 24",
|
|
@@ -52,14 +52,14 @@ function Ot({
|
|
|
52
52
|
strokeWidth: "1.5",
|
|
53
53
|
dangerouslySetInnerHTML: { __html: k }
|
|
54
54
|
}
|
|
55
|
-
)), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-card__content" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-card__title" }, t.title), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-card__meta" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-card__type" }, x), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-card__separator" }, "•"), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-card__size" },
|
|
55
|
+
)), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-card__content" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-card__title" }, t.title), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-card__meta" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-card__type" }, x), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-card__separator" }, "•"), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-card__size" }, m))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-card__actions" }, /* @__PURE__ */ e.createElement(
|
|
56
56
|
"button",
|
|
57
57
|
{
|
|
58
58
|
className: "artifactuse-card__action",
|
|
59
|
-
title:
|
|
60
|
-
onClick:
|
|
59
|
+
title: i ? "Copied!" : "Copy code",
|
|
60
|
+
onClick: M
|
|
61
61
|
},
|
|
62
|
-
|
|
62
|
+
i ? /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("polyline", { points: "20 6 9 17 4 12" })) : /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2", ry: "2" }), /* @__PURE__ */ e.createElement("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" }))
|
|
63
63
|
), /* @__PURE__ */ e.createElement(
|
|
64
64
|
"button",
|
|
65
65
|
{
|
|
@@ -74,15 +74,15 @@ function Jt(t) {
|
|
|
74
74
|
if (!t) return null;
|
|
75
75
|
const a = t.trim();
|
|
76
76
|
if (a.startsWith("#")) {
|
|
77
|
-
let
|
|
78
|
-
if (
|
|
79
|
-
const
|
|
80
|
-
if (!isNaN(
|
|
77
|
+
let o = a.slice(1);
|
|
78
|
+
if (o.length === 3 && (o = o.split("").map((u) => u + u).join("")), o.length === 6) {
|
|
79
|
+
const u = parseInt(o.slice(0, 2), 16), i = parseInt(o.slice(2, 4), 16), r = parseInt(o.slice(4, 6), 16);
|
|
80
|
+
if (!isNaN(u) && !isNaN(i) && !isNaN(r)) return `${u}, ${i}, ${r}`;
|
|
81
81
|
}
|
|
82
82
|
}
|
|
83
83
|
const l = a.match(/^rgba?\s*\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/i);
|
|
84
84
|
if (l) return `${l[1]}, ${l[2]}, ${l[3]}`;
|
|
85
|
-
const n = a.split(/[\s,]+/).map(Number).filter((
|
|
85
|
+
const n = a.split(/[\s,]+/).map(Number).filter((o) => !isNaN(o));
|
|
86
86
|
return n.length >= 3 ? `${n[0]}, ${n[1]}, ${n[2]}` : null;
|
|
87
87
|
}
|
|
88
88
|
function Et(t) {
|
|
@@ -96,54 +96,54 @@ function Zt({
|
|
|
96
96
|
onSubmit: a,
|
|
97
97
|
onCancel: l,
|
|
98
98
|
onReset: n,
|
|
99
|
-
onButtonClick:
|
|
100
|
-
className:
|
|
101
|
-
theme:
|
|
99
|
+
onButtonClick: o,
|
|
100
|
+
className: u = "",
|
|
101
|
+
theme: i = "dark",
|
|
102
102
|
accent: r = null,
|
|
103
103
|
initialState: x = "active"
|
|
104
104
|
// 'active' | 'submitted' | 'cancelled' | 'inactive'
|
|
105
105
|
}) {
|
|
106
106
|
var ne, Q, Ee;
|
|
107
|
-
const
|
|
107
|
+
const m = B(null), [k, T] = w(x), M = k !== "active", $ = k === "active" ? "" : `artifactuse-form--${k}`, h = C(() => {
|
|
108
108
|
try {
|
|
109
109
|
return JSON.parse(t.code);
|
|
110
110
|
} catch {
|
|
111
111
|
return { title: "Invalid Form", variant: "fields", data: { fields: [] } };
|
|
112
112
|
}
|
|
113
|
-
}, [t.code]), c = t.id || h.id || `form-${Date.now()}`, E = ((ne = h.data) == null ? void 0 : ne.fields) || [], g = h.title || "Form", D = C(() => E.some((d) => d.type === "buttons"), [E]), J = C(() => h.variant === "buttons" ? E : [], [h.variant, E]), [
|
|
113
|
+
}, [t.code]), c = t.id || h.id || `form-${Date.now()}`, E = ((ne = h.data) == null ? void 0 : ne.fields) || [], g = h.title || "Form", D = C(() => E.some((d) => d.type === "buttons"), [E]), J = C(() => h.variant === "buttons" ? E : [], [h.variant, E]), [A, q] = w(() => {
|
|
114
114
|
var L;
|
|
115
115
|
const d = {};
|
|
116
|
-
return E.forEach((
|
|
117
|
-
["buttons", "divider", "heading"].includes(
|
|
116
|
+
return E.forEach((_) => {
|
|
117
|
+
["buttons", "divider", "heading"].includes(_.type) || (_.defaultValue !== void 0 ? d[_.name] = _.defaultValue : _.type === "checkbox" ? d[_.name] = !1 : d[_.name] = "");
|
|
118
118
|
}), (L = h.data) != null && L.defaults && Object.assign(d, h.data.defaults), d;
|
|
119
|
-
}), [U, R] = w({}), [ae,
|
|
119
|
+
}), [U, R] = w({}), [ae, S] = w(!1);
|
|
120
120
|
z(() => {
|
|
121
|
-
|
|
121
|
+
T(x);
|
|
122
122
|
}, [x]), z(() => {
|
|
123
123
|
var L;
|
|
124
124
|
const d = {};
|
|
125
|
-
E.forEach((
|
|
126
|
-
["buttons", "divider", "heading"].includes(
|
|
125
|
+
E.forEach((_) => {
|
|
126
|
+
["buttons", "divider", "heading"].includes(_.type) || (_.defaultValue !== void 0 ? d[_.name] = _.defaultValue : _.type === "checkbox" ? d[_.name] = !1 : d[_.name] = "");
|
|
127
127
|
}), (L = h.data) != null && L.defaults && Object.assign(d, h.data.defaults), q(d), R({});
|
|
128
128
|
}, [t.code]), z(() => {
|
|
129
|
-
if (
|
|
129
|
+
if (m.current && (m.current.setAttribute("data-artifactuse-theme", i), r)) {
|
|
130
130
|
const d = Jt(r);
|
|
131
|
-
d &&
|
|
131
|
+
d && m.current.style.setProperty("--artifactuse-primary", d);
|
|
132
132
|
}
|
|
133
|
-
}, [
|
|
133
|
+
}, [i, r]);
|
|
134
134
|
const j = p((d) => {
|
|
135
|
-
|
|
136
|
-
}, []),
|
|
137
|
-
q((
|
|
138
|
-
const v = { ...
|
|
135
|
+
T(d);
|
|
136
|
+
}, []), ue = p((d, L) => {
|
|
137
|
+
q((_) => ({ ..._, [d]: L })), R((_) => {
|
|
138
|
+
const v = { ..._ };
|
|
139
139
|
return delete v[d], v;
|
|
140
140
|
});
|
|
141
141
|
}, []), re = p(() => {
|
|
142
|
-
var
|
|
142
|
+
var _;
|
|
143
143
|
const d = {};
|
|
144
144
|
E.forEach((v) => {
|
|
145
145
|
if (["buttons", "divider", "heading"].includes(v.type)) return;
|
|
146
|
-
const P =
|
|
146
|
+
const P = A[v.name];
|
|
147
147
|
if (v.required && !P && P !== 0 && P !== !1) {
|
|
148
148
|
d[v.name] = `${v.label || "This field"} is required`;
|
|
149
149
|
return;
|
|
@@ -165,28 +165,28 @@ function Zt({
|
|
|
165
165
|
return;
|
|
166
166
|
}
|
|
167
167
|
});
|
|
168
|
-
const L = (
|
|
168
|
+
const L = (_ = h.data) == null ? void 0 : _.validation;
|
|
169
169
|
return L && Object.entries(L).forEach(([v, P]) => {
|
|
170
170
|
if (d[v]) return;
|
|
171
|
-
const G =
|
|
171
|
+
const G = A[v];
|
|
172
172
|
P.pattern && G && (new RegExp(P.pattern).test(G) || (d[v] = P.message || `${v} is invalid`));
|
|
173
173
|
}), R(d), Object.keys(d).length === 0;
|
|
174
|
-
}, [E,
|
|
174
|
+
}, [E, A, (Q = h.data) == null ? void 0 : Q.validation]), de = p(() => {
|
|
175
175
|
var L;
|
|
176
176
|
const d = {};
|
|
177
|
-
E.forEach((
|
|
178
|
-
["buttons", "divider", "heading"].includes(
|
|
177
|
+
E.forEach((_) => {
|
|
178
|
+
["buttons", "divider", "heading"].includes(_.type) || (_.defaultValue !== void 0 ? d[_.name] = _.defaultValue : _.type === "checkbox" ? d[_.name] = !1 : d[_.name] = "");
|
|
179
179
|
}), (L = h.data) != null && L.defaults && Object.assign(d, h.data.defaults), q(d), R({});
|
|
180
180
|
}, [E, (Ee = h.data) == null ? void 0 : Ee.defaults]), fe = p((d) => {
|
|
181
|
-
d == null || d.preventDefault(), re() && (
|
|
181
|
+
d == null || d.preventDefault(), re() && (S(!0), a == null || a({
|
|
182
182
|
formId: c,
|
|
183
183
|
action: "submit",
|
|
184
|
-
values: { ...
|
|
184
|
+
values: { ...A },
|
|
185
185
|
timestamp: Date.now()
|
|
186
186
|
}), setTimeout(() => {
|
|
187
|
-
|
|
187
|
+
S(!1), j("submitted");
|
|
188
188
|
}, 300));
|
|
189
|
-
}, [c,
|
|
189
|
+
}, [c, A, a, re, j]), pe = p((d) => {
|
|
190
190
|
const L = d.action || "custom";
|
|
191
191
|
switch (L) {
|
|
192
192
|
case "submit":
|
|
@@ -212,33 +212,33 @@ function Zt({
|
|
|
212
212
|
break;
|
|
213
213
|
case "custom":
|
|
214
214
|
default:
|
|
215
|
-
|
|
215
|
+
o == null || o({
|
|
216
216
|
formId: c,
|
|
217
217
|
action: L,
|
|
218
218
|
buttonName: d.name || d.label,
|
|
219
219
|
buttonLabel: d.label,
|
|
220
|
-
values: { ...
|
|
220
|
+
values: { ...A },
|
|
221
221
|
timestamp: Date.now()
|
|
222
222
|
}), setTimeout(() => {
|
|
223
223
|
j("submitted");
|
|
224
224
|
}, 150);
|
|
225
225
|
break;
|
|
226
226
|
}
|
|
227
|
-
}, [c,
|
|
228
|
-
return
|
|
227
|
+
}, [c, A, fe, l, n, o, de, j]);
|
|
228
|
+
return M ? /* @__PURE__ */ e.createElement(
|
|
229
229
|
"div",
|
|
230
230
|
{
|
|
231
|
-
ref:
|
|
232
|
-
className: `artifactuse-inline-form artifactuse-form-${h.variant || "fields"} ${$} ${
|
|
233
|
-
"data-artifactuse-theme":
|
|
231
|
+
ref: m,
|
|
232
|
+
className: `artifactuse-inline-form artifactuse-form-${h.variant || "fields"} ${$} ${u}`,
|
|
233
|
+
"data-artifactuse-theme": i
|
|
234
234
|
},
|
|
235
235
|
/* @__PURE__ */ e.createElement("div", { className: "artifactuse-form-collapsed" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-form-collapsed-icon" }, k === "submitted" && /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ e.createElement("polyline", { points: "20 6 9 17 4 12" })), k === "cancelled" && /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ e.createElement("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), /* @__PURE__ */ e.createElement("line", { x1: "6", y1: "6", x2: "18", y2: "18" })), k === "inactive" && /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ e.createElement("line", { x1: "5", y1: "12", x2: "19", y2: "12" }))), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-form-collapsed-title" }, g))
|
|
236
236
|
) : h.variant === "buttons" ? /* @__PURE__ */ e.createElement(
|
|
237
237
|
"div",
|
|
238
238
|
{
|
|
239
|
-
ref:
|
|
240
|
-
className: `artifactuse-inline-form artifactuse-form-buttons ${
|
|
241
|
-
"data-artifactuse-theme":
|
|
239
|
+
ref: m,
|
|
240
|
+
className: `artifactuse-inline-form artifactuse-form-buttons ${u}`,
|
|
241
|
+
"data-artifactuse-theme": i
|
|
242
242
|
},
|
|
243
243
|
(h.title || h.description) && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-form-header" }, h.title && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-form-title" }, h.title), h.description && /* @__PURE__ */ e.createElement("p", { className: "artifactuse-form-description" }, h.description)),
|
|
244
244
|
/* @__PURE__ */ e.createElement("div", { className: "artifactuse-form-buttons" }, J.map((d, L) => /* @__PURE__ */ e.createElement(
|
|
@@ -256,9 +256,9 @@ function Zt({
|
|
|
256
256
|
) : /* @__PURE__ */ e.createElement(
|
|
257
257
|
"div",
|
|
258
258
|
{
|
|
259
|
-
ref:
|
|
260
|
-
className: `artifactuse-inline-form artifactuse-form-fields ${
|
|
261
|
-
"data-artifactuse-theme":
|
|
259
|
+
ref: m,
|
|
260
|
+
className: `artifactuse-inline-form artifactuse-form-fields ${u}`,
|
|
261
|
+
"data-artifactuse-theme": i
|
|
262
262
|
},
|
|
263
263
|
(h.title || h.description) && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-form-header" }, h.title && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-form-title" }, h.title), h.description && /* @__PURE__ */ e.createElement("p", { className: "artifactuse-form-description" }, h.description)),
|
|
264
264
|
/* @__PURE__ */ e.createElement("form", { onSubmit: fe, className: "artifactuse-form" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-form-fields" }, E.map((d, L) => /* @__PURE__ */ e.createElement(
|
|
@@ -267,10 +267,10 @@ function Zt({
|
|
|
267
267
|
key: d.name || L,
|
|
268
268
|
field: d,
|
|
269
269
|
formId: c,
|
|
270
|
-
value:
|
|
270
|
+
value: A[d.name],
|
|
271
271
|
error: U[d.name],
|
|
272
272
|
isSubmitting: ae,
|
|
273
|
-
onChange: (
|
|
273
|
+
onChange: (_) => ue(d.name, _),
|
|
274
274
|
onButtonAction: pe
|
|
275
275
|
}
|
|
276
276
|
))), !D && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-form-buttons artifactuse-form-buttons-default" }, /* @__PURE__ */ e.createElement(
|
|
@@ -293,20 +293,20 @@ function Zt({
|
|
|
293
293
|
)))
|
|
294
294
|
);
|
|
295
295
|
}
|
|
296
|
-
function Kt({ field: t, formId: a, value: l, error: n, isSubmitting:
|
|
296
|
+
function Kt({ field: t, formId: a, value: l, error: n, isSubmitting: o, onChange: u, onButtonAction: i }) {
|
|
297
297
|
const r = `${a}-${t.name}`;
|
|
298
298
|
if (t.type === "buttons")
|
|
299
|
-
return /* @__PURE__ */ e.createElement("div", { className: "artifactuse-form-buttons" }, (t.fields || []).map((
|
|
299
|
+
return /* @__PURE__ */ e.createElement("div", { className: "artifactuse-form-buttons" }, (t.fields || []).map((m, k) => /* @__PURE__ */ e.createElement(
|
|
300
300
|
"button",
|
|
301
301
|
{
|
|
302
|
-
key:
|
|
303
|
-
type:
|
|
304
|
-
className: `artifactuse-form-btn artifactuse-form-btn-${
|
|
305
|
-
onClick:
|
|
306
|
-
disabled:
|
|
302
|
+
key: m.name || m.label || k,
|
|
303
|
+
type: m.action === "submit" ? "submit" : "button",
|
|
304
|
+
className: `artifactuse-form-btn artifactuse-form-btn-${m.variant || "secondary"}`,
|
|
305
|
+
onClick: m.action !== "submit" ? () => i(m) : void 0,
|
|
306
|
+
disabled: m.disabled || m.action === "submit" && o
|
|
307
307
|
},
|
|
308
|
-
|
|
309
|
-
|
|
308
|
+
o && m.action === "submit" ? /* @__PURE__ */ e.createElement("span", { className: "artifactuse-form-btn-spinner" }) : m.icon ? /* @__PURE__ */ e.createElement("span", { className: "artifactuse-form-btn-icon", dangerouslySetInnerHTML: { __html: m.icon } }) : null,
|
|
309
|
+
o && m.action === "submit" ? "Submitting..." : m.label
|
|
310
310
|
)));
|
|
311
311
|
if (t.type === "divider")
|
|
312
312
|
return /* @__PURE__ */ e.createElement("div", { className: "artifactuse-form-divider" });
|
|
@@ -322,22 +322,22 @@ function Kt({ field: t, formId: a, value: l, error: n, isSubmitting: i, onChange
|
|
|
322
322
|
checked: l || !1,
|
|
323
323
|
disabled: t.disabled,
|
|
324
324
|
className: "artifactuse-checkbox",
|
|
325
|
-
onChange: (
|
|
325
|
+
onChange: (m) => u(m.target.checked)
|
|
326
326
|
}
|
|
327
327
|
), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-checkbox-text" }, t.label, t.required && /* @__PURE__ */ e.createElement("span", { className: "artifactuse-required" }, "*"))), t.helpText && /* @__PURE__ */ e.createElement("span", { className: "artifactuse-help-text" }, t.helpText), n && /* @__PURE__ */ e.createElement("span", { className: "artifactuse-error-text" }, n));
|
|
328
328
|
if (t.type === "radio")
|
|
329
|
-
return /* @__PURE__ */ e.createElement("div", { className: "artifactuse-form-field" }, t.label && /* @__PURE__ */ e.createElement("label", { className: "artifactuse-label" }, t.label, t.required && /* @__PURE__ */ e.createElement("span", { className: "artifactuse-required" }, "*")), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-radio-group" }, Et(t.options).map((
|
|
329
|
+
return /* @__PURE__ */ e.createElement("div", { className: "artifactuse-form-field" }, t.label && /* @__PURE__ */ e.createElement("label", { className: "artifactuse-label" }, t.label, t.required && /* @__PURE__ */ e.createElement("span", { className: "artifactuse-required" }, "*")), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-radio-group" }, Et(t.options).map((m) => /* @__PURE__ */ e.createElement("label", { key: m.value, className: "artifactuse-radio-label" }, /* @__PURE__ */ e.createElement(
|
|
330
330
|
"input",
|
|
331
331
|
{
|
|
332
332
|
type: "radio",
|
|
333
333
|
name: t.name,
|
|
334
|
-
value:
|
|
335
|
-
checked: l ===
|
|
336
|
-
disabled:
|
|
334
|
+
value: m.value,
|
|
335
|
+
checked: l === m.value,
|
|
336
|
+
disabled: m.disabled || t.disabled,
|
|
337
337
|
className: "artifactuse-radio",
|
|
338
|
-
onChange: () => m
|
|
338
|
+
onChange: () => u(m.value)
|
|
339
339
|
}
|
|
340
|
-
), /* @__PURE__ */ e.createElement("span", null,
|
|
340
|
+
), /* @__PURE__ */ e.createElement("span", null, m.label)))), t.helpText && /* @__PURE__ */ e.createElement("span", { className: "artifactuse-help-text" }, t.helpText), n && /* @__PURE__ */ e.createElement("span", { className: "artifactuse-error-text" }, n));
|
|
341
341
|
const x = () => Xt(t.type) ? /* @__PURE__ */ e.createElement(
|
|
342
342
|
"input",
|
|
343
343
|
{
|
|
@@ -349,7 +349,7 @@ function Kt({ field: t, formId: a, value: l, error: n, isSubmitting: i, onChange
|
|
|
349
349
|
disabled: t.disabled,
|
|
350
350
|
required: t.required,
|
|
351
351
|
className: "artifactuse-input",
|
|
352
|
-
onChange: (
|
|
352
|
+
onChange: (m) => u(t.type === "number" ? Number(m.target.value) : m.target.value)
|
|
353
353
|
}
|
|
354
354
|
) : t.type === "textarea" ? /* @__PURE__ */ e.createElement(
|
|
355
355
|
"textarea",
|
|
@@ -362,7 +362,7 @@ function Kt({ field: t, formId: a, value: l, error: n, isSubmitting: i, onChange
|
|
|
362
362
|
required: t.required,
|
|
363
363
|
rows: t.rows || 3,
|
|
364
364
|
className: "artifactuse-textarea",
|
|
365
|
-
onChange: (
|
|
365
|
+
onChange: (m) => u(m.target.value)
|
|
366
366
|
}
|
|
367
367
|
) : t.type === "select" ? /* @__PURE__ */ e.createElement(
|
|
368
368
|
"select",
|
|
@@ -373,10 +373,10 @@ function Kt({ field: t, formId: a, value: l, error: n, isSubmitting: i, onChange
|
|
|
373
373
|
disabled: t.disabled,
|
|
374
374
|
required: t.required,
|
|
375
375
|
className: "artifactuse-select",
|
|
376
|
-
onChange: (
|
|
376
|
+
onChange: (m) => u(m.target.value)
|
|
377
377
|
},
|
|
378
378
|
/* @__PURE__ */ e.createElement("option", { value: "" }, t.placeholder || "Select..."),
|
|
379
|
-
Et(t.options).map((
|
|
379
|
+
Et(t.options).map((m) => /* @__PURE__ */ e.createElement("option", { key: m.value, value: m.value, disabled: m.disabled }, m.label))
|
|
380
380
|
) : /* @__PURE__ */ e.createElement(
|
|
381
381
|
"input",
|
|
382
382
|
{
|
|
@@ -386,7 +386,7 @@ function Kt({ field: t, formId: a, value: l, error: n, isSubmitting: i, onChange
|
|
|
386
386
|
value: l || "",
|
|
387
387
|
disabled: t.disabled,
|
|
388
388
|
className: "artifactuse-input",
|
|
389
|
-
onChange: (
|
|
389
|
+
onChange: (m) => u(m.target.value)
|
|
390
390
|
}
|
|
391
391
|
);
|
|
392
392
|
return /* @__PURE__ */ e.createElement("div", { className: "artifactuse-form-field" }, /* @__PURE__ */ e.createElement("label", { htmlFor: r, className: "artifactuse-label" }, t.label, t.required && /* @__PURE__ */ e.createElement("span", { className: "artifactuse-required" }, "*")), x(), t.helpText && /* @__PURE__ */ e.createElement("span", { className: "artifactuse-help-text" }, t.helpText), n && /* @__PURE__ */ e.createElement("span", { className: "artifactuse-error-text" }, n));
|
|
@@ -407,60 +407,60 @@ const O = 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0
|
|
|
407
407
|
threads: "Threads",
|
|
408
408
|
tiktok: "TikTok",
|
|
409
409
|
youtube: "YouTube"
|
|
410
|
-
}, je = ({ type: t = "blue" }) => /* @__PURE__ */ e.createElement("svg", { className: `artifactuse-social-verified artifactuse-social-verified-${t}`, viewBox: "0 0 24 24", fill: "currentColor" }, /* @__PURE__ */ e.createElement("path", { d: "M22.25 12c0-1.43-.88-2.67-2.19-3.34.46-1.39.2-2.9-.81-3.91s-2.52-1.27-3.91-.81c-.66-1.31-1.91-2.19-3.34-2.19s-2.67.88-3.34 2.19c-1.39-.46-2.9-.2-3.91.81s-1.27 2.52-.81 3.91C2.63 9.33 1.75 10.57 1.75 12s.88 2.67 2.19 3.34c-.46 1.39-.2 2.9.81 3.91s2.52 1.27 3.91.81c.66 1.31 1.91 2.19 3.34 2.19s2.67-.88 3.34-2.19c1.39.46 2.9.2 3.91-.81s1.27-2.52.81-3.91c1.31-.67 2.19-1.91 2.19-3.34zm-11.71 4.2L6.8 12.46l1.41-1.42 2.26 2.26 4.8-5.23 1.47 1.36-6.2 6.77z" })),
|
|
410
|
+
}, je = ({ type: t = "blue" }) => /* @__PURE__ */ e.createElement("svg", { className: `artifactuse-social-verified artifactuse-social-verified-${t}`, viewBox: "0 0 24 24", fill: "currentColor" }, /* @__PURE__ */ e.createElement("path", { d: "M22.25 12c0-1.43-.88-2.67-2.19-3.34.46-1.39.2-2.9-.81-3.91s-2.52-1.27-3.91-.81c-.66-1.31-1.91-2.19-3.34-2.19s-2.67.88-3.34 2.19c-1.39-.46-2.9-.2-3.91.81s-1.27 2.52-.81 3.91C2.63 9.33 1.75 10.57 1.75 12s.88 2.67 2.19 3.34c-.46 1.39-.2 2.9.81 3.91s2.52 1.27 3.91.81c.66 1.31 1.91 2.19 3.34 2.19s2.67-.88 3.34-2.19c1.39.46 2.9.2 3.91-.81s1.27-2.52.81-3.91c1.31-.67 2.19-1.91 2.19-3.34zm-11.71 4.2L6.8 12.46l1.41-1.42 2.26 2.26 4.8-5.23 1.47 1.36-6.2 6.77z" })), V = (t) => t ? t >= 1e6 ? `${(t / 1e6).toFixed(1)}M` : t >= 1e3 ? `${(t / 1e3).toFixed(1)}K` : t.toString() : "0", st = (t) => {
|
|
411
411
|
try {
|
|
412
412
|
return new URL(t).hostname.replace("www.", "");
|
|
413
413
|
} catch {
|
|
414
414
|
return t;
|
|
415
415
|
}
|
|
416
|
-
},
|
|
416
|
+
}, Me = (t) => {
|
|
417
417
|
if (!t) return "";
|
|
418
418
|
let a = t.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">");
|
|
419
419
|
return a = a.replace(/\n/g, "<br>"), a = a.replace(/#(\w+)/g, '<span class="artifactuse-social-hashtag">#$1</span>'), a = a.replace(/@(\w+)/g, '<span class="artifactuse-social-mention">@$1</span>'), a;
|
|
420
420
|
}, vt = ({ author: t, content: a, engagement: l, meta: n }) => {
|
|
421
|
-
var
|
|
422
|
-
const
|
|
423
|
-
return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-header" }, /* @__PURE__ */ e.createElement("img", { src: t.avatar || O, alt: t.name, className: "artifactuse-social-avatar", onError: (
|
|
424
|
-
var
|
|
425
|
-
return /* @__PURE__ */ e.createElement("div", { key: k, className: "artifactuse-social-poll-option" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-poll-bar", style: { width: `${((
|
|
426
|
-
}), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-poll-meta" },
|
|
421
|
+
var i, r, x;
|
|
422
|
+
const o = a.media || [], u = l.likes || l.retweets || l.replies || l.views;
|
|
423
|
+
return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-header" }, /* @__PURE__ */ e.createElement("img", { src: t.avatar || O, alt: t.name, className: "artifactuse-social-avatar", onError: (m) => m.target.src = O }), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-author" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-author-name" }, /* @__PURE__ */ e.createElement("span", null, t.name), t.verified && /* @__PURE__ */ e.createElement(je, { type: t.verifiedType || "blue" })), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-author-meta" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-social-author-handle" }, t.handle), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-social-timestamp" }, "· ", n.timestamp || "Just now")))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-content" }, /* @__PURE__ */ e.createElement("p", { className: "artifactuse-social-text", dangerouslySetInnerHTML: { __html: Me(a.text) } }), o.length > 0 && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-media" }, /* @__PURE__ */ e.createElement("div", { className: `artifactuse-social-media-grid ${o.length === 1 ? "artifactuse-social-media-single" : ""}`, "data-count": o.length }, o.slice(0, 4).map((m, k) => /* @__PURE__ */ e.createElement("img", { key: k, src: m.url, alt: m.alt || "", onError: (T) => T.target.style.display = "none" })))), a.link && !o.length && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-link-card" }, a.link.image && /* @__PURE__ */ e.createElement("img", { src: a.link.image, alt: a.link.title, className: "artifactuse-social-link-image", onError: (m) => m.target.style.display = "none" }), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-link-info" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-link-domain" }, a.link.domain || st(a.link.url)), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-link-title" }, a.link.title), a.link.description && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-link-description" }, a.link.description))), a.poll && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-poll" }, a.poll.options.map((m, k) => {
|
|
424
|
+
var T, M;
|
|
425
|
+
return /* @__PURE__ */ e.createElement("div", { key: k, className: "artifactuse-social-poll-option" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-poll-bar", style: { width: `${((T = a.poll.votes) == null ? void 0 : T[k]) || 0}%` } }), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-poll-label" }, /* @__PURE__ */ e.createElement("span", null, m), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-social-poll-percent" }, ((M = a.poll.votes) == null ? void 0 : M[k]) || 0, "%")));
|
|
426
|
+
}), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-poll-meta" }, V(a.poll.totalVotes || 0), " votes · ", a.poll.duration || "Poll ended")), a.quote && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-quote" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-quote-header" }, /* @__PURE__ */ e.createElement("img", { src: ((i = a.quote.author) == null ? void 0 : i.avatar) || O, className: "artifactuse-social-quote-avatar", alt: "" }), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-social-quote-author" }, (r = a.quote.author) == null ? void 0 : r.name), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-social-quote-handle" }, (x = a.quote.author) == null ? void 0 : x.handle)), /* @__PURE__ */ e.createElement("p", { className: "artifactuse-social-quote-text" }, a.quote.text))), u && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-engagement" }, /* @__PURE__ */ e.createElement("span", null, V(l.replies || 0), " replies"), /* @__PURE__ */ e.createElement("span", null, V(l.retweets || 0), " reposts"), /* @__PURE__ */ e.createElement("span", null, V(l.likes || 0), " likes"), /* @__PURE__ */ e.createElement("span", null, V(l.views || 0), " views")));
|
|
427
427
|
}, Gt = ({ author: t, content: a, engagement: l, meta: n }) => {
|
|
428
|
-
const
|
|
429
|
-
return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-header" }, /* @__PURE__ */ e.createElement("img", { src: t.avatar || O, alt: t.name, className: "artifactuse-social-avatar", onError: (
|
|
428
|
+
const o = l.likes || l.comments || l.shares || l.reposts;
|
|
429
|
+
return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-header" }, /* @__PURE__ */ e.createElement("img", { src: t.avatar || O, alt: t.name, className: "artifactuse-social-avatar", onError: (u) => u.target.src = O }), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-author-info" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-author-name" }, t.name, t.connection && /* @__PURE__ */ e.createElement("span", { className: "artifactuse-social-author-connection" }, "· ", t.connection)), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-author-headline" }, t.headline), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-timestamp" }, n.timestamp || "Just now", " · 🌐"))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-content" }, /* @__PURE__ */ e.createElement("p", { className: "artifactuse-social-text", dangerouslySetInnerHTML: { __html: Me(a.text) } }), a.link && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-link-card" }, a.link.image && /* @__PURE__ */ e.createElement("img", { src: a.link.image, alt: a.link.title, className: "artifactuse-social-link-image", onError: (u) => u.target.style.display = "none" }), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-link-info" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-link-title" }, a.link.title), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-link-domain" }, a.link.domain || st(a.link.url))))), o && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-engagement" }, /* @__PURE__ */ e.createElement("span", null, V(l.likes || 0), " reactions"), /* @__PURE__ */ e.createElement("span", null, V(l.comments || 0), " comments"), /* @__PURE__ */ e.createElement("span", null, V(l.shares || l.reposts || 0), " reposts")));
|
|
430
430
|
}, ea = ({ author: t, content: a, engagement: l, meta: n }) => {
|
|
431
|
-
const
|
|
432
|
-
return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-header" }, /* @__PURE__ */ e.createElement("img", { src: t.avatar || O, alt: t.name, className: "artifactuse-social-avatar", onError: (
|
|
431
|
+
const o = a.media || [];
|
|
432
|
+
return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-header" }, /* @__PURE__ */ e.createElement("img", { src: t.avatar || O, alt: t.name, className: "artifactuse-social-avatar", onError: (u) => u.target.src = O }), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-author" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-author-name" }, t.name, t.verified && /* @__PURE__ */ e.createElement(je, { type: "blue" })), n.location && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-location" }, n.location))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-media" }, o[0] ? /* @__PURE__ */ e.createElement("img", { src: o[0].url, alt: o[0].alt || "", onError: (u) => u.target.style.display = "none" }) : /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-media-placeholder" })), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-likes" }, V(l.likes || 0), " likes"), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-caption" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-social-caption-author" }, t.name), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-social-caption-text", dangerouslySetInnerHTML: { __html: Me(a.text) } })), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-timestamp" }, n.timestamp || "JUST NOW"));
|
|
433
433
|
}, ta = ({ author: t, content: a, engagement: l, meta: n }) => {
|
|
434
|
-
const
|
|
434
|
+
const o = a.media || [], u = C(() => {
|
|
435
435
|
const r = l.reactions || {};
|
|
436
|
-
return Object.values(r).reduce((x,
|
|
437
|
-
}, [l]),
|
|
438
|
-
return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-header" }, /* @__PURE__ */ e.createElement("img", { src: t.avatar || O, alt: t.name, className: "artifactuse-social-avatar", onError: (r) => r.target.src = O }), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-author" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-author-name" }, t.name), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-timestamp" }, n.timestamp || "Just now", " · 🌐"))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-content" }, /* @__PURE__ */ e.createElement("p", { className: "artifactuse-social-text", dangerouslySetInnerHTML: { __html:
|
|
436
|
+
return Object.values(r).reduce((x, m) => x + (m || 0), 0) || l.likes || 0;
|
|
437
|
+
}, [l]), i = l.likes || l.comments || l.shares || u;
|
|
438
|
+
return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-header" }, /* @__PURE__ */ e.createElement("img", { src: t.avatar || O, alt: t.name, className: "artifactuse-social-avatar", onError: (r) => r.target.src = O }), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-author" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-author-name" }, t.name), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-timestamp" }, n.timestamp || "Just now", " · 🌐"))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-content" }, /* @__PURE__ */ e.createElement("p", { className: "artifactuse-social-text", dangerouslySetInnerHTML: { __html: Me(a.text) } }), o.length > 0 && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-media" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-media-grid", "data-count": o.length }, o.slice(0, 4).map((r, x) => /* @__PURE__ */ e.createElement("img", { key: x, src: r.url, alt: r.alt || "", onError: (m) => m.target.style.display = "none" })))), a.link && !o.length && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-link-card" }, a.link.image && /* @__PURE__ */ e.createElement("img", { src: a.link.image, alt: a.link.title, className: "artifactuse-social-link-image", onError: (r) => r.target.style.display = "none" }), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-link-info" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-link-domain" }, a.link.domain || st(a.link.url)), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-link-title" }, a.link.title)))), i && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-engagement" }, /* @__PURE__ */ e.createElement("span", null, "👍❤️ ", V(u)), /* @__PURE__ */ e.createElement("span", null, V(l.comments || 0), " comments · ", V(l.shares || 0), " shares")));
|
|
439
439
|
}, aa = ({ author: t, content: a, engagement: l, meta: n }) => {
|
|
440
|
-
const
|
|
441
|
-
return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-header" }, /* @__PURE__ */ e.createElement("img", { src: t.avatar || O, alt: t.name, className: "artifactuse-social-avatar", onError: (
|
|
440
|
+
const o = l.likes || l.replies || l.reposts;
|
|
441
|
+
return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-header" }, /* @__PURE__ */ e.createElement("img", { src: t.avatar || O, alt: t.name, className: "artifactuse-social-avatar", onError: (u) => u.target.src = O }), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-author" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-author-name" }, t.name, t.verified && /* @__PURE__ */ e.createElement(je, { type: "blue" }))), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-social-timestamp" }, n.timestamp || "Just now")), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-content" }, /* @__PURE__ */ e.createElement("p", { className: "artifactuse-social-text", dangerouslySetInnerHTML: { __html: Me(a.text) } })), o && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-engagement" }, /* @__PURE__ */ e.createElement("span", null, V(l.likes || 0), " likes"), /* @__PURE__ */ e.createElement("span", null, V(l.replies || 0), " replies"), /* @__PURE__ */ e.createElement("span", null, V(l.reposts || 0), " reposts")));
|
|
442
442
|
}, ra = ({ author: t, content: a, engagement: l, meta: n }) => {
|
|
443
|
-
const
|
|
444
|
-
return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-thumbnail" },
|
|
443
|
+
const o = a.media || [], u = l.likes || l.comments || l.shares;
|
|
444
|
+
return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-thumbnail" }, o[0] ? /* @__PURE__ */ e.createElement("img", { src: o[0].url, alt: "Video thumbnail", onError: (i) => i.target.style.display = "none" }) : /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-thumbnail-placeholder" }), a.duration && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-duration" }, a.duration)), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-info" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-header" }, /* @__PURE__ */ e.createElement("img", { src: t.avatar || O, alt: t.name, className: "artifactuse-social-avatar", onError: (i) => i.target.src = O }), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-social-author-name" }, "@", t.name), t.verified && /* @__PURE__ */ e.createElement(je, { type: "blue" })), /* @__PURE__ */ e.createElement("p", { className: "artifactuse-social-text", dangerouslySetInnerHTML: { __html: Me(a.text) } }), a.sound && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-sound" }, "🎵 ", a.sound)), u && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-engagement" }, /* @__PURE__ */ e.createElement("span", null, V(l.likes || 0), " likes"), /* @__PURE__ */ e.createElement("span", null, V(l.comments || 0), " comments"), /* @__PURE__ */ e.createElement("span", null, V(l.shares || 0), " shares")));
|
|
445
445
|
}, sa = ({ author: t, content: a, engagement: l, meta: n }) => {
|
|
446
|
-
const
|
|
447
|
-
return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-thumbnail" },
|
|
446
|
+
const o = a.media || [];
|
|
447
|
+
return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-thumbnail" }, o[0] ? /* @__PURE__ */ e.createElement("img", { src: o[0].url, alt: "Video thumbnail", onError: (u) => u.target.style.display = "none" }) : /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-thumbnail-placeholder" }), a.duration && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-duration" }, a.duration)), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-info" }, /* @__PURE__ */ e.createElement("img", { src: t.avatar || O, alt: t.name, className: "artifactuse-social-avatar", onError: (u) => u.target.src = O }), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-details" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-title" }, a.title), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-channel" }, t.name), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-meta" }, V(l.views || 0), " views · ", n.timestamp || "Just now"))));
|
|
448
448
|
};
|
|
449
449
|
function na({ artifact: t, theme: a = "dark", onCopy: l }) {
|
|
450
|
-
const [n,
|
|
450
|
+
const [n, o] = w("Copy"), u = C(() => {
|
|
451
451
|
try {
|
|
452
452
|
return JSON.parse(t.code);
|
|
453
453
|
} catch {
|
|
454
454
|
return { platform: "twitter", data: {} };
|
|
455
455
|
}
|
|
456
|
-
}, [t.code]),
|
|
457
|
-
const g =
|
|
456
|
+
}, [t.code]), i = (u == null ? void 0 : u.platform) || "twitter", r = (u == null ? void 0 : u.data) || {}, { author: x = {}, content: m = {}, engagement: k = {}, meta: T = {} } = r, M = Yt[i] || 280, $ = (m.text || "").length, h = $ > M ? "error" : $ > M * 0.9 ? "warning" : "", c = p(() => {
|
|
457
|
+
const g = m.text || "";
|
|
458
458
|
navigator.clipboard.writeText(g).then(() => {
|
|
459
|
-
|
|
459
|
+
o("Copied!"), setTimeout(() => o("Copy"), 2e3), l == null || l({ platform: i, text: g });
|
|
460
460
|
});
|
|
461
|
-
}, [
|
|
462
|
-
const g = { author: x, content:
|
|
463
|
-
switch (
|
|
461
|
+
}, [m.text, i, l]), E = () => {
|
|
462
|
+
const g = { author: x, content: m, engagement: k, meta: T };
|
|
463
|
+
switch (i) {
|
|
464
464
|
case "twitter":
|
|
465
465
|
return /* @__PURE__ */ e.createElement(vt, { ...g });
|
|
466
466
|
case "linkedin":
|
|
@@ -479,33 +479,33 @@ function na({ artifact: t, theme: a = "dark", onCopy: l }) {
|
|
|
479
479
|
return /* @__PURE__ */ e.createElement(vt, { ...g });
|
|
480
480
|
}
|
|
481
481
|
};
|
|
482
|
-
return /* @__PURE__ */ e.createElement("div", { className: `artifactuse-social artifactuse-social-${
|
|
482
|
+
return /* @__PURE__ */ e.createElement("div", { className: `artifactuse-social artifactuse-social-${i}`, "data-artifactuse-theme": a }, E(), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-actions-bar" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-platform-badge" }, /* @__PURE__ */ e.createElement("span", null, Qt[i] || i)), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-social-actions-right" }, /* @__PURE__ */ e.createElement("span", { className: `artifactuse-social-char-counter ${h}` }, $, "/", M), /* @__PURE__ */ e.createElement("button", { className: "artifactuse-social-copy-btn", onClick: c }, n))));
|
|
483
483
|
}
|
|
484
484
|
function la({
|
|
485
485
|
isOpen: t = !1,
|
|
486
486
|
type: a = "image",
|
|
487
487
|
src: l = "",
|
|
488
488
|
alt: n = "",
|
|
489
|
-
caption:
|
|
490
|
-
onClose:
|
|
491
|
-
className:
|
|
489
|
+
caption: o = "",
|
|
490
|
+
onClose: u,
|
|
491
|
+
className: i = ""
|
|
492
492
|
}) {
|
|
493
|
-
const r = B(null), [x,
|
|
494
|
-
z(() => (
|
|
493
|
+
const r = B(null), [x, m] = w(!1), [k, T] = w(!1);
|
|
494
|
+
z(() => (T(!0), () => T(!1)), []), z(() => {
|
|
495
495
|
var E;
|
|
496
|
-
return t ? (document.body.style.overflow = "hidden", (E = r.current) == null || E.focus()) : (document.body.style.overflow = "",
|
|
496
|
+
return t ? (document.body.style.overflow = "hidden", (E = r.current) == null || E.focus()) : (document.body.style.overflow = "", m(!1)), () => {
|
|
497
497
|
document.body.style.overflow = "";
|
|
498
498
|
};
|
|
499
499
|
}, [t]), z(() => {
|
|
500
500
|
function E(g) {
|
|
501
|
-
g.key === "Escape" && t &&
|
|
501
|
+
g.key === "Escape" && t && u && u();
|
|
502
502
|
}
|
|
503
503
|
return document.addEventListener("keydown", E), () => document.removeEventListener("keydown", E);
|
|
504
|
-
}, [t,
|
|
505
|
-
const
|
|
506
|
-
|
|
507
|
-
}, [
|
|
508
|
-
a === "image" &&
|
|
504
|
+
}, [t, u]);
|
|
505
|
+
const M = p(() => {
|
|
506
|
+
m(!1), u && u();
|
|
507
|
+
}, [u]), $ = p(() => {
|
|
508
|
+
a === "image" && m((E) => !E);
|
|
509
509
|
}, [a]), h = p(() => {
|
|
510
510
|
const E = document.createElement("a");
|
|
511
511
|
E.href = l, E.download = n || "download", document.body.appendChild(E), E.click(), document.body.removeChild(E);
|
|
@@ -516,8 +516,8 @@ function la({
|
|
|
516
516
|
"div",
|
|
517
517
|
{
|
|
518
518
|
ref: r,
|
|
519
|
-
className: `artifactuse-viewer-overlay ${
|
|
520
|
-
onClick:
|
|
519
|
+
className: `artifactuse-viewer-overlay ${i}`,
|
|
520
|
+
onClick: M,
|
|
521
521
|
tabIndex: -1,
|
|
522
522
|
role: "dialog",
|
|
523
523
|
"aria-modal": "true"
|
|
@@ -541,7 +541,7 @@ function la({
|
|
|
541
541
|
"button",
|
|
542
542
|
{
|
|
543
543
|
className: "artifactuse-viewer-close",
|
|
544
|
-
onClick:
|
|
544
|
+
onClick: M,
|
|
545
545
|
title: "Close (Esc)"
|
|
546
546
|
},
|
|
547
547
|
/* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), /* @__PURE__ */ e.createElement("line", { x1: "6", y1: "6", x2: "18", y2: "18" }))
|
|
@@ -561,7 +561,7 @@ function la({
|
|
|
561
561
|
title: "Download"
|
|
562
562
|
},
|
|
563
563
|
/* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }), /* @__PURE__ */ e.createElement("polyline", { points: "7 10 12 15 17 10" }), /* @__PURE__ */ e.createElement("line", { x1: "12", y1: "15", x2: "12", y2: "3" }))
|
|
564
|
-
)),
|
|
564
|
+
)), o && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-viewer-caption" }, o))
|
|
565
565
|
);
|
|
566
566
|
return jt(c, document.body);
|
|
567
567
|
}
|
|
@@ -584,39 +584,39 @@ function ia(t) {
|
|
|
584
584
|
const a = [];
|
|
585
585
|
if (!t) return a;
|
|
586
586
|
const l = /<div\s+class="artifactuse-placeholder[^"]*"[^>]*data-artifact-id="([^"]+)"[^>]*data-artifact-type="([^"]+)"[^>]*data-artifact=["']([^"']*)["'][^>]*><\/div>/gi;
|
|
587
|
-
let n = 0,
|
|
588
|
-
for (; (
|
|
589
|
-
if (
|
|
590
|
-
const r = t.slice(n,
|
|
587
|
+
let n = 0, o;
|
|
588
|
+
for (; (o = l.exec(t)) !== null; ) {
|
|
589
|
+
if (o.index > n) {
|
|
590
|
+
const r = t.slice(n, o.index);
|
|
591
591
|
r.trim() && a.push({ type: "html", content: r });
|
|
592
592
|
}
|
|
593
|
-
const
|
|
594
|
-
|
|
593
|
+
const u = ca(o[3]), i = o[2];
|
|
594
|
+
u && (i === "form" && u.isInline ? a.push({ type: "form", artifact: u }) : i === "social" ? a.push({ type: "social", artifact: u }) : a.push({ type: "panel", artifact: u })), n = o.index + o[0].length;
|
|
595
595
|
}
|
|
596
596
|
if (n < t.length) {
|
|
597
|
-
const
|
|
598
|
-
|
|
597
|
+
const u = t.slice(n);
|
|
598
|
+
u.trim() && a.push({ type: "html", content: u });
|
|
599
599
|
}
|
|
600
600
|
return a.length === 0 && t.trim() && a.push({ type: "html", content: t }), a;
|
|
601
601
|
}
|
|
602
602
|
function oa() {
|
|
603
603
|
return `msg-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
|
|
604
604
|
}
|
|
605
|
-
function
|
|
605
|
+
function ma({
|
|
606
606
|
content: t,
|
|
607
607
|
messageId: a = oa(),
|
|
608
608
|
inlineCards: l = !0,
|
|
609
609
|
typing: n = !1,
|
|
610
|
-
isLastMessage:
|
|
610
|
+
isLastMessage: o = !1,
|
|
611
611
|
// Whether this is the last/most recent message
|
|
612
|
-
inlinePreview:
|
|
613
|
-
inlineCode:
|
|
612
|
+
inlinePreview: u = null,
|
|
613
|
+
inlineCode: i = null,
|
|
614
614
|
tabs: r = null,
|
|
615
615
|
viewMode: x = null,
|
|
616
|
-
onArtifactDetected:
|
|
616
|
+
onArtifactDetected: m,
|
|
617
617
|
onArtifactOpen: k,
|
|
618
|
-
onArtifactCopy:
|
|
619
|
-
onArtifactDownload:
|
|
618
|
+
onArtifactCopy: T,
|
|
619
|
+
onArtifactDownload: M,
|
|
620
620
|
onFormSubmit: $,
|
|
621
621
|
onFormCancel: h,
|
|
622
622
|
onFormButtonClick: c,
|
|
@@ -627,159 +627,159 @@ function ua({
|
|
|
627
627
|
var Ce;
|
|
628
628
|
const {
|
|
629
629
|
processMessage: J,
|
|
630
|
-
openArtifact:
|
|
630
|
+
openArtifact: A,
|
|
631
631
|
state: q,
|
|
632
632
|
getTheme: U,
|
|
633
633
|
instance: R
|
|
634
|
-
} =
|
|
634
|
+
} = Te(), ae = B(null), S = B(null), j = B(null), ue = B(n), [re, de] = w(""), [fe, pe] = w([]), [ne, Q] = w(!1), [Ee, d] = w(!1), [L, _] = w("image"), [v, P] = w(""), [G, be] = w(""), [Ne, $e] = w(""), Z = C(() => typeof U == "function" ? U() : "dark", [U]), He = (q == null ? void 0 : q.activeArtifactId) || null, Pe = l ?? ((Ce = R == null ? void 0 : R.config) == null ? void 0 : Ce.inlineCards) ?? !0, we = C(() => ia(re), [re]), ke = C(() => ne || o ? "active" : "inactive", [ne, o]);
|
|
635
635
|
z(() => {
|
|
636
636
|
n && Q(!0);
|
|
637
637
|
}, [n]);
|
|
638
|
-
const le = p((
|
|
639
|
-
y
|
|
638
|
+
const le = p((y) => {
|
|
639
|
+
_(y.type || "image"), P(y.src || ""), be(y.alt || ""), $e(y.caption || ""), d(!0), g && g(y);
|
|
640
640
|
}, [g]), Ie = p(() => {
|
|
641
641
|
d(!1), P(""), be(""), $e("");
|
|
642
642
|
}, []), Be = p(() => {
|
|
643
|
-
if (!
|
|
644
|
-
|
|
645
|
-
f._lightboxHandler && f.removeEventListener("click", f._lightboxHandler), f._lightboxHandler = (
|
|
646
|
-
|
|
643
|
+
if (!S.current) return;
|
|
644
|
+
S.current.querySelectorAll('img[data-lightbox="true"]').forEach((f) => {
|
|
645
|
+
f._lightboxHandler && f.removeEventListener("click", f._lightboxHandler), f._lightboxHandler = (F) => {
|
|
646
|
+
F.preventDefault(), F.stopPropagation(), le({
|
|
647
647
|
type: "image",
|
|
648
648
|
src: f.src,
|
|
649
649
|
alt: f.alt || "",
|
|
650
650
|
caption: f.dataset.caption || f.alt || ""
|
|
651
651
|
});
|
|
652
652
|
}, f.addEventListener("click", f._lightboxHandler), f.style.cursor = "zoom-in";
|
|
653
|
-
}),
|
|
654
|
-
f._lightboxHandler || (f._lightboxHandler = (
|
|
655
|
-
|
|
656
|
-
const
|
|
653
|
+
}), S.current.querySelectorAll(".artifactuse-image-container img").forEach((f) => {
|
|
654
|
+
f._lightboxHandler || (f._lightboxHandler = (F) => {
|
|
655
|
+
F.preventDefault(), F.stopPropagation();
|
|
656
|
+
const W = f.closest(".artifactuse-image-container"), K = W == null ? void 0 : W.querySelector(".artifactuse-image-caption"), me = (K == null ? void 0 : K.textContent) || f.dataset.caption || f.alt || "";
|
|
657
657
|
le({
|
|
658
658
|
type: "image",
|
|
659
659
|
src: f.src,
|
|
660
660
|
alt: f.alt || "",
|
|
661
|
-
caption:
|
|
661
|
+
caption: me
|
|
662
662
|
});
|
|
663
663
|
}, f.addEventListener("click", f._lightboxHandler), f.style.cursor = "zoom-in");
|
|
664
|
-
}),
|
|
665
|
-
f._lightboxHandler || (f._lightboxHandler = (
|
|
666
|
-
|
|
667
|
-
const
|
|
664
|
+
}), S.current.querySelectorAll(".artifactuse-gallery-item img, .artifactuse-image-gallery img").forEach((f) => {
|
|
665
|
+
f._lightboxHandler || (f._lightboxHandler = (F) => {
|
|
666
|
+
F.preventDefault(), F.stopPropagation();
|
|
667
|
+
const W = f.closest(".artifactuse-gallery-item"), K = W == null ? void 0 : W.querySelector(".artifactuse-gallery-caption"), me = (K == null ? void 0 : K.textContent) || f.dataset.caption || f.alt || "";
|
|
668
668
|
le({
|
|
669
669
|
type: "image",
|
|
670
670
|
src: f.src,
|
|
671
671
|
alt: f.alt || "",
|
|
672
|
-
caption:
|
|
672
|
+
caption: me
|
|
673
673
|
});
|
|
674
674
|
}, f.addEventListener("click", f._lightboxHandler), f.style.cursor = "zoom-in");
|
|
675
|
-
}),
|
|
676
|
-
f._pdfHandler && f.removeEventListener("click", f._pdfHandler), f._pdfHandler = (
|
|
677
|
-
|
|
675
|
+
}), S.current.querySelectorAll('a[href$=".pdf"], a[data-type="pdf"]').forEach((f) => {
|
|
676
|
+
f._pdfHandler && f.removeEventListener("click", f._pdfHandler), f._pdfHandler = (F) => {
|
|
677
|
+
F.preventDefault(), F.stopPropagation(), le({
|
|
678
678
|
type: "pdf",
|
|
679
679
|
src: f.href,
|
|
680
680
|
alt: f.textContent || "PDF Document",
|
|
681
681
|
caption: f.title || f.textContent || ""
|
|
682
682
|
});
|
|
683
683
|
}, f.addEventListener("click", f._pdfHandler);
|
|
684
|
-
}),
|
|
685
|
-
var
|
|
684
|
+
}), S.current.querySelectorAll(".artifactuse-pdf-container, [data-pdf-viewer]").forEach((f) => {
|
|
685
|
+
var W;
|
|
686
686
|
f._pdfHandler && f.removeEventListener("click", f._pdfHandler);
|
|
687
|
-
const
|
|
688
|
-
|
|
687
|
+
const F = f.dataset.pdfSrc || ((W = f.querySelector("iframe")) == null ? void 0 : W.src) || "";
|
|
688
|
+
F && (f._pdfHandler = (K) => {
|
|
689
689
|
K.preventDefault(), K.stopPropagation(), le({
|
|
690
690
|
type: "pdf",
|
|
691
|
-
src:
|
|
691
|
+
src: F,
|
|
692
692
|
alt: "PDF Document",
|
|
693
693
|
caption: f.dataset.caption || ""
|
|
694
694
|
});
|
|
695
695
|
}, f.addEventListener("click", f._pdfHandler), f.style.cursor = "pointer");
|
|
696
|
-
}),
|
|
697
|
-
f._clickHandler && f.removeEventListener("click", f._clickHandler), f._clickHandler = (
|
|
698
|
-
if (
|
|
699
|
-
const
|
|
700
|
-
|
|
696
|
+
}), S.current.querySelectorAll(".artifactuse-video-preview-wrapper, .video-preview-wrapper").forEach((f) => {
|
|
697
|
+
f._clickHandler && f.removeEventListener("click", f._clickHandler), f._clickHandler = (F) => {
|
|
698
|
+
if (F.target.closest(".artifactuse-video-play-button")) return;
|
|
699
|
+
const W = f.dataset.videoUrl || f.dataset.url;
|
|
700
|
+
W && window.open(W, "_blank", "noopener,noreferrer");
|
|
701
701
|
}, f.addEventListener("click", f._clickHandler);
|
|
702
702
|
});
|
|
703
|
-
}, [le]),
|
|
704
|
-
if (!
|
|
705
|
-
|
|
703
|
+
}, [le]), Ae = p(() => {
|
|
704
|
+
if (!S.current) return;
|
|
705
|
+
S.current.querySelectorAll("img").forEach((N) => {
|
|
706
706
|
N._lightboxHandler && (N.removeEventListener("click", N._lightboxHandler), delete N._lightboxHandler);
|
|
707
|
-
}),
|
|
707
|
+
}), S.current.querySelectorAll('a[href$=".pdf"], a[data-type="pdf"]').forEach((N) => {
|
|
708
708
|
N._pdfHandler && (N.removeEventListener("click", N._pdfHandler), delete N._pdfHandler);
|
|
709
|
-
}),
|
|
709
|
+
}), S.current.querySelectorAll(".artifactuse-pdf-container, [data-pdf-viewer]").forEach((N) => {
|
|
710
710
|
N._pdfHandler && (N.removeEventListener("click", N._pdfHandler), delete N._pdfHandler);
|
|
711
|
-
}),
|
|
711
|
+
}), S.current.querySelectorAll(".artifactuse-video-preview-wrapper, .video-preview-wrapper").forEach((N) => {
|
|
712
712
|
N._clickHandler && (N.removeEventListener("click", N._clickHandler), delete N._clickHandler);
|
|
713
713
|
});
|
|
714
714
|
}, []), ve = p(() => {
|
|
715
715
|
j.current && clearTimeout(j.current), j.current = setTimeout(async () => {
|
|
716
|
-
if (R != null && R.initializeContent &&
|
|
716
|
+
if (R != null && R.initializeContent && S.current)
|
|
717
717
|
try {
|
|
718
|
-
await R.initializeContent(
|
|
719
|
-
} catch (
|
|
720
|
-
console.error("Failed to initialize content:",
|
|
718
|
+
await R.initializeContent(S.current);
|
|
719
|
+
} catch (y) {
|
|
720
|
+
console.error("Failed to initialize content:", y);
|
|
721
721
|
}
|
|
722
722
|
Be();
|
|
723
723
|
}, 100);
|
|
724
724
|
}, [R, Be]);
|
|
725
725
|
z(() => {
|
|
726
726
|
if (t) {
|
|
727
|
-
const
|
|
728
|
-
inlinePreview:
|
|
729
|
-
inlineCode:
|
|
727
|
+
const y = J(t, a, {
|
|
728
|
+
inlinePreview: u,
|
|
729
|
+
inlineCode: i,
|
|
730
730
|
tabs: r,
|
|
731
731
|
viewMode: x
|
|
732
732
|
});
|
|
733
|
-
de(
|
|
733
|
+
de(y.html), pe(y.artifacts), y.artifacts.length > 0 && m && m(y.artifacts), n || ve();
|
|
734
734
|
}
|
|
735
|
-
}, [t, a, J, n, ve,
|
|
736
|
-
|
|
735
|
+
}, [t, a, J, n, ve, m]), z(() => {
|
|
736
|
+
ue.current === !0 && n === !1 && ve(), ue.current = n;
|
|
737
737
|
}, [n, ve]), z(() => (n && Q(!0), n || ve(), () => {
|
|
738
|
-
j.current && clearTimeout(j.current),
|
|
738
|
+
j.current && clearTimeout(j.current), Ae();
|
|
739
739
|
}), []);
|
|
740
|
-
const
|
|
741
|
-
const ce =
|
|
740
|
+
const Ve = p((y) => {
|
|
741
|
+
const ce = y.target.closest(".artifactuse-inline-preview");
|
|
742
742
|
if (ce) {
|
|
743
743
|
if (ce.dataset.nonClickable) return;
|
|
744
744
|
const oe = ce.dataset.artifactId;
|
|
745
745
|
if (oe) {
|
|
746
746
|
const ee = q.artifacts.find((N) => N.id === oe);
|
|
747
|
-
ee && (
|
|
747
|
+
ee && (A(ee), k && k(ee));
|
|
748
748
|
}
|
|
749
749
|
}
|
|
750
|
-
}, [q,
|
|
751
|
-
|
|
752
|
-
}, [
|
|
753
|
-
|
|
754
|
-
}, [
|
|
755
|
-
|
|
756
|
-
}, [
|
|
757
|
-
$ && $(
|
|
758
|
-
}, [$]), he = p((
|
|
759
|
-
h && h(
|
|
760
|
-
}, [h]), ge = p((
|
|
761
|
-
c && c(
|
|
762
|
-
}, [c]), Oe = p((
|
|
763
|
-
E && E(
|
|
764
|
-
}, [E]),
|
|
765
|
-
switch (
|
|
750
|
+
}, [q, A, k]), ie = p((y) => {
|
|
751
|
+
A(y), k && k(y);
|
|
752
|
+
}, [A, k]), Fe = p((y) => {
|
|
753
|
+
T && T(y);
|
|
754
|
+
}, [T]), xe = p((y) => {
|
|
755
|
+
M && M(y);
|
|
756
|
+
}, [M]), We = p((y) => {
|
|
757
|
+
$ && $(y);
|
|
758
|
+
}, [$]), he = p((y) => {
|
|
759
|
+
h && h(y);
|
|
760
|
+
}, [h]), ge = p((y) => {
|
|
761
|
+
c && c(y);
|
|
762
|
+
}, [c]), Oe = p((y) => {
|
|
763
|
+
E && E(y);
|
|
764
|
+
}, [E]), ye = (y, ce) => {
|
|
765
|
+
switch (y.type) {
|
|
766
766
|
case "html":
|
|
767
767
|
return /* @__PURE__ */ e.createElement(
|
|
768
768
|
"div",
|
|
769
769
|
{
|
|
770
770
|
key: `html-${ce}`,
|
|
771
|
-
dangerouslySetInnerHTML: { __html:
|
|
771
|
+
dangerouslySetInnerHTML: { __html: y.content }
|
|
772
772
|
}
|
|
773
773
|
);
|
|
774
774
|
case "form":
|
|
775
|
-
return
|
|
775
|
+
return y.artifact.isInline ? /* @__PURE__ */ e.createElement(
|
|
776
776
|
Zt,
|
|
777
777
|
{
|
|
778
|
-
key: `form-${
|
|
779
|
-
artifact:
|
|
778
|
+
key: `form-${y.artifact.id}`,
|
|
779
|
+
artifact: y.artifact,
|
|
780
780
|
theme: Z,
|
|
781
781
|
initialState: ke,
|
|
782
|
-
onSubmit:
|
|
782
|
+
onSubmit: We,
|
|
783
783
|
onCancel: he,
|
|
784
784
|
onButtonClick: ge
|
|
785
785
|
}
|
|
@@ -788,8 +788,8 @@ function ua({
|
|
|
788
788
|
return /* @__PURE__ */ e.createElement(
|
|
789
789
|
na,
|
|
790
790
|
{
|
|
791
|
-
key: `social-${
|
|
792
|
-
artifact:
|
|
791
|
+
key: `social-${y.artifact.id}`,
|
|
792
|
+
artifact: y.artifact,
|
|
793
793
|
theme: Z,
|
|
794
794
|
onCopy: Oe
|
|
795
795
|
}
|
|
@@ -798,11 +798,11 @@ function ua({
|
|
|
798
798
|
return Pe ? /* @__PURE__ */ e.createElement(
|
|
799
799
|
Ot,
|
|
800
800
|
{
|
|
801
|
-
key: `panel-${
|
|
802
|
-
artifact:
|
|
803
|
-
isActive: He ===
|
|
801
|
+
key: `panel-${y.artifact.id}`,
|
|
802
|
+
artifact: y.artifact,
|
|
803
|
+
isActive: He === y.artifact.id,
|
|
804
804
|
onOpen: ie,
|
|
805
|
-
onCopy:
|
|
805
|
+
onCopy: Fe,
|
|
806
806
|
onDownload: xe
|
|
807
807
|
}
|
|
808
808
|
) : null;
|
|
@@ -816,7 +816,7 @@ function ua({
|
|
|
816
816
|
ref: ae,
|
|
817
817
|
className: `artifactuse-agent-message ${D}`.trim()
|
|
818
818
|
},
|
|
819
|
-
/* @__PURE__ */ e.createElement("div", { ref:
|
|
819
|
+
/* @__PURE__ */ e.createElement("div", { ref: S, className: "artifactuse-message-content", onClick: Ve }, we.map(ye)),
|
|
820
820
|
/* @__PURE__ */ e.createElement(
|
|
821
821
|
la,
|
|
822
822
|
{
|
|
@@ -830,7 +830,7 @@ function ua({
|
|
|
830
830
|
)
|
|
831
831
|
);
|
|
832
832
|
}
|
|
833
|
-
|
|
833
|
+
ma.propTypes = {
|
|
834
834
|
/** The raw message content (markdown/HTML from AI) */
|
|
835
835
|
content: (t, a) => {
|
|
836
836
|
if (typeof t[a] != "string")
|
|
@@ -882,56 +882,56 @@ function ga({
|
|
|
882
882
|
onSave: a,
|
|
883
883
|
onExport: l,
|
|
884
884
|
className: n = "",
|
|
885
|
-
panelWidth:
|
|
886
|
-
splitPosition:
|
|
885
|
+
panelWidth: o,
|
|
886
|
+
splitPosition: u
|
|
887
887
|
}) {
|
|
888
888
|
var ft;
|
|
889
889
|
const {
|
|
890
|
-
state:
|
|
890
|
+
state: i,
|
|
891
891
|
activeArtifact: r,
|
|
892
892
|
artifactCount: x,
|
|
893
|
-
hasArtifacts:
|
|
893
|
+
hasArtifacts: m,
|
|
894
894
|
closePanel: k,
|
|
895
|
-
toggleFullscreen:
|
|
896
|
-
setViewMode:
|
|
895
|
+
toggleFullscreen: T,
|
|
896
|
+
setViewMode: M,
|
|
897
897
|
getPanelUrl: $,
|
|
898
898
|
openArtifact: h,
|
|
899
899
|
instance: c
|
|
900
|
-
} =
|
|
900
|
+
} = Te(), E = B(null), g = B(null), D = B(null), J = B(null), A = B(null), q = B(null), U = B(null), [R, ae] = w(!1), [S, j] = w(!1), [ue, re] = w(!0), [de, fe] = w(!1), [pe, ne] = w(!1), [Q, Ee] = w(!1), [d, L] = w(!1), [_, v] = w("options"), [P, G] = w(""), [be, Ne] = w(null), [$e, Z] = w(""), [He, Pe] = w(!1), [we, ke] = w(!1), [le, Ie] = w([]), [Be, Ae] = w(!1), [ve, Ve] = w(""), [ie, Fe] = w(
|
|
901
901
|
() => {
|
|
902
902
|
var s;
|
|
903
|
-
return Math.min(Math.max(
|
|
903
|
+
return Math.min(Math.max(o ?? ((s = c == null ? void 0 : c.config) == null ? void 0 : s.panelWidth) ?? 65, 25), 75);
|
|
904
904
|
}
|
|
905
|
-
), [xe,
|
|
905
|
+
), [xe, We] = w(
|
|
906
906
|
() => {
|
|
907
907
|
var s;
|
|
908
|
-
return Math.min(Math.max(
|
|
908
|
+
return Math.min(Math.max(u ?? ((s = c == null ? void 0 : c.config) == null ? void 0 : s.splitPosition) ?? 50, 20), 80);
|
|
909
909
|
}
|
|
910
910
|
), he = B(null), ge = B(null);
|
|
911
911
|
z(() => {
|
|
912
|
-
|
|
913
|
-
}, [
|
|
914
|
-
|
|
915
|
-
}, [
|
|
916
|
-
const Oe = B(null),
|
|
912
|
+
o !== void 0 && Fe(Math.min(Math.max(o, 25), 75));
|
|
913
|
+
}, [o]), z(() => {
|
|
914
|
+
u !== void 0 && We(Math.min(Math.max(u, 20), 80));
|
|
915
|
+
}, [u]);
|
|
916
|
+
const Oe = B(null), ye = B(null), Ce = B(null), y = C(() => r ? Ue(r.language) : "", [r]), ce = C(() => r ? at(r.language) : "", [r]), oe = C(() => {
|
|
917
917
|
if (!r) return null;
|
|
918
918
|
let s = $(r);
|
|
919
919
|
return s && r._refreshToken && (s += (s.includes("?") ? "&" : "?") + "_t=" + r._refreshToken), s;
|
|
920
|
-
}, [r, $]), ee = C(() => r ? Rt(r.language) : "plaintext", [r]), N = C(() =>
|
|
920
|
+
}, [r, $]), ee = C(() => r ? Rt(r.language) : "plaintext", [r]), N = C(() => i.artifacts.filter((s) => !s.isInline), [i.artifacts]), se = C(() => r ? N.findIndex((s) => s.id === r.id) : -1, [r, N]), f = C(() => {
|
|
921
921
|
var s;
|
|
922
922
|
return ((s = c == null ? void 0 : c.config) == null ? void 0 : s.branding) !== !1;
|
|
923
|
-
}, [c]),
|
|
923
|
+
}, [c]), F = C(() => {
|
|
924
924
|
var s;
|
|
925
925
|
return ((s = c == null ? void 0 : c.share) == null ? void 0 : s.enabled) !== !1;
|
|
926
|
-
}, [c]),
|
|
926
|
+
}, [c]), W = C(() => {
|
|
927
927
|
var s;
|
|
928
928
|
return ((s = c == null ? void 0 : c.share) == null ? void 0 : s.isAuthenticated()) || !1;
|
|
929
|
-
}, [c]), K = C(() => r
|
|
929
|
+
}, [c]), K = C(() => !r && !i.forceEmptyView ? Math.min(ie, 30) : ie, [r, ie, i.forceEmptyView]), me = C(() => {
|
|
930
930
|
var s;
|
|
931
931
|
return ((s = c == null ? void 0 : c.config) == null ? void 0 : s.multiTab) === !0;
|
|
932
932
|
}, [c]);
|
|
933
|
-
C(() =>
|
|
934
|
-
const nt = p((s) => `<svg viewBox="0 0 24 24" fill="currentColor">${at(s)}</svg>`, []),
|
|
933
|
+
C(() => me ? i.openTabs.map((s) => i.artifacts.find((b) => b.id === s)).filter(Boolean) : [], [me, i.openTabs, i.artifacts]);
|
|
934
|
+
const nt = p((s) => `<svg viewBox="0 0 24 24" fill="currentColor">${at(s)}</svg>`, []), _t = p(() => {
|
|
935
935
|
ne(!1), c.state.clearActiveArtifact();
|
|
936
936
|
}, [c]), ze = p((s) => {
|
|
937
937
|
if (s.language !== "smartdiff") return null;
|
|
@@ -941,8 +941,8 @@ function ga({
|
|
|
941
941
|
const H = b.language || "plaintext", I = pt() && window.Prism.languages[H], X = qt(b.oldCode, b.newCode).split(`
|
|
942
942
|
`);
|
|
943
943
|
return { html: X.map((te) => {
|
|
944
|
-
const Y = te[0], Le = te.slice(1),
|
|
945
|
-
return Y === "-" ? `<span class="token deleted">${
|
|
944
|
+
const Y = te[0], Le = te.slice(1), _e = I ? window.Prism.highlight(Le, I, H) : Le;
|
|
945
|
+
return Y === "-" ? `<span class="token deleted">${_e}</span>` : Y === "+" ? `<span class="token inserted">${_e}</span>` : _e;
|
|
946
946
|
}).join(`
|
|
947
947
|
`), lineCount: X.length };
|
|
948
948
|
} catch {
|
|
@@ -973,12 +973,12 @@ function ga({
|
|
|
973
973
|
}, [r == null ? void 0 : r.code, ee, ze]), bt = p(() => {
|
|
974
974
|
var b;
|
|
975
975
|
const s = (b = g.current) == null ? void 0 : b.closest("pre");
|
|
976
|
-
if (s &&
|
|
976
|
+
if (s && A.current && J.current) {
|
|
977
977
|
const I = window.getComputedStyle(s).backgroundColor;
|
|
978
|
-
I && I !== "rgba(0, 0, 0, 0)" && I !== "transparent" && (
|
|
978
|
+
I && I !== "rgba(0, 0, 0, 0)" && I !== "transparent" && (A.current.style.backgroundColor = I, J.current.style.backgroundColor = I);
|
|
979
979
|
}
|
|
980
980
|
}, []), it = p(() => {
|
|
981
|
-
|
|
981
|
+
A.current && (A.current.style.backgroundColor = ""), J.current && (J.current.style.backgroundColor = "");
|
|
982
982
|
}, []), Je = p(() => {
|
|
983
983
|
lt(), ct();
|
|
984
984
|
}, [lt, ct]), Xe = ((ft = c.editor) == null ? void 0 : ft.isAvailable()) || !1, ot = p(() => {
|
|
@@ -996,11 +996,11 @@ function ga({
|
|
|
996
996
|
code: s
|
|
997
997
|
});
|
|
998
998
|
}, [r, c]), wt = p(() => {
|
|
999
|
-
clearTimeout(
|
|
999
|
+
clearTimeout(ye.current), re(!1), E.current && r && (c.bridge.setIframe(E.current), c.bridge.loadArtifact(r));
|
|
1000
1000
|
}, [r, c]), kt = p(() => {
|
|
1001
|
-
clearTimeout(
|
|
1001
|
+
clearTimeout(ye.current), re(!1);
|
|
1002
1002
|
}, []), xt = p(() => {
|
|
1003
|
-
clearTimeout(
|
|
1003
|
+
clearTimeout(ye.current), ye.current = setTimeout(() => {
|
|
1004
1004
|
re(!1);
|
|
1005
1005
|
}, 1e3);
|
|
1006
1006
|
}, []), Ct = p(async () => {
|
|
@@ -1012,9 +1012,9 @@ function ga({
|
|
|
1012
1012
|
}
|
|
1013
1013
|
}, [r]), Lt = p(() => {
|
|
1014
1014
|
if (!r) return;
|
|
1015
|
-
const { code: s, language: b, title: H } = r, I = rt(b), X = `${H.toLowerCase().replace(/\s+/g, "-")}.${I}`,
|
|
1015
|
+
const { code: s, language: b, title: H } = r, I = rt(b), X = `${H.toLowerCase().replace(/\s+/g, "-")}.${I}`, Se = new Blob([s], { type: "text/plain" }), te = URL.createObjectURL(Se), Y = document.createElement("a");
|
|
1016
1016
|
Y.href = te, Y.download = X, document.body.appendChild(Y), Y.click(), document.body.removeChild(Y), URL.revokeObjectURL(te);
|
|
1017
|
-
}, [r]),
|
|
1017
|
+
}, [r]), Mt = p(async () => {
|
|
1018
1018
|
if (!(Q || N.length === 0)) {
|
|
1019
1019
|
Ee(!0);
|
|
1020
1020
|
try {
|
|
@@ -1022,24 +1022,24 @@ function ga({
|
|
|
1022
1022
|
for (const Y of N) {
|
|
1023
1023
|
if (!Y.code) continue;
|
|
1024
1024
|
const Le = rt(Y.language);
|
|
1025
|
-
let
|
|
1025
|
+
let _e = (Y.title || "untitled").toLowerCase().replace(/\s+/g, "-").replace(/[^a-z0-9-_]/g, ""), et = `${_e}.${Le}`;
|
|
1026
1026
|
const tt = b.get(et) || 0;
|
|
1027
|
-
tt > 0 && (et = `${
|
|
1027
|
+
tt > 0 && (et = `${_e}-${tt}.${Le}`), b.set(`${_e}.${Le}`, tt + 1), s.file(et, Y.code);
|
|
1028
1028
|
}
|
|
1029
|
-
const H = await s.generateAsync({ type: "blob" }), X = `artifacts-${(/* @__PURE__ */ new Date()).toISOString().slice(0, 10)}.zip`,
|
|
1030
|
-
te.href =
|
|
1029
|
+
const H = await s.generateAsync({ type: "blob" }), X = `artifacts-${(/* @__PURE__ */ new Date()).toISOString().slice(0, 10)}.zip`, Se = URL.createObjectURL(H), te = document.createElement("a");
|
|
1030
|
+
te.href = Se, te.download = X, document.body.appendChild(te), te.click(), document.body.removeChild(te), URL.revokeObjectURL(Se);
|
|
1031
1031
|
} catch (s) {
|
|
1032
1032
|
console.error("Failed to create ZIP:", s);
|
|
1033
1033
|
} finally {
|
|
1034
1034
|
Ee(!1);
|
|
1035
1035
|
}
|
|
1036
1036
|
}
|
|
1037
|
-
}, [Q, N]),
|
|
1037
|
+
}, [Q, N]), mt = p((s) => s ? new Date(s).toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" }) : "", []), Tt = p(() => {
|
|
1038
1038
|
if (d) {
|
|
1039
1039
|
L(!1);
|
|
1040
1040
|
return;
|
|
1041
1041
|
}
|
|
1042
|
-
r && (v("options"), G(""), Ne(null), Z(""), Pe(!1), ke(!1), Ie([]),
|
|
1042
|
+
r && (v("options"), G(""), Ne(null), Z(""), Pe(!1), ke(!1), Ie([]), Ae(!1), Ve(""), L(!0));
|
|
1043
1043
|
}, [r, c, d]), Pt = p(() => {
|
|
1044
1044
|
L(!1);
|
|
1045
1045
|
}, []), Ze = p(async () => {
|
|
@@ -1052,8 +1052,8 @@ function ga({
|
|
|
1052
1052
|
Z(s.message || "Failed to create share link"), v("error");
|
|
1053
1053
|
}
|
|
1054
1054
|
}
|
|
1055
|
-
}, [r, c]),
|
|
1056
|
-
if (
|
|
1055
|
+
}, [r, c]), ut = p(async () => {
|
|
1056
|
+
if (W)
|
|
1057
1057
|
Re();
|
|
1058
1058
|
else {
|
|
1059
1059
|
v("loading");
|
|
@@ -1063,7 +1063,7 @@ function ga({
|
|
|
1063
1063
|
s.message === "Authentication cancelled" ? v("options") : (Z(s.message || "Authentication failed"), v("error"));
|
|
1064
1064
|
}
|
|
1065
1065
|
}
|
|
1066
|
-
}, [
|
|
1066
|
+
}, [W, c]), Re = p(async () => {
|
|
1067
1067
|
if (!(!r || !(c != null && c.share))) {
|
|
1068
1068
|
v("loading"), Z("");
|
|
1069
1069
|
try {
|
|
@@ -1073,11 +1073,11 @@ function ga({
|
|
|
1073
1073
|
Z(s.message || "Failed to save artifact"), v("error");
|
|
1074
1074
|
}
|
|
1075
1075
|
}
|
|
1076
|
-
}, [r, c]),
|
|
1076
|
+
}, [r, c]), At = p(() => {
|
|
1077
1077
|
we ? Re() : Ze();
|
|
1078
|
-
}, [we, Re, Ze]),
|
|
1078
|
+
}, [we, Re, Ze]), St = p(async () => {
|
|
1079
1079
|
if (c != null && c.share) {
|
|
1080
|
-
if (!
|
|
1080
|
+
if (!W) {
|
|
1081
1081
|
v("loading");
|
|
1082
1082
|
try {
|
|
1083
1083
|
await c.share.openAuthPopup();
|
|
@@ -1086,17 +1086,17 @@ function ga({
|
|
|
1086
1086
|
return;
|
|
1087
1087
|
}
|
|
1088
1088
|
}
|
|
1089
|
-
v("update-list"),
|
|
1089
|
+
v("update-list"), Ae(!0);
|
|
1090
1090
|
try {
|
|
1091
1091
|
const s = (r == null ? void 0 : r.language) || null, b = await c.share.listArtifacts(s);
|
|
1092
1092
|
Ie(b.projects || []);
|
|
1093
1093
|
} catch (s) {
|
|
1094
1094
|
Z(s.message || "Failed to load artifacts"), v("error");
|
|
1095
1095
|
} finally {
|
|
1096
|
-
|
|
1096
|
+
Ae(!1);
|
|
1097
1097
|
}
|
|
1098
1098
|
}
|
|
1099
|
-
}, [r, c,
|
|
1099
|
+
}, [r, c, W]), $t = p(async (s) => {
|
|
1100
1100
|
var H, I;
|
|
1101
1101
|
if (!r || !(c != null && c.share)) return;
|
|
1102
1102
|
const b = (H = s.project) == null ? void 0 : H.uuid;
|
|
@@ -1104,7 +1104,7 @@ function ga({
|
|
|
1104
1104
|
v("loading"), Z("");
|
|
1105
1105
|
try {
|
|
1106
1106
|
const X = await c.share.updateArtifact(b, r);
|
|
1107
|
-
G(X.url || ""), Ne(null), ke(!0),
|
|
1107
|
+
G(X.url || ""), Ne(null), ke(!0), Ve(((I = s.project) == null ? void 0 : I.name) || "Untitled"), v("success");
|
|
1108
1108
|
} catch (X) {
|
|
1109
1109
|
Z(X.message || "Failed to update artifact"), v("error");
|
|
1110
1110
|
}
|
|
@@ -1120,8 +1120,8 @@ function ga({
|
|
|
1120
1120
|
p((s) => {
|
|
1121
1121
|
h(s);
|
|
1122
1122
|
}, [h]), p((s) => {
|
|
1123
|
-
c.closeTab(s),
|
|
1124
|
-
}, [c,
|
|
1123
|
+
c.closeTab(s), i.openTabs.length === 0 && ne(!1);
|
|
1124
|
+
}, [c, i.openTabs]);
|
|
1125
1125
|
const It = p(() => {
|
|
1126
1126
|
se > 0 && h(N[se - 1]);
|
|
1127
1127
|
}, [se, h, N]), Bt = p(() => {
|
|
@@ -1138,12 +1138,12 @@ function ga({
|
|
|
1138
1138
|
}, [ie]), Ye = p((s) => {
|
|
1139
1139
|
if (!he.current) return;
|
|
1140
1140
|
const b = window.innerWidth, I = (he.current.startX - s.clientX) / b * 100, X = he.current.startWidth + I;
|
|
1141
|
-
|
|
1141
|
+
Fe(Math.min(Math.max(X, 25), 75));
|
|
1142
1142
|
}, []), qe = p(() => {
|
|
1143
1143
|
he.current = null, document.removeEventListener("mousemove", Ye), document.removeEventListener("mouseup", qe), document.body.style.cursor = "", document.body.style.userSelect = "", document.querySelectorAll("iframe").forEach((s) => {
|
|
1144
1144
|
s.style.pointerEvents = "";
|
|
1145
1145
|
});
|
|
1146
|
-
}, [Ye]),
|
|
1146
|
+
}, [Ye]), Vt = p((s) => {
|
|
1147
1147
|
if (!D.current) return;
|
|
1148
1148
|
const b = D.current.getBoundingClientRect();
|
|
1149
1149
|
ge.current = {
|
|
@@ -1157,7 +1157,7 @@ function ga({
|
|
|
1157
1157
|
}, [xe]), Qe = p((s) => {
|
|
1158
1158
|
if (!ge.current) return;
|
|
1159
1159
|
const H = (s.clientX - ge.current.contentLeft) / ge.current.contentWidth * 100;
|
|
1160
|
-
|
|
1160
|
+
We(Math.min(Math.max(H, 20), 80));
|
|
1161
1161
|
}, []), De = p(() => {
|
|
1162
1162
|
ge.current = null, document.removeEventListener("mousemove", Qe), document.removeEventListener("mouseup", De), document.body.style.cursor = "", document.body.style.userSelect = "", document.querySelectorAll("iframe").forEach((s) => {
|
|
1163
1163
|
s.style.pointerEvents = "";
|
|
@@ -1166,30 +1166,48 @@ function ga({
|
|
|
1166
1166
|
if (z(() => {
|
|
1167
1167
|
r && (Ce.current && Ce.current.isPreviewable !== r.isPreviewable && (fe(!0), setTimeout(() => fe(!1), 150)), Ce.current = r, it(), re(!0), xt(), Je());
|
|
1168
1168
|
}, [r == null ? void 0 : r.id, it]), z(() => {
|
|
1169
|
-
(
|
|
1170
|
-
}, [
|
|
1169
|
+
(i.viewMode === "code" || i.viewMode === "split") && Je(), i.viewMode === "edit" && ot();
|
|
1170
|
+
}, [i.viewMode, Je, ot]), z(() => (t && c.on("ai:request", t), a && c.on("save:request", a), l && c.on("export:complete", l), () => {
|
|
1171
1171
|
t && c.off("ai:request", t), a && c.off("save:request", a), l && c.off("export:complete", l);
|
|
1172
1172
|
}), [c, t, a, l]), z(() => () => {
|
|
1173
|
-
qe(), De(), U.current && (U.current.destroy(), U.current = null), clearTimeout(Oe.current), clearTimeout(
|
|
1174
|
-
}, [qe, De]), !
|
|
1173
|
+
qe(), De(), U.current && (U.current.destroy(), U.current = null), clearTimeout(Oe.current), clearTimeout(ye.current);
|
|
1174
|
+
}, [qe, De]), !i.isPanelOpen) return null;
|
|
1175
1175
|
const Ge = [
|
|
1176
1176
|
"artifactuse-panel",
|
|
1177
|
-
|
|
1178
|
-
!r &&
|
|
1179
|
-
!
|
|
1177
|
+
i.isFullscreen && "artifactuse-panel--fullscreen",
|
|
1178
|
+
!r && m && !i.forceEmptyView && "artifactuse-panel--list",
|
|
1179
|
+
!m && !i.forceEmptyView && "artifactuse-panel--empty",
|
|
1180
1180
|
n
|
|
1181
|
-
].filter(Boolean).join(" "),
|
|
1181
|
+
].filter(Boolean).join(" "), Ft = [
|
|
1182
1182
|
"artifactuse-panel__content",
|
|
1183
|
-
`artifactuse-panel__content--${
|
|
1183
|
+
`artifactuse-panel__content--${i.viewMode}`,
|
|
1184
1184
|
de && "artifactuse-panel__content--transitioning"
|
|
1185
1185
|
].filter(Boolean).join(" ");
|
|
1186
|
-
return
|
|
1186
|
+
return !m || i.forceEmptyView ? /* @__PURE__ */ e.createElement("div", { className: Ge, style: i.isFullscreen ? void 0 : { width: `${K}%` } }, !i.isFullscreen && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__resize-handle", onMouseDown: Ke }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__resize-handle-line" })), /* @__PURE__ */ e.createElement("header", { className: "artifactuse-panel__header artifactuse-panel__header--simple" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__title" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-panel__icon" }, i.forceEmptyView ? /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("path", { d: "M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z" }), /* @__PURE__ */ e.createElement("polyline", { points: "14 2 14 8 20 8" })) : /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("polyline", { points: "16 18 22 12 16 6" }), /* @__PURE__ */ e.createElement("polyline", { points: "8 6 2 12 8 18" }))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__title-content" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-panel__name" }, i.forceEmptyView ? "Artifact Viewer" : "Artifacts"))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__actions" }, /* @__PURE__ */ e.createElement(
|
|
1187
|
+
"button",
|
|
1188
|
+
{
|
|
1189
|
+
className: "artifactuse-panel__action artifactuse-panel__action--close",
|
|
1190
|
+
title: "Close panel",
|
|
1191
|
+
onClick: k
|
|
1192
|
+
},
|
|
1193
|
+
/* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), /* @__PURE__ */ e.createElement("line", { x1: "6", y1: "6", x2: "18", y2: "18" }))
|
|
1194
|
+
))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__empty" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__empty-icon" }, /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5" }, /* @__PURE__ */ e.createElement("path", { d: "M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z" }), /* @__PURE__ */ e.createElement("polyline", { points: "14 2 14 8 20 8" }))), /* @__PURE__ */ e.createElement("h3", { className: "artifactuse-panel__empty-title" }, i.forceEmptyView ? "No artifact selected" : "No artifacts yet"), /* @__PURE__ */ e.createElement("p", { className: "artifactuse-panel__empty-text" }, i.forceEmptyView ? "Open an artifact to have it appear here" : "Code blocks, forms, and other interactive content will appear here as the AI generates them.")), /* @__PURE__ */ e.createElement("footer", { className: "artifactuse-panel__footer artifactuse-panel__footer--simple" }, f && /* @__PURE__ */ e.createElement(
|
|
1195
|
+
"a",
|
|
1196
|
+
{
|
|
1197
|
+
href: "https://artifactuse.com",
|
|
1198
|
+
target: "_blank",
|
|
1199
|
+
rel: "noopener noreferrer",
|
|
1200
|
+
className: "artifactuse-panel__branding"
|
|
1201
|
+
},
|
|
1202
|
+
/* @__PURE__ */ e.createElement("svg", { width: "16", height: "16", viewBox: "0 0 42 42", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ e.createElement("path", { d: "M16.6667 41.6673V10.4173C16.6667 9.86478 16.4472 9.33488 16.0565 8.94418C15.6658 8.55348 15.1359 8.33398 14.5833 8.33398H4.16667C3.0616 8.33398 2.00179 8.77297 1.22039 9.55437C0.438987 10.3358 0 11.3956 0 12.5007V37.5006C0 38.6057 0.438987 39.6655 1.22039 40.4469C2.00179 41.2283 3.0616 41.6673 4.16667 41.6673H29.1667C30.2717 41.6673 31.3315 41.2283 32.1129 40.4469C32.8943 39.6655 33.3333 38.6057 33.3333 37.5006V27.084C33.3333 26.5314 33.1138 26.0015 32.7231 25.6108C32.3324 25.2201 31.8025 25.0007 31.25 25.0007H0", fill: "#5F51C8" }), /* @__PURE__ */ e.createElement("path", { d: "M39.5833 0H27.0833C25.9327 0 25 0.93274 25 2.08333V14.5833C25 15.7339 25.9327 16.6667 27.0833 16.6667H39.5833C40.7339 16.6667 41.6667 15.7339 41.6667 14.5833V2.08333C41.6667 0.93274 40.7339 0 39.5833 0Z", fill: "#695AE0" })),
|
|
1203
|
+
/* @__PURE__ */ e.createElement("span", null, "Artifactuse")
|
|
1204
|
+
))) : r ? /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
|
|
1187
1205
|
"div",
|
|
1188
1206
|
{
|
|
1189
1207
|
className: Ge,
|
|
1190
|
-
style:
|
|
1208
|
+
style: i.isFullscreen ? void 0 : { width: `${ie}%` }
|
|
1191
1209
|
},
|
|
1192
|
-
!
|
|
1210
|
+
!i.isFullscreen && /* @__PURE__ */ e.createElement(
|
|
1193
1211
|
"div",
|
|
1194
1212
|
{
|
|
1195
1213
|
className: "artifactuse-panel__resize-handle",
|
|
@@ -1197,12 +1215,12 @@ function ga({
|
|
|
1197
1215
|
},
|
|
1198
1216
|
/* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__resize-handle-line" })
|
|
1199
1217
|
),
|
|
1200
|
-
/* @__PURE__ */ e.createElement("header", { className: "artifactuse-panel__header" }, (
|
|
1218
|
+
/* @__PURE__ */ e.createElement("header", { className: "artifactuse-panel__header" }, (me || pe) && /* @__PURE__ */ e.createElement(
|
|
1201
1219
|
"button",
|
|
1202
1220
|
{
|
|
1203
1221
|
className: "artifactuse-panel__back",
|
|
1204
|
-
title:
|
|
1205
|
-
onClick:
|
|
1222
|
+
title: me ? "Browse artifacts" : "Back to list",
|
|
1223
|
+
onClick: _t
|
|
1206
1224
|
},
|
|
1207
1225
|
/* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("polyline", { points: "15 18 9 12 15 6" }))
|
|
1208
1226
|
), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__title" }, /* @__PURE__ */ e.createElement(
|
|
@@ -1211,41 +1229,41 @@ function ga({
|
|
|
1211
1229
|
className: "artifactuse-panel__icon",
|
|
1212
1230
|
dangerouslySetInnerHTML: { __html: `<svg viewBox="0 0 24 24" fill="currentColor">${ce}</svg>` }
|
|
1213
1231
|
}
|
|
1214
|
-
), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__title-content" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-panel__name" }, r.title || "Untitled"), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-panel__meta" },
|
|
1232
|
+
), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__title-content" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-panel__name" }, r.title || "Untitled"), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-panel__meta" }, y, r.lineCount && ` • ${r.lineCount} lines`))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__tabs" }, (!r.tabs || r.tabs.includes("preview")) && /* @__PURE__ */ e.createElement(
|
|
1215
1233
|
"button",
|
|
1216
1234
|
{
|
|
1217
|
-
className: `artifactuse-panel__tab ${
|
|
1235
|
+
className: `artifactuse-panel__tab ${i.viewMode === "preview" ? "artifactuse-panel__tab--active" : ""}`,
|
|
1218
1236
|
disabled: !r.isPreviewable,
|
|
1219
1237
|
title: "Preview",
|
|
1220
|
-
onClick: () =>
|
|
1238
|
+
onClick: () => M("preview")
|
|
1221
1239
|
},
|
|
1222
1240
|
/* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }), /* @__PURE__ */ e.createElement("circle", { cx: "12", cy: "12", r: "3" }))
|
|
1223
1241
|
), (!r.tabs || r.tabs.includes("code")) && /* @__PURE__ */ e.createElement(
|
|
1224
1242
|
"button",
|
|
1225
1243
|
{
|
|
1226
|
-
className: `artifactuse-panel__tab ${
|
|
1244
|
+
className: `artifactuse-panel__tab ${i.viewMode === "code" ? "artifactuse-panel__tab--active" : ""}`,
|
|
1227
1245
|
title: "Code",
|
|
1228
|
-
onClick: () =>
|
|
1246
|
+
onClick: () => M("code")
|
|
1229
1247
|
},
|
|
1230
1248
|
/* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("polyline", { points: "16 18 22 12 16 6" }), /* @__PURE__ */ e.createElement("polyline", { points: "8 6 2 12 8 18" }))
|
|
1231
1249
|
), (!r.tabs || r.tabs.includes("split")) && /* @__PURE__ */ e.createElement(
|
|
1232
1250
|
"button",
|
|
1233
1251
|
{
|
|
1234
|
-
className: `artifactuse-panel__tab ${
|
|
1252
|
+
className: `artifactuse-panel__tab ${i.viewMode === "split" ? "artifactuse-panel__tab--active" : ""}`,
|
|
1235
1253
|
disabled: !r.isPreviewable,
|
|
1236
1254
|
title: "Split view",
|
|
1237
|
-
onClick: () =>
|
|
1255
|
+
onClick: () => M("split")
|
|
1238
1256
|
},
|
|
1239
1257
|
/* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }), /* @__PURE__ */ e.createElement("line", { x1: "12", y1: "3", x2: "12", y2: "21" }))
|
|
1240
1258
|
), r.tabs && r.tabs.includes("edit") && Xe && /* @__PURE__ */ e.createElement(
|
|
1241
1259
|
"button",
|
|
1242
1260
|
{
|
|
1243
|
-
className: `artifactuse-panel__tab ${
|
|
1261
|
+
className: `artifactuse-panel__tab ${i.viewMode === "edit" ? "artifactuse-panel__tab--active" : ""}`,
|
|
1244
1262
|
title: "Edit",
|
|
1245
|
-
onClick: () =>
|
|
1263
|
+
onClick: () => M("edit")
|
|
1246
1264
|
},
|
|
1247
1265
|
/* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("path", { d: "M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7" }), /* @__PURE__ */ e.createElement("path", { d: "M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z" }))
|
|
1248
|
-
)), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__actions" },
|
|
1266
|
+
)), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__actions" }, i.viewMode === "edit" && /* @__PURE__ */ e.createElement(
|
|
1249
1267
|
"button",
|
|
1250
1268
|
{
|
|
1251
1269
|
className: "artifactuse-panel__action artifactuse-panel__action--save",
|
|
@@ -1257,10 +1275,10 @@ function ga({
|
|
|
1257
1275
|
"button",
|
|
1258
1276
|
{
|
|
1259
1277
|
className: "artifactuse-panel__action",
|
|
1260
|
-
title:
|
|
1261
|
-
onClick:
|
|
1278
|
+
title: i.isFullscreen ? "Exit fullscreen" : "Fullscreen",
|
|
1279
|
+
onClick: T
|
|
1262
1280
|
},
|
|
1263
|
-
|
|
1281
|
+
i.isFullscreen ? /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("polyline", { points: "4 14 10 14 10 20" }), /* @__PURE__ */ e.createElement("polyline", { points: "20 10 14 10 14 4" }), /* @__PURE__ */ e.createElement("line", { x1: "14", y1: "10", x2: "21", y2: "3" }), /* @__PURE__ */ e.createElement("line", { x1: "3", y1: "21", x2: "10", y2: "14" })) : /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("polyline", { points: "15 3 21 3 21 9" }), /* @__PURE__ */ e.createElement("polyline", { points: "9 21 3 21 3 15" }), /* @__PURE__ */ e.createElement("line", { x1: "21", y1: "3", x2: "14", y2: "10" }), /* @__PURE__ */ e.createElement("line", { x1: "3", y1: "21", x2: "10", y2: "14" }))
|
|
1264
1282
|
), /* @__PURE__ */ e.createElement(
|
|
1265
1283
|
"button",
|
|
1266
1284
|
{
|
|
@@ -1270,43 +1288,43 @@ function ga({
|
|
|
1270
1288
|
},
|
|
1271
1289
|
/* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), /* @__PURE__ */ e.createElement("line", { x1: "6", y1: "6", x2: "18", y2: "18" }))
|
|
1272
1290
|
))),
|
|
1273
|
-
/* @__PURE__ */ e.createElement("div", { className:
|
|
1291
|
+
/* @__PURE__ */ e.createElement("div", { className: Ft, ref: D }, de && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__loading" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__spinner" })), (i.viewMode === "preview" || i.viewMode === "split") && /* @__PURE__ */ e.createElement(
|
|
1274
1292
|
"div",
|
|
1275
1293
|
{
|
|
1276
1294
|
className: "artifactuse-panel__preview",
|
|
1277
|
-
style:
|
|
1295
|
+
style: i.viewMode === "split" ? { width: `${xe}%` } : void 0
|
|
1278
1296
|
},
|
|
1279
|
-
|
|
1297
|
+
ue && oe && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__loading" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__spinner" })),
|
|
1280
1298
|
oe ? /* @__PURE__ */ e.createElement(
|
|
1281
1299
|
"iframe",
|
|
1282
1300
|
{
|
|
1283
1301
|
ref: E,
|
|
1284
1302
|
src: oe,
|
|
1285
|
-
className: `artifactuse-panel__iframe ${
|
|
1303
|
+
className: `artifactuse-panel__iframe ${ue ? "artifactuse-panel__iframe--loading" : ""}`,
|
|
1286
1304
|
sandbox: "allow-scripts allow-same-origin allow-forms allow-popups allow-modals allow-downloads allow-top-navigation-by-user-activation",
|
|
1287
1305
|
allow: "camera; microphone; fullscreen; geolocation; display-capture; autoplay; clipboard-write",
|
|
1288
1306
|
onLoad: wt,
|
|
1289
1307
|
onError: kt
|
|
1290
1308
|
}
|
|
1291
|
-
) : /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__no-preview" }, /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5" }, /* @__PURE__ */ e.createElement("path", { d: "M9 17H7A5 5 0 0 1 7 7h2" }), /* @__PURE__ */ e.createElement("path", { d: "M15 7h2a5 5 0 1 1 0 10h-2" }), /* @__PURE__ */ e.createElement("line", { x1: "8", y1: "12", x2: "16", y2: "12" })), /* @__PURE__ */ e.createElement("p", null, "Preview not available for ",
|
|
1309
|
+
) : /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__no-preview" }, /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5" }, /* @__PURE__ */ e.createElement("path", { d: "M9 17H7A5 5 0 0 1 7 7h2" }), /* @__PURE__ */ e.createElement("path", { d: "M15 7h2a5 5 0 1 1 0 10h-2" }), /* @__PURE__ */ e.createElement("line", { x1: "8", y1: "12", x2: "16", y2: "12" })), /* @__PURE__ */ e.createElement("p", null, "Preview not available for ", y))
|
|
1292
1310
|
), /* @__PURE__ */ e.createElement(
|
|
1293
1311
|
"div",
|
|
1294
1312
|
{
|
|
1295
1313
|
className: "artifactuse-panel__code",
|
|
1296
1314
|
style: {
|
|
1297
|
-
...
|
|
1298
|
-
display:
|
|
1315
|
+
...i.viewMode === "split" ? { width: `${100 - xe}%` } : {},
|
|
1316
|
+
display: i.viewMode === "code" || i.viewMode === "split" ? void 0 : "none"
|
|
1299
1317
|
}
|
|
1300
1318
|
},
|
|
1301
|
-
|
|
1319
|
+
i.viewMode === "split" && /* @__PURE__ */ e.createElement(
|
|
1302
1320
|
"div",
|
|
1303
1321
|
{
|
|
1304
1322
|
className: "artifactuse-panel__split-handle",
|
|
1305
|
-
onMouseDown:
|
|
1323
|
+
onMouseDown: Vt
|
|
1306
1324
|
},
|
|
1307
1325
|
/* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__split-handle-line" })
|
|
1308
1326
|
),
|
|
1309
|
-
/* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__code-scroll", ref:
|
|
1327
|
+
/* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__code-scroll", ref: A }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__line-numbers", ref: J }), /* @__PURE__ */ e.createElement("pre", { className: `artifactuse-panel__code-block language-${ee}` }, /* @__PURE__ */ e.createElement(
|
|
1310
1328
|
"code",
|
|
1311
1329
|
{
|
|
1312
1330
|
ref: g,
|
|
@@ -1317,7 +1335,7 @@ function ga({
|
|
|
1317
1335
|
"div",
|
|
1318
1336
|
{
|
|
1319
1337
|
className: "artifactuse-panel__edit",
|
|
1320
|
-
style: { display:
|
|
1338
|
+
style: { display: i.viewMode === "edit" ? void 0 : "none" }
|
|
1321
1339
|
},
|
|
1322
1340
|
/* @__PURE__ */ e.createElement("div", { ref: q, className: "artifactuse-panel__editor-container" })
|
|
1323
1341
|
)),
|
|
@@ -1348,15 +1366,15 @@ function ga({
|
|
|
1348
1366
|
onClick: Lt
|
|
1349
1367
|
},
|
|
1350
1368
|
/* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }), /* @__PURE__ */ e.createElement("polyline", { points: "7 10 12 15 17 10" }), /* @__PURE__ */ e.createElement("line", { x1: "12", y1: "15", x2: "12", y2: "3" }))
|
|
1351
|
-
),
|
|
1369
|
+
), F && /* @__PURE__ */ e.createElement("div", { style: { position: "relative" } }, /* @__PURE__ */ e.createElement(
|
|
1352
1370
|
"button",
|
|
1353
1371
|
{
|
|
1354
1372
|
className: "artifactuse-panel__footer-action",
|
|
1355
1373
|
title: "Share",
|
|
1356
|
-
onClick:
|
|
1374
|
+
onClick: Tt
|
|
1357
1375
|
},
|
|
1358
1376
|
/* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("circle", { cx: "18", cy: "5", r: "3" }), /* @__PURE__ */ e.createElement("circle", { cx: "6", cy: "12", r: "3" }), /* @__PURE__ */ e.createElement("circle", { cx: "18", cy: "19", r: "3" }), /* @__PURE__ */ e.createElement("line", { x1: "8.59", y1: "13.51", x2: "15.42", y2: "17.49" }), /* @__PURE__ */ e.createElement("line", { x1: "15.41", y1: "6.51", x2: "8.59", y2: "10.49" }))
|
|
1359
|
-
), d && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__header" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-share-popup__title" },
|
|
1377
|
+
), d && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__header" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-share-popup__title" }, _ === "success" ? ve ? "Artifact updated!" : "Link created!" : _ === "update-list" ? "Update saved artifact" : "Share Artifact"), /* @__PURE__ */ e.createElement("button", { className: "artifactuse-share-popup__close", onClick: Pt }, /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), /* @__PURE__ */ e.createElement("line", { x1: "6", y1: "6", x2: "18", y2: "18" })))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__body" }, _ === "loading" && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__loading" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__spinner" }), /* @__PURE__ */ e.createElement("p", { className: "artifactuse-share-popup__loading-text" }, "Creating link...")), _ === "error" && /* @__PURE__ */ e.createElement("div", null, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__error" }, /* @__PURE__ */ e.createElement("p", { className: "artifactuse-share-popup__error-text" }, $e)), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__actions" }, /* @__PURE__ */ e.createElement("button", { className: "artifactuse-share-popup__btn artifactuse-share-popup__btn--secondary", onClick: () => v("options") }, "Back"), /* @__PURE__ */ e.createElement("button", { className: "artifactuse-share-popup__btn artifactuse-share-popup__btn--primary", onClick: At }, "Retry"))), _ === "options" && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__options" }, /* @__PURE__ */ e.createElement("button", { className: "artifactuse-share-popup__option", onClick: Ze }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__option-icon" }, /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("path", { d: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" }), /* @__PURE__ */ e.createElement("path", { d: "M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" }))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__option-content" }, /* @__PURE__ */ e.createElement("p", { className: "artifactuse-share-popup__option-title" }, "Share link"), /* @__PURE__ */ e.createElement("p", { className: "artifactuse-share-popup__option-desc" }, "Expires in 30 days"))), /* @__PURE__ */ e.createElement("button", { className: "artifactuse-share-popup__option", onClick: ut }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__option-icon" }, /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("path", { d: "M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z" }), /* @__PURE__ */ e.createElement("polyline", { points: "17 21 17 13 7 13 7 21" }), /* @__PURE__ */ e.createElement("polyline", { points: "7 3 7 8 15 8" }))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__option-content" }, /* @__PURE__ */ e.createElement("p", { className: "artifactuse-share-popup__option-title" }, "Save to account"), /* @__PURE__ */ e.createElement("p", { className: "artifactuse-share-popup__option-desc" }, "Permanent, manageable"))), /* @__PURE__ */ e.createElement("button", { className: "artifactuse-share-popup__option", onClick: St }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__option-icon" }, /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("polyline", { points: "23 4 23 10 17 10" }), /* @__PURE__ */ e.createElement("polyline", { points: "1 20 1 14 7 14" }), /* @__PURE__ */ e.createElement("path", { d: "M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15" }))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__option-content" }, /* @__PURE__ */ e.createElement("p", { className: "artifactuse-share-popup__option-title" }, "Update saved"), /* @__PURE__ */ e.createElement("p", { className: "artifactuse-share-popup__option-desc" }, "Replace an existing artifact")))), _ === "update-list" && /* @__PURE__ */ e.createElement("div", null, Be ? /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__loading" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__spinner" }), /* @__PURE__ */ e.createElement("p", { className: "artifactuse-share-popup__loading-text" }, "Loading artifacts...")) : le.length === 0 ? /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__empty" }, "No saved artifacts of this type") : /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__artifact-list" }, le.map((s) => {
|
|
1360
1378
|
var b, H, I;
|
|
1361
1379
|
return /* @__PURE__ */ e.createElement(
|
|
1362
1380
|
"button",
|
|
@@ -1366,9 +1384,9 @@ function ga({
|
|
|
1366
1384
|
onClick: () => $t(s)
|
|
1367
1385
|
},
|
|
1368
1386
|
/* @__PURE__ */ e.createElement("span", { className: "artifactuse-share-popup__artifact-name" }, ((H = s.project) == null ? void 0 : H.name) || "Untitled"),
|
|
1369
|
-
/* @__PURE__ */ e.createElement("span", { className: "artifactuse-share-popup__artifact-date" },
|
|
1387
|
+
/* @__PURE__ */ e.createElement("span", { className: "artifactuse-share-popup__artifact-date" }, mt((I = s.project) == null ? void 0 : I.created_at))
|
|
1370
1388
|
);
|
|
1371
|
-
})), /* @__PURE__ */ e.createElement("button", { className: "artifactuse-share-popup__back-btn", onClick: () => v("options") }, "Back")),
|
|
1389
|
+
})), /* @__PURE__ */ e.createElement("button", { className: "artifactuse-share-popup__back-btn", onClick: () => v("options") }, "Back")), _ === "success" && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__success" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__success-icon" }, /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("polyline", { points: "20 6 9 17 4 12" }))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__link-wrapper" }, /* @__PURE__ */ e.createElement(
|
|
1372
1390
|
"input",
|
|
1373
1391
|
{
|
|
1374
1392
|
type: "text",
|
|
@@ -1384,7 +1402,7 @@ function ga({
|
|
|
1384
1402
|
onClick: Ht
|
|
1385
1403
|
},
|
|
1386
1404
|
He ? "Copied!" : "Copy"
|
|
1387
|
-
)), be && !we && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__expiry" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-share-popup__expiry-icon" }, /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("circle", { cx: "12", cy: "12", r: "10" }), /* @__PURE__ */ e.createElement("line", { x1: "12", y1: "8", x2: "12", y2: "12" }), /* @__PURE__ */ e.createElement("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" }))), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-share-popup__expiry-text" }, "Expires ",
|
|
1405
|
+
)), be && !we && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__expiry" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-share-popup__expiry-icon" }, /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("circle", { cx: "12", cy: "12", r: "10" }), /* @__PURE__ */ e.createElement("line", { x1: "12", y1: "8", x2: "12", y2: "12" }), /* @__PURE__ */ e.createElement("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" }))), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-share-popup__expiry-text" }, "Expires ", mt(be))), !we && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__save-prompt" }, /* @__PURE__ */ e.createElement("p", { className: "artifactuse-share-popup__save-prompt-text" }, "Keep it permanently?"), /* @__PURE__ */ e.createElement("button", { className: "artifactuse-share-popup__save-prompt-btn", onClick: ut }, "Save to account")))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-share-popup__footer" }, /* @__PURE__ */ e.createElement("a", { href: "https://artifactuse.com", target: "_blank", rel: "noopener noreferrer", className: "artifactuse-share-popup__branding" }, /* @__PURE__ */ e.createElement("svg", { width: "12", height: "12", viewBox: "0 0 42 42", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ e.createElement("path", { d: "M16.6667 41.6673V10.4173C16.6667 9.86478 16.4472 9.33488 16.0565 8.94418C15.6658 8.55348 15.1359 8.33398 14.5833 8.33398H4.16667C3.0616 8.33398 2.00179 8.77297 1.22039 9.55437C0.438987 10.3358 0 11.3956 0 12.5007V37.5006C0 38.6057 0.438987 39.6655 1.22039 40.4469C2.00179 41.2283 3.0616 41.6673 4.16667 41.6673H29.1667C30.2717 41.6673 31.3315 41.2283 32.1129 40.4469C32.8943 39.6655 33.3333 38.6057 33.3333 37.5006V27.084C33.3333 26.5314 33.1138 26.0015 32.7231 25.6108C32.3324 25.2201 31.8025 25.0007 31.25 25.0007H0", fill: "#5F51C8" }), /* @__PURE__ */ e.createElement("path", { d: "M39.5833 0H27.0833C25.9327 0 25 0.93274 25 2.08333V14.5833C25 15.7339 25.9327 16.6667 27.0833 16.6667H39.5833C40.7339 16.6667 41.6667 15.7339 41.6667 14.5833V2.08333C41.6667 0.93274 40.7339 0 39.5833 0Z", fill: "#695AE0" })), /* @__PURE__ */ e.createElement("span", null, "Powered by Artifactuse"))))), N.length > 1 && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__nav" }, /* @__PURE__ */ e.createElement(
|
|
1388
1406
|
"button",
|
|
1389
1407
|
{
|
|
1390
1408
|
className: "artifactuse-panel__nav-btn",
|
|
@@ -1397,7 +1415,7 @@ function ga({
|
|
|
1397
1415
|
"button",
|
|
1398
1416
|
{
|
|
1399
1417
|
className: "artifactuse-panel__nav-trigger",
|
|
1400
|
-
onClick: () => j(!
|
|
1418
|
+
onClick: () => j(!S)
|
|
1401
1419
|
},
|
|
1402
1420
|
/* @__PURE__ */ e.createElement("span", null, se + 1, " / ", N.length),
|
|
1403
1421
|
/* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("polyline", { points: "6 9 12 15 18 9" }))
|
|
@@ -1410,7 +1428,7 @@ function ga({
|
|
|
1410
1428
|
onClick: Bt
|
|
1411
1429
|
},
|
|
1412
1430
|
/* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("polyline", { points: "9 18 15 12 9 6" }))
|
|
1413
|
-
),
|
|
1431
|
+
), S && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__artifact-list" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__artifact-list-header" }, /* @__PURE__ */ e.createElement("span", null, "All Artifacts (", N.length, ")"), /* @__PURE__ */ e.createElement(
|
|
1414
1432
|
"button",
|
|
1415
1433
|
{
|
|
1416
1434
|
className: "artifactuse-panel__artifact-list-close",
|
|
@@ -1434,13 +1452,13 @@ function ga({
|
|
|
1434
1452
|
/* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__artifact-item-content" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-panel__artifact-item-title" }, s.title || "Untitled"), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-panel__artifact-item-meta" }, Ue(s.language), s.lineCount && ` • ${s.lineCount} lines`)),
|
|
1435
1453
|
/* @__PURE__ */ e.createElement("span", { className: "artifactuse-panel__artifact-item-index" }, b + 1)
|
|
1436
1454
|
)))))))
|
|
1437
|
-
)) : /* @__PURE__ */ e.createElement("div", { className: Ge, style:
|
|
1455
|
+
)) : /* @__PURE__ */ e.createElement("div", { className: Ge, style: i.isFullscreen ? void 0 : { width: `${K}%` } }, !i.isFullscreen && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__resize-handle", onMouseDown: Ke }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__resize-handle-line" })), /* @__PURE__ */ e.createElement("header", { className: "artifactuse-panel__header artifactuse-panel__header--simple" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__title" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-panel__icon" }, /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("polyline", { points: "16 18 22 12 16 6" }), /* @__PURE__ */ e.createElement("polyline", { points: "8 6 2 12 8 18" }))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__title-content" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-panel__name" }, "Artifacts"), /* @__PURE__ */ e.createElement("span", { className: "artifactuse-panel__meta" }, N.length, " available"))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__actions" }, /* @__PURE__ */ e.createElement(
|
|
1438
1456
|
"button",
|
|
1439
1457
|
{
|
|
1440
1458
|
className: `artifactuse-panel__action ${Q ? "artifactuse-panel__action--loading" : ""}`,
|
|
1441
1459
|
disabled: Q,
|
|
1442
1460
|
title: "Download all as ZIP",
|
|
1443
|
-
onClick:
|
|
1461
|
+
onClick: Mt
|
|
1444
1462
|
},
|
|
1445
1463
|
Q ? /* @__PURE__ */ e.createElement("svg", { className: "artifactuse-panel__spinner-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("circle", { cx: "12", cy: "12", r: "10", strokeDasharray: "32", strokeDashoffset: "32" })) : /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }), /* @__PURE__ */ e.createElement("polyline", { points: "7 10 12 15 17 10" }), /* @__PURE__ */ e.createElement("line", { x1: "12", y1: "15", x2: "12", y2: "3" }))
|
|
1446
1464
|
), /* @__PURE__ */ e.createElement(
|
|
@@ -1477,28 +1495,10 @@ function ga({
|
|
|
1477
1495
|
},
|
|
1478
1496
|
/* @__PURE__ */ e.createElement("svg", { width: "16", height: "16", viewBox: "0 0 42 42", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ e.createElement("path", { d: "M16.6667 41.6673V10.4173C16.6667 9.86478 16.4472 9.33488 16.0565 8.94418C15.6658 8.55348 15.1359 8.33398 14.5833 8.33398H4.16667C3.0616 8.33398 2.00179 8.77297 1.22039 9.55437C0.438987 10.3358 0 11.3956 0 12.5007V37.5006C0 38.6057 0.438987 39.6655 1.22039 40.4469C2.00179 41.2283 3.0616 41.6673 4.16667 41.6673H29.1667C30.2717 41.6673 31.3315 41.2283 32.1129 40.4469C32.8943 39.6655 33.3333 38.6057 33.3333 37.5006V27.084C33.3333 26.5314 33.1138 26.0015 32.7231 25.6108C32.3324 25.2201 31.8025 25.0007 31.25 25.0007H0", fill: "#5F51C8" }), /* @__PURE__ */ e.createElement("path", { d: "M39.5833 0H27.0833C25.9327 0 25 0.93274 25 2.08333V14.5833C25 15.7339 25.9327 16.6667 27.0833 16.6667H39.5833C40.7339 16.6667 41.6667 15.7339 41.6667 14.5833V2.08333C41.6667 0.93274 40.7339 0 39.5833 0Z", fill: "#695AE0" })),
|
|
1479
1497
|
/* @__PURE__ */ e.createElement("span", null, "Artifactuse")
|
|
1480
|
-
))) : /* @__PURE__ */ e.createElement("div", { className: Ge, style: u.isFullscreen ? void 0 : { width: `${K}%` } }, !u.isFullscreen && /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__resize-handle", onMouseDown: Ke }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__resize-handle-line" })), /* @__PURE__ */ e.createElement("header", { className: "artifactuse-panel__header artifactuse-panel__header--simple" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__title" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-panel__icon" }, /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("polyline", { points: "16 18 22 12 16 6" }), /* @__PURE__ */ e.createElement("polyline", { points: "8 6 2 12 8 18" }))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__title-content" }, /* @__PURE__ */ e.createElement("span", { className: "artifactuse-panel__name" }, "Artifacts"))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__actions" }, /* @__PURE__ */ e.createElement(
|
|
1481
|
-
"button",
|
|
1482
|
-
{
|
|
1483
|
-
className: "artifactuse-panel__action artifactuse-panel__action--close",
|
|
1484
|
-
title: "Close panel",
|
|
1485
|
-
onClick: k
|
|
1486
|
-
},
|
|
1487
|
-
/* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2" }, /* @__PURE__ */ e.createElement("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), /* @__PURE__ */ e.createElement("line", { x1: "6", y1: "6", x2: "18", y2: "18" }))
|
|
1488
|
-
))), /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__empty" }, /* @__PURE__ */ e.createElement("div", { className: "artifactuse-panel__empty-icon" }, /* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5" }, /* @__PURE__ */ e.createElement("path", { d: "M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z" }), /* @__PURE__ */ e.createElement("polyline", { points: "14 2 14 8 20 8" }))), /* @__PURE__ */ e.createElement("h3", { className: "artifactuse-panel__empty-title" }, "No artifacts yet"), /* @__PURE__ */ e.createElement("p", { className: "artifactuse-panel__empty-text" }, "Code blocks, forms, and other interactive content will appear here as the AI generates them.")), /* @__PURE__ */ e.createElement("footer", { className: "artifactuse-panel__footer artifactuse-panel__footer--simple" }, f && /* @__PURE__ */ e.createElement(
|
|
1489
|
-
"a",
|
|
1490
|
-
{
|
|
1491
|
-
href: "https://artifactuse.com",
|
|
1492
|
-
target: "_blank",
|
|
1493
|
-
rel: "noopener noreferrer",
|
|
1494
|
-
className: "artifactuse-panel__branding"
|
|
1495
|
-
},
|
|
1496
|
-
/* @__PURE__ */ e.createElement("svg", { width: "16", height: "16", viewBox: "0 0 42 42", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ e.createElement("path", { d: "M16.6667 41.6673V10.4173C16.6667 9.86478 16.4472 9.33488 16.0565 8.94418C15.6658 8.55348 15.1359 8.33398 14.5833 8.33398H4.16667C3.0616 8.33398 2.00179 8.77297 1.22039 9.55437C0.438987 10.3358 0 11.3956 0 12.5007V37.5006C0 38.6057 0.438987 39.6655 1.22039 40.4469C2.00179 41.2283 3.0616 41.6673 4.16667 41.6673H29.1667C30.2717 41.6673 31.3315 41.2283 32.1129 40.4469C32.8943 39.6655 33.3333 38.6057 33.3333 37.5006V27.084C33.3333 26.5314 33.1138 26.0015 32.7231 25.6108C32.3324 25.2201 31.8025 25.0007 31.25 25.0007H0", fill: "#5F51C8" }), /* @__PURE__ */ e.createElement("path", { d: "M39.5833 0H27.0833C25.9327 0 25 0.93274 25 2.08333V14.5833C25 15.7339 25.9327 16.6667 27.0833 16.6667H39.5833C40.7339 16.6667 41.6667 15.7339 41.6667 14.5833V2.08333C41.6667 0.93274 40.7339 0 39.5833 0Z", fill: "#695AE0" })),
|
|
1497
|
-
/* @__PURE__ */ e.createElement("span", null, "Artifactuse")
|
|
1498
1498
|
)));
|
|
1499
1499
|
}
|
|
1500
|
-
function
|
|
1501
|
-
const { state: a, artifactCount: l, hasArtifacts: n, togglePanel:
|
|
1500
|
+
function ya({ className: t = "" }) {
|
|
1501
|
+
const { state: a, artifactCount: l, hasArtifacts: n, togglePanel: o } = Te(), u = C(() => l > 99 ? "99+" : String(l), [l]), i = [
|
|
1502
1502
|
"artifactuse-panel-toggle",
|
|
1503
1503
|
a.isPanelOpen && "artifactuse-panel-toggle--active",
|
|
1504
1504
|
n && "artifactuse-panel-toggle--has-artifacts",
|
|
@@ -1507,44 +1507,46 @@ function _a({ className: t = "" }) {
|
|
|
1507
1507
|
return /* @__PURE__ */ e.createElement(
|
|
1508
1508
|
"button",
|
|
1509
1509
|
{
|
|
1510
|
-
className:
|
|
1511
|
-
onClick:
|
|
1510
|
+
className: i,
|
|
1511
|
+
onClick: o,
|
|
1512
1512
|
title: a.isPanelOpen ? "Close artifacts panel" : "Open artifacts panel"
|
|
1513
1513
|
},
|
|
1514
1514
|
/* @__PURE__ */ e.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ e.createElement("polyline", { points: "16 18 22 12 16 6" }), /* @__PURE__ */ e.createElement("polyline", { points: "8 6 2 12 8 18" })),
|
|
1515
|
-
l > 0 && /* @__PURE__ */ e.createElement("span", { className: "artifactuse-panel-toggle-badge" },
|
|
1515
|
+
l > 0 && /* @__PURE__ */ e.createElement("span", { className: "artifactuse-panel-toggle-badge" }, u)
|
|
1516
1516
|
);
|
|
1517
1517
|
}
|
|
1518
|
-
const
|
|
1519
|
-
function
|
|
1518
|
+
const yt = Wt(null);
|
|
1519
|
+
function ua({ children: t, config: a = {} }) {
|
|
1520
1520
|
const l = B(null);
|
|
1521
1521
|
l.current || (l.current = Dt(a));
|
|
1522
|
-
const n = l.current, [
|
|
1522
|
+
const n = l.current, [o, u] = w({
|
|
1523
1523
|
artifacts: [],
|
|
1524
1524
|
activeArtifactId: null,
|
|
1525
1525
|
isPanelOpen: !1,
|
|
1526
1526
|
viewMode: "preview",
|
|
1527
1527
|
isFullscreen: !1,
|
|
1528
1528
|
openTabs: [],
|
|
1529
|
-
tabViewModes: {}
|
|
1530
|
-
|
|
1529
|
+
tabViewModes: {},
|
|
1530
|
+
forceEmptyView: !1
|
|
1531
|
+
}), [i, r] = w(() => n.getPanelTypes());
|
|
1531
1532
|
z(() => {
|
|
1532
1533
|
const E = n.state.subscribe((g) => {
|
|
1533
|
-
|
|
1534
|
+
u({
|
|
1534
1535
|
artifacts: g.artifacts,
|
|
1535
1536
|
activeArtifactId: g.activeArtifactId,
|
|
1536
1537
|
isPanelOpen: g.isPanelOpen,
|
|
1537
1538
|
viewMode: g.viewMode,
|
|
1538
1539
|
isFullscreen: g.isFullscreen,
|
|
1539
1540
|
openTabs: g.openTabs,
|
|
1540
|
-
tabViewModes: g.tabViewModes
|
|
1541
|
+
tabViewModes: g.tabViewModes,
|
|
1542
|
+
forceEmptyView: g.forceEmptyView
|
|
1541
1543
|
});
|
|
1542
1544
|
});
|
|
1543
1545
|
return n.applyTheme(), () => {
|
|
1544
1546
|
E(), n.destroy();
|
|
1545
1547
|
};
|
|
1546
1548
|
}, [n]);
|
|
1547
|
-
const x = C(() =>
|
|
1549
|
+
const x = C(() => o.activeArtifactId && o.artifacts.find((E) => E.id === o.activeArtifactId) || null, [o.artifacts, o.activeArtifactId]), m = o.artifacts.filter((E) => !E.isInline).length, k = m > 0, T = C(() => x ? n.getPanelUrl(x) : null, [x, n]), M = p((E) => {
|
|
1548
1550
|
n.setTheme(E), n.applyTheme();
|
|
1549
1551
|
}, [n]), $ = p((E, g) => {
|
|
1550
1552
|
n.registerPanel(E, g), r(n.getPanelTypes());
|
|
@@ -1552,13 +1554,13 @@ function ma({ children: t, config: a = {} }) {
|
|
|
1552
1554
|
n.unregisterPanel(E), r(n.getPanelTypes());
|
|
1553
1555
|
}, [n]), c = C(() => ({
|
|
1554
1556
|
instance: n,
|
|
1555
|
-
state:
|
|
1557
|
+
state: o,
|
|
1556
1558
|
activeArtifact: x,
|
|
1557
|
-
artifactCount:
|
|
1559
|
+
artifactCount: m,
|
|
1558
1560
|
hasArtifacts: k,
|
|
1559
1561
|
// Panel computed
|
|
1560
|
-
panelTypes:
|
|
1561
|
-
activePanelUrl:
|
|
1562
|
+
panelTypes: i,
|
|
1563
|
+
activePanelUrl: T,
|
|
1562
1564
|
// Methods
|
|
1563
1565
|
processMessage: n.processMessage,
|
|
1564
1566
|
initializeContent: n.initializeContent,
|
|
@@ -1566,6 +1568,7 @@ function ma({ children: t, config: a = {} }) {
|
|
|
1566
1568
|
openFile: n.openFile,
|
|
1567
1569
|
openCode: n.openCode,
|
|
1568
1570
|
updateFile: n.updateFile,
|
|
1571
|
+
openPanel: n.openPanel,
|
|
1569
1572
|
closePanel: n.closePanel,
|
|
1570
1573
|
togglePanel: n.togglePanel,
|
|
1571
1574
|
toggleFullscreen: n.toggleFullscreen,
|
|
@@ -1588,34 +1591,34 @@ function ma({ children: t, config: a = {} }) {
|
|
|
1588
1591
|
clearArtifacts: () => n.state.clear(),
|
|
1589
1592
|
// Theme
|
|
1590
1593
|
applyTheme: n.applyTheme,
|
|
1591
|
-
setTheme:
|
|
1594
|
+
setTheme: M,
|
|
1592
1595
|
getTheme: n.getTheme
|
|
1593
1596
|
}), [
|
|
1594
1597
|
n,
|
|
1595
|
-
i,
|
|
1596
|
-
x,
|
|
1597
1598
|
o,
|
|
1599
|
+
x,
|
|
1600
|
+
m,
|
|
1598
1601
|
k,
|
|
1599
|
-
|
|
1600
|
-
M,
|
|
1602
|
+
i,
|
|
1601
1603
|
T,
|
|
1604
|
+
M,
|
|
1602
1605
|
$,
|
|
1603
1606
|
h
|
|
1604
1607
|
]);
|
|
1605
|
-
return /* @__PURE__ */ e.createElement(
|
|
1608
|
+
return /* @__PURE__ */ e.createElement(yt.Provider, { value: c }, t);
|
|
1606
1609
|
}
|
|
1607
|
-
function
|
|
1608
|
-
const t = zt(
|
|
1610
|
+
function Te() {
|
|
1611
|
+
const t = zt(yt);
|
|
1609
1612
|
if (!t)
|
|
1610
1613
|
throw new Error("useArtifactuse must be used within an ArtifactuseProvider");
|
|
1611
1614
|
return t;
|
|
1612
1615
|
}
|
|
1613
1616
|
function da(t, a) {
|
|
1614
|
-
const { on: l, off: n } =
|
|
1617
|
+
const { on: l, off: n } = Te();
|
|
1615
1618
|
z(() => {
|
|
1616
|
-
const
|
|
1619
|
+
const o = l(t, a);
|
|
1617
1620
|
return () => {
|
|
1618
|
-
typeof
|
|
1621
|
+
typeof o == "function" ? o() : n(t, a);
|
|
1619
1622
|
};
|
|
1620
1623
|
}, [t, a, l, n]);
|
|
1621
1624
|
}
|
|
@@ -1625,39 +1628,39 @@ function fa() {
|
|
|
1625
1628
|
unregisterPanel: a,
|
|
1626
1629
|
hasPanel: l,
|
|
1627
1630
|
panelTypes: n,
|
|
1628
|
-
instance:
|
|
1629
|
-
} =
|
|
1630
|
-
var
|
|
1631
|
-
return ((
|
|
1632
|
-
}, [
|
|
1631
|
+
instance: o
|
|
1632
|
+
} = Te(), u = p((r) => l({ type: r }), [l]), i = p((r, x = {}) => {
|
|
1633
|
+
var m;
|
|
1634
|
+
return ((m = o.panelResolver) == null ? void 0 : m.resolve(r, x)) || null;
|
|
1635
|
+
}, [o]);
|
|
1633
1636
|
return {
|
|
1634
1637
|
register: t,
|
|
1635
1638
|
unregister: a,
|
|
1636
|
-
isRegistered:
|
|
1637
|
-
getPanelUrl:
|
|
1639
|
+
isRegistered: u,
|
|
1640
|
+
getPanelUrl: i,
|
|
1638
1641
|
types: n,
|
|
1639
1642
|
defaults: gt
|
|
1640
1643
|
};
|
|
1641
1644
|
}
|
|
1642
|
-
const
|
|
1643
|
-
ArtifactuseProvider:
|
|
1644
|
-
useArtifactuse:
|
|
1645
|
+
const _a = {
|
|
1646
|
+
ArtifactuseProvider: ua,
|
|
1647
|
+
useArtifactuse: Te,
|
|
1645
1648
|
useArtifactuseEvent: da,
|
|
1646
1649
|
usePanelRegistry: fa,
|
|
1647
1650
|
DEFAULT_PANELS: gt
|
|
1648
1651
|
};
|
|
1649
1652
|
export {
|
|
1650
|
-
|
|
1653
|
+
ma as ArtifactuseAgentMessage,
|
|
1651
1654
|
Ot as ArtifactuseCard,
|
|
1652
1655
|
Zt as ArtifactuseInlineForm,
|
|
1653
1656
|
ga as ArtifactusePanel,
|
|
1654
|
-
|
|
1655
|
-
|
|
1657
|
+
ya as ArtifactusePanelToggle,
|
|
1658
|
+
ua as ArtifactuseProvider,
|
|
1656
1659
|
na as ArtifactuseSocialPreview,
|
|
1657
1660
|
la as ArtifactuseViewer,
|
|
1658
1661
|
gt as DEFAULT_PANELS,
|
|
1659
|
-
|
|
1660
|
-
|
|
1662
|
+
_a as default,
|
|
1663
|
+
Te as useArtifactuse,
|
|
1661
1664
|
da as useArtifactuseEvent,
|
|
1662
1665
|
fa as usePanelRegistry
|
|
1663
1666
|
};
|