@akropolys/kiku 1.7.11 → 1.7.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +512 -503
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +512 -503
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +8 -6
- package/dist/styles.css.map +1 -1
- package/package.json +2 -2
package/dist/index.mjs
CHANGED
|
@@ -332,14 +332,45 @@ function renderMarkdown(content, streaming = false) {
|
|
|
332
332
|
return /* @__PURE__ */ jsx2(Fragment2, { children: elements });
|
|
333
333
|
}
|
|
334
334
|
|
|
335
|
+
// src/utils/icons.tsx
|
|
336
|
+
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
337
|
+
var ArrowUpIcon = () => /* @__PURE__ */ jsxs2("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
338
|
+
/* @__PURE__ */ jsx3("path", { d: "m5 12 7-7 7 7" }),
|
|
339
|
+
/* @__PURE__ */ jsx3("path", { d: "M12 19V5" })
|
|
340
|
+
] });
|
|
341
|
+
|
|
342
|
+
// src/utils/theme.ts
|
|
343
|
+
function resolveTheme(theme) {
|
|
344
|
+
if (typeof theme === "string") {
|
|
345
|
+
return { themeAttr: theme, vars: void 0 };
|
|
346
|
+
}
|
|
347
|
+
if (!theme) {
|
|
348
|
+
return { themeAttr: void 0, vars: void 0 };
|
|
349
|
+
}
|
|
350
|
+
const vars = {};
|
|
351
|
+
if (theme.primaryColor) vars["--hsk-primary"] = theme.primaryColor;
|
|
352
|
+
if (theme.backgroundColor) {
|
|
353
|
+
vars["--hsk-bg"] = theme.backgroundColor;
|
|
354
|
+
vars["--hsk-chat-bg"] = theme.backgroundColor;
|
|
355
|
+
}
|
|
356
|
+
if (theme.textColor) {
|
|
357
|
+
vars["--hsk-text"] = theme.textColor;
|
|
358
|
+
vars["--hsk-chat-text"] = theme.textColor;
|
|
359
|
+
}
|
|
360
|
+
if (theme.fontFamily) vars["--hsk-font"] = theme.fontFamily;
|
|
361
|
+
if (theme.fontSize) vars["--hsk-font-size"] = theme.fontSize;
|
|
362
|
+
if (theme.borderRadius) vars["--hsk-border-radius"] = theme.borderRadius;
|
|
363
|
+
return { themeAttr: void 0, vars };
|
|
364
|
+
}
|
|
365
|
+
|
|
335
366
|
// src/components/VoiceButton.tsx
|
|
336
367
|
import { useState as useState2, useRef as useRef2, useCallback } from "react";
|
|
337
|
-
import { jsx as
|
|
338
|
-
var MicIcon = ({ active }) => /* @__PURE__ */
|
|
339
|
-
/* @__PURE__ */
|
|
340
|
-
/* @__PURE__ */
|
|
341
|
-
/* @__PURE__ */
|
|
342
|
-
/* @__PURE__ */
|
|
368
|
+
import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
369
|
+
var MicIcon = ({ active }) => /* @__PURE__ */ jsxs3("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
370
|
+
/* @__PURE__ */ jsx4("rect", { x: "9", y: "2", width: "6", height: "11", rx: "3", fill: active ? "currentColor" : "none" }),
|
|
371
|
+
/* @__PURE__ */ jsx4("path", { d: "M5 10a7 7 0 0 0 14 0" }),
|
|
372
|
+
/* @__PURE__ */ jsx4("line", { x1: "12", y1: "19", x2: "12", y2: "23" }),
|
|
373
|
+
/* @__PURE__ */ jsx4("line", { x1: "8", y1: "23", x2: "16", y2: "23" })
|
|
343
374
|
] });
|
|
344
375
|
function VoiceButton({
|
|
345
376
|
onTranscript,
|
|
@@ -380,7 +411,7 @@ function VoiceButton({
|
|
|
380
411
|
setListening(false);
|
|
381
412
|
}, []);
|
|
382
413
|
if (!isSupported) return null;
|
|
383
|
-
return /* @__PURE__ */
|
|
414
|
+
return /* @__PURE__ */ jsxs3(
|
|
384
415
|
"button",
|
|
385
416
|
{
|
|
386
417
|
type: "button",
|
|
@@ -390,8 +421,8 @@ function VoiceButton({
|
|
|
390
421
|
title: listening ? "Stop listening" : "Speak your search",
|
|
391
422
|
"aria-label": listening ? "Stop voice input" : "Start voice input",
|
|
392
423
|
children: [
|
|
393
|
-
/* @__PURE__ */
|
|
394
|
-
listening && /* @__PURE__ */
|
|
424
|
+
/* @__PURE__ */ jsx4(MicIcon, { active: listening }),
|
|
425
|
+
listening && /* @__PURE__ */ jsx4("span", { className: "kiku-voice-ripple", "aria-hidden": "true" })
|
|
395
426
|
]
|
|
396
427
|
}
|
|
397
428
|
);
|
|
@@ -400,12 +431,12 @@ function VoiceButton({
|
|
|
400
431
|
// src/components/VisualSearch.tsx
|
|
401
432
|
import { useRef as useRef3, useState as useState3 } from "react";
|
|
402
433
|
import { useAkropolysContext as useAkropolysContext2 } from "@akropolys/sdk";
|
|
403
|
-
import { jsx as
|
|
404
|
-
var CameraIcon = () => /* @__PURE__ */
|
|
405
|
-
/* @__PURE__ */
|
|
406
|
-
/* @__PURE__ */
|
|
434
|
+
import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
435
|
+
var CameraIcon = () => /* @__PURE__ */ jsxs4("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
436
|
+
/* @__PURE__ */ jsx5("path", { d: "M23 19a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h4l2-3h6l2 3h4a2 2 0 0 1 2 2z" }),
|
|
437
|
+
/* @__PURE__ */ jsx5("circle", { cx: "12", cy: "13", r: "4" })
|
|
407
438
|
] });
|
|
408
|
-
var SpinnerIcon = () => /* @__PURE__ */
|
|
439
|
+
var SpinnerIcon = () => /* @__PURE__ */ jsx5("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", className: "kiku-vs-spin", children: /* @__PURE__ */ jsx5("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" }) });
|
|
409
440
|
function fileToBase64(file) {
|
|
410
441
|
return new Promise((resolve, reject) => {
|
|
411
442
|
const reader = new FileReader();
|
|
@@ -438,7 +469,7 @@ function VisualSearch({
|
|
|
438
469
|
if (inputRef.current) inputRef.current.value = "";
|
|
439
470
|
}
|
|
440
471
|
};
|
|
441
|
-
return /* @__PURE__ */
|
|
472
|
+
return /* @__PURE__ */ jsxs4(
|
|
442
473
|
"label",
|
|
443
474
|
{
|
|
444
475
|
className: `kiku-vs-btn${loading ? " kiku-vs-btn--loading" : ""} ${className}`,
|
|
@@ -446,7 +477,7 @@ function VisualSearch({
|
|
|
446
477
|
"aria-label": "Search by uploading a photo",
|
|
447
478
|
style: { cursor: disabled || loading ? "not-allowed" : "pointer" },
|
|
448
479
|
children: [
|
|
449
|
-
/* @__PURE__ */
|
|
480
|
+
/* @__PURE__ */ jsx5(
|
|
450
481
|
"input",
|
|
451
482
|
{
|
|
452
483
|
ref: inputRef,
|
|
@@ -458,36 +489,32 @@ function VisualSearch({
|
|
|
458
489
|
hidden: true
|
|
459
490
|
}
|
|
460
491
|
),
|
|
461
|
-
loading ? /* @__PURE__ */
|
|
492
|
+
loading ? /* @__PURE__ */ jsx5(SpinnerIcon, {}) : /* @__PURE__ */ jsx5(CameraIcon, {})
|
|
462
493
|
]
|
|
463
494
|
}
|
|
464
495
|
);
|
|
465
496
|
}
|
|
466
497
|
|
|
467
498
|
// src/components/ChatWidget.tsx
|
|
468
|
-
import { jsx as
|
|
469
|
-
var SparkleIcon = () => /* @__PURE__ */
|
|
470
|
-
var ArrowUpIcon = () => /* @__PURE__ */ jsxs4("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
471
|
-
/* @__PURE__ */ jsx5("path", { d: "m5 12 7-7 7 7" }),
|
|
472
|
-
/* @__PURE__ */ jsx5("path", { d: "M12 19V5" })
|
|
473
|
-
] });
|
|
499
|
+
import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
500
|
+
var SparkleIcon = () => /* @__PURE__ */ jsx6("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx6("path", { d: "m12 3-1.912 5.813a2 2 0 0 1-1.275 1.275L3 12l5.813 1.912a2 2 0 0 1 1.275 1.275L12 21l1.912-5.813a2 2 0 0 1 1.275-1.275L21 12l-5.813-1.912a2 2 0 0 1-1.275-1.275L12 3Z" }) });
|
|
474
501
|
function SourceCard({
|
|
475
502
|
source,
|
|
476
503
|
defaultCurrency,
|
|
477
504
|
onSelect,
|
|
478
505
|
isReferenced
|
|
479
506
|
}) {
|
|
480
|
-
return /* @__PURE__ */
|
|
507
|
+
return /* @__PURE__ */ jsxs5(
|
|
481
508
|
"div",
|
|
482
509
|
{
|
|
483
510
|
className: cn("hsk-source-card", isReferenced && "hsk-source-card--referenced"),
|
|
484
511
|
onClick: () => onSelect?.(source),
|
|
485
512
|
children: [
|
|
486
|
-
source.image && /* @__PURE__ */
|
|
487
|
-
/* @__PURE__ */
|
|
488
|
-
isReferenced && /* @__PURE__ */
|
|
489
|
-
/* @__PURE__ */
|
|
490
|
-
source.price && /* @__PURE__ */
|
|
513
|
+
source.image && /* @__PURE__ */ jsx6("img", { src: source.image, alt: source.name, className: "hsk-source-img" }),
|
|
514
|
+
/* @__PURE__ */ jsxs5("div", { style: { flex: 1, minWidth: 0, position: "relative" }, children: [
|
|
515
|
+
isReferenced && /* @__PURE__ */ jsx6("div", { className: "hsk-cb-source-ref-badge", title: "Featured in response", style: { top: "0", right: "0" }, children: /* @__PURE__ */ jsx6(SparkleIcon, {}) }),
|
|
516
|
+
/* @__PURE__ */ jsx6("div", { className: "hsk-source-name", style: { paddingRight: isReferenced ? "20px" : void 0 }, children: source.name }),
|
|
517
|
+
source.price && /* @__PURE__ */ jsxs5("div", { className: "hsk-source-price", children: [
|
|
491
518
|
source.currency ?? defaultCurrency,
|
|
492
519
|
" ",
|
|
493
520
|
source.price
|
|
@@ -624,42 +651,36 @@ I couldn't find any matching products in the store.`;
|
|
|
624
651
|
};
|
|
625
652
|
setChatHistory((prev) => [...prev, userMsg, assistantMsg]);
|
|
626
653
|
};
|
|
627
|
-
const customStyles =
|
|
628
|
-
|
|
629
|
-
...theme?.backgroundColor && { "--hsk-bg": theme.backgroundColor },
|
|
630
|
-
...theme?.textColor && { "--hsk-text": theme.textColor },
|
|
631
|
-
...theme?.fontFamily && { "--hsk-font": theme.fontFamily },
|
|
632
|
-
...theme?.borderRadius && { "--hsk-border-radius": theme.borderRadius }
|
|
633
|
-
};
|
|
634
|
-
return /* @__PURE__ */ jsxs4(
|
|
654
|
+
const { vars: customStyles } = resolveTheme(theme);
|
|
655
|
+
return /* @__PURE__ */ jsxs5(
|
|
635
656
|
"div",
|
|
636
657
|
{
|
|
637
658
|
className: cn("hsk-chat-widget", classNames.root, className),
|
|
638
659
|
style: customStyles,
|
|
639
660
|
children: [
|
|
640
|
-
/* @__PURE__ */
|
|
641
|
-
/* @__PURE__ */
|
|
642
|
-
/* @__PURE__ */
|
|
643
|
-
/* @__PURE__ */
|
|
644
|
-
chatHistory.length > 0 && /* @__PURE__ */
|
|
661
|
+
/* @__PURE__ */ jsxs5("div", { className: cn("hsk-chat-header", classNames.header), children: [
|
|
662
|
+
/* @__PURE__ */ jsx6("span", { className: "hsk-chat-header-icon", children: /* @__PURE__ */ jsx6(SparkleIcon, {}) }),
|
|
663
|
+
/* @__PURE__ */ jsx6("span", { className: "hsk-chat-title", children: title }),
|
|
664
|
+
/* @__PURE__ */ jsx6("span", { className: "hsk-chat-badge", children: "AI" }),
|
|
665
|
+
chatHistory.length > 0 && /* @__PURE__ */ jsx6("button", { className: "hsk-chat-reset", onClick: reset, style: { marginLeft: "auto" }, children: "Clear" })
|
|
645
666
|
] }),
|
|
646
|
-
/* @__PURE__ */
|
|
647
|
-
chatHistory.length === 0 ? /* @__PURE__ */
|
|
648
|
-
/* @__PURE__ */
|
|
649
|
-
/* @__PURE__ */
|
|
650
|
-
/* @__PURE__ */
|
|
651
|
-
] }) : chatHistory.map((msg, idx) => /* @__PURE__ */
|
|
652
|
-
/* @__PURE__ */
|
|
653
|
-
/* @__PURE__ */
|
|
654
|
-
/* @__PURE__ */
|
|
655
|
-
msg.imagePreview && /* @__PURE__ */
|
|
667
|
+
/* @__PURE__ */ jsxs5("div", { className: "hsk-chat-messages", children: [
|
|
668
|
+
chatHistory.length === 0 ? /* @__PURE__ */ jsxs5("div", { className: "hsk-chat-empty", children: [
|
|
669
|
+
/* @__PURE__ */ jsx6("div", { className: "hsk-chat-empty-icon", children: /* @__PURE__ */ jsx6(SparkleIcon, {}) }),
|
|
670
|
+
/* @__PURE__ */ jsx6("div", { children: emptyStateText }),
|
|
671
|
+
/* @__PURE__ */ jsx6("div", { className: "hsk-chat-empty-suggestions", children: emptyStateSuggestions })
|
|
672
|
+
] }) : chatHistory.map((msg, idx) => /* @__PURE__ */ jsxs5("div", { children: [
|
|
673
|
+
/* @__PURE__ */ jsxs5("div", { className: `hsk-msg-row ${msg.role}`, children: [
|
|
674
|
+
/* @__PURE__ */ jsx6("div", { className: cn("hsk-msg-avatar", msg.role === "assistant" ? "ai" : "user"), children: msg.role === "assistant" ? /* @__PURE__ */ jsx6(SparkleIcon, {}) : "U" }),
|
|
675
|
+
/* @__PURE__ */ jsxs5("div", { className: cn("hsk-msg-bubble", msg.role, classNames.messageBubble), children: [
|
|
676
|
+
msg.imagePreview && /* @__PURE__ */ jsx6("div", { className: "kiku-vs-preview-bubble", style: { marginBottom: "8px" }, children: /* @__PURE__ */ jsx6("img", { src: msg.imagePreview, alt: "Uploaded Preview", className: "kiku-vs-preview-bubble-img", style: { maxWidth: "200px", borderRadius: "8px" } }) }),
|
|
656
677
|
renderMarkdown(msg.content),
|
|
657
|
-
msg.styleDNA && /* @__PURE__ */
|
|
658
|
-
chatHistory[idx - 1]?.imagePreview && /* @__PURE__ */
|
|
659
|
-
/* @__PURE__ */
|
|
660
|
-
/* @__PURE__ */
|
|
661
|
-
/* @__PURE__ */
|
|
662
|
-
msg.styleDNA.style_tags && msg.styleDNA.style_tags.length > 0 && /* @__PURE__ */
|
|
678
|
+
msg.styleDNA && /* @__PURE__ */ jsxs5("div", { className: "kiku-vs-preview-banner", style: { marginTop: "10px" }, children: [
|
|
679
|
+
chatHistory[idx - 1]?.imagePreview && /* @__PURE__ */ jsx6("img", { src: chatHistory[idx - 1].imagePreview, alt: "Visual Search Input", className: "kiku-vs-preview-img" }),
|
|
680
|
+
/* @__PURE__ */ jsxs5("div", { className: "kiku-vs-preview-info", children: [
|
|
681
|
+
/* @__PURE__ */ jsx6("div", { className: "kiku-vs-preview-label", children: "Visual Match Palette" }),
|
|
682
|
+
/* @__PURE__ */ jsx6("div", { className: "kiku-vs-preview-palette", children: msg.styleDNA.color_palette || "Detected Style DNA" }),
|
|
683
|
+
msg.styleDNA.style_tags && msg.styleDNA.style_tags.length > 0 && /* @__PURE__ */ jsx6("div", { className: "kiku-style-tags", children: msg.styleDNA.style_tags.map((tag, ti) => /* @__PURE__ */ jsxs5("span", { className: "kiku-style-tag", children: [
|
|
663
684
|
"#",
|
|
664
685
|
tag
|
|
665
686
|
] }, ti)) })
|
|
@@ -667,13 +688,13 @@ I couldn't find any matching products in the store.`;
|
|
|
667
688
|
] })
|
|
668
689
|
] })
|
|
669
690
|
] }),
|
|
670
|
-
msg.role === "assistant" && msg.visualSources && msg.visualSources.length > 0 && /* @__PURE__ */
|
|
691
|
+
msg.role === "assistant" && msg.visualSources && msg.visualSources.length > 0 && /* @__PURE__ */ jsx6("div", { className: "hsk-sources-container", children: /* @__PURE__ */ jsx6("div", { className: "hsk-sources", children: msg.visualSources.map((src, si) => /* @__PURE__ */ jsx6(SourceCard, { source: src, defaultCurrency, onSelect: onSelectSource }, si)) }) }),
|
|
671
692
|
msg.role === "assistant" && idx === chatHistory.length - 1 && !msg.visualSources && sources.length > 0 && (() => {
|
|
672
693
|
const isStreamingActive = chatLoading || streaming;
|
|
673
694
|
if (isStreamingActive) {
|
|
674
|
-
return /* @__PURE__ */
|
|
695
|
+
return /* @__PURE__ */ jsx6("div", { className: "hsk-sources-container", children: /* @__PURE__ */ jsx6("div", { className: "hsk-sources", children: sources.map((src, si) => {
|
|
675
696
|
const isReferenced = !!(src.id && referencedIds.includes(src.id));
|
|
676
|
-
return /* @__PURE__ */
|
|
697
|
+
return /* @__PURE__ */ jsx6(
|
|
677
698
|
SourceCard,
|
|
678
699
|
{
|
|
679
700
|
source: src,
|
|
@@ -687,10 +708,10 @@ I couldn't find any matching products in the store.`;
|
|
|
687
708
|
}
|
|
688
709
|
const featured = sources.filter((src) => src.id && referencedIds.includes(src.id));
|
|
689
710
|
const general = referencedIds.length > 0 ? [] : sources.filter((src) => !src.id || !referencedIds.includes(src.id));
|
|
690
|
-
return /* @__PURE__ */
|
|
691
|
-
featured.length > 0 && /* @__PURE__ */
|
|
692
|
-
/* @__PURE__ */
|
|
693
|
-
/* @__PURE__ */
|
|
711
|
+
return /* @__PURE__ */ jsxs5("div", { className: "hsk-sources-container", children: [
|
|
712
|
+
featured.length > 0 && /* @__PURE__ */ jsxs5("div", { className: "hsk-sources-group", style: { marginBottom: "10px" }, children: [
|
|
713
|
+
/* @__PURE__ */ jsx6("div", { className: "hsk-sources-group-title", children: "\u2B50 Featured in response" }),
|
|
714
|
+
/* @__PURE__ */ jsx6("div", { className: "hsk-sources", children: featured.map((src, si) => /* @__PURE__ */ jsx6(
|
|
694
715
|
SourceCard,
|
|
695
716
|
{
|
|
696
717
|
source: src,
|
|
@@ -701,9 +722,9 @@ I couldn't find any matching products in the store.`;
|
|
|
701
722
|
`feat-${si}`
|
|
702
723
|
)) })
|
|
703
724
|
] }),
|
|
704
|
-
general.length > 0 && /* @__PURE__ */
|
|
705
|
-
featured.length > 0 && /* @__PURE__ */
|
|
706
|
-
/* @__PURE__ */
|
|
725
|
+
general.length > 0 && /* @__PURE__ */ jsxs5("div", { className: "hsk-sources-group", children: [
|
|
726
|
+
featured.length > 0 && /* @__PURE__ */ jsx6("div", { className: "hsk-sources-group-title", children: "All matches" }),
|
|
727
|
+
/* @__PURE__ */ jsx6("div", { className: "hsk-sources", children: general.map((src, si) => /* @__PURE__ */ jsx6(
|
|
707
728
|
SourceCard,
|
|
708
729
|
{
|
|
709
730
|
source: src,
|
|
@@ -717,21 +738,21 @@ I couldn't find any matching products in the store.`;
|
|
|
717
738
|
] });
|
|
718
739
|
})()
|
|
719
740
|
] }, idx)),
|
|
720
|
-
loading && /* @__PURE__ */
|
|
721
|
-
/* @__PURE__ */
|
|
722
|
-
/* @__PURE__ */
|
|
723
|
-
/* @__PURE__ */
|
|
724
|
-
/* @__PURE__ */
|
|
725
|
-
/* @__PURE__ */
|
|
741
|
+
loading && /* @__PURE__ */ jsxs5("div", { className: "hsk-msg-row", children: [
|
|
742
|
+
/* @__PURE__ */ jsx6("div", { className: "hsk-msg-avatar ai", children: /* @__PURE__ */ jsx6(SparkleIcon, {}) }),
|
|
743
|
+
/* @__PURE__ */ jsxs5("div", { className: "hsk-pending", role: "status", "aria-live": "polite", children: [
|
|
744
|
+
/* @__PURE__ */ jsxs5("div", { className: "hsk-pending-glyph", children: [
|
|
745
|
+
/* @__PURE__ */ jsx6("span", { className: "hsk-pending-ring" }),
|
|
746
|
+
/* @__PURE__ */ jsx6("span", { className: "hsk-pending-dot" })
|
|
726
747
|
] }),
|
|
727
|
-
/* @__PURE__ */
|
|
728
|
-
/* @__PURE__ */
|
|
729
|
-
/* @__PURE__ */
|
|
730
|
-
/* @__PURE__ */
|
|
748
|
+
/* @__PURE__ */ jsxs5("div", { className: "hsk-pending-text", children: [
|
|
749
|
+
/* @__PURE__ */ jsx6("span", { className: "hsk-pending-step step-1", children: "Searching catalog" }),
|
|
750
|
+
/* @__PURE__ */ jsx6("span", { className: "hsk-pending-step step-2", children: "Reasoning" }),
|
|
751
|
+
/* @__PURE__ */ jsx6("span", { className: "hsk-pending-step step-3", children: "Composing" })
|
|
731
752
|
] })
|
|
732
753
|
] })
|
|
733
754
|
] }),
|
|
734
|
-
error && /* @__PURE__ */
|
|
755
|
+
error && /* @__PURE__ */ jsx6("div", { className: "hsk-chat-error", children: (() => {
|
|
735
756
|
try {
|
|
736
757
|
const parsed = JSON.parse(error);
|
|
737
758
|
return parsed.error || parsed.message || error;
|
|
@@ -739,10 +760,10 @@ I couldn't find any matching products in the store.`;
|
|
|
739
760
|
return error;
|
|
740
761
|
}
|
|
741
762
|
})() }),
|
|
742
|
-
/* @__PURE__ */
|
|
763
|
+
/* @__PURE__ */ jsx6("div", { ref: bottomRef })
|
|
743
764
|
] }),
|
|
744
|
-
/* @__PURE__ */
|
|
745
|
-
enableVision && /* @__PURE__ */
|
|
765
|
+
/* @__PURE__ */ jsxs5("div", { className: "hsk-chat-input-area", style: { display: "flex", alignItems: "center", gap: "8px" }, children: [
|
|
766
|
+
enableVision && /* @__PURE__ */ jsx6(
|
|
746
767
|
VisualSearch,
|
|
747
768
|
{
|
|
748
769
|
onResults: handleVisualResults,
|
|
@@ -751,7 +772,7 @@ I couldn't find any matching products in the store.`;
|
|
|
751
772
|
disabled: loading
|
|
752
773
|
}
|
|
753
774
|
),
|
|
754
|
-
/* @__PURE__ */
|
|
775
|
+
/* @__PURE__ */ jsx6(
|
|
755
776
|
"textarea",
|
|
756
777
|
{
|
|
757
778
|
ref: textareaRef,
|
|
@@ -765,7 +786,7 @@ I couldn't find any matching products in the store.`;
|
|
|
765
786
|
style: { flex: 1 }
|
|
766
787
|
}
|
|
767
788
|
),
|
|
768
|
-
enableVoice && /* @__PURE__ */
|
|
789
|
+
enableVoice && /* @__PURE__ */ jsx6(
|
|
769
790
|
VoiceButton,
|
|
770
791
|
{
|
|
771
792
|
onTranscript: (text) => {
|
|
@@ -777,14 +798,14 @@ I couldn't find any matching products in the store.`;
|
|
|
777
798
|
disabled: loading
|
|
778
799
|
}
|
|
779
800
|
),
|
|
780
|
-
/* @__PURE__ */
|
|
801
|
+
/* @__PURE__ */ jsx6(
|
|
781
802
|
"button",
|
|
782
803
|
{
|
|
783
804
|
className: "hsk-chat-send",
|
|
784
805
|
onClick: handleSend,
|
|
785
806
|
disabled: !input.trim() || loading,
|
|
786
807
|
"aria-label": "Send message",
|
|
787
|
-
children: /* @__PURE__ */
|
|
808
|
+
children: /* @__PURE__ */ jsx6(ArrowUpIcon, {})
|
|
788
809
|
}
|
|
789
810
|
)
|
|
790
811
|
] })
|
|
@@ -801,7 +822,7 @@ import { useAkropolysContext as useAkropolysContext3 } from "@akropolys/sdk";
|
|
|
801
822
|
|
|
802
823
|
// src/components/ComparisonMatrix.tsx
|
|
803
824
|
import { resolveDisplayFields } from "@akropolys/sdk";
|
|
804
|
-
import { jsx as
|
|
825
|
+
import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
805
826
|
function normalizeKey(key) {
|
|
806
827
|
let s = key.replace(/[_-]+/g, " ");
|
|
807
828
|
s = s.replace(/([a-z])([A-Z])/g, "$1 $2");
|
|
@@ -963,9 +984,9 @@ function buildRows(products, displayConfig, defaultCurrency = "KES") {
|
|
|
963
984
|
}
|
|
964
985
|
function ImageCell({ value, name }) {
|
|
965
986
|
if (!value) {
|
|
966
|
-
return /* @__PURE__ */
|
|
987
|
+
return /* @__PURE__ */ jsx7("div", { style: { fontSize: 28, textAlign: "center" }, children: "\u{1F4E6}" });
|
|
967
988
|
}
|
|
968
|
-
return /* @__PURE__ */
|
|
989
|
+
return /* @__PURE__ */ jsx7(
|
|
969
990
|
"img",
|
|
970
991
|
{
|
|
971
992
|
src: value,
|
|
@@ -982,10 +1003,10 @@ function ImageCell({ value, name }) {
|
|
|
982
1003
|
);
|
|
983
1004
|
}
|
|
984
1005
|
function AvailabilityCell({ value }) {
|
|
985
|
-
if (!value) return /* @__PURE__ */
|
|
1006
|
+
if (!value) return /* @__PURE__ */ jsx7("span", { style: { color: "#9ca3af" }, children: "\u2014" });
|
|
986
1007
|
const inStock = /in.?stock/i.test(value);
|
|
987
|
-
return /* @__PURE__ */
|
|
988
|
-
/* @__PURE__ */
|
|
1008
|
+
return /* @__PURE__ */ jsxs6("span", { style: { display: "flex", alignItems: "center", gap: 6, fontSize: 13, color: "var(--hsk-text, #111827)" }, children: [
|
|
1009
|
+
/* @__PURE__ */ jsx7("span", { style: {
|
|
989
1010
|
width: 8,
|
|
990
1011
|
height: 8,
|
|
991
1012
|
borderRadius: "50%",
|
|
@@ -1024,7 +1045,7 @@ function ComparisonMatrix({ sources, defaultCurrency = "KES", displayConfig }) {
|
|
|
1024
1045
|
display: "flex",
|
|
1025
1046
|
alignItems: "center"
|
|
1026
1047
|
};
|
|
1027
|
-
return /* @__PURE__ */
|
|
1048
|
+
return /* @__PURE__ */ jsxs6(
|
|
1028
1049
|
"div",
|
|
1029
1050
|
{
|
|
1030
1051
|
className: "hsk-compare-matrix",
|
|
@@ -1037,11 +1058,11 @@ function ComparisonMatrix({ sources, defaultCurrency = "KES", displayConfig }) {
|
|
|
1037
1058
|
fontSize: 13
|
|
1038
1059
|
},
|
|
1039
1060
|
children: [
|
|
1040
|
-
/* @__PURE__ */
|
|
1041
|
-
/* @__PURE__ */
|
|
1061
|
+
/* @__PURE__ */ jsxs6("div", { style: { display: "grid", gridTemplateColumns: colTemplate, background: "var(--hsk-surface2, #f9fafb)", borderBottom: "2px solid var(--hsk-border, rgba(0,0,0,0.09))" }, children: [
|
|
1062
|
+
/* @__PURE__ */ jsx7("div", { style: { ...labelStyle, borderBottom: "none", color: "var(--hsk-text, #111)", fontSize: 12 }, children: "Feature" }),
|
|
1042
1063
|
products.map((p, i) => {
|
|
1043
1064
|
const { title } = resolveDisplayFields(p.fields || p, displayConfig);
|
|
1044
|
-
return /* @__PURE__ */
|
|
1065
|
+
return /* @__PURE__ */ jsx7(
|
|
1045
1066
|
"a",
|
|
1046
1067
|
{
|
|
1047
1068
|
href: p.url || "#",
|
|
@@ -1064,7 +1085,7 @@ function ComparisonMatrix({ sources, defaultCurrency = "KES", displayConfig }) {
|
|
|
1064
1085
|
);
|
|
1065
1086
|
})
|
|
1066
1087
|
] }),
|
|
1067
|
-
rows.map((row, rowIdx) => /* @__PURE__ */
|
|
1088
|
+
rows.map((row, rowIdx) => /* @__PURE__ */ jsxs6(
|
|
1068
1089
|
"div",
|
|
1069
1090
|
{
|
|
1070
1091
|
style: {
|
|
@@ -1073,18 +1094,18 @@ function ComparisonMatrix({ sources, defaultCurrency = "KES", displayConfig }) {
|
|
|
1073
1094
|
background: rowIdx % 2 === 1 ? "var(--hsk-surface2, rgba(0,0,0,0.015))" : "transparent"
|
|
1074
1095
|
},
|
|
1075
1096
|
children: [
|
|
1076
|
-
/* @__PURE__ */
|
|
1097
|
+
/* @__PURE__ */ jsx7("div", { style: labelStyle, children: row.label }),
|
|
1077
1098
|
products.map((p, i) => {
|
|
1078
1099
|
const val = row.values[i];
|
|
1079
1100
|
const isBest = row.bestIdx === i && row.values.filter(Boolean).length > 1;
|
|
1080
1101
|
const { title } = resolveDisplayFields(p.fields || p, displayConfig);
|
|
1081
1102
|
if (row.type === "image") {
|
|
1082
|
-
return /* @__PURE__ */
|
|
1103
|
+
return /* @__PURE__ */ jsx7("div", { style: { ...cellBase, justifyContent: "center", padding: "12px", borderLeft: i > 0 ? "1px solid var(--hsk-border, rgba(0,0,0,0.07))" : "none" }, children: /* @__PURE__ */ jsx7(ImageCell, { value: val, name: title }) }, i);
|
|
1083
1104
|
}
|
|
1084
1105
|
if (row.type === "availability") {
|
|
1085
|
-
return /* @__PURE__ */
|
|
1106
|
+
return /* @__PURE__ */ jsx7("div", { style: { ...cellBase, borderLeft: i > 0 ? "1px solid var(--hsk-border, rgba(0,0,0,0.07))" : "none" }, children: /* @__PURE__ */ jsx7(AvailabilityCell, { value: val }) }, i);
|
|
1086
1107
|
}
|
|
1087
|
-
return /* @__PURE__ */
|
|
1108
|
+
return /* @__PURE__ */ jsx7(
|
|
1088
1109
|
"div",
|
|
1089
1110
|
{
|
|
1090
1111
|
style: {
|
|
@@ -1093,7 +1114,7 @@ function ComparisonMatrix({ sources, defaultCurrency = "KES", displayConfig }) {
|
|
|
1093
1114
|
color: isBest ? "var(--hsk-primary, #ea580c)" : row.type === "price" ? "var(--hsk-text, #374151)" : "var(--hsk-text, #111827)",
|
|
1094
1115
|
borderLeft: i > 0 ? "1px solid var(--hsk-border, rgba(0,0,0,0.07))" : "none"
|
|
1095
1116
|
},
|
|
1096
|
-
children: val ?? /* @__PURE__ */
|
|
1117
|
+
children: val ?? /* @__PURE__ */ jsx7("span", { style: { color: "#9ca3af" }, children: "\u2014" })
|
|
1097
1118
|
},
|
|
1098
1119
|
i
|
|
1099
1120
|
);
|
|
@@ -1109,7 +1130,7 @@ function ComparisonMatrix({ sources, defaultCurrency = "KES", displayConfig }) {
|
|
|
1109
1130
|
|
|
1110
1131
|
// src/components/MarkupEditor.tsx
|
|
1111
1132
|
import { useEffect as useEffect3, useRef as useRef5, useState as useState5 } from "react";
|
|
1112
|
-
import { jsx as
|
|
1133
|
+
import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
1113
1134
|
var COLORS = ["#111111", "#ff5a5a", "#ffb300", "#22c55e", "#06b6d4", "#d946ef", "#9ca3af"];
|
|
1114
1135
|
var MAX_EXPORT_DIM = 1280;
|
|
1115
1136
|
function MarkupEditor({ src, onCancel, onSend }) {
|
|
@@ -1232,13 +1253,13 @@ function MarkupEditor({ src, onCancel, onSend }) {
|
|
|
1232
1253
|
}
|
|
1233
1254
|
};
|
|
1234
1255
|
const hasMarks = actions.length > 0;
|
|
1235
|
-
return /* @__PURE__ */
|
|
1236
|
-
/* @__PURE__ */
|
|
1237
|
-
/* @__PURE__ */
|
|
1238
|
-
/* @__PURE__ */
|
|
1256
|
+
return /* @__PURE__ */ jsxs7("div", { className: "hsk-markup", role: "dialog", "aria-label": "Mark up image", children: [
|
|
1257
|
+
/* @__PURE__ */ jsxs7("div", { className: "hsk-markup-head", children: [
|
|
1258
|
+
/* @__PURE__ */ jsx8("span", { className: "hsk-markup-title", children: "Mark where you want the change" }),
|
|
1259
|
+
/* @__PURE__ */ jsx8("button", { className: "hsk-markup-cancel", onClick: onCancel, children: "Cancel" })
|
|
1239
1260
|
] }),
|
|
1240
|
-
/* @__PURE__ */
|
|
1241
|
-
/* @__PURE__ */
|
|
1261
|
+
/* @__PURE__ */ jsx8("div", { className: "hsk-markup-stage", children: loadError ? /* @__PURE__ */ jsx8("div", { className: "hsk-markup-error", children: "This image can't be edited here." }) : !img ? /* @__PURE__ */ jsx8("div", { className: "hsk-markup-loading", children: "Loading image\u2026" }) : /* @__PURE__ */ jsxs7("div", { className: "hsk-markup-canvas-wrap", children: [
|
|
1262
|
+
/* @__PURE__ */ jsx8(
|
|
1242
1263
|
"canvas",
|
|
1243
1264
|
{
|
|
1244
1265
|
ref: canvasRef,
|
|
@@ -1251,7 +1272,7 @@ function MarkupEditor({ src, onCancel, onSend }) {
|
|
|
1251
1272
|
onPointerLeave: onPointerUp
|
|
1252
1273
|
}
|
|
1253
1274
|
),
|
|
1254
|
-
pendingText && canvasRef.current && /* @__PURE__ */
|
|
1275
|
+
pendingText && canvasRef.current && /* @__PURE__ */ jsx8(
|
|
1255
1276
|
"input",
|
|
1256
1277
|
{
|
|
1257
1278
|
ref: textInputRef,
|
|
@@ -1275,8 +1296,8 @@ function MarkupEditor({ src, onCancel, onSend }) {
|
|
|
1275
1296
|
}
|
|
1276
1297
|
)
|
|
1277
1298
|
] }) }),
|
|
1278
|
-
/* @__PURE__ */
|
|
1279
|
-
/* @__PURE__ */
|
|
1299
|
+
/* @__PURE__ */ jsxs7("div", { className: "hsk-markup-tools", children: [
|
|
1300
|
+
/* @__PURE__ */ jsx8("div", { className: "hsk-markup-colors", children: COLORS.map((c) => /* @__PURE__ */ jsx8(
|
|
1280
1301
|
"button",
|
|
1281
1302
|
{
|
|
1282
1303
|
className: `hsk-markup-color${color === c ? " hsk-markup-color--on" : ""}`,
|
|
@@ -1289,16 +1310,16 @@ function MarkupEditor({ src, onCancel, onSend }) {
|
|
|
1289
1310
|
},
|
|
1290
1311
|
c
|
|
1291
1312
|
)) }),
|
|
1292
|
-
/* @__PURE__ */
|
|
1293
|
-
/* @__PURE__ */
|
|
1294
|
-
/* @__PURE__ */
|
|
1295
|
-
/* @__PURE__ */
|
|
1296
|
-
/* @__PURE__ */
|
|
1297
|
-
/* @__PURE__ */
|
|
1313
|
+
/* @__PURE__ */ jsxs7("div", { className: "hsk-markup-actions", children: [
|
|
1314
|
+
/* @__PURE__ */ jsx8("button", { className: `hsk-markup-tool${tool === "pen" ? " hsk-markup-tool--on" : ""}`, onClick: () => setTool("pen"), children: "Sketch" }),
|
|
1315
|
+
/* @__PURE__ */ jsx8("button", { className: `hsk-markup-tool${tool === "text" ? " hsk-markup-tool--on" : ""}`, onClick: () => setTool("text"), children: "Text" }),
|
|
1316
|
+
/* @__PURE__ */ jsx8("button", { className: `hsk-markup-tool${tool === "eraser" ? " hsk-markup-tool--on" : ""}`, onClick: () => setTool("eraser"), children: "Eraser" }),
|
|
1317
|
+
/* @__PURE__ */ jsx8("button", { className: "hsk-markup-tool", onClick: () => setActions((prev) => prev.slice(0, -1)), disabled: !hasMarks, children: "Undo" }),
|
|
1318
|
+
/* @__PURE__ */ jsx8("button", { className: "hsk-markup-tool", onClick: () => setActions([]), disabled: !hasMarks, children: "Clear" })
|
|
1298
1319
|
] })
|
|
1299
1320
|
] }),
|
|
1300
|
-
/* @__PURE__ */
|
|
1301
|
-
/* @__PURE__ */
|
|
1321
|
+
/* @__PURE__ */ jsxs7("div", { className: "hsk-markup-send", children: [
|
|
1322
|
+
/* @__PURE__ */ jsx8(
|
|
1302
1323
|
"input",
|
|
1303
1324
|
{
|
|
1304
1325
|
className: "hsk-markup-instruction",
|
|
@@ -1310,7 +1331,7 @@ function MarkupEditor({ src, onCancel, onSend }) {
|
|
|
1310
1331
|
}
|
|
1311
1332
|
}
|
|
1312
1333
|
),
|
|
1313
|
-
/* @__PURE__ */
|
|
1334
|
+
/* @__PURE__ */ jsx8(
|
|
1314
1335
|
"button",
|
|
1315
1336
|
{
|
|
1316
1337
|
className: "hsk-markup-go",
|
|
@@ -1320,13 +1341,13 @@ function MarkupEditor({ src, onCancel, onSend }) {
|
|
|
1320
1341
|
}
|
|
1321
1342
|
)
|
|
1322
1343
|
] }),
|
|
1323
|
-
exportError && /* @__PURE__ */
|
|
1344
|
+
exportError && /* @__PURE__ */ jsx8("div", { className: "hsk-markup-error", children: "Couldn't process this image \u2014 try a newer visualization." })
|
|
1324
1345
|
] });
|
|
1325
1346
|
}
|
|
1326
1347
|
|
|
1327
1348
|
// src/components/KikuButton.tsx
|
|
1328
|
-
import { Fragment as Fragment3, jsx as
|
|
1329
|
-
var KikuIcon = ({ className, size = 18 }) => /* @__PURE__ */
|
|
1349
|
+
import { Fragment as Fragment3, jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
1350
|
+
var KikuIcon = ({ className, size = 18 }) => /* @__PURE__ */ jsx9(
|
|
1330
1351
|
"svg",
|
|
1331
1352
|
{
|
|
1332
1353
|
className: cn("hsk-brand-mark", className),
|
|
@@ -1335,52 +1356,48 @@ var KikuIcon = ({ className, size = 18 }) => /* @__PURE__ */ jsx8(
|
|
|
1335
1356
|
viewBox: "0 0 100 100",
|
|
1336
1357
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1337
1358
|
"aria-label": "kiku",
|
|
1338
|
-
children: /* @__PURE__ */
|
|
1339
|
-
/* @__PURE__ */
|
|
1340
|
-
/* @__PURE__ */
|
|
1359
|
+
children: /* @__PURE__ */ jsxs8("g", { transform: "translate(22.7 19) scale(0.62)", fill: "currentColor", fillRule: "evenodd", children: [
|
|
1360
|
+
/* @__PURE__ */ jsx9("path", { d: "M39.4 10.4 Q44 0 48.6 10.4 L86.1 95.8 Q88 100 83.4 100 L4.6 100 Q0 100 1.9 95.8 Z M24 100 L24 65 Q24 60 27.4 56.3 Q44 38 60.6 56.3 Q64 60 64 65 L64 100 Z" }),
|
|
1361
|
+
/* @__PURE__ */ jsx9("circle", { cx: "55", cy: "82", r: "3.4" })
|
|
1341
1362
|
] })
|
|
1342
1363
|
}
|
|
1343
1364
|
);
|
|
1344
1365
|
var SparkleIcon2 = KikuIcon;
|
|
1345
|
-
var
|
|
1346
|
-
|
|
1347
|
-
/* @__PURE__ */
|
|
1348
|
-
|
|
1349
|
-
|
|
1350
|
-
var ExternalIcon = () => /* @__PURE__ */ jsxs7("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
1351
|
-
/* @__PURE__ */ jsx8("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }),
|
|
1352
|
-
/* @__PURE__ */ jsx8("polyline", { points: "15 3 21 3 21 9" }),
|
|
1353
|
-
/* @__PURE__ */ jsx8("line", { x1: "10", y1: "14", x2: "21", y2: "3" })
|
|
1366
|
+
var StopIcon = () => /* @__PURE__ */ jsx9("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx9("rect", { x: "5", y: "5", width: "14", height: "14", rx: "2" }) });
|
|
1367
|
+
var ExternalIcon = () => /* @__PURE__ */ jsxs8("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
1368
|
+
/* @__PURE__ */ jsx9("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }),
|
|
1369
|
+
/* @__PURE__ */ jsx9("polyline", { points: "15 3 21 3 21 9" }),
|
|
1370
|
+
/* @__PURE__ */ jsx9("line", { x1: "10", y1: "14", x2: "21", y2: "3" })
|
|
1354
1371
|
] });
|
|
1355
|
-
var ContinueIcon = () => /* @__PURE__ */
|
|
1356
|
-
var CloseIcon = () => /* @__PURE__ */
|
|
1357
|
-
/* @__PURE__ */
|
|
1358
|
-
/* @__PURE__ */
|
|
1372
|
+
var ContinueIcon = () => /* @__PURE__ */ jsx9("svg", { width: "13", height: "13", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx9("path", { d: "M8 5v14l11-7z" }) });
|
|
1373
|
+
var CloseIcon = () => /* @__PURE__ */ jsxs8("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
1374
|
+
/* @__PURE__ */ jsx9("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
|
|
1375
|
+
/* @__PURE__ */ jsx9("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
|
|
1359
1376
|
] });
|
|
1360
|
-
var ChevronRightIcon = () => /* @__PURE__ */
|
|
1361
|
-
var HistoryIcon = () => /* @__PURE__ */
|
|
1362
|
-
/* @__PURE__ */
|
|
1363
|
-
/* @__PURE__ */
|
|
1364
|
-
/* @__PURE__ */
|
|
1377
|
+
var ChevronRightIcon = () => /* @__PURE__ */ jsx9("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx9("path", { d: "m9 18 6-6-6-6" }) });
|
|
1378
|
+
var HistoryIcon = () => /* @__PURE__ */ jsxs8("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
1379
|
+
/* @__PURE__ */ jsx9("path", { d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }),
|
|
1380
|
+
/* @__PURE__ */ jsx9("path", { d: "M3 3v5h5" }),
|
|
1381
|
+
/* @__PURE__ */ jsx9("path", { d: "M12 7v5l4 2" })
|
|
1365
1382
|
] });
|
|
1366
|
-
var BookmarkIcon = () => /* @__PURE__ */
|
|
1367
|
-
var TrashIcon = () => /* @__PURE__ */
|
|
1368
|
-
/* @__PURE__ */
|
|
1369
|
-
/* @__PURE__ */
|
|
1383
|
+
var BookmarkIcon = () => /* @__PURE__ */ jsx9("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx9("path", { d: "M19 21 12 16l-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z" }) });
|
|
1384
|
+
var TrashIcon = () => /* @__PURE__ */ jsxs8("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
1385
|
+
/* @__PURE__ */ jsx9("path", { d: "M3 6h18" }),
|
|
1386
|
+
/* @__PURE__ */ jsx9("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" })
|
|
1370
1387
|
] });
|
|
1371
|
-
var PaperclipIcon = () => /* @__PURE__ */
|
|
1372
|
-
var MicIcon2 = () => /* @__PURE__ */
|
|
1373
|
-
/* @__PURE__ */
|
|
1374
|
-
/* @__PURE__ */
|
|
1375
|
-
/* @__PURE__ */
|
|
1388
|
+
var PaperclipIcon = () => /* @__PURE__ */ jsx9("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx9("path", { d: "m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l8.57-8.57A4 4 0 1 1 18 8.84l-8.59 8.57a2 2 0 0 1-2.83-2.83l8.49-8.48" }) });
|
|
1389
|
+
var MicIcon2 = () => /* @__PURE__ */ jsxs8("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
1390
|
+
/* @__PURE__ */ jsx9("path", { d: "M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3z" }),
|
|
1391
|
+
/* @__PURE__ */ jsx9("path", { d: "M19 10v2a7 7 0 0 1-14 0v-2" }),
|
|
1392
|
+
/* @__PURE__ */ jsx9("line", { x1: "12", y1: "19", x2: "12", y2: "22" })
|
|
1376
1393
|
] });
|
|
1377
|
-
var MicOffIcon = () => /* @__PURE__ */
|
|
1378
|
-
/* @__PURE__ */
|
|
1379
|
-
/* @__PURE__ */
|
|
1380
|
-
/* @__PURE__ */
|
|
1381
|
-
/* @__PURE__ */
|
|
1382
|
-
/* @__PURE__ */
|
|
1383
|
-
/* @__PURE__ */
|
|
1394
|
+
var MicOffIcon = () => /* @__PURE__ */ jsxs8("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
1395
|
+
/* @__PURE__ */ jsx9("line", { x1: "2", y1: "2", x2: "22", y2: "22" }),
|
|
1396
|
+
/* @__PURE__ */ jsx9("path", { d: "M18.89 13.23A7.12 7.12 0 0 0 19 12v-2" }),
|
|
1397
|
+
/* @__PURE__ */ jsx9("path", { d: "M5 10v2a7 7 0 0 0 12 5" }),
|
|
1398
|
+
/* @__PURE__ */ jsx9("path", { d: "M15 9.34V5a3 3 0 0 0-5.68-1.33" }),
|
|
1399
|
+
/* @__PURE__ */ jsx9("path", { d: "M9 9v3a3 3 0 0 0 5.12 2.12" }),
|
|
1400
|
+
/* @__PURE__ */ jsx9("line", { x1: "12", y1: "19", x2: "12", y2: "22" })
|
|
1384
1401
|
] });
|
|
1385
1402
|
var DEFAULT_CHIPS = [];
|
|
1386
1403
|
function extractName(raw) {
|
|
@@ -1430,7 +1447,7 @@ function KikuPickerMenu({
|
|
|
1430
1447
|
onDismiss
|
|
1431
1448
|
}) {
|
|
1432
1449
|
const discussed = sources.filter((s) => s.id && referencedIds.includes(s.id));
|
|
1433
|
-
return /* @__PURE__ */
|
|
1450
|
+
return /* @__PURE__ */ jsxs8(
|
|
1434
1451
|
"div",
|
|
1435
1452
|
{
|
|
1436
1453
|
className: "hsk-kiku-picker",
|
|
@@ -1438,7 +1455,7 @@ function KikuPickerMenu({
|
|
|
1438
1455
|
"aria-label": "@kiku commands",
|
|
1439
1456
|
onMouseDown: (e) => e.preventDefault(),
|
|
1440
1457
|
children: [
|
|
1441
|
-
discussed.map((src, i) => /* @__PURE__ */
|
|
1458
|
+
discussed.map((src, i) => /* @__PURE__ */ jsxs8(
|
|
1442
1459
|
"button",
|
|
1443
1460
|
{
|
|
1444
1461
|
className: "hsk-kiku-picker-item",
|
|
@@ -1448,9 +1465,9 @@ function KikuPickerMenu({
|
|
|
1448
1465
|
onDismiss();
|
|
1449
1466
|
},
|
|
1450
1467
|
children: [
|
|
1451
|
-
/* @__PURE__ */
|
|
1452
|
-
/* @__PURE__ */
|
|
1453
|
-
src.price && /* @__PURE__ */
|
|
1468
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-kiku-picker-icon", children: src.image ? /* @__PURE__ */ jsx9("img", { src: src.image, alt: "" }) : /* @__PURE__ */ jsx9(BookmarkIcon, {}) }),
|
|
1469
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-kiku-picker-item-name", children: src.name }),
|
|
1470
|
+
src.price && /* @__PURE__ */ jsxs8("span", { className: "hsk-kiku-picker-item-price", children: [
|
|
1454
1471
|
src.currency ?? defaultCurrency,
|
|
1455
1472
|
" ",
|
|
1456
1473
|
parseFloat(String(src.price).replace(/[^0-9.]/g, "") || "0").toLocaleString()
|
|
@@ -1459,7 +1476,7 @@ function KikuPickerMenu({
|
|
|
1459
1476
|
},
|
|
1460
1477
|
src.id ?? i
|
|
1461
1478
|
)),
|
|
1462
|
-
discussed.length > 1 && /* @__PURE__ */
|
|
1479
|
+
discussed.length > 1 && /* @__PURE__ */ jsxs8(
|
|
1463
1480
|
"button",
|
|
1464
1481
|
{
|
|
1465
1482
|
className: "hsk-kiku-picker-item",
|
|
@@ -1469,8 +1486,8 @@ function KikuPickerMenu({
|
|
|
1469
1486
|
onDismiss();
|
|
1470
1487
|
},
|
|
1471
1488
|
children: [
|
|
1472
|
-
/* @__PURE__ */
|
|
1473
|
-
/* @__PURE__ */
|
|
1489
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-kiku-picker-icon", children: /* @__PURE__ */ jsx9(BookmarkIcon, {}) }),
|
|
1490
|
+
/* @__PURE__ */ jsxs8("span", { className: "hsk-kiku-picker-item-name", children: [
|
|
1474
1491
|
"Capture all (",
|
|
1475
1492
|
discussed.length,
|
|
1476
1493
|
")"
|
|
@@ -1478,7 +1495,7 @@ function KikuPickerMenu({
|
|
|
1478
1495
|
]
|
|
1479
1496
|
}
|
|
1480
1497
|
),
|
|
1481
|
-
discussed.length === 0 && /* @__PURE__ */
|
|
1498
|
+
discussed.length === 0 && /* @__PURE__ */ jsxs8(
|
|
1482
1499
|
"button",
|
|
1483
1500
|
{
|
|
1484
1501
|
className: "hsk-kiku-picker-item",
|
|
@@ -1488,12 +1505,12 @@ function KikuPickerMenu({
|
|
|
1488
1505
|
onDismiss();
|
|
1489
1506
|
},
|
|
1490
1507
|
children: [
|
|
1491
|
-
/* @__PURE__ */
|
|
1492
|
-
/* @__PURE__ */
|
|
1508
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-kiku-picker-icon", children: /* @__PURE__ */ jsx9(BookmarkIcon, {}) }),
|
|
1509
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-kiku-picker-item-name", children: "Capture current page" })
|
|
1493
1510
|
]
|
|
1494
1511
|
}
|
|
1495
1512
|
),
|
|
1496
|
-
/* @__PURE__ */
|
|
1513
|
+
/* @__PURE__ */ jsxs8(
|
|
1497
1514
|
"button",
|
|
1498
1515
|
{
|
|
1499
1516
|
className: "hsk-kiku-picker-item",
|
|
@@ -1503,12 +1520,12 @@ function KikuPickerMenu({
|
|
|
1503
1520
|
onDismiss();
|
|
1504
1521
|
},
|
|
1505
1522
|
children: [
|
|
1506
|
-
/* @__PURE__ */
|
|
1507
|
-
/* @__PURE__ */
|
|
1523
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-kiku-picker-icon", children: /* @__PURE__ */ jsx9(HistoryIcon, {}) }),
|
|
1524
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-kiku-picker-item-name", children: "What have you saved?" })
|
|
1508
1525
|
]
|
|
1509
1526
|
}
|
|
1510
1527
|
),
|
|
1511
|
-
/* @__PURE__ */
|
|
1528
|
+
/* @__PURE__ */ jsxs8(
|
|
1512
1529
|
"button",
|
|
1513
1530
|
{
|
|
1514
1531
|
className: "hsk-kiku-picker-item",
|
|
@@ -1518,8 +1535,8 @@ function KikuPickerMenu({
|
|
|
1518
1535
|
onDismiss();
|
|
1519
1536
|
},
|
|
1520
1537
|
children: [
|
|
1521
|
-
/* @__PURE__ */
|
|
1522
|
-
/* @__PURE__ */
|
|
1538
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-kiku-picker-icon", children: /* @__PURE__ */ jsx9(TrashIcon, {}) }),
|
|
1539
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-kiku-picker-item-name", children: "Delete this" })
|
|
1523
1540
|
]
|
|
1524
1541
|
}
|
|
1525
1542
|
)
|
|
@@ -1528,22 +1545,22 @@ function KikuPickerMenu({
|
|
|
1528
1545
|
);
|
|
1529
1546
|
}
|
|
1530
1547
|
function AtPickerMenu({ onSelect, onDismiss }) {
|
|
1531
|
-
return /* @__PURE__ */
|
|
1548
|
+
return /* @__PURE__ */ jsx9(
|
|
1532
1549
|
"div",
|
|
1533
1550
|
{
|
|
1534
1551
|
className: "hsk-kiku-picker",
|
|
1535
1552
|
role: "menu",
|
|
1536
1553
|
"aria-label": "Extensions",
|
|
1537
1554
|
onMouseDown: (e) => e.preventDefault(),
|
|
1538
|
-
children: /* @__PURE__ */
|
|
1555
|
+
children: /* @__PURE__ */ jsxs8(
|
|
1539
1556
|
"button",
|
|
1540
1557
|
{
|
|
1541
1558
|
className: "hsk-kiku-picker-item",
|
|
1542
1559
|
role: "menuitem",
|
|
1543
1560
|
onClick: () => onSelect("@kiku"),
|
|
1544
1561
|
children: [
|
|
1545
|
-
/* @__PURE__ */
|
|
1546
|
-
/* @__PURE__ */
|
|
1562
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-kiku-picker-icon hsk-kiku-picker-icon--accent", children: /* @__PURE__ */ jsx9(SparkleIcon2, {}) }),
|
|
1563
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-kiku-picker-item-name", children: "kiku \u2014 capture & remember" })
|
|
1547
1564
|
]
|
|
1548
1565
|
}
|
|
1549
1566
|
)
|
|
@@ -1553,9 +1570,9 @@ function AtPickerMenu({ onSelect, onDismiss }) {
|
|
|
1553
1570
|
function SourceImg({ src, alt, onImageClick }) {
|
|
1554
1571
|
const [failed, setFailed] = useState6(false);
|
|
1555
1572
|
if (failed) {
|
|
1556
|
-
return /* @__PURE__ */
|
|
1573
|
+
return /* @__PURE__ */ jsx9("div", { style: { width: "100%", height: "100%", display: "flex", alignItems: "center", justifyContent: "center", background: "var(--hsk-chat-source-bg, rgba(0,0,0,.04))", color: "var(--hsk-chat-muted, #888)" }, children: /* @__PURE__ */ jsx9(SparkleIcon2, {}) });
|
|
1557
1574
|
}
|
|
1558
|
-
return /* @__PURE__ */
|
|
1575
|
+
return /* @__PURE__ */ jsx9(
|
|
1559
1576
|
"img",
|
|
1560
1577
|
{
|
|
1561
1578
|
src,
|
|
@@ -1596,20 +1613,20 @@ function SourcesCarousel({ sources, defaultCurrency, onSelectSource, onImageClic
|
|
|
1596
1613
|
};
|
|
1597
1614
|
const display = sources.filter((s) => s.id && referencedIds.includes(s.id));
|
|
1598
1615
|
if (display.length === 0) return null;
|
|
1599
|
-
return /* @__PURE__ */
|
|
1600
|
-
/* @__PURE__ */
|
|
1616
|
+
return /* @__PURE__ */ jsxs8("div", { className: cn("hsk-cb-sources-wrap", compact && "hsk-cb-sources-wrap--compact"), children: [
|
|
1617
|
+
/* @__PURE__ */ jsx9("div", { className: "hsk-cb-sources", ref: railRef, children: display.map((src, si) => {
|
|
1601
1618
|
const isReferenced = !!(src.id && referencedIds.includes(src.id));
|
|
1602
|
-
return /* @__PURE__ */
|
|
1619
|
+
return /* @__PURE__ */ jsxs8(
|
|
1603
1620
|
"div",
|
|
1604
1621
|
{
|
|
1605
1622
|
className: cn("hsk-cb-source", isReferenced && "hsk-cb-source--referenced"),
|
|
1606
1623
|
style: { animationDelay: `${si * 50}ms` },
|
|
1607
1624
|
onClick: () => onSelectSource?.(src),
|
|
1608
1625
|
children: [
|
|
1609
|
-
src.image ? /* @__PURE__ */
|
|
1610
|
-
/* @__PURE__ */
|
|
1611
|
-
isReferenced && /* @__PURE__ */
|
|
1612
|
-
isProperty && /* @__PURE__ */
|
|
1626
|
+
src.image ? /* @__PURE__ */ jsxs8("div", { className: "hsk-cb-src-imgwrap", style: { position: "relative" }, children: [
|
|
1627
|
+
/* @__PURE__ */ jsx9(SourceImg, { src: src.image, alt: src.name, onImageClick }),
|
|
1628
|
+
isReferenced && /* @__PURE__ */ jsx9("div", { className: "hsk-cb-source-ref-badge", title: "Featured in response", children: /* @__PURE__ */ jsx9(SparkleIcon2, { size: 10 }) }),
|
|
1629
|
+
isProperty && /* @__PURE__ */ jsx9("div", { style: {
|
|
1613
1630
|
position: "absolute",
|
|
1614
1631
|
top: "6px",
|
|
1615
1632
|
right: "6px",
|
|
@@ -1624,14 +1641,14 @@ function SourcesCarousel({ sources, defaultCurrency, onSelectSource, onImageClic
|
|
|
1624
1641
|
color: "#fbbf24",
|
|
1625
1642
|
// Gold sparkle badge
|
|
1626
1643
|
boxShadow: "0 2px 4px rgba(0,0,0,0.2)"
|
|
1627
|
-
}, children: /* @__PURE__ */
|
|
1628
|
-
] }) : /* @__PURE__ */
|
|
1629
|
-
/* @__PURE__ */
|
|
1630
|
-
isReferenced && /* @__PURE__ */
|
|
1644
|
+
}, children: /* @__PURE__ */ jsx9(SparkleIcon2, { size: 12 }) })
|
|
1645
|
+
] }) : /* @__PURE__ */ jsxs8("div", { className: "hsk-cb-src-imgwrap-empty", style: { position: "relative" }, children: [
|
|
1646
|
+
/* @__PURE__ */ jsx9(SparkleIcon2, {}),
|
|
1647
|
+
isReferenced && /* @__PURE__ */ jsx9("div", { className: "hsk-cb-source-ref-badge", title: "Featured in response", children: /* @__PURE__ */ jsx9(SparkleIcon2, { size: 10 }) })
|
|
1631
1648
|
] }),
|
|
1632
|
-
/* @__PURE__ */
|
|
1633
|
-
/* @__PURE__ */
|
|
1634
|
-
src.price && /* @__PURE__ */
|
|
1649
|
+
/* @__PURE__ */ jsxs8("div", { className: "hsk-cb-src-info", children: [
|
|
1650
|
+
/* @__PURE__ */ jsx9("div", { className: "hsk-cb-src-name", children: src.name }),
|
|
1651
|
+
src.price && /* @__PURE__ */ jsxs8("div", { className: "hsk-cb-src-price", children: [
|
|
1635
1652
|
src.currency ?? defaultCurrency,
|
|
1636
1653
|
" ",
|
|
1637
1654
|
parseFloat(String(src.price).replace(/[^0-9.]/g, "") || "0").toLocaleString()
|
|
@@ -1642,15 +1659,15 @@ function SourcesCarousel({ sources, defaultCurrency, onSelectSource, onImageClic
|
|
|
1642
1659
|
src.id ?? si
|
|
1643
1660
|
);
|
|
1644
1661
|
}) }),
|
|
1645
|
-
showNext && /* @__PURE__ */
|
|
1646
|
-
/* @__PURE__ */
|
|
1662
|
+
showNext && /* @__PURE__ */ jsxs8(Fragment3, { children: [
|
|
1663
|
+
/* @__PURE__ */ jsx9(
|
|
1647
1664
|
"div",
|
|
1648
1665
|
{
|
|
1649
1666
|
className: "hsk-cb-sources-fade",
|
|
1650
1667
|
style: { background: "linear-gradient(to right, transparent, var(--hsk-fade-bg, #0e0e0f))" }
|
|
1651
1668
|
}
|
|
1652
1669
|
),
|
|
1653
|
-
/* @__PURE__ */
|
|
1670
|
+
/* @__PURE__ */ jsx9("button", { className: "hsk-cb-sources-next", onClick: scrollNext, "aria-label": "See more", children: /* @__PURE__ */ jsx9(ChevronRightIcon, {}) })
|
|
1654
1671
|
] })
|
|
1655
1672
|
] });
|
|
1656
1673
|
}
|
|
@@ -1727,14 +1744,14 @@ function SmartContextPills({
|
|
|
1727
1744
|
pills.push({ emoji: "\u{1F4A1}", label: "Recommend something", query: "What do you recommend for me?" });
|
|
1728
1745
|
}
|
|
1729
1746
|
if (pills.length === 0) return null;
|
|
1730
|
-
return /* @__PURE__ */
|
|
1747
|
+
return /* @__PURE__ */ jsx9("div", { className: "hsk-action-pills", children: pills.map((pill) => /* @__PURE__ */ jsxs8(
|
|
1731
1748
|
"button",
|
|
1732
1749
|
{
|
|
1733
1750
|
className: "hsk-action-pill",
|
|
1734
1751
|
onClick: () => onSend(pill.query),
|
|
1735
1752
|
disabled: loading,
|
|
1736
1753
|
children: [
|
|
1737
|
-
/* @__PURE__ */
|
|
1754
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-pill-emoji", children: pill.emoji }),
|
|
1738
1755
|
pill.label
|
|
1739
1756
|
]
|
|
1740
1757
|
},
|
|
@@ -1815,8 +1832,8 @@ function ThinkingBlock({ text, isComplete, seconds: fixedSeconds }) {
|
|
|
1815
1832
|
const finalSeconds = fixedSeconds ?? seconds;
|
|
1816
1833
|
const label = isComplete ? finalSeconds !== null && finalSeconds !== void 0 ? `Thought for ${finalSeconds}s` : "Thought process" : `Thinking${seconds ? ` \xB7 ${seconds}s` : "\u2026"}`;
|
|
1817
1834
|
const expandable = !!text;
|
|
1818
|
-
return /* @__PURE__ */
|
|
1819
|
-
/* @__PURE__ */
|
|
1835
|
+
return /* @__PURE__ */ jsxs8("div", { className: cn("hsk-cb-think", !isComplete && "hsk-cb-think--live"), children: [
|
|
1836
|
+
/* @__PURE__ */ jsxs8(
|
|
1820
1837
|
"button",
|
|
1821
1838
|
{
|
|
1822
1839
|
type: "button",
|
|
@@ -1824,16 +1841,16 @@ function ThinkingBlock({ text, isComplete, seconds: fixedSeconds }) {
|
|
|
1824
1841
|
onClick: expandable ? () => setIsOpen((o) => !o) : void 0,
|
|
1825
1842
|
"aria-expanded": expandable ? isOpen : void 0,
|
|
1826
1843
|
children: [
|
|
1827
|
-
/* @__PURE__ */
|
|
1828
|
-
/* @__PURE__ */
|
|
1829
|
-
/* @__PURE__ */
|
|
1844
|
+
/* @__PURE__ */ jsxs8("svg", { width: "13", height: "13", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: !isComplete ? "hsk-cb-think-spin" : void 0, children: [
|
|
1845
|
+
/* @__PURE__ */ jsx9("circle", { cx: "12", cy: "12", r: "10" }),
|
|
1846
|
+
/* @__PURE__ */ jsx9("path", { d: "M12 6v6l4 2" })
|
|
1830
1847
|
] }),
|
|
1831
|
-
/* @__PURE__ */
|
|
1832
|
-
expandable && /* @__PURE__ */
|
|
1848
|
+
/* @__PURE__ */ jsx9("span", { children: label }),
|
|
1849
|
+
expandable && /* @__PURE__ */ jsx9("span", { className: cn("hsk-cb-think-chevron", isOpen && "hsk-cb-think-chevron--open"), children: "\u25B6" })
|
|
1833
1850
|
]
|
|
1834
1851
|
}
|
|
1835
1852
|
),
|
|
1836
|
-
expandable && isOpen && /* @__PURE__ */
|
|
1853
|
+
expandable && isOpen && /* @__PURE__ */ jsx9("div", { className: "hsk-cb-think-body", children: text })
|
|
1837
1854
|
] });
|
|
1838
1855
|
}
|
|
1839
1856
|
function ChatModal({
|
|
@@ -1979,15 +1996,7 @@ function ChatModal({
|
|
|
1979
1996
|
}, 1e3);
|
|
1980
1997
|
return () => clearInterval(t);
|
|
1981
1998
|
}, [mintedKey]);
|
|
1982
|
-
const
|
|
1983
|
-
const hskThemeAttr = isStringTheme ? theme : void 0;
|
|
1984
|
-
const customStyles = !isStringTheme && theme ? {
|
|
1985
|
-
...theme?.primaryColor && { "--hsk-primary": theme.primaryColor },
|
|
1986
|
-
...theme?.backgroundColor && { "--hsk-bg": theme.backgroundColor },
|
|
1987
|
-
...theme?.textColor && { "--hsk-text": theme.textColor },
|
|
1988
|
-
...theme?.fontFamily && { "--hsk-font": theme.fontFamily },
|
|
1989
|
-
...theme?.borderRadius && { "--hsk-border-radius": theme.borderRadius }
|
|
1990
|
-
} : void 0;
|
|
1999
|
+
const { themeAttr: hskThemeAttr, vars: customStyles } = resolveTheme(theme);
|
|
1991
2000
|
const retryLastMessage = async () => {
|
|
1992
2001
|
const lastUserMsg = [...messages].reverse().find((m) => m.role === "user");
|
|
1993
2002
|
if (lastUserMsg) await handleSend(lastUserMsg.content);
|
|
@@ -2183,7 +2192,7 @@ function ChatModal({
|
|
|
2183
2192
|
}, [voiceState]);
|
|
2184
2193
|
const blurVal = typeof backdropBlur === "number" ? `${backdropBlur}px` : backdropBlur ?? "20px";
|
|
2185
2194
|
const displayMessages = messages;
|
|
2186
|
-
return /* @__PURE__ */
|
|
2195
|
+
return /* @__PURE__ */ jsx9(
|
|
2187
2196
|
"div",
|
|
2188
2197
|
{
|
|
2189
2198
|
className: cn("hsk-cb-overlay", classNames.overlay),
|
|
@@ -2195,7 +2204,7 @@ function ChatModal({
|
|
|
2195
2204
|
...backdropColor ? { background: backdropColor } : {},
|
|
2196
2205
|
...customStyles
|
|
2197
2206
|
},
|
|
2198
|
-
children: /* @__PURE__ */
|
|
2207
|
+
children: /* @__PURE__ */ jsxs8(
|
|
2199
2208
|
"div",
|
|
2200
2209
|
{
|
|
2201
2210
|
className: cn("hsk-cb-panel", classNames.panel),
|
|
@@ -2208,11 +2217,11 @@ function ChatModal({
|
|
|
2208
2217
|
}
|
|
2209
2218
|
},
|
|
2210
2219
|
children: [
|
|
2211
|
-
lightboxSrc && /* @__PURE__ */
|
|
2212
|
-
/* @__PURE__ */
|
|
2213
|
-
/* @__PURE__ */
|
|
2220
|
+
lightboxSrc && /* @__PURE__ */ jsxs8("div", { className: "hsk-lightbox", onClick: () => setLightboxSrc(null), children: [
|
|
2221
|
+
/* @__PURE__ */ jsx9("button", { className: "hsk-lightbox-close", onClick: () => setLightboxSrc(null), "aria-label": "Close image", children: /* @__PURE__ */ jsx9(CloseIcon, {}) }),
|
|
2222
|
+
/* @__PURE__ */ jsx9("img", { src: lightboxSrc, alt: "", className: "hsk-lightbox-img", onClick: (e) => e.stopPropagation() })
|
|
2214
2223
|
] }),
|
|
2215
|
-
markupSrc && /* @__PURE__ */
|
|
2224
|
+
markupSrc && /* @__PURE__ */ jsx9("div", { className: "hsk-markup-overlay", children: /* @__PURE__ */ jsx9(
|
|
2216
2225
|
MarkupEditor,
|
|
2217
2226
|
{
|
|
2218
2227
|
src: markupSrc,
|
|
@@ -2226,44 +2235,44 @@ function ChatModal({
|
|
|
2226
2235
|
}
|
|
2227
2236
|
}
|
|
2228
2237
|
) }),
|
|
2229
|
-
/* @__PURE__ */
|
|
2230
|
-
/* @__PURE__ */
|
|
2231
|
-
/* @__PURE__ */
|
|
2232
|
-
/* @__PURE__ */
|
|
2233
|
-
/* @__PURE__ */
|
|
2238
|
+
/* @__PURE__ */ jsxs8("div", { className: "hsk-cb-main", children: [
|
|
2239
|
+
/* @__PURE__ */ jsxs8("div", { className: "hsk-cb-topbar", children: [
|
|
2240
|
+
/* @__PURE__ */ jsxs8("div", { className: "hsk-cb-topbar-left", children: [
|
|
2241
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-cb-topbar-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ jsx9(SparkleIcon2, {}) }),
|
|
2242
|
+
/* @__PURE__ */ jsx9("div", { children: /* @__PURE__ */ jsx9("div", { className: "hsk-cb-topbar-title", children: activeTitle }) })
|
|
2234
2243
|
] }),
|
|
2235
|
-
/* @__PURE__ */
|
|
2236
|
-
messages.length > 0 && /* @__PURE__ */
|
|
2237
|
-
/* @__PURE__ */
|
|
2244
|
+
/* @__PURE__ */ jsxs8("div", { className: "hsk-cb-topbar-actions", children: [
|
|
2245
|
+
messages.length > 0 && /* @__PURE__ */ jsx9("button", { className: "hsk-cb-topbar-btn", onClick: handleReset, children: "Clear chat" }),
|
|
2246
|
+
/* @__PURE__ */ jsx9("button", { className: "hsk-cb-close", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ jsx9(CloseIcon, {}) })
|
|
2238
2247
|
] })
|
|
2239
2248
|
] }),
|
|
2240
|
-
/* @__PURE__ */
|
|
2241
|
-
displayMessages.length === 0 ? /* @__PURE__ */
|
|
2242
|
-
awaitingName ? /* @__PURE__ */
|
|
2243
|
-
/* @__PURE__ */
|
|
2249
|
+
/* @__PURE__ */ jsxs8("div", { className: "hsk-cb-msgs", ref: msgsContainerRef, children: [
|
|
2250
|
+
displayMessages.length === 0 ? /* @__PURE__ */ jsxs8("div", { className: "hsk-cb-empty", children: [
|
|
2251
|
+
awaitingName ? /* @__PURE__ */ jsxs8(Fragment3, { children: [
|
|
2252
|
+
/* @__PURE__ */ jsxs8("h2", { className: "hsk-cb-hello", children: [
|
|
2244
2253
|
"Hi, I'm ",
|
|
2245
|
-
/* @__PURE__ */
|
|
2254
|
+
/* @__PURE__ */ jsx9("b", { children: "kiku" }),
|
|
2246
2255
|
"."
|
|
2247
2256
|
] }),
|
|
2248
|
-
/* @__PURE__ */
|
|
2249
|
-
/* @__PURE__ */
|
|
2250
|
-
/* @__PURE__ */
|
|
2251
|
-
] }) : shopperName ? /* @__PURE__ */
|
|
2252
|
-
/* @__PURE__ */
|
|
2257
|
+
/* @__PURE__ */ jsx9("p", { className: "hsk-cb-hello-lead", children: "I can search, visualize, or capture anything for you \u2014 on this site or any other." }),
|
|
2258
|
+
/* @__PURE__ */ jsx9("p", { className: "hsk-cb-hello-ask", children: "What should I call you?" }),
|
|
2259
|
+
/* @__PURE__ */ jsx9("button", { className: "hsk-cb-hello-skip", onClick: () => setNameSkipped(true), children: "Skip for now" })
|
|
2260
|
+
] }) : shopperName ? /* @__PURE__ */ jsxs8(Fragment3, { children: [
|
|
2261
|
+
/* @__PURE__ */ jsxs8("h2", { className: "hsk-cb-hello", children: [
|
|
2253
2262
|
"Hi, ",
|
|
2254
2263
|
shopperName,
|
|
2255
2264
|
"."
|
|
2256
2265
|
] }),
|
|
2257
|
-
/* @__PURE__ */
|
|
2258
|
-
] }) : /* @__PURE__ */
|
|
2259
|
-
/* @__PURE__ */
|
|
2266
|
+
/* @__PURE__ */ jsx9("p", { className: "hsk-cb-hello-lead", children: "What can I find for you today?" })
|
|
2267
|
+
] }) : /* @__PURE__ */ jsxs8(Fragment3, { children: [
|
|
2268
|
+
/* @__PURE__ */ jsxs8("h2", { className: "hsk-cb-hello", children: [
|
|
2260
2269
|
"Hi, I'm ",
|
|
2261
|
-
/* @__PURE__ */
|
|
2270
|
+
/* @__PURE__ */ jsx9("b", { children: "kiku" }),
|
|
2262
2271
|
"."
|
|
2263
2272
|
] }),
|
|
2264
|
-
/* @__PURE__ */
|
|
2273
|
+
/* @__PURE__ */ jsx9("p", { className: "hsk-cb-hello-lead", children: "Ask me to search, visualize, or capture anything \u2014 I look across the whole site in real time." })
|
|
2265
2274
|
] }),
|
|
2266
|
-
!awaitingName && activeChips.length > 0 && /* @__PURE__ */
|
|
2275
|
+
!awaitingName && activeChips.length > 0 && /* @__PURE__ */ jsx9("div", { className: "hsk-cb-chips", children: activeChips.map((chip) => /* @__PURE__ */ jsx9(
|
|
2267
2276
|
"button",
|
|
2268
2277
|
{
|
|
2269
2278
|
className: "hsk-cb-chip",
|
|
@@ -2279,37 +2288,49 @@ function ChatModal({
|
|
|
2279
2288
|
const compareSources = sources.filter((s) => s.id && referencedIds.includes(s.id));
|
|
2280
2289
|
const showMatrix = isLast && lastIntent === "compare" && compareSources.length >= 2;
|
|
2281
2290
|
const displayContent = !isUser && showMatrix ? stripMarkdownTables(msg.content) : msg.content;
|
|
2282
|
-
return /* @__PURE__ */
|
|
2291
|
+
return /* @__PURE__ */ jsx9("div", { className: "hsk-cb-msg-group", ref: (el) => {
|
|
2283
2292
|
messageRefs.current[idx] = el;
|
|
2284
|
-
}, children: isUser ? /* @__PURE__ */
|
|
2285
|
-
msg.images && msg.images.length > 0 && /* @__PURE__ */
|
|
2286
|
-
msg.content && /* @__PURE__ */
|
|
2287
|
-
/* @__PURE__ */
|
|
2293
|
+
}, children: isUser ? /* @__PURE__ */ jsxs8("div", { className: `hsk-cb-user-msg${isLastUser ? " hsk-sent" : ""}`, children: [
|
|
2294
|
+
msg.images && msg.images.length > 0 && /* @__PURE__ */ jsx9("div", { className: "hsk-cb-user-imgs", children: msg.images.map((img, i) => /* @__PURE__ */ jsx9("img", { src: img, alt: `attachment ${i + 1}`, className: "hsk-cb-user-img-thumb" }, i)) }),
|
|
2295
|
+
msg.content && /* @__PURE__ */ jsx9("div", { className: "hsk-cb-user-bubble", children: /^@kiku\b/i.test(msg.content) ? /* @__PURE__ */ jsxs8(Fragment3, { children: [
|
|
2296
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-kiku-badge", children: "@kiku" }),
|
|
2288
2297
|
msg.content.replace(/^@kiku\s*/i, "")
|
|
2289
2298
|
] }) : msg.content })
|
|
2290
|
-
] }) : /* @__PURE__ */
|
|
2291
|
-
/* @__PURE__ */
|
|
2292
|
-
/* @__PURE__ */
|
|
2299
|
+
] }) : /* @__PURE__ */ jsxs8("div", { className: "hsk-cb-ai-msg", children: [
|
|
2300
|
+
/* @__PURE__ */ jsx9("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ jsx9(SparkleIcon2, {}) }),
|
|
2301
|
+
/* @__PURE__ */ jsxs8("div", { className: "hsk-cb-ai-body", children: [
|
|
2293
2302
|
(() => {
|
|
2294
2303
|
const parsed = parseThinking(displayContent);
|
|
2295
2304
|
const thinking = msg.thinking || parsed.thinking;
|
|
2296
2305
|
const content = parsed.content;
|
|
2297
2306
|
const isComplete = msg.thinking ? content.length > 0 || !(isLast && streaming) : parsed.isComplete;
|
|
2298
|
-
return /* @__PURE__ */
|
|
2299
|
-
(thinking || msg.thoughtForSeconds != null) && /* @__PURE__ */
|
|
2300
|
-
content && /* @__PURE__ */
|
|
2307
|
+
return /* @__PURE__ */ jsxs8(Fragment3, { children: [
|
|
2308
|
+
(thinking || msg.thoughtForSeconds != null) && /* @__PURE__ */ jsx9(ThinkingBlock, { text: thinking, isComplete, seconds: msg.thoughtForSeconds }),
|
|
2309
|
+
content && /* @__PURE__ */ jsxs8("div", { className: "hsk-cb-ai-text", children: [
|
|
2301
2310
|
renderMarkdown(content, isLast && streaming),
|
|
2302
|
-
isLast && streaming && /* @__PURE__ */
|
|
2311
|
+
isLast && streaming && /* @__PURE__ */ jsx9("span", { style: { display: "inline-block", width: "0.5em", height: "1.05em", marginLeft: "2px", verticalAlign: "text-bottom", background: "currentColor", opacity: 0.55, borderRadius: "1px" } })
|
|
2303
2312
|
] })
|
|
2304
2313
|
] });
|
|
2305
2314
|
})(),
|
|
2306
|
-
msg.visualizing && /* @__PURE__ */
|
|
2307
|
-
/* @__PURE__ */
|
|
2308
|
-
/* @__PURE__ */
|
|
2315
|
+
msg.visualizing && /* @__PURE__ */ jsxs8("div", { className: "hsk-cb-viz hsk-cb-viz--loading", children: [
|
|
2316
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-cb-viz-spinner" }),
|
|
2317
|
+
/* @__PURE__ */ jsx9("span", { children: msg.visualizingText || "Visualizing\u2026" })
|
|
2309
2318
|
] }),
|
|
2310
|
-
msg.visualization && /* @__PURE__ */
|
|
2311
|
-
/* @__PURE__ */
|
|
2312
|
-
/* @__PURE__ */
|
|
2319
|
+
msg.visualization && /* @__PURE__ */ jsxs8("div", { className: "hsk-cb-viz", children: [
|
|
2320
|
+
/* @__PURE__ */ jsxs8("div", { className: "hsk-cb-viz-imgwrap", children: [
|
|
2321
|
+
msg.visualizationType === "video" || msg.visualization.includes("/videos/") ? /* @__PURE__ */ jsx9(
|
|
2322
|
+
"video",
|
|
2323
|
+
{
|
|
2324
|
+
src: msg.visualization,
|
|
2325
|
+
controls: true,
|
|
2326
|
+
autoPlay: true,
|
|
2327
|
+
loop: true,
|
|
2328
|
+
muted: true,
|
|
2329
|
+
playsInline: true,
|
|
2330
|
+
className: "hsk-markdown-video",
|
|
2331
|
+
style: { display: "block", maxHeight: "400px", objectFit: "contain", width: "100%" }
|
|
2332
|
+
}
|
|
2333
|
+
) : /* @__PURE__ */ jsx9(
|
|
2313
2334
|
"img",
|
|
2314
2335
|
{
|
|
2315
2336
|
src: msg.visualization,
|
|
@@ -2320,18 +2341,18 @@ function ChatModal({
|
|
|
2320
2341
|
}
|
|
2321
2342
|
}
|
|
2322
2343
|
),
|
|
2323
|
-
isLast && !streaming && /* @__PURE__ */
|
|
2324
|
-
/* @__PURE__ */
|
|
2325
|
-
/* @__PURE__ */
|
|
2326
|
-
/* @__PURE__ */
|
|
2344
|
+
isLast && !streaming && (msg.visualizationType !== "video" && !msg.visualization.includes("/videos/")) && /* @__PURE__ */ jsxs8("button", { className: "hsk-cb-viz-mark", onClick: () => setMarkupSrc(msg.visualization), children: [
|
|
2345
|
+
/* @__PURE__ */ jsxs8("svg", { width: "13", height: "13", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
|
|
2346
|
+
/* @__PURE__ */ jsx9("path", { d: "M12 20h9" }),
|
|
2347
|
+
/* @__PURE__ */ jsx9("path", { d: "M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4Z" })
|
|
2327
2348
|
] }),
|
|
2328
2349
|
"Mark & edit"
|
|
2329
2350
|
] })
|
|
2330
2351
|
] }),
|
|
2331
|
-
/* @__PURE__ */
|
|
2352
|
+
/* @__PURE__ */ jsx9("div", { className: "hsk-cb-viz-disclaimer", children: msg.visualizationType === "video" || msg.visualization.includes("/videos/") ? "AI-generated video makeover \u2014 colors, size and movement may differ from the real product." : "AI-generated preview \u2014 colours, size and placement may differ from the real product." })
|
|
2332
2353
|
] }),
|
|
2333
|
-
!isUser && (msg.knowledgeImages?.length ?? 0) > 0 && /* @__PURE__ */
|
|
2334
|
-
/* @__PURE__ */
|
|
2354
|
+
!isUser && (msg.knowledgeImages?.length ?? 0) > 0 && /* @__PURE__ */ jsx9("div", { className: "hsk-cb-kimgs", children: msg.knowledgeImages.map((ref) => /* @__PURE__ */ jsxs8("div", { className: "hsk-cb-kimg-group", children: [
|
|
2355
|
+
/* @__PURE__ */ jsx9("div", { className: "hsk-cb-kimg-grid", children: ref.images.map((img, i) => /* @__PURE__ */ jsx9(
|
|
2335
2356
|
"img",
|
|
2336
2357
|
{
|
|
2337
2358
|
src: img.url,
|
|
@@ -2345,16 +2366,16 @@ function ChatModal({
|
|
|
2345
2366
|
},
|
|
2346
2367
|
i
|
|
2347
2368
|
)) }),
|
|
2348
|
-
(ref.title || ref.images[0]?.note) && /* @__PURE__ */
|
|
2369
|
+
(ref.title || ref.images[0]?.note) && /* @__PURE__ */ jsx9("div", { className: "hsk-cb-kimg-caption", children: ref.title || ref.images[0]?.note })
|
|
2349
2370
|
] }, ref.entryId)) }),
|
|
2350
|
-
showMatrix && /* @__PURE__ */
|
|
2371
|
+
showMatrix && /* @__PURE__ */ jsx9(ComparisonMatrix, { sources: compareSources, defaultCurrency }),
|
|
2351
2372
|
(() => {
|
|
2352
2373
|
const msgReferencedIds = isLast ? referencedIds : msg.referencedIds ?? [];
|
|
2353
2374
|
const msgSources = isLast ? sources : msg.sources ?? [];
|
|
2354
2375
|
const msgIntent = isLast ? lastIntent : msg.intent;
|
|
2355
2376
|
const hiddenIntent = msgIntent === "compare" || msgIntent === "capture" || msgIntent === "capture_all" || msgIntent === "delete" || msgIntent === "view_history";
|
|
2356
2377
|
const showCarousel = msgReferencedIds.length > 0 && !hiddenIntent && (!isLast || lastAction?.type !== "request_kiku_key");
|
|
2357
|
-
return showCarousel && /* @__PURE__ */
|
|
2378
|
+
return showCarousel && /* @__PURE__ */ jsx9(
|
|
2358
2379
|
SourcesCarousel,
|
|
2359
2380
|
{
|
|
2360
2381
|
sources: msgSources,
|
|
@@ -2366,11 +2387,11 @@ function ChatModal({
|
|
|
2366
2387
|
}
|
|
2367
2388
|
);
|
|
2368
2389
|
})(),
|
|
2369
|
-
isLast && !loading && lastAction?.url && /* @__PURE__ */
|
|
2390
|
+
isLast && !loading && lastAction?.url && /* @__PURE__ */ jsx9("div", { className: "hsk-action-pills", children: /* @__PURE__ */ jsxs8("a", { className: "hsk-action-pill", href: lastAction.url, children: [
|
|
2370
2391
|
String(lastAction.type || "continue").replace(/_/g, " "),
|
|
2371
2392
|
" \u2192"
|
|
2372
2393
|
] }) }),
|
|
2373
|
-
isLast && !loading && /* @__PURE__ */
|
|
2394
|
+
isLast && !loading && /* @__PURE__ */ jsx9(
|
|
2374
2395
|
SmartContextPills,
|
|
2375
2396
|
{
|
|
2376
2397
|
intent: lastIntent,
|
|
@@ -2382,16 +2403,16 @@ function ChatModal({
|
|
|
2382
2403
|
] })
|
|
2383
2404
|
] }) }, idx);
|
|
2384
2405
|
}),
|
|
2385
|
-
selectedProduct && loading && /* @__PURE__ */
|
|
2406
|
+
selectedProduct && loading && /* @__PURE__ */ jsxs8(
|
|
2386
2407
|
"div",
|
|
2387
2408
|
{
|
|
2388
2409
|
className: "hsk-cb-selected-product",
|
|
2389
2410
|
onClick: () => selectedProduct.url && window.open(selectedProduct.url, "_blank"),
|
|
2390
2411
|
children: [
|
|
2391
|
-
selectedProduct.image && /* @__PURE__ */
|
|
2392
|
-
/* @__PURE__ */
|
|
2393
|
-
/* @__PURE__ */
|
|
2394
|
-
selectedProduct.price && /* @__PURE__ */
|
|
2412
|
+
selectedProduct.image && /* @__PURE__ */ jsx9("img", { className: "hsk-cb-selected-img", src: selectedProduct.image, alt: selectedProduct.name }),
|
|
2413
|
+
/* @__PURE__ */ jsxs8("div", { className: "hsk-cb-selected-info", children: [
|
|
2414
|
+
/* @__PURE__ */ jsx9("div", { className: "hsk-cb-selected-name", children: selectedProduct.name }),
|
|
2415
|
+
selectedProduct.price && /* @__PURE__ */ jsxs8("div", { className: "hsk-cb-selected-price", children: [
|
|
2395
2416
|
selectedProduct.currency ?? defaultCurrency,
|
|
2396
2417
|
" ",
|
|
2397
2418
|
parseFloat(String(selectedProduct.price ?? "").replace(/[^0-9.]/g, "") || "0").toLocaleString()
|
|
@@ -2400,22 +2421,22 @@ function ChatModal({
|
|
|
2400
2421
|
]
|
|
2401
2422
|
}
|
|
2402
2423
|
),
|
|
2403
|
-
loading && !streaming && /* @__PURE__ */
|
|
2404
|
-
/* @__PURE__ */
|
|
2405
|
-
/* @__PURE__ */
|
|
2406
|
-
/* @__PURE__ */
|
|
2407
|
-
/* @__PURE__ */
|
|
2408
|
-
/* @__PURE__ */
|
|
2409
|
-
/* @__PURE__ */
|
|
2410
|
-
/* @__PURE__ */
|
|
2411
|
-
/* @__PURE__ */
|
|
2412
|
-
/* @__PURE__ */
|
|
2424
|
+
loading && !streaming && /* @__PURE__ */ jsxs8("div", { className: "hsk-cb-typing-row", style: { display: "flex", alignItems: "center", gap: "10px" }, children: [
|
|
2425
|
+
/* @__PURE__ */ jsxs8("div", { className: "hsk-cb-thinking-icon", children: [
|
|
2426
|
+
/* @__PURE__ */ jsx9("svg", { className: "hsk-brand-mark", viewBox: "0 0 100 100", "aria-hidden": "true", children: /* @__PURE__ */ jsx9("path", { d: "M39.4 10.4 Q44 0 48.6 10.4 L86.1 95.8 Q88 100 83.4 100 L4.6 100 Q0 100 1.9 95.8 Z M24 100 L24 65 Q24 60 27.4 56.3 Q44 38 60.6 56.3 Q64 60 64 65 L64 100 Z", transform: "translate(22.7 19) scale(0.62)", fillRule: "evenodd" }) }),
|
|
2427
|
+
/* @__PURE__ */ jsx9("svg", { className: "hsk-brand-mark hsk-brand-mark--sheen", viewBox: "0 0 100 100", "aria-hidden": "true", children: /* @__PURE__ */ jsx9("path", { d: "M39.4 10.4 Q44 0 48.6 10.4 L86.1 95.8 Q88 100 83.4 100 L4.6 100 Q0 100 1.9 95.8 Z M24 100 L24 65 Q24 60 27.4 56.3 Q44 38 60.6 56.3 Q64 60 64 65 L64 100 Z", transform: "translate(22.7 19) scale(0.62)", fillRule: "evenodd" }) }),
|
|
2428
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-handle-orbit", children: /* @__PURE__ */ jsxs8("span", { className: "hsk-handle-ring", children: [
|
|
2429
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-handle-ball" }),
|
|
2430
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-handle-ball" }),
|
|
2431
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-handle-ball" }),
|
|
2432
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-handle-ball" }),
|
|
2433
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-handle-ball" })
|
|
2413
2434
|
] }) }),
|
|
2414
|
-
/* @__PURE__ */
|
|
2435
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-handle-rest" })
|
|
2415
2436
|
] }),
|
|
2416
|
-
/* @__PURE__ */
|
|
2437
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-cb-thinking-text", children: "Thinking\u2026" })
|
|
2417
2438
|
] }),
|
|
2418
|
-
lastAction?.type === "open_memory" && lastAction.url && !loading && !streaming && /* @__PURE__ */
|
|
2439
|
+
lastAction?.type === "open_memory" && lastAction.url && !loading && !streaming && /* @__PURE__ */ jsxs8(
|
|
2419
2440
|
"a",
|
|
2420
2441
|
{
|
|
2421
2442
|
className: "hsk-cb-memory-pill",
|
|
@@ -2424,23 +2445,23 @@ function ChatModal({
|
|
|
2424
2445
|
rel: "noopener noreferrer",
|
|
2425
2446
|
children: [
|
|
2426
2447
|
"Open my memory on mimi",
|
|
2427
|
-
/* @__PURE__ */
|
|
2448
|
+
/* @__PURE__ */ jsx9(ExternalIcon, {})
|
|
2428
2449
|
]
|
|
2429
2450
|
}
|
|
2430
2451
|
),
|
|
2431
|
-
(stopped || interrupted) && !loading && !streaming && messages.length > 0 && /* @__PURE__ */
|
|
2432
|
-
/* @__PURE__ */
|
|
2433
|
-
/* @__PURE__ */
|
|
2434
|
-
/* @__PURE__ */
|
|
2452
|
+
(stopped || interrupted) && !loading && !streaming && messages.length > 0 && /* @__PURE__ */ jsxs8("div", { className: "hsk-cb-stopped", children: [
|
|
2453
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-cb-stopped-label", children: stopped ? "You stopped this response." : "This response was interrupted." }),
|
|
2454
|
+
/* @__PURE__ */ jsxs8("button", { className: "hsk-cb-continue", onClick: continueGenerating, children: [
|
|
2455
|
+
/* @__PURE__ */ jsx9(ContinueIcon, {}),
|
|
2435
2456
|
messages[messages.length - 1]?.role === "assistant" ? "Continue generating" : "Generate response"
|
|
2436
2457
|
] })
|
|
2437
2458
|
] }),
|
|
2438
|
-
error && /* @__PURE__ */
|
|
2439
|
-
keyPhase === "prompt_key" && /* @__PURE__ */
|
|
2440
|
-
/* @__PURE__ */
|
|
2441
|
-
/* @__PURE__ */
|
|
2442
|
-
/* @__PURE__ */
|
|
2443
|
-
/* @__PURE__ */
|
|
2459
|
+
error && /* @__PURE__ */ jsx9("div", { className: "hsk-cb-error", children: getFriendlyError(error) }),
|
|
2460
|
+
keyPhase === "prompt_key" && /* @__PURE__ */ jsxs8("div", { className: "hsk-cb-ai-msg", children: [
|
|
2461
|
+
/* @__PURE__ */ jsx9("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ jsx9(SparkleIcon2, {}) }),
|
|
2462
|
+
/* @__PURE__ */ jsx9("div", { className: "hsk-cb-ai-body", children: /* @__PURE__ */ jsx9("div", { className: "hsk-cb-ai-text", children: /* @__PURE__ */ jsxs8("div", { className: "hsk-cb-phone-form", children: [
|
|
2463
|
+
/* @__PURE__ */ jsx9("label", { className: "hsk-cb-phone-label", children: "Paste your public id \u2014 or create one" }),
|
|
2464
|
+
/* @__PURE__ */ jsx9(
|
|
2444
2465
|
"input",
|
|
2445
2466
|
{
|
|
2446
2467
|
type: "text",
|
|
@@ -2452,49 +2473,49 @@ function ChatModal({
|
|
|
2452
2473
|
autoFocus: true
|
|
2453
2474
|
}
|
|
2454
2475
|
),
|
|
2455
|
-
/* @__PURE__ */
|
|
2456
|
-
/* @__PURE__ */
|
|
2457
|
-
/* @__PURE__ */
|
|
2476
|
+
/* @__PURE__ */ jsxs8("div", { style: { display: "flex", gap: 8 }, children: [
|
|
2477
|
+
/* @__PURE__ */ jsx9("button", { className: "hsk-cb-phone-submit", onClick: handleUseExistingKey, disabled: !keyInput.trim(), children: "Use my id" }),
|
|
2478
|
+
/* @__PURE__ */ jsx9("button", { className: "hsk-cb-phone-submit", onClick: handleCreateKey, disabled: minting, children: minting ? "Creating\u2026" : "I'm new \u2014 create one" })
|
|
2458
2479
|
] })
|
|
2459
2480
|
] }) }) })
|
|
2460
2481
|
] }),
|
|
2461
|
-
mintedKey && /* @__PURE__ */
|
|
2462
|
-
/* @__PURE__ */
|
|
2463
|
-
/* @__PURE__ */
|
|
2464
|
-
/* @__PURE__ */
|
|
2465
|
-
/* @__PURE__ */
|
|
2466
|
-
/* @__PURE__ */
|
|
2467
|
-
/* @__PURE__ */
|
|
2468
|
-
/* @__PURE__ */
|
|
2469
|
-
/* @__PURE__ */
|
|
2482
|
+
mintedKey && /* @__PURE__ */ jsxs8("div", { className: "hsk-cb-ai-msg", children: [
|
|
2483
|
+
/* @__PURE__ */ jsx9("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ jsx9(SparkleIcon2, {}) }),
|
|
2484
|
+
/* @__PURE__ */ jsx9("div", { className: "hsk-cb-ai-body", children: /* @__PURE__ */ jsx9("div", { className: "hsk-cb-ai-text", children: /* @__PURE__ */ jsxs8("div", { style: { padding: "12px 14px", border: "1px solid var(--hsk-border, #e5e5e5)", borderRadius: "var(--hsk-border-radius, 0px)", display: "flex", flexDirection: "column", gap: 12 }, children: [
|
|
2485
|
+
/* @__PURE__ */ jsxs8("div", { children: [
|
|
2486
|
+
/* @__PURE__ */ jsx9("div", { style: { fontSize: 12, fontWeight: 600, marginBottom: 4 }, children: "Your secret \u2014 shown only once" }),
|
|
2487
|
+
/* @__PURE__ */ jsx9("code", { style: { display: "block", fontSize: 14, fontWeight: 700, marginBottom: 6, wordBreak: "break-all" }, children: mintedKey }),
|
|
2488
|
+
/* @__PURE__ */ jsxs8("div", { style: { display: "flex", gap: 8, alignItems: "center" }, children: [
|
|
2489
|
+
/* @__PURE__ */ jsx9("button", { className: "hsk-cb-phone-submit", style: { padding: "4px 10px" }, onClick: () => copyValue(mintedKey, "secret"), children: copied === "secret" ? "Copied" : "Copy secret" }),
|
|
2490
|
+
/* @__PURE__ */ jsx9("span", { style: { fontSize: 11, opacity: 0.7 }, children: "Keep it private \u2014 use it to unlock your memory at mimi.akropolys.cloud. If lost, the memory is lost with it." })
|
|
2470
2491
|
] })
|
|
2471
2492
|
] }),
|
|
2472
|
-
mintedPub && /* @__PURE__ */
|
|
2473
|
-
/* @__PURE__ */
|
|
2474
|
-
/* @__PURE__ */
|
|
2475
|
-
/* @__PURE__ */
|
|
2476
|
-
/* @__PURE__ */
|
|
2477
|
-
/* @__PURE__ */
|
|
2493
|
+
mintedPub && /* @__PURE__ */ jsxs8("div", { children: [
|
|
2494
|
+
/* @__PURE__ */ jsx9("div", { style: { fontSize: 12, fontWeight: 600, marginBottom: 4 }, children: "Your public id" }),
|
|
2495
|
+
/* @__PURE__ */ jsx9("code", { style: { display: "block", fontSize: 13, fontWeight: 600, marginBottom: 6, wordBreak: "break-all", opacity: 0.85 }, children: mintedPub }),
|
|
2496
|
+
/* @__PURE__ */ jsxs8("div", { style: { display: "flex", gap: 8, alignItems: "center" }, children: [
|
|
2497
|
+
/* @__PURE__ */ jsx9("button", { className: "hsk-cb-phone-submit", style: { padding: "4px 10px" }, onClick: () => copyValue(mintedPub, "pub"), children: copied === "pub" ? "Copied" : "Copy id" }),
|
|
2498
|
+
/* @__PURE__ */ jsx9("span", { style: { fontSize: 11, opacity: 0.7 }, children: "Paste this on any site to keep saving to the same memory." })
|
|
2478
2499
|
] })
|
|
2479
2500
|
] }),
|
|
2480
|
-
/* @__PURE__ */
|
|
2501
|
+
/* @__PURE__ */ jsxs8("div", { style: { fontSize: 11, opacity: 0.6 }, children: [
|
|
2481
2502
|
"Hidden in ",
|
|
2482
2503
|
keyCountdown,
|
|
2483
2504
|
"s."
|
|
2484
2505
|
] })
|
|
2485
2506
|
] }) }) })
|
|
2486
2507
|
] }),
|
|
2487
|
-
/* @__PURE__ */
|
|
2508
|
+
/* @__PURE__ */ jsx9("div", { ref: bottomRef, style: { height: 1 } })
|
|
2488
2509
|
] }),
|
|
2489
|
-
/* @__PURE__ */
|
|
2490
|
-
showAtPicker && /* @__PURE__ */
|
|
2510
|
+
/* @__PURE__ */ jsxs8("div", { className: "hsk-cb-input-wrap", children: [
|
|
2511
|
+
showAtPicker && /* @__PURE__ */ jsx9(
|
|
2491
2512
|
AtPickerMenu,
|
|
2492
2513
|
{
|
|
2493
2514
|
onSelect: handleSelectExtension,
|
|
2494
2515
|
onDismiss: () => setShowAtPicker(false)
|
|
2495
2516
|
}
|
|
2496
2517
|
),
|
|
2497
|
-
showKikuPicker && /* @__PURE__ */
|
|
2518
|
+
showKikuPicker && /* @__PURE__ */ jsx9(
|
|
2498
2519
|
KikuPickerMenu,
|
|
2499
2520
|
{
|
|
2500
2521
|
sources,
|
|
@@ -2507,9 +2528,9 @@ function ChatModal({
|
|
|
2507
2528
|
onDismiss: () => setShowKikuPicker(false)
|
|
2508
2529
|
}
|
|
2509
2530
|
),
|
|
2510
|
-
attachments.length > 0 && /* @__PURE__ */
|
|
2511
|
-
/* @__PURE__ */
|
|
2512
|
-
/* @__PURE__ */
|
|
2531
|
+
attachments.length > 0 && /* @__PURE__ */ jsx9("div", { className: "hsk-cb-img-strip", children: attachments.map((att, i) => /* @__PURE__ */ jsxs8("div", { className: "hsk-cb-img-thumb-wrap", children: [
|
|
2532
|
+
/* @__PURE__ */ jsx9("img", { src: att.data, alt: `attachment ${i + 1}`, className: "hsk-cb-img-thumb" }),
|
|
2533
|
+
/* @__PURE__ */ jsx9(
|
|
2513
2534
|
"button",
|
|
2514
2535
|
{
|
|
2515
2536
|
className: "hsk-cb-img-thumb-remove",
|
|
@@ -2519,8 +2540,8 @@ function ChatModal({
|
|
|
2519
2540
|
}
|
|
2520
2541
|
)
|
|
2521
2542
|
] }, i)) }),
|
|
2522
|
-
/* @__PURE__ */
|
|
2523
|
-
/* @__PURE__ */
|
|
2543
|
+
/* @__PURE__ */ jsxs8("div", { className: "hsk-cb-input-box", children: [
|
|
2544
|
+
/* @__PURE__ */ jsx9(
|
|
2524
2545
|
"input",
|
|
2525
2546
|
{
|
|
2526
2547
|
ref: imageInputRef,
|
|
@@ -2531,7 +2552,7 @@ function ChatModal({
|
|
|
2531
2552
|
onChange: (e) => handleImageFiles(e.target.files)
|
|
2532
2553
|
}
|
|
2533
2554
|
),
|
|
2534
|
-
enableVision && /* @__PURE__ */
|
|
2555
|
+
enableVision && /* @__PURE__ */ jsx9(
|
|
2535
2556
|
"button",
|
|
2536
2557
|
{
|
|
2537
2558
|
className: "hsk-cb-attach-btn",
|
|
@@ -2539,10 +2560,10 @@ function ChatModal({
|
|
|
2539
2560
|
disabled: loading,
|
|
2540
2561
|
"aria-label": "Attach image",
|
|
2541
2562
|
title: "Attach image",
|
|
2542
|
-
children: /* @__PURE__ */
|
|
2563
|
+
children: /* @__PURE__ */ jsx9(PaperclipIcon, {})
|
|
2543
2564
|
}
|
|
2544
2565
|
),
|
|
2545
|
-
/* @__PURE__ */
|
|
2566
|
+
/* @__PURE__ */ jsx9(
|
|
2546
2567
|
"textarea",
|
|
2547
2568
|
{
|
|
2548
2569
|
ref: textareaRef,
|
|
@@ -2556,7 +2577,7 @@ function ChatModal({
|
|
|
2556
2577
|
autoFocus: true
|
|
2557
2578
|
}
|
|
2558
2579
|
),
|
|
2559
|
-
hasSpeechAPI && enableVoice && /* @__PURE__ */
|
|
2580
|
+
hasSpeechAPI && enableVoice && /* @__PURE__ */ jsxs8(
|
|
2560
2581
|
"button",
|
|
2561
2582
|
{
|
|
2562
2583
|
className: cn(
|
|
@@ -2569,32 +2590,32 @@ function ChatModal({
|
|
|
2569
2590
|
"aria-label": voiceState === "idle" ? "Start voice input" : "Stop recording",
|
|
2570
2591
|
title: voiceState === "idle" ? "Voice input" : "Stop",
|
|
2571
2592
|
children: [
|
|
2572
|
-
voiceState === "listening" ? /* @__PURE__ */
|
|
2573
|
-
voiceState === "listening" && /* @__PURE__ */
|
|
2593
|
+
voiceState === "listening" ? /* @__PURE__ */ jsx9(MicOffIcon, {}) : /* @__PURE__ */ jsx9(MicIcon2, {}),
|
|
2594
|
+
voiceState === "listening" && /* @__PURE__ */ jsx9("span", { className: "hsk-cb-mic-pulse" })
|
|
2574
2595
|
]
|
|
2575
2596
|
}
|
|
2576
2597
|
),
|
|
2577
|
-
loading || streaming ? /* @__PURE__ */
|
|
2598
|
+
loading || streaming ? /* @__PURE__ */ jsx9(
|
|
2578
2599
|
"button",
|
|
2579
2600
|
{
|
|
2580
2601
|
className: cn("hsk-cb-send", "hsk-cb-send--stop", classNames.sendButton),
|
|
2581
2602
|
onClick: stop,
|
|
2582
2603
|
"aria-label": "Stop generating",
|
|
2583
2604
|
title: "Stop generating",
|
|
2584
|
-
children: /* @__PURE__ */
|
|
2605
|
+
children: /* @__PURE__ */ jsx9(StopIcon, {})
|
|
2585
2606
|
}
|
|
2586
|
-
) : /* @__PURE__ */
|
|
2607
|
+
) : /* @__PURE__ */ jsx9(
|
|
2587
2608
|
"button",
|
|
2588
2609
|
{
|
|
2589
2610
|
className: cn("hsk-cb-send", classNames.sendButton),
|
|
2590
2611
|
onClick: () => handleSend(),
|
|
2591
2612
|
disabled: !input.trim() && attachments.length === 0,
|
|
2592
2613
|
"aria-label": "Send message",
|
|
2593
|
-
children: /* @__PURE__ */
|
|
2614
|
+
children: /* @__PURE__ */ jsx9(ArrowUpIcon, {})
|
|
2594
2615
|
}
|
|
2595
2616
|
)
|
|
2596
2617
|
] }),
|
|
2597
|
-
/* @__PURE__ */
|
|
2618
|
+
/* @__PURE__ */ jsx9("div", { className: "hsk-cb-hint", children: "kiku \xB7 searches the whole catalogue in real time" })
|
|
2598
2619
|
] })
|
|
2599
2620
|
] })
|
|
2600
2621
|
]
|
|
@@ -2647,17 +2668,9 @@ function KikuButton({
|
|
|
2647
2668
|
window.removeEventListener("akropolys:navigation", handleNavigation);
|
|
2648
2669
|
};
|
|
2649
2670
|
}, []);
|
|
2650
|
-
const
|
|
2651
|
-
|
|
2652
|
-
|
|
2653
|
-
...theme?.primaryColor && { "--hsk-primary": theme.primaryColor },
|
|
2654
|
-
...theme?.backgroundColor && { "--hsk-bg": theme.backgroundColor },
|
|
2655
|
-
...theme?.textColor && { "--hsk-text": theme.textColor },
|
|
2656
|
-
...theme?.fontFamily && { "--hsk-font": theme.fontFamily },
|
|
2657
|
-
...theme?.borderRadius && { "--hsk-border-radius": theme.borderRadius }
|
|
2658
|
-
} : void 0;
|
|
2659
|
-
return /* @__PURE__ */ jsxs7(Fragment3, { children: [
|
|
2660
|
-
/* @__PURE__ */ jsxs7(
|
|
2671
|
+
const { themeAttr: hskThemeAttr, vars: customStyles } = resolveTheme(theme);
|
|
2672
|
+
return /* @__PURE__ */ jsxs8(Fragment3, { children: [
|
|
2673
|
+
/* @__PURE__ */ jsxs8(
|
|
2661
2674
|
"button",
|
|
2662
2675
|
{
|
|
2663
2676
|
className: cn("hsk-cb-btn", classNames.button, className),
|
|
@@ -2666,13 +2679,13 @@ function KikuButton({
|
|
|
2666
2679
|
"data-hsk-theme": hskThemeAttr,
|
|
2667
2680
|
"aria-label": "Open AI chat",
|
|
2668
2681
|
children: [
|
|
2669
|
-
/* @__PURE__ */
|
|
2682
|
+
/* @__PURE__ */ jsx9("span", { className: "hsk-cb-btn-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ jsx9(SparkleIcon2, {}) }),
|
|
2670
2683
|
label !== void 0 ? label : null
|
|
2671
2684
|
]
|
|
2672
2685
|
}
|
|
2673
2686
|
),
|
|
2674
2687
|
open && mounted && createPortal(
|
|
2675
|
-
/* @__PURE__ */
|
|
2688
|
+
/* @__PURE__ */ jsx9(
|
|
2676
2689
|
ChatModal,
|
|
2677
2690
|
{
|
|
2678
2691
|
title,
|
|
@@ -2700,8 +2713,8 @@ function KikuButton({
|
|
|
2700
2713
|
import { useState as useState7, useEffect as useEffect5, useRef as useRef7 } from "react";
|
|
2701
2714
|
import { createPortal as createPortal2 } from "react-dom";
|
|
2702
2715
|
import { useSearch as useSearch2, useKiku as useKiku3, useAkropolysContext as useAkropolysContext4 } from "@akropolys/sdk";
|
|
2703
|
-
import { Fragment as Fragment4, jsx as
|
|
2704
|
-
var SparkleIcon3 = ({ className, size = 16 }) => /* @__PURE__ */
|
|
2716
|
+
import { Fragment as Fragment4, jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
2717
|
+
var SparkleIcon3 = ({ className, size = 16 }) => /* @__PURE__ */ jsx10(
|
|
2705
2718
|
"svg",
|
|
2706
2719
|
{
|
|
2707
2720
|
className: cn("hsk-brand-mark", className),
|
|
@@ -2710,19 +2723,15 @@ var SparkleIcon3 = ({ className, size = 16 }) => /* @__PURE__ */ jsx9(
|
|
|
2710
2723
|
viewBox: "0 0 100 100",
|
|
2711
2724
|
xmlns: "http://www.w3.org/2000/svg",
|
|
2712
2725
|
"aria-label": "kiku",
|
|
2713
|
-
children: /* @__PURE__ */
|
|
2714
|
-
/* @__PURE__ */
|
|
2715
|
-
/* @__PURE__ */
|
|
2726
|
+
children: /* @__PURE__ */ jsxs9("g", { transform: "translate(22.7 19) scale(0.62)", fill: "currentColor", fillRule: "evenodd", children: [
|
|
2727
|
+
/* @__PURE__ */ jsx10("path", { d: "M39.4 10.4 Q44 0 48.6 10.4 L86.1 95.8 Q88 100 83.4 100 L4.6 100 Q0 100 1.9 95.8 Z M24 100 L24 65 Q24 60 27.4 56.3 Q44 38 60.6 56.3 Q64 60 64 65 L64 100 Z" }),
|
|
2728
|
+
/* @__PURE__ */ jsx10("circle", { cx: "55", cy: "82", r: "3.4" })
|
|
2716
2729
|
] })
|
|
2717
2730
|
}
|
|
2718
2731
|
);
|
|
2719
|
-
var CloseIcon2 = () => /* @__PURE__ */
|
|
2720
|
-
/* @__PURE__ */
|
|
2721
|
-
/* @__PURE__ */
|
|
2722
|
-
] });
|
|
2723
|
-
var ArrowUpIcon3 = () => /* @__PURE__ */ jsxs8("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
2724
|
-
/* @__PURE__ */ jsx9("path", { d: "m5 12 7-7 7 7" }),
|
|
2725
|
-
/* @__PURE__ */ jsx9("path", { d: "M12 19V5" })
|
|
2732
|
+
var CloseIcon2 = () => /* @__PURE__ */ jsxs9("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
2733
|
+
/* @__PURE__ */ jsx10("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
|
|
2734
|
+
/* @__PURE__ */ jsx10("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
|
|
2726
2735
|
] });
|
|
2727
2736
|
var getFriendlyError2 = (err) => {
|
|
2728
2737
|
let str = "";
|
|
@@ -2848,7 +2857,7 @@ Question: ${q}`;
|
|
|
2848
2857
|
}
|
|
2849
2858
|
] : messages;
|
|
2850
2859
|
if (isMobile) {
|
|
2851
|
-
return /* @__PURE__ */
|
|
2860
|
+
return /* @__PURE__ */ jsx10(
|
|
2852
2861
|
"div",
|
|
2853
2862
|
{
|
|
2854
2863
|
className: cn("hsk-sp-backdrop hsk-sp-mobile-view", classNames.backdrop),
|
|
@@ -2859,13 +2868,13 @@ Question: ${q}`;
|
|
|
2859
2868
|
background: bg ?? void 0,
|
|
2860
2869
|
...customStyles
|
|
2861
2870
|
},
|
|
2862
|
-
children: /* @__PURE__ */
|
|
2863
|
-
/* @__PURE__ */
|
|
2864
|
-
/* @__PURE__ */
|
|
2865
|
-
/* @__PURE__ */
|
|
2866
|
-
/* @__PURE__ */
|
|
2867
|
-
/* @__PURE__ */
|
|
2868
|
-
displayProduct && /* @__PURE__ */
|
|
2871
|
+
children: /* @__PURE__ */ jsxs9("div", { className: cn("hsk-sp-card hsk-sp-fullscreen hsk-sp-mobile-card", classNames.card), onClick: (e) => e.stopPropagation(), children: [
|
|
2872
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-header", children: [
|
|
2873
|
+
/* @__PURE__ */ jsx10("span", { className: "hsk-sp-header-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ jsx10(SparkleIcon3, {}) }),
|
|
2874
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-header-body", children: [
|
|
2875
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-header-title-row", children: [
|
|
2876
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-header-title", children: displayProduct?.name || productName }),
|
|
2877
|
+
displayProduct && /* @__PURE__ */ jsx10(
|
|
2869
2878
|
"button",
|
|
2870
2879
|
{
|
|
2871
2880
|
type: "button",
|
|
@@ -2875,32 +2884,32 @@ Question: ${q}`;
|
|
|
2875
2884
|
}
|
|
2876
2885
|
)
|
|
2877
2886
|
] }),
|
|
2878
|
-
/* @__PURE__ */
|
|
2887
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-header-sub", children: "kiku" })
|
|
2879
2888
|
] }),
|
|
2880
|
-
/* @__PURE__ */
|
|
2889
|
+
/* @__PURE__ */ jsx10("button", { className: "hsk-sp-close", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ jsx10(CloseIcon2, {}) })
|
|
2881
2890
|
] }),
|
|
2882
|
-
searchLoading && /* @__PURE__ */
|
|
2883
|
-
/* @__PURE__ */
|
|
2884
|
-
/* @__PURE__ */
|
|
2891
|
+
searchLoading && /* @__PURE__ */ jsx10("div", { className: "hsk-sp-bar" }),
|
|
2892
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-mobile-chat-container", children: [
|
|
2893
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-cb-msgs", children: [
|
|
2885
2894
|
displayMessages.map((msg, idx) => {
|
|
2886
2895
|
const isUser = msg.role === "user";
|
|
2887
|
-
return /* @__PURE__ */
|
|
2888
|
-
/* @__PURE__ */
|
|
2889
|
-
/* @__PURE__ */
|
|
2890
|
-
/* @__PURE__ */
|
|
2891
|
-
idx === 0 && displayProduct && /* @__PURE__ */
|
|
2892
|
-
/* @__PURE__ */
|
|
2893
|
-
/* @__PURE__ */
|
|
2894
|
-
/* @__PURE__ */
|
|
2895
|
-
/* @__PURE__ */
|
|
2896
|
-
/* @__PURE__ */
|
|
2897
|
-
/* @__PURE__ */
|
|
2896
|
+
return /* @__PURE__ */ jsx10("div", { className: "hsk-cb-msg-group", children: isUser ? /* @__PURE__ */ jsx10("div", { className: "hsk-cb-user-msg", children: /* @__PURE__ */ jsx10("div", { className: "hsk-cb-user-bubble", children: msg.content }) }) : /* @__PURE__ */ jsxs9("div", { className: "hsk-cb-ai-msg", children: [
|
|
2897
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ jsx10(SparkleIcon3, {}) }),
|
|
2898
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-cb-ai-body", children: [
|
|
2899
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-cb-ai-text", children: renderMarkdown(msg.content) }),
|
|
2900
|
+
idx === 0 && displayProduct && /* @__PURE__ */ jsxs9("div", { className: "hsk-sp-mobile-attachment-deck", children: [
|
|
2901
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-mobile-main-card", children: [
|
|
2902
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-mobile-main-card-img", children: displayProduct.images?.[0] ? /* @__PURE__ */ jsx10("img", { src: displayProduct.images[0], alt: displayProduct.name }) : /* @__PURE__ */ jsx10("span", { children: "\xF0\u0178\u203A\x8D" }) }),
|
|
2903
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-mobile-main-card-info", children: [
|
|
2904
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-mobile-main-card-brand", children: displayProduct.brand || displayProduct.category || "Product" }),
|
|
2905
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-mobile-main-card-name", children: displayProduct.name }),
|
|
2906
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-mobile-main-card-price", children: [
|
|
2898
2907
|
displayProduct.currency ?? "KES",
|
|
2899
2908
|
" ",
|
|
2900
2909
|
parseFloat(displayProduct.price?.replace(/[^0-9.]/g, "") || "0").toLocaleString()
|
|
2901
2910
|
] })
|
|
2902
2911
|
] }),
|
|
2903
|
-
(displayProduct.specs && Object.keys(displayProduct.specs).length > 0 || displayProduct.description) && /* @__PURE__ */
|
|
2912
|
+
(displayProduct.specs && Object.keys(displayProduct.specs).length > 0 || displayProduct.description) && /* @__PURE__ */ jsx10(
|
|
2904
2913
|
"button",
|
|
2905
2914
|
{
|
|
2906
2915
|
type: "button",
|
|
@@ -2919,21 +2928,21 @@ Question: ${q}`;
|
|
|
2919
2928
|
}
|
|
2920
2929
|
);
|
|
2921
2930
|
if (similarProducts.length === 0) return null;
|
|
2922
|
-
return /* @__PURE__ */
|
|
2923
|
-
/* @__PURE__ */
|
|
2924
|
-
/* @__PURE__ */
|
|
2931
|
+
return /* @__PURE__ */ jsxs9("div", { className: "hsk-sp-mobile-similar-carousel-inline", children: [
|
|
2932
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-mobile-similar-carousel-title", children: "Similar Products" }),
|
|
2933
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-mobile-similar-carousel-list", children: similarProducts.map((r) => {
|
|
2925
2934
|
const price = parseFloat(r.entity.price?.replace(/[^0-9.]/g, "") || "0");
|
|
2926
2935
|
const currency = r.entity.currency ?? "KES";
|
|
2927
|
-
return /* @__PURE__ */
|
|
2936
|
+
return /* @__PURE__ */ jsxs9(
|
|
2928
2937
|
"div",
|
|
2929
2938
|
{
|
|
2930
2939
|
className: "hsk-sp-mobile-similar-carousel-item",
|
|
2931
2940
|
onClick: () => handleNav(r),
|
|
2932
2941
|
children: [
|
|
2933
|
-
/* @__PURE__ */
|
|
2934
|
-
/* @__PURE__ */
|
|
2935
|
-
/* @__PURE__ */
|
|
2936
|
-
/* @__PURE__ */
|
|
2942
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-mobile-similar-carousel-img", children: r.entity.images?.[0] ? /* @__PURE__ */ jsx10("img", { src: r.entity.images[0], alt: r.entity.name }) : /* @__PURE__ */ jsx10("span", { children: "\xF0\u0178\u203A\x8D" }) }),
|
|
2943
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-mobile-similar-carousel-meta", children: [
|
|
2944
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-mobile-similar-carousel-name", title: r.entity.name, children: r.entity.name }),
|
|
2945
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-mobile-similar-carousel-price", children: [
|
|
2937
2946
|
currency,
|
|
2938
2947
|
" ",
|
|
2939
2948
|
price.toLocaleString()
|
|
@@ -2950,19 +2959,19 @@ Question: ${q}`;
|
|
|
2950
2959
|
] })
|
|
2951
2960
|
] }) }, idx);
|
|
2952
2961
|
}),
|
|
2953
|
-
chatLoading && /* @__PURE__ */
|
|
2954
|
-
/* @__PURE__ */
|
|
2955
|
-
/* @__PURE__ */
|
|
2956
|
-
/* @__PURE__ */
|
|
2957
|
-
/* @__PURE__ */
|
|
2958
|
-
/* @__PURE__ */
|
|
2962
|
+
chatLoading && /* @__PURE__ */ jsxs9("div", { className: "hsk-cb-typing-row", children: [
|
|
2963
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ jsx10(SparkleIcon3, {}) }),
|
|
2964
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-cb-typing", children: [
|
|
2965
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-cb-dot" }),
|
|
2966
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-cb-dot" }),
|
|
2967
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-cb-dot" })
|
|
2959
2968
|
] })
|
|
2960
2969
|
] }),
|
|
2961
|
-
chatError && /* @__PURE__ */
|
|
2962
|
-
/* @__PURE__ */
|
|
2970
|
+
chatError && /* @__PURE__ */ jsx10("div", { className: "hsk-cb-error", children: getFriendlyError2(chatError) }),
|
|
2971
|
+
/* @__PURE__ */ jsx10("div", { ref: chatBottomRef, style: { height: 1 } })
|
|
2963
2972
|
] }),
|
|
2964
|
-
/* @__PURE__ */
|
|
2965
|
-
/* @__PURE__ */
|
|
2973
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-cb-input-wrap", children: /* @__PURE__ */ jsxs9("div", { className: "hsk-cb-input-box", children: [
|
|
2974
|
+
/* @__PURE__ */ jsx10(
|
|
2966
2975
|
"textarea",
|
|
2967
2976
|
{
|
|
2968
2977
|
ref: chatTextareaRef,
|
|
@@ -2975,34 +2984,34 @@ Question: ${q}`;
|
|
|
2975
2984
|
disabled: chatLoading
|
|
2976
2985
|
}
|
|
2977
2986
|
),
|
|
2978
|
-
/* @__PURE__ */
|
|
2987
|
+
/* @__PURE__ */ jsx10(
|
|
2979
2988
|
"button",
|
|
2980
2989
|
{
|
|
2981
2990
|
className: "hsk-cb-send",
|
|
2982
2991
|
onClick: () => handleSend(),
|
|
2983
2992
|
disabled: !chatInput.trim() || chatLoading,
|
|
2984
2993
|
"aria-label": "Send message",
|
|
2985
|
-
children: /* @__PURE__ */
|
|
2994
|
+
children: /* @__PURE__ */ jsx10(ArrowUpIcon, {})
|
|
2986
2995
|
}
|
|
2987
2996
|
)
|
|
2988
2997
|
] }) })
|
|
2989
2998
|
] }),
|
|
2990
|
-
showSpecs && displayProduct && /* @__PURE__ */
|
|
2991
|
-
/* @__PURE__ */
|
|
2992
|
-
/* @__PURE__ */
|
|
2993
|
-
/* @__PURE__ */
|
|
2999
|
+
showSpecs && displayProduct && /* @__PURE__ */ jsx10("div", { className: "hsk-sp-mobile-specs-overlay", onClick: () => setShowSpecs(false), children: /* @__PURE__ */ jsxs9("div", { className: "hsk-sp-mobile-specs-drawer", onClick: (e) => e.stopPropagation(), children: [
|
|
3000
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-mobile-specs-header", children: [
|
|
3001
|
+
/* @__PURE__ */ jsx10("h3", { children: "Specifications" }),
|
|
3002
|
+
/* @__PURE__ */ jsx10("button", { type: "button", onClick: () => setShowSpecs(false), children: "Close" })
|
|
2994
3003
|
] }),
|
|
2995
|
-
/* @__PURE__ */
|
|
2996
|
-
/* @__PURE__ */
|
|
2997
|
-
displayProduct.description && /* @__PURE__ */
|
|
2998
|
-
/* @__PURE__ */
|
|
2999
|
-
/* @__PURE__ */
|
|
3004
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-mobile-specs-body", children: [
|
|
3005
|
+
/* @__PURE__ */ jsx10("h4", { className: "hsk-sp-mobile-specs-title", children: displayProduct.name }),
|
|
3006
|
+
displayProduct.description && /* @__PURE__ */ jsxs9("div", { className: "hsk-sp-mobile-specs-desc", children: [
|
|
3007
|
+
/* @__PURE__ */ jsx10("h5", { children: "Description" }),
|
|
3008
|
+
/* @__PURE__ */ jsx10("p", { children: displayProduct.description })
|
|
3000
3009
|
] }),
|
|
3001
|
-
displayProduct.specs && Object.keys(displayProduct.specs).length > 0 && /* @__PURE__ */
|
|
3002
|
-
/* @__PURE__ */
|
|
3003
|
-
Object.entries(displayProduct.specs).map(([key, val]) => /* @__PURE__ */
|
|
3004
|
-
/* @__PURE__ */
|
|
3005
|
-
/* @__PURE__ */
|
|
3010
|
+
displayProduct.specs && Object.keys(displayProduct.specs).length > 0 && /* @__PURE__ */ jsxs9("div", { className: "hsk-sp-mobile-specs-list", children: [
|
|
3011
|
+
/* @__PURE__ */ jsx10("h5", { children: "Details" }),
|
|
3012
|
+
Object.entries(displayProduct.specs).map(([key, val]) => /* @__PURE__ */ jsxs9("div", { className: "hsk-sp-mobile-spec-row", children: [
|
|
3013
|
+
/* @__PURE__ */ jsx10("span", { className: "hsk-sp-mobile-spec-label", children: key }),
|
|
3014
|
+
/* @__PURE__ */ jsx10("span", { className: "hsk-sp-mobile-spec-value", children: val })
|
|
3006
3015
|
] }, key))
|
|
3007
3016
|
] })
|
|
3008
3017
|
] })
|
|
@@ -3011,7 +3020,7 @@ Question: ${q}`;
|
|
|
3011
3020
|
}
|
|
3012
3021
|
);
|
|
3013
3022
|
}
|
|
3014
|
-
return /* @__PURE__ */
|
|
3023
|
+
return /* @__PURE__ */ jsx10(
|
|
3015
3024
|
"div",
|
|
3016
3025
|
{
|
|
3017
3026
|
className: cn("hsk-sp-backdrop", classNames.backdrop),
|
|
@@ -3022,65 +3031,65 @@ Question: ${q}`;
|
|
|
3022
3031
|
background: bg ?? void 0,
|
|
3023
3032
|
...customStyles
|
|
3024
3033
|
},
|
|
3025
|
-
children: /* @__PURE__ */
|
|
3026
|
-
/* @__PURE__ */
|
|
3027
|
-
/* @__PURE__ */
|
|
3028
|
-
/* @__PURE__ */
|
|
3029
|
-
/* @__PURE__ */
|
|
3030
|
-
/* @__PURE__ */
|
|
3034
|
+
children: /* @__PURE__ */ jsxs9("div", { className: cn("hsk-sp-card hsk-sp-fullscreen", classNames.card), onClick: (e) => e.stopPropagation(), children: [
|
|
3035
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-header", children: [
|
|
3036
|
+
/* @__PURE__ */ jsx10("span", { className: "hsk-sp-header-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ jsx10(SparkleIcon3, {}) }),
|
|
3037
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-header-body", children: [
|
|
3038
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-header-title", children: displayProduct?.name || productName }),
|
|
3039
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-header-sub", children: "Ask questions, compare specs, or check similar products" })
|
|
3031
3040
|
] }),
|
|
3032
|
-
/* @__PURE__ */
|
|
3041
|
+
/* @__PURE__ */ jsx10("button", { className: "hsk-sp-close", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ jsx10(CloseIcon2, {}) })
|
|
3033
3042
|
] }),
|
|
3034
|
-
searchLoading && /* @__PURE__ */
|
|
3035
|
-
/* @__PURE__ */
|
|
3036
|
-
/* @__PURE__ */
|
|
3037
|
-
displayProduct && /* @__PURE__ */
|
|
3038
|
-
/* @__PURE__ */
|
|
3039
|
-
/* @__PURE__ */
|
|
3040
|
-
/* @__PURE__ */
|
|
3041
|
-
displayProduct.brand && /* @__PURE__ */
|
|
3042
|
-
displayProduct.category && /* @__PURE__ */
|
|
3043
|
-
/* @__PURE__ */
|
|
3044
|
-
/* @__PURE__ */
|
|
3045
|
-
/* @__PURE__ */
|
|
3046
|
-
/* @__PURE__ */
|
|
3047
|
-
displayProduct.originalPrice && /* @__PURE__ */
|
|
3048
|
-
displayProduct.discount && /* @__PURE__ */
|
|
3043
|
+
searchLoading && /* @__PURE__ */ jsx10("div", { className: "hsk-sp-bar" }),
|
|
3044
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-body", children: [
|
|
3045
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-details-pane", children: [
|
|
3046
|
+
displayProduct && /* @__PURE__ */ jsxs9("div", { className: "hsk-sp-product-profile-container", children: [
|
|
3047
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-product-profile", children: [
|
|
3048
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-details-imgwrap", children: displayProduct.images?.[0] ? /* @__PURE__ */ jsx10("img", { src: displayProduct.images[0], alt: displayProduct.name }) : /* @__PURE__ */ jsx10("span", { className: "hsk-sp-img-placeholder", children: "\xF0\u0178\u203A\x8D" }) }),
|
|
3049
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-details-meta", children: [
|
|
3050
|
+
displayProduct.brand && /* @__PURE__ */ jsx10("span", { className: "hsk-sp-item-brand", children: displayProduct.brand }),
|
|
3051
|
+
displayProduct.category && /* @__PURE__ */ jsx10("span", { className: "hsk-sp-item-cat", children: displayProduct.category }),
|
|
3052
|
+
/* @__PURE__ */ jsx10("h2", { className: "hsk-sp-details-name", children: displayProduct.name }),
|
|
3053
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-item-price-row", children: [
|
|
3054
|
+
/* @__PURE__ */ jsx10("span", { className: "hsk-sp-item-currency", children: displayProduct.currency ?? "KES" }),
|
|
3055
|
+
/* @__PURE__ */ jsx10("span", { className: "hsk-sp-item-price", children: parseFloat(displayProduct.price?.replace(/[^0-9.]/g, "") || "0").toLocaleString() }),
|
|
3056
|
+
displayProduct.originalPrice && /* @__PURE__ */ jsx10("span", { className: "hsk-sp-item-original-price", children: parseFloat(displayProduct.originalPrice.replace(/[^0-9.]/g, "") || "0").toLocaleString() }),
|
|
3057
|
+
displayProduct.discount && /* @__PURE__ */ jsxs9("span", { className: "hsk-sp-item-discount", children: [
|
|
3049
3058
|
"(",
|
|
3050
3059
|
displayProduct.discount,
|
|
3051
3060
|
")"
|
|
3052
3061
|
] })
|
|
3053
3062
|
] }),
|
|
3054
|
-
/* @__PURE__ */
|
|
3055
|
-
displayProduct.rating && /* @__PURE__ */
|
|
3063
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-item-meta-badges", children: [
|
|
3064
|
+
displayProduct.rating && /* @__PURE__ */ jsxs9("span", { className: "hsk-sp-meta-badge hsk-sp-meta-badge-rating", children: [
|
|
3056
3065
|
"\xE2\u02DC\u2026 ",
|
|
3057
3066
|
parseFloat(displayProduct.rating.toString()).toFixed(1),
|
|
3058
3067
|
" ",
|
|
3059
3068
|
displayProduct.reviewCount ? `(${displayProduct.reviewCount})` : ""
|
|
3060
3069
|
] }),
|
|
3061
|
-
displayProduct.availability && /* @__PURE__ */
|
|
3062
|
-
displayProduct.stock && !displayProduct.availability && /* @__PURE__ */
|
|
3070
|
+
displayProduct.availability && /* @__PURE__ */ jsx10("span", { className: `hsk-sp-meta-badge hsk-sp-meta-badge-avail ${displayProduct.availability.toLowerCase().includes("in") ? "in-stock" : "out-stock"}`, children: displayProduct.availability }),
|
|
3071
|
+
displayProduct.stock && !displayProduct.availability && /* @__PURE__ */ jsxs9("span", { className: "hsk-sp-meta-badge hsk-sp-meta-badge-stock", children: [
|
|
3063
3072
|
"Stock: ",
|
|
3064
3073
|
displayProduct.stock
|
|
3065
3074
|
] })
|
|
3066
3075
|
] })
|
|
3067
3076
|
] })
|
|
3068
3077
|
] }),
|
|
3069
|
-
displayProduct.specs && Object.keys(displayProduct.specs).length > 0 && /* @__PURE__ */
|
|
3070
|
-
/* @__PURE__ */
|
|
3078
|
+
displayProduct.specs && Object.keys(displayProduct.specs).length > 0 && /* @__PURE__ */ jsx10("div", { className: "hsk-sp-specs-horizontal", children: Object.entries(displayProduct.specs).map(([key, val]) => /* @__PURE__ */ jsxs9("div", { className: "hsk-sp-spec-item-horizontal", children: [
|
|
3079
|
+
/* @__PURE__ */ jsxs9("span", { className: "hsk-sp-spec-label-horizontal", children: [
|
|
3071
3080
|
key,
|
|
3072
3081
|
":"
|
|
3073
3082
|
] }),
|
|
3074
|
-
/* @__PURE__ */
|
|
3083
|
+
/* @__PURE__ */ jsx10("span", { className: "hsk-sp-spec-value-horizontal", title: val, children: val })
|
|
3075
3084
|
] }, key)) }),
|
|
3076
|
-
displayProduct.description && /* @__PURE__ */
|
|
3077
|
-
/* @__PURE__ */
|
|
3078
|
-
/* @__PURE__ */
|
|
3085
|
+
displayProduct.description && /* @__PURE__ */ jsxs9("div", { className: "hsk-sp-details-desc", children: [
|
|
3086
|
+
/* @__PURE__ */ jsx10("h4", { children: "Description" }),
|
|
3087
|
+
/* @__PURE__ */ jsx10("p", { children: displayProduct.description })
|
|
3079
3088
|
] })
|
|
3080
3089
|
] }),
|
|
3081
|
-
/* @__PURE__ */
|
|
3082
|
-
/* @__PURE__ */
|
|
3083
|
-
/* @__PURE__ */
|
|
3090
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-similar-section", children: [
|
|
3091
|
+
/* @__PURE__ */ jsx10("h3", { children: "Similar Products" }),
|
|
3092
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-results", children: (() => {
|
|
3084
3093
|
const similarProducts = results.filter(
|
|
3085
3094
|
(r) => {
|
|
3086
3095
|
const isSameName = !!(r.entity.name && displayProduct?.name && r.entity.name.toLowerCase() === displayProduct.name.toLowerCase());
|
|
@@ -3089,29 +3098,29 @@ Question: ${q}`;
|
|
|
3089
3098
|
}
|
|
3090
3099
|
);
|
|
3091
3100
|
if (!searchLoading && similarProducts.length === 0) {
|
|
3092
|
-
return /* @__PURE__ */
|
|
3101
|
+
return /* @__PURE__ */ jsx10("div", { className: "hsk-sp-empty", children: "No similar products found." });
|
|
3093
3102
|
}
|
|
3094
3103
|
return similarProducts.map((r, i) => {
|
|
3095
3104
|
const price = parseFloat(r.entity.price?.replace(/[^0-9.]/g, "") || "0");
|
|
3096
3105
|
const currency = r.entity.currency ?? "KES";
|
|
3097
|
-
return /* @__PURE__ */
|
|
3106
|
+
return /* @__PURE__ */ jsxs9(
|
|
3098
3107
|
"div",
|
|
3099
3108
|
{
|
|
3100
3109
|
className: cn("hsk-sp-item", classNames.item),
|
|
3101
3110
|
style: { animationDelay: `${i * 55}ms`, cursor: "pointer" },
|
|
3102
3111
|
onClick: () => handleNav(r),
|
|
3103
3112
|
children: [
|
|
3104
|
-
/* @__PURE__ */
|
|
3105
|
-
/* @__PURE__ */
|
|
3106
|
-
/* @__PURE__ */
|
|
3107
|
-
r.entity.category && /* @__PURE__ */
|
|
3108
|
-
/* @__PURE__ */
|
|
3113
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-img-wrap", children: r.entity.images?.[0] ? /* @__PURE__ */ jsx10("img", { src: r.entity.images[0], alt: r.entity.name }) : /* @__PURE__ */ jsx10("span", { className: "hsk-sp-img-placeholder", children: "\xF0\u0178\u203A\x8D" }) }),
|
|
3114
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-item-body", children: [
|
|
3115
|
+
/* @__PURE__ */ jsxs9("div", { children: [
|
|
3116
|
+
r.entity.category && /* @__PURE__ */ jsx10("div", { className: "hsk-sp-item-cat", children: r.entity.category }),
|
|
3117
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-item-name", title: r.entity.name, children: r.entity.name })
|
|
3109
3118
|
] }),
|
|
3110
|
-
/* @__PURE__ */
|
|
3111
|
-
/* @__PURE__ */
|
|
3112
|
-
/* @__PURE__ */
|
|
3119
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-item-price-row", children: [
|
|
3120
|
+
/* @__PURE__ */ jsx10("span", { className: "hsk-sp-item-currency", children: currency }),
|
|
3121
|
+
/* @__PURE__ */ jsx10("span", { className: "hsk-sp-item-price", children: price.toLocaleString() })
|
|
3113
3122
|
] }),
|
|
3114
|
-
/* @__PURE__ */
|
|
3123
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-actions", children: /* @__PURE__ */ jsx10(
|
|
3115
3124
|
"button",
|
|
3116
3125
|
{
|
|
3117
3126
|
className: "hsk-sp-action hsk-sp-action-primary",
|
|
@@ -3131,29 +3140,29 @@ Question: ${q}`;
|
|
|
3131
3140
|
})() })
|
|
3132
3141
|
] })
|
|
3133
3142
|
] }),
|
|
3134
|
-
/* @__PURE__ */
|
|
3135
|
-
/* @__PURE__ */
|
|
3143
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-sp-chat-pane", children: [
|
|
3144
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-cb-msgs", children: [
|
|
3136
3145
|
displayMessages.map((msg, idx) => {
|
|
3137
3146
|
const isUser = msg.role === "user";
|
|
3138
|
-
return /* @__PURE__ */
|
|
3139
|
-
/* @__PURE__ */
|
|
3140
|
-
/* @__PURE__ */
|
|
3147
|
+
return /* @__PURE__ */ jsx10("div", { className: "hsk-cb-msg-group", children: isUser ? /* @__PURE__ */ jsx10("div", { className: "hsk-cb-user-msg", children: /* @__PURE__ */ jsx10("div", { className: "hsk-cb-user-bubble", children: msg.content }) }) : /* @__PURE__ */ jsxs9("div", { className: "hsk-cb-ai-msg", children: [
|
|
3148
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ jsx10(SparkleIcon3, {}) }),
|
|
3149
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-cb-ai-body", children: /* @__PURE__ */ jsx10("div", { className: "hsk-cb-ai-text", children: renderMarkdown(msg.content) }) })
|
|
3141
3150
|
] }) }, idx);
|
|
3142
3151
|
}),
|
|
3143
|
-
chatLoading && /* @__PURE__ */
|
|
3144
|
-
/* @__PURE__ */
|
|
3145
|
-
/* @__PURE__ */
|
|
3146
|
-
/* @__PURE__ */
|
|
3147
|
-
/* @__PURE__ */
|
|
3148
|
-
/* @__PURE__ */
|
|
3152
|
+
chatLoading && /* @__PURE__ */ jsxs9("div", { className: "hsk-cb-typing-row", children: [
|
|
3153
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-cb-ai-icon", style: { display: "flex", alignItems: "center" }, children: /* @__PURE__ */ jsx10(SparkleIcon3, {}) }),
|
|
3154
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-cb-typing", children: [
|
|
3155
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-cb-dot" }),
|
|
3156
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-cb-dot" }),
|
|
3157
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-cb-dot" })
|
|
3149
3158
|
] })
|
|
3150
3159
|
] }),
|
|
3151
|
-
chatError && /* @__PURE__ */
|
|
3152
|
-
/* @__PURE__ */
|
|
3160
|
+
chatError && /* @__PURE__ */ jsx10("div", { className: "hsk-cb-error", children: getFriendlyError2(chatError) }),
|
|
3161
|
+
/* @__PURE__ */ jsx10("div", { ref: chatBottomRef, style: { height: 1 } })
|
|
3153
3162
|
] }),
|
|
3154
|
-
/* @__PURE__ */
|
|
3155
|
-
/* @__PURE__ */
|
|
3156
|
-
/* @__PURE__ */
|
|
3163
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-cb-input-wrap", children: [
|
|
3164
|
+
/* @__PURE__ */ jsxs9("div", { className: "hsk-cb-input-box", children: [
|
|
3165
|
+
/* @__PURE__ */ jsx10(
|
|
3157
3166
|
"textarea",
|
|
3158
3167
|
{
|
|
3159
3168
|
ref: chatTextareaRef,
|
|
@@ -3166,22 +3175,22 @@ Question: ${q}`;
|
|
|
3166
3175
|
disabled: chatLoading
|
|
3167
3176
|
}
|
|
3168
3177
|
),
|
|
3169
|
-
/* @__PURE__ */
|
|
3178
|
+
/* @__PURE__ */ jsx10(
|
|
3170
3179
|
"button",
|
|
3171
3180
|
{
|
|
3172
3181
|
className: "hsk-cb-send",
|
|
3173
3182
|
onClick: () => handleSend(),
|
|
3174
3183
|
disabled: !chatInput.trim() || chatLoading,
|
|
3175
3184
|
"aria-label": "Send message",
|
|
3176
|
-
children: /* @__PURE__ */
|
|
3185
|
+
children: /* @__PURE__ */ jsx10(ArrowUpIcon, {})
|
|
3177
3186
|
}
|
|
3178
3187
|
)
|
|
3179
3188
|
] }),
|
|
3180
|
-
/* @__PURE__ */
|
|
3189
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-cb-hint", children: "Akropolys \xB7 instant product knowledge" })
|
|
3181
3190
|
] })
|
|
3182
3191
|
] })
|
|
3183
3192
|
] }),
|
|
3184
|
-
/* @__PURE__ */
|
|
3193
|
+
/* @__PURE__ */ jsx10("div", { className: "hsk-sp-footer", children: /* @__PURE__ */ jsx10("span", { className: "hsk-sp-esc", children: "Esc to close" }) })
|
|
3185
3194
|
] })
|
|
3186
3195
|
}
|
|
3187
3196
|
);
|
|
@@ -3211,8 +3220,8 @@ function Sparkle({
|
|
|
3211
3220
|
...theme?.fontFamily && { "--hsk-font": theme.fontFamily },
|
|
3212
3221
|
...theme?.borderRadius && { "--hsk-border-radius": theme.borderRadius }
|
|
3213
3222
|
};
|
|
3214
|
-
return /* @__PURE__ */
|
|
3215
|
-
/* @__PURE__ */
|
|
3223
|
+
return /* @__PURE__ */ jsxs9(Fragment4, { children: [
|
|
3224
|
+
/* @__PURE__ */ jsx10(
|
|
3216
3225
|
"button",
|
|
3217
3226
|
{
|
|
3218
3227
|
className: cn("hsk-sp-btn", classNames.button, className),
|
|
@@ -3220,11 +3229,11 @@ function Sparkle({
|
|
|
3220
3229
|
style: customStyles,
|
|
3221
3230
|
title: "Find similar products",
|
|
3222
3231
|
"aria-label": "Find similar products",
|
|
3223
|
-
children: children || /* @__PURE__ */
|
|
3232
|
+
children: children || /* @__PURE__ */ jsx10(SparkleIcon3, {})
|
|
3224
3233
|
}
|
|
3225
3234
|
),
|
|
3226
3235
|
open && mounted && createPortal2(
|
|
3227
|
-
/* @__PURE__ */
|
|
3236
|
+
/* @__PURE__ */ jsx10(
|
|
3228
3237
|
SparkleModal,
|
|
3229
3238
|
{
|
|
3230
3239
|
productName,
|