@underverse-ui/underverse 0.1.34 → 0.1.37
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.cjs +799 -264
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +52 -2
- package/dist/index.d.ts +52 -2
- package/dist/index.js +790 -256
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -56,6 +56,7 @@ __export(index_exports, {
|
|
|
56
56
|
DropdownMenu: () => DropdownMenu_default,
|
|
57
57
|
DropdownMenuItem: () => DropdownMenuItem,
|
|
58
58
|
DropdownMenuSeparator: () => DropdownMenuSeparator,
|
|
59
|
+
FallingIcons: () => FallingIcons,
|
|
59
60
|
FloatingContacts: () => FloatingContacts,
|
|
60
61
|
Form: () => Form,
|
|
61
62
|
FormActions: () => FormActions,
|
|
@@ -214,6 +215,7 @@ var Button = (0, import_react.forwardRef)(
|
|
|
214
215
|
lockMs = 600,
|
|
215
216
|
asContainer = false,
|
|
216
217
|
noWrap = true,
|
|
218
|
+
noHoverOverlay = false,
|
|
217
219
|
...rest
|
|
218
220
|
}, ref) => {
|
|
219
221
|
const baseStyles = asContainer ? "relative inline-flex justify-center rounded-md font-medium transition-colors duration-150 ease-soft outline-none focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background active:translate-y-px" : "relative inline-flex items-center justify-center gap-2 rounded-md font-medium overflow-hidden transition-colors duration-150 ease-soft outline-none focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background active:translate-y-px";
|
|
@@ -275,7 +277,7 @@ var Button = (0, import_react.forwardRef)(
|
|
|
275
277
|
"aria-label": rest["aria-label"] || title,
|
|
276
278
|
...rest,
|
|
277
279
|
children: [
|
|
278
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "absolute inset-0 bg-gradient-to-r from-primary-foreground/20 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-200" }),
|
|
280
|
+
!noHoverOverlay && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "absolute inset-0 bg-gradient-to-r from-primary-foreground/20 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-200" }),
|
|
279
281
|
loading2 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
280
282
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(SpinnerIcon, { className: "w-4 h-4 animate-spin" }),
|
|
281
283
|
loadingText && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "ml-2", "aria-live": "polite", children: loadingText }),
|
|
@@ -6897,76 +6899,608 @@ function ImageUpload({
|
|
|
6897
6899
|
var React27 = __toESM(require("react"), 1);
|
|
6898
6900
|
var import_lucide_react19 = require("lucide-react");
|
|
6899
6901
|
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
6900
|
-
function Carousel({
|
|
6902
|
+
function Carousel({
|
|
6903
|
+
children,
|
|
6904
|
+
autoScroll = true,
|
|
6905
|
+
autoScrollInterval = 5e3,
|
|
6906
|
+
animation = "slide",
|
|
6907
|
+
orientation = "horizontal",
|
|
6908
|
+
showArrows = true,
|
|
6909
|
+
showDots = true,
|
|
6910
|
+
showProgress = false,
|
|
6911
|
+
showThumbnails = false,
|
|
6912
|
+
loop = true,
|
|
6913
|
+
slidesToShow = 1,
|
|
6914
|
+
slidesToScroll = 1,
|
|
6915
|
+
className,
|
|
6916
|
+
containerClassName,
|
|
6917
|
+
slideClassName,
|
|
6918
|
+
onSlideChange,
|
|
6919
|
+
thumbnailRenderer,
|
|
6920
|
+
ariaLabel = "Carousel"
|
|
6921
|
+
}) {
|
|
6901
6922
|
const [currentIndex, setCurrentIndex] = React27.useState(0);
|
|
6902
|
-
const totalSlides = React27.Children.count(children);
|
|
6903
6923
|
const [isPaused, setIsPaused] = React27.useState(false);
|
|
6924
|
+
const [isDragging, setIsDragging] = React27.useState(false);
|
|
6925
|
+
const [startPos, setStartPos] = React27.useState(0);
|
|
6926
|
+
const [currentTranslate, setCurrentTranslate] = React27.useState(0);
|
|
6927
|
+
const [prevTranslate, setPrevTranslate] = React27.useState(0);
|
|
6928
|
+
const progressElRef = React27.useRef(null);
|
|
6929
|
+
const carouselRef = React27.useRef(null);
|
|
6930
|
+
const rafRef = React27.useRef(null);
|
|
6931
|
+
const totalSlides = React27.Children.count(children);
|
|
6932
|
+
const maxIndex = Math.max(0, totalSlides - slidesToShow);
|
|
6933
|
+
const isHorizontal = orientation === "horizontal";
|
|
6904
6934
|
const scrollPrev = React27.useCallback(() => {
|
|
6905
|
-
setCurrentIndex((prev) =>
|
|
6906
|
-
|
|
6935
|
+
setCurrentIndex((prev) => {
|
|
6936
|
+
if (prev === 0) {
|
|
6937
|
+
return loop ? maxIndex : 0;
|
|
6938
|
+
}
|
|
6939
|
+
return Math.max(0, prev - slidesToScroll);
|
|
6940
|
+
});
|
|
6941
|
+
}, [loop, maxIndex, slidesToScroll]);
|
|
6907
6942
|
const scrollNext = React27.useCallback(() => {
|
|
6908
|
-
setCurrentIndex((prev) =>
|
|
6909
|
-
|
|
6943
|
+
setCurrentIndex((prev) => {
|
|
6944
|
+
if (prev >= maxIndex) {
|
|
6945
|
+
return loop ? 0 : maxIndex;
|
|
6946
|
+
}
|
|
6947
|
+
return Math.min(maxIndex, prev + slidesToScroll);
|
|
6948
|
+
});
|
|
6949
|
+
}, [loop, maxIndex, slidesToScroll]);
|
|
6950
|
+
const scrollTo = React27.useCallback(
|
|
6951
|
+
(index) => {
|
|
6952
|
+
setCurrentIndex(Math.min(maxIndex, Math.max(0, index)));
|
|
6953
|
+
},
|
|
6954
|
+
[maxIndex]
|
|
6955
|
+
);
|
|
6910
6956
|
React27.useEffect(() => {
|
|
6911
|
-
|
|
6912
|
-
|
|
6957
|
+
const handleKeyDown = (e) => {
|
|
6958
|
+
if (e.key === "ArrowLeft" || e.key === "ArrowUp") {
|
|
6959
|
+
e.preventDefault();
|
|
6960
|
+
scrollPrev();
|
|
6961
|
+
} else if (e.key === "ArrowRight" || e.key === "ArrowDown") {
|
|
6962
|
+
e.preventDefault();
|
|
6963
|
+
scrollNext();
|
|
6964
|
+
} else if (e.key === "Home") {
|
|
6965
|
+
e.preventDefault();
|
|
6966
|
+
scrollTo(0);
|
|
6967
|
+
} else if (e.key === "End") {
|
|
6968
|
+
e.preventDefault();
|
|
6969
|
+
scrollTo(maxIndex);
|
|
6970
|
+
}
|
|
6971
|
+
};
|
|
6972
|
+
const carousel = carouselRef.current;
|
|
6973
|
+
if (carousel) {
|
|
6974
|
+
carousel.addEventListener("keydown", handleKeyDown);
|
|
6975
|
+
return () => carousel.removeEventListener("keydown", handleKeyDown);
|
|
6976
|
+
}
|
|
6977
|
+
}, [scrollPrev, scrollNext, scrollTo, maxIndex]);
|
|
6978
|
+
React27.useEffect(() => {
|
|
6979
|
+
const stop = () => {
|
|
6980
|
+
if (rafRef.current != null) {
|
|
6981
|
+
cancelAnimationFrame(rafRef.current);
|
|
6982
|
+
rafRef.current = null;
|
|
6983
|
+
}
|
|
6984
|
+
if (progressElRef.current) progressElRef.current.style.width = "0%";
|
|
6985
|
+
};
|
|
6986
|
+
if (!autoScroll || isPaused || totalSlides <= slidesToShow) {
|
|
6987
|
+
stop();
|
|
6988
|
+
return;
|
|
6989
|
+
}
|
|
6990
|
+
let start = performance.now();
|
|
6991
|
+
const tick = (now) => {
|
|
6992
|
+
const elapsed = now - start;
|
|
6993
|
+
const ratio = Math.min(1, elapsed / autoScrollInterval);
|
|
6994
|
+
if (progressElRef.current) {
|
|
6995
|
+
progressElRef.current.style.width = `${ratio * 100}%`;
|
|
6996
|
+
}
|
|
6997
|
+
if (ratio >= 1) {
|
|
6998
|
+
scrollNext();
|
|
6999
|
+
start = performance.now();
|
|
7000
|
+
}
|
|
7001
|
+
rafRef.current = requestAnimationFrame(tick);
|
|
7002
|
+
};
|
|
7003
|
+
rafRef.current = requestAnimationFrame(tick);
|
|
7004
|
+
return stop;
|
|
7005
|
+
}, [autoScroll, isPaused, totalSlides, slidesToShow, autoScrollInterval, scrollNext]);
|
|
7006
|
+
const getPositionX = (event) => {
|
|
7007
|
+
return event.type.includes("mouse") ? event.pageX : event.touches[0].clientX;
|
|
7008
|
+
};
|
|
7009
|
+
const getPositionY = (event) => {
|
|
7010
|
+
return event.type.includes("mouse") ? event.pageY : event.touches[0].clientY;
|
|
7011
|
+
};
|
|
7012
|
+
const touchStart = (event) => {
|
|
7013
|
+
setIsDragging(true);
|
|
7014
|
+
const pos = isHorizontal ? getPositionX(event.nativeEvent) : getPositionY(event.nativeEvent);
|
|
7015
|
+
setStartPos(pos);
|
|
7016
|
+
setPrevTranslate(currentTranslate);
|
|
7017
|
+
};
|
|
7018
|
+
const touchMove = (event) => {
|
|
7019
|
+
if (!isDragging) return;
|
|
7020
|
+
const pos = isHorizontal ? getPositionX(event.nativeEvent) : getPositionY(event.nativeEvent);
|
|
7021
|
+
const currentPosition = pos;
|
|
7022
|
+
setCurrentTranslate(prevTranslate + currentPosition - startPos);
|
|
7023
|
+
};
|
|
7024
|
+
const touchEnd = () => {
|
|
7025
|
+
if (!isDragging) return;
|
|
7026
|
+
setIsDragging(false);
|
|
7027
|
+
const movedBy = currentTranslate - prevTranslate;
|
|
7028
|
+
const threshold = 50;
|
|
7029
|
+
if (movedBy < -threshold && currentIndex < maxIndex) {
|
|
6913
7030
|
scrollNext();
|
|
6914
|
-
}
|
|
6915
|
-
|
|
6916
|
-
|
|
6917
|
-
|
|
6918
|
-
|
|
6919
|
-
|
|
6920
|
-
|
|
6921
|
-
|
|
6922
|
-
|
|
6923
|
-
|
|
6924
|
-
|
|
6925
|
-
|
|
6926
|
-
|
|
6927
|
-
|
|
6928
|
-
|
|
7031
|
+
} else if (movedBy > threshold && currentIndex > 0) {
|
|
7032
|
+
scrollPrev();
|
|
7033
|
+
}
|
|
7034
|
+
setCurrentTranslate(0);
|
|
7035
|
+
setPrevTranslate(0);
|
|
7036
|
+
};
|
|
7037
|
+
React27.useEffect(() => {
|
|
7038
|
+
onSlideChange?.(currentIndex);
|
|
7039
|
+
}, [currentIndex, onSlideChange]);
|
|
7040
|
+
const getAnimationStyles = () => {
|
|
7041
|
+
const baseTransform = isHorizontal ? `translateX(-${currentIndex * (100 / slidesToShow)}%)` : `translateY(-${currentIndex * (100 / slidesToShow)}%)`;
|
|
7042
|
+
if (animation === "fade") {
|
|
7043
|
+
return {
|
|
7044
|
+
transition: "opacity 500ms ease-in-out"
|
|
7045
|
+
};
|
|
7046
|
+
}
|
|
7047
|
+
if (animation === "scale") {
|
|
7048
|
+
return {
|
|
7049
|
+
transform: baseTransform,
|
|
7050
|
+
transition: "transform 500ms ease-in-out, scale 500ms ease-in-out"
|
|
7051
|
+
};
|
|
7052
|
+
}
|
|
7053
|
+
return {
|
|
7054
|
+
transform: baseTransform,
|
|
7055
|
+
transition: isDragging ? "none" : "transform 500ms ease-in-out"
|
|
7056
|
+
};
|
|
7057
|
+
};
|
|
7058
|
+
const slideWidth = 100 / slidesToShow;
|
|
7059
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
|
|
7060
|
+
"div",
|
|
7061
|
+
{
|
|
7062
|
+
ref: carouselRef,
|
|
7063
|
+
className: cn("relative w-full overflow-hidden focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2 rounded-lg", className),
|
|
7064
|
+
onMouseEnter: () => setIsPaused(true),
|
|
7065
|
+
onMouseLeave: () => setIsPaused(false),
|
|
7066
|
+
role: "region",
|
|
7067
|
+
"aria-label": ariaLabel,
|
|
7068
|
+
"aria-roledescription": "carousel",
|
|
7069
|
+
tabIndex: 0,
|
|
7070
|
+
children: [
|
|
7071
|
+
showProgress && autoScroll && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "absolute top-0 left-0 right-0 h-1 bg-muted z-20", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { ref: progressElRef, className: "h-full bg-primary", style: { width: "0%" } }) }),
|
|
7072
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
7073
|
+
"div",
|
|
7074
|
+
{
|
|
7075
|
+
className: cn("flex", isHorizontal ? "flex-row" : "flex-col", containerClassName),
|
|
7076
|
+
style: getAnimationStyles(),
|
|
7077
|
+
onTouchStart: touchStart,
|
|
7078
|
+
onTouchMove: touchMove,
|
|
7079
|
+
onTouchEnd: touchEnd,
|
|
7080
|
+
onMouseDown: touchStart,
|
|
7081
|
+
onMouseMove: touchMove,
|
|
7082
|
+
onMouseUp: touchEnd,
|
|
7083
|
+
onMouseLeave: touchEnd,
|
|
7084
|
+
role: "group",
|
|
7085
|
+
"aria-atomic": "false",
|
|
7086
|
+
"aria-live": autoScroll ? "off" : "polite",
|
|
7087
|
+
children: React27.Children.map(children, (child, idx) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
7088
|
+
"div",
|
|
7089
|
+
{
|
|
7090
|
+
className: cn(
|
|
7091
|
+
"flex-shrink-0",
|
|
7092
|
+
isHorizontal ? "h-full" : "w-full",
|
|
7093
|
+
animation === "fade" && idx !== currentIndex && "opacity-0",
|
|
7094
|
+
animation === "scale" && idx !== currentIndex && "scale-95",
|
|
7095
|
+
slideClassName
|
|
7096
|
+
),
|
|
7097
|
+
style: {
|
|
7098
|
+
[isHorizontal ? "width" : "height"]: `${slideWidth}%`
|
|
7099
|
+
},
|
|
7100
|
+
role: "group",
|
|
7101
|
+
"aria-roledescription": "slide",
|
|
7102
|
+
"aria-label": `${idx + 1} of ${totalSlides}`,
|
|
7103
|
+
"aria-hidden": idx < currentIndex || idx >= currentIndex + slidesToShow,
|
|
7104
|
+
children: child
|
|
7105
|
+
},
|
|
7106
|
+
idx
|
|
7107
|
+
))
|
|
7108
|
+
}
|
|
7109
|
+
),
|
|
7110
|
+
showArrows && totalSlides > slidesToShow && /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_jsx_runtime35.Fragment, { children: [
|
|
7111
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
7112
|
+
Button_default,
|
|
7113
|
+
{
|
|
7114
|
+
onClick: scrollPrev,
|
|
7115
|
+
variant: "ghost",
|
|
7116
|
+
size: "icon",
|
|
7117
|
+
icon: import_lucide_react19.ChevronLeft,
|
|
7118
|
+
noHoverOverlay: true,
|
|
7119
|
+
disabled: !loop && currentIndex === 0,
|
|
7120
|
+
className: cn(
|
|
7121
|
+
"absolute top-1/2 -translate-y-1/2 hover:-translate-y-1/2 active:-translate-y-1/2 z-10 rounded-full will-change-transform backdrop-blur-0 hover:backdrop-blur-0 hover:bg-transparent border-0",
|
|
7122
|
+
isHorizontal ? "left-4" : "top-4 left-1/2 -translate-x-1/2 rotate-90"
|
|
7123
|
+
),
|
|
7124
|
+
"aria-label": "Previous slide"
|
|
7125
|
+
}
|
|
7126
|
+
),
|
|
7127
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
7128
|
+
Button_default,
|
|
7129
|
+
{
|
|
7130
|
+
onClick: scrollNext,
|
|
7131
|
+
variant: "ghost",
|
|
7132
|
+
size: "icon",
|
|
7133
|
+
icon: import_lucide_react19.ChevronRight,
|
|
7134
|
+
noHoverOverlay: true,
|
|
7135
|
+
disabled: !loop && currentIndex >= maxIndex,
|
|
7136
|
+
className: cn(
|
|
7137
|
+
"absolute top-1/2 -translate-y-1/2 hover:-translate-y-1/2 active:-translate-y-1/2 z-10 rounded-full will-change-transform backdrop-blur-0 hover:backdrop-blur-0 hover:bg-transparent border-0",
|
|
7138
|
+
isHorizontal ? "right-4" : "bottom-4 left-1/2 -translate-x-1/2 rotate-90"
|
|
7139
|
+
),
|
|
7140
|
+
"aria-label": "Next slide"
|
|
7141
|
+
}
|
|
7142
|
+
)
|
|
7143
|
+
] }),
|
|
7144
|
+
showDots && totalSlides > slidesToShow && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
7145
|
+
"div",
|
|
7146
|
+
{
|
|
7147
|
+
className: cn(
|
|
7148
|
+
"absolute flex gap-2 z-10",
|
|
7149
|
+
isHorizontal ? "bottom-4 left-1/2 -translate-x-1/2 flex-row" : "right-4 top-1/2 -translate-y-1/2 flex-col"
|
|
7150
|
+
),
|
|
7151
|
+
role: "tablist",
|
|
7152
|
+
"aria-label": "Carousel pagination",
|
|
7153
|
+
children: Array.from({ length: maxIndex + 1 }, (_, idx) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
7154
|
+
"button",
|
|
7155
|
+
{
|
|
7156
|
+
onClick: () => scrollTo(idx),
|
|
7157
|
+
className: cn(
|
|
7158
|
+
"rounded-full transition-all focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2",
|
|
7159
|
+
isHorizontal ? "w-2 h-2" : "w-2 h-2",
|
|
7160
|
+
idx === currentIndex ? `bg-primary ${isHorizontal ? "w-6" : "h-6"}` : "bg-muted-foreground/50 hover:bg-muted-foreground/75"
|
|
7161
|
+
),
|
|
7162
|
+
"aria-label": `Go to slide ${idx + 1}`,
|
|
7163
|
+
"aria-selected": idx === currentIndex,
|
|
7164
|
+
role: "tab"
|
|
7165
|
+
},
|
|
7166
|
+
idx
|
|
7167
|
+
))
|
|
7168
|
+
}
|
|
7169
|
+
),
|
|
7170
|
+
showThumbnails && totalSlides > slidesToShow && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
7171
|
+
"div",
|
|
7172
|
+
{
|
|
7173
|
+
className: cn(
|
|
7174
|
+
"absolute bottom-0 left-0 right-0 flex gap-2 p-4 bg-gradient-to-t from-black/50 to-transparent overflow-x-auto",
|
|
7175
|
+
isHorizontal ? "flex-row" : "flex-col"
|
|
7176
|
+
),
|
|
7177
|
+
children: React27.Children.map(children, (child, idx) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
7178
|
+
"button",
|
|
7179
|
+
{
|
|
7180
|
+
onClick: () => scrollTo(idx),
|
|
7181
|
+
className: cn(
|
|
7182
|
+
"flex-shrink-0 w-16 h-16 rounded-md overflow-hidden border-2 transition-all focus:outline-none focus:ring-2 focus:ring-primary",
|
|
7183
|
+
idx === currentIndex ? "border-primary scale-110" : "border-transparent opacity-70 hover:opacity-100"
|
|
7184
|
+
),
|
|
7185
|
+
"aria-label": `Thumbnail ${idx + 1}`,
|
|
7186
|
+
children: thumbnailRenderer ? thumbnailRenderer(child, idx) : child
|
|
7187
|
+
},
|
|
7188
|
+
idx
|
|
7189
|
+
))
|
|
7190
|
+
}
|
|
7191
|
+
)
|
|
7192
|
+
]
|
|
7193
|
+
}
|
|
7194
|
+
);
|
|
7195
|
+
}
|
|
7196
|
+
|
|
7197
|
+
// ../../components/ui/FallingIcons.tsx
|
|
7198
|
+
var import_react19 = __toESM(require("react"), 1);
|
|
7199
|
+
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
7200
|
+
var DEFAULT_COUNT = 24;
|
|
7201
|
+
var DEFAULT_SPEED_RANGE = [6, 14];
|
|
7202
|
+
var DEFAULT_SIZE_RANGE = [14, 28];
|
|
7203
|
+
function FallingIcons({
|
|
7204
|
+
icon: Icon,
|
|
7205
|
+
imageUrl,
|
|
7206
|
+
count = DEFAULT_COUNT,
|
|
7207
|
+
className,
|
|
7208
|
+
areaClassName,
|
|
7209
|
+
colorClassName,
|
|
7210
|
+
zIndex = 10,
|
|
7211
|
+
speedRange = DEFAULT_SPEED_RANGE,
|
|
7212
|
+
sizeRange = DEFAULT_SIZE_RANGE,
|
|
7213
|
+
horizontalDrift = 24,
|
|
7214
|
+
spin = true,
|
|
7215
|
+
fullScreen = false,
|
|
7216
|
+
randomizeEachLoop = true,
|
|
7217
|
+
// Modern UI enhancements
|
|
7218
|
+
glow = false,
|
|
7219
|
+
glowColor = "currentColor",
|
|
7220
|
+
glowIntensity = 0.5,
|
|
7221
|
+
trail = false,
|
|
7222
|
+
trailLength = 3,
|
|
7223
|
+
physics,
|
|
7224
|
+
easingFunction = "linear"
|
|
7225
|
+
}) {
|
|
7226
|
+
const uid = import_react19.default.useId().replace(/[:]/g, "");
|
|
7227
|
+
const containerRef = import_react19.default.useRef(null);
|
|
7228
|
+
const [fallDist, setFallDist] = import_react19.default.useState(null);
|
|
7229
|
+
const idRef = import_react19.default.useRef(1);
|
|
7230
|
+
const gravity = physics?.gravity ?? 1;
|
|
7231
|
+
const windDirection = physics?.windDirection ?? 0;
|
|
7232
|
+
const windStrength = physics?.windStrength ?? 0;
|
|
7233
|
+
const physicsRotation = physics?.rotation ?? false;
|
|
7234
|
+
const easingMap = {
|
|
7235
|
+
linear: "linear",
|
|
7236
|
+
ease: "ease",
|
|
7237
|
+
"ease-in": "ease-in",
|
|
7238
|
+
"ease-out": "ease-out",
|
|
7239
|
+
"ease-in-out": "ease-in-out",
|
|
7240
|
+
bounce: "cubic-bezier(0.68, -0.55, 0.265, 1.55)",
|
|
7241
|
+
elastic: "cubic-bezier(0.175, 0.885, 0.32, 1.275)"
|
|
7242
|
+
};
|
|
7243
|
+
const makeParticle = import_react19.default.useCallback(() => {
|
|
7244
|
+
const rnd = (min, max) => min + Math.random() * (max - min);
|
|
7245
|
+
return {
|
|
7246
|
+
leftPct: rnd(0, 100),
|
|
7247
|
+
size: rnd(sizeRange[0], sizeRange[1]),
|
|
7248
|
+
fallDur: rnd(speedRange[0], speedRange[1]) / gravity,
|
|
7249
|
+
// Apply gravity to speed
|
|
7250
|
+
delay: rnd(-10, 0),
|
|
7251
|
+
driftAmp: rnd(horizontalDrift * 0.5, horizontalDrift) + windDirection * windStrength * 50,
|
|
7252
|
+
// Apply wind
|
|
7253
|
+
spinDur: rnd(2, 6),
|
|
7254
|
+
key: idRef.current++
|
|
7255
|
+
};
|
|
7256
|
+
}, [sizeRange, speedRange, horizontalDrift, gravity, windDirection, windStrength]);
|
|
7257
|
+
const [particles, setParticles] = import_react19.default.useState([]);
|
|
7258
|
+
import_react19.default.useEffect(() => {
|
|
7259
|
+
const arr = Array.from({ length: Math.max(0, count) }).map(() => makeParticle());
|
|
7260
|
+
setParticles(arr);
|
|
7261
|
+
}, [count, makeParticle]);
|
|
7262
|
+
import_react19.default.useEffect(() => {
|
|
7263
|
+
if (fullScreen) {
|
|
7264
|
+
const measure2 = () => setFallDist(window.innerHeight + 200);
|
|
7265
|
+
measure2();
|
|
7266
|
+
window.addEventListener("resize", measure2);
|
|
7267
|
+
return () => window.removeEventListener("resize", measure2);
|
|
7268
|
+
}
|
|
7269
|
+
const el = containerRef.current;
|
|
7270
|
+
if (!el) return;
|
|
7271
|
+
const measure = () => setFallDist(el.offsetHeight + 200);
|
|
7272
|
+
measure();
|
|
7273
|
+
const ResizeObserverCtor = window.ResizeObserver;
|
|
7274
|
+
if (ResizeObserverCtor) {
|
|
7275
|
+
const ro = new ResizeObserverCtor(measure);
|
|
7276
|
+
ro.observe(el);
|
|
7277
|
+
return () => ro.disconnect();
|
|
7278
|
+
}
|
|
7279
|
+
window.addEventListener("resize", measure);
|
|
7280
|
+
return () => window.removeEventListener("resize", measure);
|
|
7281
|
+
}, [fullScreen]);
|
|
7282
|
+
const FallName = `uv-fall-${uid}`;
|
|
7283
|
+
const SwayName = `uv-sway-${uid}`;
|
|
7284
|
+
const SpinName = `uv-spin-${uid}`;
|
|
7285
|
+
const PopName = `uv-pop-${uid}`;
|
|
7286
|
+
const PhysicsSpinName = `uv-physics-spin-${uid}`;
|
|
7287
|
+
const glowStyles = import_react19.default.useMemo(() => {
|
|
7288
|
+
if (!glow) return {};
|
|
7289
|
+
const intensity = Math.max(0, Math.min(1, glowIntensity));
|
|
7290
|
+
return {
|
|
7291
|
+
filter: `drop-shadow(0 0 ${4 * intensity}px ${glowColor}) drop-shadow(0 0 ${8 * intensity}px ${glowColor})`
|
|
7292
|
+
};
|
|
7293
|
+
}, [glow, glowColor, glowIntensity]);
|
|
7294
|
+
const FallbackIcon = import_react19.default.useMemo(() => (props) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("svg", { viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("circle", { cx: "12", cy: "12", r: "10" }) }), []);
|
|
7295
|
+
const TheIcon = imageUrl ? ({ className: imgClassName }) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
7296
|
+
"img",
|
|
7297
|
+
{
|
|
7298
|
+
src: imageUrl,
|
|
7299
|
+
alt: "",
|
|
7300
|
+
className: cn("w-full h-full object-cover rounded-sm", imgClassName),
|
|
7301
|
+
draggable: false
|
|
7302
|
+
}
|
|
7303
|
+
) : Icon || FallbackIcon;
|
|
7304
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
7305
|
+
"div",
|
|
7306
|
+
{
|
|
7307
|
+
ref: containerRef,
|
|
7308
|
+
className: cn(
|
|
7309
|
+
fullScreen ? "fixed inset-0 overflow-hidden pointer-events-none" : "relative w-full h-full overflow-hidden",
|
|
7310
|
+
areaClassName
|
|
6929
7311
|
),
|
|
6930
|
-
|
|
6931
|
-
|
|
6932
|
-
{
|
|
6933
|
-
|
|
6934
|
-
|
|
6935
|
-
|
|
6936
|
-
|
|
6937
|
-
className: "absolute right-4 top-1/2 -translate-y-1/2 hover:-translate-y-1/2 z-10 rounded-full will-change-transform bg-background/80 hover:bg-background border-border/50 hover:border-border text-foreground"
|
|
7312
|
+
style: { zIndex },
|
|
7313
|
+
children: [
|
|
7314
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("style", { children: `
|
|
7315
|
+
@keyframes ${FallName} {
|
|
7316
|
+
0% { transform: translate3d(0, -10vh, 0); opacity: 0; }
|
|
7317
|
+
10% { opacity: 1; }
|
|
7318
|
+
100% { transform: translate3d(0, var(--fall, 120vh), 0); opacity: 0.95; }
|
|
6938
7319
|
}
|
|
6939
|
-
|
|
6940
|
-
|
|
6941
|
-
|
|
6942
|
-
|
|
6943
|
-
|
|
6944
|
-
|
|
6945
|
-
|
|
6946
|
-
|
|
6947
|
-
|
|
6948
|
-
|
|
6949
|
-
|
|
6950
|
-
|
|
7320
|
+
@keyframes ${SwayName} {
|
|
7321
|
+
0% { transform: translateX(0); }
|
|
7322
|
+
50% { transform: translateX(var(--amp, 16px)); }
|
|
7323
|
+
100% { transform: translateX(0); }
|
|
7324
|
+
}
|
|
7325
|
+
@keyframes ${SpinName} {
|
|
7326
|
+
0% { transform: rotate(0deg); }
|
|
7327
|
+
100% { transform: rotate(360deg); }
|
|
7328
|
+
}
|
|
7329
|
+
@keyframes ${PopName} {
|
|
7330
|
+
0% { opacity: 1; transform: scale(1); }
|
|
7331
|
+
100% { opacity: 0; transform: scale(0.3); }
|
|
7332
|
+
}
|
|
7333
|
+
@keyframes ${PhysicsSpinName} {
|
|
7334
|
+
0% { transform: rotate(0deg) scale(1); }
|
|
7335
|
+
25% { transform: rotate(90deg) scale(1.05); }
|
|
7336
|
+
50% { transform: rotate(180deg) scale(1); }
|
|
7337
|
+
75% { transform: rotate(270deg) scale(1.05); }
|
|
7338
|
+
100% { transform: rotate(360deg) scale(1); }
|
|
7339
|
+
}
|
|
7340
|
+
@media (prefers-reduced-motion: reduce) {
|
|
7341
|
+
.uv-falling-particle {
|
|
7342
|
+
animation-duration: 0.01ms !important;
|
|
7343
|
+
animation-iteration-count: 1 !important;
|
|
7344
|
+
}
|
|
7345
|
+
}
|
|
7346
|
+
` }),
|
|
7347
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
7348
|
+
"div",
|
|
7349
|
+
{
|
|
7350
|
+
className: cn(
|
|
7351
|
+
"absolute inset-0 pointer-events-none",
|
|
7352
|
+
className
|
|
7353
|
+
),
|
|
7354
|
+
"aria-hidden": true,
|
|
7355
|
+
children: particles.map((p, i) => {
|
|
7356
|
+
const swayDuration = p.fallDur * (0.8 + i % 5 * 0.05);
|
|
7357
|
+
const spinDuration = Math.max(1, p.spinDur);
|
|
7358
|
+
const handlePop = () => {
|
|
7359
|
+
setParticles((prev) => {
|
|
7360
|
+
const next = prev.slice();
|
|
7361
|
+
const np = makeParticle();
|
|
7362
|
+
np.delay = -Math.random() * 8;
|
|
7363
|
+
next[i] = np;
|
|
7364
|
+
return next;
|
|
7365
|
+
});
|
|
7366
|
+
};
|
|
7367
|
+
const trailParticles = trail ? Array.from({ length: Math.min(5, Math.max(1, trailLength)) }) : [];
|
|
7368
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_react19.default.Fragment, { children: [
|
|
7369
|
+
trail && trailParticles.map((_, trailIndex) => {
|
|
7370
|
+
const trailDelay = p.delay - (trailIndex + 1) * 0.15;
|
|
7371
|
+
const trailOpacity = 1 - (trailIndex + 1) * (1 / (trailParticles.length + 1));
|
|
7372
|
+
const trailScale = 1 - (trailIndex + 1) * 0.15;
|
|
7373
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
7374
|
+
"span",
|
|
7375
|
+
{
|
|
7376
|
+
className: cn("absolute top-0 will-change-transform pointer-events-none uv-falling-particle", colorClassName),
|
|
7377
|
+
style: {
|
|
7378
|
+
left: `${p.leftPct}%`,
|
|
7379
|
+
animationDelay: `${trailDelay}s`,
|
|
7380
|
+
animationDuration: `${p.fallDur}s`,
|
|
7381
|
+
animationName: FallName,
|
|
7382
|
+
animationTimingFunction: easingMap[easingFunction] || "linear",
|
|
7383
|
+
animationIterationCount: "infinite",
|
|
7384
|
+
opacity: trailOpacity * 0.4,
|
|
7385
|
+
["--fall"]: `${fallDist ?? (typeof window !== "undefined" ? window.innerHeight + 200 : 1200)}px`
|
|
7386
|
+
},
|
|
7387
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
7388
|
+
"span",
|
|
7389
|
+
{
|
|
7390
|
+
className: "inline-block uv-sway",
|
|
7391
|
+
style: {
|
|
7392
|
+
transform: `translateX(-50%) scale(${trailScale})`,
|
|
7393
|
+
animationName: SwayName,
|
|
7394
|
+
animationDuration: `${swayDuration}s`,
|
|
7395
|
+
animationTimingFunction: "ease-in-out",
|
|
7396
|
+
animationIterationCount: "infinite",
|
|
7397
|
+
["--amp"]: `${Math.round(p.driftAmp)}px`
|
|
7398
|
+
},
|
|
7399
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
7400
|
+
"span",
|
|
7401
|
+
{
|
|
7402
|
+
className: "block",
|
|
7403
|
+
style: {
|
|
7404
|
+
width: p.size,
|
|
7405
|
+
height: p.size,
|
|
7406
|
+
...glowStyles
|
|
7407
|
+
},
|
|
7408
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(TheIcon, { className: cn("w-full h-full text-primary/70", colorClassName) })
|
|
7409
|
+
}
|
|
7410
|
+
)
|
|
7411
|
+
}
|
|
7412
|
+
)
|
|
7413
|
+
},
|
|
7414
|
+
`${p.key}-trail-${trailIndex}`
|
|
7415
|
+
);
|
|
7416
|
+
}),
|
|
7417
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
7418
|
+
"span",
|
|
7419
|
+
{
|
|
7420
|
+
className: cn("absolute top-0 will-change-transform pointer-events-auto uv-falling-particle", colorClassName),
|
|
7421
|
+
style: {
|
|
7422
|
+
left: `${p.leftPct}%`,
|
|
7423
|
+
animationDelay: `${p.delay}s`,
|
|
7424
|
+
animationDuration: `${p.fallDur}s`,
|
|
7425
|
+
animationName: FallName,
|
|
7426
|
+
animationTimingFunction: easingMap[easingFunction] || "linear",
|
|
7427
|
+
animationIterationCount: "infinite",
|
|
7428
|
+
["--fall"]: `${fallDist ?? (typeof window !== "undefined" ? window.innerHeight + 200 : 1200)}px`
|
|
7429
|
+
},
|
|
7430
|
+
onMouseEnter: handlePop,
|
|
7431
|
+
onAnimationIteration: (ev) => {
|
|
7432
|
+
if (ev.currentTarget !== ev.target) return;
|
|
7433
|
+
if (!randomizeEachLoop) return;
|
|
7434
|
+
if (ev.animationName !== FallName) return;
|
|
7435
|
+
setParticles((prev) => {
|
|
7436
|
+
const next = prev.slice();
|
|
7437
|
+
const np = makeParticle();
|
|
7438
|
+
np.delay = -Math.random() * 4;
|
|
7439
|
+
next[i] = np;
|
|
7440
|
+
return next;
|
|
7441
|
+
});
|
|
7442
|
+
},
|
|
7443
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
7444
|
+
"span",
|
|
7445
|
+
{
|
|
7446
|
+
className: "inline-block uv-sway",
|
|
7447
|
+
style: {
|
|
7448
|
+
transform: `translateX(-50%)`,
|
|
7449
|
+
animationName: SwayName,
|
|
7450
|
+
animationDuration: `${swayDuration}s`,
|
|
7451
|
+
animationTimingFunction: "ease-in-out",
|
|
7452
|
+
animationIterationCount: "infinite",
|
|
7453
|
+
["--amp"]: `${Math.round(p.driftAmp)}px`
|
|
7454
|
+
},
|
|
7455
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
7456
|
+
"span",
|
|
7457
|
+
{
|
|
7458
|
+
className: cn(
|
|
7459
|
+
"block uv-spin hover:[animation:var(--popName)_0.35s_ease-out_forwards]",
|
|
7460
|
+
physicsRotation ? "[animation:var(--physicsSpinName)_var(--spinDur)_ease-in-out_infinite]" : spin && "[animation:var(--spinName)_var(--spinDur)_linear_infinite]"
|
|
7461
|
+
),
|
|
7462
|
+
style: {
|
|
7463
|
+
width: p.size,
|
|
7464
|
+
height: p.size,
|
|
7465
|
+
["--spinName"]: SpinName,
|
|
7466
|
+
["--physicsSpinName"]: PhysicsSpinName,
|
|
7467
|
+
["--spinDur"]: `${spinDuration}s`,
|
|
7468
|
+
["--popName"]: PopName,
|
|
7469
|
+
...glowStyles
|
|
7470
|
+
},
|
|
7471
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(TheIcon, { className: cn("w-full h-full text-primary/70", colorClassName) })
|
|
7472
|
+
}
|
|
7473
|
+
)
|
|
7474
|
+
}
|
|
7475
|
+
)
|
|
7476
|
+
}
|
|
7477
|
+
)
|
|
7478
|
+
] }, p.key);
|
|
7479
|
+
})
|
|
7480
|
+
}
|
|
7481
|
+
)
|
|
7482
|
+
]
|
|
7483
|
+
}
|
|
7484
|
+
);
|
|
6951
7485
|
}
|
|
6952
7486
|
|
|
6953
7487
|
// ../../components/ui/ClientOnly.tsx
|
|
6954
|
-
var
|
|
6955
|
-
var
|
|
7488
|
+
var import_react20 = require("react");
|
|
7489
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
6956
7490
|
function ClientOnly({ children, fallback = null }) {
|
|
6957
|
-
const [hasMounted, setHasMounted] = (0,
|
|
6958
|
-
(0,
|
|
7491
|
+
const [hasMounted, setHasMounted] = (0, import_react20.useState)(false);
|
|
7492
|
+
(0, import_react20.useEffect)(() => {
|
|
6959
7493
|
setHasMounted(true);
|
|
6960
7494
|
}, []);
|
|
6961
7495
|
if (!hasMounted) {
|
|
6962
|
-
return /* @__PURE__ */ (0,
|
|
7496
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_jsx_runtime37.Fragment, { children: fallback });
|
|
6963
7497
|
}
|
|
6964
|
-
return /* @__PURE__ */ (0,
|
|
7498
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_jsx_runtime37.Fragment, { children });
|
|
6965
7499
|
}
|
|
6966
7500
|
|
|
6967
7501
|
// ../../components/ui/Loading.tsx
|
|
6968
7502
|
var import_lucide_react20 = require("lucide-react");
|
|
6969
|
-
var
|
|
7503
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
6970
7504
|
var LoadingSpinner = ({
|
|
6971
7505
|
size = "md",
|
|
6972
7506
|
className,
|
|
@@ -6982,7 +7516,7 @@ var LoadingSpinner = ({
|
|
|
6982
7516
|
foreground: "text-foreground",
|
|
6983
7517
|
muted: "text-muted-foreground"
|
|
6984
7518
|
};
|
|
6985
|
-
return /* @__PURE__ */ (0,
|
|
7519
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
6986
7520
|
import_lucide_react20.Activity,
|
|
6987
7521
|
{
|
|
6988
7522
|
className: cn(
|
|
@@ -7003,7 +7537,7 @@ var LoadingDots = ({
|
|
|
7003
7537
|
foreground: "bg-foreground",
|
|
7004
7538
|
muted: "bg-muted-foreground"
|
|
7005
7539
|
};
|
|
7006
|
-
return /* @__PURE__ */ (0,
|
|
7540
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: cn("flex items-center space-x-1", className), children: [0, 1, 2].map((i) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7007
7541
|
"div",
|
|
7008
7542
|
{
|
|
7009
7543
|
className: cn(
|
|
@@ -7025,7 +7559,7 @@ var LoadingBar = ({
|
|
|
7025
7559
|
label
|
|
7026
7560
|
}) => {
|
|
7027
7561
|
const pct = progress ? Math.min(Math.max(progress, 0), 100) : void 0;
|
|
7028
|
-
return /* @__PURE__ */ (0,
|
|
7562
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7029
7563
|
"div",
|
|
7030
7564
|
{
|
|
7031
7565
|
className: cn("w-full bg-muted rounded-full h-2", className),
|
|
@@ -7034,7 +7568,7 @@ var LoadingBar = ({
|
|
|
7034
7568
|
"aria-valuemax": pct === void 0 ? void 0 : 100,
|
|
7035
7569
|
"aria-valuenow": pct === void 0 ? void 0 : Math.round(pct),
|
|
7036
7570
|
"aria-label": label || "Loading",
|
|
7037
|
-
children: /* @__PURE__ */ (0,
|
|
7571
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7038
7572
|
"div",
|
|
7039
7573
|
{
|
|
7040
7574
|
className: cn(
|
|
@@ -7051,10 +7585,10 @@ var LoadingBar = ({
|
|
|
7051
7585
|
};
|
|
7052
7586
|
|
|
7053
7587
|
// ../../components/ui/Table.tsx
|
|
7054
|
-
var
|
|
7055
|
-
var
|
|
7056
|
-
var Table =
|
|
7057
|
-
({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ (0,
|
|
7588
|
+
var import_react21 = __toESM(require("react"), 1);
|
|
7589
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
7590
|
+
var Table = import_react21.default.forwardRef(
|
|
7591
|
+
({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
7058
7592
|
"div",
|
|
7059
7593
|
{
|
|
7060
7594
|
className: cn(
|
|
@@ -7064,7 +7598,7 @@ var Table = import_react20.default.forwardRef(
|
|
|
7064
7598
|
"backdrop-blur-sm transition-all duration-300",
|
|
7065
7599
|
containerClassName
|
|
7066
7600
|
),
|
|
7067
|
-
children: /* @__PURE__ */ (0,
|
|
7601
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
7068
7602
|
"table",
|
|
7069
7603
|
{
|
|
7070
7604
|
ref,
|
|
@@ -7076,8 +7610,8 @@ var Table = import_react20.default.forwardRef(
|
|
|
7076
7610
|
)
|
|
7077
7611
|
);
|
|
7078
7612
|
Table.displayName = "Table";
|
|
7079
|
-
var TableHeader =
|
|
7080
|
-
({ className, children, filterRow, ...props }, ref) => /* @__PURE__ */ (0,
|
|
7613
|
+
var TableHeader = import_react21.default.forwardRef(
|
|
7614
|
+
({ className, children, filterRow, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
|
|
7081
7615
|
"thead",
|
|
7082
7616
|
{
|
|
7083
7617
|
ref,
|
|
@@ -7095,7 +7629,7 @@ var TableHeader = import_react20.default.forwardRef(
|
|
|
7095
7629
|
)
|
|
7096
7630
|
);
|
|
7097
7631
|
TableHeader.displayName = "TableHeader";
|
|
7098
|
-
var TableBody =
|
|
7632
|
+
var TableBody = import_react21.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
7099
7633
|
"tbody",
|
|
7100
7634
|
{
|
|
7101
7635
|
ref,
|
|
@@ -7104,7 +7638,7 @@ var TableBody = import_react20.default.forwardRef(({ className, ...props }, ref)
|
|
|
7104
7638
|
}
|
|
7105
7639
|
));
|
|
7106
7640
|
TableBody.displayName = "TableBody";
|
|
7107
|
-
var TableFooter =
|
|
7641
|
+
var TableFooter = import_react21.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
7108
7642
|
"tfoot",
|
|
7109
7643
|
{
|
|
7110
7644
|
ref,
|
|
@@ -7116,7 +7650,7 @@ var TableFooter = import_react20.default.forwardRef(({ className, ...props }, re
|
|
|
7116
7650
|
}
|
|
7117
7651
|
));
|
|
7118
7652
|
TableFooter.displayName = "TableFooter";
|
|
7119
|
-
var TableRow =
|
|
7653
|
+
var TableRow = import_react21.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
7120
7654
|
"tr",
|
|
7121
7655
|
{
|
|
7122
7656
|
ref,
|
|
@@ -7130,7 +7664,7 @@ var TableRow = import_react20.default.forwardRef(({ className, ...props }, ref)
|
|
|
7130
7664
|
}
|
|
7131
7665
|
));
|
|
7132
7666
|
TableRow.displayName = "TableRow";
|
|
7133
|
-
var TableHead =
|
|
7667
|
+
var TableHead = import_react21.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
7134
7668
|
"th",
|
|
7135
7669
|
{
|
|
7136
7670
|
ref,
|
|
@@ -7142,7 +7676,7 @@ var TableHead = import_react20.default.forwardRef(({ className, ...props }, ref)
|
|
|
7142
7676
|
}
|
|
7143
7677
|
));
|
|
7144
7678
|
TableHead.displayName = "TableHead";
|
|
7145
|
-
var TableCell =
|
|
7679
|
+
var TableCell = import_react21.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
7146
7680
|
"td",
|
|
7147
7681
|
{
|
|
7148
7682
|
ref,
|
|
@@ -7151,7 +7685,7 @@ var TableCell = import_react20.default.forwardRef(({ className, ...props }, ref)
|
|
|
7151
7685
|
}
|
|
7152
7686
|
));
|
|
7153
7687
|
TableCell.displayName = "TableCell";
|
|
7154
|
-
var TableCaption =
|
|
7688
|
+
var TableCaption = import_react21.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
7155
7689
|
"caption",
|
|
7156
7690
|
{
|
|
7157
7691
|
ref,
|
|
@@ -7163,12 +7697,12 @@ TableCaption.displayName = "TableCaption";
|
|
|
7163
7697
|
|
|
7164
7698
|
// ../../components/ui/DataTable.tsx
|
|
7165
7699
|
var import_lucide_react21 = require("lucide-react");
|
|
7166
|
-
var
|
|
7700
|
+
var import_react22 = __toESM(require("react"), 1);
|
|
7167
7701
|
var import_next_intl7 = require("next-intl");
|
|
7168
|
-
var
|
|
7702
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
7169
7703
|
function useDebounced(value, delay = 300) {
|
|
7170
|
-
const [debounced, setDebounced] =
|
|
7171
|
-
|
|
7704
|
+
const [debounced, setDebounced] = import_react22.default.useState(value);
|
|
7705
|
+
import_react22.default.useEffect(() => {
|
|
7172
7706
|
const id = setTimeout(() => setDebounced(value), delay);
|
|
7173
7707
|
return () => clearTimeout(id);
|
|
7174
7708
|
}, [value, delay]);
|
|
@@ -7195,20 +7729,20 @@ function DataTable({
|
|
|
7195
7729
|
labels
|
|
7196
7730
|
}) {
|
|
7197
7731
|
const t = (0, import_next_intl7.useTranslations)("Common");
|
|
7198
|
-
const [visibleCols, setVisibleCols] =
|
|
7199
|
-
const [filters, setFilters] =
|
|
7200
|
-
const [sort, setSort] =
|
|
7201
|
-
const [density, setDensity] =
|
|
7202
|
-
const [curPage, setCurPage] =
|
|
7203
|
-
const [curPageSize, setCurPageSize] =
|
|
7732
|
+
const [visibleCols, setVisibleCols] = import_react22.default.useState(() => columns.filter((c) => c.visible !== false).map((c) => c.key));
|
|
7733
|
+
const [filters, setFilters] = import_react22.default.useState({});
|
|
7734
|
+
const [sort, setSort] = import_react22.default.useState(null);
|
|
7735
|
+
const [density, setDensity] = import_react22.default.useState("normal");
|
|
7736
|
+
const [curPage, setCurPage] = import_react22.default.useState(page);
|
|
7737
|
+
const [curPageSize, setCurPageSize] = import_react22.default.useState(pageSize);
|
|
7204
7738
|
const debouncedFilters = useDebounced(filters, 350);
|
|
7205
|
-
|
|
7739
|
+
import_react22.default.useEffect(() => {
|
|
7206
7740
|
setCurPage(page);
|
|
7207
7741
|
}, [page]);
|
|
7208
|
-
|
|
7742
|
+
import_react22.default.useEffect(() => {
|
|
7209
7743
|
setCurPageSize(pageSize);
|
|
7210
7744
|
}, [pageSize]);
|
|
7211
|
-
|
|
7745
|
+
import_react22.default.useEffect(() => {
|
|
7212
7746
|
if (!onQueryChange) return;
|
|
7213
7747
|
onQueryChange({ filters: debouncedFilters, sort, page: curPage, pageSize: curPageSize });
|
|
7214
7748
|
}, [debouncedFilters, sort, curPage, curPageSize]);
|
|
@@ -7227,7 +7761,7 @@ function DataTable({
|
|
|
7227
7761
|
className: "h-8 w-full text-sm"
|
|
7228
7762
|
};
|
|
7229
7763
|
if (col.filter.type === "text") {
|
|
7230
|
-
return /* @__PURE__ */ (0,
|
|
7764
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7231
7765
|
Input_default,
|
|
7232
7766
|
{
|
|
7233
7767
|
...commonProps,
|
|
@@ -7242,7 +7776,7 @@ function DataTable({
|
|
|
7242
7776
|
}
|
|
7243
7777
|
if (col.filter.type === "select") {
|
|
7244
7778
|
const options = col.filter.options || [];
|
|
7245
|
-
return /* @__PURE__ */ (0,
|
|
7779
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7246
7780
|
Combobox,
|
|
7247
7781
|
{
|
|
7248
7782
|
options: ["", ...options],
|
|
@@ -7258,7 +7792,7 @@ function DataTable({
|
|
|
7258
7792
|
);
|
|
7259
7793
|
}
|
|
7260
7794
|
if (col.filter.type === "date") {
|
|
7261
|
-
return /* @__PURE__ */ (0,
|
|
7795
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7262
7796
|
DatePicker,
|
|
7263
7797
|
{
|
|
7264
7798
|
placeholder: col.filter.placeholder || `Select ${String(col.title)}`,
|
|
@@ -7272,7 +7806,7 @@ function DataTable({
|
|
|
7272
7806
|
}
|
|
7273
7807
|
return null;
|
|
7274
7808
|
};
|
|
7275
|
-
const renderHeader = /* @__PURE__ */ (0,
|
|
7809
|
+
const renderHeader = /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(TableRow, { children: visibleColumns.map((col, colIdx) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7276
7810
|
TableHead,
|
|
7277
7811
|
{
|
|
7278
7812
|
style: { width: col.width },
|
|
@@ -7281,10 +7815,10 @@ function DataTable({
|
|
|
7281
7815
|
col.align === "center" && "text-center",
|
|
7282
7816
|
columnDividers && colIdx > 0 && "border-l border-border/60"
|
|
7283
7817
|
),
|
|
7284
|
-
children: /* @__PURE__ */ (0,
|
|
7285
|
-
/* @__PURE__ */ (0,
|
|
7286
|
-
/* @__PURE__ */ (0,
|
|
7287
|
-
col.sortable && /* @__PURE__ */ (0,
|
|
7818
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex items-center justify-between gap-2 select-none min-h-[2.5rem]", children: [
|
|
7819
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex items-center gap-1 min-w-0 flex-1", children: [
|
|
7820
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "truncate font-medium text-sm", children: col.title }),
|
|
7821
|
+
col.sortable && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7288
7822
|
"button",
|
|
7289
7823
|
{
|
|
7290
7824
|
className: cn(
|
|
@@ -7301,8 +7835,8 @@ function DataTable({
|
|
|
7301
7835
|
},
|
|
7302
7836
|
"aria-label": "Sort",
|
|
7303
7837
|
title: `Sort by ${String(col.title)}`,
|
|
7304
|
-
children: /* @__PURE__ */ (0,
|
|
7305
|
-
/* @__PURE__ */ (0,
|
|
7838
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("svg", { width: "14", height: "14", viewBox: "0 0 20 20", fill: "none", className: "inline-block", children: [
|
|
7839
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7306
7840
|
"path",
|
|
7307
7841
|
{
|
|
7308
7842
|
d: "M7 8l3-3 3 3",
|
|
@@ -7313,7 +7847,7 @@ function DataTable({
|
|
|
7313
7847
|
opacity: sort?.key === col.key && sort.order === "asc" ? 1 : 0.4
|
|
7314
7848
|
}
|
|
7315
7849
|
),
|
|
7316
|
-
/* @__PURE__ */ (0,
|
|
7850
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7317
7851
|
"path",
|
|
7318
7852
|
{
|
|
7319
7853
|
d: "M7 12l3 3 3-3",
|
|
@@ -7328,11 +7862,11 @@ function DataTable({
|
|
|
7328
7862
|
}
|
|
7329
7863
|
)
|
|
7330
7864
|
] }),
|
|
7331
|
-
col.filter && /* @__PURE__ */ (0,
|
|
7865
|
+
col.filter && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7332
7866
|
Popover,
|
|
7333
7867
|
{
|
|
7334
7868
|
placement: "bottom-start",
|
|
7335
|
-
trigger: /* @__PURE__ */ (0,
|
|
7869
|
+
trigger: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7336
7870
|
"button",
|
|
7337
7871
|
{
|
|
7338
7872
|
className: cn(
|
|
@@ -7342,16 +7876,16 @@ function DataTable({
|
|
|
7342
7876
|
),
|
|
7343
7877
|
"aria-label": "Filter",
|
|
7344
7878
|
title: "Filter",
|
|
7345
|
-
children: /* @__PURE__ */ (0,
|
|
7879
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react21.Filter, { className: "h-4 w-4" })
|
|
7346
7880
|
}
|
|
7347
7881
|
),
|
|
7348
|
-
children: /* @__PURE__ */ (0,
|
|
7349
|
-
/* @__PURE__ */ (0,
|
|
7882
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "w-48 p-2 space-y-2", children: [
|
|
7883
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "text-xs font-medium text-muted-foreground mb-2", children: [
|
|
7350
7884
|
"Filter ",
|
|
7351
7885
|
col.title
|
|
7352
7886
|
] }),
|
|
7353
7887
|
renderFilterControl(col),
|
|
7354
|
-
filters[col.key] && /* @__PURE__ */ (0,
|
|
7888
|
+
filters[col.key] && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7355
7889
|
"button",
|
|
7356
7890
|
{
|
|
7357
7891
|
onClick: () => {
|
|
@@ -7374,20 +7908,20 @@ function DataTable({
|
|
|
7374
7908
|
col.key
|
|
7375
7909
|
)) });
|
|
7376
7910
|
const isServerMode = Boolean(onQueryChange);
|
|
7377
|
-
const displayedData = isServerMode ? data :
|
|
7911
|
+
const displayedData = isServerMode ? data : import_react22.default.useMemo(() => {
|
|
7378
7912
|
const start = (curPage - 1) * curPageSize;
|
|
7379
7913
|
return data.slice(start, start + curPageSize);
|
|
7380
7914
|
}, [data, curPage, curPageSize]);
|
|
7381
7915
|
const totalItems = isServerMode ? total : data.length;
|
|
7382
|
-
return /* @__PURE__ */ (0,
|
|
7383
|
-
/* @__PURE__ */ (0,
|
|
7384
|
-
/* @__PURE__ */ (0,
|
|
7385
|
-
/* @__PURE__ */ (0,
|
|
7386
|
-
enableDensityToggle && /* @__PURE__ */ (0,
|
|
7916
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: cn("space-y-2", className), children: [
|
|
7917
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex items-center justify-between gap-4 mb-1", children: [
|
|
7918
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "text-sm text-muted-foreground", children: caption }),
|
|
7919
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
7920
|
+
enableDensityToggle && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7387
7921
|
DropdownMenu_default,
|
|
7388
7922
|
{
|
|
7389
|
-
trigger: /* @__PURE__ */ (0,
|
|
7390
|
-
/* @__PURE__ */ (0,
|
|
7923
|
+
trigger: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(Button_default, { variant: "ghost", size: "sm", className: "h-8 px-2", children: [
|
|
7924
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("svg", { className: "w-4 h-4 mr-1", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 6h16M4 10h16M4 14h16M4 18h16" }) }),
|
|
7391
7925
|
labels?.density || t("density")
|
|
7392
7926
|
] }),
|
|
7393
7927
|
items: [
|
|
@@ -7397,11 +7931,11 @@ function DataTable({
|
|
|
7397
7931
|
]
|
|
7398
7932
|
}
|
|
7399
7933
|
),
|
|
7400
|
-
enableColumnVisibilityToggle && /* @__PURE__ */ (0,
|
|
7934
|
+
enableColumnVisibilityToggle && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7401
7935
|
DropdownMenu_default,
|
|
7402
7936
|
{
|
|
7403
|
-
trigger: /* @__PURE__ */ (0,
|
|
7404
|
-
/* @__PURE__ */ (0,
|
|
7937
|
+
trigger: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(Button_default, { variant: "ghost", size: "sm", className: "h-8 px-2", children: [
|
|
7938
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("svg", { className: "w-4 h-4 mr-1", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7405
7939
|
"path",
|
|
7406
7940
|
{
|
|
7407
7941
|
strokeLinecap: "round",
|
|
@@ -7412,15 +7946,15 @@ function DataTable({
|
|
|
7412
7946
|
) }),
|
|
7413
7947
|
labels?.columns || t("columns")
|
|
7414
7948
|
] }),
|
|
7415
|
-
children: columns.map((c) => /* @__PURE__ */ (0,
|
|
7949
|
+
children: columns.map((c) => /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
7416
7950
|
DropdownMenuItem,
|
|
7417
7951
|
{
|
|
7418
7952
|
onClick: () => {
|
|
7419
7953
|
setVisibleCols((prev) => prev.includes(c.key) ? prev.filter((k) => k !== c.key) : [...prev, c.key]);
|
|
7420
7954
|
},
|
|
7421
7955
|
children: [
|
|
7422
|
-
/* @__PURE__ */ (0,
|
|
7423
|
-
/* @__PURE__ */ (0,
|
|
7956
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("input", { type: "checkbox", className: "mr-2 rounded border-border", readOnly: true, checked: visibleCols.includes(c.key) }),
|
|
7957
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "truncate", children: c.title })
|
|
7424
7958
|
]
|
|
7425
7959
|
},
|
|
7426
7960
|
c.key
|
|
@@ -7430,17 +7964,17 @@ function DataTable({
|
|
|
7430
7964
|
toolbar
|
|
7431
7965
|
] })
|
|
7432
7966
|
] }),
|
|
7433
|
-
/* @__PURE__ */ (0,
|
|
7967
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: cn("relative rounded-md border border-border/50 overflow-hidden", loading2 && "opacity-60 pointer-events-none"), children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
7434
7968
|
Table,
|
|
7435
7969
|
{
|
|
7436
7970
|
containerClassName: "border-0 md:border-0 rounded-none md:rounded-none shadow-none bg-transparent",
|
|
7437
7971
|
className: "[&_thead]:sticky [&_thead]:top-0 [&_thead]:z-[5] [&_thead]:bg-background [&_thead]:backdrop-blur-sm",
|
|
7438
7972
|
children: [
|
|
7439
|
-
/* @__PURE__ */ (0,
|
|
7440
|
-
/* @__PURE__ */ (0,
|
|
7441
|
-
/* @__PURE__ */ (0,
|
|
7442
|
-
/* @__PURE__ */ (0,
|
|
7443
|
-
/* @__PURE__ */ (0,
|
|
7973
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(TableHeader, { children: renderHeader }),
|
|
7974
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(TableBody, { children: loading2 ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(TableRow, { children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(TableCell, { colSpan: visibleColumns.length, className: "text-center py-8", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex items-center justify-center gap-2 text-muted-foreground", children: [
|
|
7975
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("svg", { className: "animate-spin h-4 w-4", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", children: [
|
|
7976
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
|
|
7977
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7444
7978
|
"path",
|
|
7445
7979
|
{
|
|
7446
7980
|
className: "opacity-75",
|
|
@@ -7449,10 +7983,10 @@ function DataTable({
|
|
|
7449
7983
|
}
|
|
7450
7984
|
)
|
|
7451
7985
|
] }),
|
|
7452
|
-
/* @__PURE__ */ (0,
|
|
7453
|
-
] }) }) }) : !displayedData || displayedData.length === 0 ? /* @__PURE__ */ (0,
|
|
7986
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "text-sm", children: "Loading..." })
|
|
7987
|
+
] }) }) }) : !displayedData || displayedData.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(TableRow, { children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(TableCell, { colSpan: visibleColumns.length, className: "text-center py-6 text-muted-foreground", children: "No data" }) }) : displayedData.map((row, idx) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(TableRow, { className: cn(densityRowClass, striped && idx % 2 === 0 && "bg-muted/30"), children: visibleColumns.map((col, colIdx) => {
|
|
7454
7988
|
const value = col.dataIndex ? row[col.dataIndex] : void 0;
|
|
7455
|
-
return /* @__PURE__ */ (0,
|
|
7989
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7456
7990
|
TableCell,
|
|
7457
7991
|
{
|
|
7458
7992
|
className: cn(
|
|
@@ -7471,7 +8005,7 @@ function DataTable({
|
|
|
7471
8005
|
]
|
|
7472
8006
|
}
|
|
7473
8007
|
) }),
|
|
7474
|
-
totalItems > 0 && /* @__PURE__ */ (0,
|
|
8008
|
+
totalItems > 0 && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "border-t bg-muted/30 p-4 rounded-b-md", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7475
8009
|
Pagination,
|
|
7476
8010
|
{
|
|
7477
8011
|
page: curPage,
|
|
@@ -7493,10 +8027,10 @@ function DataTable({
|
|
|
7493
8027
|
var DataTable_default = DataTable;
|
|
7494
8028
|
|
|
7495
8029
|
// ../../components/ui/Form.tsx
|
|
7496
|
-
var
|
|
8030
|
+
var React32 = __toESM(require("react"), 1);
|
|
7497
8031
|
|
|
7498
8032
|
// ../../node_modules/react-hook-form/dist/index.esm.mjs
|
|
7499
|
-
var
|
|
8033
|
+
var import_react23 = __toESM(require("react"), 1);
|
|
7500
8034
|
var isCheckBoxInput = (element) => element.type === "checkbox";
|
|
7501
8035
|
var isDateObject = (value) => value instanceof Date;
|
|
7502
8036
|
var isNullOrUndefined = (value) => value == null;
|
|
@@ -7584,12 +8118,12 @@ var INPUT_VALIDATION_RULES = {
|
|
|
7584
8118
|
required: "required",
|
|
7585
8119
|
validate: "validate"
|
|
7586
8120
|
};
|
|
7587
|
-
var HookFormContext =
|
|
8121
|
+
var HookFormContext = import_react23.default.createContext(null);
|
|
7588
8122
|
HookFormContext.displayName = "HookFormContext";
|
|
7589
|
-
var useFormContext = () =>
|
|
8123
|
+
var useFormContext = () => import_react23.default.useContext(HookFormContext);
|
|
7590
8124
|
var FormProvider = (props) => {
|
|
7591
8125
|
const { children, ...data } = props;
|
|
7592
|
-
return
|
|
8126
|
+
return import_react23.default.createElement(HookFormContext.Provider, { value: data }, children);
|
|
7593
8127
|
};
|
|
7594
8128
|
var getProxyFormState = (formState, control, localProxyFormState, isRoot = true) => {
|
|
7595
8129
|
const result = {
|
|
@@ -7609,12 +8143,12 @@ var getProxyFormState = (formState, control, localProxyFormState, isRoot = true)
|
|
|
7609
8143
|
}
|
|
7610
8144
|
return result;
|
|
7611
8145
|
};
|
|
7612
|
-
var useIsomorphicLayoutEffect = typeof window !== "undefined" ?
|
|
8146
|
+
var useIsomorphicLayoutEffect = typeof window !== "undefined" ? import_react23.default.useLayoutEffect : import_react23.default.useEffect;
|
|
7613
8147
|
function useFormState(props) {
|
|
7614
8148
|
const methods = useFormContext();
|
|
7615
8149
|
const { control = methods.control, disabled, name, exact } = props || {};
|
|
7616
|
-
const [formState, updateFormState] =
|
|
7617
|
-
const _localProxyFormState =
|
|
8150
|
+
const [formState, updateFormState] = import_react23.default.useState(control._formState);
|
|
8151
|
+
const _localProxyFormState = import_react23.default.useRef({
|
|
7618
8152
|
isDirty: false,
|
|
7619
8153
|
isLoading: false,
|
|
7620
8154
|
dirtyFields: false,
|
|
@@ -7635,10 +8169,10 @@ function useFormState(props) {
|
|
|
7635
8169
|
});
|
|
7636
8170
|
}
|
|
7637
8171
|
}), [name, disabled, exact]);
|
|
7638
|
-
|
|
8172
|
+
import_react23.default.useEffect(() => {
|
|
7639
8173
|
_localProxyFormState.current.isValid && control._setValid(true);
|
|
7640
8174
|
}, [control]);
|
|
7641
|
-
return
|
|
8175
|
+
return import_react23.default.useMemo(() => getProxyFormState(formState, control, _localProxyFormState.current, false), [formState, control]);
|
|
7642
8176
|
}
|
|
7643
8177
|
var isString = (value) => typeof value === "string";
|
|
7644
8178
|
var generateWatchOutput = (names, _names, formValues, isGlobal, defaultValue) => {
|
|
@@ -7687,12 +8221,12 @@ function deepEqual(object1, object2, _internal_visited = /* @__PURE__ */ new Wea
|
|
|
7687
8221
|
function useWatch(props) {
|
|
7688
8222
|
const methods = useFormContext();
|
|
7689
8223
|
const { control = methods.control, name, defaultValue, disabled, exact, compute } = props || {};
|
|
7690
|
-
const _defaultValue =
|
|
7691
|
-
const _compute =
|
|
7692
|
-
const _computeFormValues =
|
|
8224
|
+
const _defaultValue = import_react23.default.useRef(defaultValue);
|
|
8225
|
+
const _compute = import_react23.default.useRef(compute);
|
|
8226
|
+
const _computeFormValues = import_react23.default.useRef(void 0);
|
|
7693
8227
|
_compute.current = compute;
|
|
7694
|
-
const defaultValueMemo =
|
|
7695
|
-
const [value, updateValue] =
|
|
8228
|
+
const defaultValueMemo = import_react23.default.useMemo(() => control._getWatch(name, _defaultValue.current), [control, name]);
|
|
8229
|
+
const [value, updateValue] = import_react23.default.useState(_compute.current ? _compute.current(defaultValueMemo) : defaultValueMemo);
|
|
7696
8230
|
useIsomorphicLayoutEffect(() => control._subscribe({
|
|
7697
8231
|
name,
|
|
7698
8232
|
formState: {
|
|
@@ -7714,14 +8248,14 @@ function useWatch(props) {
|
|
|
7714
8248
|
}
|
|
7715
8249
|
}
|
|
7716
8250
|
}), [control, disabled, name, exact]);
|
|
7717
|
-
|
|
8251
|
+
import_react23.default.useEffect(() => control._removeUnmounted());
|
|
7718
8252
|
return value;
|
|
7719
8253
|
}
|
|
7720
8254
|
function useController(props) {
|
|
7721
8255
|
const methods = useFormContext();
|
|
7722
8256
|
const { name, disabled, control = methods.control, shouldUnregister, defaultValue } = props;
|
|
7723
8257
|
const isArrayField = isNameInFieldArray(control._names.array, name);
|
|
7724
|
-
const defaultValueMemo =
|
|
8258
|
+
const defaultValueMemo = import_react23.default.useMemo(() => get(control._formValues, name, get(control._defaultValues, name, defaultValue)), [control, name, defaultValue]);
|
|
7725
8259
|
const value = useWatch({
|
|
7726
8260
|
control,
|
|
7727
8261
|
name,
|
|
@@ -7733,15 +8267,15 @@ function useController(props) {
|
|
|
7733
8267
|
name,
|
|
7734
8268
|
exact: true
|
|
7735
8269
|
});
|
|
7736
|
-
const _props =
|
|
7737
|
-
const _previousNameRef =
|
|
7738
|
-
const _registerProps =
|
|
8270
|
+
const _props = import_react23.default.useRef(props);
|
|
8271
|
+
const _previousNameRef = import_react23.default.useRef(void 0);
|
|
8272
|
+
const _registerProps = import_react23.default.useRef(control.register(name, {
|
|
7739
8273
|
...props.rules,
|
|
7740
8274
|
value,
|
|
7741
8275
|
...isBoolean(props.disabled) ? { disabled: props.disabled } : {}
|
|
7742
8276
|
}));
|
|
7743
8277
|
_props.current = props;
|
|
7744
|
-
const fieldState =
|
|
8278
|
+
const fieldState = import_react23.default.useMemo(() => Object.defineProperties({}, {
|
|
7745
8279
|
invalid: {
|
|
7746
8280
|
enumerable: true,
|
|
7747
8281
|
get: () => !!get(formState.errors, name)
|
|
@@ -7763,21 +8297,21 @@ function useController(props) {
|
|
|
7763
8297
|
get: () => get(formState.errors, name)
|
|
7764
8298
|
}
|
|
7765
8299
|
}), [formState, name]);
|
|
7766
|
-
const onChange =
|
|
8300
|
+
const onChange = import_react23.default.useCallback((event) => _registerProps.current.onChange({
|
|
7767
8301
|
target: {
|
|
7768
8302
|
value: getEventValue(event),
|
|
7769
8303
|
name
|
|
7770
8304
|
},
|
|
7771
8305
|
type: EVENTS.CHANGE
|
|
7772
8306
|
}), [name]);
|
|
7773
|
-
const onBlur =
|
|
8307
|
+
const onBlur = import_react23.default.useCallback(() => _registerProps.current.onBlur({
|
|
7774
8308
|
target: {
|
|
7775
8309
|
value: get(control._formValues, name),
|
|
7776
8310
|
name
|
|
7777
8311
|
},
|
|
7778
8312
|
type: EVENTS.BLUR
|
|
7779
8313
|
}), [name, control._formValues]);
|
|
7780
|
-
const ref =
|
|
8314
|
+
const ref = import_react23.default.useCallback((elm) => {
|
|
7781
8315
|
const field2 = get(control._fields, name);
|
|
7782
8316
|
if (field2 && elm) {
|
|
7783
8317
|
field2._f.ref = {
|
|
@@ -7788,7 +8322,7 @@ function useController(props) {
|
|
|
7788
8322
|
};
|
|
7789
8323
|
}
|
|
7790
8324
|
}, [control._fields, name]);
|
|
7791
|
-
const field =
|
|
8325
|
+
const field = import_react23.default.useMemo(() => ({
|
|
7792
8326
|
name,
|
|
7793
8327
|
value,
|
|
7794
8328
|
...isBoolean(disabled) || formState.disabled ? { disabled: formState.disabled || disabled } : {},
|
|
@@ -7796,7 +8330,7 @@ function useController(props) {
|
|
|
7796
8330
|
onBlur,
|
|
7797
8331
|
ref
|
|
7798
8332
|
}), [name, disabled, formState.disabled, onChange, onBlur, ref, value]);
|
|
7799
|
-
|
|
8333
|
+
import_react23.default.useEffect(() => {
|
|
7800
8334
|
const _shouldUnregisterField = control._options.shouldUnregister || shouldUnregister;
|
|
7801
8335
|
const previousName = _previousNameRef.current;
|
|
7802
8336
|
if (previousName && previousName !== name && !isArrayField) {
|
|
@@ -7826,13 +8360,13 @@ function useController(props) {
|
|
|
7826
8360
|
(isArrayField ? _shouldUnregisterField && !control._state.action : _shouldUnregisterField) ? control.unregister(name) : updateMounted(name, false);
|
|
7827
8361
|
};
|
|
7828
8362
|
}, [name, control, isArrayField, shouldUnregister]);
|
|
7829
|
-
|
|
8363
|
+
import_react23.default.useEffect(() => {
|
|
7830
8364
|
control._setDisabledField({
|
|
7831
8365
|
disabled,
|
|
7832
8366
|
name
|
|
7833
8367
|
});
|
|
7834
8368
|
}, [disabled, name, control]);
|
|
7835
|
-
return
|
|
8369
|
+
return import_react23.default.useMemo(() => ({
|
|
7836
8370
|
field,
|
|
7837
8371
|
formState,
|
|
7838
8372
|
fieldState
|
|
@@ -9151,9 +9685,9 @@ function createFormControl(props = {}) {
|
|
|
9151
9685
|
};
|
|
9152
9686
|
}
|
|
9153
9687
|
function useForm(props = {}) {
|
|
9154
|
-
const _formControl =
|
|
9155
|
-
const _values =
|
|
9156
|
-
const [formState, updateFormState] =
|
|
9688
|
+
const _formControl = import_react23.default.useRef(void 0);
|
|
9689
|
+
const _values = import_react23.default.useRef(void 0);
|
|
9690
|
+
const [formState, updateFormState] = import_react23.default.useState({
|
|
9157
9691
|
isDirty: false,
|
|
9158
9692
|
isValidating: false,
|
|
9159
9693
|
isLoading: isFunction(props.defaultValues),
|
|
@@ -9202,8 +9736,8 @@ function useForm(props = {}) {
|
|
|
9202
9736
|
control._formState.isReady = true;
|
|
9203
9737
|
return sub;
|
|
9204
9738
|
}, [control]);
|
|
9205
|
-
|
|
9206
|
-
|
|
9739
|
+
import_react23.default.useEffect(() => control._disableForm(props.disabled), [control, props.disabled]);
|
|
9740
|
+
import_react23.default.useEffect(() => {
|
|
9207
9741
|
if (props.mode) {
|
|
9208
9742
|
control._options.mode = props.mode;
|
|
9209
9743
|
}
|
|
@@ -9211,18 +9745,18 @@ function useForm(props = {}) {
|
|
|
9211
9745
|
control._options.reValidateMode = props.reValidateMode;
|
|
9212
9746
|
}
|
|
9213
9747
|
}, [control, props.mode, props.reValidateMode]);
|
|
9214
|
-
|
|
9748
|
+
import_react23.default.useEffect(() => {
|
|
9215
9749
|
if (props.errors) {
|
|
9216
9750
|
control._setErrors(props.errors);
|
|
9217
9751
|
control._focusError();
|
|
9218
9752
|
}
|
|
9219
9753
|
}, [control, props.errors]);
|
|
9220
|
-
|
|
9754
|
+
import_react23.default.useEffect(() => {
|
|
9221
9755
|
props.shouldUnregister && control._subjects.state.next({
|
|
9222
9756
|
values: control._getWatch()
|
|
9223
9757
|
});
|
|
9224
9758
|
}, [control, props.shouldUnregister]);
|
|
9225
|
-
|
|
9759
|
+
import_react23.default.useEffect(() => {
|
|
9226
9760
|
if (control._proxyFormState.isDirty) {
|
|
9227
9761
|
const isDirty = control._getDirty();
|
|
9228
9762
|
if (isDirty !== formState.isDirty) {
|
|
@@ -9232,7 +9766,7 @@ function useForm(props = {}) {
|
|
|
9232
9766
|
}
|
|
9233
9767
|
}
|
|
9234
9768
|
}, [control, formState.isDirty]);
|
|
9235
|
-
|
|
9769
|
+
import_react23.default.useEffect(() => {
|
|
9236
9770
|
if (props.values && !deepEqual(props.values, _values.current)) {
|
|
9237
9771
|
control._reset(props.values, {
|
|
9238
9772
|
keepFieldsRef: true,
|
|
@@ -9244,7 +9778,7 @@ function useForm(props = {}) {
|
|
|
9244
9778
|
control._resetDefaultValues();
|
|
9245
9779
|
}
|
|
9246
9780
|
}, [control, props.values]);
|
|
9247
|
-
|
|
9781
|
+
import_react23.default.useEffect(() => {
|
|
9248
9782
|
if (!control._state.mount) {
|
|
9249
9783
|
control._setValid();
|
|
9250
9784
|
control._state.mount = true;
|
|
@@ -9261,8 +9795,8 @@ function useForm(props = {}) {
|
|
|
9261
9795
|
|
|
9262
9796
|
// ../../components/ui/Form.tsx
|
|
9263
9797
|
var import_next_intl8 = require("next-intl");
|
|
9264
|
-
var
|
|
9265
|
-
var FormConfigContext =
|
|
9798
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
9799
|
+
var FormConfigContext = React32.createContext({ size: "md" });
|
|
9266
9800
|
var FormWrapper = ({
|
|
9267
9801
|
children,
|
|
9268
9802
|
onSubmit,
|
|
@@ -9275,24 +9809,24 @@ var FormWrapper = ({
|
|
|
9275
9809
|
const methods = useForm({
|
|
9276
9810
|
defaultValues: initialValues
|
|
9277
9811
|
});
|
|
9278
|
-
|
|
9812
|
+
React32.useEffect(() => {
|
|
9279
9813
|
if (initialValues) {
|
|
9280
9814
|
methods.reset(initialValues);
|
|
9281
9815
|
}
|
|
9282
9816
|
}, [JSON.stringify(initialValues)]);
|
|
9283
9817
|
const { validationSchema: _, ...formProps } = props;
|
|
9284
|
-
return /* @__PURE__ */ (0,
|
|
9818
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(FormProvider, { ...methods, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(FormConfigContext.Provider, { value: { size }, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("form", { onSubmit: methods.handleSubmit(onSubmit), className, ...formProps, children }) }) });
|
|
9285
9819
|
};
|
|
9286
9820
|
var Form = FormWrapper;
|
|
9287
|
-
var FormFieldContext =
|
|
9821
|
+
var FormFieldContext = React32.createContext({});
|
|
9288
9822
|
var FormField = ({
|
|
9289
9823
|
...props
|
|
9290
9824
|
}) => {
|
|
9291
|
-
return /* @__PURE__ */ (0,
|
|
9825
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Controller, { ...props }) });
|
|
9292
9826
|
};
|
|
9293
9827
|
var useFormField = () => {
|
|
9294
|
-
const fieldContext =
|
|
9295
|
-
const itemContext =
|
|
9828
|
+
const fieldContext = React32.useContext(FormFieldContext);
|
|
9829
|
+
const itemContext = React32.useContext(FormItemContext);
|
|
9296
9830
|
const { getFieldState, formState } = useFormContext();
|
|
9297
9831
|
if (!fieldContext) {
|
|
9298
9832
|
try {
|
|
@@ -9313,22 +9847,22 @@ var useFormField = () => {
|
|
|
9313
9847
|
...fieldState
|
|
9314
9848
|
};
|
|
9315
9849
|
};
|
|
9316
|
-
var FormItemContext =
|
|
9317
|
-
var FormItem =
|
|
9318
|
-
const id =
|
|
9319
|
-
return /* @__PURE__ */ (0,
|
|
9850
|
+
var FormItemContext = React32.createContext({});
|
|
9851
|
+
var FormItem = React32.forwardRef(({ className, ...props }, ref) => {
|
|
9852
|
+
const id = React32.useId();
|
|
9853
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { ref, className: cn("space-y-2", className), ...props }) });
|
|
9320
9854
|
});
|
|
9321
9855
|
FormItem.displayName = "FormItem";
|
|
9322
|
-
var FormLabel =
|
|
9856
|
+
var FormLabel = React32.forwardRef(({ className, ...props }, ref) => {
|
|
9323
9857
|
const { error, formItemId } = useFormField();
|
|
9324
|
-
const config =
|
|
9858
|
+
const config = React32.useContext(FormConfigContext);
|
|
9325
9859
|
const sizeClass = config.size === "sm" ? "text-xs" : config.size === "lg" ? "text-base" : "text-sm";
|
|
9326
|
-
return /* @__PURE__ */ (0,
|
|
9860
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Label, { ref, className: cn(sizeClass, error && "text-destructive", className), htmlFor: formItemId, ...props });
|
|
9327
9861
|
});
|
|
9328
9862
|
FormLabel.displayName = "FormLabel";
|
|
9329
|
-
var FormControl =
|
|
9863
|
+
var FormControl = React32.forwardRef(({ ...props }, ref) => {
|
|
9330
9864
|
const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
|
|
9331
|
-
return /* @__PURE__ */ (0,
|
|
9865
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
9332
9866
|
"div",
|
|
9333
9867
|
{
|
|
9334
9868
|
ref,
|
|
@@ -9340,37 +9874,37 @@ var FormControl = React31.forwardRef(({ ...props }, ref) => {
|
|
|
9340
9874
|
);
|
|
9341
9875
|
});
|
|
9342
9876
|
FormControl.displayName = "FormControl";
|
|
9343
|
-
var FormDescription =
|
|
9877
|
+
var FormDescription = React32.forwardRef(({ className, ...props }, ref) => {
|
|
9344
9878
|
const { formDescriptionId } = useFormField();
|
|
9345
|
-
return /* @__PURE__ */ (0,
|
|
9879
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { ref, id: formDescriptionId, className: cn("text-sm text-muted-foreground", className), ...props });
|
|
9346
9880
|
});
|
|
9347
9881
|
FormDescription.displayName = "FormDescription";
|
|
9348
|
-
var FormMessage =
|
|
9882
|
+
var FormMessage = React32.forwardRef(({ className, children, ...props }, ref) => {
|
|
9349
9883
|
const { error, formMessageId } = useFormField();
|
|
9350
9884
|
const body = error ? String(error?.message) : children;
|
|
9351
9885
|
if (!body) {
|
|
9352
9886
|
return null;
|
|
9353
9887
|
}
|
|
9354
|
-
return /* @__PURE__ */ (0,
|
|
9888
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { ref, id: formMessageId, className: cn("text-sm font-medium text-destructive", className), ...props, children: body });
|
|
9355
9889
|
});
|
|
9356
9890
|
FormMessage.displayName = "FormMessage";
|
|
9357
|
-
var FormInput =
|
|
9891
|
+
var FormInput = React32.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
9358
9892
|
FormField,
|
|
9359
9893
|
{
|
|
9360
9894
|
name,
|
|
9361
|
-
render: ({ field }) => /* @__PURE__ */ (0,
|
|
9362
|
-
/* @__PURE__ */ (0,
|
|
9363
|
-
/* @__PURE__ */ (0,
|
|
9895
|
+
render: ({ field }) => /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(FormItem, { children: [
|
|
9896
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(FormControl, { children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Input_default, { size: props.size ?? size, ...field, ...props }) }),
|
|
9897
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(FormMessage, {})
|
|
9364
9898
|
] })
|
|
9365
9899
|
}
|
|
9366
9900
|
) }));
|
|
9367
9901
|
FormInput.displayName = "FormInput";
|
|
9368
|
-
var FormCheckbox =
|
|
9902
|
+
var FormCheckbox = React32.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
9369
9903
|
FormField,
|
|
9370
9904
|
{
|
|
9371
9905
|
name,
|
|
9372
|
-
render: ({ field }) => /* @__PURE__ */ (0,
|
|
9373
|
-
/* @__PURE__ */ (0,
|
|
9906
|
+
render: ({ field }) => /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(FormItem, { children: [
|
|
9907
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(FormControl, { children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
9374
9908
|
Checkbox,
|
|
9375
9909
|
{
|
|
9376
9910
|
ref,
|
|
@@ -9384,20 +9918,20 @@ var FormCheckbox = React31.forwardRef(({ name, ...props }, ref) => /* @__PURE__
|
|
|
9384
9918
|
...props
|
|
9385
9919
|
}
|
|
9386
9920
|
) }),
|
|
9387
|
-
/* @__PURE__ */ (0,
|
|
9921
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(FormMessage, {})
|
|
9388
9922
|
] })
|
|
9389
9923
|
}
|
|
9390
9924
|
) }));
|
|
9391
9925
|
FormCheckbox.displayName = "FormCheckbox";
|
|
9392
|
-
var FormActions =
|
|
9926
|
+
var FormActions = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { ref, className: cn("flex gap-2 justify-end", className), ...props }));
|
|
9393
9927
|
FormActions.displayName = "FormActions";
|
|
9394
|
-
var FormSubmitButton =
|
|
9928
|
+
var FormSubmitButton = React32.forwardRef(({ children, loading: loading2, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Button_default, { ref, type: "submit", size: props.size ?? size, disabled: loading2, ...props, children }) }));
|
|
9395
9929
|
FormSubmitButton.displayName = "FormSubmitButton";
|
|
9396
9930
|
|
|
9397
9931
|
// ../../components/ui/NotificationModal.tsx
|
|
9398
9932
|
var import_lucide_react22 = require("lucide-react");
|
|
9399
9933
|
var import_next_intl9 = require("next-intl");
|
|
9400
|
-
var
|
|
9934
|
+
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
9401
9935
|
function NotificationModal({ isOpen, onClose, notification, titleText, openLinkText, closeText }) {
|
|
9402
9936
|
const t = (0, import_next_intl9.useTranslations)("Common");
|
|
9403
9937
|
if (!notification) return null;
|
|
@@ -9418,26 +9952,26 @@ function NotificationModal({ isOpen, onClose, notification, titleText, openLinkT
|
|
|
9418
9952
|
onClose();
|
|
9419
9953
|
}
|
|
9420
9954
|
};
|
|
9421
|
-
return /* @__PURE__ */ (0,
|
|
9955
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
9422
9956
|
Modal_default,
|
|
9423
9957
|
{
|
|
9424
9958
|
isOpen,
|
|
9425
9959
|
onClose,
|
|
9426
9960
|
title: titleText || t("notifications"),
|
|
9427
9961
|
size: "md",
|
|
9428
|
-
children: /* @__PURE__ */ (0,
|
|
9429
|
-
/* @__PURE__ */ (0,
|
|
9430
|
-
/* @__PURE__ */ (0,
|
|
9962
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "space-y-4", children: [
|
|
9963
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex items-center gap-2 pb-2 border-b border-border", children: [
|
|
9964
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: cn(
|
|
9431
9965
|
"w-2 h-2 rounded-full",
|
|
9432
9966
|
!notification.is_read ? "bg-primary" : "bg-border"
|
|
9433
9967
|
) }),
|
|
9434
|
-
/* @__PURE__ */ (0,
|
|
9968
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "text-xs text-muted-foreground", children: !notification.is_read ? t("newNotification") : t("readStatus") })
|
|
9435
9969
|
] }),
|
|
9436
|
-
notification.title && /* @__PURE__ */ (0,
|
|
9437
|
-
notification.body && /* @__PURE__ */ (0,
|
|
9438
|
-
/* @__PURE__ */ (0,
|
|
9439
|
-
/* @__PURE__ */ (0,
|
|
9440
|
-
hasLink && /* @__PURE__ */ (0,
|
|
9970
|
+
notification.title && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("h3", { className: "text-lg font-semibold text-foreground", children: notification.title }),
|
|
9971
|
+
notification.body && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "text-sm text-muted-foreground whitespace-pre-wrap leading-relaxed", children: notification.body }),
|
|
9972
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "text-xs text-muted-foreground border-t border-border pt-2", children: formatTime2(notification.created_at) }),
|
|
9973
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex gap-2 justify-end pt-2", children: [
|
|
9974
|
+
hasLink && /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
|
|
9441
9975
|
Button_default,
|
|
9442
9976
|
{
|
|
9443
9977
|
variant: "primary",
|
|
@@ -9445,12 +9979,12 @@ function NotificationModal({ isOpen, onClose, notification, titleText, openLinkT
|
|
|
9445
9979
|
onClick: handleLinkClick,
|
|
9446
9980
|
className: "gap-2",
|
|
9447
9981
|
children: [
|
|
9448
|
-
/* @__PURE__ */ (0,
|
|
9982
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_lucide_react22.ExternalLink, { className: "w-4 h-4" }),
|
|
9449
9983
|
openLinkText || t("openLink")
|
|
9450
9984
|
]
|
|
9451
9985
|
}
|
|
9452
9986
|
),
|
|
9453
|
-
/* @__PURE__ */ (0,
|
|
9987
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
9454
9988
|
Button_default,
|
|
9455
9989
|
{
|
|
9456
9990
|
variant: "ghost",
|
|
@@ -9472,10 +10006,10 @@ var import_navigation = require("next/navigation");
|
|
|
9472
10006
|
var import_lucide_react23 = require("lucide-react");
|
|
9473
10007
|
|
|
9474
10008
|
// ../../node_modules/react-icons/lib/iconBase.mjs
|
|
9475
|
-
var
|
|
10009
|
+
var import_react25 = __toESM(require("react"), 1);
|
|
9476
10010
|
|
|
9477
10011
|
// ../../node_modules/react-icons/lib/iconContext.mjs
|
|
9478
|
-
var
|
|
10012
|
+
var import_react24 = __toESM(require("react"), 1);
|
|
9479
10013
|
var DefaultContext = {
|
|
9480
10014
|
color: void 0,
|
|
9481
10015
|
size: void 0,
|
|
@@ -9483,7 +10017,7 @@ var DefaultContext = {
|
|
|
9483
10017
|
style: void 0,
|
|
9484
10018
|
attr: void 0
|
|
9485
10019
|
};
|
|
9486
|
-
var IconContext =
|
|
10020
|
+
var IconContext = import_react24.default.createContext && /* @__PURE__ */ import_react24.default.createContext(DefaultContext);
|
|
9487
10021
|
|
|
9488
10022
|
// ../../node_modules/react-icons/lib/iconBase.mjs
|
|
9489
10023
|
var _excluded = ["attr", "size", "title"];
|
|
@@ -9572,12 +10106,12 @@ function _toPrimitive(t, r) {
|
|
|
9572
10106
|
return ("string" === r ? String : Number)(t);
|
|
9573
10107
|
}
|
|
9574
10108
|
function Tree2Element(tree) {
|
|
9575
|
-
return tree && tree.map((node, i) => /* @__PURE__ */
|
|
10109
|
+
return tree && tree.map((node, i) => /* @__PURE__ */ import_react25.default.createElement(node.tag, _objectSpread({
|
|
9576
10110
|
key: i
|
|
9577
10111
|
}, node.attr), Tree2Element(node.child)));
|
|
9578
10112
|
}
|
|
9579
10113
|
function GenIcon(data) {
|
|
9580
|
-
return (props) => /* @__PURE__ */
|
|
10114
|
+
return (props) => /* @__PURE__ */ import_react25.default.createElement(IconBase, _extends({
|
|
9581
10115
|
attr: _objectSpread({}, data.attr)
|
|
9582
10116
|
}, props), Tree2Element(data.child));
|
|
9583
10117
|
}
|
|
@@ -9592,7 +10126,7 @@ function IconBase(props) {
|
|
|
9592
10126
|
var className;
|
|
9593
10127
|
if (conf.className) className = conf.className;
|
|
9594
10128
|
if (props.className) className = (className ? className + " " : "") + props.className;
|
|
9595
|
-
return /* @__PURE__ */
|
|
10129
|
+
return /* @__PURE__ */ import_react25.default.createElement("svg", _extends({
|
|
9596
10130
|
stroke: "currentColor",
|
|
9597
10131
|
fill: "currentColor",
|
|
9598
10132
|
strokeWidth: "0"
|
|
@@ -9604,9 +10138,9 @@ function IconBase(props) {
|
|
|
9604
10138
|
height: computedSize,
|
|
9605
10139
|
width: computedSize,
|
|
9606
10140
|
xmlns: "http://www.w3.org/2000/svg"
|
|
9607
|
-
}), title && /* @__PURE__ */
|
|
10141
|
+
}), title && /* @__PURE__ */ import_react25.default.createElement("title", null, title), props.children);
|
|
9608
10142
|
};
|
|
9609
|
-
return IconContext !== void 0 ? /* @__PURE__ */
|
|
10143
|
+
return IconContext !== void 0 ? /* @__PURE__ */ import_react25.default.createElement(IconContext.Consumer, null, (conf) => elem(conf)) : elem(DefaultContext);
|
|
9610
10144
|
}
|
|
9611
10145
|
|
|
9612
10146
|
// ../../node_modules/react-icons/fa/index.mjs
|
|
@@ -9620,9 +10154,9 @@ function SiZalo(props) {
|
|
|
9620
10154
|
}
|
|
9621
10155
|
|
|
9622
10156
|
// ../../components/ui/FloatingContacts.tsx
|
|
9623
|
-
var
|
|
10157
|
+
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
9624
10158
|
function MessengerIcon(props) {
|
|
9625
|
-
return /* @__PURE__ */ (0,
|
|
10159
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("svg", { viewBox: "0 0 24 24", width: 24, height: 24, "aria-hidden": "true", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
|
|
9626
10160
|
"path",
|
|
9627
10161
|
{
|
|
9628
10162
|
d: "M12 2C6.477 2 2 6.145 2 11.235c0 2.93 1.35 5.542 3.464 7.25v3.515l3.344-1.836c.894.247 1.843.375 2.192.375 5.523 0 10-4.145 10-9.235S17.523 2 12 2zm.994 12.444l-2.563-2.73-5.004 2.73 5.507-5.84 2.626 2.729 4.942-2.729-5.508 5.84z",
|
|
@@ -9631,10 +10165,10 @@ function MessengerIcon(props) {
|
|
|
9631
10165
|
) });
|
|
9632
10166
|
}
|
|
9633
10167
|
function ZaloIcon(props) {
|
|
9634
|
-
return /* @__PURE__ */ (0,
|
|
10168
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(SiZalo, { size: 20, ...props });
|
|
9635
10169
|
}
|
|
9636
10170
|
function InstagramIcon(props) {
|
|
9637
|
-
return /* @__PURE__ */ (0,
|
|
10171
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(FaInstagram, { size: 20, ...props });
|
|
9638
10172
|
}
|
|
9639
10173
|
function FloatingContacts({ className }) {
|
|
9640
10174
|
const pathname = (0, import_navigation.usePathname)();
|
|
@@ -9669,8 +10203,8 @@ function FloatingContacts({ className }) {
|
|
|
9669
10203
|
external: true
|
|
9670
10204
|
}
|
|
9671
10205
|
];
|
|
9672
|
-
return /* @__PURE__ */ (0,
|
|
9673
|
-
/* @__PURE__ */ (0,
|
|
10206
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: cn("fixed bottom-6 right-4 z-[100000]", "flex flex-col items-end gap-3", className), "aria-label": "Quick contacts", children: [
|
|
10207
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
|
|
9674
10208
|
import_link2.default,
|
|
9675
10209
|
{
|
|
9676
10210
|
href: `tel:${hotline.replace(/\D/g, "")}`,
|
|
@@ -9681,10 +10215,10 @@ function FloatingContacts({ className }) {
|
|
|
9681
10215
|
"hover:scale-105 active:scale-95 transition-transform",
|
|
9682
10216
|
"bg-[#22c55e]"
|
|
9683
10217
|
),
|
|
9684
|
-
children: /* @__PURE__ */ (0,
|
|
10218
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_lucide_react23.Phone, { className: "w-6 h-6" })
|
|
9685
10219
|
}
|
|
9686
10220
|
),
|
|
9687
|
-
moreItems.map(({ key, href, label, bg, Icon, external }) => /* @__PURE__ */ (0,
|
|
10221
|
+
moreItems.map(({ key, href, label, bg, Icon, external }) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
|
|
9688
10222
|
import_link2.default,
|
|
9689
10223
|
{
|
|
9690
10224
|
href,
|
|
@@ -9696,7 +10230,7 @@ function FloatingContacts({ className }) {
|
|
|
9696
10230
|
"hover:scale-105 active:scale-95 transition-transform",
|
|
9697
10231
|
bg
|
|
9698
10232
|
),
|
|
9699
|
-
children: /* @__PURE__ */ (0,
|
|
10233
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Icon, { className: "w-6 h-6" })
|
|
9700
10234
|
},
|
|
9701
10235
|
key
|
|
9702
10236
|
))
|
|
@@ -9705,7 +10239,7 @@ function FloatingContacts({ className }) {
|
|
|
9705
10239
|
|
|
9706
10240
|
// ../../components/ui/AccessDenied.tsx
|
|
9707
10241
|
var import_lucide_react24 = require("lucide-react");
|
|
9708
|
-
var
|
|
10242
|
+
var import_jsx_runtime44 = require("react/jsx-runtime");
|
|
9709
10243
|
var VARIANT_STYLES = {
|
|
9710
10244
|
destructive: { bg: "bg-destructive/5", border: "border-destructive/20", text: "text-destructive" },
|
|
9711
10245
|
warning: { bg: "bg-warning/5", border: "border-warning/20", text: "text-warning" },
|
|
@@ -9726,32 +10260,32 @@ function AccessDenied({
|
|
|
9726
10260
|
}) {
|
|
9727
10261
|
const styles = VARIANT_STYLES[variant];
|
|
9728
10262
|
const UsedIcon = Icon || DEFAULT_ICONS[variant];
|
|
9729
|
-
return /* @__PURE__ */ (0,
|
|
9730
|
-
/* @__PURE__ */ (0,
|
|
9731
|
-
/* @__PURE__ */ (0,
|
|
9732
|
-
/* @__PURE__ */ (0,
|
|
9733
|
-
/* @__PURE__ */ (0,
|
|
10263
|
+
return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Card_default, { className: cn("p-8 text-center shadow-sm", styles.bg, styles.border, className), children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "flex flex-col items-center gap-4", children: [
|
|
10264
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: cn("p-3 rounded-lg", styles.bg.replace("/5", "/10")), children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(UsedIcon, { className: cn("w-8 h-8", styles.text) }) }),
|
|
10265
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { children: [
|
|
10266
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)("h3", { className: cn("font-semibold mb-2", styles.text), children: title }),
|
|
10267
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)("p", { className: cn(styles.text.replace("text-", "text-") + "/80", "text-sm"), children: description })
|
|
9734
10268
|
] }),
|
|
9735
|
-
children && /* @__PURE__ */ (0,
|
|
10269
|
+
children && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "mt-2 flex flex-wrap gap-2 justify-center", children })
|
|
9736
10270
|
] }) });
|
|
9737
10271
|
}
|
|
9738
10272
|
|
|
9739
10273
|
// ../../components/ui/ThemeToggleHeadless.tsx
|
|
9740
10274
|
var import_lucide_react25 = require("lucide-react");
|
|
9741
|
-
var
|
|
10275
|
+
var import_react26 = require("react");
|
|
9742
10276
|
var import_react_dom9 = require("react-dom");
|
|
9743
|
-
var
|
|
10277
|
+
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
9744
10278
|
function ThemeToggleHeadless({
|
|
9745
10279
|
theme,
|
|
9746
10280
|
onChange,
|
|
9747
10281
|
labels,
|
|
9748
10282
|
className
|
|
9749
10283
|
}) {
|
|
9750
|
-
const [isOpen, setIsOpen] = (0,
|
|
9751
|
-
const [mounted, setMounted] = (0,
|
|
9752
|
-
const triggerRef = (0,
|
|
9753
|
-
const [dropdownPosition, setDropdownPosition] = (0,
|
|
9754
|
-
(0,
|
|
10284
|
+
const [isOpen, setIsOpen] = (0, import_react26.useState)(false);
|
|
10285
|
+
const [mounted, setMounted] = (0, import_react26.useState)(false);
|
|
10286
|
+
const triggerRef = (0, import_react26.useRef)(null);
|
|
10287
|
+
const [dropdownPosition, setDropdownPosition] = (0, import_react26.useState)(null);
|
|
10288
|
+
(0, import_react26.useEffect)(() => setMounted(true), []);
|
|
9755
10289
|
const themes = [
|
|
9756
10290
|
{ value: "light", label: labels?.light ?? "Light", icon: import_lucide_react25.Sun },
|
|
9757
10291
|
{ value: "dark", label: labels?.dark ?? "Dark", icon: import_lucide_react25.Moon },
|
|
@@ -9769,8 +10303,8 @@ function ThemeToggleHeadless({
|
|
|
9769
10303
|
const top = rect.bottom + scrollTop + 8;
|
|
9770
10304
|
return { top, left, width };
|
|
9771
10305
|
};
|
|
9772
|
-
return /* @__PURE__ */ (0,
|
|
9773
|
-
/* @__PURE__ */ (0,
|
|
10306
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: cn("relative", className), children: [
|
|
10307
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
|
|
9774
10308
|
Button_default,
|
|
9775
10309
|
{
|
|
9776
10310
|
variant: "ghost",
|
|
@@ -9788,25 +10322,25 @@ function ThemeToggleHeadless({
|
|
|
9788
10322
|
"aria-haspopup": "menu",
|
|
9789
10323
|
"aria-expanded": isOpen,
|
|
9790
10324
|
"aria-label": labels?.heading ?? "Theme",
|
|
9791
|
-
children: /* @__PURE__ */ (0,
|
|
10325
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(CurrentIcon, { className: "h-5 w-5" })
|
|
9792
10326
|
}
|
|
9793
10327
|
),
|
|
9794
|
-
isOpen && /* @__PURE__ */ (0,
|
|
9795
|
-
typeof window !== "undefined" && (0, import_react_dom9.createPortal)(/* @__PURE__ */ (0,
|
|
10328
|
+
isOpen && /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_jsx_runtime45.Fragment, { children: [
|
|
10329
|
+
typeof window !== "undefined" && (0, import_react_dom9.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: "fixed inset-0 z-[9998]", onClick: () => setIsOpen(false) }), document.body),
|
|
9796
10330
|
typeof window !== "undefined" && dropdownPosition && (0, import_react_dom9.createPortal)(
|
|
9797
|
-
/* @__PURE__ */ (0,
|
|
10331
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
|
|
9798
10332
|
"div",
|
|
9799
10333
|
{
|
|
9800
10334
|
className: "z-[9999] bg-card border border-border rounded-lg shadow-lg overflow-hidden",
|
|
9801
10335
|
style: { position: "absolute", top: dropdownPosition.top, left: dropdownPosition.left, width: dropdownPosition.width },
|
|
9802
10336
|
onMouseDown: (e) => e.stopPropagation(),
|
|
9803
10337
|
role: "menu",
|
|
9804
|
-
children: /* @__PURE__ */ (0,
|
|
9805
|
-
/* @__PURE__ */ (0,
|
|
10338
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: "p-2", children: [
|
|
10339
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: "px-3 py-2 text-sm font-medium text-muted-foreground border-b border-border mb-2", children: labels?.heading ?? "Theme" }),
|
|
9806
10340
|
themes.map((opt) => {
|
|
9807
10341
|
const Icon = opt.icon;
|
|
9808
10342
|
const active = theme === opt.value;
|
|
9809
|
-
return /* @__PURE__ */ (0,
|
|
10343
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
|
|
9810
10344
|
Button_default,
|
|
9811
10345
|
{
|
|
9812
10346
|
variant: "ghost",
|
|
@@ -9822,9 +10356,9 @@ function ThemeToggleHeadless({
|
|
|
9822
10356
|
role: "menuitemradio",
|
|
9823
10357
|
"aria-checked": active,
|
|
9824
10358
|
children: [
|
|
9825
|
-
/* @__PURE__ */ (0,
|
|
9826
|
-
/* @__PURE__ */ (0,
|
|
9827
|
-
active && /* @__PURE__ */ (0,
|
|
10359
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Icon, { className: "h-4 w-4" }),
|
|
10360
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { className: "flex-1 text-left", children: opt.label }),
|
|
10361
|
+
active && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: "w-2 h-2 rounded-full bg-primary" })
|
|
9828
10362
|
]
|
|
9829
10363
|
},
|
|
9830
10364
|
opt.value
|
|
@@ -9840,10 +10374,10 @@ function ThemeToggleHeadless({
|
|
|
9840
10374
|
}
|
|
9841
10375
|
|
|
9842
10376
|
// ../../components/ui/LanguageSwitcherHeadless.tsx
|
|
9843
|
-
var
|
|
10377
|
+
var import_react27 = require("react");
|
|
9844
10378
|
var import_react_dom10 = require("react-dom");
|
|
9845
10379
|
var import_lucide_react26 = require("lucide-react");
|
|
9846
|
-
var
|
|
10380
|
+
var import_jsx_runtime46 = require("react/jsx-runtime");
|
|
9847
10381
|
function LanguageSwitcherHeadless({
|
|
9848
10382
|
locales,
|
|
9849
10383
|
currentLocale,
|
|
@@ -9851,9 +10385,9 @@ function LanguageSwitcherHeadless({
|
|
|
9851
10385
|
labels,
|
|
9852
10386
|
className
|
|
9853
10387
|
}) {
|
|
9854
|
-
const [isOpen, setIsOpen] = (0,
|
|
9855
|
-
const [dropdownPosition, setDropdownPosition] = (0,
|
|
9856
|
-
const triggerButtonRef = (0,
|
|
10388
|
+
const [isOpen, setIsOpen] = (0, import_react27.useState)(false);
|
|
10389
|
+
const [dropdownPosition, setDropdownPosition] = (0, import_react27.useState)(null);
|
|
10390
|
+
const triggerButtonRef = (0, import_react27.useRef)(null);
|
|
9857
10391
|
const currentLanguage = locales.find((l) => l.code === currentLocale) || locales[0];
|
|
9858
10392
|
const calculatePosition = () => {
|
|
9859
10393
|
const rect = triggerButtonRef.current?.getBoundingClientRect();
|
|
@@ -9865,8 +10399,8 @@ function LanguageSwitcherHeadless({
|
|
|
9865
10399
|
const top = rect.bottom + scrollTop + 8;
|
|
9866
10400
|
return { top, left, width };
|
|
9867
10401
|
};
|
|
9868
|
-
return /* @__PURE__ */ (0,
|
|
9869
|
-
/* @__PURE__ */ (0,
|
|
10402
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: cn("relative", className), children: [
|
|
10403
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
|
|
9870
10404
|
Button_default,
|
|
9871
10405
|
{
|
|
9872
10406
|
variant: "ghost",
|
|
@@ -9885,22 +10419,22 @@ function LanguageSwitcherHeadless({
|
|
|
9885
10419
|
"aria-expanded": isOpen,
|
|
9886
10420
|
"aria-label": labels?.heading ?? "Language",
|
|
9887
10421
|
title: labels?.heading ?? "Language",
|
|
9888
|
-
children: /* @__PURE__ */ (0,
|
|
10422
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react26.Globe, { className: "h-5 w-5" })
|
|
9889
10423
|
}
|
|
9890
10424
|
),
|
|
9891
|
-
isOpen && /* @__PURE__ */ (0,
|
|
9892
|
-
typeof window !== "undefined" && (0, import_react_dom10.createPortal)(/* @__PURE__ */ (0,
|
|
10425
|
+
isOpen && /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_jsx_runtime46.Fragment, { children: [
|
|
10426
|
+
typeof window !== "undefined" && (0, import_react_dom10.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "fixed inset-0 z-[9998]", onClick: () => setIsOpen(false) }), document.body),
|
|
9893
10427
|
typeof window !== "undefined" && dropdownPosition && (0, import_react_dom10.createPortal)(
|
|
9894
|
-
/* @__PURE__ */ (0,
|
|
10428
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
|
|
9895
10429
|
"div",
|
|
9896
10430
|
{
|
|
9897
10431
|
className: "z-[9999] bg-card border border-border rounded-lg shadow-lg overflow-hidden",
|
|
9898
10432
|
style: { position: "absolute", top: dropdownPosition.top, left: dropdownPosition.left, width: dropdownPosition.width },
|
|
9899
10433
|
onMouseDown: (e) => e.stopPropagation(),
|
|
9900
10434
|
role: "menu",
|
|
9901
|
-
children: /* @__PURE__ */ (0,
|
|
9902
|
-
/* @__PURE__ */ (0,
|
|
9903
|
-
locales.map((language) => /* @__PURE__ */ (0,
|
|
10435
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "p-2", children: [
|
|
10436
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "px-3 py-2 text-sm font-medium text-muted-foreground border-b border-border mb-2", children: labels?.heading ?? "Language" }),
|
|
10437
|
+
locales.map((language) => /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
|
|
9904
10438
|
Button_default,
|
|
9905
10439
|
{
|
|
9906
10440
|
variant: "ghost",
|
|
@@ -9913,9 +10447,9 @@ function LanguageSwitcherHeadless({
|
|
|
9913
10447
|
role: "menuitemradio",
|
|
9914
10448
|
"aria-checked": currentLocale === language.code,
|
|
9915
10449
|
children: [
|
|
9916
|
-
language.flag && /* @__PURE__ */ (0,
|
|
9917
|
-
/* @__PURE__ */ (0,
|
|
9918
|
-
currentLocale === language.code && /* @__PURE__ */ (0,
|
|
10450
|
+
language.flag && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "text-lg", children: language.flag }),
|
|
10451
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "flex-1 text-left", children: language.name }),
|
|
10452
|
+
currentLocale === language.code && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "w-2 h-2 rounded-full bg-primary" })
|
|
9919
10453
|
]
|
|
9920
10454
|
},
|
|
9921
10455
|
language.code
|
|
@@ -10088,6 +10622,7 @@ function getUnderverseMessages(locale = "en") {
|
|
|
10088
10622
|
DropdownMenu,
|
|
10089
10623
|
DropdownMenuItem,
|
|
10090
10624
|
DropdownMenuSeparator,
|
|
10625
|
+
FallingIcons,
|
|
10091
10626
|
FloatingContacts,
|
|
10092
10627
|
Form,
|
|
10093
10628
|
FormActions,
|