@retinalabsllc/zairusjs 9.0.25 → 9.0.40
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.d.mts +15 -5
- package/dist/index.d.ts +15 -5
- package/dist/index.js +415 -286
- package/dist/index.mjs +348 -218
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -670,7 +670,7 @@ var import_react10 = require("@hugeicons/react");
|
|
|
670
670
|
var MobileNav = ({ items }) => {
|
|
671
671
|
const pathname = (0, import_navigation3.usePathname)();
|
|
672
672
|
if (!items || items.length === 0) return null;
|
|
673
|
-
return /* @__PURE__ */ import_react9.default.createElement("div", { className: "fixed bottom-6 inset-x-0 z-100 flex justify-center pointer-events-none px-3 animate-in slide-in-from-bottom-8 fade-in duration-500" }, /* @__PURE__ */ import_react9.default.createElement("nav", { className: "pointer-events-auto w-full max-w-sm bg-white/
|
|
673
|
+
return /* @__PURE__ */ import_react9.default.createElement("div", { className: "fixed bottom-6 inset-x-0 z-100 flex justify-center pointer-events-none px-3 animate-in slide-in-from-bottom-8 fade-in duration-500" }, /* @__PURE__ */ import_react9.default.createElement("nav", { className: "pointer-events-auto w-full max-w-sm bg-white/50 backdrop-blur-xl shadow-[0_8px_30px_rgb(0,0,0,0.08)] rounded-full px-6 py-2.5 flex items-center justify-between" }, items.map((item) => {
|
|
674
674
|
const isActive = item.href === "/" ? pathname === "/" : pathname?.startsWith(item.href);
|
|
675
675
|
return /* @__PURE__ */ import_react9.default.createElement(
|
|
676
676
|
import_link4.default,
|
|
@@ -1642,9 +1642,9 @@ var UniversalWalletPage = ({
|
|
|
1642
1642
|
};
|
|
1643
1643
|
|
|
1644
1644
|
// src/components/UniversalCardPage.tsx
|
|
1645
|
-
var
|
|
1646
|
-
var
|
|
1647
|
-
var
|
|
1645
|
+
var import_react35 = __toESM(require("react"));
|
|
1646
|
+
var import_react36 = require("@hugeicons/react");
|
|
1647
|
+
var import_core_free_icons13 = require("@hugeicons/core-free-icons");
|
|
1648
1648
|
|
|
1649
1649
|
// src/components/ConfirmationDialog.tsx
|
|
1650
1650
|
var import_react29 = __toESM(require("react"));
|
|
@@ -1745,14 +1745,14 @@ var PinDialerBottomSheet = ({
|
|
|
1745
1745
|
{
|
|
1746
1746
|
key: num,
|
|
1747
1747
|
onClick: () => handlePinPress(num),
|
|
1748
|
-
className: "w-14 h-14 rounded-full flex
|
|
1748
|
+
className: "w-14 h-14 rounded-full flex bg-neutral-50 items-center justify-center text-sm text-black hover:bg-neutral-50 transition-colors mx-auto outline-none active:scale-95"
|
|
1749
1749
|
},
|
|
1750
1750
|
num
|
|
1751
1751
|
)), /* @__PURE__ */ import_react31.default.createElement("div", null), " ", /* @__PURE__ */ import_react31.default.createElement(
|
|
1752
1752
|
"button",
|
|
1753
1753
|
{
|
|
1754
1754
|
onClick: () => handlePinPress(0),
|
|
1755
|
-
className: "w-14 h-14 rounded-full flex
|
|
1755
|
+
className: "w-14 h-14 rounded-full flex bg-neutral-50 items-center justify-center text-sm text-black hover:bg-neutral-50 transition-colors mx-auto outline-none active:scale-95"
|
|
1756
1756
|
},
|
|
1757
1757
|
"0"
|
|
1758
1758
|
), /* @__PURE__ */ import_react31.default.createElement(
|
|
@@ -1761,49 +1761,98 @@ var PinDialerBottomSheet = ({
|
|
|
1761
1761
|
onClick: () => handlePinPress("del"),
|
|
1762
1762
|
className: "w-14 h-14 rounded-full flex items-center justify-center text-neutral-400 hover:text-black hover:bg-neutral-50 transition-colors mx-auto outline-none active:scale-95"
|
|
1763
1763
|
},
|
|
1764
|
-
/* @__PURE__ */ import_react31.default.createElement(import_react32.HugeiconsIcon, { icon: import_core_free_icons11.
|
|
1764
|
+
/* @__PURE__ */ import_react31.default.createElement(import_react32.HugeiconsIcon, { icon: import_core_free_icons11.LessThanIcon, size: 20 })
|
|
1765
1765
|
)))));
|
|
1766
1766
|
};
|
|
1767
1767
|
|
|
1768
|
+
// src/components/CardAction.tsx
|
|
1769
|
+
var import_react33 = __toESM(require("react"));
|
|
1770
|
+
var import_react34 = require("@hugeicons/react");
|
|
1771
|
+
var import_core_free_icons12 = require("@hugeicons/core-free-icons");
|
|
1772
|
+
var CardActionDialog = ({
|
|
1773
|
+
isOpen,
|
|
1774
|
+
card,
|
|
1775
|
+
actionType,
|
|
1776
|
+
onClose,
|
|
1777
|
+
onProceed
|
|
1778
|
+
}) => {
|
|
1779
|
+
if (!isOpen || !card) return null;
|
|
1780
|
+
const title = actionType === "ACTIVATE" ? "Activate Card" : "Create New Card";
|
|
1781
|
+
const description = actionType === "ACTIVATE" ? `You are about to activate your ${card.type.toLowerCase()} card. Once activated, you can view details and set limits.` : `Your current ${card.type.toLowerCase()} card is ${card.status.toLowerCase()}. You need to provision a new one to continue.`;
|
|
1782
|
+
return /* @__PURE__ */ import_react33.default.createElement("div", { className: "fixed inset-0 z-150 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react33.default.createElement(
|
|
1783
|
+
"div",
|
|
1784
|
+
{
|
|
1785
|
+
className: "absolute inset-0 bg-black/40 animate-in fade-in duration-200",
|
|
1786
|
+
onClick: onClose
|
|
1787
|
+
}
|
|
1788
|
+
), /* @__PURE__ */ import_react33.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_react33.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react33.default.createElement(import_react34.HugeiconsIcon, { icon: import_core_free_icons12.CreditCardIcon, size: 20, className: "text-black" }), /* @__PURE__ */ import_react33.default.createElement("h3", { className: "text-[16px] text-black font-medium tracking-tight" }, title)), /* @__PURE__ */ import_react33.default.createElement(
|
|
1789
|
+
"button",
|
|
1790
|
+
{
|
|
1791
|
+
onClick: onClose,
|
|
1792
|
+
className: "text-neutral-400 hover:text-black transition-colors outline-none"
|
|
1793
|
+
},
|
|
1794
|
+
/* @__PURE__ */ import_react33.default.createElement(import_react34.HugeiconsIcon, { icon: import_core_free_icons12.CancelCircleIcon, size: 20 })
|
|
1795
|
+
)), /* @__PURE__ */ import_react33.default.createElement("div", { className: "p-6 text-center" }, /* @__PURE__ */ import_react33.default.createElement("p", { className: "text-[13px] text-neutral-500 leading-relaxed mb-6" }, description), /* @__PURE__ */ import_react33.default.createElement(
|
|
1796
|
+
"button",
|
|
1797
|
+
{
|
|
1798
|
+
onClick: onProceed,
|
|
1799
|
+
className: "w-full py-3.5 bg-black text-white text-[13px] font-medium rounded-xl hover:bg-neutral-800 transition-colors outline-none active:scale-95"
|
|
1800
|
+
},
|
|
1801
|
+
actionType === "ACTIVATE" ? "Activate Now" : "Create Card"
|
|
1802
|
+
))));
|
|
1803
|
+
};
|
|
1804
|
+
|
|
1768
1805
|
// src/components/UniversalCardPage.tsx
|
|
1769
1806
|
var UniversalCardPage = ({
|
|
1770
|
-
|
|
1771
|
-
cardNumber,
|
|
1772
|
-
expiry,
|
|
1773
|
-
cvv,
|
|
1774
|
-
cardBgSrc,
|
|
1775
|
-
backgroundOverlay,
|
|
1776
|
-
companyLogoSrc,
|
|
1777
|
-
networkLogoSrc,
|
|
1807
|
+
cards = [],
|
|
1778
1808
|
onReveal,
|
|
1779
1809
|
onFreeze,
|
|
1780
1810
|
onSetLimits,
|
|
1781
|
-
onDelete
|
|
1811
|
+
onDelete,
|
|
1812
|
+
onCardAction
|
|
1782
1813
|
}) => {
|
|
1783
|
-
const [
|
|
1784
|
-
const
|
|
1785
|
-
|
|
1786
|
-
|
|
1787
|
-
|
|
1788
|
-
|
|
1789
|
-
const [
|
|
1790
|
-
const [
|
|
1791
|
-
const [
|
|
1792
|
-
(0,
|
|
1793
|
-
|
|
1814
|
+
const [activeTabIndex, setActiveTabIndex] = (0, import_react35.useState)(0);
|
|
1815
|
+
const activeCard = cards[activeTabIndex];
|
|
1816
|
+
(0, import_react35.useEffect)(() => {
|
|
1817
|
+
setIsFlipped(false);
|
|
1818
|
+
setIsRevealed(false);
|
|
1819
|
+
}, [activeTabIndex]);
|
|
1820
|
+
const [isFlipped, setIsFlipped] = (0, import_react35.useState)(false);
|
|
1821
|
+
const [isBgLoaded, setIsBgLoaded] = (0, import_react35.useState)(false);
|
|
1822
|
+
const [isRevealed, setIsRevealed] = (0, import_react35.useState)(false);
|
|
1823
|
+
const [isRevealing, setIsRevealing] = (0, import_react35.useState)(false);
|
|
1824
|
+
const [isFreezing, setIsFreezing] = (0, import_react35.useState)(false);
|
|
1825
|
+
const [isOverlayActionLoading, setIsOverlayActionLoading] = (0, import_react35.useState)(false);
|
|
1826
|
+
const [showDeleteDialog, setShowDeleteDialog] = (0, import_react35.useState)(false);
|
|
1827
|
+
const [isDeleting, setIsDeleting] = (0, import_react35.useState)(false);
|
|
1828
|
+
const [showPinDialer, setShowPinDialer] = (0, import_react35.useState)(false);
|
|
1829
|
+
const [showCardActionDialog, setShowCardActionDialog] = (0, import_react35.useState)(false);
|
|
1830
|
+
const [cardActionType, setCardActionType] = (0, import_react35.useState)("ACTIVATE");
|
|
1831
|
+
(0, import_react35.useEffect)(() => {
|
|
1832
|
+
setIsBgLoaded(false);
|
|
1833
|
+
if (!activeCard?.cardBgSrc) return;
|
|
1794
1834
|
const img = new Image();
|
|
1795
|
-
img.src = cardBgSrc;
|
|
1835
|
+
img.src = activeCard.cardBgSrc;
|
|
1796
1836
|
img.onload = () => {
|
|
1797
1837
|
setTimeout(() => setIsBgLoaded(true), 300);
|
|
1798
1838
|
};
|
|
1799
|
-
}, [cardBgSrc]);
|
|
1839
|
+
}, [activeCard?.cardBgSrc]);
|
|
1840
|
+
if (!activeCard) return /* @__PURE__ */ import_react35.default.createElement("div", { className: "text-center p-8 text-neutral-500" }, "No cards available");
|
|
1841
|
+
const isActivated = activeCard.status === "ACTIVATED";
|
|
1842
|
+
const isFrozen = activeCard.status === "FROZEN";
|
|
1843
|
+
const isUnactivated = activeCard.status === "UNACTIVATED";
|
|
1844
|
+
const isDead = ["BLOCKED", "EXPIRED", "DELETED"].includes(activeCard.status);
|
|
1845
|
+
const canFlip = isBgLoaded && isActivated;
|
|
1846
|
+
const actionsDisabled = !isActivated && !isFrozen;
|
|
1847
|
+
const revealDisabled = !isActivated;
|
|
1848
|
+
const freezeDisabled = isUnactivated || isDead;
|
|
1800
1849
|
const handleToggleReveal = () => {
|
|
1801
|
-
if (isRevealing) return;
|
|
1850
|
+
if (revealDisabled || isRevealing) return;
|
|
1802
1851
|
if (isRevealed) {
|
|
1803
1852
|
setIsRevealed(false);
|
|
1804
1853
|
setIsRevealing(true);
|
|
1805
1854
|
setTimeout(() => {
|
|
1806
|
-
if (onReveal) onReveal();
|
|
1855
|
+
if (onReveal) onReveal(activeCard.id);
|
|
1807
1856
|
setIsRevealing(false);
|
|
1808
1857
|
}, 800);
|
|
1809
1858
|
} else {
|
|
@@ -1815,67 +1864,125 @@ var UniversalCardPage = ({
|
|
|
1815
1864
|
setTimeout(() => {
|
|
1816
1865
|
setShowPinDialer(false);
|
|
1817
1866
|
setIsRevealed(true);
|
|
1818
|
-
if (onReveal) onReveal();
|
|
1867
|
+
if (onReveal) onReveal(activeCard.id);
|
|
1819
1868
|
setIsRevealing(false);
|
|
1820
1869
|
}, 1e3);
|
|
1821
1870
|
};
|
|
1822
1871
|
const handleToggleFreeze = () => {
|
|
1823
|
-
if (isFreezing) return;
|
|
1872
|
+
if (freezeDisabled || isFreezing) return;
|
|
1824
1873
|
setIsFreezing(true);
|
|
1825
1874
|
setTimeout(() => {
|
|
1826
|
-
|
|
1827
|
-
if (onFreeze) onFreeze();
|
|
1875
|
+
if (onFreeze) onFreeze(activeCard.id);
|
|
1828
1876
|
setIsFreezing(false);
|
|
1829
1877
|
}, 800);
|
|
1830
1878
|
};
|
|
1879
|
+
const handleOverlayUnfreeze = () => {
|
|
1880
|
+
if (isOverlayActionLoading) return;
|
|
1881
|
+
setIsOverlayActionLoading(true);
|
|
1882
|
+
setTimeout(() => {
|
|
1883
|
+
if (onFreeze) onFreeze(activeCard.id);
|
|
1884
|
+
setIsOverlayActionLoading(false);
|
|
1885
|
+
}, 800);
|
|
1886
|
+
};
|
|
1887
|
+
const handleOverlayActionClick = (type) => {
|
|
1888
|
+
setCardActionType(type);
|
|
1889
|
+
setShowCardActionDialog(true);
|
|
1890
|
+
};
|
|
1831
1891
|
const confirmDelete = async () => {
|
|
1832
1892
|
setIsDeleting(true);
|
|
1833
1893
|
setTimeout(() => {
|
|
1834
|
-
if (onDelete) onDelete();
|
|
1894
|
+
if (onDelete) onDelete(activeCard.id);
|
|
1835
1895
|
setIsDeleting(false);
|
|
1836
1896
|
setShowDeleteDialog(false);
|
|
1837
1897
|
}, 1200);
|
|
1838
1898
|
};
|
|
1839
|
-
const
|
|
1840
|
-
|
|
1841
|
-
|
|
1842
|
-
|
|
1899
|
+
const formatTabLabel = (type) => {
|
|
1900
|
+
const capitalized = type.charAt(0).toUpperCase() + type.slice(1).toLowerCase();
|
|
1901
|
+
return `${capitalized} Card`;
|
|
1902
|
+
};
|
|
1903
|
+
const displayCardNumber = isRevealed ? activeCard.cardNumber : `\u2022\u2022\u2022\u2022 \u2022\u2022\u2022\u2022 \u2022\u2022\u2022\u2022 ${activeCard.cardNumber.slice(-4)}`;
|
|
1904
|
+
const displayExpiry = isRevealed ? activeCard.expiry : "\u2022\u2022/\u2022\u2022";
|
|
1905
|
+
const displayCvv = isRevealed ? activeCard.cvv : "\u2022\u2022\u2022";
|
|
1906
|
+
return /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full flex flex-col items-center animate-in fade-in duration-300 pb-12" }, cards.length > 1 && /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex items-center justify-center mb-6 w-full px-2" }, /* @__PURE__ */ import_react35.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 " }, cards.map((tab, idx) => {
|
|
1907
|
+
const isActive = activeTabIndex === idx;
|
|
1908
|
+
return /* @__PURE__ */ import_react35.default.createElement(
|
|
1909
|
+
"button",
|
|
1910
|
+
{
|
|
1911
|
+
key: tab.id,
|
|
1912
|
+
onClick: () => setActiveTabIndex(idx),
|
|
1913
|
+
className: `px-4 sm:px-6 py-1.5 sm:py-2 rounded-full text-[11px] sm:text-xs font-medium transition-all duration-200 outline-none whitespace-nowrap shrink-0 ${isActive ? "bg-neutral-100 text-black" : "text-neutral-500 hover:text-black hover:bg-neutral-50/50"}`
|
|
1914
|
+
},
|
|
1915
|
+
formatTabLabel(tab.type)
|
|
1916
|
+
);
|
|
1917
|
+
}))), /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full pt-2 pb-2 flex justify-center", style: { perspective: "1000px" } }, /* @__PURE__ */ import_react35.default.createElement(
|
|
1843
1918
|
"div",
|
|
1844
1919
|
{
|
|
1845
1920
|
onClick: () => {
|
|
1846
|
-
if (
|
|
1921
|
+
if (canFlip) setIsFlipped(!isFlipped);
|
|
1847
1922
|
},
|
|
1848
|
-
className: `relative w-full max-w-85 transition-transform duration-700 ${!isBgLoaded ? "cursor-wait" : "cursor-pointer"}`,
|
|
1923
|
+
className: `relative w-full max-w-85 transition-transform duration-700 ${!isBgLoaded ? "cursor-wait" : canFlip ? "cursor-pointer" : "cursor-default"}`,
|
|
1849
1924
|
style: {
|
|
1850
1925
|
height: 185,
|
|
1851
1926
|
transformStyle: "preserve-3d",
|
|
1852
1927
|
transform: isFlipped ? "rotateY(180deg)" : "rotateY(0deg)"
|
|
1853
1928
|
}
|
|
1854
1929
|
},
|
|
1855
|
-
!isBgLoaded && /* @__PURE__ */
|
|
1856
|
-
/* @__PURE__ */
|
|
1930
|
+
!isBgLoaded && /* @__PURE__ */ import_react35.default.createElement("div", { className: "absolute inset-0 w-full h-full bg-white rounded-2xl flex items-center justify-center z-50 " }, /* @__PURE__ */ import_react35.default.createElement(import_react36.HugeiconsIcon, { icon: import_core_free_icons13.Loading03Icon, size: 28, className: "animate-spin text-black" })),
|
|
1931
|
+
!isActivated && isBgLoaded && /* @__PURE__ */ import_react35.default.createElement("div", { className: "absolute inset-0 z-40 w-full h-full rounded-2xl backdrop-blur-md bg-white/20 flex flex-col items-center justify-center border border-white/30", style: { transform: "translateZ(1px)" } }, isUnactivated && /* @__PURE__ */ import_react35.default.createElement(
|
|
1932
|
+
"button",
|
|
1933
|
+
{
|
|
1934
|
+
onClick: (e) => {
|
|
1935
|
+
e.stopPropagation();
|
|
1936
|
+
handleOverlayActionClick("ACTIVATE");
|
|
1937
|
+
},
|
|
1938
|
+
className: "px-6 py-2.5 bg-black text-white text-[12px] font-medium rounded-full hover:bg-neutral-800 transition-all outline-none active:scale-95"
|
|
1939
|
+
},
|
|
1940
|
+
"Activate Card"
|
|
1941
|
+
), isDead && /* @__PURE__ */ import_react35.default.createElement(
|
|
1942
|
+
"button",
|
|
1943
|
+
{
|
|
1944
|
+
onClick: (e) => {
|
|
1945
|
+
e.stopPropagation();
|
|
1946
|
+
handleOverlayActionClick("CREATE");
|
|
1947
|
+
},
|
|
1948
|
+
className: "px-6 py-2.5 bg-black text-white text-[12px] font-medium rounded-full hover:bg-neutral-800 transition-all outline-none active:scale-95"
|
|
1949
|
+
},
|
|
1950
|
+
"Create Card"
|
|
1951
|
+
), isFrozen && /* @__PURE__ */ import_react35.default.createElement(
|
|
1952
|
+
"button",
|
|
1953
|
+
{
|
|
1954
|
+
onClick: (e) => {
|
|
1955
|
+
e.stopPropagation();
|
|
1956
|
+
handleOverlayUnfreeze();
|
|
1957
|
+
},
|
|
1958
|
+
disabled: isOverlayActionLoading,
|
|
1959
|
+
className: "px-6 py-2.5 bg-white text-black text-[12px] font-medium rounded-full hover:bg-neutral-100 transition-all outline-none active:scale-95 flex items-center gap-2 disabled:opacity-80"
|
|
1960
|
+
},
|
|
1961
|
+
isOverlayActionLoading ? /* @__PURE__ */ import_react35.default.createElement(import_react36.HugeiconsIcon, { icon: import_core_free_icons13.Loading03Icon, size: 16, className: "animate-spin" }) : "Unfreeze Card"
|
|
1962
|
+
)),
|
|
1963
|
+
/* @__PURE__ */ import_react35.default.createElement(
|
|
1857
1964
|
"div",
|
|
1858
1965
|
{
|
|
1859
1966
|
className: `absolute inset-0 w-full h-full rounded-2xl overflow-hidden transition-all duration-700 ${isBgLoaded ? "opacity-100 scale-100" : "opacity-0 scale-105"}`,
|
|
1860
1967
|
style: { backfaceVisibility: "hidden" }
|
|
1861
1968
|
},
|
|
1862
|
-
/* @__PURE__ */
|
|
1969
|
+
/* @__PURE__ */ import_react35.default.createElement(
|
|
1863
1970
|
"div",
|
|
1864
1971
|
{
|
|
1865
1972
|
className: "absolute inset-0 bg-cover bg-center",
|
|
1866
|
-
style: { backgroundImage: `url(${cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
|
|
1973
|
+
style: { backgroundImage: `url(${activeCard.cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
|
|
1867
1974
|
}
|
|
1868
1975
|
),
|
|
1869
|
-
backgroundOverlay && /* @__PURE__ */
|
|
1976
|
+
activeCard.backgroundOverlay && /* @__PURE__ */ import_react35.default.createElement(
|
|
1870
1977
|
"div",
|
|
1871
1978
|
{
|
|
1872
1979
|
className: "absolute inset-0 bg-cover bg-center pointer-events-none",
|
|
1873
|
-
style: { backgroundImage: `url(${backgroundOverlay})` }
|
|
1980
|
+
style: { backgroundImage: `url(${activeCard.backgroundOverlay})` }
|
|
1874
1981
|
}
|
|
1875
1982
|
),
|
|
1876
|
-
/* @__PURE__ */
|
|
1983
|
+
/* @__PURE__ */ import_react35.default.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-between" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex justify-between items-start w-full" }, /* @__PURE__ */ import_react35.default.createElement("div", null, /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[12px] text-white/70 " }, "Prepaid Card")), activeCard.companyLogoSrc && /* @__PURE__ */ import_react35.default.createElement("img", { src: activeCard.companyLogoSrc, alt: "Company Logo", className: "h-10 w-auto max-w-30 object-contain opacity-90" })), /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex justify-between items-end w-full" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[10px] text-white/60 tracking-widest uppercase" }, "Card Number"), /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[14px] text-white tracking-widest font-light" }, displayCardNumber)), activeCard.networkLogoSrc && /* @__PURE__ */ import_react35.default.createElement("img", { src: activeCard.networkLogoSrc, alt: "Network Logo", className: "h-10 w-auto max-w-20 object-contain opacity-90" })))
|
|
1877
1984
|
),
|
|
1878
|
-
/* @__PURE__ */
|
|
1985
|
+
/* @__PURE__ */ import_react35.default.createElement(
|
|
1879
1986
|
"div",
|
|
1880
1987
|
{
|
|
1881
1988
|
className: `absolute inset-0 w-full h-full rounded-2xl overflow-hidden transition-all duration-700 ${isBgLoaded ? "opacity-100 scale-100" : "opacity-0 scale-105"}`,
|
|
@@ -1884,63 +1991,72 @@ var UniversalCardPage = ({
|
|
|
1884
1991
|
transform: "rotateY(180deg)"
|
|
1885
1992
|
}
|
|
1886
1993
|
},
|
|
1887
|
-
/* @__PURE__ */
|
|
1994
|
+
/* @__PURE__ */ import_react35.default.createElement(
|
|
1888
1995
|
"div",
|
|
1889
1996
|
{
|
|
1890
1997
|
className: "absolute inset-0 bg-cover bg-center",
|
|
1891
|
-
style: { backgroundImage: `url(${cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
|
|
1998
|
+
style: { backgroundImage: `url(${activeCard.cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
|
|
1892
1999
|
}
|
|
1893
2000
|
),
|
|
1894
|
-
backgroundOverlay && /* @__PURE__ */
|
|
2001
|
+
activeCard.backgroundOverlay && /* @__PURE__ */ import_react35.default.createElement(
|
|
1895
2002
|
"div",
|
|
1896
2003
|
{
|
|
1897
2004
|
className: "absolute inset-0 bg-cover bg-center pointer-events-none",
|
|
1898
|
-
style: { backgroundImage: `url(${backgroundOverlay})` }
|
|
2005
|
+
style: { backgroundImage: `url(${activeCard.backgroundOverlay})` }
|
|
1899
2006
|
}
|
|
1900
2007
|
),
|
|
1901
|
-
/* @__PURE__ */
|
|
2008
|
+
/* @__PURE__ */ import_react35.default.createElement("div", { className: "absolute top-6 left-0 right-0 h-10 bg-black/80 w-full" }),
|
|
2009
|
+
/* @__PURE__ */ import_react35.default.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-end" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full text-center mb-6" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-white text-3xl italic tracking-wide opacity-90", style: { fontFamily: "'Whisper', cursive" } }, activeCard.cardHolderName)), /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex justify-between w-full max-w-[80%]" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[9px] text-white/60 tracking-widest uppercase" }, "Expiry"), /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[14px] text-white font-light" }, displayExpiry)), /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[9px] text-white/60 tracking-widest uppercase" }, "CVV"), /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[14px] text-white font-light" }, displayCvv))))
|
|
1902
2010
|
)
|
|
1903
|
-
)), /* @__PURE__ */
|
|
2011
|
+
)), /* @__PURE__ */ import_react35.default.createElement("p", { className: "text-xs text-neutral-400 mb-6 mt-1" }, isActivated ? "Tap to flip card" : "Action Required"), /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full flex flex-col gap-4" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react35.default.createElement(
|
|
1904
2012
|
MenuRow,
|
|
1905
2013
|
{
|
|
1906
|
-
icon:
|
|
2014
|
+
icon: import_core_free_icons13.ViewOffSlashIcon,
|
|
1907
2015
|
title: "Reveal Information",
|
|
1908
2016
|
subtitle: "Show card informations",
|
|
1909
2017
|
onClick: handleToggleReveal,
|
|
1910
2018
|
isToggle: true,
|
|
1911
2019
|
toggleState: isRevealed,
|
|
1912
|
-
toggleLoading: isRevealing
|
|
2020
|
+
toggleLoading: isRevealing,
|
|
2021
|
+
disabled: revealDisabled
|
|
1913
2022
|
}
|
|
1914
|
-
), /* @__PURE__ */
|
|
2023
|
+
), /* @__PURE__ */ import_react35.default.createElement(
|
|
1915
2024
|
MenuRow,
|
|
1916
2025
|
{
|
|
1917
|
-
icon:
|
|
2026
|
+
icon: import_core_free_icons13.SnowIcon,
|
|
1918
2027
|
title: "Freeze",
|
|
1919
2028
|
subtitle: "Freeze & Unfreeze card",
|
|
1920
2029
|
onClick: handleToggleFreeze,
|
|
1921
2030
|
isToggle: true,
|
|
1922
2031
|
toggleState: isFrozen,
|
|
1923
|
-
toggleLoading: isFreezing
|
|
2032
|
+
toggleLoading: isFreezing,
|
|
2033
|
+
disabled: freezeDisabled
|
|
1924
2034
|
}
|
|
1925
|
-
), /* @__PURE__ */
|
|
2035
|
+
), /* @__PURE__ */ import_react35.default.createElement(
|
|
1926
2036
|
MenuRow,
|
|
1927
2037
|
{
|
|
1928
|
-
icon:
|
|
2038
|
+
icon: import_core_free_icons13.Dollar02Icon,
|
|
1929
2039
|
title: "Set Limits",
|
|
1930
2040
|
subtitle: "Set card limits",
|
|
1931
|
-
onClick:
|
|
2041
|
+
onClick: () => {
|
|
2042
|
+
if (!actionsDisabled && onSetLimits) onSetLimits(activeCard.id);
|
|
2043
|
+
},
|
|
2044
|
+
disabled: actionsDisabled,
|
|
1932
2045
|
isLast: true
|
|
1933
2046
|
}
|
|
1934
|
-
)), /* @__PURE__ */
|
|
2047
|
+
)), /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react35.default.createElement(
|
|
1935
2048
|
MenuRow,
|
|
1936
2049
|
{
|
|
1937
|
-
icon:
|
|
2050
|
+
icon: import_core_free_icons13.Delete02Icon,
|
|
1938
2051
|
title: "Delete card",
|
|
1939
2052
|
subtitle: "Permanently delete card",
|
|
1940
|
-
onClick: () =>
|
|
2053
|
+
onClick: () => {
|
|
2054
|
+
if (!actionsDisabled) setShowDeleteDialog(true);
|
|
2055
|
+
},
|
|
2056
|
+
disabled: actionsDisabled,
|
|
1941
2057
|
isLast: true
|
|
1942
2058
|
}
|
|
1943
|
-
))), /* @__PURE__ */
|
|
2059
|
+
))), /* @__PURE__ */ import_react35.default.createElement(
|
|
1944
2060
|
ConfirmationDialog,
|
|
1945
2061
|
{
|
|
1946
2062
|
isOpen: showDeleteDialog,
|
|
@@ -1952,7 +2068,7 @@ var UniversalCardPage = ({
|
|
|
1952
2068
|
onClose: () => setShowDeleteDialog(false),
|
|
1953
2069
|
onConfirm: confirmDelete
|
|
1954
2070
|
}
|
|
1955
|
-
), /* @__PURE__ */
|
|
2071
|
+
), /* @__PURE__ */ import_react35.default.createElement(
|
|
1956
2072
|
PinDialerBottomSheet,
|
|
1957
2073
|
{
|
|
1958
2074
|
isOpen: showPinDialer,
|
|
@@ -1961,6 +2077,18 @@ var UniversalCardPage = ({
|
|
|
1961
2077
|
onClose: () => setShowPinDialer(false),
|
|
1962
2078
|
onComplete: handlePinComplete
|
|
1963
2079
|
}
|
|
2080
|
+
), /* @__PURE__ */ import_react35.default.createElement(
|
|
2081
|
+
CardActionDialog,
|
|
2082
|
+
{
|
|
2083
|
+
isOpen: showCardActionDialog,
|
|
2084
|
+
card: activeCard,
|
|
2085
|
+
actionType: cardActionType,
|
|
2086
|
+
onClose: () => setShowCardActionDialog(false),
|
|
2087
|
+
onProceed: () => {
|
|
2088
|
+
if (onCardAction) onCardAction(activeCard.id, cardActionType);
|
|
2089
|
+
setShowCardActionDialog(false);
|
|
2090
|
+
}
|
|
2091
|
+
}
|
|
1964
2092
|
));
|
|
1965
2093
|
};
|
|
1966
2094
|
var MenuRow = ({
|
|
@@ -1973,22 +2101,23 @@ var MenuRow = ({
|
|
|
1973
2101
|
isLast = false,
|
|
1974
2102
|
isToggle = false,
|
|
1975
2103
|
toggleState = false,
|
|
1976
|
-
toggleLoading = false
|
|
1977
|
-
|
|
2104
|
+
toggleLoading = false,
|
|
2105
|
+
disabled = false
|
|
2106
|
+
}) => /* @__PURE__ */ import_react35.default.createElement(
|
|
1978
2107
|
"div",
|
|
1979
2108
|
{
|
|
1980
|
-
onClick,
|
|
1981
|
-
className: `flex items-center p-3
|
|
2109
|
+
onClick: disabled ? void 0 : onClick,
|
|
2110
|
+
className: `flex items-center p-3 transition-colors ${!isLast ? "" : ""} ${disabled ? "opacity-40 cursor-not-allowed" : "cursor-pointer hover:bg-neutral-50"}`
|
|
1982
2111
|
},
|
|
1983
|
-
/* @__PURE__ */
|
|
1984
|
-
/* @__PURE__ */
|
|
1985
|
-
isToggle ? /* @__PURE__ */
|
|
2112
|
+
/* @__PURE__ */ import_react35.default.createElement("div", { className: "w-9 h-9 rounded-full border border-neutral-200 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ import_react35.default.createElement(import_react36.HugeiconsIcon, { icon, size: 16, className: iconColor })),
|
|
2113
|
+
/* @__PURE__ */ import_react35.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react35.default.createElement("p", { className: `text-[13px] truncate ${titleColor}` }, title), /* @__PURE__ */ import_react35.default.createElement("p", { className: "text-[11px] text-neutral-500 truncate" }, subtitle)),
|
|
2114
|
+
isToggle ? /* @__PURE__ */ import_react35.default.createElement("div", { className: `relative w-11 h-6 rounded-full transition-colors duration-300 ml-2 shrink-0 ${toggleState ? "bg-black" : "bg-neutral-200"} ${disabled ? "opacity-50" : ""}` }, /* @__PURE__ */ import_react35.default.createElement("div", { className: `absolute top-1 left-1 w-4 h-4 rounded-full bg-white shadow-sm transition-transform duration-300 flex items-center justify-center ${toggleState ? "translate-x-5" : "translate-x-0"}` }, toggleLoading && /* @__PURE__ */ import_react35.default.createElement(import_react36.HugeiconsIcon, { icon: import_core_free_icons13.Loading03Icon, size: 10, className: "animate-spin text-black" }))) : /* @__PURE__ */ import_react35.default.createElement(import_react36.HugeiconsIcon, { icon: import_core_free_icons13.ArrowRight01Icon, size: 18, className: "text-neutral-400 shrink-0 ml-2" })
|
|
1986
2115
|
);
|
|
1987
2116
|
|
|
1988
2117
|
// src/components/UniversalProfilePage.tsx
|
|
1989
|
-
var
|
|
1990
|
-
var
|
|
1991
|
-
var
|
|
2118
|
+
var import_react37 = __toESM(require("react"));
|
|
2119
|
+
var import_react38 = require("@hugeicons/react");
|
|
2120
|
+
var import_core_free_icons14 = require("@hugeicons/core-free-icons");
|
|
1992
2121
|
var UniversalProfilePage = ({
|
|
1993
2122
|
avatarSrc,
|
|
1994
2123
|
roleName,
|
|
@@ -2002,9 +2131,9 @@ var UniversalProfilePage = ({
|
|
|
2002
2131
|
onLogoutTap,
|
|
2003
2132
|
onDeleteTap
|
|
2004
2133
|
}) => {
|
|
2005
|
-
const [isAvatarLoaded, setIsAvatarLoaded] = (0,
|
|
2006
|
-
const [showLogoutDialog, setShowLogoutDialog] = (0,
|
|
2007
|
-
const [isLoggingOut, setIsLoggingOut] = (0,
|
|
2134
|
+
const [isAvatarLoaded, setIsAvatarLoaded] = (0, import_react37.useState)(false);
|
|
2135
|
+
const [showLogoutDialog, setShowLogoutDialog] = (0, import_react37.useState)(false);
|
|
2136
|
+
const [isLoggingOut, setIsLoggingOut] = (0, import_react37.useState)(false);
|
|
2008
2137
|
const handleConfirmLogout = async () => {
|
|
2009
2138
|
setIsLoggingOut(true);
|
|
2010
2139
|
try {
|
|
@@ -2016,7 +2145,7 @@ var UniversalProfilePage = ({
|
|
|
2016
2145
|
setShowLogoutDialog(false);
|
|
2017
2146
|
}
|
|
2018
2147
|
};
|
|
2019
|
-
return /* @__PURE__ */
|
|
2148
|
+
return /* @__PURE__ */ import_react37.default.createElement("div", { className: "w-full max-w-md mx-auto flex flex-col items-center animate-in fade-in duration-300 pb-12" }, /* @__PURE__ */ import_react37.default.createElement("div", { className: "pt-8 pb-4 flex flex-col items-center" }, /* @__PURE__ */ import_react37.default.createElement("div", { className: "w-22 h-22 rounded-full bg-white p-1 mb-4 flex items-center justify-center" }, /* @__PURE__ */ import_react37.default.createElement("div", { className: "relative w-full h-full rounded-full overflow-hidden bg-neutral-100 flex items-center justify-center" }, avatarSrc ? /* @__PURE__ */ import_react37.default.createElement(import_react37.default.Fragment, null, !isAvatarLoaded && /* @__PURE__ */ import_react37.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-10 bg-neutral-100" }, /* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons14.Loading03Icon, size: 24, className: "animate-spin text-black" })), /* @__PURE__ */ import_react37.default.createElement(
|
|
2020
2149
|
"img",
|
|
2021
2150
|
{
|
|
2022
2151
|
src: avatarSrc,
|
|
@@ -2024,74 +2153,74 @@ var UniversalProfilePage = ({
|
|
|
2024
2153
|
onLoad: () => setIsAvatarLoaded(true),
|
|
2025
2154
|
className: `w-full h-full object-cover transition-opacity duration-300 ${isAvatarLoaded ? "opacity-100" : "opacity-0"}`
|
|
2026
2155
|
}
|
|
2027
|
-
)) : /* @__PURE__ */
|
|
2156
|
+
)) : /* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons14.UserIcon, size: 40, className: "text-neutral-300" }))), /* @__PURE__ */ import_react37.default.createElement("div", { className: "bg-white rounded-full px-4 py-2 flex items-center justify-center gap-2 mb-3" }, /* @__PURE__ */ import_react37.default.createElement("span", { className: "text-[12px] text-black" }, roleName), /* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons14.CrownIcon, size: 14, className: "text-neutral-400" })), /* @__PURE__ */ import_react37.default.createElement("span", { className: "text-[12px] text-neutral-500" }, memberSince)), /* @__PURE__ */ import_react37.default.createElement("div", { className: "w-full flex flex-col gap-4 mt-2" }, /* @__PURE__ */ import_react37.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react37.default.createElement(
|
|
2028
2157
|
MenuRow2,
|
|
2029
2158
|
{
|
|
2030
|
-
icon:
|
|
2159
|
+
icon: import_core_free_icons14.UserIcon,
|
|
2031
2160
|
title: "Account",
|
|
2032
2161
|
subtitle: "Your account details",
|
|
2033
2162
|
onClick: onAccountTap
|
|
2034
2163
|
}
|
|
2035
|
-
), /* @__PURE__ */
|
|
2164
|
+
), /* @__PURE__ */ import_react37.default.createElement(
|
|
2036
2165
|
MenuRow2,
|
|
2037
2166
|
{
|
|
2038
|
-
icon:
|
|
2167
|
+
icon: import_core_free_icons14.LockKeyIcon,
|
|
2039
2168
|
title: "Security",
|
|
2040
2169
|
subtitle: "2FA & authentication",
|
|
2041
2170
|
onClick: onSecurityTap
|
|
2042
2171
|
}
|
|
2043
|
-
), /* @__PURE__ */
|
|
2172
|
+
), /* @__PURE__ */ import_react37.default.createElement(
|
|
2044
2173
|
MenuRow2,
|
|
2045
2174
|
{
|
|
2046
|
-
icon:
|
|
2175
|
+
icon: import_core_free_icons14.ShieldUserIcon,
|
|
2047
2176
|
title: "Web3 Profile",
|
|
2048
2177
|
subtitle: "Manage web3 profile",
|
|
2049
2178
|
onClick: onDefiTap
|
|
2050
2179
|
}
|
|
2051
|
-
), /* @__PURE__ */
|
|
2180
|
+
), /* @__PURE__ */ import_react37.default.createElement(
|
|
2052
2181
|
MenuRow2,
|
|
2053
2182
|
{
|
|
2054
|
-
icon:
|
|
2183
|
+
icon: import_core_free_icons14.MessageQuestionIcon,
|
|
2055
2184
|
title: "Get Help",
|
|
2056
2185
|
subtitle: "24/7 Support",
|
|
2057
2186
|
onClick: onHelpTap,
|
|
2058
2187
|
isLast: true
|
|
2059
2188
|
}
|
|
2060
|
-
)), /* @__PURE__ */
|
|
2189
|
+
)), /* @__PURE__ */ import_react37.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react37.default.createElement(
|
|
2061
2190
|
MenuRow2,
|
|
2062
2191
|
{
|
|
2063
|
-
icon:
|
|
2192
|
+
icon: import_core_free_icons14.UserIdVerificationIcon,
|
|
2064
2193
|
title: "Verifications",
|
|
2065
2194
|
subtitle: "Account Verifications",
|
|
2066
2195
|
onClick: onVerificationsTap
|
|
2067
2196
|
}
|
|
2068
|
-
), /* @__PURE__ */
|
|
2197
|
+
), /* @__PURE__ */ import_react37.default.createElement(
|
|
2069
2198
|
MenuRow2,
|
|
2070
2199
|
{
|
|
2071
|
-
icon:
|
|
2200
|
+
icon: import_core_free_icons14.FileDownloadIcon,
|
|
2072
2201
|
title: "Export Account",
|
|
2073
2202
|
subtitle: "Transfer your account",
|
|
2074
2203
|
onClick: onExportTap
|
|
2075
2204
|
}
|
|
2076
|
-
), /* @__PURE__ */
|
|
2205
|
+
), /* @__PURE__ */ import_react37.default.createElement(
|
|
2077
2206
|
MenuRow2,
|
|
2078
2207
|
{
|
|
2079
|
-
icon:
|
|
2208
|
+
icon: import_core_free_icons14.LogoutCircle02Icon,
|
|
2080
2209
|
title: "LogOut",
|
|
2081
2210
|
subtitle: "End your session",
|
|
2082
2211
|
onClick: () => setShowLogoutDialog(true),
|
|
2083
2212
|
isLast: true
|
|
2084
2213
|
}
|
|
2085
|
-
)), /* @__PURE__ */
|
|
2214
|
+
)), /* @__PURE__ */ import_react37.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden mb-4" }, /* @__PURE__ */ import_react37.default.createElement(
|
|
2086
2215
|
MenuRow2,
|
|
2087
2216
|
{
|
|
2088
|
-
icon:
|
|
2217
|
+
icon: import_core_free_icons14.UserRemove01Icon,
|
|
2089
2218
|
title: "Delete Account",
|
|
2090
2219
|
subtitle: "Remove account",
|
|
2091
2220
|
onClick: onDeleteTap,
|
|
2092
2221
|
isLast: true
|
|
2093
2222
|
}
|
|
2094
|
-
))), /* @__PURE__ */
|
|
2223
|
+
))), /* @__PURE__ */ import_react37.default.createElement(
|
|
2095
2224
|
ConfirmationDialog,
|
|
2096
2225
|
{
|
|
2097
2226
|
isOpen: showLogoutDialog,
|
|
@@ -2105,28 +2234,28 @@ var UniversalProfilePage = ({
|
|
|
2105
2234
|
}
|
|
2106
2235
|
));
|
|
2107
2236
|
};
|
|
2108
|
-
var MenuRow2 = ({ icon, title, subtitle, onClick, iconColor = "text-black", titleColor = "text-black", isLast = false }) => /* @__PURE__ */
|
|
2237
|
+
var MenuRow2 = ({ icon, title, subtitle, onClick, iconColor = "text-black", titleColor = "text-black", isLast = false }) => /* @__PURE__ */ import_react37.default.createElement(
|
|
2109
2238
|
"div",
|
|
2110
2239
|
{
|
|
2111
2240
|
onClick,
|
|
2112
2241
|
className: `flex items-center p-4 cursor-pointer hover:bg-neutral-50 transition-colors ${!isLast ? "" : ""}`
|
|
2113
2242
|
},
|
|
2114
|
-
/* @__PURE__ */
|
|
2115
|
-
/* @__PURE__ */
|
|
2116
|
-
/* @__PURE__ */
|
|
2243
|
+
/* @__PURE__ */ import_react37.default.createElement("div", { className: "w-9 h-9 rounded-full border border-neutral-200 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon, size: 16, className: iconColor })),
|
|
2244
|
+
/* @__PURE__ */ import_react37.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react37.default.createElement("p", { className: `text-[13px] truncate ${titleColor}` }, title), /* @__PURE__ */ import_react37.default.createElement("p", { className: "text-[11px] text-neutral-500 truncate" }, subtitle)),
|
|
2245
|
+
/* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons14.ArrowRight01Icon, size: 18, className: "text-neutral-400 shrink-0 ml-2" })
|
|
2117
2246
|
);
|
|
2118
2247
|
|
|
2119
2248
|
// src/components/HeroSection.tsx
|
|
2120
|
-
var
|
|
2249
|
+
var import_react40 = __toESM(require("react"));
|
|
2121
2250
|
var import_link5 = __toESM(require("next/link"));
|
|
2122
2251
|
var import_image2 = __toESM(require("next/image"));
|
|
2123
2252
|
|
|
2124
2253
|
// src/components/WaitlistDialog.tsx
|
|
2125
|
-
var
|
|
2254
|
+
var import_react39 = __toESM(require("react"));
|
|
2126
2255
|
var import_react_hot_toast7 = require("react-hot-toast");
|
|
2127
2256
|
var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
2128
|
-
const [email, setEmail] = (0,
|
|
2129
|
-
const [isLoading, setIsLoading] = (0,
|
|
2257
|
+
const [email, setEmail] = (0, import_react39.useState)("");
|
|
2258
|
+
const [isLoading, setIsLoading] = (0, import_react39.useState)(false);
|
|
2130
2259
|
if (!isOpen) return null;
|
|
2131
2260
|
const handleSubmit = async (e) => {
|
|
2132
2261
|
e.preventDefault();
|
|
@@ -2157,12 +2286,12 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
2157
2286
|
setIsLoading(false);
|
|
2158
2287
|
}
|
|
2159
2288
|
};
|
|
2160
|
-
return /* @__PURE__ */
|
|
2289
|
+
return /* @__PURE__ */ import_react39.default.createElement("div", { className: "fixed inset-0 z-100 flex items-center justify-center p-4 bg-black/40" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "absolute inset-0", onClick: !isLoading ? onClose : void 0 }), /* @__PURE__ */ import_react39.default.createElement(
|
|
2161
2290
|
"div",
|
|
2162
2291
|
{
|
|
2163
2292
|
className: "w-full max-w-md bg-white rounded-2xl shadow-2xl overflow-hidden relative z-10 animate-in fade-in zoom-in-95 duration-200"
|
|
2164
2293
|
},
|
|
2165
|
-
/* @__PURE__ */
|
|
2294
|
+
/* @__PURE__ */ import_react39.default.createElement(
|
|
2166
2295
|
"button",
|
|
2167
2296
|
{
|
|
2168
2297
|
onClick: onClose,
|
|
@@ -2170,7 +2299,7 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
2170
2299
|
className: "absolute top-4 right-4 p-2 text-neutral-700 hover:text-neutral-400 transition-colors disabled:opacity-50 outline-none",
|
|
2171
2300
|
"aria-label": "Close dialog"
|
|
2172
2301
|
},
|
|
2173
|
-
/* @__PURE__ */
|
|
2302
|
+
/* @__PURE__ */ import_react39.default.createElement(
|
|
2174
2303
|
"svg",
|
|
2175
2304
|
{
|
|
2176
2305
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -2183,11 +2312,11 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
2183
2312
|
strokeLinecap: "round",
|
|
2184
2313
|
strokeLinejoin: "round"
|
|
2185
2314
|
},
|
|
2186
|
-
/* @__PURE__ */
|
|
2187
|
-
/* @__PURE__ */
|
|
2315
|
+
/* @__PURE__ */ import_react39.default.createElement("path", { d: "M18 6 6 18" }),
|
|
2316
|
+
/* @__PURE__ */ import_react39.default.createElement("path", { d: "m6 6 12 12" })
|
|
2188
2317
|
)
|
|
2189
2318
|
),
|
|
2190
|
-
/* @__PURE__ */
|
|
2319
|
+
/* @__PURE__ */ import_react39.default.createElement("div", { className: "p-6 sm:p-8" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "mb-8 mt-2" }, /* @__PURE__ */ import_react39.default.createElement("h2", { className: "text-2xl text-black tracking-tight mb-2" }, "Join the Waitlist"), /* @__PURE__ */ import_react39.default.createElement("p", { className: "text-[13px] text-neutral-500 leading-relaxed" }, "Be the first to experience the future of Web3 freedom. Secure your early access spot today.")), /* @__PURE__ */ import_react39.default.createElement("form", { onSubmit: handleSubmit, className: "flex flex-col gap-8" }, /* @__PURE__ */ import_react39.default.createElement(
|
|
2191
2320
|
TextInput,
|
|
2192
2321
|
{
|
|
2193
2322
|
label: "Email ID",
|
|
@@ -2197,7 +2326,7 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
2197
2326
|
placeholder: "name@example.com",
|
|
2198
2327
|
disabled: isLoading
|
|
2199
2328
|
}
|
|
2200
|
-
), /* @__PURE__ */
|
|
2329
|
+
), /* @__PURE__ */ import_react39.default.createElement(
|
|
2201
2330
|
ThreeDActionButton,
|
|
2202
2331
|
{
|
|
2203
2332
|
type: "submit",
|
|
@@ -2230,10 +2359,10 @@ var HeroSection = ({
|
|
|
2230
2359
|
bgImageSrc,
|
|
2231
2360
|
isWaitlist = false
|
|
2232
2361
|
}) => {
|
|
2233
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
2234
|
-
const [isWaitlistOpen, setIsWaitlistOpen] = (0,
|
|
2235
|
-
const titleRef = (0,
|
|
2236
|
-
(0,
|
|
2362
|
+
const [isAnimating, setIsAnimating] = (0, import_react40.useState)(false);
|
|
2363
|
+
const [isWaitlistOpen, setIsWaitlistOpen] = (0, import_react40.useState)(false);
|
|
2364
|
+
const titleRef = (0, import_react40.useRef)(null);
|
|
2365
|
+
(0, import_react40.useEffect)(() => {
|
|
2237
2366
|
const observer = new IntersectionObserver(
|
|
2238
2367
|
([entry]) => {
|
|
2239
2368
|
if (entry.isIntersecting) {
|
|
@@ -2255,7 +2384,7 @@ var HeroSection = ({
|
|
|
2255
2384
|
setIsWaitlistOpen(true);
|
|
2256
2385
|
}
|
|
2257
2386
|
};
|
|
2258
|
-
return /* @__PURE__ */
|
|
2387
|
+
return /* @__PURE__ */ import_react40.default.createElement("div", { className: "w-screen min-h-screen flex justify-center items-center p-4" }, /* @__PURE__ */ import_react40.default.createElement("section", { className: "relative h-[95vh] w-full overflow-hidden rounded-2xl " }, bgVideoSrc ? /* @__PURE__ */ import_react40.default.createElement(
|
|
2259
2388
|
"video",
|
|
2260
2389
|
{
|
|
2261
2390
|
src: bgVideoSrc,
|
|
@@ -2266,7 +2395,7 @@ var HeroSection = ({
|
|
|
2266
2395
|
playsInline: true,
|
|
2267
2396
|
className: "absolute inset-0 h-full w-full object-cover z-0"
|
|
2268
2397
|
}
|
|
2269
|
-
) : bgImageSrc ? /* @__PURE__ */
|
|
2398
|
+
) : bgImageSrc ? /* @__PURE__ */ import_react40.default.createElement(
|
|
2270
2399
|
import_image2.default,
|
|
2271
2400
|
{
|
|
2272
2401
|
src: bgImageSrc,
|
|
@@ -2275,7 +2404,7 @@ var HeroSection = ({
|
|
|
2275
2404
|
priority: true,
|
|
2276
2405
|
className: "absolute inset-0 h-full w-full object-cover z-0"
|
|
2277
2406
|
}
|
|
2278
|
-
) : null, /* @__PURE__ */
|
|
2407
|
+
) : null, /* @__PURE__ */ import_react40.default.createElement(
|
|
2279
2408
|
"div",
|
|
2280
2409
|
{
|
|
2281
2410
|
className: "pointer-events-none absolute inset-0 z-10 opacity-[0.7] mix-blend-overlay",
|
|
@@ -2283,15 +2412,15 @@ var HeroSection = ({
|
|
|
2283
2412
|
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`
|
|
2284
2413
|
}
|
|
2285
2414
|
}
|
|
2286
|
-
), /* @__PURE__ */
|
|
2415
|
+
), /* @__PURE__ */ import_react40.default.createElement("div", { className: "pointer-events-none absolute inset-0 bg-linear-to-b from-black/30 via-transparent to-black/80 z-10" }), /* @__PURE__ */ import_react40.default.createElement("div", { className: "absolute bottom-0 left-0 right-0 px-4 pb-4 sm:px-6 md:px-10 z-20" }, /* @__PURE__ */ import_react40.default.createElement("div", { className: "grid grid-cols-12 items-end gap-4" }, /* @__PURE__ */ import_react40.default.createElement("div", { className: "col-span-12 lg:col-span-8" }, /* @__PURE__ */ import_react40.default.createElement(
|
|
2287
2416
|
"h1",
|
|
2288
2417
|
{
|
|
2289
2418
|
ref: titleRef,
|
|
2290
2419
|
className: "leading-[0.85] tracking-[-0.07em] text-[18.2vw] sm:text-[16.8vw] md:text-[15.4vw] lg:text-[14vw] xl:text-[13.3vw] 2xl:text-[14vw] text-[#ffffff]"
|
|
2291
2420
|
},
|
|
2292
|
-
/* @__PURE__ */
|
|
2293
|
-
)), /* @__PURE__ */
|
|
2294
|
-
/* @__PURE__ */
|
|
2421
|
+
/* @__PURE__ */ import_react40.default.createElement("div", { className: "inline-flex flex-wrap" }, /* @__PURE__ */ import_react40.default.createElement("span", { className: `inline-block relative transition-all duration-1000 ${isAnimating ? "opacity-100 translate-y-0" : "opacity-0 translate-y-10"}` }, titlePrefix, titlePrefix && /* @__PURE__ */ import_react40.default.createElement("br", null), highlightText, /* @__PURE__ */ import_react40.default.createElement("span", { className: "absolute top-[0.65em] right-[-0.3em] text-[0.31em] text-[#ffffff]/70" }, "*")))
|
|
2422
|
+
)), /* @__PURE__ */ import_react40.default.createElement("div", { className: "col-span-12 flex flex-col gap-5 pb-6 lg:col-span-4 lg:pb-10" }, subtitle && /* @__PURE__ */ import_react40.default.createElement("p", { className: "text-xs text-[#ffffff]/70 sm:text-sm md:text-base leading-[1.2] max-w-md transition-opacity duration-1000 delay-300" }, subtitle), /* @__PURE__ */ import_react40.default.createElement("div", { className: "flex flex-col sm:flex-row items-start sm:items-center gap-4" }, ctaText && // Changed from <button> to <Link> so it actually navigates!
|
|
2423
|
+
/* @__PURE__ */ import_react40.default.createElement(
|
|
2295
2424
|
import_link5.default,
|
|
2296
2425
|
{
|
|
2297
2426
|
href: isWaitlist ? "#" : ctaHref || "#",
|
|
@@ -2299,15 +2428,15 @@ var HeroSection = ({
|
|
|
2299
2428
|
className: "group inline-flex h-10 items-center gap-2 self-start rounded-full bg-[#ffffff] pl-5 pr-1 text-xs text-black transition-all hover:gap-3"
|
|
2300
2429
|
},
|
|
2301
2430
|
ctaText,
|
|
2302
|
-
/* @__PURE__ */
|
|
2303
|
-
), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */
|
|
2431
|
+
/* @__PURE__ */ import_react40.default.createElement("span", { className: "flex h-8 w-8 items-center justify-center rounded-full bg-black transition-transform group-hover:scale-110" }, /* @__PURE__ */ import_react40.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "lucide lucide-arrow-right h-4 w-4 text-[#ffffff]" }, /* @__PURE__ */ import_react40.default.createElement("path", { d: "M5 12h14" }), /* @__PURE__ */ import_react40.default.createElement("path", { d: "m12 5 7 7-7 7" })))
|
|
2432
|
+
), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ import_react40.default.createElement(
|
|
2304
2433
|
import_link5.default,
|
|
2305
2434
|
{
|
|
2306
2435
|
href: secondaryCtaHref,
|
|
2307
2436
|
className: "inline-flex h-10 items-center self-start justify-center text-xs tracking-wide rounded-full px-6 border border-[#ffffff]/30 text-[#ffffff] hover:bg-[#ffffff]/10 transition-colors"
|
|
2308
2437
|
},
|
|
2309
2438
|
secondaryCtaText
|
|
2310
|
-
)), showApps && appLogos && appLogos.length > 0 && /* @__PURE__ */
|
|
2439
|
+
)), showApps && appLogos && appLogos.length > 0 && /* @__PURE__ */ import_react40.default.createElement("div", { className: "flex flex-col gap-3 mt-4" }, appsText && /* @__PURE__ */ import_react40.default.createElement("span", { className: "text-[10px] tracking-widest uppercase text-[#ffffff]/50 " }, appsText), /* @__PURE__ */ import_react40.default.createElement("div", { className: "flex items-center gap-4" }, appLogos.map((logo, idx) => /* @__PURE__ */ import_react40.default.createElement("div", { key: idx, className: "relative h-6 w-6 sm:h-7 sm:w-7 opacity-70 hover:opacity-100 transition-opacity invert" }, /* @__PURE__ */ import_react40.default.createElement(
|
|
2311
2440
|
import_image2.default,
|
|
2312
2441
|
{
|
|
2313
2442
|
src: logo.src,
|
|
@@ -2316,7 +2445,7 @@ var HeroSection = ({
|
|
|
2316
2445
|
height: 28,
|
|
2317
2446
|
className: "object-contain"
|
|
2318
2447
|
}
|
|
2319
|
-
))))))))), /* @__PURE__ */
|
|
2448
|
+
))))))))), /* @__PURE__ */ import_react40.default.createElement(
|
|
2320
2449
|
WaitlistDialog,
|
|
2321
2450
|
{
|
|
2322
2451
|
isOpen: isWaitlistOpen,
|
|
@@ -2326,12 +2455,12 @@ var HeroSection = ({
|
|
|
2326
2455
|
};
|
|
2327
2456
|
|
|
2328
2457
|
// src/components/AppBento2.tsx
|
|
2329
|
-
var
|
|
2330
|
-
var
|
|
2458
|
+
var import_react41 = __toESM(require("react"));
|
|
2459
|
+
var import_react42 = require("@hugeicons/react");
|
|
2331
2460
|
var AppBento2 = ({ tagline, headline, features }) => {
|
|
2332
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
2333
|
-
const titleRef = (0,
|
|
2334
|
-
(0,
|
|
2461
|
+
const [isAnimating, setIsAnimating] = (0, import_react41.useState)(false);
|
|
2462
|
+
const titleRef = (0, import_react41.useRef)(null);
|
|
2463
|
+
(0, import_react41.useEffect)(() => {
|
|
2335
2464
|
const observer = new IntersectionObserver(
|
|
2336
2465
|
([entry]) => {
|
|
2337
2466
|
if (entry.isIntersecting) {
|
|
@@ -2349,7 +2478,7 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
2349
2478
|
}
|
|
2350
2479
|
return () => observer.disconnect();
|
|
2351
2480
|
}, []);
|
|
2352
|
-
return /* @__PURE__ */
|
|
2481
|
+
return /* @__PURE__ */ import_react41.default.createElement("div", { className: "w-full py-16" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "w-full flex justify-center px-4" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "relative overflow-hidden mb-12 text-left" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react41.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 block mb-4 " }, tagline), /* @__PURE__ */ import_react41.default.createElement(
|
|
2353
2482
|
"h2",
|
|
2354
2483
|
{
|
|
2355
2484
|
ref: titleRef,
|
|
@@ -2357,7 +2486,7 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
2357
2486
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
2358
2487
|
},
|
|
2359
2488
|
headline
|
|
2360
|
-
))), /* @__PURE__ */
|
|
2489
|
+
))), /* @__PURE__ */ import_react41.default.createElement("div", { className: "grid grid-cols-1 lg:grid-cols-6 gap-6" }, features.map((f, i) => {
|
|
2361
2490
|
const isWhite = i === 0;
|
|
2362
2491
|
const isBlack = i === 1;
|
|
2363
2492
|
const isNeutral = i === 2;
|
|
@@ -2379,36 +2508,36 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
2379
2508
|
const textColor = isBlack ? "text-white" : "text-black";
|
|
2380
2509
|
const subTextColor = isBlack ? "text-neutral-300" : "text-neutral-600";
|
|
2381
2510
|
const labelColor = isBlack ? "text-neutral-400" : "text-neutral-500";
|
|
2382
|
-
return /* @__PURE__ */
|
|
2511
|
+
return /* @__PURE__ */ import_react41.default.createElement(
|
|
2383
2512
|
"div",
|
|
2384
2513
|
{
|
|
2385
2514
|
key: i,
|
|
2386
2515
|
className: `relative rounded-2xl overflow-hidden p-8 flex flex-col min-h-75 transition-all duration-500 group text-left ${getBgStyle()} ${f.size}`,
|
|
2387
2516
|
style: { boxShadow: getShadowStyle() }
|
|
2388
2517
|
},
|
|
2389
|
-
/* @__PURE__ */
|
|
2518
|
+
/* @__PURE__ */ import_react41.default.createElement(
|
|
2390
2519
|
"div",
|
|
2391
2520
|
{
|
|
2392
2521
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
2393
2522
|
style: { backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")` }
|
|
2394
2523
|
}
|
|
2395
2524
|
),
|
|
2396
|
-
isBlack && /* @__PURE__ */
|
|
2397
|
-
/* @__PURE__ */
|
|
2398
|
-
/* @__PURE__ */
|
|
2525
|
+
isBlack && /* @__PURE__ */ import_react41.default.createElement("span", { className: "absolute inset-0 rounded-2xl bg-linear-to-b from-white/10 via-white/5 to-transparent pointer-events-none z-10" }),
|
|
2526
|
+
/* @__PURE__ */ import_react41.default.createElement("div", { className: "absolute inset-0 overflow-hidden pointer-events-none z-0" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: `absolute -bottom-8 -right-8 transform group-hover:scale-110 transition-transform duration-700 ease-out ${isBlack ? "text-white/5" : "text-black/5"}` }, /* @__PURE__ */ import_react41.default.createElement(import_react42.HugeiconsIcon, { icon: f.icon, size: 180 }))),
|
|
2527
|
+
/* @__PURE__ */ import_react41.default.createElement("div", { className: "relative z-10 w-full h-full flex flex-col pointer-events-auto" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "flex items-center justify-between mb-8" }, /* @__PURE__ */ import_react41.default.createElement("span", { className: `text-[9px] tracking-widest ${labelColor}` }, f.label), /* @__PURE__ */ import_react41.default.createElement("div", { className: `p-2 rounded-full transition-colors ${isBlack ? "bg-white/10" : "bg-white/50 backdrop-blur-sm"}` }, /* @__PURE__ */ import_react41.default.createElement(import_react42.HugeiconsIcon, { icon: f.icon, size: 20, className: textColor }))), /* @__PURE__ */ import_react41.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react41.default.createElement("h3", { className: `text-xl mb-2 tracking-tight ${textColor}` }, f.title), /* @__PURE__ */ import_react41.default.createElement("p", { className: `text-[13px] leading-relaxed max-w-sm ${subTextColor}` }, f.desc)))
|
|
2399
2528
|
);
|
|
2400
2529
|
})))));
|
|
2401
2530
|
};
|
|
2402
2531
|
|
|
2403
2532
|
// src/components/FeatureScroll.tsx
|
|
2404
|
-
var
|
|
2533
|
+
var import_react43 = __toESM(require("react"));
|
|
2405
2534
|
var import_image3 = __toESM(require("next/image"));
|
|
2406
|
-
var
|
|
2407
|
-
var
|
|
2535
|
+
var import_react44 = require("@hugeicons/react");
|
|
2536
|
+
var import_core_free_icons15 = require("@hugeicons/core-free-icons");
|
|
2408
2537
|
var FeatureCard = ({ feature, bgImage }) => {
|
|
2409
|
-
const [isBgLoading, setIsBgLoading] = (0,
|
|
2410
|
-
const [isFgLoading, setIsFgLoading] = (0,
|
|
2411
|
-
return /* @__PURE__ */
|
|
2538
|
+
const [isBgLoading, setIsBgLoading] = (0, import_react43.useState)(true);
|
|
2539
|
+
const [isFgLoading, setIsFgLoading] = (0, import_react43.useState)(!!feature.image);
|
|
2540
|
+
return /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex flex-col shrink-0 w-[90vw] sm:w-150 snap-center md:snap-start group cursor-grab active:cursor-grabbing" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "relative w-full aspect-16/10 bg-neutral-100 rounded-2xl overflow-hidden mb-6 flex items-center justify-center" }, /* @__PURE__ */ import_react43.default.createElement(
|
|
2412
2541
|
import_image3.default,
|
|
2413
2542
|
{
|
|
2414
2543
|
src: bgImage,
|
|
@@ -2421,7 +2550,7 @@ var FeatureCard = ({ feature, bgImage }) => {
|
|
|
2421
2550
|
${isBgLoading ? "blur-xl scale-110" : "blur-0 scale-100"}
|
|
2422
2551
|
`
|
|
2423
2552
|
}
|
|
2424
|
-
), /* @__PURE__ */
|
|
2553
|
+
), /* @__PURE__ */ import_react43.default.createElement(
|
|
2425
2554
|
"div",
|
|
2426
2555
|
{
|
|
2427
2556
|
className: "absolute inset-0 w-full h-full pointer-events-none z-0 opacity-[0.25] mix-blend-overlay",
|
|
@@ -2429,7 +2558,7 @@ var FeatureCard = ({ feature, bgImage }) => {
|
|
|
2429
2558
|
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`
|
|
2430
2559
|
}
|
|
2431
2560
|
}
|
|
2432
|
-
), isFgLoading && feature.image && /* @__PURE__ */
|
|
2561
|
+
), isFgLoading && feature.image && /* @__PURE__ */ import_react43.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-neutral-50/50 backdrop-blur-sm transition-opacity duration-300" }, /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons15.Loading03Icon, size: 32, className: "animate-spin text-neutral-400" })), feature.image && /* @__PURE__ */ import_react43.default.createElement("div", { className: "absolute -bottom-6 -right-6 w-[85%] h-[85%] z-10 transition-transform duration-700 ease-out group-hover:-translate-x-2 group-hover:-translate-y-2" }, /* @__PURE__ */ import_react43.default.createElement(
|
|
2433
2562
|
import_image3.default,
|
|
2434
2563
|
{
|
|
2435
2564
|
src: feature.image,
|
|
@@ -2442,12 +2571,12 @@ var FeatureCard = ({ feature, bgImage }) => {
|
|
|
2442
2571
|
${isFgLoading ? "opacity-0 blur-xl" : "opacity-100 blur-0"}
|
|
2443
2572
|
`
|
|
2444
2573
|
}
|
|
2445
|
-
))), /* @__PURE__ */
|
|
2574
|
+
))), /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex flex-col text-left pr-4" }, /* @__PURE__ */ import_react43.default.createElement("h3", { className: " text-xl tracking-tight text-black mb-2" }, feature.title), /* @__PURE__ */ import_react43.default.createElement("p", { className: "text-[13px] leading-relaxed text-neutral-600 max-w-[90%]" }, feature.desc)));
|
|
2446
2575
|
};
|
|
2447
2576
|
var FeatureScroll = ({ tagline, headline, features }) => {
|
|
2448
|
-
const scrollRef = (0,
|
|
2449
|
-
const [canScrollLeft, setCanScrollLeft] = (0,
|
|
2450
|
-
const [canScrollRight, setCanScrollRight] = (0,
|
|
2577
|
+
const scrollRef = (0, import_react43.useRef)(null);
|
|
2578
|
+
const [canScrollLeft, setCanScrollLeft] = (0, import_react43.useState)(false);
|
|
2579
|
+
const [canScrollRight, setCanScrollRight] = (0, import_react43.useState)(true);
|
|
2451
2580
|
const checkScroll = () => {
|
|
2452
2581
|
if (scrollRef.current) {
|
|
2453
2582
|
const { scrollLeft, scrollWidth, clientWidth } = scrollRef.current;
|
|
@@ -2455,7 +2584,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
2455
2584
|
setCanScrollRight(scrollLeft < scrollWidth - clientWidth - 2);
|
|
2456
2585
|
}
|
|
2457
2586
|
};
|
|
2458
|
-
(0,
|
|
2587
|
+
(0, import_react43.useEffect)(() => {
|
|
2459
2588
|
checkScroll();
|
|
2460
2589
|
window.addEventListener("resize", checkScroll);
|
|
2461
2590
|
return () => window.removeEventListener("resize", checkScroll);
|
|
@@ -2471,7 +2600,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
2471
2600
|
"https://retinalabs.company/assets/images/bg_6.avif",
|
|
2472
2601
|
"https://retinalabs.company/assets/images/bg_1.avif"
|
|
2473
2602
|
];
|
|
2474
|
-
return /* @__PURE__ */
|
|
2603
|
+
return /* @__PURE__ */ import_react43.default.createElement("section", { className: "py-24 w-full flex justify-center relative z-10 overflow-hidden" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex flex-col md:flex-row md:items-end justify-between gap-6 mb-12" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "relative z-10 text-left" }, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ import_react43.default.createElement("h2", { className: " text-3xl tracking-tight text-black leading-[1.05]" }, headline)), /* @__PURE__ */ import_react43.default.createElement("div", { className: "hidden md:flex items-center gap-3" }, /* @__PURE__ */ import_react43.default.createElement(
|
|
2475
2604
|
"button",
|
|
2476
2605
|
{
|
|
2477
2606
|
onClick: () => scroll("left"),
|
|
@@ -2479,8 +2608,8 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
2479
2608
|
className: "p-4 border border-neutral-200 rounded-full text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 disabled:hover:border-neutral-200 disabled:hover:text-neutral-500 disabled:cursor-not-allowed transition-all outline-none",
|
|
2480
2609
|
"aria-label": "Previous feature"
|
|
2481
2610
|
},
|
|
2482
|
-
/* @__PURE__ */
|
|
2483
|
-
), /* @__PURE__ */
|
|
2611
|
+
/* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons15.ArrowLeft01Icon, size: 20 })
|
|
2612
|
+
), /* @__PURE__ */ import_react43.default.createElement(
|
|
2484
2613
|
"button",
|
|
2485
2614
|
{
|
|
2486
2615
|
onClick: () => scroll("right"),
|
|
@@ -2488,57 +2617,57 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
2488
2617
|
className: "p-4 border border-neutral-200 rounded-full text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 disabled:hover:border-neutral-200 disabled:hover:text-neutral-500 disabled:cursor-not-allowed transition-all outline-none",
|
|
2489
2618
|
"aria-label": "Next feature"
|
|
2490
2619
|
},
|
|
2491
|
-
/* @__PURE__ */
|
|
2492
|
-
))), /* @__PURE__ */
|
|
2620
|
+
/* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons15.ArrowRight01Icon, size: 20 })
|
|
2621
|
+
))), /* @__PURE__ */ import_react43.default.createElement(
|
|
2493
2622
|
"div",
|
|
2494
2623
|
{
|
|
2495
2624
|
ref: scrollRef,
|
|
2496
2625
|
onScroll: checkScroll,
|
|
2497
2626
|
className: "flex gap-6 overflow-x-auto snap-x snap-mandatory [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] scrollbar-none pb-8 -mx-4 px-4 md:mx-0 md:px-0"
|
|
2498
2627
|
},
|
|
2499
|
-
features.slice(0, 3).map((feature, idx) => /* @__PURE__ */
|
|
2500
|
-
), /* @__PURE__ */
|
|
2628
|
+
features.slice(0, 3).map((feature, idx) => /* @__PURE__ */ import_react43.default.createElement(FeatureCard, { key: idx, feature, bgImage: bgImages[idx] }))
|
|
2629
|
+
), /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex md:hidden items-center justify-center gap-4 mt-2" }, /* @__PURE__ */ import_react43.default.createElement(
|
|
2501
2630
|
"button",
|
|
2502
2631
|
{
|
|
2503
2632
|
onClick: () => scroll("left"),
|
|
2504
2633
|
disabled: !canScrollLeft,
|
|
2505
2634
|
className: "p-4 border border-neutral-200 rounded-full text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 transition-all outline-none"
|
|
2506
2635
|
},
|
|
2507
|
-
/* @__PURE__ */
|
|
2508
|
-
), /* @__PURE__ */
|
|
2636
|
+
/* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons15.ArrowLeft01Icon, size: 20 })
|
|
2637
|
+
), /* @__PURE__ */ import_react43.default.createElement(
|
|
2509
2638
|
"button",
|
|
2510
2639
|
{
|
|
2511
2640
|
onClick: () => scroll("right"),
|
|
2512
2641
|
disabled: !canScrollRight,
|
|
2513
2642
|
className: "p-4 border border-neutral-200 rounded-full text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 transition-all outline-none"
|
|
2514
2643
|
},
|
|
2515
|
-
/* @__PURE__ */
|
|
2644
|
+
/* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons15.ArrowRight01Icon, size: 20 })
|
|
2516
2645
|
))));
|
|
2517
2646
|
};
|
|
2518
2647
|
|
|
2519
2648
|
// src/components/PlatformFeatures.tsx
|
|
2520
|
-
var
|
|
2521
|
-
var
|
|
2649
|
+
var import_react45 = __toESM(require("react"));
|
|
2650
|
+
var import_react46 = require("@hugeicons/react");
|
|
2522
2651
|
var PlatformFeatures = ({
|
|
2523
2652
|
tagline,
|
|
2524
2653
|
headline,
|
|
2525
2654
|
description,
|
|
2526
2655
|
features
|
|
2527
2656
|
}) => {
|
|
2528
|
-
return /* @__PURE__ */
|
|
2657
|
+
return /* @__PURE__ */ import_react45.default.createElement("section", { className: "w-full flex justify-center mb-15 relative z-10" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "flex flex-col items-start mb-16 relative z-10" }, /* @__PURE__ */ import_react45.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ import_react45.default.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.05] mb-6" }, headline), /* @__PURE__ */ import_react45.default.createElement("p", { className: "text-[15px] leading-[1.8] text-neutral-600 max-w-2xl" }, description)), /* @__PURE__ */ import_react45.default.createElement("div", { className: "w-full h-px bg-neutral-100 mb-16", "aria-hidden": "true" }), /* @__PURE__ */ import_react45.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-8 gap-y-12" }, features.map((feature, idx) => /* @__PURE__ */ import_react45.default.createElement(
|
|
2529
2658
|
"div",
|
|
2530
2659
|
{
|
|
2531
2660
|
key: idx,
|
|
2532
2661
|
className: "flex flex-col group animate-in fade-in slide-in-from-bottom-4 duration-700 fill-mode-both",
|
|
2533
2662
|
style: { animationDelay: feature.delay || "0ms" }
|
|
2534
2663
|
},
|
|
2535
|
-
/* @__PURE__ */
|
|
2536
|
-
/* @__PURE__ */
|
|
2664
|
+
/* @__PURE__ */ import_react45.default.createElement("div", { className: "flex flex-row items-center gap-4 mb-4" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "w-14 h-14 shrink-0 rounded-xl border border-neutral-200 flex items-center justify-center text-neutral-600 transition-colors duration-300" }, /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: feature.icon, size: 24 })), /* @__PURE__ */ import_react45.default.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ import_react45.default.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400 mb-0.5" }, feature.label || "CAPABILITY"), /* @__PURE__ */ import_react45.default.createElement("h3", { className: "text-xl tracking-tight text-black" }, feature.title))),
|
|
2665
|
+
/* @__PURE__ */ import_react45.default.createElement("div", null, /* @__PURE__ */ import_react45.default.createElement("p", { className: "text-[13px] leading-relaxed text-neutral-600 pr-4" }, feature.desc))
|
|
2537
2666
|
)))));
|
|
2538
2667
|
};
|
|
2539
2668
|
|
|
2540
2669
|
// src/components/ManagedDocument.tsx
|
|
2541
|
-
var
|
|
2670
|
+
var import_react47 = __toESM(require("react"));
|
|
2542
2671
|
var ManagedDocument = ({
|
|
2543
2672
|
tagline,
|
|
2544
2673
|
title,
|
|
@@ -2546,9 +2675,9 @@ var ManagedDocument = ({
|
|
|
2546
2675
|
contactText,
|
|
2547
2676
|
contactEmail
|
|
2548
2677
|
}) => {
|
|
2549
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
2550
|
-
const titleRef = (0,
|
|
2551
|
-
(0,
|
|
2678
|
+
const [isAnimating, setIsAnimating] = (0, import_react47.useState)(false);
|
|
2679
|
+
const titleRef = (0, import_react47.useRef)(null);
|
|
2680
|
+
(0, import_react47.useEffect)(() => {
|
|
2552
2681
|
const observer = new IntersectionObserver(
|
|
2553
2682
|
([entry]) => {
|
|
2554
2683
|
if (entry.isIntersecting) {
|
|
@@ -2568,7 +2697,7 @@ var ManagedDocument = ({
|
|
|
2568
2697
|
}, []);
|
|
2569
2698
|
return (
|
|
2570
2699
|
// Outer layout wrapper (takes up available space, adds padding)
|
|
2571
|
-
/* @__PURE__ */
|
|
2700
|
+
/* @__PURE__ */ import_react47.default.createElement("div", { className: "grow pt-4 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react47.default.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-7xl mx-auto overflow-hidden" }, /* @__PURE__ */ import_react47.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react47.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10" }, tagline && /* @__PURE__ */ import_react47.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 text-left block " }, tagline), /* @__PURE__ */ import_react47.default.createElement(
|
|
2572
2701
|
"h1",
|
|
2573
2702
|
{
|
|
2574
2703
|
ref: titleRef,
|
|
@@ -2576,7 +2705,7 @@ var ManagedDocument = ({
|
|
|
2576
2705
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
2577
2706
|
},
|
|
2578
2707
|
title
|
|
2579
|
-
)), sections.map((section, index) => /* @__PURE__ */
|
|
2708
|
+
)), sections.map((section, index) => /* @__PURE__ */ import_react47.default.createElement("div", { key: index, className: "relative px-5 md:px-12 py-8 md:py-10" }, section.heading && /* @__PURE__ */ import_react47.default.createElement("p", { className: " text-[11px] tracking-[0.2em] text-black mb-4 text-left " }, section.heading), section.paragraphs && section.paragraphs.length > 0 && /* @__PURE__ */ import_react47.default.createElement("div", { className: "text-[14px] leading-[1.8] text-neutral-700 space-y-4 text-left " }, section.paragraphs.map((text, pIndex) => /* @__PURE__ */ import_react47.default.createElement("p", { key: pIndex }, text))), section.quote && /* @__PURE__ */ import_react47.default.createElement("div", { className: `border-neutral-100 border rounded-xl p-6 ${section.paragraphs && section.paragraphs.length > 0 ? "mt-6" : ""}` }, /* @__PURE__ */ import_react47.default.createElement("p", { className: "text-neutral-900 text-[14px] md:text-[14px] leading-relaxed" }, '"', section.quote, '"')))), (contactText || contactEmail) && /* @__PURE__ */ import_react47.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ import_react47.default.createElement("p", { className: "text-[11px] text-neutral-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ import_react47.default.createElement(
|
|
2580
2709
|
"a",
|
|
2581
2710
|
{
|
|
2582
2711
|
href: `mailto:${contactEmail}`,
|
|
@@ -2588,18 +2717,18 @@ var ManagedDocument = ({
|
|
|
2588
2717
|
};
|
|
2589
2718
|
|
|
2590
2719
|
// src/components/ManagedContactBlock.tsx
|
|
2591
|
-
var
|
|
2592
|
-
var
|
|
2720
|
+
var import_react48 = __toESM(require("react"));
|
|
2721
|
+
var import_react49 = require("@hugeicons/react");
|
|
2593
2722
|
var SecureEmail = ({ user, domain, className }) => {
|
|
2594
|
-
const [isMounted, setIsMounted] = (0,
|
|
2595
|
-
(0,
|
|
2723
|
+
const [isMounted, setIsMounted] = (0, import_react48.useState)(false);
|
|
2724
|
+
(0, import_react48.useEffect)(() => {
|
|
2596
2725
|
setIsMounted(true);
|
|
2597
2726
|
}, []);
|
|
2598
2727
|
if (!isMounted) {
|
|
2599
|
-
return /* @__PURE__ */
|
|
2728
|
+
return /* @__PURE__ */ import_react48.default.createElement("span", { className, style: { opacity: 0 } }, "Loading");
|
|
2600
2729
|
}
|
|
2601
2730
|
const email = `${user}@${domain}`;
|
|
2602
|
-
return /* @__PURE__ */
|
|
2731
|
+
return /* @__PURE__ */ import_react48.default.createElement("a", { href: `mailto:${email}`, className }, email);
|
|
2603
2732
|
};
|
|
2604
2733
|
var ManagedContactBlock = ({
|
|
2605
2734
|
tagline,
|
|
@@ -2608,7 +2737,7 @@ var ManagedContactBlock = ({
|
|
|
2608
2737
|
emails,
|
|
2609
2738
|
socials
|
|
2610
2739
|
}) => {
|
|
2611
|
-
return /* @__PURE__ */
|
|
2740
|
+
return /* @__PURE__ */ import_react48.default.createElement("div", { className: "grow pt-4 pb-20 px-4 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react48.default.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-7xl mx-auto overflow-hidden" }, /* @__PURE__ */ import_react48.default.createElement(
|
|
2612
2741
|
"div",
|
|
2613
2742
|
{
|
|
2614
2743
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -2617,21 +2746,21 @@ var ManagedContactBlock = ({
|
|
|
2617
2746
|
backgroundRepeat: "repeat"
|
|
2618
2747
|
}
|
|
2619
2748
|
}
|
|
2620
|
-
), /* @__PURE__ */
|
|
2749
|
+
), /* @__PURE__ */ import_react48.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react48.default.createElement("div", { className: "relative px-8 md:px-12 py-10" }, tagline && /* @__PURE__ */ import_react48.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 text-left block " }, tagline), /* @__PURE__ */ import_react48.default.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight text-left" }, title)), /* @__PURE__ */ import_react48.default.createElement("div", { className: "relative px-8 md:px-12 py-8 pb-14" }, /* @__PURE__ */ import_react48.default.createElement("div", { className: "flex flex-wrap gap-12 lg:gap-16 w-full" }, company && /* @__PURE__ */ import_react48.default.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ import_react48.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-black mb-4 " }, "Contact Details"), /* @__PURE__ */ import_react48.default.createElement("div", { className: "space-y-3 text-[13px] text-neutral-600 leading-[1.8]" }, company.name && /* @__PURE__ */ import_react48.default.createElement("p", { className: "text-black" }, company.name), company.lines && company.lines.map((line, idx) => /* @__PURE__ */ import_react48.default.createElement("p", { key: idx }, line)), company.phone && /* @__PURE__ */ import_react48.default.createElement("p", { className: "pt-2" }, /* @__PURE__ */ import_react48.default.createElement(
|
|
2621
2750
|
"a",
|
|
2622
2751
|
{
|
|
2623
2752
|
href: `tel:${company.phone.replace(/\s+/g, "")}`,
|
|
2624
2753
|
className: "transition-colors hover:text-black"
|
|
2625
2754
|
},
|
|
2626
2755
|
company.phone
|
|
2627
|
-
)))), emails && emails.length > 0 && /* @__PURE__ */
|
|
2756
|
+
)))), emails && emails.length > 0 && /* @__PURE__ */ import_react48.default.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ import_react48.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-black mb-4 " }, "Email Directory"), /* @__PURE__ */ import_react48.default.createElement("div", { className: "space-y-6 text-[13px]" }, emails.map((email, idx) => /* @__PURE__ */ import_react48.default.createElement("div", { key: idx }, /* @__PURE__ */ import_react48.default.createElement("p", { className: "text-[11px] tracking-[0.2em] mb-1.5 text-neutral-500 " }, email.label), /* @__PURE__ */ import_react48.default.createElement(
|
|
2628
2757
|
SecureEmail,
|
|
2629
2758
|
{
|
|
2630
2759
|
user: email.user,
|
|
2631
2760
|
domain: email.domain,
|
|
2632
2761
|
className: "text-neutral-600 transition-colors hover:text-black"
|
|
2633
2762
|
}
|
|
2634
|
-
))))), socials && socials.length > 0 && /* @__PURE__ */
|
|
2763
|
+
))))), socials && socials.length > 0 && /* @__PURE__ */ import_react48.default.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ import_react48.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-black mb-4 " }, "Find Us Online"), /* @__PURE__ */ import_react48.default.createElement("div", { className: "flex flex-col space-y-5 pt-1" }, socials.map((social, idx) => /* @__PURE__ */ import_react48.default.createElement(
|
|
2635
2764
|
"a",
|
|
2636
2765
|
{
|
|
2637
2766
|
key: idx,
|
|
@@ -2641,27 +2770,27 @@ var ManagedContactBlock = ({
|
|
|
2641
2770
|
className: "flex items-center gap-3 transition-colors group text-neutral-600 hover:text-black",
|
|
2642
2771
|
"aria-label": social.label
|
|
2643
2772
|
},
|
|
2644
|
-
/* @__PURE__ */
|
|
2645
|
-
/* @__PURE__ */
|
|
2773
|
+
/* @__PURE__ */ import_react48.default.createElement(import_react49.HugeiconsIcon, { icon: social.icon, size: 18 }),
|
|
2774
|
+
/* @__PURE__ */ import_react48.default.createElement("span", { className: "text-[13px]" }, social.label)
|
|
2646
2775
|
)))))))));
|
|
2647
2776
|
};
|
|
2648
2777
|
|
|
2649
2778
|
// src/components/ManagedPricingBlock.tsx
|
|
2650
|
-
var
|
|
2779
|
+
var import_react50 = __toESM(require("react"));
|
|
2651
2780
|
var import_link6 = __toESM(require("next/link"));
|
|
2652
2781
|
var import_image4 = __toESM(require("next/image"));
|
|
2653
|
-
var CheckIcon = ({ className = "" }) => /* @__PURE__ */
|
|
2654
|
-
var CrossIcon = ({ className = "" }) => /* @__PURE__ */
|
|
2782
|
+
var CheckIcon = ({ className = "" }) => /* @__PURE__ */ import_react50.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_react50.default.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "black" }), /* @__PURE__ */ import_react50.default.createElement("path", { d: "M8 12L11 15L16 9", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
2783
|
+
var CrossIcon = ({ className = "" }) => /* @__PURE__ */ import_react50.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_react50.default.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "#F5F5F5" }), /* @__PURE__ */ import_react50.default.createElement("path", { d: "M15 9L9 15M9 9l6 6", stroke: "#D4D4D4", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
2655
2784
|
var ManagedPricingBlock = ({
|
|
2656
2785
|
tagline,
|
|
2657
2786
|
title,
|
|
2658
2787
|
plans = [],
|
|
2659
2788
|
tabs
|
|
2660
2789
|
}) => {
|
|
2661
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
2662
|
-
const [activeTabIndex, setActiveTabIndex] = (0,
|
|
2663
|
-
const titleRef = (0,
|
|
2664
|
-
(0,
|
|
2790
|
+
const [isAnimating, setIsAnimating] = (0, import_react50.useState)(false);
|
|
2791
|
+
const [activeTabIndex, setActiveTabIndex] = (0, import_react50.useState)(0);
|
|
2792
|
+
const titleRef = (0, import_react50.useRef)(null);
|
|
2793
|
+
(0, import_react50.useEffect)(() => {
|
|
2665
2794
|
const observer = new IntersectionObserver(
|
|
2666
2795
|
([entry]) => {
|
|
2667
2796
|
if (entry.isIntersecting) {
|
|
@@ -2681,7 +2810,7 @@ var ManagedPricingBlock = ({
|
|
|
2681
2810
|
}, []);
|
|
2682
2811
|
const hasTabs = tabs && tabs.length > 0;
|
|
2683
2812
|
const currentPlans = hasTabs ? tabs[activeTabIndex].plans : plans;
|
|
2684
|
-
return /* @__PURE__ */
|
|
2813
|
+
return /* @__PURE__ */ import_react50.default.createElement("div", { className: "grow pt-10 pb-20 px-4 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react50.default.createElement("div", { className: "w-full max-w-5xl mx-auto flex flex-col items-center" }, /* @__PURE__ */ import_react50.default.createElement("div", { className: "w-full flex flex-col items-center text-center mb-10 sm:mb-12" }, tagline && /* @__PURE__ */ import_react50.default.createElement("span", { className: "text-[9px] tracking-[0.4em] text-black block " }, tagline), /* @__PURE__ */ import_react50.default.createElement(
|
|
2685
2814
|
"h1",
|
|
2686
2815
|
{
|
|
2687
2816
|
ref: titleRef,
|
|
@@ -2689,9 +2818,9 @@ var ManagedPricingBlock = ({
|
|
|
2689
2818
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
2690
2819
|
},
|
|
2691
2820
|
title
|
|
2692
|
-
)), hasTabs && /* @__PURE__ */
|
|
2821
|
+
)), hasTabs && /* @__PURE__ */ import_react50.default.createElement("div", { className: "flex items-center justify-center mb-8 sm:mb-10 w-full animate-in fade-in duration-300 px-2" }, /* @__PURE__ */ import_react50.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) => {
|
|
2693
2822
|
const isActive = activeTabIndex === idx;
|
|
2694
|
-
return /* @__PURE__ */
|
|
2823
|
+
return /* @__PURE__ */ import_react50.default.createElement(
|
|
2695
2824
|
"button",
|
|
2696
2825
|
{
|
|
2697
2826
|
key: idx,
|
|
@@ -2700,19 +2829,19 @@ var ManagedPricingBlock = ({
|
|
|
2700
2829
|
},
|
|
2701
2830
|
tab.label
|
|
2702
2831
|
);
|
|
2703
|
-
}))), /* @__PURE__ */
|
|
2832
|
+
}))), /* @__PURE__ */ import_react50.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5 w-full max-w-3xl animate-in slide-in-from-bottom-2 fade-in duration-500" }, currentPlans.map((plan, planIdx) => /* @__PURE__ */ import_react50.default.createElement(
|
|
2704
2833
|
"div",
|
|
2705
2834
|
{
|
|
2706
2835
|
key: `${activeTabIndex}-${planIdx}`,
|
|
2707
2836
|
className: `bg-white rounded-3xl p-6 flex flex-col relative overflow-hidden transition-all duration-300 ${plan.isPremium ? "" : ""}`
|
|
2708
2837
|
},
|
|
2709
|
-
/* @__PURE__ */
|
|
2838
|
+
/* @__PURE__ */ import_react50.default.createElement("div", { className: "mb-6" }, /* @__PURE__ */ import_react50.default.createElement("span", { className: "text-black text-base block mb-1" }, plan.name), /* @__PURE__ */ import_react50.default.createElement("div", { className: "flex items-baseline gap-1" }, /* @__PURE__ */ import_react50.default.createElement("h3", { className: "text-3xl font-light text-black" }, plan.price), plan.period && /* @__PURE__ */ import_react50.default.createElement("span", { className: "text-xs text-neutral-500" }, plan.period)), /* @__PURE__ */ import_react50.default.createElement("p", { className: "text-xs text-neutral-500 mt-2 min-h-8" }, plan.description), plan.showApps && plan.appLogos && plan.appLogos.length > 0 && /* @__PURE__ */ import_react50.default.createElement("div", { className: "flex items-center gap-2 mt-4" }, plan.appLogos.map((logo, logoIdx) => /* @__PURE__ */ import_react50.default.createElement(
|
|
2710
2839
|
"div",
|
|
2711
2840
|
{
|
|
2712
2841
|
key: logoIdx,
|
|
2713
2842
|
className: "relative w-5 h-5 overflow-hidden flex items-center justify-center shrink-0"
|
|
2714
2843
|
},
|
|
2715
|
-
/* @__PURE__ */
|
|
2844
|
+
/* @__PURE__ */ import_react50.default.createElement(
|
|
2716
2845
|
import_image4.default,
|
|
2717
2846
|
{
|
|
2718
2847
|
src: logo.src,
|
|
@@ -2723,7 +2852,7 @@ var ManagedPricingBlock = ({
|
|
|
2723
2852
|
}
|
|
2724
2853
|
)
|
|
2725
2854
|
)))),
|
|
2726
|
-
plan.isPremium ? /* @__PURE__ */
|
|
2855
|
+
plan.isPremium ? /* @__PURE__ */ import_react50.default.createElement(ThreeDButton, { href: plan.ctaHref, className: "mb-6 w-full" }, plan.ctaText) : /* @__PURE__ */ import_react50.default.createElement(
|
|
2727
2856
|
import_link6.default,
|
|
2728
2857
|
{
|
|
2729
2858
|
href: plan.ctaHref,
|
|
@@ -2731,20 +2860,20 @@ var ManagedPricingBlock = ({
|
|
|
2731
2860
|
},
|
|
2732
2861
|
plan.ctaText
|
|
2733
2862
|
),
|
|
2734
|
-
/* @__PURE__ */
|
|
2863
|
+
/* @__PURE__ */ import_react50.default.createElement("div", { className: "flex flex-col gap-3" }, plan.features.map((feature, featureIdx) => {
|
|
2735
2864
|
const isAvailable = feature.value !== false;
|
|
2736
2865
|
const valueText = typeof feature.value === "string" ? feature.value : "";
|
|
2737
|
-
return /* @__PURE__ */
|
|
2866
|
+
return /* @__PURE__ */ import_react50.default.createElement("div", { key: featureIdx, className: "flex items-center gap-2.5" }, isAvailable ? /* @__PURE__ */ import_react50.default.createElement(CheckIcon, null) : /* @__PURE__ */ import_react50.default.createElement(CrossIcon, null), /* @__PURE__ */ import_react50.default.createElement("span", { className: `text-xs truncate ${isAvailable ? "text-neutral-800" : "text-neutral-400"}` }, feature.name, valueText && /* @__PURE__ */ import_react50.default.createElement("span", { className: "text-neutral-500 ml-1" }, "(", valueText, ")")));
|
|
2738
2867
|
}))
|
|
2739
2868
|
)))));
|
|
2740
2869
|
};
|
|
2741
2870
|
|
|
2742
2871
|
// src/components/ManagedBoardBlock.tsx
|
|
2743
|
-
var
|
|
2872
|
+
var import_react51 = __toESM(require("react"));
|
|
2744
2873
|
var import_image5 = __toESM(require("next/image"));
|
|
2745
|
-
var
|
|
2746
|
-
var
|
|
2747
|
-
var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */
|
|
2874
|
+
var import_react52 = require("@hugeicons/react");
|
|
2875
|
+
var import_core_free_icons16 = require("@hugeicons/core-free-icons");
|
|
2876
|
+
var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */ import_react51.default.createElement(
|
|
2748
2877
|
"a",
|
|
2749
2878
|
{
|
|
2750
2879
|
href,
|
|
@@ -2753,7 +2882,7 @@ var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */ import_r
|
|
|
2753
2882
|
className: "text-neutral-400 hover:text-black transition-colors",
|
|
2754
2883
|
"aria-label": `${name} on ${label}`
|
|
2755
2884
|
},
|
|
2756
|
-
/* @__PURE__ */
|
|
2885
|
+
/* @__PURE__ */ import_react51.default.createElement(import_react52.HugeiconsIcon, { icon, size: 16 })
|
|
2757
2886
|
);
|
|
2758
2887
|
var ManagedBoardBlock = ({
|
|
2759
2888
|
tagline,
|
|
@@ -2762,7 +2891,7 @@ var ManagedBoardBlock = ({
|
|
|
2762
2891
|
contactText,
|
|
2763
2892
|
contactEmail
|
|
2764
2893
|
}) => {
|
|
2765
|
-
return /* @__PURE__ */
|
|
2894
|
+
return /* @__PURE__ */ import_react51.default.createElement("div", { className: "grow pt-4 pb-20 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react51.default.createElement("div", { className: "relative w-full mx-auto overflow-hidden max-w-7xl" }, /* @__PURE__ */ import_react51.default.createElement(
|
|
2766
2895
|
"div",
|
|
2767
2896
|
{
|
|
2768
2897
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -2771,7 +2900,7 @@ var ManagedBoardBlock = ({
|
|
|
2771
2900
|
backgroundRepeat: "repeat"
|
|
2772
2901
|
}
|
|
2773
2902
|
}
|
|
2774
|
-
), /* @__PURE__ */
|
|
2903
|
+
), /* @__PURE__ */ import_react51.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react51.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10" }, tagline && /* @__PURE__ */ import_react51.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 text-left block " }, tagline), /* @__PURE__ */ import_react51.default.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight text-left" }, title)), /* @__PURE__ */ import_react51.default.createElement("div", { className: "relative px-5 md:px-12 py-4 md:py-8" }, /* @__PURE__ */ import_react51.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-5 md:gap-8" }, members.map((member, idx) => /* @__PURE__ */ import_react51.default.createElement("div", { key: idx, className: "relative p-6 md:p-8 rounded-2xl bg-white flex flex-col transition-all group" }, /* @__PURE__ */ import_react51.default.createElement("div", { className: "flex items-start space-x-4 md:space-x-5 mb-5 md:mb-6" }, /* @__PURE__ */ import_react51.default.createElement("div", { className: "relative w-14 h-14 md:w-16 md:h-16 shrink-0 bg-white overflow-hidden rounded-xl" }, /* @__PURE__ */ import_react51.default.createElement(
|
|
2775
2904
|
import_image5.default,
|
|
2776
2905
|
{
|
|
2777
2906
|
src: member.imageSrc,
|
|
@@ -2780,44 +2909,44 @@ var ManagedBoardBlock = ({
|
|
|
2780
2909
|
sizes: "(max-width: 768px) 56px, 64px",
|
|
2781
2910
|
className: "object-cover grayscale opacity-100 transition-opacity"
|
|
2782
2911
|
}
|
|
2783
|
-
)), /* @__PURE__ */
|
|
2912
|
+
)), /* @__PURE__ */ import_react51.default.createElement("div", { className: "pt-1" }, /* @__PURE__ */ import_react51.default.createElement("h3", { className: " text-[14px] md:text-[15px] text-black tracking-tight" }, member.name), /* @__PURE__ */ import_react51.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-500 mt-1.5 " }, member.title))), /* @__PURE__ */ import_react51.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 text-left grow mb-8" }, member.bio), /* @__PURE__ */ import_react51.default.createElement("div", { className: "space-y-6 mt-auto" }, /* @__PURE__ */ import_react51.default.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ import_react51.default.createElement(ThreeDButton, { href: member.website }, "Visit Website")), /* @__PURE__ */ import_react51.default.createElement("div", { className: "flex space-x-4 pt-5" }, member.twitterHandle && member.twitterHandle.length > 0 && /* @__PURE__ */ import_react51.default.createElement(
|
|
2784
2913
|
MemberSocialLink,
|
|
2785
2914
|
{
|
|
2786
2915
|
href: `https://x.com/${member.twitterHandle}`,
|
|
2787
|
-
icon:
|
|
2916
|
+
icon: import_core_free_icons16.TwitterIcon,
|
|
2788
2917
|
label: "X",
|
|
2789
2918
|
name: member.name
|
|
2790
2919
|
}
|
|
2791
|
-
), member.linkedinHandle && member.linkedinHandle.length > 0 && /* @__PURE__ */
|
|
2920
|
+
), member.linkedinHandle && member.linkedinHandle.length > 0 && /* @__PURE__ */ import_react51.default.createElement(
|
|
2792
2921
|
MemberSocialLink,
|
|
2793
2922
|
{
|
|
2794
2923
|
href: member.linkedinHandle,
|
|
2795
|
-
icon:
|
|
2924
|
+
icon: import_core_free_icons16.LinkedinIcon,
|
|
2796
2925
|
label: "LinkedIn",
|
|
2797
2926
|
name: member.name
|
|
2798
2927
|
}
|
|
2799
|
-
))))))), (contactText || contactEmail) && /* @__PURE__ */
|
|
2928
|
+
))))))), (contactText || contactEmail) && /* @__PURE__ */ import_react51.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ import_react51.default.createElement("p", { className: "text-[11px] text-neutral-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ import_react51.default.createElement("a", { href: `mailto:${contactEmail}`, className: "text-black decoration-black decoration-2 underline-offset-4 ml-1 transition-colors" }, contactEmail))))));
|
|
2800
2929
|
};
|
|
2801
2930
|
|
|
2802
2931
|
// src/components/ManagedNotFoundBlock.tsx
|
|
2803
|
-
var
|
|
2932
|
+
var import_react53 = __toESM(require("react"));
|
|
2804
2933
|
var ManagedNotFoundBlock = ({
|
|
2805
2934
|
title = "404 - Page Not Found",
|
|
2806
2935
|
description = "The page you are looking for does not exist or has been moved."
|
|
2807
2936
|
}) => {
|
|
2808
|
-
return /* @__PURE__ */
|
|
2937
|
+
return /* @__PURE__ */ import_react53.default.createElement("main", { className: "min-h-screen flex items-center justify-center relative z-20 bg-transparent" }, /* @__PURE__ */ import_react53.default.createElement("div", { className: "p-6 w-full max-w-md mx-auto text-center" }, /* @__PURE__ */ import_react53.default.createElement("div", { className: "mb-8 flex justify-center" }, /* @__PURE__ */ import_react53.default.createElement(
|
|
2809
2938
|
"svg",
|
|
2810
2939
|
{
|
|
2811
2940
|
xmlns: "http://www.w3.org/2000/svg",
|
|
2812
2941
|
viewBox: "0 0 24 24",
|
|
2813
2942
|
className: "w-12 h-12 fill-neutral-100"
|
|
2814
2943
|
},
|
|
2815
|
-
/* @__PURE__ */
|
|
2816
|
-
)), /* @__PURE__ */
|
|
2944
|
+
/* @__PURE__ */ import_react53.default.createElement("path", { fillRule: "evenodd", d: "M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12zM12 8.25a.75.75 0 01.75.75v3.75a.75.75 0 01-1.5 0V9a.75.75 0 01.75-.75zm0 8.25a.75.75 0 100-1.5.75.75 0 000 1.5z", clipRule: "evenodd" })
|
|
2945
|
+
)), /* @__PURE__ */ import_react53.default.createElement("h1", { className: " text-xl md:text-3xl text-black tracking-tight mb-4" }, title), /* @__PURE__ */ import_react53.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-12" }, description)));
|
|
2817
2946
|
};
|
|
2818
2947
|
|
|
2819
2948
|
// src/components/ManagedNewsletterSplitBlock.tsx
|
|
2820
|
-
var
|
|
2949
|
+
var import_react54 = __toESM(require("react"));
|
|
2821
2950
|
var import_image6 = __toESM(require("next/image"));
|
|
2822
2951
|
var ManagedNewsletterSplitBlock = ({
|
|
2823
2952
|
tagline,
|
|
@@ -2831,7 +2960,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
2831
2960
|
ctaHref = "/contact",
|
|
2832
2961
|
children
|
|
2833
2962
|
}) => {
|
|
2834
|
-
return /* @__PURE__ */
|
|
2963
|
+
return /* @__PURE__ */ import_react54.default.createElement("div", { className: "grow flex flex-col md:flex-row relative w-full pt-32 md:pt-0" }, /* @__PURE__ */ import_react54.default.createElement("div", { className: "hidden md:block md:w-1/2 relative min-h-screen overflow-hidden" }, /* @__PURE__ */ import_react54.default.createElement(
|
|
2835
2964
|
import_image6.default,
|
|
2836
2965
|
{
|
|
2837
2966
|
src: imageSrc,
|
|
@@ -2841,7 +2970,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
2841
2970
|
className: "object-cover object-top grayscale opacity-60",
|
|
2842
2971
|
quality: 100
|
|
2843
2972
|
}
|
|
2844
|
-
), /* @__PURE__ */
|
|
2973
|
+
), /* @__PURE__ */ import_react54.default.createElement(
|
|
2845
2974
|
"div",
|
|
2846
2975
|
{
|
|
2847
2976
|
className: "absolute inset-0 z-10 pointer-events-none",
|
|
@@ -2849,7 +2978,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
2849
2978
|
background: "linear-gradient(to right, rgba(255,255,255,0) 30%, #ffffff 100%)"
|
|
2850
2979
|
}
|
|
2851
2980
|
}
|
|
2852
|
-
), /* @__PURE__ */
|
|
2981
|
+
), /* @__PURE__ */ import_react54.default.createElement(
|
|
2853
2982
|
"div",
|
|
2854
2983
|
{
|
|
2855
2984
|
className: "absolute inset-x-0 bottom-0 h-40 z-10 pointer-events-none",
|
|
@@ -2857,7 +2986,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
2857
2986
|
background: "linear-gradient(to bottom, rgba(255,255,255,0) 0%, #ffffff 100%)"
|
|
2858
2987
|
}
|
|
2859
2988
|
}
|
|
2860
|
-
)), /* @__PURE__ */
|
|
2989
|
+
)), /* @__PURE__ */ import_react54.default.createElement("div", { className: "w-full md:w-1/2 flex mt-22 flex-col items-center justify-center p-4 md:p-12 relative z-20" }, /* @__PURE__ */ import_react54.default.createElement("div", { className: "relative w-full max-w-lg p-8 md:p-12 text-center md:text-left transition-all duration-700 ease-out" }, /* @__PURE__ */ import_react54.default.createElement(
|
|
2861
2990
|
"div",
|
|
2862
2991
|
{
|
|
2863
2992
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -2866,7 +2995,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
2866
2995
|
backgroundRepeat: "repeat"
|
|
2867
2996
|
}
|
|
2868
2997
|
}
|
|
2869
|
-
), /* @__PURE__ */
|
|
2998
|
+
), /* @__PURE__ */ import_react54.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react54.default.createElement("div", { className: "mb-10 border-b border-neutral-100 pb-8 text-center md:text-left" }, tagline && /* @__PURE__ */ import_react54.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 " }, tagline), /* @__PURE__ */ import_react54.default.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight mb-4" }, title), subtitle && /* @__PURE__ */ import_react54.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-500 " }, subtitle)), /* @__PURE__ */ import_react54.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-10 text-center md:text-left" }, description), children && /* @__PURE__ */ import_react54.default.createElement("div", { className: "mb-8 text-left" }, children), /* @__PURE__ */ import_react54.default.createElement("div", { className: "text-center md:text-left mt-10 space-y-6" }, dividerText && /* @__PURE__ */ import_react54.default.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ import_react54.default.createElement("div", { className: "grow h-px bg-neutral-100" }), /* @__PURE__ */ import_react54.default.createElement("span", { className: "shrink mx-4 text-[11px] tracking-[0.2em] text-neutral-400 " }, dividerText), /* @__PURE__ */ import_react54.default.createElement("div", { className: "grow h-px bg-neutral-100" })), ctaText && ctaHref && /* @__PURE__ */ import_react54.default.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ import_react54.default.createElement(
|
|
2870
2999
|
ThreeDButton,
|
|
2871
3000
|
{
|
|
2872
3001
|
href: ctaHref,
|
|
@@ -2877,14 +3006,14 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
2877
3006
|
};
|
|
2878
3007
|
|
|
2879
3008
|
// src/components/PortfolioHero.tsx
|
|
2880
|
-
var
|
|
3009
|
+
var import_react55 = __toESM(require("react"));
|
|
2881
3010
|
var import_link7 = __toESM(require("next/link"));
|
|
2882
3011
|
var import_image7 = __toESM(require("next/image"));
|
|
2883
|
-
var
|
|
2884
|
-
var
|
|
3012
|
+
var import_react56 = require("@hugeicons/react");
|
|
3013
|
+
var import_core_free_icons17 = require("@hugeicons/core-free-icons");
|
|
2885
3014
|
var useScrollAnimation = () => {
|
|
2886
|
-
const elementRef = (0,
|
|
2887
|
-
(0,
|
|
3015
|
+
const elementRef = (0, import_react55.useRef)(null);
|
|
3016
|
+
(0, import_react55.useEffect)(() => {
|
|
2888
3017
|
const el = elementRef.current;
|
|
2889
3018
|
if (!el) return;
|
|
2890
3019
|
const observer = new IntersectionObserver(
|
|
@@ -2920,13 +3049,13 @@ var PortfolioHero = ({
|
|
|
2920
3049
|
secondaryCtaHref
|
|
2921
3050
|
}) => {
|
|
2922
3051
|
const heroContentRef = useScrollAnimation();
|
|
2923
|
-
return /* @__PURE__ */
|
|
3052
|
+
return /* @__PURE__ */ import_react55.default.createElement("section", { className: "pt-8 pb-16 px-6 md:px-12 flex flex-col relative overflow-hidden z-10 w-full" }, /* @__PURE__ */ import_react55.default.createElement(
|
|
2924
3053
|
"div",
|
|
2925
3054
|
{
|
|
2926
3055
|
ref: heroContentRef,
|
|
2927
3056
|
className: "w-full opacity-0 translate-y-5 transition-all duration-1000 ease-out relative z-10"
|
|
2928
3057
|
},
|
|
2929
|
-
/* @__PURE__ */
|
|
3058
|
+
/* @__PURE__ */ import_react55.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center gap-5 sm:gap-8 mb-10" }, /* @__PURE__ */ import_react55.default.createElement("div", { className: "relative w-20 h-20 sm:w-32 sm:h-32 rounded-full overflow-hidden border border-neutral-100 shrink-0 shadow-sm" }, /* @__PURE__ */ import_react55.default.createElement(
|
|
2930
3059
|
import_image7.default,
|
|
2931
3060
|
{
|
|
2932
3061
|
src: imageSrc,
|
|
@@ -2937,7 +3066,7 @@ var PortfolioHero = ({
|
|
|
2937
3066
|
sizes: "(max-width: 640px) 80px, 128px",
|
|
2938
3067
|
quality: 100
|
|
2939
3068
|
}
|
|
2940
|
-
)), /* @__PURE__ */
|
|
3069
|
+
)), /* @__PURE__ */ import_react55.default.createElement("div", { className: "flex flex-col text-left" }, /* @__PURE__ */ import_react55.default.createElement("h1", { className: " text-3xl sm:text-5xl lg:text-6xl tracking-tight text-black leading-none mb-3" }, name), socialLabel && /* @__PURE__ */ import_react55.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 " }, socialLabel), socialLinkText && socialLinkHref && /* @__PURE__ */ import_react55.default.createElement(
|
|
2941
3070
|
"a",
|
|
2942
3071
|
{
|
|
2943
3072
|
href: socialLinkHref,
|
|
@@ -2947,31 +3076,31 @@ var PortfolioHero = ({
|
|
|
2947
3076
|
},
|
|
2948
3077
|
socialLinkText
|
|
2949
3078
|
))),
|
|
2950
|
-
/* @__PURE__ */
|
|
2951
|
-
/* @__PURE__ */
|
|
3079
|
+
/* @__PURE__ */ import_react55.default.createElement("p", { className: "text-[13px] leading-[1.8] max-w-4xl mb-12 text-neutral-600" }, bio),
|
|
3080
|
+
/* @__PURE__ */ import_react55.default.createElement("div", { className: "flex flex-col sm:flex-row gap-4 w-full sm:w-auto" }, primaryCtaText && primaryCtaHref && /* @__PURE__ */ import_react55.default.createElement("div", { className: "w-full sm:w-auto *:w-full" }, /* @__PURE__ */ import_react55.default.createElement(
|
|
2952
3081
|
ThreeDButton,
|
|
2953
3082
|
{
|
|
2954
3083
|
href: primaryCtaHref,
|
|
2955
3084
|
className: "py-3 tracking-widest text-[11px]"
|
|
2956
3085
|
},
|
|
2957
3086
|
primaryCtaText
|
|
2958
|
-
)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */
|
|
3087
|
+
)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ import_react55.default.createElement(
|
|
2959
3088
|
import_link7.default,
|
|
2960
3089
|
{
|
|
2961
3090
|
href: secondaryCtaHref,
|
|
2962
3091
|
className: "w-full sm:w-auto inline-flex items-center justify-center gap-3 text-[11px] tracking-[0.2em] rounded-full px-8 py-3.5 bg-neutral-200 transition-colors text-black hover:bg-neutral-200 outline-none"
|
|
2963
3092
|
},
|
|
2964
3093
|
secondaryCtaText,
|
|
2965
|
-
/* @__PURE__ */
|
|
3094
|
+
/* @__PURE__ */ import_react55.default.createElement(import_react56.HugeiconsIcon, { icon: import_core_free_icons17.ArrowRight01Icon, size: 16 })
|
|
2966
3095
|
))
|
|
2967
3096
|
));
|
|
2968
3097
|
};
|
|
2969
3098
|
|
|
2970
3099
|
// src/components/GifFeatureCard.tsx
|
|
2971
|
-
var
|
|
3100
|
+
var import_react57 = __toESM(require("react"));
|
|
2972
3101
|
var import_image8 = __toESM(require("next/image"));
|
|
2973
|
-
var
|
|
2974
|
-
var
|
|
3102
|
+
var import_react58 = require("@hugeicons/react");
|
|
3103
|
+
var import_core_free_icons18 = require("@hugeicons/core-free-icons");
|
|
2975
3104
|
var GifFeatureCard = ({
|
|
2976
3105
|
gifSrc,
|
|
2977
3106
|
title,
|
|
@@ -2979,20 +3108,20 @@ var GifFeatureCard = ({
|
|
|
2979
3108
|
alt = "Feature animation",
|
|
2980
3109
|
className = "aspect-video"
|
|
2981
3110
|
}) => {
|
|
2982
|
-
const [isLoading, setIsLoading] = (0,
|
|
2983
|
-
return /* @__PURE__ */
|
|
2984
|
-
|
|
3111
|
+
const [isLoading, setIsLoading] = (0, import_react57.useState)(true);
|
|
3112
|
+
return /* @__PURE__ */ import_react57.default.createElement("div", { className: `relative w-full bg-black overflow-hidden shadow-2xl ${className}` }, isLoading && /* @__PURE__ */ import_react57.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-black" }, /* @__PURE__ */ import_react57.default.createElement(
|
|
3113
|
+
import_react58.HugeiconsIcon,
|
|
2985
3114
|
{
|
|
2986
|
-
icon:
|
|
3115
|
+
icon: import_core_free_icons18.Loading03Icon,
|
|
2987
3116
|
size: 32,
|
|
2988
3117
|
className: "animate-spin text-white"
|
|
2989
3118
|
}
|
|
2990
|
-
)), /* @__PURE__ */
|
|
3119
|
+
)), /* @__PURE__ */ import_react57.default.createElement(
|
|
2991
3120
|
"div",
|
|
2992
3121
|
{
|
|
2993
3122
|
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"}`
|
|
2994
3123
|
},
|
|
2995
|
-
/* @__PURE__ */
|
|
3124
|
+
/* @__PURE__ */ import_react57.default.createElement(
|
|
2996
3125
|
import_image8.default,
|
|
2997
3126
|
{
|
|
2998
3127
|
src: gifSrc,
|
|
@@ -3003,16 +3132,16 @@ var GifFeatureCard = ({
|
|
|
3003
3132
|
className: "object-cover object-center pointer-events-none"
|
|
3004
3133
|
}
|
|
3005
3134
|
)
|
|
3006
|
-
), /* @__PURE__ */
|
|
3135
|
+
), /* @__PURE__ */ import_react57.default.createElement(
|
|
3007
3136
|
"div",
|
|
3008
3137
|
{
|
|
3009
3138
|
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"
|
|
3010
3139
|
}
|
|
3011
|
-
), /* @__PURE__ */
|
|
3140
|
+
), /* @__PURE__ */ import_react57.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_react57.default.createElement("h3", { className: " text-xl sm:text-2xl md:text-3xl text-white tracking-tight mb-2 sm:mb-3 drop-shadow-md" }, title), subtitle && /* @__PURE__ */ import_react57.default.createElement("p", { className: "text-[13px] sm:text-[15px] leading-relaxed text-neutral-300 max-w-2xl drop-shadow-sm" }, subtitle)));
|
|
3012
3141
|
};
|
|
3013
3142
|
|
|
3014
3143
|
// src/components/MedicalFeatureStatsBlock.tsx
|
|
3015
|
-
var
|
|
3144
|
+
var import_react59 = __toESM(require("react"));
|
|
3016
3145
|
var import_image9 = __toESM(require("next/image"));
|
|
3017
3146
|
var MedicalFeatureStatsBlock = ({
|
|
3018
3147
|
bottomHeadline,
|
|
@@ -3021,9 +3150,9 @@ var MedicalFeatureStatsBlock = ({
|
|
|
3021
3150
|
trustText,
|
|
3022
3151
|
stats
|
|
3023
3152
|
}) => {
|
|
3024
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
3025
|
-
const titleRef = (0,
|
|
3026
|
-
(0,
|
|
3153
|
+
const [isAnimating, setIsAnimating] = (0, import_react59.useState)(false);
|
|
3154
|
+
const titleRef = (0, import_react59.useRef)(null);
|
|
3155
|
+
(0, import_react59.useEffect)(() => {
|
|
3027
3156
|
const observer = new IntersectionObserver(
|
|
3028
3157
|
([entry]) => {
|
|
3029
3158
|
if (entry.isIntersecting) {
|
|
@@ -3041,7 +3170,7 @@ var MedicalFeatureStatsBlock = ({
|
|
|
3041
3170
|
}
|
|
3042
3171
|
return () => observer.disconnect();
|
|
3043
3172
|
}, []);
|
|
3044
|
-
return /* @__PURE__ */
|
|
3173
|
+
return /* @__PURE__ */ import_react59.default.createElement("section", { className: "py-24 w-full flex justify-center relative z-10" }, /* @__PURE__ */ import_react59.default.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ import_react59.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-10 mb-12" }, /* @__PURE__ */ import_react59.default.createElement("div", { className: "max-w-xl" }, /* @__PURE__ */ import_react59.default.createElement(
|
|
3045
3174
|
"h2",
|
|
3046
3175
|
{
|
|
3047
3176
|
ref: titleRef,
|
|
@@ -3049,7 +3178,7 @@ var MedicalFeatureStatsBlock = ({
|
|
|
3049
3178
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
3050
3179
|
},
|
|
3051
3180
|
bottomHeadline
|
|
3052
|
-
), /* @__PURE__ */
|
|
3181
|
+
), /* @__PURE__ */ import_react59.default.createElement("p", { className: "text-[14px] leading-relaxed text-neutral-500" }, bottomDescription)), /* @__PURE__ */ import_react59.default.createElement("div", { className: "flex items-center gap-4 shrink-0" }, /* @__PURE__ */ import_react59.default.createElement("div", { className: "flex -space-x-3" }, avatars.map((src, i) => /* @__PURE__ */ import_react59.default.createElement("div", { key: i, className: "relative w-12 h-12 rounded-full border-[3px] border-white overflow-hidden bg-neutral-100 z-1 hover:z-10 transition-all" }, /* @__PURE__ */ import_react59.default.createElement(
|
|
3053
3182
|
import_image9.default,
|
|
3054
3183
|
{
|
|
3055
3184
|
src,
|
|
@@ -3058,17 +3187,17 @@ var MedicalFeatureStatsBlock = ({
|
|
|
3058
3187
|
sizes: "48px",
|
|
3059
3188
|
className: "object-cover"
|
|
3060
3189
|
}
|
|
3061
|
-
)))), /* @__PURE__ */
|
|
3190
|
+
)))), /* @__PURE__ */ import_react59.default.createElement("p", { className: "text-[11px] text-neutral-800 leading-[1.4] max-w-55" }, trustText))), /* @__PURE__ */ import_react59.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6" }, stats.map((stat, idx) => /* @__PURE__ */ import_react59.default.createElement("div", { key: idx, className: "bg-white rounded-4xl p-8 md:p-10 flex flex-col h-70" }, /* @__PURE__ */ import_react59.default.createElement("div", { className: "flex items-center p-0.5 mb-6" }, /* @__PURE__ */ import_react59.default.createElement("span", { className: "text-[14px] text-neutral-500 tracking-wide" }, stat.label)), /* @__PURE__ */ import_react59.default.createElement("h1", { className: "text-6xl gradient-text md:text-[80px] tracking-tighter text-black mt-auto leading-none" }, stat.value))))));
|
|
3062
3191
|
};
|
|
3063
3192
|
|
|
3064
3193
|
// src/components/ConsultantShowcase.tsx
|
|
3065
|
-
var
|
|
3194
|
+
var import_react60 = __toESM(require("react"));
|
|
3066
3195
|
var import_image10 = __toESM(require("next/image"));
|
|
3067
|
-
var
|
|
3068
|
-
var
|
|
3196
|
+
var import_react61 = require("@hugeicons/react");
|
|
3197
|
+
var import_core_free_icons19 = require("@hugeicons/core-free-icons");
|
|
3069
3198
|
var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
|
|
3070
|
-
const [isLoading, setIsLoading] = (0,
|
|
3071
|
-
return /* @__PURE__ */
|
|
3199
|
+
const [isLoading, setIsLoading] = (0, import_react60.useState)(true);
|
|
3200
|
+
return /* @__PURE__ */ import_react60.default.createElement("div", { className: `absolute inset-0 bg-neutral-800 ${className}` }, isLoading && /* @__PURE__ */ import_react60.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-neutral-800/50 backdrop-blur-md transition-opacity duration-300" }, /* @__PURE__ */ import_react60.default.createElement(import_react61.HugeiconsIcon, { icon: import_core_free_icons19.Loading03Icon, size: 24, className: "animate-spin text-white/50" })), /* @__PURE__ */ import_react60.default.createElement(
|
|
3072
3201
|
import_image10.default,
|
|
3073
3202
|
{
|
|
3074
3203
|
src,
|
|
@@ -3087,9 +3216,9 @@ var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
|
|
|
3087
3216
|
var ConsultantShowcase = ({
|
|
3088
3217
|
profiles
|
|
3089
3218
|
}) => {
|
|
3090
|
-
const [currentIndex, setCurrentIndex] = (0,
|
|
3091
|
-
const [touchStart, setTouchStart] = (0,
|
|
3092
|
-
const [touchEnd, setTouchEnd] = (0,
|
|
3219
|
+
const [currentIndex, setCurrentIndex] = (0, import_react60.useState)(0);
|
|
3220
|
+
const [touchStart, setTouchStart] = (0, import_react60.useState)(null);
|
|
3221
|
+
const [touchEnd, setTouchEnd] = (0, import_react60.useState)(null);
|
|
3093
3222
|
const nextSlide = () => {
|
|
3094
3223
|
setCurrentIndex((prev) => prev === profiles.length - 1 ? 0 : prev + 1);
|
|
3095
3224
|
};
|
|
@@ -3114,7 +3243,7 @@ var ConsultantShowcase = ({
|
|
|
3114
3243
|
}
|
|
3115
3244
|
};
|
|
3116
3245
|
if (!profiles || profiles.length === 0) return null;
|
|
3117
|
-
return /* @__PURE__ */
|
|
3246
|
+
return /* @__PURE__ */ import_react60.default.createElement("section", { className: "py-24 w-full flex justify-center px-4 md:px-8 z-10 relative" }, /* @__PURE__ */ import_react60.default.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ import_react60.default.createElement(
|
|
3118
3247
|
"div",
|
|
3119
3248
|
{
|
|
3120
3249
|
className: "relative w-full h-100 md:h-112.5 rounded-4xl overflow-hidden bg-neutral-900 group select-none",
|
|
@@ -3124,13 +3253,13 @@ var ConsultantShowcase = ({
|
|
|
3124
3253
|
},
|
|
3125
3254
|
profiles.map((profile, idx) => {
|
|
3126
3255
|
const isActive = idx === currentIndex;
|
|
3127
|
-
return /* @__PURE__ */
|
|
3256
|
+
return /* @__PURE__ */ import_react60.default.createElement(
|
|
3128
3257
|
"div",
|
|
3129
3258
|
{
|
|
3130
3259
|
key: profile.id,
|
|
3131
3260
|
className: `absolute inset-0 transition-opacity duration-700 ease-in-out ${isActive ? "opacity-100 z-10" : "opacity-0 z-0 pointer-events-none"}`
|
|
3132
3261
|
},
|
|
3133
|
-
/* @__PURE__ */
|
|
3262
|
+
/* @__PURE__ */ import_react60.default.createElement(
|
|
3134
3263
|
ImageWithLoader,
|
|
3135
3264
|
{
|
|
3136
3265
|
src: profile.imageSrc,
|
|
@@ -3138,14 +3267,14 @@ var ConsultantShowcase = ({
|
|
|
3138
3267
|
priority: idx === 0
|
|
3139
3268
|
}
|
|
3140
3269
|
),
|
|
3141
|
-
/* @__PURE__ */
|
|
3142
|
-
/* @__PURE__ */
|
|
3143
|
-
/* @__PURE__ */
|
|
3270
|
+
/* @__PURE__ */ import_react60.default.createElement("div", { className: "absolute inset-0 bg-black/20 z-10 pointer-events-none" }),
|
|
3271
|
+
/* @__PURE__ */ import_react60.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" }),
|
|
3272
|
+
/* @__PURE__ */ import_react60.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_react60.default.createElement("h2", { className: "text-[29px] tracking-tight mb-2 leading-none" }, profile.name), /* @__PURE__ */ import_react60.default.createElement("div", { className: "flex flex-col gap-0.5" }, /* @__PURE__ */ import_react60.default.createElement("p", { className: "text-[15px] text-white/80 tracking-wide" }, profile.role), profile.description && /* @__PURE__ */ import_react60.default.createElement("p", { className: "text-[15px] text-white/80 tracking-wide mt-1" }, profile.description)))
|
|
3144
3273
|
);
|
|
3145
3274
|
}),
|
|
3146
|
-
/* @__PURE__ */
|
|
3147
|
-
/* @__PURE__ */
|
|
3148
|
-
/* @__PURE__ */
|
|
3275
|
+
/* @__PURE__ */ import_react60.default.createElement("div", { className: "absolute top-0 left-0 w-[20%] h-full z-40 cursor-w-resize hidden md:block", onClick: prevSlide, "aria-label": "Previous image" }),
|
|
3276
|
+
/* @__PURE__ */ import_react60.default.createElement("div", { className: "absolute top-0 right-0 w-[20%] h-full z-40 cursor-e-resize hidden md:block", onClick: nextSlide, "aria-label": "Next image" }),
|
|
3277
|
+
/* @__PURE__ */ import_react60.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_react60.default.createElement(
|
|
3149
3278
|
"button",
|
|
3150
3279
|
{
|
|
3151
3280
|
key: idx,
|
|
@@ -3158,13 +3287,13 @@ var ConsultantShowcase = ({
|
|
|
3158
3287
|
};
|
|
3159
3288
|
|
|
3160
3289
|
// src/components/ContentGridBlock.tsx
|
|
3161
|
-
var
|
|
3290
|
+
var import_react62 = __toESM(require("react"));
|
|
3162
3291
|
var import_image11 = __toESM(require("next/image"));
|
|
3163
|
-
var
|
|
3164
|
-
var
|
|
3292
|
+
var import_react63 = require("@hugeicons/react");
|
|
3293
|
+
var import_core_free_icons20 = require("@hugeicons/core-free-icons");
|
|
3165
3294
|
var ImageWithLoader2 = ({ src, alt, className, sizes }) => {
|
|
3166
|
-
const [isLoading, setIsLoading] = (0,
|
|
3167
|
-
return /* @__PURE__ */
|
|
3295
|
+
const [isLoading, setIsLoading] = (0, import_react62.useState)(true);
|
|
3296
|
+
return /* @__PURE__ */ import_react62.default.createElement("div", { className: `relative overflow-hidden bg-neutral-100 ${className}` }, isLoading && /* @__PURE__ */ import_react62.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-neutral-100/50 backdrop-blur-sm transition-opacity duration-300" }, /* @__PURE__ */ import_react62.default.createElement(import_react63.HugeiconsIcon, { icon: import_core_free_icons20.Loading03Icon, size: 24, className: "animate-spin text-neutral-400" })), /* @__PURE__ */ import_react62.default.createElement(
|
|
3168
3297
|
import_image11.default,
|
|
3169
3298
|
{
|
|
3170
3299
|
src,
|
|
@@ -3186,30 +3315,30 @@ var ContentGridBlock = ({
|
|
|
3186
3315
|
middleBottomCard,
|
|
3187
3316
|
rightCards
|
|
3188
3317
|
}) => {
|
|
3189
|
-
return /* @__PURE__ */
|
|
3318
|
+
return /* @__PURE__ */ import_react62.default.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ import_react62.default.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ import_react62.default.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ import_react62.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "bg-black rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-[17px] text-white leading-snug mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ import_react62.default.createElement("span", { className: "mb-auto text-[11px] text-neutral-200 tracking-widest" }, leftCard.tag), /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ import_react62.default.createElement("div", null, /* @__PURE__ */ import_react62.default.createElement("h4", { className: "text-[15px] text-white" }, leftCard.title), /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-[13px] text-neutral-300" }, leftCard.subtitle)), /* @__PURE__ */ import_react62.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react62.default.createElement(import_image11.default, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col relative h-75" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ import_react62.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ import_react62.default.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ import_react62.default.createElement(import_image11.default, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ import_react62.default.createElement("span", { className: "text-sm text-neutral-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ import_react62.default.createElement("div", { className: "grow flex flex-col justify-center items-center py-6" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "px-5 py-2 rounded-full bg-neutral-50/50 border border-neutral-100 text-[13px] text-neutral-600" }, middleTopCard.badgePrefix, " ", /* @__PURE__ */ import_react62.default.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ import_react62.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-[11px] text-neutral-400 tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-[14px] text-black leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ import_react62.default.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ import_react62.default.createElement("div", null, /* @__PURE__ */ import_react62.default.createElement("h4", { className: "text-[15px] text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-[13px] text-neutral-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ import_react62.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react62.default.createElement(import_image11.default, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ import_react62.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-[16px] text-black leading-snug mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ import_react62.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => /* @__PURE__ */ import_react62.default.createElement("div", { key: idx, className: "relative w-full h-80 text-white rounded-3xl overflow-hidden group" }, /* @__PURE__ */ import_react62.default.createElement(
|
|
3190
3319
|
ImageWithLoader2,
|
|
3191
3320
|
{
|
|
3192
3321
|
src: card.bgImageSrc,
|
|
3193
3322
|
alt: card.title,
|
|
3194
3323
|
className: "absolute inset-0 w-full h-full"
|
|
3195
3324
|
}
|
|
3196
|
-
), /* @__PURE__ */
|
|
3325
|
+
), /* @__PURE__ */ import_react62.default.createElement("div", { className: "absolute inset-0 z-20 pointer-events-none" }), /* @__PURE__ */ import_react62.default.createElement("div", { className: "absolute inset-0 z-30 p-6 flex flex-col justify-end text-white" }, /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-[14px] leading-snug mb-3 pr-2 text-white/90" }, card.mainText), card.tag && /* @__PURE__ */ import_react62.default.createElement("span", { className: "mb-4 text-[11px] text-white/50 tracking-widest" }, card.tag), /* @__PURE__ */ import_react62.default.createElement("div", { className: "pt-3" }, /* @__PURE__ */ import_react62.default.createElement("h4", { className: "text-[15px] text-white tracking-wide" }, card.title), /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-[13px] text-white/60" }, card.subtitle)))))))));
|
|
3197
3326
|
};
|
|
3198
3327
|
|
|
3199
3328
|
// src/components/ManagedProjectsBlock.tsx
|
|
3200
|
-
var
|
|
3329
|
+
var import_react64 = __toESM(require("react"));
|
|
3201
3330
|
var import_link8 = __toESM(require("next/link"));
|
|
3202
3331
|
var GridSection = ({
|
|
3203
3332
|
children,
|
|
3204
3333
|
isLast = false,
|
|
3205
3334
|
className = "py-8 md:py-10"
|
|
3206
|
-
}) => /* @__PURE__ */
|
|
3335
|
+
}) => /* @__PURE__ */ import_react64.default.createElement("div", { className: `relative px-5 md:px-12 ${className} ${!isLast ? "" : ""}` }, children);
|
|
3207
3336
|
var ManagedProjectsBlock = ({
|
|
3208
3337
|
tagline,
|
|
3209
3338
|
title,
|
|
3210
3339
|
projects
|
|
3211
3340
|
}) => {
|
|
3212
|
-
return /* @__PURE__ */
|
|
3341
|
+
return /* @__PURE__ */ import_react64.default.createElement("div", { className: "grow pt-4 pb-20 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react64.default.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-5xl mx-auto overflow-hidden" }, /* @__PURE__ */ import_react64.default.createElement(
|
|
3213
3342
|
"div",
|
|
3214
3343
|
{
|
|
3215
3344
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -3218,10 +3347,10 @@ var ManagedProjectsBlock = ({
|
|
|
3218
3347
|
backgroundRepeat: "repeat"
|
|
3219
3348
|
}
|
|
3220
3349
|
}
|
|
3221
|
-
), /* @__PURE__ */
|
|
3350
|
+
), /* @__PURE__ */ import_react64.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react64.default.createElement(GridSection, null, tagline && /* @__PURE__ */ import_react64.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 text-left block " }, tagline), /* @__PURE__ */ import_react64.default.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight text-left" }, title)), projects.map((project, index) => {
|
|
3222
3351
|
const isLast = index === projects.length - 1;
|
|
3223
|
-
const projectContent = /* @__PURE__ */
|
|
3224
|
-
return /* @__PURE__ */
|
|
3352
|
+
const projectContent = /* @__PURE__ */ import_react64.default.createElement("div", { className: "group block w-full" }, /* @__PURE__ */ import_react64.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_react64.default.createElement("div", { className: "flex items-center gap-3 md:gap-4" }, /* @__PURE__ */ import_react64.default.createElement("h2", { className: " text-[16px] text-black transition-all flex items-center gap-2" }, project.title, /* @__PURE__ */ import_react64.default.createElement("span", { className: "text-[11px] opacity-0 -translate-x-2 group-hover:opacity-100 group-hover:translate-x-0 transition-all duration-300" }, project.isExternal ? "\u2197" : "\u2192")), /* @__PURE__ */ import_react64.default.createElement("span", { className: `text-[9px] px-2.5 py-1 rounded-full tracking-[0.15em] transition-colors ${project.status.toLowerCase() === "production" ? "bg-black text-white" : "bg-neutral-100 text-neutral-500 group-hover:bg-neutral-100 group-hover:text-black"}` }, project.status)), /* @__PURE__ */ import_react64.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 shrink-0 " }, project.date)), /* @__PURE__ */ import_react64.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 max-w-4xl text-left transition-colors group-hover:text-black" }, project.description));
|
|
3353
|
+
return /* @__PURE__ */ import_react64.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_react64.default.createElement("a", { href: project.link, target: "_blank", rel: "noopener noreferrer", className: "block outline-none" }, projectContent) : /* @__PURE__ */ import_react64.default.createElement(import_link8.default, { href: project.link, className: "block outline-none" }, projectContent));
|
|
3225
3354
|
}))));
|
|
3226
3355
|
};
|
|
3227
3356
|
// Annotate the CommonJS export names for ESM import in node:
|