@retinalabsllc/zairusjs 20.1.2 → 20.1.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +374 -377
- package/dist/index.mjs +85 -88
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -3655,8 +3655,6 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
3655
3655
|
var import_react62 = __toESM(require("react"));
|
|
3656
3656
|
var import_link8 = __toESM(require("next/link"));
|
|
3657
3657
|
var import_image7 = __toESM(require("next/image"));
|
|
3658
|
-
var import_react63 = require("@hugeicons/react");
|
|
3659
|
-
var import_core_free_icons21 = require("@hugeicons/core-free-icons");
|
|
3660
3658
|
var useScrollAnimation = () => {
|
|
3661
3659
|
const elementRef = (0, import_react62.useRef)(null);
|
|
3662
3660
|
(0, import_react62.useEffect)(() => {
|
|
@@ -3734,19 +3732,18 @@ var PortfolioHero = ({
|
|
|
3734
3732
|
import_link8.default,
|
|
3735
3733
|
{
|
|
3736
3734
|
href: secondaryCtaHref,
|
|
3737
|
-
className: "w-full sm:w-auto inline-flex items-center justify-center gap-3 text-xs tracking-[0.2em] rounded-full px-8 py-2 bg-stone-200 transition-colors text-black hover:bg-stone-50 outline-none"
|
|
3735
|
+
className: "w-full sm:w-auto inline-flex items-center justify-center gap-3 text-xs tracking-[0.2em] rounded-full px-8 py-2.5 bg-stone-200 transition-colors text-black hover:bg-stone-50 outline-none"
|
|
3738
3736
|
},
|
|
3739
|
-
secondaryCtaText
|
|
3740
|
-
/* @__PURE__ */ import_react62.default.createElement(import_react63.HugeiconsIcon, { icon: import_core_free_icons21.ArrowRight01Icon, size: 16 })
|
|
3737
|
+
secondaryCtaText
|
|
3741
3738
|
))
|
|
3742
3739
|
));
|
|
3743
3740
|
};
|
|
3744
3741
|
|
|
3745
3742
|
// src/components/GifFeatureCard.tsx
|
|
3746
|
-
var
|
|
3743
|
+
var import_react63 = __toESM(require("react"));
|
|
3747
3744
|
var import_image8 = __toESM(require("next/image"));
|
|
3748
|
-
var
|
|
3749
|
-
var
|
|
3745
|
+
var import_react64 = require("@hugeicons/react");
|
|
3746
|
+
var import_core_free_icons21 = require("@hugeicons/core-free-icons");
|
|
3750
3747
|
var GifFeatureCard = ({
|
|
3751
3748
|
gifSrc,
|
|
3752
3749
|
title,
|
|
@@ -3754,20 +3751,20 @@ var GifFeatureCard = ({
|
|
|
3754
3751
|
alt = "Feature animation",
|
|
3755
3752
|
className = "aspect-video"
|
|
3756
3753
|
}) => {
|
|
3757
|
-
const [isLoading, setIsLoading] = (0,
|
|
3758
|
-
return /* @__PURE__ */
|
|
3759
|
-
|
|
3754
|
+
const [isLoading, setIsLoading] = (0, import_react63.useState)(true);
|
|
3755
|
+
return /* @__PURE__ */ import_react63.default.createElement("div", { className: `relative w-full bg-black overflow-hidden ${className}` }, isLoading && /* @__PURE__ */ import_react63.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-black" }, /* @__PURE__ */ import_react63.default.createElement(
|
|
3756
|
+
import_react64.HugeiconsIcon,
|
|
3760
3757
|
{
|
|
3761
|
-
icon:
|
|
3758
|
+
icon: import_core_free_icons21.Loading03Icon,
|
|
3762
3759
|
size: 32,
|
|
3763
3760
|
className: "animate-spin text-white"
|
|
3764
3761
|
}
|
|
3765
|
-
)), /* @__PURE__ */
|
|
3762
|
+
)), /* @__PURE__ */ import_react63.default.createElement(
|
|
3766
3763
|
"div",
|
|
3767
3764
|
{
|
|
3768
3765
|
className: `absolute inset-0 z-0 transition-all duration-1000 ease-out ${isLoading ? "scale-105 blur-2xl opacity-0" : "scale-100 blur-0 opacity-100"}`
|
|
3769
3766
|
},
|
|
3770
|
-
/* @__PURE__ */
|
|
3767
|
+
/* @__PURE__ */ import_react63.default.createElement(
|
|
3771
3768
|
import_image8.default,
|
|
3772
3769
|
{
|
|
3773
3770
|
src: gifSrc,
|
|
@@ -3778,16 +3775,16 @@ var GifFeatureCard = ({
|
|
|
3778
3775
|
className: "object-cover object-center pointer-events-none"
|
|
3779
3776
|
}
|
|
3780
3777
|
)
|
|
3781
|
-
), /* @__PURE__ */
|
|
3778
|
+
), /* @__PURE__ */ import_react63.default.createElement(
|
|
3782
3779
|
"div",
|
|
3783
3780
|
{
|
|
3784
3781
|
className: "absolute inset-x-0 bottom-0 h-1/2 sm:h-2/3 bg-linear-to-t from-black/95 via-black/40 to-transparent z-10 pointer-events-none transition-opacity duration-700"
|
|
3785
3782
|
}
|
|
3786
|
-
), /* @__PURE__ */
|
|
3783
|
+
), /* @__PURE__ */ import_react63.default.createElement("div", { className: "absolute inset-x-0 bottom-0 p-6 sm:p-8 z-30 flex flex-col justify-end text-left pointer-events-none" }, title && /* @__PURE__ */ import_react63.default.createElement("h3", { className: "text-2xl md:text-3xl text-white tracking-tight mb-2 sm:mb-3 drop-shadow-md" }, title), subtitle && /* @__PURE__ */ import_react63.default.createElement("p", { className: "text-xs leading-relaxed text-stone-300 max-w-2xl drop-shadow-sm" }, subtitle)));
|
|
3787
3784
|
};
|
|
3788
3785
|
|
|
3789
3786
|
// src/components/MedicalFeatureStatsBlock.tsx
|
|
3790
|
-
var
|
|
3787
|
+
var import_react65 = __toESM(require("react"));
|
|
3791
3788
|
var import_image9 = __toESM(require("next/image"));
|
|
3792
3789
|
var MedicalFeatureStatsBlock = ({
|
|
3793
3790
|
bottomHeadline,
|
|
@@ -3796,9 +3793,9 @@ var MedicalFeatureStatsBlock = ({
|
|
|
3796
3793
|
trustText,
|
|
3797
3794
|
stats
|
|
3798
3795
|
}) => {
|
|
3799
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
3800
|
-
const titleRef = (0,
|
|
3801
|
-
(0,
|
|
3796
|
+
const [isAnimating, setIsAnimating] = (0, import_react65.useState)(false);
|
|
3797
|
+
const titleRef = (0, import_react65.useRef)(null);
|
|
3798
|
+
(0, import_react65.useEffect)(() => {
|
|
3802
3799
|
const observer = new IntersectionObserver(
|
|
3803
3800
|
([entry]) => {
|
|
3804
3801
|
if (entry.isIntersecting) {
|
|
@@ -3816,7 +3813,7 @@ var MedicalFeatureStatsBlock = ({
|
|
|
3816
3813
|
}
|
|
3817
3814
|
return () => observer.disconnect();
|
|
3818
3815
|
}, []);
|
|
3819
|
-
return /* @__PURE__ */
|
|
3816
|
+
return /* @__PURE__ */ import_react65.default.createElement("section", { className: "py-24 w-full flex justify-center relative z-10" }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-10 mb-12" }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "max-w-xl" }, /* @__PURE__ */ import_react65.default.createElement(
|
|
3820
3817
|
"h2",
|
|
3821
3818
|
{
|
|
3822
3819
|
ref: titleRef,
|
|
@@ -3824,7 +3821,7 @@ var MedicalFeatureStatsBlock = ({
|
|
|
3824
3821
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
3825
3822
|
},
|
|
3826
3823
|
bottomHeadline
|
|
3827
|
-
), /* @__PURE__ */
|
|
3824
|
+
), /* @__PURE__ */ import_react65.default.createElement("p", { className: "text-sm leading-relaxed text-stone-500" }, bottomDescription)), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center gap-4 shrink-0" }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex -space-x-3" }, avatars.map((src, i) => /* @__PURE__ */ import_react65.default.createElement("div", { key: i, className: "relative w-12 h-12 rounded-full border-[3px] border-white overflow-hidden bg-stone-100 z-1 hover:z-10 transition-all" }, /* @__PURE__ */ import_react65.default.createElement(
|
|
3828
3825
|
import_image9.default,
|
|
3829
3826
|
{
|
|
3830
3827
|
src,
|
|
@@ -3833,17 +3830,17 @@ var MedicalFeatureStatsBlock = ({
|
|
|
3833
3830
|
sizes: "48px",
|
|
3834
3831
|
className: "object-cover"
|
|
3835
3832
|
}
|
|
3836
|
-
)))), /* @__PURE__ */
|
|
3833
|
+
)))), /* @__PURE__ */ import_react65.default.createElement("p", { className: "text-xs text-stone-800 leading-[1.4] max-w-55" }, trustText))), /* @__PURE__ */ import_react65.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6" }, stats.map((stat, idx) => /* @__PURE__ */ import_react65.default.createElement("div", { key: idx, className: "bg-white rounded-4xl p-8 md:p-10 flex flex-col h-70" }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center p-0.5 mb-6" }, /* @__PURE__ */ import_react65.default.createElement("span", { className: "text-sm text-stone-500 tracking-wide" }, stat.label)), /* @__PURE__ */ import_react65.default.createElement("h1", { className: "text-6xl gradient-text md:text-[80px] tracking-tighter text-black mt-auto leading-none" }, stat.value))))));
|
|
3837
3834
|
};
|
|
3838
3835
|
|
|
3839
3836
|
// src/components/ConsultantShowcase.tsx
|
|
3840
|
-
var
|
|
3837
|
+
var import_react66 = __toESM(require("react"));
|
|
3841
3838
|
var import_image10 = __toESM(require("next/image"));
|
|
3842
|
-
var
|
|
3843
|
-
var
|
|
3839
|
+
var import_react67 = require("@hugeicons/react");
|
|
3840
|
+
var import_core_free_icons22 = require("@hugeicons/core-free-icons");
|
|
3844
3841
|
var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
|
|
3845
|
-
const [isLoading, setIsLoading] = (0,
|
|
3846
|
-
return /* @__PURE__ */
|
|
3842
|
+
const [isLoading, setIsLoading] = (0, import_react66.useState)(true);
|
|
3843
|
+
return /* @__PURE__ */ import_react66.default.createElement("div", { className: `absolute inset-0 bg-stone-800 ${className}` }, isLoading && /* @__PURE__ */ import_react66.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-stone-800/50 backdrop-blur-md transition-opacity duration-300" }, /* @__PURE__ */ import_react66.default.createElement(import_react67.HugeiconsIcon, { icon: import_core_free_icons22.Loading03Icon, size: 24, className: "animate-spin text-white/50" })), /* @__PURE__ */ import_react66.default.createElement(
|
|
3847
3844
|
import_image10.default,
|
|
3848
3845
|
{
|
|
3849
3846
|
src,
|
|
@@ -3862,9 +3859,9 @@ var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
|
|
|
3862
3859
|
var ConsultantShowcase = ({
|
|
3863
3860
|
profiles
|
|
3864
3861
|
}) => {
|
|
3865
|
-
const [currentIndex, setCurrentIndex] = (0,
|
|
3866
|
-
const [touchStart, setTouchStart] = (0,
|
|
3867
|
-
const [touchEnd, setTouchEnd] = (0,
|
|
3862
|
+
const [currentIndex, setCurrentIndex] = (0, import_react66.useState)(0);
|
|
3863
|
+
const [touchStart, setTouchStart] = (0, import_react66.useState)(null);
|
|
3864
|
+
const [touchEnd, setTouchEnd] = (0, import_react66.useState)(null);
|
|
3868
3865
|
const nextSlide = () => {
|
|
3869
3866
|
setCurrentIndex((prev) => prev === profiles.length - 1 ? 0 : prev + 1);
|
|
3870
3867
|
};
|
|
@@ -3889,7 +3886,7 @@ var ConsultantShowcase = ({
|
|
|
3889
3886
|
}
|
|
3890
3887
|
};
|
|
3891
3888
|
if (!profiles || profiles.length === 0) return null;
|
|
3892
|
-
return /* @__PURE__ */
|
|
3889
|
+
return /* @__PURE__ */ import_react66.default.createElement("section", { className: "py-24 w-full flex justify-center px-4 md:px-8 z-10 relative" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ import_react66.default.createElement(
|
|
3893
3890
|
"div",
|
|
3894
3891
|
{
|
|
3895
3892
|
className: "relative w-full h-100 md:h-112.5 rounded-4xl overflow-hidden bg-stone-900 group select-none",
|
|
@@ -3899,13 +3896,13 @@ var ConsultantShowcase = ({
|
|
|
3899
3896
|
},
|
|
3900
3897
|
profiles.map((profile, idx) => {
|
|
3901
3898
|
const isActive = idx === currentIndex;
|
|
3902
|
-
return /* @__PURE__ */
|
|
3899
|
+
return /* @__PURE__ */ import_react66.default.createElement(
|
|
3903
3900
|
"div",
|
|
3904
3901
|
{
|
|
3905
3902
|
key: profile.id,
|
|
3906
3903
|
className: `absolute inset-0 transition-opacity duration-700 ease-in-out ${isActive ? "opacity-100 z-10" : "opacity-0 z-0 pointer-events-none"}`
|
|
3907
3904
|
},
|
|
3908
|
-
/* @__PURE__ */
|
|
3905
|
+
/* @__PURE__ */ import_react66.default.createElement(
|
|
3909
3906
|
ImageWithLoader,
|
|
3910
3907
|
{
|
|
3911
3908
|
src: profile.imageSrc,
|
|
@@ -3913,14 +3910,14 @@ var ConsultantShowcase = ({
|
|
|
3913
3910
|
priority: idx === 0
|
|
3914
3911
|
}
|
|
3915
3912
|
),
|
|
3916
|
-
/* @__PURE__ */
|
|
3917
|
-
/* @__PURE__ */
|
|
3918
|
-
/* @__PURE__ */
|
|
3913
|
+
/* @__PURE__ */ import_react66.default.createElement("div", { className: "absolute inset-0 bg-black/20 z-10 pointer-events-none" }),
|
|
3914
|
+
/* @__PURE__ */ import_react66.default.createElement("div", { className: "absolute top-0 left-0 w-full h-[60%] bg-linear-to-b from-black/80 via-black/30 to-transparent z-20 pointer-events-none" }),
|
|
3915
|
+
/* @__PURE__ */ import_react66.default.createElement("div", { className: `absolute top-8 left-8 md:top-12 md:left-12 z-30 text-white max-w-lg transition-transform duration-700 ease-out ${isActive ? "translate-y-0" : "-translate-y-4"}` }, /* @__PURE__ */ import_react66.default.createElement("h2", { className: "text-lg tracking-tight mb-2 leading-none" }, profile.name), /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex flex-col gap-0.5" }, /* @__PURE__ */ import_react66.default.createElement("p", { className: "text-sm text-white/80 tracking-wide" }, profile.role), profile.description && /* @__PURE__ */ import_react66.default.createElement("p", { className: "text-sm text-white/80 tracking-wide mt-1" }, profile.description)))
|
|
3919
3916
|
);
|
|
3920
3917
|
}),
|
|
3921
|
-
/* @__PURE__ */
|
|
3922
|
-
/* @__PURE__ */
|
|
3923
|
-
/* @__PURE__ */
|
|
3918
|
+
/* @__PURE__ */ import_react66.default.createElement("div", { className: "absolute top-0 left-0 w-[20%] h-full z-40 cursor-w-resize hidden md:block", onClick: prevSlide }),
|
|
3919
|
+
/* @__PURE__ */ import_react66.default.createElement("div", { className: "absolute top-0 right-0 w-[20%] h-full z-40 cursor-e-resize hidden md:block", onClick: nextSlide }),
|
|
3920
|
+
/* @__PURE__ */ import_react66.default.createElement("div", { className: "absolute bottom-6 md:bottom-8 left-0 w-full px-4 z-30 flex justify-center items-center gap-2" }, profiles.map((_, idx) => /* @__PURE__ */ import_react66.default.createElement(
|
|
3924
3921
|
"button",
|
|
3925
3922
|
{
|
|
3926
3923
|
key: idx,
|
|
@@ -3932,10 +3929,10 @@ var ConsultantShowcase = ({
|
|
|
3932
3929
|
};
|
|
3933
3930
|
|
|
3934
3931
|
// src/components/ContentGridBlock.tsx
|
|
3935
|
-
var
|
|
3932
|
+
var import_react68 = __toESM(require("react"));
|
|
3936
3933
|
var import_image11 = __toESM(require("next/image"));
|
|
3937
|
-
var
|
|
3938
|
-
var
|
|
3934
|
+
var import_react69 = require("@hugeicons/react");
|
|
3935
|
+
var import_core_free_icons23 = require("@hugeicons/core-free-icons");
|
|
3939
3936
|
var ContentGridBlock = ({
|
|
3940
3937
|
header,
|
|
3941
3938
|
leftCard,
|
|
@@ -3949,20 +3946,20 @@ var ContentGridBlock = ({
|
|
|
3949
3946
|
bgDecoRotation_1,
|
|
3950
3947
|
bgDecoRotation_2
|
|
3951
3948
|
}) => {
|
|
3952
|
-
return /* @__PURE__ */
|
|
3949
|
+
return /* @__PURE__ */ import_react68.default.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react68.default.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ import_react68.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ import_react68.default.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ import_react68.default.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ import_react68.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ import_react68.default.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ import_react68.default.createElement("div", { className: "bg-black rounded-3xl p-8 flex flex-col mx-h-95" }, /* @__PURE__ */ import_react68.default.createElement("p", { className: "text-sm text-white leading-snug mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ import_react68.default.createElement("span", { className: "mb-auto text-xs text-stone-100 tracking-widest" }, leftCard.tag), /* @__PURE__ */ import_react68.default.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ import_react68.default.createElement("div", null, /* @__PURE__ */ import_react68.default.createElement("h4", { className: "text-sm text-white" }, leftCard.title), /* @__PURE__ */ import_react68.default.createElement("p", { className: "text-xs text-stone-300" }, leftCard.subtitle)), /* @__PURE__ */ import_react68.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react68.default.createElement(import_image11.default, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ import_react68.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react68.default.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col relative mx-h-95" }, /* @__PURE__ */ import_react68.default.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ import_react68.default.createElement("span", { className: "text-xs text-stone-400 tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ import_react68.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react68.default.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ import_react68.default.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ import_react68.default.createElement(import_image11.default, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ import_react68.default.createElement("span", { className: "text-sm text-stone-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ import_react68.default.createElement("div", { className: "grow flex flex-col mt-10 justify-center items-center py-6" }, /* @__PURE__ */ import_react68.default.createElement("div", { className: "px-5 py-2 rounded-full bg-stone-50/50 border border-stone-200 text-sm text-stone-600" }, middleTopCard.badgePrefix, " ", /* @__PURE__ */ import_react68.default.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ import_react68.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react68.default.createElement("p", { className: "text-xs text-stone-400 tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ import_react68.default.createElement("p", { className: "text-sm text-black leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ import_react68.default.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col mx-h-95" }, /* @__PURE__ */ import_react68.default.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ import_react68.default.createElement("div", null, /* @__PURE__ */ import_react68.default.createElement("h4", { className: "text-sm text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ import_react68.default.createElement("p", { className: "text-xs text-stone-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ import_react68.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react68.default.createElement(import_image11.default, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ import_react68.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react68.default.createElement("p", { className: "text-sm text-black leading-snug mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ import_react68.default.createElement("span", { className: "text-xs text-stone-400 tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ import_react68.default.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => {
|
|
3953
3950
|
const isSecondCard = idx === 1;
|
|
3954
3951
|
const cardBgColor = isSecondCard ? bgColor_2 || "bg-[#ffffff]" : bgColor_1 || "bg-[#d97757]";
|
|
3955
3952
|
const defaultDeco_a = "https://storage.googleapis.com/retina-cloud-v2/assets/images/deco_a.avif";
|
|
3956
3953
|
const defaultDeco_b = "https://storage.googleapis.com/retina-cloud-v2/assets/images/deco_b.avif";
|
|
3957
3954
|
const bgDecoImage = isSecondCard ? bgDeco_2 || defaultDeco_b : bgDeco_1 || defaultDeco_a;
|
|
3958
3955
|
const rotationClass = isSecondCard ? bgDecoRotation_2 || "-rotate-12" : bgDecoRotation_1 || "rotate-90";
|
|
3959
|
-
return /* @__PURE__ */
|
|
3956
|
+
return /* @__PURE__ */ import_react68.default.createElement(
|
|
3960
3957
|
"div",
|
|
3961
3958
|
{
|
|
3962
3959
|
key: idx,
|
|
3963
3960
|
className: `relative w-full h-80 rounded-3xl overflow-hidden group ${cardBgColor}`
|
|
3964
3961
|
},
|
|
3965
|
-
bgDecoImage && /* @__PURE__ */
|
|
3962
|
+
bgDecoImage && /* @__PURE__ */ import_react68.default.createElement(
|
|
3966
3963
|
"img",
|
|
3967
3964
|
{
|
|
3968
3965
|
src: bgDecoImage,
|
|
@@ -3970,26 +3967,26 @@ var ContentGridBlock = ({
|
|
|
3970
3967
|
className: `absolute bottom-0 right-0 translate-x-1/4 translate-y-1/4 w-52 sm:w-60 h-auto object-contain z-10 pointer-events-none opacity-30 ${rotationClass}`
|
|
3971
3968
|
}
|
|
3972
3969
|
),
|
|
3973
|
-
/* @__PURE__ */
|
|
3974
|
-
/* @__PURE__ */
|
|
3970
|
+
/* @__PURE__ */ import_react68.default.createElement("div", { className: `absolute inset-0 z-20 pointer-events-none ${isSecondCard ? "" : "bg-black/20"}` }),
|
|
3971
|
+
/* @__PURE__ */ import_react68.default.createElement("div", { className: `absolute inset-0 z-30 p-6 flex flex-col justify-end ${isSecondCard ? "text-black" : "text-white"}` }, /* @__PURE__ */ import_react68.default.createElement("p", { className: `text-sm leading-snug mb-3 pr-2 ${isSecondCard ? "text-black/90" : "text-white/90"}` }, card.mainText), card.tag && /* @__PURE__ */ import_react68.default.createElement("span", { className: `mb-4 text-xs tracking-widest ${isSecondCard ? "text-black/70" : "text-white/50"}` }, card.tag), /* @__PURE__ */ import_react68.default.createElement("div", { className: "pt-3" }, /* @__PURE__ */ import_react68.default.createElement("h4", { className: `text-sm tracking-wide ${isSecondCard ? "text-black" : "text-white"}` }, card.title), /* @__PURE__ */ import_react68.default.createElement("p", { className: `text-xs ${isSecondCard ? "text-black/60" : "text-white/60"}` }, card.subtitle)))
|
|
3975
3972
|
);
|
|
3976
3973
|
})))));
|
|
3977
3974
|
};
|
|
3978
3975
|
|
|
3979
3976
|
// src/components/ManagedProjectsBlock.tsx
|
|
3980
|
-
var
|
|
3977
|
+
var import_react70 = __toESM(require("react"));
|
|
3981
3978
|
var import_link9 = __toESM(require("next/link"));
|
|
3982
3979
|
var GridSection = ({
|
|
3983
3980
|
children,
|
|
3984
3981
|
isLast = false,
|
|
3985
3982
|
className = "py-8 md:py-10"
|
|
3986
|
-
}) => /* @__PURE__ */
|
|
3983
|
+
}) => /* @__PURE__ */ import_react70.default.createElement("div", { className: `relative px-5 md:px-12 ${className} ${!isLast ? "" : ""}` }, children);
|
|
3987
3984
|
var ManagedProjectsBlock = ({
|
|
3988
3985
|
tagline,
|
|
3989
3986
|
title,
|
|
3990
3987
|
projects
|
|
3991
3988
|
}) => {
|
|
3992
|
-
return /* @__PURE__ */
|
|
3989
|
+
return /* @__PURE__ */ import_react70.default.createElement("div", { className: "grow pt-4 pb-20 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react70.default.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-5xl mx-auto overflow-hidden" }, /* @__PURE__ */ import_react70.default.createElement(
|
|
3993
3990
|
"div",
|
|
3994
3991
|
{
|
|
3995
3992
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -3998,17 +3995,17 @@ var ManagedProjectsBlock = ({
|
|
|
3998
3995
|
backgroundRepeat: "repeat"
|
|
3999
3996
|
}
|
|
4000
3997
|
}
|
|
4001
|
-
), /* @__PURE__ */
|
|
3998
|
+
), /* @__PURE__ */ import_react70.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react70.default.createElement(GridSection, null, tagline && /* @__PURE__ */ import_react70.default.createElement("span", { className: "text-xs tracking-[0.4em] text-stone-500 text-left block " }, tagline), /* @__PURE__ */ import_react70.default.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight text-left" }, title)), projects.map((project, index) => {
|
|
4002
3999
|
const isLast = index === projects.length - 1;
|
|
4003
|
-
const projectContent = /* @__PURE__ */
|
|
4004
|
-
return /* @__PURE__ */
|
|
4000
|
+
const projectContent = /* @__PURE__ */ import_react70.default.createElement("div", { className: "group block w-full" }, /* @__PURE__ */ import_react70.default.createElement("div", { className: "flex flex-col md:flex-row md:items-center justify-between gap-3 md:gap-4 mb-4 md:mb-5" }, /* @__PURE__ */ import_react70.default.createElement("div", { className: "flex items-center gap-3 md:gap-4" }, /* @__PURE__ */ import_react70.default.createElement("h2", { className: " text-sm text-black transition-all flex items-center gap-2" }, project.title, /* @__PURE__ */ import_react70.default.createElement("span", { className: "text-xs opacity-0 -translate-x-2 group-hover:opacity-100 group-hover:translate-x-0 transition-all duration-300" }, project.isExternal ? "\u2197" : "\u2192")), /* @__PURE__ */ import_react70.default.createElement("span", { className: `text-xs px-2.5 py-1 rounded-full tracking-[0.15em] transition-colors ${project.status.toLowerCase() === "production" ? "bg-black text-white" : "bg-stone-100 text-stone-500 group-hover:bg-stone-50 group-hover:text-black"}` }, project.status)), /* @__PURE__ */ import_react70.default.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-500 shrink-0 " }, project.date)), /* @__PURE__ */ import_react70.default.createElement("p", { className: "text-sm leading-[1.8] text-stone-600 max-w-4xl text-left transition-colors group-hover:text-black" }, project.description));
|
|
4001
|
+
return /* @__PURE__ */ import_react70.default.createElement(GridSection, { key: project.id || index, isLast, className: isLast ? "py-8 md:py-10 pb-12 md:pb-14" : "py-8 md:py-10" }, project.isExternal ? /* @__PURE__ */ import_react70.default.createElement("a", { href: project.link, target: "_blank", rel: "noopener noreferrer", className: "block outline-none" }, projectContent) : /* @__PURE__ */ import_react70.default.createElement(import_link9.default, { href: project.link, className: "block outline-none" }, projectContent));
|
|
4005
4002
|
}))));
|
|
4006
4003
|
};
|
|
4007
4004
|
|
|
4008
4005
|
// src/components/UniversalVerificationPage.tsx
|
|
4009
|
-
var
|
|
4010
|
-
var
|
|
4011
|
-
var
|
|
4006
|
+
var import_react71 = __toESM(require("react"));
|
|
4007
|
+
var import_react72 = require("@hugeicons/react");
|
|
4008
|
+
var import_core_free_icons24 = require("@hugeicons/core-free-icons");
|
|
4012
4009
|
var VerificationRow = ({
|
|
4013
4010
|
icon,
|
|
4014
4011
|
title,
|
|
@@ -4026,14 +4023,14 @@ var VerificationRow = ({
|
|
|
4026
4023
|
case "APPROVED":
|
|
4027
4024
|
statusText = "Completed";
|
|
4028
4025
|
statusColor = "text-stone-600";
|
|
4029
|
-
StatusIcon =
|
|
4026
|
+
StatusIcon = import_core_free_icons24.CheckmarkCircle01Icon;
|
|
4030
4027
|
bg = "bg-stone-50";
|
|
4031
4028
|
iconColor = "text-green-500";
|
|
4032
4029
|
break;
|
|
4033
4030
|
case "PENDING":
|
|
4034
4031
|
statusText = "Awaiting Approval";
|
|
4035
4032
|
statusColor = "text-stone-500";
|
|
4036
|
-
StatusIcon =
|
|
4033
|
+
StatusIcon = import_core_free_icons24.Time02Icon;
|
|
4037
4034
|
bg = "bg-stone-50";
|
|
4038
4035
|
iconColor = "text-orange-500";
|
|
4039
4036
|
break;
|
|
@@ -4041,7 +4038,7 @@ var VerificationRow = ({
|
|
|
4041
4038
|
statusText = "Action required to fix issue";
|
|
4042
4039
|
statusColor = "text-stone-500";
|
|
4043
4040
|
bg = "bg-stone-50";
|
|
4044
|
-
StatusIcon =
|
|
4041
|
+
StatusIcon = import_core_free_icons24.InformationCircleIcon;
|
|
4045
4042
|
iconColor = "text-red-500";
|
|
4046
4043
|
break;
|
|
4047
4044
|
case "ACTION_REQUIRED":
|
|
@@ -4049,20 +4046,20 @@ var VerificationRow = ({
|
|
|
4049
4046
|
statusText = "Start verification";
|
|
4050
4047
|
statusColor = "text-stone-500";
|
|
4051
4048
|
bg = "bg-stone-50";
|
|
4052
|
-
StatusIcon =
|
|
4049
|
+
StatusIcon = import_core_free_icons24.InformationCircleIcon;
|
|
4053
4050
|
iconColor = "text-stone-400";
|
|
4054
4051
|
break;
|
|
4055
4052
|
}
|
|
4056
4053
|
const isDisabled = status === "APPROVED" || isLoading;
|
|
4057
|
-
return /* @__PURE__ */
|
|
4054
|
+
return /* @__PURE__ */ import_react71.default.createElement(
|
|
4058
4055
|
"div",
|
|
4059
4056
|
{
|
|
4060
4057
|
onClick: isDisabled ? void 0 : onClick,
|
|
4061
4058
|
className: `flex items-center p-4 transition-colors ${!isLast ? "" : ""} ${isDisabled ? "opacity-70 cursor-default" : "cursor-pointer hover:bg-stone-50"}`
|
|
4062
4059
|
},
|
|
4063
|
-
/* @__PURE__ */
|
|
4064
|
-
/* @__PURE__ */
|
|
4065
|
-
/* @__PURE__ */
|
|
4060
|
+
/* @__PURE__ */ import_react71.default.createElement("div", { className: "w-9 h-9 rounded-full border border-stone-200 bg-white flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ import_react71.default.createElement(import_react72.HugeiconsIcon, { icon, size: 16, className: "text-black" })),
|
|
4061
|
+
/* @__PURE__ */ import_react71.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react71.default.createElement("p", { className: "text-sm truncate text-black" }, title), /* @__PURE__ */ import_react71.default.createElement("p", { className: `text-xs inline-flex items-center ${bg} rounded-full px-2 py-1 ${statusColor} mt-0.5` }, statusText)),
|
|
4062
|
+
/* @__PURE__ */ import_react71.default.createElement("div", { className: "shrink-0 ml-2" }, isLoading ? /* @__PURE__ */ import_react71.default.createElement(import_react72.HugeiconsIcon, { icon: import_core_free_icons24.Loading03Icon, size: 20, className: "animate-spin text-black" }) : /* @__PURE__ */ import_react71.default.createElement(import_react72.HugeiconsIcon, { icon: StatusIcon, size: 20, className: iconColor }))
|
|
4066
4063
|
);
|
|
4067
4064
|
};
|
|
4068
4065
|
var UniversalVerificationPage = ({
|
|
@@ -4075,36 +4072,36 @@ var UniversalVerificationPage = ({
|
|
|
4075
4072
|
onTriggerVerification,
|
|
4076
4073
|
activeLoadingType
|
|
4077
4074
|
}) => {
|
|
4078
|
-
return /* @__PURE__ */
|
|
4075
|
+
return /* @__PURE__ */ import_react71.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 pb-12" }, /* @__PURE__ */ import_react71.default.createElement("div", { className: "mb-6 flex items-center px-1" }, /* @__PURE__ */ import_react71.default.createElement(
|
|
4079
4076
|
"button",
|
|
4080
4077
|
{
|
|
4081
4078
|
onClick: onBack,
|
|
4082
4079
|
className: "flex items-center gap-2 text-stone-500 hover:text-black transition-colors text-sm outline-none"
|
|
4083
4080
|
},
|
|
4084
|
-
/* @__PURE__ */
|
|
4081
|
+
/* @__PURE__ */ import_react71.default.createElement(import_react72.HugeiconsIcon, { icon: import_core_free_icons24.ArrowLeft01Icon, size: 16 }),
|
|
4085
4082
|
" Back"
|
|
4086
|
-
)), /* @__PURE__ */
|
|
4083
|
+
)), /* @__PURE__ */ import_react71.default.createElement("div", { className: "w-full flex flex-col gap-4 mb-8" }, /* @__PURE__ */ import_react71.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react71.default.createElement(
|
|
4087
4084
|
VerificationRow,
|
|
4088
4085
|
{
|
|
4089
|
-
icon:
|
|
4086
|
+
icon: import_core_free_icons24.Mail01Icon,
|
|
4090
4087
|
title: "Email Verification",
|
|
4091
4088
|
status: emailStatus,
|
|
4092
4089
|
isLoading: activeLoadingType === "EMAIL",
|
|
4093
4090
|
onClick: () => onTriggerVerification("EMAIL")
|
|
4094
4091
|
}
|
|
4095
|
-
), /* @__PURE__ */
|
|
4092
|
+
), /* @__PURE__ */ import_react71.default.createElement(
|
|
4096
4093
|
VerificationRow,
|
|
4097
4094
|
{
|
|
4098
|
-
icon:
|
|
4095
|
+
icon: import_core_free_icons24.SmartPhone01Icon,
|
|
4099
4096
|
title: "Phone Verification",
|
|
4100
4097
|
status: phoneStatus,
|
|
4101
4098
|
isLoading: activeLoadingType === "PHONE",
|
|
4102
4099
|
onClick: () => onTriggerVerification("PHONE")
|
|
4103
4100
|
}
|
|
4104
|
-
), /* @__PURE__ */
|
|
4101
|
+
), /* @__PURE__ */ import_react71.default.createElement(
|
|
4105
4102
|
VerificationRow,
|
|
4106
4103
|
{
|
|
4107
|
-
icon:
|
|
4104
|
+
icon: import_core_free_icons24.UserIcon,
|
|
4108
4105
|
title: "Identity Verification",
|
|
4109
4106
|
status: identityStatus,
|
|
4110
4107
|
isLoading: activeLoadingType === "IDENTITY",
|
|
@@ -4115,23 +4112,23 @@ var UniversalVerificationPage = ({
|
|
|
4115
4112
|
};
|
|
4116
4113
|
|
|
4117
4114
|
// src/components/UniversalRewardPage.tsx
|
|
4118
|
-
var
|
|
4115
|
+
var import_react73 = __toESM(require("react"));
|
|
4119
4116
|
var import_axios = __toESM(require("axios"));
|
|
4120
4117
|
var import_react_hot_toast10 = __toESM(require("react-hot-toast"));
|
|
4121
4118
|
var import_react_confetti = __toESM(require("react-confetti"));
|
|
4122
4119
|
var import_react_use = require("react-use");
|
|
4123
|
-
var
|
|
4124
|
-
var
|
|
4120
|
+
var import_react74 = require("@hugeicons/react");
|
|
4121
|
+
var import_core_free_icons25 = require("@hugeicons/core-free-icons");
|
|
4125
4122
|
var formatWeb3Name = (name) => {
|
|
4126
4123
|
if (!name) return "";
|
|
4127
4124
|
return name.toLowerCase().replace(/\b\w/g, (c) => c.toUpperCase());
|
|
4128
4125
|
};
|
|
4129
|
-
var PageSpinner4 = () => /* @__PURE__ */
|
|
4126
|
+
var PageSpinner4 = () => /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex justify-center items-center py-12 w-full" }, /* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.Loading03Icon, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
4130
4127
|
var AvatarLogo = ({ src, alt, name, sizeClass = "w-12 h-12" }) => {
|
|
4131
|
-
const [isLoaded, setIsLoaded] = (0,
|
|
4128
|
+
const [isLoaded, setIsLoaded] = (0, import_react73.useState)(false);
|
|
4132
4129
|
const fallbackUrl = `/api/avatar/?name=${encodeURIComponent(name || " ")}&background=ffffff&color=000000&size=100&font-size=0.33`;
|
|
4133
4130
|
const finalSrc = src || fallbackUrl;
|
|
4134
|
-
return /* @__PURE__ */
|
|
4131
|
+
return /* @__PURE__ */ import_react73.default.createElement("div", { className: `relative shrink-0 rounded-full bg-stone-100 flex items-center justify-center overflow-hidden border-[3px] border-white ${sizeClass}` }, !isLoaded && /* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.Loading03Icon, size: 16, className: "animate-spin text-stone-400 absolute" }), /* @__PURE__ */ import_react73.default.createElement("img", { src: finalSrc, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
|
|
4135
4132
|
};
|
|
4136
4133
|
var UniversalRewardPage = ({
|
|
4137
4134
|
leaderboardToday,
|
|
@@ -4146,11 +4143,11 @@ var UniversalRewardPage = ({
|
|
|
4146
4143
|
const onBackHandler = onBack ?? (() => {
|
|
4147
4144
|
if (typeof window !== "undefined") window.history.back();
|
|
4148
4145
|
});
|
|
4149
|
-
const [activeTabIndex, setActiveTabIndex] = (0,
|
|
4146
|
+
const [activeTabIndex, setActiveTabIndex] = (0, import_react73.useState)(1);
|
|
4150
4147
|
const tabs = [{ label: "Today" }, { label: "Week" }, { label: "Month" }];
|
|
4151
|
-
const [selectedReward, setSelectedReward] = (0,
|
|
4152
|
-
const [isClaiming, setIsClaiming] = (0,
|
|
4153
|
-
const [showConfetti, setShowConfetti] = (0,
|
|
4148
|
+
const [selectedReward, setSelectedReward] = (0, import_react73.useState)(null);
|
|
4149
|
+
const [isClaiming, setIsClaiming] = (0, import_react73.useState)(false);
|
|
4150
|
+
const [showConfetti, setShowConfetti] = (0, import_react73.useState)(false);
|
|
4154
4151
|
const getActiveLeaderboard = () => {
|
|
4155
4152
|
if (activeTabIndex === 0) return leaderboardToday || [];
|
|
4156
4153
|
if (activeTabIndex === 1) return leaderboardWeek || [];
|
|
@@ -4181,9 +4178,9 @@ var UniversalRewardPage = ({
|
|
|
4181
4178
|
setIsClaiming(false);
|
|
4182
4179
|
}
|
|
4183
4180
|
};
|
|
4184
|
-
return /* @__PURE__ */
|
|
4181
|
+
return /* @__PURE__ */ import_react73.default.createElement("div", null, /* @__PURE__ */ import_react73.default.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ import_react73.default.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-stone-500 hover:text-black transition-colors text-sm outline-none" }, /* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.ArrowLeft01Icon, size: 16 }), " Back")), /* @__PURE__ */ import_react73.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react73.default.createElement(ManagedToaster, null), showConfetti && /* @__PURE__ */ import_react73.default.createElement("div", { className: "fixed inset-0 z-200 pointer-events-none" }, /* @__PURE__ */ import_react73.default.createElement(import_react_confetti.default, { width, height, recycle: false, numberOfPieces: 500, gravity: 0.15 })), isLoading ? /* @__PURE__ */ import_react73.default.createElement(PageSpinner4, null) : /* @__PURE__ */ import_react73.default.createElement(import_react73.default.Fragment, null, /* @__PURE__ */ import_react73.default.createElement("div", { className: "w-full p-4 pt-10 mb-6 flex items-end justify-center gap-2 sm:gap-6 h-64 relative overflow-hidden" }, /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col items-center w-1/3 z-10" }, secondPlace ? /* @__PURE__ */ import_react73.default.createElement(import_react73.default.Fragment, null, /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-black text-xs mb-2 truncate max-w-full px-1" }, formatWeb3Name(secondPlace.profile.web3Name)), /* @__PURE__ */ import_react73.default.createElement("div", { className: "relative shrink-0 mb-3" }, /* @__PURE__ */ import_react73.default.createElement(AvatarLogo, { src: secondPlace.profile.avatarUrl, alt: secondPlace.profile.username, name: formatWeb3Name(secondPlace.profile.web3Name), sizeClass: "w-14 h-14" }), /* @__PURE__ */ import_react73.default.createElement("div", { className: "absolute -bottom-2 right-0 w-5 h-5 rounded-full bg-[#ceff8a] text-black flex items-center justify-center text-xs border border-white " }, "2")), /* @__PURE__ */ import_react73.default.createElement("div", { className: "w-full bg-linear-to-t from-stone-100 to-[#ceff8a] rounded-t-xl h-24 flex items-center justify-center" }, /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-stone-800/30 text-2xl " }, "2nd"))) : /* @__PURE__ */ import_react73.default.createElement("div", { className: "w-full bg-linear-to-t from-stone-200 to-stone-100 rounded-t-xl h-24 mt-auto" })), /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col items-center w-1/3 z-20 -mt-8" }, firstPlace ? /* @__PURE__ */ import_react73.default.createElement(import_react73.default.Fragment, null, /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-black text-xs mb-2 truncate max-w-full px-1" }, formatWeb3Name(firstPlace.profile.web3Name)), /* @__PURE__ */ import_react73.default.createElement("div", { className: "relative shrink-0 mb-3" }, /* @__PURE__ */ import_react73.default.createElement(AvatarLogo, { src: firstPlace.profile.avatarUrl, alt: firstPlace.profile.username, name: formatWeb3Name(firstPlace.profile.web3Name), sizeClass: "w-17 h-17" }), /* @__PURE__ */ import_react73.default.createElement("div", { className: "absolute -bottom-2 right-2 w-5 h-5 rounded-full bg-[#143731] text-white flex items-center justify-center text-xs border border-white " }, "1")), /* @__PURE__ */ import_react73.default.createElement("div", { className: "w-full bg-linear-to-t from-stone-100 to-[#143731] rounded-t-xl h-32 flex items-center justify-center " }, /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-white/40 text-3xl tracking-widest" }, "1st"))) : /* @__PURE__ */ import_react73.default.createElement("div", { className: "w-full bg-linear-to-t from-stone-200 to-stone-100 rounded-t-xl h-32 mt-auto" })), /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col items-center w-1/3 z-10" }, thirdPlace ? /* @__PURE__ */ import_react73.default.createElement(import_react73.default.Fragment, null, /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-black text-xs mb-2 truncate max-w-full px-1" }, formatWeb3Name(thirdPlace.profile.web3Name)), /* @__PURE__ */ import_react73.default.createElement("div", { className: "relative shrink-0 mb-3" }, /* @__PURE__ */ import_react73.default.createElement(AvatarLogo, { src: thirdPlace.profile.avatarUrl, alt: thirdPlace.profile.username, name: formatWeb3Name(thirdPlace.profile.web3Name), sizeClass: "w-12 h-12" }), /* @__PURE__ */ import_react73.default.createElement("div", { className: "absolute -bottom-2 right-0 w-5 h-5 rounded-full bg-[#ceff8a] text-black flex items-center justify-center text-xs border border-white " }, "3")), /* @__PURE__ */ import_react73.default.createElement("div", { className: "w-full bg-linear-to-t from-stone-100 to-[#ceff8a] rounded-t-xl h-20 flex items-center justify-center" }, /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-stone-800/30 text-xl " }, "3rd"))) : /* @__PURE__ */ import_react73.default.createElement("div", { className: "w-full bg-linear-to-t from-stone-200 to-stone-100 rounded-t-xl h-20 mt-auto" }))), /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex items-center justify-center mb-6 sm:mb-8 w-full animate-in fade-in duration-300 px-2" }, /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex items-center bg-white rounded-full p-1 sm:p-1.5 max-w-full overflow-x-auto custom-scrollbar " }, tabs.map((tab, idx) => {
|
|
4185
4182
|
const isActive = activeTabIndex === idx;
|
|
4186
|
-
return /* @__PURE__ */
|
|
4183
|
+
return /* @__PURE__ */ import_react73.default.createElement(
|
|
4187
4184
|
"button",
|
|
4188
4185
|
{
|
|
4189
4186
|
key: idx,
|
|
@@ -4192,19 +4189,19 @@ var UniversalRewardPage = ({
|
|
|
4192
4189
|
},
|
|
4193
4190
|
tab.label
|
|
4194
4191
|
);
|
|
4195
|
-
}))), /* @__PURE__ */
|
|
4192
|
+
}))), /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col gap-6 w-full" }, /* @__PURE__ */ import_react73.default.createElement("div", { className: "bg-white rounded-2xl p-6 " }, /* @__PURE__ */ import_react73.default.createElement("h2", { className: "text-black text-lg mb-4 tracking-tight" }, "Available Tasks"), /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col" }, rewards.length === 0 ? /* @__PURE__ */ import_react73.default.createElement("p", { className: "text-xs text-stone-400 py-6 text-center" }, "No rewards available at the moment.") : rewards.map((reward) => {
|
|
4196
4193
|
const statusText = reward.status === "CLAIMED" ? "Claimed" : "Unclaimed";
|
|
4197
|
-
return /* @__PURE__ */
|
|
4194
|
+
return /* @__PURE__ */ import_react73.default.createElement(
|
|
4198
4195
|
"div",
|
|
4199
4196
|
{
|
|
4200
4197
|
key: reward.id,
|
|
4201
4198
|
onClick: () => setSelectedReward(reward),
|
|
4202
4199
|
className: "flex items-center justify-between py-4 hover:bg-stone-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl"
|
|
4203
4200
|
},
|
|
4204
|
-
/* @__PURE__ */
|
|
4205
|
-
/* @__PURE__ */
|
|
4201
|
+
/* @__PURE__ */ import_react73.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react73.default.createElement("div", { className: "w-10 h-10 shrink-0 rounded-full flex items-center justify-center border border-stone-200 text-black" }, /* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.GiftIcon, size: 16 })), /* @__PURE__ */ import_react73.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col items-start gap-0.5 pr-4" }, /* @__PURE__ */ import_react73.default.createElement("p", { className: "text-sm text-black truncate w-full" }, reward.title), /* @__PURE__ */ import_react73.default.createElement("p", { className: `text-xs inline-flex items-center bg-stone-50 rounded-full px-2 py-1 text-stone-500 mt-0.5` }, statusText))),
|
|
4202
|
+
/* @__PURE__ */ import_react73.default.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1" }, /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-sm text-black" }, reward.amount))
|
|
4206
4203
|
);
|
|
4207
|
-
}))), remainingLeaderboard.length > 0 && /* @__PURE__ */
|
|
4204
|
+
}))), remainingLeaderboard.length > 0 && /* @__PURE__ */ import_react73.default.createElement("div", { className: "bg-white rounded-2xl p-6 " }, /* @__PURE__ */ import_react73.default.createElement("h2", { className: "text-black text-lg mb-4 tracking-tight" }, "Leaderboard"), /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col" }, remainingLeaderboard.map((lb) => /* @__PURE__ */ import_react73.default.createElement("div", { key: lb.profile.username, className: "flex items-center justify-between py-3 min-w-0" }, /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react73.default.createElement("div", { className: "text-xs text-stone-400 w-4" }, lb.position), /* @__PURE__ */ import_react73.default.createElement(AvatarLogo, { src: lb.profile.avatarUrl, alt: lb.profile.username, name: formatWeb3Name(lb.profile.web3Name), sizeClass: "w-9 h-9" }), /* @__PURE__ */ import_react73.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col" }, /* @__PURE__ */ import_react73.default.createElement("p", { className: "text-sm text-black truncate" }, formatWeb3Name(lb.profile.web3Name)), /* @__PURE__ */ import_react73.default.createElement("p", { className: "text-xs text-stone-400 truncate" }, "@", lb.profile.username))), /* @__PURE__ */ import_react73.default.createElement("div", { className: "shrink-0 text-sm text-black" }, lb.amount))))))), selectedReward && /* @__PURE__ */ import_react73.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react73.default.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => !isClaiming && setSelectedReward(null) }), /* @__PURE__ */ import_react73.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-3xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex-1 p-6 flex flex-col items-center text-center mt-2" }, /* @__PURE__ */ import_react73.default.createElement("h2", { className: "text-xl text-black mb-2" }, selectedReward.title), /* @__PURE__ */ import_react73.default.createElement("p", { className: "text-sm text-stone-500 mb-6 leading-relaxed" }, selectedReward.description), selectedReward.progressText && /* @__PURE__ */ import_react73.default.createElement("div", { className: "w-full mb-6" }, /* @__PURE__ */ import_react73.default.createElement("div", { className: `px-4 py-2 rounded-full text-xs tracking-wide ${selectedReward.status === "CLAIMED" ? "bg-green-50 text-green-600" : selectedReward.isEligible ? "bg-blue-50 text-blue-600" : "bg-stone-100 text-stone-600"}` }, selectedReward.progressText)), /* @__PURE__ */ import_react73.default.createElement("div", { className: " w-full rounded-xl p-4 mb-8 flex flex-col items-center" }, /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-xs tracking-widest text-stone-400 mb-1" }, "Reward Value"), /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-3xl text-black " }, selectedReward.amount)), /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col gap-3 w-full" }, /* @__PURE__ */ import_react73.default.createElement(
|
|
4208
4205
|
ThreeDActionButton,
|
|
4209
4206
|
{
|
|
4210
4207
|
onClick: handleClaimReward,
|
|
@@ -4213,7 +4210,7 @@ var UniversalRewardPage = ({
|
|
|
4213
4210
|
className: "w-full"
|
|
4214
4211
|
},
|
|
4215
4212
|
selectedReward.status === "CLAIMED" ? "Already Claimed" : selectedReward.isEligible ? "Claim Reward" : "Not Eligible Yet"
|
|
4216
|
-
), /* @__PURE__ */
|
|
4213
|
+
), /* @__PURE__ */ import_react73.default.createElement(
|
|
4217
4214
|
"button",
|
|
4218
4215
|
{
|
|
4219
4216
|
onClick: () => setSelectedReward(null),
|
|
@@ -4225,11 +4222,11 @@ var UniversalRewardPage = ({
|
|
|
4225
4222
|
};
|
|
4226
4223
|
|
|
4227
4224
|
// src/components/UniversalReferralPage.tsx
|
|
4228
|
-
var
|
|
4225
|
+
var import_react75 = __toESM(require("react"));
|
|
4229
4226
|
var import_react_hot_toast11 = __toESM(require("react-hot-toast"));
|
|
4230
|
-
var
|
|
4231
|
-
var
|
|
4232
|
-
var PageSpinner5 = () => /* @__PURE__ */
|
|
4227
|
+
var import_react76 = require("@hugeicons/react");
|
|
4228
|
+
var import_core_free_icons26 = require("@hugeicons/core-free-icons");
|
|
4229
|
+
var PageSpinner5 = () => /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ import_react75.default.createElement(import_react76.HugeiconsIcon, { icon: import_core_free_icons26.Loading03Icon, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
4233
4230
|
var formatWeb3Name2 = (name) => {
|
|
4234
4231
|
if (!name) return "";
|
|
4235
4232
|
return name.toLowerCase().replace(/\b\w/g, (c) => c.toUpperCase());
|
|
@@ -4261,61 +4258,61 @@ var UniversalReferralPage = ({
|
|
|
4261
4258
|
}
|
|
4262
4259
|
};
|
|
4263
4260
|
const AvatarLogo2 = ({ src, alt, name, sizeClass = "w-10 h-10" }) => {
|
|
4264
|
-
const [isLoaded, setIsLoaded] = (0,
|
|
4261
|
+
const [isLoaded, setIsLoaded] = (0, import_react75.useState)(false);
|
|
4265
4262
|
const fallbackUrl = `/api/avatar/?name=${encodeURIComponent(name || " ")}&background=e0e0e0&color=000000&size=100&font-size=0.33`;
|
|
4266
4263
|
const finalSrc = src || fallbackUrl;
|
|
4267
|
-
return /* @__PURE__ */
|
|
4264
|
+
return /* @__PURE__ */ import_react75.default.createElement("div", { className: `relative shrink-0 rounded-full bg-stone-100 flex items-center justify-center overflow-hidden border-2 border-white ${sizeClass}` }, !isLoaded && /* @__PURE__ */ import_react75.default.createElement(import_react76.HugeiconsIcon, { icon: import_core_free_icons26.Loading03Icon, size: 16, className: "animate-spin text-stone-400 absolute" }), /* @__PURE__ */ import_react75.default.createElement("img", { src: finalSrc, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
|
|
4268
4265
|
};
|
|
4269
|
-
return /* @__PURE__ */
|
|
4266
|
+
return /* @__PURE__ */ import_react75.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react75.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react75.default.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ import_react75.default.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-stone-500 hover:text-black transition-colors text-sm outline-none" }, /* @__PURE__ */ import_react75.default.createElement(import_react76.HugeiconsIcon, { icon: import_core_free_icons26.ArrowLeft01Icon, size: 16 }), " Back")), /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col gap-4 mb-6 px-1" }, /* @__PURE__ */ import_react75.default.createElement("div", null, /* @__PURE__ */ import_react75.default.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, "Your Referrals"), /* @__PURE__ */ import_react75.default.createElement("p", { className: "text-xs text-stone-500" }, "Invite friends and earn rewards when they verify and activate cards.")), /* @__PURE__ */ import_react75.default.createElement("div", { className: "bg-[#143731] rounded-3xl p-6 relative overflow-hidden flex flex-col min-h-25 w-full mt-2" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "relative z-10 flex flex-col items-start" }, /* @__PURE__ */ import_react75.default.createElement("p", { className: "text-xs text-white leading-tight mb-1" }, /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-white/60" }, "AFT Balance")), isLoading ? /* @__PURE__ */ import_react75.default.createElement("div", { className: "h-8 w-32 bg-white/10 animate-pulse rounded mt-2" }) : /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-lg text-white tracking-tight mt-1" }, referralCoins)))), /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col gap-6 p-4 rounded-3xl bg-white w-full" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "border border-stone-200 rounded-xl p-4 flex items-center justify-between" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-xs tracking-widest text-stone-400 " }, "Invitation Code"), isLoading && !referralCode ? /* @__PURE__ */ import_react75.default.createElement("div", { className: "h-6 w-24 bg-stone-50 animate-pulse rounded mt-1" }) : /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-sm text-black tracking-widest" }, referralCode)), /* @__PURE__ */ import_react75.default.createElement(
|
|
4270
4267
|
"button",
|
|
4271
4268
|
{
|
|
4272
4269
|
onClick: handleCopyCode,
|
|
4273
4270
|
disabled: isLoading || !referralCode,
|
|
4274
4271
|
className: "w-10 h-10 rounded-full bg-white flex items-center justify-center text-stone-500 hover:text-black transition-colors outline-none disabled:opacity-50"
|
|
4275
4272
|
},
|
|
4276
|
-
/* @__PURE__ */
|
|
4277
|
-
)), /* @__PURE__ */
|
|
4273
|
+
/* @__PURE__ */ import_react75.default.createElement(import_react76.HugeiconsIcon, { icon: import_core_free_icons26.Copy01Icon, size: 18 })
|
|
4274
|
+
)), /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex items-center justify-between text-sm text-stone-500 px-1" }, /* @__PURE__ */ import_react75.default.createElement("span", null, "Total Invited: ", /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-black " }, isLoading && !totalCount ? "-" : totalCount)))), /* @__PURE__ */ import_react75.default.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ import_react75.default.createElement(PageSpinner5, null) : /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react75.default.createElement("div", null, referrals.length === 0 ? /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col items-center justify-center py-8 opacity-50" }, /* @__PURE__ */ import_react75.default.createElement("p", { className: "text-xs text-stone-500 text-center" }, "You haven't referred anyone yet.")) : referrals.map((ref, idx) => /* @__PURE__ */ import_react75.default.createElement(
|
|
4278
4275
|
"div",
|
|
4279
4276
|
{
|
|
4280
4277
|
key: `${ref.profile.username}-${idx}`,
|
|
4281
4278
|
className: "flex items-center justify-between py-4 hover:bg-stone-50 transition-colors group min-w-0 px-3 -mx-3 rounded-xl"
|
|
4282
4279
|
},
|
|
4283
|
-
/* @__PURE__ */
|
|
4280
|
+
/* @__PURE__ */ import_react75.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react75.default.createElement(
|
|
4284
4281
|
AvatarLogo2,
|
|
4285
4282
|
{
|
|
4286
4283
|
src: ref.profile.avatarUrl,
|
|
4287
4284
|
alt: ref.profile.username,
|
|
4288
4285
|
name: formatWeb3Name2(ref.profile.web3Name)
|
|
4289
4286
|
}
|
|
4290
|
-
), /* @__PURE__ */
|
|
4291
|
-
/* @__PURE__ */
|
|
4292
|
-
))), /* @__PURE__ */
|
|
4287
|
+
), /* @__PURE__ */ import_react75.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-0.5 pr-4" }, /* @__PURE__ */ import_react75.default.createElement("p", { className: "text-sm text-black truncate" }, formatWeb3Name2(ref.profile.web3Name)), /* @__PURE__ */ import_react75.default.createElement("p", { className: "text-xs text-stone-500 truncate" }, "@", ref.profile.username))),
|
|
4288
|
+
/* @__PURE__ */ import_react75.default.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-xs text-stone-400" }, "Joined"), /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-xs text-black" }, formatDate(ref.joinedAt)))
|
|
4289
|
+
))), /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex items-center justify-between pt-6 mt-2" }, /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-xs text-stone-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages === 0 ? 1 : totalPages), /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react75.default.createElement(
|
|
4293
4290
|
"button",
|
|
4294
4291
|
{
|
|
4295
4292
|
onClick: () => onPageChange(currentPage - 1),
|
|
4296
4293
|
disabled: currentPage <= 1 || isLoading,
|
|
4297
4294
|
className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
4298
4295
|
},
|
|
4299
|
-
/* @__PURE__ */
|
|
4300
|
-
), /* @__PURE__ */
|
|
4296
|
+
/* @__PURE__ */ import_react75.default.createElement(import_react76.HugeiconsIcon, { icon: import_core_free_icons26.ArrowLeft01Icon, size: 14 })
|
|
4297
|
+
), /* @__PURE__ */ import_react75.default.createElement(
|
|
4301
4298
|
"button",
|
|
4302
4299
|
{
|
|
4303
4300
|
onClick: () => onPageChange(currentPage + 1),
|
|
4304
4301
|
disabled: currentPage >= totalPages || isLoading || totalPages === 0,
|
|
4305
4302
|
className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
4306
4303
|
},
|
|
4307
|
-
/* @__PURE__ */
|
|
4304
|
+
/* @__PURE__ */ import_react75.default.createElement(import_react76.HugeiconsIcon, { icon: import_core_free_icons26.ArrowRight01Icon, size: 14 })
|
|
4308
4305
|
)))))));
|
|
4309
4306
|
};
|
|
4310
4307
|
|
|
4311
4308
|
// src/components/UniversalCardActionPage.tsx
|
|
4312
|
-
var
|
|
4309
|
+
var import_react77 = __toESM(require("react"));
|
|
4313
4310
|
var import_react_confetti2 = __toESM(require("react-confetti"));
|
|
4314
4311
|
var import_react_use2 = require("react-use");
|
|
4315
|
-
var
|
|
4316
|
-
var
|
|
4317
|
-
var CheckIcon2 = ({ className = "" }) => /* @__PURE__ */
|
|
4318
|
-
var CrossIcon2 = ({ className = "" }) => /* @__PURE__ */
|
|
4312
|
+
var import_react78 = require("@hugeicons/react");
|
|
4313
|
+
var import_core_free_icons27 = require("@hugeicons/core-free-icons");
|
|
4314
|
+
var CheckIcon2 = ({ className = "" }) => /* @__PURE__ */ import_react77.default.createElement("svg", { viewBox: "0 0 24 24", fill: "none", className: `w-4 h-4 shrink-0 ${className}`, xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react77.default.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "black" }), /* @__PURE__ */ import_react77.default.createElement("path", { d: "M8 12L11 15L16 9", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
4315
|
+
var CrossIcon2 = ({ className = "" }) => /* @__PURE__ */ import_react77.default.createElement("svg", { viewBox: "0 0 24 24", fill: "none", className: `w-4 h-4 shrink-0 ${className}`, xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react77.default.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "#F5F5F5" }), /* @__PURE__ */ import_react77.default.createElement("path", { d: "M15 9L9 15M9 9l6 6", stroke: "#D4D4D4", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
4319
4316
|
var formatTierName = (name) => {
|
|
4320
4317
|
if (!name) return "";
|
|
4321
4318
|
return name.charAt(0).toUpperCase() + name.slice(1).toLowerCase();
|
|
@@ -4356,10 +4353,10 @@ var UniversalCardActionPage = ({
|
|
|
4356
4353
|
if (typeof window !== "undefined") window.history.back();
|
|
4357
4354
|
});
|
|
4358
4355
|
const { width, height } = (0, import_react_use2.useWindowSize)();
|
|
4359
|
-
const [selectedTier, setSelectedTier] = (0,
|
|
4360
|
-
const [intendedAction, setIntendedAction] = (0,
|
|
4361
|
-
const [isProcessing, setIsProcessing] = (0,
|
|
4362
|
-
const [showConfetti, setShowConfetti] = (0,
|
|
4356
|
+
const [selectedTier, setSelectedTier] = (0, import_react77.useState)(null);
|
|
4357
|
+
const [intendedAction, setIntendedAction] = (0, import_react77.useState)(null);
|
|
4358
|
+
const [isProcessing, setIsProcessing] = (0, import_react77.useState)(false);
|
|
4359
|
+
const [showConfetti, setShowConfetti] = (0, import_react77.useState)(false);
|
|
4363
4360
|
const availableTiers = tiers.filter((t) => t.isAvailable || t.acceptPreorder || t.acceptWaitlist);
|
|
4364
4361
|
const handleTierClick = (tier, explicitAction) => {
|
|
4365
4362
|
setSelectedTier(tier);
|
|
@@ -4396,22 +4393,22 @@ var UniversalCardActionPage = ({
|
|
|
4396
4393
|
if (isCurrent && (onWaitlist || hasPreordered)) return "Joined";
|
|
4397
4394
|
return "Join Waitlist";
|
|
4398
4395
|
};
|
|
4399
|
-
return /* @__PURE__ */
|
|
4396
|
+
return /* @__PURE__ */ import_react77.default.createElement("div", { className: "w-full" }, /* @__PURE__ */ import_react77.default.createElement(ManagedToaster, null), showConfetti && /* @__PURE__ */ import_react77.default.createElement("div", { className: "fixed inset-0 z-200 pointer-events-none" }, /* @__PURE__ */ import_react77.default.createElement(import_react_confetti2.default, { width, height, recycle: false, numberOfPieces: 500, gravity: 0.15 })), /* @__PURE__ */ import_react77.default.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ import_react77.default.createElement(
|
|
4400
4397
|
"button",
|
|
4401
4398
|
{
|
|
4402
4399
|
onClick: onBackHandler,
|
|
4403
4400
|
className: "flex items-center gap-2 text-stone-500 hover:text-black transition-colors text-sm outline-none"
|
|
4404
4401
|
},
|
|
4405
|
-
/* @__PURE__ */
|
|
4402
|
+
/* @__PURE__ */ import_react77.default.createElement(import_react78.HugeiconsIcon, { icon: import_core_free_icons27.ArrowLeft01Icon, size: 16 }),
|
|
4406
4403
|
" Back"
|
|
4407
|
-
)), /* @__PURE__ */
|
|
4404
|
+
)), /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex flex-col animate-in max-w-5xl w-full mx-auto fade-in duration-300" }, /* @__PURE__ */ import_react77.default.createElement("div", { className: "w-full flex flex-col items-center text-center mb-10 px-4" }, /* @__PURE__ */ import_react77.default.createElement("span", { className: "text-xs tracking-[0.4em] text-stone-400 block mb-3" }, cardType, " CARD ACTIVATION"), /* @__PURE__ */ import_react77.default.createElement("h1", { className: "text-2xl sm:text-3xl text-black tracking-tight mb-2" }, "Select Your Tier"), /* @__PURE__ */ import_react77.default.createElement("p", { className: "text-xs text-stone-500 max-w-lg" }, hasPreordered ? "You have already secured your card. Upgrades are disabled while your order is pending processing." : "Upgrade your tier or secure your card now. Pre-orders guarantee priority processing when the batch goes live.")), isLoadingData ? /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex justify-center py-20" }, /* @__PURE__ */ import_react77.default.createElement(import_react78.HugeiconsIcon, { icon: import_core_free_icons27.Loading03Icon, size: 32, className: "animate-spin text-stone-300" })) : /* @__PURE__ */ import_react77.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5 w-full max-w-4xl mx-auto px-4" }, availableTiers.map((tier) => {
|
|
4408
4405
|
const isCurrent = tier.tierName === currentTier;
|
|
4409
4406
|
const isCardDisabled = hasPreordered && !isCurrent;
|
|
4410
4407
|
const isHighlighted = hasPreordered && isCurrent;
|
|
4411
4408
|
const isThisCardLoading = isProcessing && selectedTier?.tierName === tier.tierName;
|
|
4412
4409
|
const isPrimaryDisabled = isCardDisabled || isHighlighted || isThisCardLoading || !tier.acceptPreorder;
|
|
4413
4410
|
const isWaitlistDisabled = !isCurrent || isCurrent && (onWaitlist || hasPreordered) || isThisCardLoading || !tier.acceptWaitlist;
|
|
4414
|
-
return /* @__PURE__ */
|
|
4411
|
+
return /* @__PURE__ */ import_react77.default.createElement(
|
|
4415
4412
|
"div",
|
|
4416
4413
|
{
|
|
4417
4414
|
key: tier.tierName,
|
|
@@ -4420,15 +4417,15 @@ var UniversalCardActionPage = ({
|
|
|
4420
4417
|
|
|
4421
4418
|
`
|
|
4422
4419
|
},
|
|
4423
|
-
/* @__PURE__ */
|
|
4420
|
+
/* @__PURE__ */ import_react77.default.createElement(
|
|
4424
4421
|
"div",
|
|
4425
4422
|
{
|
|
4426
4423
|
className: `absolute -top-10 -right-10 w-48 h-48 bg-linear-to-bl ${getTierGlow(tier.tierName)} to-transparent opacity-40 blur-2xl rounded-full pointer-events-none`
|
|
4427
4424
|
}
|
|
4428
4425
|
),
|
|
4429
|
-
isThisCardLoading && /* @__PURE__ */
|
|
4430
|
-
/* @__PURE__ */
|
|
4431
|
-
/* @__PURE__ */
|
|
4426
|
+
isThisCardLoading && /* @__PURE__ */ import_react77.default.createElement("div", { className: "absolute inset-0 z-50 flex items-center justify-center bg-white/40 backdrop-blur-[1px]" }, /* @__PURE__ */ import_react77.default.createElement(import_react78.HugeiconsIcon, { icon: import_core_free_icons27.Loading03Icon, size: 32, className: "animate-spin text-black" })),
|
|
4427
|
+
/* @__PURE__ */ import_react77.default.createElement("div", { className: "mb-6 relative z-10" }, /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex justify-between items-start mb-1" }, /* @__PURE__ */ import_react77.default.createElement("span", { className: "text-black text-sm tracking-widest " }, formatTierName(tier.tierName)), isCurrent && !hasPreordered && /* @__PURE__ */ import_react77.default.createElement("span", { className: "text-xs bg-stone-100 text-stone-600 px-2 py-1 rounded-full tracking-wider" }, "Current")), /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex items-baseline gap-1 mt-2" }, /* @__PURE__ */ import_react77.default.createElement("h3", { className: "text-3xl font-light text-black" }, tier.priceUSD === 0 ? "Free" : `$${tier.priceUSD.toFixed(2)}`), tier.priceUSD > 0 && /* @__PURE__ */ import_react77.default.createElement("span", { className: "text-xs text-stone-500" }, tier.isYearly ? "/ year" : "one-time")), /* @__PURE__ */ import_react77.default.createElement("p", { className: "text-sm text-stone-500 mt-3 min-h-12 leading-relaxed" }, tier.description)),
|
|
4428
|
+
/* @__PURE__ */ import_react77.default.createElement("div", { className: "flex flex-col gap-2.5 mb-6 relative z-10" }, /* @__PURE__ */ import_react77.default.createElement("div", { className: isPrimaryDisabled ? "opacity-50 pointer-events-none" : "" }, /* @__PURE__ */ import_react77.default.createElement(
|
|
4432
4429
|
ThreeDActionButton,
|
|
4433
4430
|
{
|
|
4434
4431
|
disabled: isPrimaryDisabled,
|
|
@@ -4436,7 +4433,7 @@ var UniversalCardActionPage = ({
|
|
|
4436
4433
|
className: "w-full"
|
|
4437
4434
|
},
|
|
4438
4435
|
getPrimaryButtonText(tier)
|
|
4439
|
-
)), /* @__PURE__ */
|
|
4436
|
+
)), /* @__PURE__ */ import_react77.default.createElement(
|
|
4440
4437
|
"button",
|
|
4441
4438
|
{
|
|
4442
4439
|
disabled: isWaitlistDisabled,
|
|
@@ -4448,26 +4445,26 @@ var UniversalCardActionPage = ({
|
|
|
4448
4445
|
},
|
|
4449
4446
|
getWaitlistButtonText(tier)
|
|
4450
4447
|
)),
|
|
4451
|
-
/* @__PURE__ */
|
|
4448
|
+
/* @__PURE__ */ import_react77.default.createElement("div", { className: "flex flex-col gap-3 relative z-10" }, tier.features.map((feature, featureIdx) => {
|
|
4452
4449
|
const isAvailable = feature.value !== false;
|
|
4453
4450
|
const valueText = typeof feature.value === "string" ? feature.value : "";
|
|
4454
|
-
return /* @__PURE__ */
|
|
4451
|
+
return /* @__PURE__ */ import_react77.default.createElement("div", { key: featureIdx, className: "flex items-center gap-3" }, isAvailable ? /* @__PURE__ */ import_react77.default.createElement(CheckIcon2, null) : /* @__PURE__ */ import_react77.default.createElement(CrossIcon2, null), /* @__PURE__ */ import_react77.default.createElement("span", { className: `text-xs truncate ${isAvailable ? "text-stone-800" : "text-stone-400"}` }, feature.name, valueText && /* @__PURE__ */ import_react77.default.createElement("span", { className: "text-stone-500 ml-1 " }, valueText)));
|
|
4455
4452
|
}))
|
|
4456
4453
|
);
|
|
4457
|
-
}))), selectedTier && intendedAction !== "join_waitlist" && /* @__PURE__ */
|
|
4454
|
+
}))), selectedTier && intendedAction !== "join_waitlist" && /* @__PURE__ */ import_react77.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react77.default.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => !isProcessing && setSelectedTier(null) }), /* @__PURE__ */ import_react77.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react77.default.createElement(
|
|
4458
4455
|
"div",
|
|
4459
4456
|
{
|
|
4460
4457
|
className: `absolute -top-10 -right-10 w-40 h-40 bg-linear-to-bl ${getTierGlow(selectedTier.tierName)} to-transparent opacity-40 blur-2xl rounded-full pointer-events-none`
|
|
4461
4458
|
}
|
|
4462
|
-
), /* @__PURE__ */
|
|
4459
|
+
), /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 relative z-10" }, /* @__PURE__ */ import_react77.default.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Confirm Action"), /* @__PURE__ */ import_react77.default.createElement(
|
|
4463
4460
|
"button",
|
|
4464
4461
|
{
|
|
4465
4462
|
disabled: isProcessing,
|
|
4466
4463
|
onClick: () => setSelectedTier(null),
|
|
4467
4464
|
className: "text-stone-400 hover:text-black transition-colors outline-none disabled:opacity-50"
|
|
4468
4465
|
},
|
|
4469
|
-
/* @__PURE__ */
|
|
4470
|
-
)), /* @__PURE__ */
|
|
4466
|
+
/* @__PURE__ */ import_react77.default.createElement(import_react78.HugeiconsIcon, { icon: import_core_free_icons27.CancelCircleIcon, size: 18 })
|
|
4467
|
+
)), /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 relative z-10" }, /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ import_react77.default.createElement("p", { className: "text-2xl text-black mb-1" }, selectedTier.priceUSD === 0 ? "Free" : `$${selectedTier.priceUSD.toFixed(2)}`), /* @__PURE__ */ import_react77.default.createElement("span", { className: `text-xs tracking-widest px-4 py-1.5 rounded-full bg-stone-100 text-black mt-1` }, formatTierName(selectedTier.tierName), " ", formatTierName(cardType))), /* @__PURE__ */ import_react77.default.createElement("div", { className: "grid grid-cols-1 gap-y-6 mb-8 mt-4" }, /* @__PURE__ */ import_react77.default.createElement("div", null, /* @__PURE__ */ import_react77.default.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-1" }, "Action"), /* @__PURE__ */ import_react77.default.createElement("span", { className: "text-sm text-black " }, intendedAction === "upgrade" ? `Upgrade to ${formatTierName(selectedTier.tierName)}` : `Pre-order Card`)), intendedAction === "pre_order" && selectedTier.priceUSD > 0 && /* @__PURE__ */ import_react77.default.createElement("div", null, /* @__PURE__ */ import_react77.default.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-1" }, "Payment Notice"), /* @__PURE__ */ import_react77.default.createElement("span", { className: "text-xs text-stone-600 leading-relaxed block" }, "By confirming, $", selectedTier.priceUSD.toFixed(2), " will be securely deducted from your USD asset balance to guarantee your order."))), /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ import_react77.default.createElement(
|
|
4471
4468
|
ThreeDActionButton,
|
|
4472
4469
|
{
|
|
4473
4470
|
onClick: processAction,
|
|
@@ -4475,7 +4472,7 @@ var UniversalCardActionPage = ({
|
|
|
4475
4472
|
className: "w-full"
|
|
4476
4473
|
},
|
|
4477
4474
|
"Confirm & Proceed"
|
|
4478
|
-
), /* @__PURE__ */
|
|
4475
|
+
), /* @__PURE__ */ import_react77.default.createElement(
|
|
4479
4476
|
"button",
|
|
4480
4477
|
{
|
|
4481
4478
|
disabled: isProcessing,
|
|
@@ -4483,7 +4480,7 @@ var UniversalCardActionPage = ({
|
|
|
4483
4480
|
className: "w-full flex items-center justify-center py-2.5 rounded-full border border-stone-200 text-black hover:bg-stone-50 transition-colors outline-none text-sm mt-1 disabled:opacity-50"
|
|
4484
4481
|
},
|
|
4485
4482
|
"Cancel"
|
|
4486
|
-
))))), selectedTier && intendedAction === "join_waitlist" && /* @__PURE__ */
|
|
4483
|
+
))))), selectedTier && intendedAction === "join_waitlist" && /* @__PURE__ */ import_react77.default.createElement(
|
|
4487
4484
|
ConfirmationDialog,
|
|
4488
4485
|
{
|
|
4489
4486
|
isOpen: true,
|
|
@@ -4499,9 +4496,9 @@ var UniversalCardActionPage = ({
|
|
|
4499
4496
|
};
|
|
4500
4497
|
|
|
4501
4498
|
// src/components/PinDialerBottomSheet.tsx
|
|
4502
|
-
var
|
|
4503
|
-
var
|
|
4504
|
-
var
|
|
4499
|
+
var import_react79 = __toESM(require("react"));
|
|
4500
|
+
var import_react80 = require("@hugeicons/react");
|
|
4501
|
+
var import_core_free_icons28 = require("@hugeicons/core-free-icons");
|
|
4505
4502
|
var PinDialerBottomSheet = ({
|
|
4506
4503
|
isOpen,
|
|
4507
4504
|
title = "Action Required",
|
|
@@ -4509,8 +4506,8 @@ var PinDialerBottomSheet = ({
|
|
|
4509
4506
|
onClose,
|
|
4510
4507
|
onComplete
|
|
4511
4508
|
}) => {
|
|
4512
|
-
const [pin, setPin] = (0,
|
|
4513
|
-
(0,
|
|
4509
|
+
const [pin, setPin] = (0, import_react79.useState)("");
|
|
4510
|
+
(0, import_react79.useEffect)(() => {
|
|
4514
4511
|
setPin("");
|
|
4515
4512
|
}, [isOpen]);
|
|
4516
4513
|
const handleSubmit = (e) => {
|
|
@@ -4519,7 +4516,7 @@ var PinDialerBottomSheet = ({
|
|
|
4519
4516
|
onComplete(pin);
|
|
4520
4517
|
};
|
|
4521
4518
|
if (!isOpen) return null;
|
|
4522
|
-
return /* @__PURE__ */
|
|
4519
|
+
return /* @__PURE__ */ import_react79.default.createElement("div", { className: "fixed inset-0 z-150 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react79.default.createElement(
|
|
4523
4520
|
"div",
|
|
4524
4521
|
{
|
|
4525
4522
|
className: "absolute inset-0 bg-black/40 animate-in fade-in duration-200",
|
|
@@ -4527,7 +4524,7 @@ var PinDialerBottomSheet = ({
|
|
|
4527
4524
|
if (!isVerifying) onClose();
|
|
4528
4525
|
}
|
|
4529
4526
|
}
|
|
4530
|
-
), /* @__PURE__ */
|
|
4527
|
+
), /* @__PURE__ */ import_react79.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react79.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ import_react79.default.createElement("h3", { className: "text-sm text-black tracking-tight" }, title), /* @__PURE__ */ import_react79.default.createElement(
|
|
4531
4528
|
"button",
|
|
4532
4529
|
{
|
|
4533
4530
|
onClick: () => {
|
|
@@ -4536,8 +4533,8 @@ var PinDialerBottomSheet = ({
|
|
|
4536
4533
|
disabled: isVerifying,
|
|
4537
4534
|
className: "text-stone-400 hover:text-black transition-colors outline-none disabled:opacity-50"
|
|
4538
4535
|
},
|
|
4539
|
-
/* @__PURE__ */
|
|
4540
|
-
)), /* @__PURE__ */
|
|
4536
|
+
/* @__PURE__ */ import_react79.default.createElement(import_react80.HugeiconsIcon, { icon: import_core_free_icons28.CancelCircleIcon, size: 20 })
|
|
4537
|
+
)), /* @__PURE__ */ import_react79.default.createElement("div", { className: "flex flex-col px-6 pb-6 pt-2 relative" }, /* @__PURE__ */ import_react79.default.createElement("form", { onSubmit: handleSubmit, className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react79.default.createElement(
|
|
4541
4538
|
TextInput,
|
|
4542
4539
|
{
|
|
4543
4540
|
type: "password",
|
|
@@ -4548,7 +4545,7 @@ var PinDialerBottomSheet = ({
|
|
|
4548
4545
|
onChange: (val) => setPin(val.replace(/\D/g, "").substring(0, 4)),
|
|
4549
4546
|
placeholder: "\u2022\u2022\u2022\u2022"
|
|
4550
4547
|
}
|
|
4551
|
-
), /* @__PURE__ */
|
|
4548
|
+
), /* @__PURE__ */ import_react79.default.createElement("div", { className: "pt-2" }, /* @__PURE__ */ import_react79.default.createElement(
|
|
4552
4549
|
ThreeDActionButton,
|
|
4553
4550
|
{
|
|
4554
4551
|
type: "submit",
|
|
@@ -4561,14 +4558,14 @@ var PinDialerBottomSheet = ({
|
|
|
4561
4558
|
};
|
|
4562
4559
|
|
|
4563
4560
|
// src/components/UniversalBuyCryptoPage.tsx
|
|
4564
|
-
var
|
|
4561
|
+
var import_react81 = __toESM(require("react"));
|
|
4565
4562
|
var import_react_hot_toast12 = __toESM(require("react-hot-toast"));
|
|
4566
|
-
var
|
|
4567
|
-
var
|
|
4563
|
+
var import_react82 = require("@hugeicons/react");
|
|
4564
|
+
var import_core_free_icons29 = require("@hugeicons/core-free-icons");
|
|
4568
4565
|
var CircularLogo = ({ src, alt, fallbackText }) => {
|
|
4569
|
-
const [isLoaded, setIsLoaded] = (0,
|
|
4570
|
-
const [hasError, setHasError] = (0,
|
|
4571
|
-
return /* @__PURE__ */
|
|
4566
|
+
const [isLoaded, setIsLoaded] = (0, import_react81.useState)(false);
|
|
4567
|
+
const [hasError, setHasError] = (0, import_react81.useState)(false);
|
|
4568
|
+
return /* @__PURE__ */ import_react81.default.createElement("div", { className: "relative w-5 h-5 rounded-full overflow-hidden bg-stone-100 flex items-center justify-center shrink-0" }, !hasError && src ? /* @__PURE__ */ import_react81.default.createElement(import_react81.default.Fragment, null, !isLoaded && /* @__PURE__ */ import_react81.default.createElement("div", { className: "absolute inset-0 bg-stone-200 animate-pulse" }), /* @__PURE__ */ import_react81.default.createElement(
|
|
4572
4569
|
"img",
|
|
4573
4570
|
{
|
|
4574
4571
|
src,
|
|
@@ -4577,7 +4574,7 @@ var CircularLogo = ({ src, alt, fallbackText }) => {
|
|
|
4577
4574
|
onError: () => setHasError(true),
|
|
4578
4575
|
className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}`
|
|
4579
4576
|
}
|
|
4580
|
-
)) : /* @__PURE__ */
|
|
4577
|
+
)) : /* @__PURE__ */ import_react81.default.createElement("span", { className: "text-xs text-black uppercase" }, fallbackText.substring(0, 2)));
|
|
4581
4578
|
};
|
|
4582
4579
|
var DEFAULT_NETWORK_REGEX = {
|
|
4583
4580
|
EVM: /^0x[a-fA-F0-9]{40}$/,
|
|
@@ -4617,33 +4614,33 @@ var UniversalBuyCryptoPage = ({
|
|
|
4617
4614
|
const onBackHandler = onBack ?? (() => {
|
|
4618
4615
|
if (typeof window !== "undefined") window.history.back();
|
|
4619
4616
|
});
|
|
4620
|
-
const [selectedCrypto, setSelectedCrypto] = (0,
|
|
4617
|
+
const [selectedCrypto, setSelectedCrypto] = (0, import_react81.useState)(() => {
|
|
4621
4618
|
if (defaultCryptoCode) {
|
|
4622
4619
|
const found = cryptoOptions.find((c) => c.code === defaultCryptoCode);
|
|
4623
4620
|
if (found) return found;
|
|
4624
4621
|
}
|
|
4625
4622
|
return cryptoOptions[0];
|
|
4626
4623
|
});
|
|
4627
|
-
const [selectedNetwork, setSelectedNetwork] = (0,
|
|
4624
|
+
const [selectedNetwork, setSelectedNetwork] = (0, import_react81.useState)(() => {
|
|
4628
4625
|
if (defaultNetworkId && selectedCrypto?.networks) {
|
|
4629
4626
|
const foundNet = selectedCrypto.networks.find((n) => n.id === defaultNetworkId);
|
|
4630
4627
|
if (foundNet) return foundNet;
|
|
4631
4628
|
}
|
|
4632
4629
|
return selectedCrypto?.networks?.[0] || { id: "polygon", name: "Polygon", symbol: "POLYGON" };
|
|
4633
4630
|
});
|
|
4634
|
-
const [fiatAmount, setFiatAmount] = (0,
|
|
4635
|
-
const [cryptoAmount, setCryptoAmount] = (0,
|
|
4636
|
-
const [activeSource, setActiveSource] = (0,
|
|
4637
|
-
const [isCalculating, setIsCalculating] = (0,
|
|
4638
|
-
const [rateDisplay, setRateDisplay] = (0,
|
|
4639
|
-
const [currentRateKey, setCurrentRateKey] = (0,
|
|
4640
|
-
const [recipientAddress, setRecipientAddress] = (0,
|
|
4641
|
-
const [isAddressValid, setIsAddressValid] = (0,
|
|
4642
|
-
const [isCryptoDialogOpen, setIsCryptoDialogOpen] = (0,
|
|
4643
|
-
const [isNetworkDialogOpen, setIsNetworkDialogOpen] = (0,
|
|
4644
|
-
const [isSubmitting, setIsSubmitting] = (0,
|
|
4645
|
-
const debounceTimerRef = (0,
|
|
4646
|
-
(0,
|
|
4631
|
+
const [fiatAmount, setFiatAmount] = (0, import_react81.useState)("");
|
|
4632
|
+
const [cryptoAmount, setCryptoAmount] = (0, import_react81.useState)("");
|
|
4633
|
+
const [activeSource, setActiveSource] = (0, import_react81.useState)("FIAT");
|
|
4634
|
+
const [isCalculating, setIsCalculating] = (0, import_react81.useState)(false);
|
|
4635
|
+
const [rateDisplay, setRateDisplay] = (0, import_react81.useState)(null);
|
|
4636
|
+
const [currentRateKey, setCurrentRateKey] = (0, import_react81.useState)(null);
|
|
4637
|
+
const [recipientAddress, setRecipientAddress] = (0, import_react81.useState)(defaultRecipientAddress);
|
|
4638
|
+
const [isAddressValid, setIsAddressValid] = (0, import_react81.useState)(false);
|
|
4639
|
+
const [isCryptoDialogOpen, setIsCryptoDialogOpen] = (0, import_react81.useState)(false);
|
|
4640
|
+
const [isNetworkDialogOpen, setIsNetworkDialogOpen] = (0, import_react81.useState)(false);
|
|
4641
|
+
const [isSubmitting, setIsSubmitting] = (0, import_react81.useState)(false);
|
|
4642
|
+
const debounceTimerRef = (0, import_react81.useRef)(null);
|
|
4643
|
+
(0, import_react81.useEffect)(() => {
|
|
4647
4644
|
if (selectedCrypto?.networks?.length > 0) {
|
|
4648
4645
|
const exists = selectedCrypto.networks.find((n) => n.id === selectedNetwork.id);
|
|
4649
4646
|
if (!exists) {
|
|
@@ -4651,7 +4648,7 @@ var UniversalBuyCryptoPage = ({
|
|
|
4651
4648
|
}
|
|
4652
4649
|
}
|
|
4653
4650
|
}, [selectedCrypto]);
|
|
4654
|
-
(0,
|
|
4651
|
+
(0, import_react81.useEffect)(() => {
|
|
4655
4652
|
if (!recipientAddress.trim()) {
|
|
4656
4653
|
setIsAddressValid(false);
|
|
4657
4654
|
return;
|
|
@@ -4659,7 +4656,7 @@ var UniversalBuyCryptoPage = ({
|
|
|
4659
4656
|
const valid = validateWalletAddress(recipientAddress, selectedNetwork);
|
|
4660
4657
|
setIsAddressValid(valid);
|
|
4661
4658
|
}, [recipientAddress, selectedNetwork]);
|
|
4662
|
-
const triggerRateCalculation = (0,
|
|
4659
|
+
const triggerRateCalculation = (0, import_react81.useCallback)((source, valFiat, valCrypto, currentCrypto) => {
|
|
4663
4660
|
if (debounceTimerRef.current) clearTimeout(debounceTimerRef.current);
|
|
4664
4661
|
const targetVal = source === "FIAT" ? valFiat : valCrypto;
|
|
4665
4662
|
const numericVal = parseFloat(targetVal) || 0;
|
|
@@ -4740,7 +4737,7 @@ var UniversalBuyCryptoPage = ({
|
|
|
4740
4737
|
}
|
|
4741
4738
|
};
|
|
4742
4739
|
const isButtonDisabled = isSubmitting || isCalculating || !fiatAmount || !cryptoAmount || !isAddressValid || !currentRateKey;
|
|
4743
|
-
return /* @__PURE__ */
|
|
4740
|
+
return /* @__PURE__ */ import_react81.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react81.default.createElement(ManagedToaster, null), !hideBackButton && /* @__PURE__ */ import_react81.default.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ import_react81.default.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-stone-500 hover:text-black transition-colors text-sm outline-none" }, /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: import_core_free_icons29.ArrowLeft01Icon, size: 16 }), " Back")), /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex flex-col gap-1 mb-6 px-1" }, /* @__PURE__ */ import_react81.default.createElement("h1", { className: "text-black text-xl tracking-tight" }, "Buy Crypto"), /* @__PURE__ */ import_react81.default.createElement("p", { className: "text-xs text-stone-500" }, "Purchase digital assets instantly in your local currency with direct wallet delivery.")), /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex flex-col gap-6 p-6 sm:p-8 rounded-3xl bg-white w-full " }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "relative flex flex-col gap-3" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "border border-stone-200 rounded-2xl p-4 flex items-center justify-between transition-all focus-within:border-black" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex flex-col gap-1 flex-1 pr-3 min-w-0" }, /* @__PURE__ */ import_react81.default.createElement("span", { className: "text-xs tracking-widest text-stone-400" }, "You Pay (", fiatCurrency.code, ")"), isCalculating && activeSource === "CRYPTO" ? /* @__PURE__ */ import_react81.default.createElement("div", { className: "h-7 w-32 bg-stone-100 animate-pulse rounded-md mt-1" }) : /* @__PURE__ */ import_react81.default.createElement(
|
|
4744
4741
|
"input",
|
|
4745
4742
|
{
|
|
4746
4743
|
type: "text",
|
|
@@ -4751,7 +4748,7 @@ var UniversalBuyCryptoPage = ({
|
|
|
4751
4748
|
disabled: isSubmitting,
|
|
4752
4749
|
className: "text-lg sm:text-xl text-black bg-transparent outline-none w-full placeholder-stone-300 "
|
|
4753
4750
|
}
|
|
4754
|
-
)), /* @__PURE__ */
|
|
4751
|
+
)), /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex items-center gap-2 bg-stone-50 rounded-full px-3 py-1.5 shrink-0 select-none" }, /* @__PURE__ */ import_react81.default.createElement(CircularLogo, { src: fiatCurrency.logoUrl, alt: fiatCurrency.code, fallbackText: fiatCurrency.code }), /* @__PURE__ */ import_react81.default.createElement("span", { className: "text-xs text-black" }, fiatCurrency.code))), /* @__PURE__ */ import_react81.default.createElement("div", { className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 z-10" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "w-10 h-10 rounded-full bg-white border border-stone-200 flex items-center justify-center" }, /* @__PURE__ */ import_react81.default.createElement("svg", { className: "w-4 h-4 text-black", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ import_react81.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4" })))), /* @__PURE__ */ import_react81.default.createElement("div", { className: "border border-stone-200 rounded-2xl p-4 flex items-center justify-between transition-all focus-within:border-black" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex flex-col gap-1 flex-1 pr-3 min-w-0" }, /* @__PURE__ */ import_react81.default.createElement("span", { className: "text-xs tracking-widest text-stone-400" }, "You Receive"), isCalculating && activeSource === "FIAT" ? /* @__PURE__ */ import_react81.default.createElement("div", { className: "h-7 w-32 bg-stone-100 animate-pulse rounded-md mt-1" }) : /* @__PURE__ */ import_react81.default.createElement(
|
|
4755
4752
|
"input",
|
|
4756
4753
|
{
|
|
4757
4754
|
type: "text",
|
|
@@ -4762,7 +4759,7 @@ var UniversalBuyCryptoPage = ({
|
|
|
4762
4759
|
disabled: isSubmitting,
|
|
4763
4760
|
className: "text-lg sm:text-xl text-black bg-transparent outline-none w-full placeholder-stone-300 "
|
|
4764
4761
|
}
|
|
4765
|
-
)), /* @__PURE__ */
|
|
4762
|
+
)), /* @__PURE__ */ import_react81.default.createElement(
|
|
4766
4763
|
"button",
|
|
4767
4764
|
{
|
|
4768
4765
|
type: "button",
|
|
@@ -4770,10 +4767,10 @@ var UniversalBuyCryptoPage = ({
|
|
|
4770
4767
|
disabled: isSubmitting,
|
|
4771
4768
|
className: "flex items-center gap-2 bg-stone-100 hover:bg-stone-200 transition-colors rounded-full px-1 py-1.5 shrink-0 outline-none"
|
|
4772
4769
|
},
|
|
4773
|
-
/* @__PURE__ */
|
|
4774
|
-
/* @__PURE__ */
|
|
4775
|
-
/* @__PURE__ */
|
|
4776
|
-
))), rateDisplay && /* @__PURE__ */
|
|
4770
|
+
/* @__PURE__ */ import_react81.default.createElement(CircularLogo, { src: selectedCrypto.logoUrl, alt: selectedCrypto.code, fallbackText: selectedCrypto.code }),
|
|
4771
|
+
/* @__PURE__ */ import_react81.default.createElement("span", { className: "text-xs text-black" }, selectedCrypto.code),
|
|
4772
|
+
/* @__PURE__ */ import_react81.default.createElement("svg", { className: "w-3.5 h-3.5 text-stone-500 ml-0.5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ import_react81.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }))
|
|
4773
|
+
))), rateDisplay && /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex items-center justify-between text-xs text-stone-500 px-1 -mt-2" }, /* @__PURE__ */ import_react81.default.createElement("span", null, "Exchange Rate"), /* @__PURE__ */ import_react81.default.createElement("span", { className: "text-black" }, rateDisplay)), !hideRecipientSection && /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex flex-col gap-6 pt-4 border-t border-stone-100" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "space-y-2 flex-1 w-full relative" }, /* @__PURE__ */ import_react81.default.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Network / Blockchain"), /* @__PURE__ */ import_react81.default.createElement(
|
|
4777
4774
|
"button",
|
|
4778
4775
|
{
|
|
4779
4776
|
type: "button",
|
|
@@ -4781,9 +4778,9 @@ var UniversalBuyCryptoPage = ({
|
|
|
4781
4778
|
disabled: isSubmitting || selectedCrypto?.networks?.length <= 1 || readOnlyRecipientSection,
|
|
4782
4779
|
className: `w-full px-2 py-3 text-sm bg-transparent border-b text-black transition-all outline-none flex items-center justify-between ${readOnlyRecipientSection ? "border-stone-200 cursor-default opacity-80" : "border-stone-200 hover:border-black focus:border-black"}`
|
|
4783
4780
|
},
|
|
4784
|
-
/* @__PURE__ */
|
|
4785
|
-
!readOnlyRecipientSection && selectedCrypto?.networks?.length > 1 && /* @__PURE__ */
|
|
4786
|
-
)), /* @__PURE__ */
|
|
4781
|
+
/* @__PURE__ */ import_react81.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react81.default.createElement(CircularLogo, { src: selectedNetwork.logoUrl || selectedCrypto.logoUrl, alt: selectedNetwork.name, fallbackText: selectedNetwork.symbol }), /* @__PURE__ */ import_react81.default.createElement("span", null, selectedNetwork.name)),
|
|
4782
|
+
!readOnlyRecipientSection && selectedCrypto?.networks?.length > 1 && /* @__PURE__ */ import_react81.default.createElement("svg", { className: "w-4 h-4 text-stone-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ import_react81.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }))
|
|
4783
|
+
)), /* @__PURE__ */ import_react81.default.createElement(
|
|
4787
4784
|
TextInput,
|
|
4788
4785
|
{
|
|
4789
4786
|
label: "Recipient Wallet Address",
|
|
@@ -4794,7 +4791,7 @@ var UniversalBuyCryptoPage = ({
|
|
|
4794
4791
|
disabled: isSubmitting || readOnlyRecipientSection,
|
|
4795
4792
|
readOnly: readOnlyRecipientSection
|
|
4796
4793
|
}
|
|
4797
|
-
)), /* @__PURE__ */
|
|
4794
|
+
)), /* @__PURE__ */ import_react81.default.createElement("div", { className: "mt-4" }, /* @__PURE__ */ import_react81.default.createElement(
|
|
4798
4795
|
ThreeDActionButton,
|
|
4799
4796
|
{
|
|
4800
4797
|
type: "button",
|
|
@@ -4806,22 +4803,22 @@ var UniversalBuyCryptoPage = ({
|
|
|
4806
4803
|
"Buy ",
|
|
4807
4804
|
selectedCrypto.code,
|
|
4808
4805
|
" Now"
|
|
4809
|
-
))), isCryptoDialogOpen && /* @__PURE__ */
|
|
4806
|
+
))), isCryptoDialogOpen && /* @__PURE__ */ import_react81.default.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/40" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "absolute inset-0", onClick: () => setIsCryptoDialogOpen(false) }), /* @__PURE__ */ import_react81.default.createElement("div", { className: "w-full max-w-sm bg-white rounded-2xl shadow-2xl overflow-hidden relative z-10 animate-in fade-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react81.default.createElement("button", { onClick: () => setIsCryptoDialogOpen(false), className: "absolute top-4 right-4 p-2 text-stone-700 hover:text-stone-400 transition-colors outline-none" }, /* @__PURE__ */ import_react81.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ import_react81.default.createElement("path", { d: "M18 6 6 18" }), /* @__PURE__ */ import_react81.default.createElement("path", { d: "m6 6 12 12" }))), /* @__PURE__ */ import_react81.default.createElement("div", { className: "p-6 sm:p-8" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "mb-6 mt-2" }, /* @__PURE__ */ import_react81.default.createElement("h2", { className: "text-xl text-black tracking-tight mb-2" }, "Select Cryptocurrency"), /* @__PURE__ */ import_react81.default.createElement("p", { className: "text-sm text-stone-500 leading-relaxed" }, "Choose the digital asset you want to purchase.")), /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex flex-col gap-2 max-h-72 overflow-y-auto custom-scrollbar pr-1" }, cryptoOptions.map((c) => {
|
|
4810
4807
|
const isSelected = c.code === selectedCrypto.code;
|
|
4811
|
-
return /* @__PURE__ */
|
|
4808
|
+
return /* @__PURE__ */ import_react81.default.createElement(
|
|
4812
4809
|
"button",
|
|
4813
4810
|
{
|
|
4814
4811
|
key: c.code,
|
|
4815
4812
|
onClick: () => handleCryptoSelect(c),
|
|
4816
4813
|
className: `flex items-center gap-4 p-3 rounded-full hover:bg-stone-50 transition-colors text-left outline-none border ${isSelected ? "border-black bg-stone-50/50" : "border-transparent"}`
|
|
4817
4814
|
},
|
|
4818
|
-
/* @__PURE__ */
|
|
4819
|
-
/* @__PURE__ */
|
|
4820
|
-
isSelected && /* @__PURE__ */
|
|
4815
|
+
/* @__PURE__ */ import_react81.default.createElement(CircularLogo, { src: c.logoUrl, alt: c.name, fallbackText: c.code }),
|
|
4816
|
+
/* @__PURE__ */ import_react81.default.createElement("div", { className: "flex flex-col flex-1 min-w-0" }, /* @__PURE__ */ import_react81.default.createElement("span", { className: "text-xs text-black truncate" }, c.name), /* @__PURE__ */ import_react81.default.createElement("span", { className: "text-xs text-stone-400" }, c.code)),
|
|
4817
|
+
isSelected && /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: import_core_free_icons29.CheckmarkCircle02Icon, size: 16, className: "text-black" })
|
|
4821
4818
|
);
|
|
4822
|
-
}))))), isNetworkDialogOpen && /* @__PURE__ */
|
|
4819
|
+
}))))), isNetworkDialogOpen && /* @__PURE__ */ import_react81.default.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/40" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "absolute inset-0", onClick: () => setIsNetworkDialogOpen(false) }), /* @__PURE__ */ import_react81.default.createElement("div", { className: "w-full max-w-sm bg-white rounded-2xl shadow-2xl overflow-hidden relative z-10 animate-in fade-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react81.default.createElement("button", { onClick: () => setIsNetworkDialogOpen(false), className: "absolute top-4 right-4 p-2 text-stone-700 hover:text-stone-400 transition-colors outline-none" }, /* @__PURE__ */ import_react81.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ import_react81.default.createElement("path", { d: "M18 6 6 18" }), /* @__PURE__ */ import_react81.default.createElement("path", { d: "m6 6 12 12" }))), /* @__PURE__ */ import_react81.default.createElement("div", { className: "p-6 sm:p-8" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "mb-6 mt-2" }, /* @__PURE__ */ import_react81.default.createElement("h2", { className: "text-xl text-black tracking-tight mb-2" }, "Select Network"), /* @__PURE__ */ import_react81.default.createElement("p", { className: "text-sm text-stone-500 leading-relaxed" }, "Ensure your receiving wallet supports this network.")), /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex flex-col gap-2 max-h-72 overflow-y-auto custom-scrollbar pr-1" }, selectedCrypto?.networks?.map((net) => {
|
|
4823
4820
|
const isSelected = net.id === selectedNetwork.id;
|
|
4824
|
-
return /* @__PURE__ */
|
|
4821
|
+
return /* @__PURE__ */ import_react81.default.createElement(
|
|
4825
4822
|
"button",
|
|
4826
4823
|
{
|
|
4827
4824
|
key: net.id,
|
|
@@ -4831,20 +4828,20 @@ var UniversalBuyCryptoPage = ({
|
|
|
4831
4828
|
},
|
|
4832
4829
|
className: `flex items-center gap-4 p-3 rounded-full hover:bg-stone-50 transition-colors text-left outline-none border ${isSelected ? "border-black bg-stone-50/50" : "border-transparent"}`
|
|
4833
4830
|
},
|
|
4834
|
-
/* @__PURE__ */
|
|
4835
|
-
/* @__PURE__ */
|
|
4836
|
-
isSelected && /* @__PURE__ */
|
|
4831
|
+
/* @__PURE__ */ import_react81.default.createElement(CircularLogo, { src: net.logoUrl || selectedCrypto.logoUrl, alt: net.name, fallbackText: net.symbol }),
|
|
4832
|
+
/* @__PURE__ */ import_react81.default.createElement("div", { className: "flex flex-col flex-1 min-w-0" }, /* @__PURE__ */ import_react81.default.createElement("span", { className: "text-xs text-black truncate" }, net.name), /* @__PURE__ */ import_react81.default.createElement("span", { className: "text-xs text-stone-400" }, net.symbol)),
|
|
4833
|
+
isSelected && /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: import_core_free_icons29.CheckmarkCircle02Icon, size: 16, className: "text-black" })
|
|
4837
4834
|
);
|
|
4838
4835
|
}))))));
|
|
4839
4836
|
};
|
|
4840
4837
|
|
|
4841
4838
|
// src/components/UniversalHuddlesPage.tsx
|
|
4842
|
-
var
|
|
4843
|
-
var
|
|
4844
|
-
var
|
|
4839
|
+
var import_react83 = __toESM(require("react"));
|
|
4840
|
+
var import_react84 = require("@hugeicons/react");
|
|
4841
|
+
var import_core_free_icons30 = require("@hugeicons/core-free-icons");
|
|
4845
4842
|
var HuddleAvatar = ({ src, status, sizeClass = "w-10 h-10" }) => {
|
|
4846
|
-
const [loaded, setLoaded] = (0,
|
|
4847
|
-
const [error, setError] = (0,
|
|
4843
|
+
const [loaded, setLoaded] = (0, import_react83.useState)(false);
|
|
4844
|
+
const [error, setError] = (0, import_react83.useState)(false);
|
|
4848
4845
|
const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/default_a.avif";
|
|
4849
4846
|
const finalSrc = error || !src ? defaultAvatar : src;
|
|
4850
4847
|
const getStatusColor = () => {
|
|
@@ -4861,7 +4858,7 @@ var HuddleAvatar = ({ src, status, sizeClass = "w-10 h-10" }) => {
|
|
|
4861
4858
|
return "bg-stone-200";
|
|
4862
4859
|
}
|
|
4863
4860
|
};
|
|
4864
|
-
return /* @__PURE__ */
|
|
4861
|
+
return /* @__PURE__ */ import_react83.default.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "w-full h-full rounded-lg bg-stone-100 flex items-center justify-center overflow-hidden" }, !loaded && !error && /* @__PURE__ */ import_react83.default.createElement(import_react84.HugeiconsIcon, { icon: import_core_free_icons30.Loading03Icon, className: "animate-spin text-stone-400 absolute", size: 14 }), /* @__PURE__ */ import_react83.default.createElement(
|
|
4865
4862
|
"img",
|
|
4866
4863
|
{
|
|
4867
4864
|
src: finalSrc,
|
|
@@ -4870,9 +4867,9 @@ var HuddleAvatar = ({ src, status, sizeClass = "w-10 h-10" }) => {
|
|
|
4870
4867
|
onLoad: () => setLoaded(true),
|
|
4871
4868
|
onError: () => setError(true)
|
|
4872
4869
|
}
|
|
4873
|
-
)), /* @__PURE__ */
|
|
4870
|
+
)), /* @__PURE__ */ import_react83.default.createElement("div", { className: `absolute -bottom-1 -right-1 w-3.5 h-3.5 rounded-full border-2 border-white z-10 ${getStatusColor()}` }));
|
|
4874
4871
|
};
|
|
4875
|
-
var PageSpinner6 = () => /* @__PURE__ */
|
|
4872
|
+
var PageSpinner6 = () => /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ import_react83.default.createElement(import_react84.HugeiconsIcon, { icon: import_core_free_icons30.Loading03Icon, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
4876
4873
|
var UniversalHuddlesPage = ({
|
|
4877
4874
|
headerTitle,
|
|
4878
4875
|
headerDescription,
|
|
@@ -4884,50 +4881,50 @@ var UniversalHuddlesPage = ({
|
|
|
4884
4881
|
onHuddleClick,
|
|
4885
4882
|
onCreateHuddle
|
|
4886
4883
|
}) => {
|
|
4887
|
-
return /* @__PURE__ */
|
|
4884
|
+
return /* @__PURE__ */ import_react83.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 relative" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-row items-center justify-between gap-4" }, /* @__PURE__ */ import_react83.default.createElement("h2", { className: "text-black text-xl tracking-tight" }, headerTitle), /* @__PURE__ */ import_react83.default.createElement(
|
|
4888
4885
|
"button",
|
|
4889
4886
|
{
|
|
4890
4887
|
onClick: () => onCreateHuddle?.(),
|
|
4891
4888
|
className: "shrink-0 px-4 py-1.5 border border-stone-200 text-black text-xs tracking-wide rounded-full hover:bg-stone-50 transition-colors outline-none"
|
|
4892
4889
|
},
|
|
4893
4890
|
"Create new"
|
|
4894
|
-
)), headerDescription && /* @__PURE__ */
|
|
4891
|
+
)), headerDescription && /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-xs text-stone-500" }, headerDescription)), /* @__PURE__ */ import_react83.default.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ import_react83.default.createElement(PageSpinner6, null) : /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react83.default.createElement("div", null, huddles.length === 0 ? /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-xs text-stone-400 py-6 text-center" }, "No huddles available") : huddles.map((huddle) => /* @__PURE__ */ import_react83.default.createElement(
|
|
4895
4892
|
"div",
|
|
4896
4893
|
{
|
|
4897
4894
|
key: huddle.id,
|
|
4898
4895
|
onClick: () => onHuddleClick(huddle.id),
|
|
4899
4896
|
className: "flex flex-row items-center gap-4 py-2 hover:bg-stone-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl"
|
|
4900
4897
|
},
|
|
4901
|
-
/* @__PURE__ */
|
|
4902
|
-
/* @__PURE__ */
|
|
4903
|
-
/* @__PURE__ */
|
|
4904
|
-
))), /* @__PURE__ */
|
|
4898
|
+
/* @__PURE__ */ import_react83.default.createElement(HuddleAvatar, { src: huddle.imageUrl, status: huddle.status }),
|
|
4899
|
+
/* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col min-w-0 flex-1" }, /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-sm text-black tracking-tight truncate" }, huddle.name), /* @__PURE__ */ import_react83.default.createElement("span", { className: "text-xs text-stone-500 truncate block mt-0.5" }, huddle.timeString)),
|
|
4900
|
+
/* @__PURE__ */ import_react83.default.createElement(import_react84.HugeiconsIcon, { icon: import_core_free_icons30.ArrowRight01Icon, size: 14, className: "shrink-0 text-stone-400" })
|
|
4901
|
+
))), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ import_react83.default.createElement("span", { className: "text-xs text-stone-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages === 0 ? 1 : totalPages), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react83.default.createElement(
|
|
4905
4902
|
"button",
|
|
4906
4903
|
{
|
|
4907
4904
|
onClick: () => onPageChange(currentPage - 1),
|
|
4908
4905
|
disabled: currentPage <= 1 || isLoading,
|
|
4909
4906
|
className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
4910
4907
|
},
|
|
4911
|
-
/* @__PURE__ */
|
|
4912
|
-
), /* @__PURE__ */
|
|
4908
|
+
/* @__PURE__ */ import_react83.default.createElement(import_react84.HugeiconsIcon, { icon: import_core_free_icons30.ArrowLeft01Icon, size: 14 })
|
|
4909
|
+
), /* @__PURE__ */ import_react83.default.createElement(
|
|
4913
4910
|
"button",
|
|
4914
4911
|
{
|
|
4915
4912
|
onClick: () => onPageChange(currentPage + 1),
|
|
4916
4913
|
disabled: currentPage >= totalPages || isLoading || totalPages === 0,
|
|
4917
4914
|
className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
4918
4915
|
},
|
|
4919
|
-
/* @__PURE__ */
|
|
4916
|
+
/* @__PURE__ */ import_react83.default.createElement(import_react84.HugeiconsIcon, { icon: import_core_free_icons30.ArrowRight01Icon, size: 14 })
|
|
4920
4917
|
)))))));
|
|
4921
4918
|
};
|
|
4922
4919
|
|
|
4923
4920
|
// src/components/UniversalMembersPage.tsx
|
|
4924
|
-
var
|
|
4925
|
-
var
|
|
4921
|
+
var import_react85 = __toESM(require("react"));
|
|
4922
|
+
var import_react86 = require("@hugeicons/react");
|
|
4926
4923
|
var import_react_hot_toast13 = __toESM(require("react-hot-toast"));
|
|
4927
|
-
var
|
|
4924
|
+
var import_core_free_icons31 = require("@hugeicons/core-free-icons");
|
|
4928
4925
|
var MemberAvatar2 = ({ src, status }) => {
|
|
4929
|
-
const [loaded, setLoaded] = (0,
|
|
4930
|
-
const [error, setError] = (0,
|
|
4926
|
+
const [loaded, setLoaded] = (0, import_react85.useState)(false);
|
|
4927
|
+
const [error, setError] = (0, import_react85.useState)(false);
|
|
4931
4928
|
const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/avatar.avif";
|
|
4932
4929
|
const finalSrc = error || !src ? defaultAvatar : src;
|
|
4933
4930
|
const getStatusColor = () => {
|
|
@@ -4944,7 +4941,7 @@ var MemberAvatar2 = ({ src, status }) => {
|
|
|
4944
4941
|
return "bg-stone-200";
|
|
4945
4942
|
}
|
|
4946
4943
|
};
|
|
4947
|
-
return /* @__PURE__ */
|
|
4944
|
+
return /* @__PURE__ */ import_react85.default.createElement("div", { className: "relative w-10 h-10 shrink-0" }, /* @__PURE__ */ import_react85.default.createElement("div", { className: "w-full h-full rounded-lg bg-stone-100 flex items-center justify-center overflow-hidden" }, !loaded && !error && /* @__PURE__ */ import_react85.default.createElement(import_react86.HugeiconsIcon, { icon: import_core_free_icons31.Loading03Icon, className: "animate-spin text-stone-400 absolute", size: 14 }), /* @__PURE__ */ import_react85.default.createElement(
|
|
4948
4945
|
"img",
|
|
4949
4946
|
{
|
|
4950
4947
|
src: finalSrc,
|
|
@@ -4953,9 +4950,9 @@ var MemberAvatar2 = ({ src, status }) => {
|
|
|
4953
4950
|
onLoad: () => setLoaded(true),
|
|
4954
4951
|
onError: () => setError(true)
|
|
4955
4952
|
}
|
|
4956
|
-
)), /* @__PURE__ */
|
|
4953
|
+
)), /* @__PURE__ */ import_react85.default.createElement("div", { className: `absolute -bottom-1 -right-1 w-2.5 h-2.5 rounded-full border-2 border-white z-10 ${getStatusColor()}` }));
|
|
4957
4954
|
};
|
|
4958
|
-
var PageSpinner7 = () => /* @__PURE__ */
|
|
4955
|
+
var PageSpinner7 = () => /* @__PURE__ */ import_react85.default.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ import_react85.default.createElement(import_react86.HugeiconsIcon, { icon: import_core_free_icons31.Loading03Icon, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
4959
4956
|
var UniversalMembersPage = ({
|
|
4960
4957
|
headerTitle,
|
|
4961
4958
|
headerDescription,
|
|
@@ -4975,20 +4972,20 @@ var UniversalMembersPage = ({
|
|
|
4975
4972
|
onRemoveMember,
|
|
4976
4973
|
onInviteMember
|
|
4977
4974
|
}) => {
|
|
4978
|
-
const [expandedId, setExpandedId] = (0,
|
|
4979
|
-
const [memberToRemove, setMemberToRemove] = (0,
|
|
4980
|
-
const [isRemoving, setIsRemoving] = (0,
|
|
4981
|
-
const [isInviteMode, setIsInviteMode] = (0,
|
|
4982
|
-
const [inviteEmail, setInviteEmail] = (0,
|
|
4983
|
-
const [isInviting, setIsInviting] = (0,
|
|
4984
|
-
const [localSearchQuery, setLocalSearchQuery] = (0,
|
|
4985
|
-
const [isTyping, setIsTyping] = (0,
|
|
4986
|
-
const [isStatusModalOpen, setIsStatusModalOpen] = (0,
|
|
4987
|
-
const [isRoleModalOpen, setIsRoleModalOpen] = (0,
|
|
4988
|
-
const statusDropdownRef = (0,
|
|
4989
|
-
const roleDropdownRef = (0,
|
|
4975
|
+
const [expandedId, setExpandedId] = (0, import_react85.useState)(null);
|
|
4976
|
+
const [memberToRemove, setMemberToRemove] = (0, import_react85.useState)(null);
|
|
4977
|
+
const [isRemoving, setIsRemoving] = (0, import_react85.useState)(false);
|
|
4978
|
+
const [isInviteMode, setIsInviteMode] = (0, import_react85.useState)(false);
|
|
4979
|
+
const [inviteEmail, setInviteEmail] = (0, import_react85.useState)("");
|
|
4980
|
+
const [isInviting, setIsInviting] = (0, import_react85.useState)(false);
|
|
4981
|
+
const [localSearchQuery, setLocalSearchQuery] = (0, import_react85.useState)(searchQuery);
|
|
4982
|
+
const [isTyping, setIsTyping] = (0, import_react85.useState)(false);
|
|
4983
|
+
const [isStatusModalOpen, setIsStatusModalOpen] = (0, import_react85.useState)(false);
|
|
4984
|
+
const [isRoleModalOpen, setIsRoleModalOpen] = (0, import_react85.useState)(false);
|
|
4985
|
+
const statusDropdownRef = (0, import_react85.useRef)(null);
|
|
4986
|
+
const roleDropdownRef = (0, import_react85.useRef)(null);
|
|
4990
4987
|
const cleanEmailId = (val) => val.toLowerCase().replace(/[^a-z0-9@._-]/g, "");
|
|
4991
|
-
(0,
|
|
4988
|
+
(0, import_react85.useEffect)(() => {
|
|
4992
4989
|
function handleClickOutside(event) {
|
|
4993
4990
|
if (statusDropdownRef.current && !statusDropdownRef.current.contains(event.target)) {
|
|
4994
4991
|
setIsStatusModalOpen(false);
|
|
@@ -5000,7 +4997,7 @@ var UniversalMembersPage = ({
|
|
|
5000
4997
|
document.addEventListener("mousedown", handleClickOutside);
|
|
5001
4998
|
return () => document.removeEventListener("mousedown", handleClickOutside);
|
|
5002
4999
|
}, []);
|
|
5003
|
-
(0,
|
|
5000
|
+
(0, import_react85.useEffect)(() => {
|
|
5004
5001
|
setIsTyping(true);
|
|
5005
5002
|
const handler = setTimeout(() => {
|
|
5006
5003
|
onSearchChange(localSearchQuery);
|
|
@@ -5008,7 +5005,7 @@ var UniversalMembersPage = ({
|
|
|
5008
5005
|
}, 600);
|
|
5009
5006
|
return () => clearTimeout(handler);
|
|
5010
5007
|
}, [localSearchQuery, onSearchChange]);
|
|
5011
|
-
(0,
|
|
5008
|
+
(0, import_react85.useEffect)(() => {
|
|
5012
5009
|
if (searchQuery === "" && localSearchQuery !== "") {
|
|
5013
5010
|
setLocalSearchQuery("");
|
|
5014
5011
|
}
|
|
@@ -5042,7 +5039,7 @@ var UniversalMembersPage = ({
|
|
|
5042
5039
|
}
|
|
5043
5040
|
};
|
|
5044
5041
|
const isListLoading = isLoading || isTyping;
|
|
5045
|
-
return /* @__PURE__ */
|
|
5042
|
+
return /* @__PURE__ */ import_react85.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react85.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react85.default.createElement(
|
|
5046
5043
|
ConfirmationDialog,
|
|
5047
5044
|
{
|
|
5048
5045
|
isOpen: !!memberToRemove,
|
|
@@ -5055,7 +5052,7 @@ var UniversalMembersPage = ({
|
|
|
5055
5052
|
onClose: () => setMemberToRemove(null),
|
|
5056
5053
|
onConfirm: handleConfirmRemove
|
|
5057
5054
|
}
|
|
5058
|
-
), !isInviteMode && /* @__PURE__ */
|
|
5055
|
+
), !isInviteMode && /* @__PURE__ */ import_react85.default.createElement("div", { className: "flex flex-row flex-nowrap mb-4 items-center justify-between gap-4 w-full animate-in fade-in duration-300" }, /* @__PURE__ */ import_react85.default.createElement("div", { className: "relative flex-1 min-w-0 max-w-full" }, /* @__PURE__ */ import_react85.default.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ import_react85.default.createElement(import_react86.HugeiconsIcon, { icon: import_core_free_icons31.Search01Icon, size: 16, className: "text-stone-400" })), /* @__PURE__ */ import_react85.default.createElement(
|
|
5059
5056
|
"input",
|
|
5060
5057
|
{
|
|
5061
5058
|
type: "text",
|
|
@@ -5064,28 +5061,28 @@ var UniversalMembersPage = ({
|
|
|
5064
5061
|
onChange: (e) => setLocalSearchQuery(e.target.value),
|
|
5065
5062
|
className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-sm text-black placeholder-stone-400 outline-none transition-colors focus:border-black"
|
|
5066
5063
|
}
|
|
5067
|
-
)), /* @__PURE__ */
|
|
5064
|
+
)), /* @__PURE__ */ import_react85.default.createElement("div", { className: "flex items-center gap-3 w-auto pb-0 shrink-0" }, /* @__PURE__ */ import_react85.default.createElement(
|
|
5068
5065
|
"button",
|
|
5069
5066
|
{
|
|
5070
5067
|
onClick: () => setIsStatusModalOpen(true),
|
|
5071
5068
|
className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-stone-500 hover:text-black transition-colors outline-none"
|
|
5072
5069
|
},
|
|
5073
|
-
/* @__PURE__ */
|
|
5074
|
-
), /* @__PURE__ */
|
|
5070
|
+
/* @__PURE__ */ import_react85.default.createElement(import_react86.HugeiconsIcon, { icon: import_core_free_icons31.SearchList02Icon, size: 16 })
|
|
5071
|
+
), /* @__PURE__ */ import_react85.default.createElement(
|
|
5075
5072
|
"button",
|
|
5076
5073
|
{
|
|
5077
5074
|
onClick: () => setIsRoleModalOpen(true),
|
|
5078
5075
|
className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-stone-500 hover:text-black transition-colors outline-none"
|
|
5079
5076
|
},
|
|
5080
|
-
/* @__PURE__ */
|
|
5081
|
-
))), /* @__PURE__ */
|
|
5077
|
+
/* @__PURE__ */ import_react85.default.createElement(import_react86.HugeiconsIcon, { icon: import_core_free_icons31.ListSettingIcon, size: 16 })
|
|
5078
|
+
))), /* @__PURE__ */ import_react85.default.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ import_react85.default.createElement("div", { className: "flex flex-row items-start justify-between gap-4" }, /* @__PURE__ */ import_react85.default.createElement("div", null, /* @__PURE__ */ import_react85.default.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, isInviteMode ? "Add Member" : headerTitle), headerDescription && !isInviteMode && /* @__PURE__ */ import_react85.default.createElement("p", { className: "text-xs text-stone-500" }, headerDescription)), !isInviteMode && /* @__PURE__ */ import_react85.default.createElement(
|
|
5082
5079
|
"button",
|
|
5083
5080
|
{
|
|
5084
5081
|
onClick: () => setIsInviteMode(true),
|
|
5085
5082
|
className: "shrink-0 px-4 py-2 border border-stone-200 text-black text-xs tracking-wide rounded-full hover:bg-stone-50 transition-colors outline-none"
|
|
5086
5083
|
},
|
|
5087
5084
|
"Invite Team"
|
|
5088
|
-
)), /* @__PURE__ */
|
|
5085
|
+
)), /* @__PURE__ */ import_react85.default.createElement("div", { className: "w-full overflow-hidden" }, isInviteMode ? /* @__PURE__ */ import_react85.default.createElement("form", { onSubmit: handleInviteSubmit, className: "flex flex-col gap-8 animate-in fade-in duration-300" }, /* @__PURE__ */ import_react85.default.createElement("div", { className: "space-y-1.5 mt-2" }, /* @__PURE__ */ import_react85.default.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Email Address"), /* @__PURE__ */ import_react85.default.createElement(
|
|
5089
5086
|
"input",
|
|
5090
5087
|
{
|
|
5091
5088
|
type: "email",
|
|
@@ -5096,7 +5093,7 @@ var UniversalMembersPage = ({
|
|
|
5096
5093
|
className: "w-full px-2 py-3 bg-transparent text-sm border-b border-stone-200 text-black outline-none focus:border-black transition-all duration-300",
|
|
5097
5094
|
placeholder: "name@company.com"
|
|
5098
5095
|
}
|
|
5099
|
-
)), /* @__PURE__ */
|
|
5096
|
+
)), /* @__PURE__ */ import_react85.default.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ import_react85.default.createElement(
|
|
5100
5097
|
ThreeDActionButton,
|
|
5101
5098
|
{
|
|
5102
5099
|
type: "submit",
|
|
@@ -5105,7 +5102,7 @@ var UniversalMembersPage = ({
|
|
|
5105
5102
|
className: "w-full"
|
|
5106
5103
|
},
|
|
5107
5104
|
"Send Invitation"
|
|
5108
|
-
), /* @__PURE__ */
|
|
5105
|
+
), /* @__PURE__ */ import_react85.default.createElement(
|
|
5109
5106
|
"button",
|
|
5110
5107
|
{
|
|
5111
5108
|
type: "button",
|
|
@@ -5117,44 +5114,44 @@ var UniversalMembersPage = ({
|
|
|
5117
5114
|
className: "w-full flex items-center justify-center py-2.5 rounded-full border border-stone-200 text-black hover:bg-stone-50 transition-colors outline-none text-xs tracking-wide"
|
|
5118
5115
|
},
|
|
5119
5116
|
"Cancel"
|
|
5120
|
-
))) : isListLoading ? /* @__PURE__ */
|
|
5117
|
+
))) : isListLoading ? /* @__PURE__ */ import_react85.default.createElement(PageSpinner7, null) : /* @__PURE__ */ import_react85.default.createElement("div", { className: "flex flex-col min-w-0 animate-in fade-in duration-300" }, /* @__PURE__ */ import_react85.default.createElement("div", null, members.length === 0 ? /* @__PURE__ */ import_react85.default.createElement("p", { className: "text-xs text-stone-400 py-6 text-center" }, "No members found") : members.map((member) => /* @__PURE__ */ import_react85.default.createElement(import_react85.default.Fragment, { key: member.id }, expandedId === member.id ? /* @__PURE__ */ import_react85.default.createElement("div", { className: "flex flex-col p-5 bg-stone-50 rounded-xl animate-in fade-in zoom-in-95 duration-200 gap-5 my-2" }, /* @__PURE__ */ import_react85.default.createElement("div", { className: "flex items-center gap-4" }, /* @__PURE__ */ import_react85.default.createElement(MemberAvatar2, { src: member.avatarUrl, status: member.status }), /* @__PURE__ */ import_react85.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react85.default.createElement("span", { className: "text-sm text-black tracking-tight truncate" }, member.name), /* @__PURE__ */ import_react85.default.createElement("span", { className: "text-xs text-stone-500 capitalize" }, member.role.toLowerCase()))), member.departmentName && /* @__PURE__ */ import_react85.default.createElement("div", { className: "pt-3 border-t border-stone-200" }, /* @__PURE__ */ import_react85.default.createElement("span", { className: "text-xs tracking-[0.2em] text-stone-400 block mb-1" }, "Department"), /* @__PURE__ */ import_react85.default.createElement("span", { className: "text-sm text-black truncate block" }, member.departmentName)), /* @__PURE__ */ import_react85.default.createElement("div", { className: "flex gap-3 pt-2" }, !hideAction && /* @__PURE__ */ import_react85.default.createElement(
|
|
5121
5118
|
"button",
|
|
5122
5119
|
{
|
|
5123
5120
|
onClick: () => setMemberToRemove(member),
|
|
5124
5121
|
className: "flex-1 py-2.5 bg-white border border-rose-200 text-rose-600 hover:bg-rose-50 rounded-full text-xs tracking-wide transition-colors outline-none"
|
|
5125
5122
|
},
|
|
5126
5123
|
actionButtonText
|
|
5127
|
-
), /* @__PURE__ */
|
|
5124
|
+
), /* @__PURE__ */ import_react85.default.createElement(
|
|
5128
5125
|
"button",
|
|
5129
5126
|
{
|
|
5130
5127
|
onClick: () => setExpandedId(null),
|
|
5131
5128
|
className: "flex-1 py-2.5 bg-white border border-stone-200 text-black hover:bg-stone-100 rounded-full text-xs tracking-wide transition-colors outline-none"
|
|
5132
5129
|
},
|
|
5133
5130
|
"Close"
|
|
5134
|
-
))) : /* @__PURE__ */
|
|
5131
|
+
))) : /* @__PURE__ */ import_react85.default.createElement(
|
|
5135
5132
|
"div",
|
|
5136
5133
|
{
|
|
5137
5134
|
onClick: () => setExpandedId(member.id),
|
|
5138
5135
|
className: "flex items-center justify-between py-3 hover:bg-stone-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl"
|
|
5139
5136
|
},
|
|
5140
|
-
/* @__PURE__ */
|
|
5141
|
-
)))), /* @__PURE__ */
|
|
5137
|
+
/* @__PURE__ */ import_react85.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react85.default.createElement(MemberAvatar2, { src: member.avatarUrl, status: member.status }), /* @__PURE__ */ import_react85.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-0.5" }, /* @__PURE__ */ import_react85.default.createElement("p", { className: "text-sm text-black truncate" }, member.name), /* @__PURE__ */ import_react85.default.createElement("p", { className: "text-xs text-stone-500 capitalize truncate" }, member.role.toLowerCase())))
|
|
5138
|
+
)))), /* @__PURE__ */ import_react85.default.createElement("div", { className: "flex items-center justify-between pt-6 mt-2" }, /* @__PURE__ */ import_react85.default.createElement("span", { className: "text-xs text-stone-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages === 0 ? 1 : totalPages), /* @__PURE__ */ import_react85.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react85.default.createElement(
|
|
5142
5139
|
"button",
|
|
5143
5140
|
{
|
|
5144
5141
|
onClick: () => onPageChange(currentPage - 1),
|
|
5145
5142
|
disabled: currentPage <= 1 || isListLoading,
|
|
5146
5143
|
className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
5147
5144
|
},
|
|
5148
|
-
/* @__PURE__ */
|
|
5149
|
-
), /* @__PURE__ */
|
|
5145
|
+
/* @__PURE__ */ import_react85.default.createElement(import_react86.HugeiconsIcon, { icon: import_core_free_icons31.ArrowLeft01Icon, size: 14 })
|
|
5146
|
+
), /* @__PURE__ */ import_react85.default.createElement(
|
|
5150
5147
|
"button",
|
|
5151
5148
|
{
|
|
5152
5149
|
onClick: () => onPageChange(currentPage + 1),
|
|
5153
5150
|
disabled: currentPage >= totalPages || isListLoading || totalPages === 0,
|
|
5154
5151
|
className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
5155
5152
|
},
|
|
5156
|
-
/* @__PURE__ */
|
|
5157
|
-
)))))), isStatusModalOpen && /* @__PURE__ */
|
|
5153
|
+
/* @__PURE__ */ import_react85.default.createElement(import_react86.HugeiconsIcon, { icon: import_core_free_icons31.ArrowRight01Icon, size: 14 })
|
|
5154
|
+
)))))), isStatusModalOpen && /* @__PURE__ */ import_react85.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ import_react85.default.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => setIsStatusModalOpen(false) }), /* @__PURE__ */ import_react85.default.createElement("div", { ref: statusDropdownRef, className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react85.default.createElement("div", { className: "p-6 text-center w-full mb-2" }, /* @__PURE__ */ import_react85.default.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Status Filter")), /* @__PURE__ */ import_react85.default.createElement("div", { className: "w-full flex flex-col pl-2 pr-2 gap-1" }, ["ALL", "ACTIVE", "BUSY", "OFFLINE", "AWAY"].map((option) => /* @__PURE__ */ import_react85.default.createElement(
|
|
5158
5155
|
"button",
|
|
5159
5156
|
{
|
|
5160
5157
|
key: option,
|
|
@@ -5164,8 +5161,8 @@ var UniversalMembersPage = ({
|
|
|
5164
5161
|
},
|
|
5165
5162
|
className: `text-left px-4 py-3 text-xs tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${activeStatusFilter === option ? "bg-stone-100 text-black" : "text-stone-500 hover:bg-stone-50 hover:text-black"}`
|
|
5166
5163
|
},
|
|
5167
|
-
/* @__PURE__ */
|
|
5168
|
-
))), /* @__PURE__ */
|
|
5164
|
+
/* @__PURE__ */ import_react85.default.createElement("span", { className: "truncate pr-2 capitalize" }, option.toLowerCase())
|
|
5165
|
+
))), /* @__PURE__ */ import_react85.default.createElement("div", { className: "w-full flex mt-2" }, /* @__PURE__ */ import_react85.default.createElement("button", { onClick: () => setIsStatusModalOpen(false), className: "w-full py-4 text-sm text-stone-500 hover:text-black transition-colors outline-none" }, "Cancel")))), isRoleModalOpen && /* @__PURE__ */ import_react85.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ import_react85.default.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => setIsRoleModalOpen(false) }), /* @__PURE__ */ import_react85.default.createElement("div", { ref: roleDropdownRef, className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react85.default.createElement("div", { className: "p-6 text-center w-full mb-2" }, /* @__PURE__ */ import_react85.default.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Role Filter")), /* @__PURE__ */ import_react85.default.createElement("div", { className: "w-full flex flex-col pl-2 pr-2 gap-1" }, ["ALL", "ADMIN", "MANAGER", "MEMBER", "GUEST"].map((option) => /* @__PURE__ */ import_react85.default.createElement(
|
|
5169
5166
|
"button",
|
|
5170
5167
|
{
|
|
5171
5168
|
key: option,
|
|
@@ -5175,22 +5172,22 @@ var UniversalMembersPage = ({
|
|
|
5175
5172
|
},
|
|
5176
5173
|
className: `text-left px-4 py-3 text-xs tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${activeRoleFilter === option ? "bg-stone-100 text-black" : "text-stone-500 hover:bg-stone-50 hover:text-black"}`
|
|
5177
5174
|
},
|
|
5178
|
-
/* @__PURE__ */
|
|
5179
|
-
))), /* @__PURE__ */
|
|
5175
|
+
/* @__PURE__ */ import_react85.default.createElement("span", { className: "truncate pr-2 capitalize" }, option.toLowerCase())
|
|
5176
|
+
))), /* @__PURE__ */ import_react85.default.createElement("div", { className: "w-full flex mt-2" }, /* @__PURE__ */ import_react85.default.createElement("button", { onClick: () => setIsRoleModalOpen(false), className: "w-full py-4 text-sm text-stone-500 hover:text-black transition-colors outline-none" }, "Cancel")))));
|
|
5180
5177
|
};
|
|
5181
5178
|
|
|
5182
5179
|
// src/components/UniversalHome2.tsx
|
|
5183
|
-
var
|
|
5180
|
+
var import_react87 = __toESM(require("react"));
|
|
5184
5181
|
var import_navigation6 = require("next/navigation");
|
|
5185
|
-
var
|
|
5182
|
+
var import_react88 = require("@hugeicons/react");
|
|
5186
5183
|
var import_react_hot_toast14 = __toESM(require("react-hot-toast"));
|
|
5187
|
-
var
|
|
5184
|
+
var import_core_free_icons32 = require("@hugeicons/core-free-icons");
|
|
5188
5185
|
var OrgAvatar = ({ src, sizeClass = "w-10 h-10" }) => {
|
|
5189
|
-
const [loaded, setLoaded] = (0,
|
|
5190
|
-
const [error, setError] = (0,
|
|
5186
|
+
const [loaded, setLoaded] = (0, import_react87.useState)(false);
|
|
5187
|
+
const [error, setError] = (0, import_react87.useState)(false);
|
|
5191
5188
|
const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/office_a.avif";
|
|
5192
5189
|
const finalSrc = error || !src ? defaultAvatar : src;
|
|
5193
|
-
return /* @__PURE__ */
|
|
5190
|
+
return /* @__PURE__ */ import_react87.default.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ import_react87.default.createElement("div", { className: "w-full h-full rounded-lg bg-stone-100 flex items-center justify-center overflow-hidden" }, !loaded && !error && /* @__PURE__ */ import_react87.default.createElement(import_react88.HugeiconsIcon, { icon: import_core_free_icons32.Loading03Icon, className: "animate-spin text-stone-400 absolute", size: 14 }), /* @__PURE__ */ import_react87.default.createElement(
|
|
5194
5191
|
"img",
|
|
5195
5192
|
{
|
|
5196
5193
|
src: finalSrc,
|
|
@@ -5220,13 +5217,13 @@ var UniversalHome2 = ({
|
|
|
5220
5217
|
huddlesProps,
|
|
5221
5218
|
onLogout
|
|
5222
5219
|
}) => {
|
|
5223
|
-
const [isAvatarLoaded, setIsAvatarLoaded] = (0,
|
|
5224
|
-
const [showNotifDialog, setShowNotifDialog] = (0,
|
|
5225
|
-
const [showOrgSwitcher, setShowOrgSwitcher] = (0,
|
|
5226
|
-
const [selectedNotif, setSelectedNotif] = (0,
|
|
5227
|
-
const [isResolving, setIsResolving] = (0,
|
|
5228
|
-
const [showLogoutConfirm, setShowLogoutConfirm] = (0,
|
|
5229
|
-
const [isLoggingOut, setIsLoggingOut] = (0,
|
|
5220
|
+
const [isAvatarLoaded, setIsAvatarLoaded] = (0, import_react87.useState)(false);
|
|
5221
|
+
const [showNotifDialog, setShowNotifDialog] = (0, import_react87.useState)(false);
|
|
5222
|
+
const [showOrgSwitcher, setShowOrgSwitcher] = (0, import_react87.useState)(false);
|
|
5223
|
+
const [selectedNotif, setSelectedNotif] = (0, import_react87.useState)(null);
|
|
5224
|
+
const [isResolving, setIsResolving] = (0, import_react87.useState)(false);
|
|
5225
|
+
const [showLogoutConfirm, setShowLogoutConfirm] = (0, import_react87.useState)(false);
|
|
5226
|
+
const [isLoggingOut, setIsLoggingOut] = (0, import_react87.useState)(false);
|
|
5230
5227
|
const router = (0, import_navigation6.useRouter)();
|
|
5231
5228
|
const fallbackAvatarUrl = "https://storage.googleapis.com/retina-cloud-v2/assets/images/avatar.avif";
|
|
5232
5229
|
const finalAvatarSrc = avatarSrc || fallbackAvatarUrl;
|
|
@@ -5253,7 +5250,7 @@ var UniversalHome2 = ({
|
|
|
5253
5250
|
setShowLogoutConfirm(false);
|
|
5254
5251
|
}
|
|
5255
5252
|
};
|
|
5256
|
-
return /* @__PURE__ */
|
|
5253
|
+
return /* @__PURE__ */ import_react87.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 relative" }, /* @__PURE__ */ import_react87.default.createElement(
|
|
5257
5254
|
ConfirmationDialog,
|
|
5258
5255
|
{
|
|
5259
5256
|
isOpen: showLogoutConfirm,
|
|
@@ -5266,7 +5263,7 @@ var UniversalHome2 = ({
|
|
|
5266
5263
|
onClose: () => setShowLogoutConfirm(false),
|
|
5267
5264
|
onConfirm: confirmLogout
|
|
5268
5265
|
}
|
|
5269
|
-
), /* @__PURE__ */
|
|
5266
|
+
), /* @__PURE__ */ import_react87.default.createElement("div", { className: "flex items-center justify-between w-full pb-4" }, /* @__PURE__ */ import_react87.default.createElement("div", { className: "w-10 h-10 shrink-0 cursor-pointer", onClick: () => setShowOrgSwitcher(true) }, /* @__PURE__ */ import_react87.default.createElement("div", { className: "relative w-full h-full rounded-lg overflow-hidden bg-white flex items-center justify-center" }, !isAvatarLoaded && /* @__PURE__ */ import_react87.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-10 bg-white" }, /* @__PURE__ */ import_react87.default.createElement(import_react88.HugeiconsIcon, { icon: import_core_free_icons32.Loading03Icon, size: 16, className: "animate-spin text-black" })), /* @__PURE__ */ import_react87.default.createElement(
|
|
5270
5267
|
"img",
|
|
5271
5268
|
{
|
|
5272
5269
|
src: finalAvatarSrc,
|
|
@@ -5274,14 +5271,14 @@ var UniversalHome2 = ({
|
|
|
5274
5271
|
onLoad: () => setIsAvatarLoaded(true),
|
|
5275
5272
|
className: `w-full h-full object-cover transition-opacity duration-300 ${isAvatarLoaded ? "opacity-100" : "opacity-0"}`
|
|
5276
5273
|
}
|
|
5277
|
-
))), /* @__PURE__ */
|
|
5274
|
+
))), /* @__PURE__ */ import_react87.default.createElement("div", { className: "flex items-center gap-2 shrink-0" }, /* @__PURE__ */ import_react87.default.createElement(
|
|
5278
5275
|
"button",
|
|
5279
5276
|
{
|
|
5280
5277
|
onClick: () => router.push("/app/settings"),
|
|
5281
5278
|
className: "relative w-10 h-10 flex items-center justify-center rounded-full bg-white outline-none hover:bg-stone-50 transition-colors"
|
|
5282
5279
|
},
|
|
5283
|
-
/* @__PURE__ */
|
|
5284
|
-
), /* @__PURE__ */
|
|
5280
|
+
/* @__PURE__ */ import_react87.default.createElement(import_react88.HugeiconsIcon, { icon: import_core_free_icons32.Settings03Icon, size: 20, className: "text-black" })
|
|
5281
|
+
), /* @__PURE__ */ import_react87.default.createElement(
|
|
5285
5282
|
"button",
|
|
5286
5283
|
{
|
|
5287
5284
|
onClick: () => {
|
|
@@ -5290,16 +5287,16 @@ var UniversalHome2 = ({
|
|
|
5290
5287
|
},
|
|
5291
5288
|
className: "relative w-10 h-10 flex items-center justify-center rounded-full bg-white outline-none hover:bg-stone-50 transition-colors"
|
|
5292
5289
|
},
|
|
5293
|
-
/* @__PURE__ */
|
|
5294
|
-
hasUnreadNotifs && /* @__PURE__ */
|
|
5295
|
-
))), /* @__PURE__ */
|
|
5290
|
+
/* @__PURE__ */ import_react87.default.createElement(import_react88.HugeiconsIcon, { icon: import_core_free_icons32.Notification01Icon, size: 20, className: "text-black" }),
|
|
5291
|
+
hasUnreadNotifs && /* @__PURE__ */ import_react87.default.createElement("span", { className: "absolute top-2.5 right-2.5 w-2 h-2 bg-red-500 rounded-full border border-white" })
|
|
5292
|
+
))), /* @__PURE__ */ import_react87.default.createElement("div", { className: "w-full pb-6 flex flex-col gap-4" }, /* @__PURE__ */ import_react87.default.createElement("div", { className: "grid grid-cols-2 gap-2" }, /* @__PURE__ */ import_react87.default.createElement(
|
|
5296
5293
|
"div",
|
|
5297
5294
|
{
|
|
5298
5295
|
onClick: createHuddleAction?.onClick,
|
|
5299
5296
|
className: "bg-[#d97757] rounded-2xl p-5 relative overflow-hidden flex flex-col h-32 sm:h-36 cursor-pointer hover:opacity-90 transition-opacity"
|
|
5300
5297
|
},
|
|
5301
|
-
/* @__PURE__ */
|
|
5302
|
-
/* @__PURE__ */
|
|
5298
|
+
/* @__PURE__ */ import_react87.default.createElement("div", { className: "relative z-10 flex flex-col h-full justify-between" }, /* @__PURE__ */ import_react87.default.createElement("p", { className: "text-sm sm:text-sm text-white leading-tight" }, "Create", /* @__PURE__ */ import_react87.default.createElement("br", null), /* @__PURE__ */ import_react87.default.createElement("span", { className: "text-white/70" }, "Huddle")), /* @__PURE__ */ import_react87.default.createElement("div", { className: "w-8 h-8 rounded-full bg-white/10 flex items-center justify-center" }, /* @__PURE__ */ import_react87.default.createElement(import_react88.HugeiconsIcon, { icon: import_core_free_icons32.ArrowUpRight01Icon, size: 16, className: "text-white" }))),
|
|
5299
|
+
/* @__PURE__ */ import_react87.default.createElement(
|
|
5303
5300
|
"img",
|
|
5304
5301
|
{
|
|
5305
5302
|
src: "https://storage.googleapis.com/retina-cloud-v2/assets/images/cal_b.avif",
|
|
@@ -5307,14 +5304,14 @@ var UniversalHome2 = ({
|
|
|
5307
5304
|
className: "absolute bottom-4 right-2 translate-x-1/4 translate-y-1/2 w-32 h-auto object-contain z-0 pointer-events-none opacity-30"
|
|
5308
5305
|
}
|
|
5309
5306
|
)
|
|
5310
|
-
), /* @__PURE__ */
|
|
5307
|
+
), /* @__PURE__ */ import_react87.default.createElement(
|
|
5311
5308
|
"div",
|
|
5312
5309
|
{
|
|
5313
5310
|
onClick: joinHuddleAction?.onClick,
|
|
5314
5311
|
className: "bg-[#ffffff] rounded-2xl p-5 relative overflow-hidden flex flex-col h-32 sm:h-36 cursor-pointer hover:opacity-90 transition-opacity"
|
|
5315
5312
|
},
|
|
5316
|
-
/* @__PURE__ */
|
|
5317
|
-
/* @__PURE__ */
|
|
5313
|
+
/* @__PURE__ */ import_react87.default.createElement("div", { className: "relative z-10 flex flex-col h-full justify-between" }, /* @__PURE__ */ import_react87.default.createElement("p", { className: "text-sm sm:text-sm text-black leading-tight" }, "Join", /* @__PURE__ */ import_react87.default.createElement("br", null), /* @__PURE__ */ import_react87.default.createElement("span", { className: "text-black/60" }, "Huddle")), /* @__PURE__ */ import_react87.default.createElement("div", { className: "w-8 h-8 rounded-full bg-black/5 flex items-center justify-center" }, /* @__PURE__ */ import_react87.default.createElement(import_react88.HugeiconsIcon, { icon: import_core_free_icons32.ArrowRight01Icon, size: 16, className: "text-black" }))),
|
|
5314
|
+
/* @__PURE__ */ import_react87.default.createElement(
|
|
5318
5315
|
"img",
|
|
5319
5316
|
{
|
|
5320
5317
|
src: "https://storage.googleapis.com/retina-cloud-v2/assets/images/cam_c.avif",
|
|
@@ -5322,12 +5319,12 @@ var UniversalHome2 = ({
|
|
|
5322
5319
|
className: "absolute bottom-4 right-2 translate-x-1/4 translate-y-1/2 w-32 h-auto object-contain z-0 pointer-events-none opacity-30"
|
|
5323
5320
|
}
|
|
5324
5321
|
)
|
|
5325
|
-
))), customContent && /* @__PURE__ */
|
|
5322
|
+
))), customContent && /* @__PURE__ */ import_react87.default.createElement("div", { className: "w-full" }, customContent), /* @__PURE__ */ import_react87.default.createElement("div", { className: "w-full mt-2" }, /* @__PURE__ */ import_react87.default.createElement(
|
|
5326
5323
|
UniversalHuddlesPage,
|
|
5327
5324
|
{
|
|
5328
5325
|
...huddlesProps
|
|
5329
5326
|
}
|
|
5330
|
-
)), showOrgSwitcher && /* @__PURE__ */
|
|
5327
|
+
)), showOrgSwitcher && /* @__PURE__ */ import_react87.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react87.default.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowOrgSwitcher(false) }), /* @__PURE__ */ import_react87.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[80vh] h-auto" }, /* @__PURE__ */ import_react87.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react87.default.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Switch Workspace"), /* @__PURE__ */ import_react87.default.createElement("button", { onClick: () => setShowOrgSwitcher(false), className: "text-stone-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react87.default.createElement(import_react88.HugeiconsIcon, { icon: import_core_free_icons32.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react87.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2" }, /* @__PURE__ */ import_react87.default.createElement("div", { className: "flex flex-col" }, organizations?.length === 0 ? /* @__PURE__ */ import_react87.default.createElement("div", { className: "p-8 text-center text-xs text-stone-400" }, "No organizations found.") : organizations?.map((org) => /* @__PURE__ */ import_react87.default.createElement(
|
|
5331
5328
|
"button",
|
|
5332
5329
|
{
|
|
5333
5330
|
key: org.id,
|
|
@@ -5337,10 +5334,10 @@ var UniversalHome2 = ({
|
|
|
5337
5334
|
},
|
|
5338
5335
|
className: `p-4 flex items-center justify-between gap-3 cursor-pointer outline-none transition-colors border-b border-stone-50 last:border-0 ${activeOrgId === org.id ? "bg-stone-50" : "hover:bg-stone-50/50"}`
|
|
5339
5336
|
},
|
|
5340
|
-
/* @__PURE__ */
|
|
5341
|
-
/* @__PURE__ */
|
|
5342
|
-
activeOrgId === org.id && /* @__PURE__ */
|
|
5343
|
-
)))), /* @__PURE__ */
|
|
5337
|
+
/* @__PURE__ */ import_react87.default.createElement(OrgAvatar, { src: org.avatarUrl }),
|
|
5338
|
+
/* @__PURE__ */ import_react87.default.createElement("div", { className: "flex flex-col items-start min-w-0 flex-1" }, /* @__PURE__ */ import_react87.default.createElement("span", { className: `text-sm tracking-tight truncate w-full text-left ${activeOrgId === org.id ? "text-black " : "text-stone-600"}` }, org.name), /* @__PURE__ */ import_react87.default.createElement("span", { className: "text-xs text-stone-500 capitalize truncate w-full text-left mt-0.5" }, org.role?.toLowerCase() || "Member")),
|
|
5339
|
+
activeOrgId === org.id && /* @__PURE__ */ import_react87.default.createElement("div", { className: "w-2 h-2 rounded-full bg-[#d97757] shrink-0" })
|
|
5340
|
+
)))), /* @__PURE__ */ import_react87.default.createElement("div", { className: "p-4 shrink-0" }, /* @__PURE__ */ import_react87.default.createElement(
|
|
5344
5341
|
"button",
|
|
5345
5342
|
{
|
|
5346
5343
|
onClick: () => {
|
|
@@ -5349,17 +5346,17 @@ var UniversalHome2 = ({
|
|
|
5349
5346
|
},
|
|
5350
5347
|
className: "w-full py-2.5 flex items-center justify-center gap-2 rounded-full border border-stone-200 text-stone-600 hover:bg-stone-100 transition-colors outline-none text-xs tracking-wide"
|
|
5351
5348
|
},
|
|
5352
|
-
/* @__PURE__ */
|
|
5349
|
+
/* @__PURE__ */ import_react87.default.createElement(import_react88.HugeiconsIcon, { icon: import_core_free_icons32.Logout01Icon, size: 15 }),
|
|
5353
5350
|
"Log Out"
|
|
5354
|
-
)))), showNotifDialog && /* @__PURE__ */
|
|
5351
|
+
)))), showNotifDialog && /* @__PURE__ */ import_react87.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react87.default.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowNotifDialog(false) }), /* @__PURE__ */ import_react87.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[80vh] h-auto" }, /* @__PURE__ */ import_react87.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, selectedNotif ? /* @__PURE__ */ import_react87.default.createElement("button", { onClick: () => setSelectedNotif(null), disabled: isResolving, className: "text-[#d97757] hover:text-[#d97757] transition-colors outline-none flex items-center gap-2 text-xs tracking-widest disabled:opacity-50" }, /* @__PURE__ */ import_react87.default.createElement(import_react88.HugeiconsIcon, { icon: import_core_free_icons32.ArrowLeft01Icon, size: 14 }), " Back") : /* @__PURE__ */ import_react87.default.createElement("h3", { className: "text-sm text-black tracking-tight flex items-center gap-2" }, "Notifications"), /* @__PURE__ */ import_react87.default.createElement("button", { onClick: () => setShowNotifDialog(false), disabled: isResolving, className: "text-stone-400 hover:text-black transition-colors outline-none disabled:opacity-50" }, /* @__PURE__ */ import_react87.default.createElement(import_react88.HugeiconsIcon, { icon: import_core_free_icons32.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react87.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2 relative" }, isNotifsLoading && !selectedNotif && /* @__PURE__ */ import_react87.default.createElement("div", { className: "absolute inset-0 z-10 flex items-center justify-center" }, /* @__PURE__ */ import_react87.default.createElement(import_react88.HugeiconsIcon, { icon: import_core_free_icons32.Loading03Icon, size: 28, className: "animate-spin text-black" })), selectedNotif ? /* @__PURE__ */ import_react87.default.createElement("div", { className: "p-4 text-left" }, selectedNotif.type === "HUDDLE_INVITE" && selectedNotif.meta_json?.action === "RESOLVE_INVITE" && selectedNotif.meta_json?.completed ? /* @__PURE__ */ import_react87.default.createElement("div", { className: "mb-2" }, /* @__PURE__ */ import_react87.default.createElement("span", { className: "inline-flex items-center gap-1.5 px-3 py-1 rounded-full bg-emerald-50 text-emerald-600 text-xs tracking-wide" }, /* @__PURE__ */ import_react87.default.createElement(import_react88.HugeiconsIcon, { icon: import_core_free_icons32.Tick02Icon, size: 12 }), " Action Completed")) : /* @__PURE__ */ import_react87.default.createElement("h4", { className: "text-sm text-black mb-1" }, selectedNotif.title), /* @__PURE__ */ import_react87.default.createElement("span", { className: "text-xs text-stone-400 tracking-widest mb-4 block" }, formatNotifDate(selectedNotif.createdAt)), /* @__PURE__ */ import_react87.default.createElement("p", { className: "text-xs text-stone-600 leading-relaxed whitespace-pre-wrap" }, selectedNotif.message), selectedNotif.type === "HUDDLE_INVITE" && selectedNotif.meta_json?.action === "RESOLVE_INVITE" && /* @__PURE__ */ import_react87.default.createElement("div", { className: `mt-8 flex gap-3 pt-6 ${selectedNotif.meta_json?.completed ? "opacity-40 pointer-events-none cursor-not-allowed" : ""}` }, /* @__PURE__ */ import_react87.default.createElement(
|
|
5355
5352
|
"button",
|
|
5356
5353
|
{
|
|
5357
5354
|
onClick: () => handleResolve("ACCEPTED"),
|
|
5358
5355
|
disabled: isResolving || selectedNotif.meta_json?.completed,
|
|
5359
5356
|
className: "flex-1 py-2.5 rounded-full bg-black text-white text-xs tracking-wide transition-all outline-none hover:bg-stone-800 flex justify-center items-center disabled:opacity-50"
|
|
5360
5357
|
},
|
|
5361
|
-
isResolving ? /* @__PURE__ */
|
|
5362
|
-
), /* @__PURE__ */
|
|
5358
|
+
isResolving ? /* @__PURE__ */ import_react87.default.createElement(import_react88.HugeiconsIcon, { icon: import_core_free_icons32.Loading03Icon, className: "animate-spin", size: 16 }) : "Accept"
|
|
5359
|
+
), /* @__PURE__ */ import_react87.default.createElement(
|
|
5363
5360
|
"button",
|
|
5364
5361
|
{
|
|
5365
5362
|
onClick: () => handleResolve("REJECTED"),
|
|
@@ -5367,7 +5364,7 @@ var UniversalHome2 = ({
|
|
|
5367
5364
|
className: "flex-1 py-2.5 rounded-full bg-white border border-stone-200 text-black text-xs tracking-wide transition-all outline-none hover:bg-stone-50 flex justify-center items-center disabled:opacity-50"
|
|
5368
5365
|
},
|
|
5369
5366
|
"Reject"
|
|
5370
|
-
))) : /* @__PURE__ */
|
|
5367
|
+
))) : /* @__PURE__ */ import_react87.default.createElement("div", { className: "flex flex-col divide-y divide-stone-50/50" }, notifications?.length === 0 && !isNotifsLoading ? /* @__PURE__ */ import_react87.default.createElement("div", { className: "p-8 text-center text-xs text-stone-400" }, "You have no notifications.") : notifications?.map((notif) => /* @__PURE__ */ import_react87.default.createElement(
|
|
5371
5368
|
"div",
|
|
5372
5369
|
{
|
|
5373
5370
|
key: notif.id,
|
|
@@ -5377,35 +5374,35 @@ var UniversalHome2 = ({
|
|
|
5377
5374
|
},
|
|
5378
5375
|
className: `p-3 flex items-start gap-3 rounded-xl cursor-pointer transition-colors ${isNotifsLoading ? "opacity-50 pointer-events-none" : "hover:bg-stone-50"}`
|
|
5379
5376
|
},
|
|
5380
|
-
/* @__PURE__ */
|
|
5381
|
-
/* @__PURE__ */
|
|
5382
|
-
)))), !selectedNotif && /* @__PURE__ */
|
|
5377
|
+
/* @__PURE__ */ import_react87.default.createElement("div", { className: "mt-1.5 shrink-0" }, !notif.isRead ? /* @__PURE__ */ import_react87.default.createElement("div", { className: "w-1.5 h-1.5 bg-red-500 rounded-full" }) : /* @__PURE__ */ import_react87.default.createElement("div", { className: "w-1.5 h-1.5 bg-transparent" })),
|
|
5378
|
+
/* @__PURE__ */ import_react87.default.createElement("div", { className: "flex-1 min-w-0 text-left" }, /* @__PURE__ */ import_react87.default.createElement("h5", { className: `text-xs truncate ${notif.isRead ? "text-stone-500" : "text-black"}` }, notif.title), /* @__PURE__ */ import_react87.default.createElement("p", { className: "text-xs text-stone-400 truncate mt-0.5" }, notif.message), /* @__PURE__ */ import_react87.default.createElement("span", { className: "text-xs text-stone-400 tracking-widest mt-2 block" }, formatNotifDate(notif.createdAt)))
|
|
5379
|
+
)))), !selectedNotif && /* @__PURE__ */ import_react87.default.createElement("div", { className: "p-4 flex items-center justify-between shrink-0" }, /* @__PURE__ */ import_react87.default.createElement("span", { className: "text-xs text-stone-400 tracking-widest" }, "Page ", notificationPage, " of ", notificationTotalPages === 0 ? 1 : notificationTotalPages), /* @__PURE__ */ import_react87.default.createElement("div", { className: "flex gap-1" }, /* @__PURE__ */ import_react87.default.createElement(
|
|
5383
5380
|
"button",
|
|
5384
5381
|
{
|
|
5385
5382
|
disabled: notificationPage <= 1 || isNotifsLoading,
|
|
5386
5383
|
onClick: () => onNotificationPageChange?.(notificationPage - 1),
|
|
5387
5384
|
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-stone-200 text-stone-600 disabled:opacity-30 outline-none hover:bg-stone-50 transition-colors"
|
|
5388
5385
|
},
|
|
5389
|
-
/* @__PURE__ */
|
|
5390
|
-
), /* @__PURE__ */
|
|
5386
|
+
/* @__PURE__ */ import_react87.default.createElement(import_react88.HugeiconsIcon, { icon: import_core_free_icons32.ArrowLeft01Icon, size: 12 })
|
|
5387
|
+
), /* @__PURE__ */ import_react87.default.createElement(
|
|
5391
5388
|
"button",
|
|
5392
5389
|
{
|
|
5393
5390
|
disabled: notificationPage >= notificationTotalPages || notificationTotalPages === 0 || isNotifsLoading,
|
|
5394
5391
|
onClick: () => onNotificationPageChange?.(notificationPage + 1),
|
|
5395
5392
|
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-stone-200 text-stone-600 disabled:opacity-30 outline-none hover:bg-stone-50 transition-colors"
|
|
5396
5393
|
},
|
|
5397
|
-
/* @__PURE__ */
|
|
5394
|
+
/* @__PURE__ */ import_react87.default.createElement(import_react88.HugeiconsIcon, { icon: import_core_free_icons32.ArrowRight01Icon, size: 12 })
|
|
5398
5395
|
))))));
|
|
5399
5396
|
};
|
|
5400
5397
|
|
|
5401
5398
|
// src/components/UniversalSettings.tsx
|
|
5402
|
-
var
|
|
5399
|
+
var import_react89 = __toESM(require("react"));
|
|
5403
5400
|
var import_react_hot_toast15 = __toESM(require("react-hot-toast"));
|
|
5404
|
-
var
|
|
5405
|
-
var
|
|
5401
|
+
var import_react90 = require("@hugeicons/react");
|
|
5402
|
+
var import_core_free_icons33 = require("@hugeicons/core-free-icons");
|
|
5406
5403
|
var MemberAvatar3 = ({ src, status, sizeClass = "w-10 h-10" }) => {
|
|
5407
|
-
const [loaded, setLoaded] = (0,
|
|
5408
|
-
const [error, setError] = (0,
|
|
5404
|
+
const [loaded, setLoaded] = (0, import_react89.useState)(false);
|
|
5405
|
+
const [error, setError] = (0, import_react89.useState)(false);
|
|
5409
5406
|
const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/avatar.avif";
|
|
5410
5407
|
const finalSrc = error || !src ? defaultAvatar : src;
|
|
5411
5408
|
const getStatusColor = () => {
|
|
@@ -5422,10 +5419,10 @@ var MemberAvatar3 = ({ src, status, sizeClass = "w-10 h-10" }) => {
|
|
|
5422
5419
|
return "bg-stone-200";
|
|
5423
5420
|
}
|
|
5424
5421
|
};
|
|
5425
|
-
return /* @__PURE__ */
|
|
5422
|
+
return /* @__PURE__ */ import_react89.default.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ import_react89.default.createElement("div", { className: "w-full h-full rounded-lg bg-stone-100 flex items-center justify-center overflow-hidden" }, !loaded && !error && /* @__PURE__ */ import_react89.default.createElement(import_react90.HugeiconsIcon, { icon: import_core_free_icons33.Loading03Icon, className: "animate-spin text-stone-400 absolute", size: 14 }), /* @__PURE__ */ import_react89.default.createElement("img", { src: finalSrc, alt: "Member", className: `w-full h-full object-cover transition-opacity duration-300 ${loaded || error ? "opacity-100" : "opacity-0"}`, onLoad: () => setLoaded(true), onError: () => setError(true) })), /* @__PURE__ */ import_react89.default.createElement("div", { className: `absolute -bottom-1 -right-1 w-3.5 h-3.5 rounded-full border-2 border-white z-10 ${getStatusColor()}` }));
|
|
5426
5423
|
};
|
|
5427
|
-
var PageSpinner8 = () => /* @__PURE__ */
|
|
5428
|
-
var InputSpinner3 = () => /* @__PURE__ */
|
|
5424
|
+
var PageSpinner8 = () => /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ import_react89.default.createElement(import_react90.HugeiconsIcon, { icon: import_core_free_icons33.Loading03Icon, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
5425
|
+
var InputSpinner3 = () => /* @__PURE__ */ import_react89.default.createElement("svg", { className: "animate-spin h-4 w-4 text-stone-400", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" }, /* @__PURE__ */ import_react89.default.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ import_react89.default.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" }));
|
|
5429
5426
|
var UniversalSettings = ({
|
|
5430
5427
|
accountType,
|
|
5431
5428
|
userRole,
|
|
@@ -5464,36 +5461,36 @@ var UniversalSettings = ({
|
|
|
5464
5461
|
});
|
|
5465
5462
|
const isOrg = accountType === "ORGANIZATION";
|
|
5466
5463
|
const canManage = userRole === "ADMIN" || userRole === "MANAGER" || userRole === "OWNER";
|
|
5467
|
-
const [activeTab, setActiveTab] = (0,
|
|
5468
|
-
const [expandedId, setExpandedId] = (0,
|
|
5469
|
-
const [memberToRemove, setMemberToRemove] = (0,
|
|
5470
|
-
const [isRemoving, setIsRemoving] = (0,
|
|
5471
|
-
const [isInviteMode, setIsInviteMode] = (0,
|
|
5472
|
-
const [inviteEmail, setInviteEmail] = (0,
|
|
5473
|
-
const [isInviting, setIsInviting] = (0,
|
|
5474
|
-
const [localSearchQuery, setLocalSearchQuery] = (0,
|
|
5475
|
-
const [isTyping, setIsTyping] = (0,
|
|
5476
|
-
const isFirstSearchMount = (0,
|
|
5477
|
-
const [isStatusModalOpen, setIsStatusModalOpen] = (0,
|
|
5478
|
-
const [isRoleModalOpen, setIsRoleModalOpen] = (0,
|
|
5479
|
-
const [roleEditTarget, setRoleEditTarget] = (0,
|
|
5480
|
-
const [isUpdatingRole, setIsUpdatingRole] = (0,
|
|
5481
|
-
const [orgName, setOrgName] = (0,
|
|
5482
|
-
const [orgSlug, setOrgSlug] = (0,
|
|
5483
|
-
const [firstName, setFirstName] = (0,
|
|
5484
|
-
const [lastName, setLastName] = (0,
|
|
5485
|
-
const [isCheckingSlug, setIsCheckingSlug] = (0,
|
|
5486
|
-
const [slugAvailable, setSlugAvailable] = (0,
|
|
5487
|
-
const [isSavingOrg, setIsSavingOrg] = (0,
|
|
5488
|
-
const [isSavingProfile, setIsSavingProfile] = (0,
|
|
5489
|
-
(0,
|
|
5464
|
+
const [activeTab, setActiveTab] = (0, import_react89.useState)(isOrg ? "MEMBERS" : "ACCOUNT");
|
|
5465
|
+
const [expandedId, setExpandedId] = (0, import_react89.useState)(null);
|
|
5466
|
+
const [memberToRemove, setMemberToRemove] = (0, import_react89.useState)(null);
|
|
5467
|
+
const [isRemoving, setIsRemoving] = (0, import_react89.useState)(false);
|
|
5468
|
+
const [isInviteMode, setIsInviteMode] = (0, import_react89.useState)(false);
|
|
5469
|
+
const [inviteEmail, setInviteEmail] = (0, import_react89.useState)("");
|
|
5470
|
+
const [isInviting, setIsInviting] = (0, import_react89.useState)(false);
|
|
5471
|
+
const [localSearchQuery, setLocalSearchQuery] = (0, import_react89.useState)(membersSearchQuery);
|
|
5472
|
+
const [isTyping, setIsTyping] = (0, import_react89.useState)(false);
|
|
5473
|
+
const isFirstSearchMount = (0, import_react89.useRef)(true);
|
|
5474
|
+
const [isStatusModalOpen, setIsStatusModalOpen] = (0, import_react89.useState)(false);
|
|
5475
|
+
const [isRoleModalOpen, setIsRoleModalOpen] = (0, import_react89.useState)(false);
|
|
5476
|
+
const [roleEditTarget, setRoleEditTarget] = (0, import_react89.useState)(null);
|
|
5477
|
+
const [isUpdatingRole, setIsUpdatingRole] = (0, import_react89.useState)(false);
|
|
5478
|
+
const [orgName, setOrgName] = (0, import_react89.useState)(initialOrgName);
|
|
5479
|
+
const [orgSlug, setOrgSlug] = (0, import_react89.useState)(initialOrgSlug);
|
|
5480
|
+
const [firstName, setFirstName] = (0, import_react89.useState)("");
|
|
5481
|
+
const [lastName, setLastName] = (0, import_react89.useState)("");
|
|
5482
|
+
const [isCheckingSlug, setIsCheckingSlug] = (0, import_react89.useState)(false);
|
|
5483
|
+
const [slugAvailable, setSlugAvailable] = (0, import_react89.useState)(null);
|
|
5484
|
+
const [isSavingOrg, setIsSavingOrg] = (0, import_react89.useState)(false);
|
|
5485
|
+
const [isSavingProfile, setIsSavingProfile] = (0, import_react89.useState)(false);
|
|
5486
|
+
(0, import_react89.useEffect)(() => {
|
|
5490
5487
|
setOrgName(initialOrgName || "");
|
|
5491
5488
|
setOrgSlug(initialOrgSlug || "");
|
|
5492
5489
|
const parts = (initialFullName || "").split(" ");
|
|
5493
5490
|
setFirstName(parts[0] || "");
|
|
5494
5491
|
setLastName(parts.slice(1).join(" ") || "");
|
|
5495
5492
|
}, [initialOrgName, initialOrgSlug, initialFullName]);
|
|
5496
|
-
(0,
|
|
5493
|
+
(0, import_react89.useEffect)(() => {
|
|
5497
5494
|
if (activeTab !== "MEMBERS") return;
|
|
5498
5495
|
if (isFirstSearchMount.current) {
|
|
5499
5496
|
isFirstSearchMount.current = false;
|
|
@@ -5550,7 +5547,7 @@ var UniversalSettings = ({
|
|
|
5550
5547
|
}
|
|
5551
5548
|
};
|
|
5552
5549
|
const activeExpandedMember = expandedId ? members.find((m) => m.id === expandedId) : null;
|
|
5553
|
-
(0,
|
|
5550
|
+
(0, import_react89.useEffect)(() => {
|
|
5554
5551
|
if (!isOrg || !orgSlug || orgSlug === initialOrgSlug) {
|
|
5555
5552
|
setSlugAvailable(null);
|
|
5556
5553
|
setIsCheckingSlug(false);
|
|
@@ -5610,11 +5607,11 @@ var UniversalSettings = ({
|
|
|
5610
5607
|
const isOrgSaveDisabled = isSavingOrg || !canManage || isCheckingSlug || !hasOrgChanges || orgName.length < 3 || orgSlug.length < 3 || orgSlug !== initialOrgSlug && slugAvailable === false;
|
|
5611
5608
|
const hasProfileChanges = `${firstName} ${lastName}`.trim() !== initialFullName;
|
|
5612
5609
|
const isProfileSaveDisabled = isSavingProfile || !hasProfileChanges || firstName.length < 2 || lastName.length < 2;
|
|
5613
|
-
return /* @__PURE__ */
|
|
5610
|
+
return /* @__PURE__ */ import_react89.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react89.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react89.default.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ import_react89.default.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-[#d97757] hover:text-[#d97757] transition-colors text-sm outline-none" }, /* @__PURE__ */ import_react89.default.createElement(import_react90.HugeiconsIcon, { icon: import_core_free_icons33.ArrowLeft01Icon, size: 16 }), " Back")), /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex flex-col gap-1 mb-8 px-1" }, /* @__PURE__ */ import_react89.default.createElement("h1", { className: "text-black text-xl tracking-tight" }, "System Settings"), /* @__PURE__ */ import_react89.default.createElement("p", { className: "text-xs text-stone-500" }, "Manage your workspace identity, team configurations, and AI billing parameters.")), /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex items-center gap-6 mb-6 overflow-x-auto custom-scrollbar px-1" }, isOrg && /* @__PURE__ */ import_react89.default.createElement("button", { onClick: () => {
|
|
5614
5611
|
setActiveTab("MEMBERS");
|
|
5615
5612
|
setExpandedId(null);
|
|
5616
5613
|
setIsInviteMode(false);
|
|
5617
|
-
}, className: `pb-3 text-sm tracking-wide outline-none transition-colors border-b-2 whitespace-nowrap ${activeTab === "MEMBERS" ? "border-black text-black" : "border-transparent text-stone-500 hover:text-black"}` }, "Members"), isOrg && /* @__PURE__ */
|
|
5614
|
+
}, className: `pb-3 text-sm tracking-wide outline-none transition-colors border-b-2 whitespace-nowrap ${activeTab === "MEMBERS" ? "border-black text-black" : "border-transparent text-stone-500 hover:text-black"}` }, "Members"), isOrg && /* @__PURE__ */ import_react89.default.createElement("button", { onClick: () => setActiveTab("ORGANIZATION"), className: `pb-3 text-sm tracking-wide outline-none transition-colors border-b-2 whitespace-nowrap ${activeTab === "ORGANIZATION" ? "border-black text-black" : "border-transparent text-stone-500 hover:text-black"}` }, "Organization"), /* @__PURE__ */ import_react89.default.createElement("button", { onClick: () => setActiveTab("ACCOUNT"), className: `pb-3 text-sm tracking-wide outline-none transition-colors border-b-2 whitespace-nowrap ${activeTab === "ACCOUNT" ? "border-black text-black" : "border-transparent text-stone-500 hover:text-black"}` }, "Profile")), activeTab === "MEMBERS" && isOrg && /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react89.default.createElement(
|
|
5618
5615
|
ConfirmationDialog,
|
|
5619
5616
|
{
|
|
5620
5617
|
isOpen: !!memberToRemove,
|
|
@@ -5627,7 +5624,7 @@ var UniversalSettings = ({
|
|
|
5627
5624
|
onClose: () => setMemberToRemove(null),
|
|
5628
5625
|
onConfirm: handleConfirmRemove
|
|
5629
5626
|
}
|
|
5630
|
-
), !isInviteMode && !activeExpandedMember && /* @__PURE__ */
|
|
5627
|
+
), !isInviteMode && !activeExpandedMember && /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex flex-row flex-nowrap mb-4 items-center justify-between gap-4 w-full px-1" }, /* @__PURE__ */ import_react89.default.createElement("div", { className: "relative flex-1 min-w-0 max-w-full" }, /* @__PURE__ */ import_react89.default.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ import_react89.default.createElement(import_react90.HugeiconsIcon, { icon: import_core_free_icons33.Search01Icon, size: 16, className: "text-stone-400" })), /* @__PURE__ */ import_react89.default.createElement("input", { type: "text", placeholder: "Search members...", value: localSearchQuery, onChange: (e) => setLocalSearchQuery(e.target.value), className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-sm text-black placeholder-stone-400 outline-none transition-colors focus:border-black" })), /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex items-center gap-3 w-auto pb-0 shrink-0" }, /* @__PURE__ */ import_react89.default.createElement("button", { onClick: () => setIsStatusModalOpen(true), className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-stone-500 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react89.default.createElement(import_react90.HugeiconsIcon, { icon: import_core_free_icons33.SearchList02Icon, size: 16 })), /* @__PURE__ */ import_react89.default.createElement("button", { onClick: () => setIsRoleModalOpen(true), className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-stone-500 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react89.default.createElement(import_react90.HugeiconsIcon, { icon: import_core_free_icons33.ListSettingIcon, size: 16 })))), /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, activeExpandedMember ? /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex flex-col animate-in fade-in zoom-in-95 duration-300 w-full" }, /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex flex-col gap-1 mb-8" }, /* @__PURE__ */ import_react89.default.createElement("h2", { className: "text-black text-xl tracking-tight" }, "Member Profile"), /* @__PURE__ */ import_react89.default.createElement("p", { className: "text-xs text-stone-500" }, "View and manage this member's access privileges.")), /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex items-center gap-4 mb-8" }, /* @__PURE__ */ import_react89.default.createElement(MemberAvatar3, { src: activeExpandedMember.avatarUrl, status: activeExpandedMember.status, sizeClass: "w-14 h-14" }), /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react89.default.createElement("span", { className: "text-sm text-black tracking-tight truncate" }, activeExpandedMember.fullName), /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex items-center gap-2 mt-0.5" }, /* @__PURE__ */ import_react89.default.createElement("span", { className: "text-xs text-stone-500 capitalize" }, activeExpandedMember.role.toLowerCase()), canManage && !activeExpandedMember.isRootAdmin && (isUpdatingRole ? /* @__PURE__ */ import_react89.default.createElement(import_react90.HugeiconsIcon, { icon: import_core_free_icons33.Loading03Icon, size: 12, className: "animate-spin text-stone-400 ml-1" }) : /* @__PURE__ */ import_react89.default.createElement("button", { onClick: () => setRoleEditTarget(activeExpandedMember), className: "text-xs text-[#d97757] hover:underline outline-none" }, "Edit"))))), /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex flex-col sm:flex-row gap-3 pt-6 " }, canManage && !activeExpandedMember.isRootAdmin && /* @__PURE__ */ import_react89.default.createElement(
|
|
5631
5628
|
"button",
|
|
5632
5629
|
{
|
|
5633
5630
|
onClick: () => setMemberToRemove(activeExpandedMember),
|
|
@@ -5635,25 +5632,25 @@ var UniversalSettings = ({
|
|
|
5635
5632
|
className: "w-full sm:flex-1 py-2.5 bg-white border border-rose-200 text-rose-600 hover:bg-rose-50 rounded-full text-xs tracking-wide transition-colors outline-none disabled:opacity-50"
|
|
5636
5633
|
},
|
|
5637
5634
|
"Remove Access"
|
|
5638
|
-
), /* @__PURE__ */
|
|
5635
|
+
), /* @__PURE__ */ import_react89.default.createElement("button", { onClick: () => setExpandedId(null), disabled: isUpdatingRole, className: "w-full sm:flex-1 py-2.5 bg-white border border-stone-200 text-black hover:bg-stone-100 rounded-full text-xs tracking-wide transition-colors outline-none disabled:opacity-50" }, "Close Profile"))) : /* @__PURE__ */ import_react89.default.createElement(import_react89.default.Fragment, null, /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex flex-row items-center justify-between gap-4" }, /* @__PURE__ */ import_react89.default.createElement("h2", { className: "text-black text-xl tracking-tight" }, isInviteMode ? "Add Member" : "Team Directory"), !isInviteMode && canManage && /* @__PURE__ */ import_react89.default.createElement("button", { onClick: () => setIsInviteMode(true), className: "shrink-0 px-4 py-1.5 border border-stone-200 text-black text-xs tracking-wide rounded-full hover:bg-stone-50 transition-colors outline-none" }, "Invite Team")), !isInviteMode && /* @__PURE__ */ import_react89.default.createElement("p", { className: "text-xs text-stone-500" }, "Manage members and access controls across your organization.")), /* @__PURE__ */ import_react89.default.createElement("div", { className: "w-full overflow-hidden" }, isInviteMode ? /* @__PURE__ */ import_react89.default.createElement("form", { onSubmit: handleInviteSubmit, className: "flex flex-col gap-8 animate-in fade-in duration-300" }, /* @__PURE__ */ import_react89.default.createElement("div", { className: "space-y-1.5 mt-2" }, /* @__PURE__ */ import_react89.default.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Email Address"), /* @__PURE__ */ import_react89.default.createElement("input", { type: "email", value: inviteEmail, onChange: (e) => setInviteEmail(cleanEmailId(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-stone-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "name@company.com" })), /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ import_react89.default.createElement(ThreeDActionButton, { type: "submit", disabled: inviteEmail.length < 5 || isInviting, isLoading: isInviting, className: "w-full" }, "Send Invitation"), /* @__PURE__ */ import_react89.default.createElement("button", { type: "button", onClick: () => {
|
|
5639
5636
|
setIsInviteMode(false);
|
|
5640
5637
|
setInviteEmail("");
|
|
5641
|
-
}, disabled: isInviting, className: "w-full flex items-center justify-center py-2.5 rounded-full border border-stone-200 text-black hover:bg-stone-50 transition-colors outline-none text-xs tracking-wide" }, "Cancel"))) : isMembersLoading || isTyping ? /* @__PURE__ */
|
|
5638
|
+
}, disabled: isInviting, className: "w-full flex items-center justify-center py-2.5 rounded-full border border-stone-200 text-black hover:bg-stone-50 transition-colors outline-none text-xs tracking-wide" }, "Cancel"))) : isMembersLoading || isTyping ? /* @__PURE__ */ import_react89.default.createElement(PageSpinner8, null) : /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex flex-col min-w-0 animate-in fade-in duration-300" }, /* @__PURE__ */ import_react89.default.createElement("div", null, members.length === 0 ? /* @__PURE__ */ import_react89.default.createElement("p", { className: "text-xs text-stone-400 py-6 text-center" }, "No members found") : members.map((member) => /* @__PURE__ */ import_react89.default.createElement("div", { key: member.id, onClick: () => setExpandedId(member.id), className: "flex items-center justify-between py-3 hover:bg-stone-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl" }, /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react89.default.createElement(MemberAvatar3, { src: member.avatarUrl, status: member.status }), /* @__PURE__ */ import_react89.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-0.5" }, /* @__PURE__ */ import_react89.default.createElement("p", { className: "text-sm text-black truncate" }, member.fullName), /* @__PURE__ */ import_react89.default.createElement("p", { className: "text-xs text-stone-500 capitalize truncate" }, member.role.toLowerCase())))))), /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ import_react89.default.createElement("span", { className: "text-xs text-stone-400 tracking-[0.2em]" }, "Page ", membersCurrentPage, " of ", membersTotalPages === 0 ? 1 : membersTotalPages), /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react89.default.createElement("button", { onClick: () => onMembersPageChange(membersCurrentPage - 1), disabled: membersCurrentPage <= 1 || isMembersLoading, className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none" }, /* @__PURE__ */ import_react89.default.createElement(import_react90.HugeiconsIcon, { icon: import_core_free_icons33.ArrowLeft01Icon, size: 14 })), /* @__PURE__ */ import_react89.default.createElement("button", { onClick: () => onMembersPageChange(membersCurrentPage + 1), disabled: membersCurrentPage >= membersTotalPages || isMembersLoading || membersTotalPages === 0, className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none" }, /* @__PURE__ */ import_react89.default.createElement(import_react90.HugeiconsIcon, { icon: import_core_free_icons33.ArrowRight01Icon, size: 14 })))))))), /* @__PURE__ */ import_react89.default.createElement(ReusableOptions, { isOpen: isStatusModalOpen, onClose: () => setIsStatusModalOpen(false), title: "Status Filter", options: ["ALL", "ACTIVE", "BUSY", "OFFLINE", "AWAY"], selectedOption: activeStatusFilter, onSelect: (status) => onStatusFilterChange(status) }), /* @__PURE__ */ import_react89.default.createElement(ReusableOptions, { isOpen: isRoleModalOpen, onClose: () => setIsRoleModalOpen(false), title: "Role Filter", options: ["ALL", "ADMIN", "MANAGER", "MEMBER", "GUEST"], selectedOption: activeRoleFilter, onSelect: (role) => onRoleFilterChange(role) }), /* @__PURE__ */ import_react89.default.createElement(ReusableOptions, { isOpen: !!roleEditTarget, onClose: () => setRoleEditTarget(null), title: "Modify Access Role", options: ["ADMIN", "MANAGER", "MEMBER"], selectedOption: roleEditTarget?.role || "", onSelect: handleRoleUpdate })), activeTab === "ORGANIZATION" && isOrg && /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex flex-col gap-8 animate-in rounded-2xl p-6 bg-white fade-in duration-300" }, /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ import_react89.default.createElement("div", null, /* @__PURE__ */ import_react89.default.createElement("h2", { className: "text-black text-xl mb-1 tracking-tight" }, "Workspace Details"), /* @__PURE__ */ import_react89.default.createElement("p", { className: "text-xs text-stone-500" }, "Manage your organizational identity and handles.")), !canManage && /* @__PURE__ */ import_react89.default.createElement("span", { className: "p-2 w-9 h-9 bg-stone-100 text-stone-400 rounded-full shrink-0" }, /* @__PURE__ */ import_react89.default.createElement(import_react90.HugeiconsIcon, { icon: import_core_free_icons33.CircleLock02Icon, size: 18, className: "text-current" }))), /* @__PURE__ */ import_react89.default.createElement("form", { className: "flex flex-col gap-8 w-full max-w-5xl", onSubmit: handleSaveOrganization, autoComplete: "off" }, /* @__PURE__ */ import_react89.default.createElement(TextInput, { label: "Workspace Name", value: orgName, onChange: handleOrgNameChange, disabled: !canManage || isSavingOrg, placeholder: "Acme Corporation", maxLength: 50 }), /* @__PURE__ */ import_react89.default.createElement("div", { className: "space-y-1.5 relative w-full" }, /* @__PURE__ */ import_react89.default.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Workspace Handle"), /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex items-center relative w-full border-b border-stone-200 focus-within:border-black transition-all duration-300 overflow-hidden" }, /* @__PURE__ */ import_react89.default.createElement("input", { type: "text", value: orgSlug, disabled: !canManage || isSavingOrg, onChange: (e) => handleOrgSlugChange(e.target.value), spellCheck: "false", autoComplete: "off", className: "w-full pr-10 pl-0 py-3 text-sm bg-transparent text-black outline-none disabled:opacity-50 disabled:cursor-not-allowed", placeholder: "workspace-handle" }), /* @__PURE__ */ import_react89.default.createElement("div", { className: "absolute right-2 top-1/2 -translate-y-1/2" }, isCheckingSlug && /* @__PURE__ */ import_react89.default.createElement(InputSpinner3, null), !isCheckingSlug && canManage && orgSlug !== initialOrgSlug && orgSlug.length >= 3 && slugAvailable === false && /* @__PURE__ */ import_react89.default.createElement("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-red-100" }, /* @__PURE__ */ import_react89.default.createElement("svg", { className: "w-2 h-2 text-red-600", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ import_react89.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" }))), !isCheckingSlug && canManage && orgSlug !== initialOrgSlug && orgSlug.length >= 3 && slugAvailable === true && /* @__PURE__ */ import_react89.default.createElement("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-green-100" }, /* @__PURE__ */ import_react89.default.createElement("svg", { className: "w-2 h-2 text-green-600", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ import_react89.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M16.707 5.293a1 1 0 00-1.414 0L8 12.586 4.707 9.293a1 1 0 10-1.414 1.414l4 4a1 1 0 001.414 0l8-8a1 1 0 000-1.414z" })))))), /* @__PURE__ */ import_react89.default.createElement("div", { className: "pt-8 mt-2 flex items-center gap-4" }, /* @__PURE__ */ import_react89.default.createElement(ThreeDActionButton, { type: "submit", disabled: isOrgSaveDisabled, isLoading: isSavingOrg, className: "min-w-32" }, "Save Changes"), hasOrgChanges && !isSavingOrg && canManage && /* @__PURE__ */ import_react89.default.createElement("button", { type: "button", onClick: () => {
|
|
5642
5639
|
setOrgName(initialOrgName || "");
|
|
5643
5640
|
setOrgSlug(initialOrgSlug || "");
|
|
5644
|
-
}, className: "text-xs tracking-widest text-stone-400 hover:text-black transition-colors outline-none" }, "Cancel")))), activeTab === "ACCOUNT" && /* @__PURE__ */
|
|
5641
|
+
}, className: "text-xs tracking-widest text-stone-400 hover:text-black transition-colors outline-none" }, "Cancel")))), activeTab === "ACCOUNT" && /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in duration-300" }, /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex flex-col gap-8 rounded-2xl p-6 bg-white w-full" }, /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ import_react89.default.createElement("div", null, /* @__PURE__ */ import_react89.default.createElement("h2", { className: "text-black text-xl mb-1 tracking-tight" }, "Personal Identity"), /* @__PURE__ */ import_react89.default.createElement("p", { className: "text-xs text-stone-500" }, "Update your system display name and contact email."))), /* @__PURE__ */ import_react89.default.createElement("form", { className: "flex flex-col gap-6 w-full max-w-5xl", onSubmit: handleSaveProfile, autoComplete: "off" }, /* @__PURE__ */ import_react89.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-6" }, /* @__PURE__ */ import_react89.default.createElement(TextInput, { label: "First Name", value: firstName, onChange: (v) => setFirstName(v.replace(/[^a-zA-Z\s-]/g, "").substring(0, 50)), disabled: isSavingProfile, placeholder: "First name", maxLength: 50 }), /* @__PURE__ */ import_react89.default.createElement(TextInput, { label: "Last Name", value: lastName, onChange: (v) => setLastName(v.replace(/[^a-zA-Z\s-]/g, "").substring(0, 50)), disabled: isSavingProfile, placeholder: "Last name", maxLength: 50 })), /* @__PURE__ */ import_react89.default.createElement("div", { className: "space-y-1.5 w-full" }, /* @__PURE__ */ import_react89.default.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Email Address"), /* @__PURE__ */ import_react89.default.createElement("input", { type: "email", value: initialEmail, disabled: true, className: "w-full pb-3 pt-3 text-sm bg-transparent text-stone-400 border-b border-stone-200 outline-none cursor-not-allowed" })), /* @__PURE__ */ import_react89.default.createElement("div", { className: "pt-4 flex items-center gap-4" }, /* @__PURE__ */ import_react89.default.createElement(ThreeDActionButton, { type: "submit", disabled: isProfileSaveDisabled, isLoading: isSavingProfile, className: "min-w-32" }, "Update Identity")))), /* @__PURE__ */ import_react89.default.createElement("div", { className: "bg-white rounded-2xl p-6 w-full flex flex-col sm:flex-row sm:items-center justify-between gap-6 border border-stone-100" }, /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex flex-col items-start max-w-sm" }, /* @__PURE__ */ import_react89.default.createElement("p", { className: "text-xs text-stone-400 tracking-[0.2em] mb-2 uppercase" }, "AI Credits Balance"), isBillingLoading ? /* @__PURE__ */ import_react89.default.createElement("div", { className: "h-8 w-32 bg-stone-100 animate-pulse rounded mt-1" }) : /* @__PURE__ */ import_react89.default.createElement("div", { className: "flex items-center gap-2 mt-1" }, /* @__PURE__ */ import_react89.default.createElement(import_react90.HugeiconsIcon, { icon: import_core_free_icons33.Coins01Icon, size: 28, className: "text-[#d97757]" }), /* @__PURE__ */ import_react89.default.createElement("span", { className: "text-3xl text-black tracking-tight" }, aiCredits)), /* @__PURE__ */ import_react89.default.createElement("p", { className: "text-xs text-stone-500 mt-4 leading-relaxed" }, "AI credits are consumed when generating intelligent summaries, transcriptions, and automated huddle insights.")), /* @__PURE__ */ import_react89.default.createElement("button", { onClick: onTopUp, className: "w-12 h-12 rounded-full border border-stone-200 flex items-center justify-center text-black hover:bg-stone-50 transition-colors outline-none shrink-0", "aria-label": "Top Up Credits" }, /* @__PURE__ */ import_react89.default.createElement(import_react90.HugeiconsIcon, { icon: import_core_free_icons33.PlusSignIcon, size: 20 })))));
|
|
5645
5642
|
};
|
|
5646
5643
|
|
|
5647
5644
|
// src/components/UniversalCreateHuddle.tsx
|
|
5648
|
-
var
|
|
5645
|
+
var import_react91 = __toESM(require("react"));
|
|
5649
5646
|
var import_react_hot_toast16 = __toESM(require("react-hot-toast"));
|
|
5650
|
-
var
|
|
5651
|
-
var
|
|
5647
|
+
var import_react92 = require("@hugeicons/react");
|
|
5648
|
+
var import_core_free_icons34 = require("@hugeicons/core-free-icons");
|
|
5652
5649
|
var MemberAvatar4 = ({ src, sizeClass = "w-10 h-10" }) => {
|
|
5653
|
-
const [loaded, setLoaded] = (0,
|
|
5654
|
-
const [error, setError] = (0,
|
|
5650
|
+
const [loaded, setLoaded] = (0, import_react91.useState)(false);
|
|
5651
|
+
const [error, setError] = (0, import_react91.useState)(false);
|
|
5655
5652
|
const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/avatar.avif";
|
|
5656
|
-
return /* @__PURE__ */
|
|
5653
|
+
return /* @__PURE__ */ import_react91.default.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ import_react91.default.createElement("div", { className: "w-full h-full rounded-lg bg-stone-100 flex items-center justify-center overflow-hidden" }, !loaded && !error && /* @__PURE__ */ import_react91.default.createElement(import_react92.HugeiconsIcon, { icon: import_core_free_icons34.Loading03Icon, className: "animate-spin text-stone-400 absolute", size: 14 }), /* @__PURE__ */ import_react91.default.createElement(
|
|
5657
5654
|
"img",
|
|
5658
5655
|
{
|
|
5659
5656
|
src: error || !src ? defaultAvatar : src,
|
|
@@ -5694,28 +5691,28 @@ var UniversalCreateHuddle = ({
|
|
|
5694
5691
|
onCreateSubmit
|
|
5695
5692
|
}) => {
|
|
5696
5693
|
const canManage = userRole === "ADMIN" || userRole === "MANAGER" || userRole === "OWNER";
|
|
5697
|
-
const [huddleDate, setHuddleDate] = (0,
|
|
5694
|
+
const [huddleDate, setHuddleDate] = (0, import_react91.useState)(() => {
|
|
5698
5695
|
const d = /* @__PURE__ */ new Date();
|
|
5699
5696
|
d.setHours(d.getHours() + 1, 0, 0, 0);
|
|
5700
5697
|
return d;
|
|
5701
5698
|
});
|
|
5702
|
-
const [title, setTitle] = (0,
|
|
5703
|
-
const [isPrivate, setIsPrivate] = (0,
|
|
5704
|
-
const [timezone, setTimezone] = (0,
|
|
5705
|
-
(0,
|
|
5699
|
+
const [title, setTitle] = (0, import_react91.useState)("");
|
|
5700
|
+
const [isPrivate, setIsPrivate] = (0, import_react91.useState)(false);
|
|
5701
|
+
const [timezone, setTimezone] = (0, import_react91.useState)("UTC");
|
|
5702
|
+
(0, import_react91.useEffect)(() => {
|
|
5706
5703
|
try {
|
|
5707
5704
|
setTimezone(Intl.DateTimeFormat().resolvedOptions().timeZone);
|
|
5708
5705
|
} catch (e) {
|
|
5709
5706
|
}
|
|
5710
5707
|
}, []);
|
|
5711
|
-
const [calendarMode, setCalendarMode] = (0,
|
|
5712
|
-
const [showTimezoneModal, setShowTimezoneModal] = (0,
|
|
5713
|
-
const [showMembersModal, setShowMembersModal] = (0,
|
|
5714
|
-
const [selectedParticipants, setSelectedParticipants] = (0,
|
|
5715
|
-
const [isSubmitting, setIsSubmitting] = (0,
|
|
5716
|
-
const [localSearchQuery, setLocalSearchQuery] = (0,
|
|
5717
|
-
const [isTyping, setIsTyping] = (0,
|
|
5718
|
-
const typingTimer = (0,
|
|
5708
|
+
const [calendarMode, setCalendarMode] = (0, import_react91.useState)(null);
|
|
5709
|
+
const [showTimezoneModal, setShowTimezoneModal] = (0, import_react91.useState)(false);
|
|
5710
|
+
const [showMembersModal, setShowMembersModal] = (0, import_react91.useState)(false);
|
|
5711
|
+
const [selectedParticipants, setSelectedParticipants] = (0, import_react91.useState)(/* @__PURE__ */ new Set());
|
|
5712
|
+
const [isSubmitting, setIsSubmitting] = (0, import_react91.useState)(false);
|
|
5713
|
+
const [localSearchQuery, setLocalSearchQuery] = (0, import_react91.useState)(membersSearchQuery);
|
|
5714
|
+
const [isTyping, setIsTyping] = (0, import_react91.useState)(false);
|
|
5715
|
+
const typingTimer = (0, import_react91.useRef)(null);
|
|
5719
5716
|
const handleSearchInput = (e) => {
|
|
5720
5717
|
const val = e.target.value;
|
|
5721
5718
|
setLocalSearchQuery(val);
|
|
@@ -5753,7 +5750,7 @@ var UniversalCreateHuddle = ({
|
|
|
5753
5750
|
setIsSubmitting(false);
|
|
5754
5751
|
}
|
|
5755
5752
|
};
|
|
5756
|
-
return /* @__PURE__ */
|
|
5753
|
+
return /* @__PURE__ */ import_react91.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 relative" }, /* @__PURE__ */ import_react91.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react91.default.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ import_react91.default.createElement("a", { href: onBackHref, className: "flex items-center gap-2 text-[#d97757] hover:text-[#d97757] transition-colors text-sm outline-none" }, /* @__PURE__ */ import_react91.default.createElement(import_react92.HugeiconsIcon, { icon: import_core_free_icons34.ArrowLeft01Icon, size: 16 }), " Back")), /* @__PURE__ */ import_react91.default.createElement("div", { className: "flex flex-col gap-1 mb-8 px-1" }, /* @__PURE__ */ import_react91.default.createElement("h1", { className: "text-black text-xl tracking-tight" }, "Create Huddle"), /* @__PURE__ */ import_react91.default.createElement("p", { className: "text-xs text-stone-500" }, "Schedule a new workspace huddle and manage participant access.")), /* @__PURE__ */ import_react91.default.createElement("div", { className: "flex flex-col gap-8 animate-in rounded-2xl p-6 bg-white fade-in duration-300" }, /* @__PURE__ */ import_react91.default.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSubmit, autoComplete: "off" }, !canManage && /* @__PURE__ */ import_react91.default.createElement("div", { className: "flex items-start gap-3 p-4 bg-stone-50 rounded-xl" }, /* @__PURE__ */ import_react91.default.createElement(import_react92.HugeiconsIcon, { icon: import_core_free_icons34.CircleLock02Icon, size: 20, className: "text-stone-500 shrink-0 mt-0.5" }), /* @__PURE__ */ import_react91.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react91.default.createElement("span", { className: "text-sm text-black tracking-tight" }, "Access Restricted"), /* @__PURE__ */ import_react91.default.createElement("span", { className: "text-xs text-stone-500 mt-1 leading-relaxed" }, "You do not have sufficient permissions to access this page. Contact organization admin or manager."))), /* @__PURE__ */ import_react91.default.createElement(
|
|
5757
5754
|
TextInput,
|
|
5758
5755
|
{
|
|
5759
5756
|
label: "Huddle Subject",
|
|
@@ -5763,31 +5760,31 @@ var UniversalCreateHuddle = ({
|
|
|
5763
5760
|
placeholder: "e.g. Q4 Engineering Sync",
|
|
5764
5761
|
maxLength: 80
|
|
5765
5762
|
}
|
|
5766
|
-
), /* @__PURE__ */
|
|
5763
|
+
), /* @__PURE__ */ import_react91.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-3 gap-6" }, /* @__PURE__ */ import_react91.default.createElement("div", { className: "space-y-1.5 w-full" }, /* @__PURE__ */ import_react91.default.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Date"), /* @__PURE__ */ import_react91.default.createElement(
|
|
5767
5764
|
"div",
|
|
5768
5765
|
{
|
|
5769
5766
|
onClick: () => canManage && !isSubmitting && setCalendarMode("DATE"),
|
|
5770
5767
|
className: `flex items-center relative w-full border-b border-stone-200 transition-all duration-300 pb-3 pt-3 ${!canManage || isSubmitting ? "opacity-50 pointer-events-none" : "hover:border-black cursor-pointer"}`
|
|
5771
5768
|
},
|
|
5772
|
-
/* @__PURE__ */
|
|
5773
|
-
/* @__PURE__ */
|
|
5774
|
-
)), /* @__PURE__ */
|
|
5769
|
+
/* @__PURE__ */ import_react91.default.createElement(import_react92.HugeiconsIcon, { icon: import_core_free_icons34.Calendar01Icon, size: 16, className: "text-stone-400 absolute left-0" }),
|
|
5770
|
+
/* @__PURE__ */ import_react91.default.createElement("span", { className: "w-full pl-8 text-sm text-black truncate block" }, huddleDate.toLocaleDateString("en-GB", { day: "2-digit", month: "short", year: "numeric" }))
|
|
5771
|
+
)), /* @__PURE__ */ import_react91.default.createElement("div", { className: "space-y-1.5 w-full" }, /* @__PURE__ */ import_react91.default.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Time"), /* @__PURE__ */ import_react91.default.createElement(
|
|
5775
5772
|
"div",
|
|
5776
5773
|
{
|
|
5777
5774
|
onClick: () => canManage && !isSubmitting && setCalendarMode("TIME"),
|
|
5778
5775
|
className: `flex items-center relative w-full border-b border-stone-200 transition-all duration-300 pb-3 pt-3 ${!canManage || isSubmitting ? "opacity-50 pointer-events-none" : "hover:border-black cursor-pointer"}`
|
|
5779
5776
|
},
|
|
5780
|
-
/* @__PURE__ */
|
|
5781
|
-
/* @__PURE__ */
|
|
5782
|
-
)), /* @__PURE__ */
|
|
5777
|
+
/* @__PURE__ */ import_react91.default.createElement(import_react92.HugeiconsIcon, { icon: import_core_free_icons34.Clock01Icon, size: 16, className: "text-stone-400 absolute left-0" }),
|
|
5778
|
+
/* @__PURE__ */ import_react91.default.createElement("span", { className: "w-full pl-8 text-sm text-black truncate block" }, huddleDate.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }))
|
|
5779
|
+
)), /* @__PURE__ */ import_react91.default.createElement("div", { className: "space-y-1.5 w-full" }, /* @__PURE__ */ import_react91.default.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Timezone"), /* @__PURE__ */ import_react91.default.createElement(
|
|
5783
5780
|
"div",
|
|
5784
5781
|
{
|
|
5785
5782
|
onClick: () => canManage && !isSubmitting && setShowTimezoneModal(true),
|
|
5786
5783
|
className: `flex items-center relative w-full border-b border-stone-200 transition-all duration-300 pb-3 pt-3 ${!canManage || isSubmitting ? "opacity-50 pointer-events-none" : "hover:border-black cursor-pointer"}`
|
|
5787
5784
|
},
|
|
5788
|
-
/* @__PURE__ */
|
|
5789
|
-
/* @__PURE__ */
|
|
5790
|
-
))), /* @__PURE__ */
|
|
5785
|
+
/* @__PURE__ */ import_react91.default.createElement(import_react92.HugeiconsIcon, { icon: import_core_free_icons34.Globe02Icon, size: 16, className: "text-stone-400 absolute left-0" }),
|
|
5786
|
+
/* @__PURE__ */ import_react91.default.createElement("span", { className: "w-full pl-8 text-sm text-black truncate block" }, timezone)
|
|
5787
|
+
))), /* @__PURE__ */ import_react91.default.createElement("div", { className: `flex items-center justify-between py-2 mt-2 ${!canManage ? "opacity-50 pointer-events-none" : ""}` }, /* @__PURE__ */ import_react91.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react91.default.createElement("span", { className: "text-sm text-black tracking-tight" }, "Private Huddle"), /* @__PURE__ */ import_react91.default.createElement("span", { className: "text-xs text-stone-500" }, "Only invited members can join.")), /* @__PURE__ */ import_react91.default.createElement(
|
|
5791
5788
|
"button",
|
|
5792
5789
|
{
|
|
5793
5790
|
type: "button",
|
|
@@ -5795,8 +5792,8 @@ var UniversalCreateHuddle = ({
|
|
|
5795
5792
|
disabled: !canManage || isSubmitting,
|
|
5796
5793
|
className: `relative w-11 h-6 rounded-full transition-colors outline-none shrink-0 ${isPrivate ? "bg-[#d97757]" : "bg-stone-200"}`
|
|
5797
5794
|
},
|
|
5798
|
-
/* @__PURE__ */
|
|
5799
|
-
)), isPrivate && /* @__PURE__ */
|
|
5795
|
+
/* @__PURE__ */ import_react91.default.createElement("div", { className: `absolute top-1 left-1 bg-white w-4 h-4 rounded-full transition-transform ${isPrivate ? "translate-x-5" : "translate-x-0"}` })
|
|
5796
|
+
)), isPrivate && /* @__PURE__ */ import_react91.default.createElement("div", { className: `flex items-center justify-between animate-in fade-in zoom-in-95 duration-200 bg-stone-50 p-4 rounded-xl ${!canManage ? "opacity-50" : ""}` }, /* @__PURE__ */ import_react91.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react91.default.createElement("span", { className: "text-xs text-black tracking-tight" }, "Participants"), /* @__PURE__ */ import_react91.default.createElement("span", { className: "text-xs text-[#d97757] " }, selectedParticipants.size === 0 ? "0 added" : selectedParticipants.size >= 1e3 ? `${(selectedParticipants.size / 1e3).toFixed(1)}k+ added` : `${selectedParticipants.size} added`)), /* @__PURE__ */ import_react91.default.createElement(
|
|
5800
5797
|
"button",
|
|
5801
5798
|
{
|
|
5802
5799
|
type: "button",
|
|
@@ -5805,7 +5802,7 @@ var UniversalCreateHuddle = ({
|
|
|
5805
5802
|
className: "px-4 py-2 border border-stone-200 text-black text-xs tracking-wide rounded-full hover:bg-white transition-colors outline-none bg-transparent disabled:cursor-not-allowed"
|
|
5806
5803
|
},
|
|
5807
5804
|
"Manage Access"
|
|
5808
|
-
)), canManage && /* @__PURE__ */
|
|
5805
|
+
)), canManage && /* @__PURE__ */ import_react91.default.createElement("div", { className: "pt-6" }, /* @__PURE__ */ import_react91.default.createElement(
|
|
5809
5806
|
ThreeDActionButton,
|
|
5810
5807
|
{
|
|
5811
5808
|
type: "submit",
|
|
@@ -5814,7 +5811,7 @@ var UniversalCreateHuddle = ({
|
|
|
5814
5811
|
className: "w-full sm:w-auto min-w-40"
|
|
5815
5812
|
},
|
|
5816
5813
|
"Schedule Huddle"
|
|
5817
|
-
)))), canManage && /* @__PURE__ */
|
|
5814
|
+
)))), canManage && /* @__PURE__ */ import_react91.default.createElement(import_react91.default.Fragment, null, /* @__PURE__ */ import_react91.default.createElement(
|
|
5818
5815
|
CalendarPicker,
|
|
5819
5816
|
{
|
|
5820
5817
|
isOpen: calendarMode !== null,
|
|
@@ -5823,7 +5820,7 @@ var UniversalCreateHuddle = ({
|
|
|
5823
5820
|
defaultMode: calendarMode || "DATE",
|
|
5824
5821
|
onConfirm: (d) => setHuddleDate(d)
|
|
5825
5822
|
}
|
|
5826
|
-
), /* @__PURE__ */
|
|
5823
|
+
), /* @__PURE__ */ import_react91.default.createElement(
|
|
5827
5824
|
ReusableOptions,
|
|
5828
5825
|
{
|
|
5829
5826
|
isOpen: showTimezoneModal,
|
|
@@ -5834,7 +5831,7 @@ var UniversalCreateHuddle = ({
|
|
|
5834
5831
|
onSelect: (tz) => setTimezone(tz),
|
|
5835
5832
|
showSearch: true
|
|
5836
5833
|
}
|
|
5837
|
-
)), showMembersModal && canManage && /* @__PURE__ */
|
|
5834
|
+
)), showMembersModal && canManage && /* @__PURE__ */ import_react91.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react91.default.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowMembersModal(false) }), /* @__PURE__ */ import_react91.default.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 h-[80vh]" }, /* @__PURE__ */ import_react91.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react91.default.createElement("h3", { className: "text-sm text-black tracking-tight" }, "Select Participants"), /* @__PURE__ */ import_react91.default.createElement("button", { onClick: () => setShowMembersModal(false), className: "text-[#d97757] hover:text-[#d97757] transition-colors outline-none text-sm " }, "Done")), /* @__PURE__ */ import_react91.default.createElement("div", { className: "p-4 shrink-0 " }, /* @__PURE__ */ import_react91.default.createElement("div", { className: "relative w-full" }, /* @__PURE__ */ import_react91.default.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ import_react91.default.createElement(import_react92.HugeiconsIcon, { icon: import_core_free_icons34.Search01Icon, size: 16, className: "text-stone-400" })), /* @__PURE__ */ import_react91.default.createElement(
|
|
5838
5835
|
"input",
|
|
5839
5836
|
{
|
|
5840
5837
|
type: "text",
|
|
@@ -5843,34 +5840,34 @@ var UniversalCreateHuddle = ({
|
|
|
5843
5840
|
onChange: handleSearchInput,
|
|
5844
5841
|
className: "w-full pl-10 pr-4 py-2.5 bg-stone-100 rounded-full text-sm text-black placeholder-stone-400 outline-none focus:bg-stone-200 transition-colors"
|
|
5845
5842
|
}
|
|
5846
|
-
))), /* @__PURE__ */
|
|
5843
|
+
))), /* @__PURE__ */ import_react91.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2 relative" }, isMembersLoading || isTyping ? /* @__PURE__ */ import_react91.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center" }, /* @__PURE__ */ import_react91.default.createElement(import_react92.HugeiconsIcon, { icon: import_core_free_icons34.Loading03Icon, size: 28, className: "animate-spin text-black" })) : members.length === 0 ? /* @__PURE__ */ import_react91.default.createElement("div", { className: "p-8 text-center text-xs text-stone-400" }, "No members found.") : members.map((member) => {
|
|
5847
5844
|
const isChecked = selectedParticipants.has(member.userId);
|
|
5848
|
-
return /* @__PURE__ */
|
|
5845
|
+
return /* @__PURE__ */ import_react91.default.createElement(
|
|
5849
5846
|
"div",
|
|
5850
5847
|
{
|
|
5851
5848
|
key: member.id,
|
|
5852
5849
|
onClick: () => toggleParticipant(member.userId),
|
|
5853
5850
|
className: "flex items-center justify-between p-3 rounded-xl cursor-pointer hover:bg-stone-50 transition-colors select-none"
|
|
5854
5851
|
},
|
|
5855
|
-
/* @__PURE__ */
|
|
5856
|
-
/* @__PURE__ */
|
|
5852
|
+
/* @__PURE__ */ import_react91.default.createElement("div", { className: "flex items-center gap-3 min-w-0 flex-1" }, /* @__PURE__ */ import_react91.default.createElement(MemberAvatar4, { src: member.avatarUrl, sizeClass: "w-9 h-9" }), /* @__PURE__ */ import_react91.default.createElement("div", { className: "flex flex-col min-w-0 flex-1" }, /* @__PURE__ */ import_react91.default.createElement("span", { className: "text-sm text-black truncate" }, member.fullName), /* @__PURE__ */ import_react91.default.createElement("span", { className: "text-xs text-stone-400 capitalize truncate" }, member.role.toLowerCase()))),
|
|
5853
|
+
/* @__PURE__ */ import_react91.default.createElement("div", { className: "shrink-0 pl-3" }, /* @__PURE__ */ import_react91.default.createElement("div", { className: `w-5 h-5 rounded-full flex items-center justify-center transition-colors ${isChecked ? "bg-[#d97757]" : "border border-stone-300 bg-white"}` }, isChecked && /* @__PURE__ */ import_react91.default.createElement(import_react92.HugeiconsIcon, { icon: import_core_free_icons34.Tick02Icon, size: 14, className: "text-white" })))
|
|
5857
5854
|
);
|
|
5858
|
-
})), /* @__PURE__ */
|
|
5855
|
+
})), /* @__PURE__ */ import_react91.default.createElement("div", { className: "p-4 flex items-center justify-between shrink-0 bg-white" }, /* @__PURE__ */ import_react91.default.createElement("span", { className: "text-xs text-stone-400 tracking-widest" }, "Page ", membersCurrentPage, " of ", membersTotalPages === 0 ? 1 : membersTotalPages), /* @__PURE__ */ import_react91.default.createElement("div", { className: "flex gap-1" }, /* @__PURE__ */ import_react91.default.createElement(
|
|
5859
5856
|
"button",
|
|
5860
5857
|
{
|
|
5861
5858
|
disabled: membersCurrentPage <= 1 || isMembersLoading,
|
|
5862
5859
|
onClick: () => onMembersPageChange(membersCurrentPage - 1),
|
|
5863
5860
|
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-stone-200 text-stone-600 disabled:opacity-30 outline-none hover:bg-stone-50 transition-colors"
|
|
5864
5861
|
},
|
|
5865
|
-
/* @__PURE__ */
|
|
5866
|
-
), /* @__PURE__ */
|
|
5862
|
+
/* @__PURE__ */ import_react91.default.createElement(import_react92.HugeiconsIcon, { icon: import_core_free_icons34.ArrowLeft01Icon, size: 12 })
|
|
5863
|
+
), /* @__PURE__ */ import_react91.default.createElement(
|
|
5867
5864
|
"button",
|
|
5868
5865
|
{
|
|
5869
5866
|
disabled: membersCurrentPage >= membersTotalPages || membersTotalPages === 0 || isMembersLoading,
|
|
5870
5867
|
onClick: () => onMembersPageChange(membersCurrentPage + 1),
|
|
5871
5868
|
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-stone-200 text-stone-600 disabled:opacity-30 outline-none hover:bg-stone-50 transition-colors"
|
|
5872
5869
|
},
|
|
5873
|
-
/* @__PURE__ */
|
|
5870
|
+
/* @__PURE__ */ import_react91.default.createElement(import_react92.HugeiconsIcon, { icon: import_core_free_icons34.ArrowRight01Icon, size: 12 })
|
|
5874
5871
|
))))));
|
|
5875
5872
|
};
|
|
5876
5873
|
// Annotate the CommonJS export names for ESM import in node:
|