@chekinapp/ui 0.0.46 → 0.0.47
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 +625 -655
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +6 -17
- package/dist/index.d.ts +6 -17
- package/dist/index.js +539 -568
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -160,7 +160,6 @@ __export(index_exports, {
|
|
|
160
160
|
LargeModal: () => LargeModal,
|
|
161
161
|
LearnMoreButton: () => LearnMoreButton,
|
|
162
162
|
Link: () => Link,
|
|
163
|
-
Loader: () => Loader,
|
|
164
163
|
LoadingBar: () => LoadingBar,
|
|
165
164
|
METRIC_CARD_VARIANTS: () => METRIC_CARD_VARIANTS,
|
|
166
165
|
MetricCard: () => MetricCard,
|
|
@@ -6081,49 +6080,9 @@ function ImageFullScreenView({ src, alt, onClose }) {
|
|
|
6081
6080
|
] });
|
|
6082
6081
|
}
|
|
6083
6082
|
|
|
6084
|
-
// src/
|
|
6083
|
+
// src/metric-card/MetricCard.tsx
|
|
6085
6084
|
var import_lucide_react22 = require("lucide-react");
|
|
6086
|
-
var import_react_i18next15 = require("react-i18next");
|
|
6087
6085
|
var import_jsx_runtime74 = require("react/jsx-runtime");
|
|
6088
|
-
function Loader({
|
|
6089
|
-
size = "md",
|
|
6090
|
-
text,
|
|
6091
|
-
className = "",
|
|
6092
|
-
showText = true,
|
|
6093
|
-
variant = "primary"
|
|
6094
|
-
}) {
|
|
6095
|
-
const { t } = (0, import_react_i18next15.useTranslation)();
|
|
6096
|
-
const sizeClasses3 = {
|
|
6097
|
-
sm: "h-4 w-4",
|
|
6098
|
-
md: "h-8 w-8",
|
|
6099
|
-
lg: "h-12 w-12"
|
|
6100
|
-
};
|
|
6101
|
-
const textSizeClasses = {
|
|
6102
|
-
sm: "text-xs",
|
|
6103
|
-
md: "text-sm",
|
|
6104
|
-
lg: "text-base"
|
|
6105
|
-
};
|
|
6106
|
-
const variantClasses = {
|
|
6107
|
-
primary: "text-[#4f46e5]",
|
|
6108
|
-
secondary: "text-[#475569]",
|
|
6109
|
-
ghost: "text-[#94a3b8]"
|
|
6110
|
-
};
|
|
6111
|
-
return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
|
|
6112
|
-
"div",
|
|
6113
|
-
{
|
|
6114
|
-
className: cn("flex flex-col items-center justify-center gap-2", className),
|
|
6115
|
-
role: "progressbar",
|
|
6116
|
-
children: [
|
|
6117
|
-
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: cn("animate-spin", sizeClasses3[size], variantClasses[variant]), children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_lucide_react22.Loader2, { className: "h-full w-full" }) }),
|
|
6118
|
-
showText && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("p", { className: cn(textSizeClasses[size], "font-medium text-[#475569]"), children: text || t("loading") })
|
|
6119
|
-
]
|
|
6120
|
-
}
|
|
6121
|
-
);
|
|
6122
|
-
}
|
|
6123
|
-
|
|
6124
|
-
// src/metric-card/MetricCard.tsx
|
|
6125
|
-
var import_lucide_react23 = require("lucide-react");
|
|
6126
|
-
var import_jsx_runtime75 = require("react/jsx-runtime");
|
|
6127
6086
|
var metricCardVariantClasses = {
|
|
6128
6087
|
blue: "bg-[linear-gradient(122deg,#e6f0ff_36.37%,#f6f9ff_86.4%)] text-[#385cf8] [&_[data-slot=metric-card-icon]]:bg-[#dbeafe]",
|
|
6129
6088
|
green: "bg-[linear-gradient(122deg,#ddfbf4_36.37%,#f5fefc_86.4%)] text-[#2bc29f] [&_[data-slot=metric-card-icon]]:bg-[#cff9ef]",
|
|
@@ -6141,7 +6100,7 @@ function MetricCard({
|
|
|
6141
6100
|
loading = false,
|
|
6142
6101
|
className
|
|
6143
6102
|
}) {
|
|
6144
|
-
return /* @__PURE__ */ (0,
|
|
6103
|
+
return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
|
|
6145
6104
|
"div",
|
|
6146
6105
|
{
|
|
6147
6106
|
className: cn(
|
|
@@ -6151,7 +6110,7 @@ function MetricCard({
|
|
|
6151
6110
|
className
|
|
6152
6111
|
),
|
|
6153
6112
|
children: [
|
|
6154
|
-
/* @__PURE__ */ (0,
|
|
6113
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
6155
6114
|
"div",
|
|
6156
6115
|
{
|
|
6157
6116
|
"data-slot": "metric-card-icon",
|
|
@@ -6159,22 +6118,22 @@ function MetricCard({
|
|
|
6159
6118
|
children: icon
|
|
6160
6119
|
}
|
|
6161
6120
|
),
|
|
6162
|
-
/* @__PURE__ */ (0,
|
|
6163
|
-
/* @__PURE__ */ (0,
|
|
6164
|
-
/* @__PURE__ */ (0,
|
|
6165
|
-
tooltip && /* @__PURE__ */ (0,
|
|
6121
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "flex flex-1 flex-col gap-4", children: [
|
|
6122
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "flex items-center gap-1", children: [
|
|
6123
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)("h4", { className: "whitespace-nowrap text-base font-medium leading-6 text-[var(--chekin-color-brand-navy)]", children: title }),
|
|
6124
|
+
tooltip && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(Tooltip, { side: "right", content: tooltip, contentClassName: "max-w-64", children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
|
|
6166
6125
|
"button",
|
|
6167
6126
|
{
|
|
6168
6127
|
type: "button",
|
|
6169
6128
|
className: "inline-flex text-[var(--chekin-color-gray-1)]",
|
|
6170
6129
|
"aria-label": tooltip,
|
|
6171
|
-
children: /* @__PURE__ */ (0,
|
|
6130
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_lucide_react22.CircleQuestionMark, { className: "h-4 w-4" })
|
|
6172
6131
|
}
|
|
6173
6132
|
) })
|
|
6174
6133
|
] }),
|
|
6175
|
-
/* @__PURE__ */ (0,
|
|
6176
|
-
/* @__PURE__ */ (0,
|
|
6177
|
-
!!percentage && /* @__PURE__ */ (0,
|
|
6134
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
|
|
6135
|
+
/* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "text-2xl font-bold leading-6", children: value }),
|
|
6136
|
+
!!percentage && /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
|
|
6178
6137
|
"div",
|
|
6179
6138
|
{
|
|
6180
6139
|
className: cn(
|
|
@@ -6182,7 +6141,7 @@ function MetricCard({
|
|
|
6182
6141
|
percentage < 0 && "text-[var(--chekin-color-brand-red)]"
|
|
6183
6142
|
),
|
|
6184
6143
|
children: [
|
|
6185
|
-
percentage < 0 ? /* @__PURE__ */ (0,
|
|
6144
|
+
percentage < 0 ? /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_lucide_react22.TrendingDown, {}) : /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_lucide_react22.TrendingUp, {}),
|
|
6186
6145
|
percentage,
|
|
6187
6146
|
"%"
|
|
6188
6147
|
]
|
|
@@ -6206,8 +6165,8 @@ var METRIC_CARD_VARIANTS = {
|
|
|
6206
6165
|
|
|
6207
6166
|
// src/modal/Modal.tsx
|
|
6208
6167
|
var import_react47 = require("react");
|
|
6209
|
-
var
|
|
6210
|
-
var
|
|
6168
|
+
var import_lucide_react23 = require("lucide-react");
|
|
6169
|
+
var import_jsx_runtime75 = require("react/jsx-runtime");
|
|
6211
6170
|
var preventDefault = (event) => {
|
|
6212
6171
|
event.preventDefault();
|
|
6213
6172
|
};
|
|
@@ -6239,7 +6198,7 @@ function Modal({
|
|
|
6239
6198
|
onOpenChange?.(false);
|
|
6240
6199
|
onClose?.();
|
|
6241
6200
|
};
|
|
6242
|
-
return /* @__PURE__ */ (0,
|
|
6201
|
+
return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Dialog, { open, onOpenChange, modal, children: /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(
|
|
6243
6202
|
DialogContent,
|
|
6244
6203
|
{
|
|
6245
6204
|
ref: contentRef,
|
|
@@ -6258,7 +6217,7 @@ function Modal({
|
|
|
6258
6217
|
lockScroll,
|
|
6259
6218
|
...!text && { "aria-describedby": void 0 },
|
|
6260
6219
|
children: [
|
|
6261
|
-
withCloseButton && /* @__PURE__ */ (0,
|
|
6220
|
+
withCloseButton && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
|
|
6262
6221
|
"button",
|
|
6263
6222
|
{
|
|
6264
6223
|
type: "button",
|
|
@@ -6268,14 +6227,14 @@ function Modal({
|
|
|
6268
6227
|
"absolute right-4 top-4 z-10 rounded-full p-1 text-[var(--chekin-color-brand-blue)] hover:bg-[#f4f6f8]"
|
|
6269
6228
|
),
|
|
6270
6229
|
"aria-label": "Close",
|
|
6271
|
-
children: /* @__PURE__ */ (0,
|
|
6230
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(import_lucide_react23.X, { className: "h-5 w-5" })
|
|
6272
6231
|
}
|
|
6273
6232
|
),
|
|
6274
|
-
(iconSrc || iconProps?.src) && /* @__PURE__ */ (0,
|
|
6275
|
-
title ? /* @__PURE__ */ (0,
|
|
6276
|
-
text && /* @__PURE__ */ (0,
|
|
6233
|
+
(iconSrc || iconProps?.src) && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "modal__icon mx-auto mt-4 select-none", children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("img", { src: iconSrc, alt: iconAlt ?? "", ...iconProps }) }),
|
|
6234
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DialogTitle, { className: cn("modal__title", "px-6 text-lg font-bold"), children: title }) : /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DialogVisuallyHidden, { children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DialogTitle, { children: "Dialog" }) }),
|
|
6235
|
+
text && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DialogDescription, { className: cn("modal__text", "text-base"), children: text }),
|
|
6277
6236
|
children,
|
|
6278
|
-
buttons && /* @__PURE__ */ (0,
|
|
6237
|
+
buttons && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
|
|
6279
6238
|
"div",
|
|
6280
6239
|
{
|
|
6281
6240
|
className: cn(
|
|
@@ -6290,7 +6249,7 @@ function Modal({
|
|
|
6290
6249
|
) });
|
|
6291
6250
|
}
|
|
6292
6251
|
var ModalButton = (0, import_react47.forwardRef)(
|
|
6293
|
-
({ children, size, className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
6252
|
+
({ children, size, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
|
|
6294
6253
|
Button,
|
|
6295
6254
|
{
|
|
6296
6255
|
ref,
|
|
@@ -6305,9 +6264,108 @@ ModalButton.displayName = "ModalButton";
|
|
|
6305
6264
|
Modal.displayName = "Modal";
|
|
6306
6265
|
|
|
6307
6266
|
// src/modal-loader/ModalLoader.tsx
|
|
6308
|
-
var
|
|
6267
|
+
var import_react49 = require("react");
|
|
6268
|
+
|
|
6269
|
+
// src/circular-loader/CircularLoader.tsx
|
|
6270
|
+
var import_react48 = __toESM(require("react"), 1);
|
|
6271
|
+
var import_jsx_runtime76 = require("react/jsx-runtime");
|
|
6272
|
+
var CircularLoader = import_react48.default.memo(
|
|
6273
|
+
({ visible = true, height, width, position, label, className }) => {
|
|
6274
|
+
if (!visible) return null;
|
|
6275
|
+
return /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
|
|
6276
|
+
"div",
|
|
6277
|
+
{
|
|
6278
|
+
className: cn(
|
|
6279
|
+
"main-loader flex flex-col items-center justify-center gap-2",
|
|
6280
|
+
position === "center" && "h-full",
|
|
6281
|
+
className
|
|
6282
|
+
),
|
|
6283
|
+
role: "progressbar",
|
|
6284
|
+
children: [
|
|
6285
|
+
/* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
|
|
6286
|
+
"svg",
|
|
6287
|
+
{
|
|
6288
|
+
viewBox: "25 25 50 50",
|
|
6289
|
+
className: "main-loader__svg text-[var(--circular-loader-color)]",
|
|
6290
|
+
style: {
|
|
6291
|
+
width: toCssSize(width),
|
|
6292
|
+
height: toCssSize(height)
|
|
6293
|
+
},
|
|
6294
|
+
children: [
|
|
6295
|
+
/* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
|
|
6296
|
+
"circle",
|
|
6297
|
+
{
|
|
6298
|
+
r: "20",
|
|
6299
|
+
cy: "50",
|
|
6300
|
+
cx: "50",
|
|
6301
|
+
className: "cover fill-none stroke-current opacity-5",
|
|
6302
|
+
strokeWidth: "7"
|
|
6303
|
+
}
|
|
6304
|
+
),
|
|
6305
|
+
/* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
|
|
6306
|
+
"circle",
|
|
6307
|
+
{
|
|
6308
|
+
r: "20",
|
|
6309
|
+
cy: "50",
|
|
6310
|
+
cx: "50",
|
|
6311
|
+
className: "circle fill-none stroke-current",
|
|
6312
|
+
strokeDasharray: "1 200",
|
|
6313
|
+
strokeDashoffset: "0",
|
|
6314
|
+
strokeLinecap: "round",
|
|
6315
|
+
strokeWidth: "7",
|
|
6316
|
+
children: [
|
|
6317
|
+
/* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
|
|
6318
|
+
"animateTransform",
|
|
6319
|
+
{
|
|
6320
|
+
attributeName: "transform",
|
|
6321
|
+
dur: "2.25s",
|
|
6322
|
+
from: "0 50 50",
|
|
6323
|
+
repeatCount: "indefinite",
|
|
6324
|
+
to: "360 50 50",
|
|
6325
|
+
type: "rotate"
|
|
6326
|
+
}
|
|
6327
|
+
),
|
|
6328
|
+
/* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
|
|
6329
|
+
"animate",
|
|
6330
|
+
{
|
|
6331
|
+
attributeName: "stroke-dasharray",
|
|
6332
|
+
calcMode: "spline",
|
|
6333
|
+
dur: "1.8s",
|
|
6334
|
+
keyTimes: "0;0.5;1",
|
|
6335
|
+
keySplines: "0.42 0 0.58 1;0.42 0 0.58 1",
|
|
6336
|
+
repeatCount: "indefinite",
|
|
6337
|
+
values: "1 200;90 200;90 200"
|
|
6338
|
+
}
|
|
6339
|
+
),
|
|
6340
|
+
/* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
|
|
6341
|
+
"animate",
|
|
6342
|
+
{
|
|
6343
|
+
attributeName: "stroke-dashoffset",
|
|
6344
|
+
calcMode: "spline",
|
|
6345
|
+
dur: "1.8s",
|
|
6346
|
+
keyTimes: "0;0.5;1",
|
|
6347
|
+
keySplines: "0.42 0 0.58 1;0.42 0 0.58 1",
|
|
6348
|
+
repeatCount: "indefinite",
|
|
6349
|
+
values: "0;-35;-125"
|
|
6350
|
+
}
|
|
6351
|
+
)
|
|
6352
|
+
]
|
|
6353
|
+
}
|
|
6354
|
+
)
|
|
6355
|
+
]
|
|
6356
|
+
}
|
|
6357
|
+
),
|
|
6358
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: "text-sm font-medium text-chekin-gray-1", children: label })
|
|
6359
|
+
]
|
|
6360
|
+
}
|
|
6361
|
+
);
|
|
6362
|
+
}
|
|
6363
|
+
);
|
|
6364
|
+
CircularLoader.displayName = "CircularLoader";
|
|
6365
|
+
|
|
6366
|
+
// src/modal-loader/ModalLoader.tsx
|
|
6309
6367
|
var import_jsx_runtime77 = require("react/jsx-runtime");
|
|
6310
|
-
var ModalLoader = (0,
|
|
6368
|
+
var ModalLoader = (0, import_react49.memo)(({ visible, className }) => /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
|
|
6311
6369
|
"div",
|
|
6312
6370
|
{
|
|
6313
6371
|
className: cn(
|
|
@@ -6315,23 +6373,29 @@ var ModalLoader = (0, import_react48.memo)(({ visible, className }) => /* @__PUR
|
|
|
6315
6373
|
visible ? "flex" : "hidden",
|
|
6316
6374
|
className
|
|
6317
6375
|
),
|
|
6318
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("div", { className: "mb-[60px]", children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
|
|
6376
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("div", { className: "mb-[60px]", children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
|
|
6377
|
+
CircularLoader,
|
|
6378
|
+
{
|
|
6379
|
+
width: 48,
|
|
6380
|
+
height: 48,
|
|
6381
|
+
className: "[--circular-loader-color:#475569]"
|
|
6382
|
+
}
|
|
6383
|
+
) })
|
|
6319
6384
|
}
|
|
6320
6385
|
));
|
|
6321
6386
|
ModalLoader.displayName = "ModalLoader";
|
|
6322
6387
|
|
|
6323
6388
|
// src/overlay-loader/OverlayLoader.tsx
|
|
6389
|
+
var import_react_i18next15 = require("react-i18next");
|
|
6324
6390
|
var import_jsx_runtime78 = require("react/jsx-runtime");
|
|
6325
6391
|
function OverlayLoader({
|
|
6326
6392
|
isLoading,
|
|
6327
6393
|
children,
|
|
6328
|
-
|
|
6329
|
-
loaderText,
|
|
6330
|
-
showText = true,
|
|
6331
|
-
loaderVariant = "primary",
|
|
6394
|
+
label,
|
|
6332
6395
|
className = "",
|
|
6333
6396
|
overlayClassName = ""
|
|
6334
6397
|
}) {
|
|
6398
|
+
const { t } = (0, import_react_i18next15.useTranslation)();
|
|
6335
6399
|
return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: cn("relative", className), children: [
|
|
6336
6400
|
children,
|
|
6337
6401
|
isLoading && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
|
|
@@ -6341,15 +6405,7 @@ function OverlayLoader({
|
|
|
6341
6405
|
"absolute inset-0 flex items-center justify-center bg-[rgb(255_255_255_/_0.6)]",
|
|
6342
6406
|
overlayClassName
|
|
6343
6407
|
),
|
|
6344
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
|
|
6345
|
-
Loader,
|
|
6346
|
-
{
|
|
6347
|
-
size: loaderSize,
|
|
6348
|
-
text: loaderText,
|
|
6349
|
-
showText,
|
|
6350
|
-
variant: loaderVariant
|
|
6351
|
-
}
|
|
6352
|
-
)
|
|
6408
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(CircularLoader, { width: 48, height: 48, label: label || t("loading") })
|
|
6353
6409
|
}
|
|
6354
6410
|
)
|
|
6355
6411
|
] });
|
|
@@ -6358,14 +6414,14 @@ function OverlayLoader({
|
|
|
6358
6414
|
// src/page-loader/PageLoader.tsx
|
|
6359
6415
|
var import_react_i18next16 = require("react-i18next");
|
|
6360
6416
|
var import_jsx_runtime79 = require("react/jsx-runtime");
|
|
6361
|
-
function PageLoader({ className, description,
|
|
6417
|
+
function PageLoader({ className, description, label }) {
|
|
6362
6418
|
const { t } = (0, import_react_i18next16.useTranslation)();
|
|
6363
6419
|
return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
6364
6420
|
"div",
|
|
6365
6421
|
{
|
|
6366
6422
|
className: cn("flex min-h-[300px] flex-col items-center justify-center", className),
|
|
6367
6423
|
children: /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "flex flex-col items-center rounded-lg border border-[var(--chekin-color-gray-3)] bg-[rgb(255_255_255_/_0.8)] p-8 shadow-sm backdrop-blur-sm", children: [
|
|
6368
|
-
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
6424
|
+
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)(CircularLoader, { width: 48, height: 48, label: label || t("loading") }),
|
|
6369
6425
|
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)("p", { className: "mt-4 max-w-xs text-center text-sm text-[var(--chekin-color-gray-1)]", children: description || t("loading_data_description") })
|
|
6370
6426
|
] })
|
|
6371
6427
|
}
|
|
@@ -6374,15 +6430,15 @@ function PageLoader({ className, description, ...props }) {
|
|
|
6374
6430
|
|
|
6375
6431
|
// src/pagination/Pagination.tsx
|
|
6376
6432
|
var import_react_i18next17 = require("react-i18next");
|
|
6377
|
-
var
|
|
6433
|
+
var import_lucide_react26 = require("lucide-react");
|
|
6378
6434
|
|
|
6379
6435
|
// src/select/Select.tsx
|
|
6380
|
-
var
|
|
6436
|
+
var import_react50 = require("react");
|
|
6381
6437
|
|
|
6382
6438
|
// src/select/components.tsx
|
|
6383
|
-
var
|
|
6439
|
+
var React22 = __toESM(require("react"), 1);
|
|
6384
6440
|
var SelectPrimitive = __toESM(require("@radix-ui/react-select"), 1);
|
|
6385
|
-
var
|
|
6441
|
+
var import_lucide_react24 = require("lucide-react");
|
|
6386
6442
|
var import_jsx_runtime80 = require("react/jsx-runtime");
|
|
6387
6443
|
var SelectRoot = SelectPrimitive.Root;
|
|
6388
6444
|
var SelectGroup = SelectPrimitive.Group;
|
|
@@ -6392,7 +6448,7 @@ var selectSizeClassNames = {
|
|
|
6392
6448
|
sm: "text-sm",
|
|
6393
6449
|
md: "text-base"
|
|
6394
6450
|
};
|
|
6395
|
-
var SelectTrigger =
|
|
6451
|
+
var SelectTrigger = React22.forwardRef(({ className, children, size = "sm", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
|
|
6396
6452
|
SelectPrimitive.Trigger,
|
|
6397
6453
|
{
|
|
6398
6454
|
ref,
|
|
@@ -6408,7 +6464,7 @@ var SelectTrigger = React21.forwardRef(({ className, children, size = "sm", ...p
|
|
|
6408
6464
|
children: [
|
|
6409
6465
|
children,
|
|
6410
6466
|
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
6411
|
-
|
|
6467
|
+
import_lucide_react24.ChevronDownIcon,
|
|
6412
6468
|
{
|
|
6413
6469
|
size: 16,
|
|
6414
6470
|
strokeWidth: 2,
|
|
@@ -6419,27 +6475,27 @@ var SelectTrigger = React21.forwardRef(({ className, children, size = "sm", ...p
|
|
|
6419
6475
|
}
|
|
6420
6476
|
));
|
|
6421
6477
|
SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
|
|
6422
|
-
var SelectScrollUpButton =
|
|
6478
|
+
var SelectScrollUpButton = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
6423
6479
|
SelectPrimitive.ScrollUpButton,
|
|
6424
6480
|
{
|
|
6425
6481
|
ref,
|
|
6426
6482
|
className: cn("flex cursor-default items-center justify-center py-1", className),
|
|
6427
6483
|
...props,
|
|
6428
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
6484
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_lucide_react24.ChevronUpIcon, { size: 16, strokeWidth: 2 })
|
|
6429
6485
|
}
|
|
6430
6486
|
));
|
|
6431
6487
|
SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
|
|
6432
|
-
var SelectScrollDownButton =
|
|
6488
|
+
var SelectScrollDownButton = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
6433
6489
|
SelectPrimitive.ScrollDownButton,
|
|
6434
6490
|
{
|
|
6435
6491
|
ref,
|
|
6436
6492
|
className: cn("flex cursor-default items-center justify-center py-1", className),
|
|
6437
6493
|
...props,
|
|
6438
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
6494
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_lucide_react24.ChevronDownIcon, { size: 16, strokeWidth: 2 })
|
|
6439
6495
|
}
|
|
6440
6496
|
));
|
|
6441
6497
|
SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
|
|
6442
|
-
var SelectContent =
|
|
6498
|
+
var SelectContent = React22.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SelectPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
|
|
6443
6499
|
SelectPrimitive.Content,
|
|
6444
6500
|
{
|
|
6445
6501
|
ref,
|
|
@@ -6473,7 +6529,7 @@ var SelectContent = React21.forwardRef(({ className, children, position = "poppe
|
|
|
6473
6529
|
}
|
|
6474
6530
|
) }));
|
|
6475
6531
|
SelectContent.displayName = SelectPrimitive.Content.displayName;
|
|
6476
|
-
var SelectLabel =
|
|
6532
|
+
var SelectLabel = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
6477
6533
|
SelectPrimitive.Label,
|
|
6478
6534
|
{
|
|
6479
6535
|
ref,
|
|
@@ -6485,7 +6541,7 @@ var SelectLabel = React21.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
6485
6541
|
}
|
|
6486
6542
|
));
|
|
6487
6543
|
SelectLabel.displayName = SelectPrimitive.Label.displayName;
|
|
6488
|
-
var SelectItem =
|
|
6544
|
+
var SelectItem = React22.forwardRef(({ className, children, size = "sm", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
|
|
6489
6545
|
SelectPrimitive.Item,
|
|
6490
6546
|
{
|
|
6491
6547
|
ref,
|
|
@@ -6499,13 +6555,13 @@ var SelectItem = React21.forwardRef(({ className, children, size = "sm", ...prop
|
|
|
6499
6555
|
),
|
|
6500
6556
|
...props,
|
|
6501
6557
|
children: [
|
|
6502
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: "absolute start-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
6558
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: "absolute start-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_lucide_react24.CheckIcon, { size: 16, strokeWidth: 2 }) }) }),
|
|
6503
6559
|
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SelectPrimitive.ItemText, { children })
|
|
6504
6560
|
]
|
|
6505
6561
|
}
|
|
6506
6562
|
));
|
|
6507
6563
|
SelectItem.displayName = SelectPrimitive.Item.displayName;
|
|
6508
|
-
var SelectSeparator =
|
|
6564
|
+
var SelectSeparator = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
6509
6565
|
SelectPrimitive.Separator,
|
|
6510
6566
|
{
|
|
6511
6567
|
ref,
|
|
@@ -6533,8 +6589,8 @@ var SelectInner = ({
|
|
|
6533
6589
|
onValueChange,
|
|
6534
6590
|
disabled
|
|
6535
6591
|
}, ref) => {
|
|
6536
|
-
const id = (0,
|
|
6537
|
-
const [isOpen, setIsOpen] = (0,
|
|
6592
|
+
const id = (0, import_react50.useId)();
|
|
6593
|
+
const [isOpen, setIsOpen] = (0, import_react50.useState)(false);
|
|
6538
6594
|
const hasValue = Boolean(value);
|
|
6539
6595
|
const showLabel = hasValue || isOpen;
|
|
6540
6596
|
const handleValueChange = (newValue) => {
|
|
@@ -6581,14 +6637,14 @@ var SelectInner = ({
|
|
|
6581
6637
|
] })
|
|
6582
6638
|
] });
|
|
6583
6639
|
};
|
|
6584
|
-
var SelectForward = (0,
|
|
6640
|
+
var SelectForward = (0, import_react50.forwardRef)(SelectInner);
|
|
6585
6641
|
SelectForward.displayName = "Select";
|
|
6586
6642
|
var Select = SelectForward;
|
|
6587
6643
|
|
|
6588
6644
|
// src/select/MultiSelect.tsx
|
|
6589
6645
|
var SelectPrimitive2 = __toESM(require("@radix-ui/react-select"), 1);
|
|
6590
|
-
var
|
|
6591
|
-
var
|
|
6646
|
+
var import_lucide_react25 = require("lucide-react");
|
|
6647
|
+
var import_react51 = require("react");
|
|
6592
6648
|
var import_jsx_runtime82 = require("react/jsx-runtime");
|
|
6593
6649
|
var MultiSelectInner = ({
|
|
6594
6650
|
label,
|
|
@@ -6599,8 +6655,8 @@ var MultiSelectInner = ({
|
|
|
6599
6655
|
placeholder,
|
|
6600
6656
|
disabled
|
|
6601
6657
|
}, ref) => {
|
|
6602
|
-
const id = (0,
|
|
6603
|
-
const [open, setOpen] = (0,
|
|
6658
|
+
const id = (0, import_react51.useId)();
|
|
6659
|
+
const [open, setOpen] = (0, import_react51.useState)(false);
|
|
6604
6660
|
const hasValue = value.length > 0;
|
|
6605
6661
|
const showLabel = hasValue || open;
|
|
6606
6662
|
const handleSelect = (selectedValue) => {
|
|
@@ -6652,7 +6708,7 @@ var MultiSelectInner = ({
|
|
|
6652
6708
|
selected && "bg-[#f9fafb]"
|
|
6653
6709
|
),
|
|
6654
6710
|
children: [
|
|
6655
|
-
/* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "absolute start-2 flex size-3.5 items-center justify-center", children: selected && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
|
|
6711
|
+
/* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "absolute start-2 flex size-3.5 items-center justify-center", children: selected && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(import_lucide_react25.CheckIcon, { size: 16, strokeWidth: 2 }) }),
|
|
6656
6712
|
/* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { children: optionLabel })
|
|
6657
6713
|
]
|
|
6658
6714
|
},
|
|
@@ -6664,11 +6720,11 @@ var MultiSelectInner = ({
|
|
|
6664
6720
|
)
|
|
6665
6721
|
] });
|
|
6666
6722
|
};
|
|
6667
|
-
var MultiSelect = (0,
|
|
6723
|
+
var MultiSelect = (0, import_react51.forwardRef)(MultiSelectInner);
|
|
6668
6724
|
|
|
6669
6725
|
// src/select/InfinitySelect.tsx
|
|
6670
6726
|
var import_react_virtual = require("@tanstack/react-virtual");
|
|
6671
|
-
var
|
|
6727
|
+
var import_react52 = require("react");
|
|
6672
6728
|
var import_jsx_runtime83 = require("react/jsx-runtime");
|
|
6673
6729
|
function InfinitySelect({
|
|
6674
6730
|
label,
|
|
@@ -6683,22 +6739,22 @@ function InfinitySelect({
|
|
|
6683
6739
|
itemHeight = 35,
|
|
6684
6740
|
maxHeight = 300
|
|
6685
6741
|
}) {
|
|
6686
|
-
const id = (0,
|
|
6687
|
-
const parentRef = (0,
|
|
6688
|
-
const [isOpen, setIsOpen] = (0,
|
|
6742
|
+
const id = (0, import_react52.useId)();
|
|
6743
|
+
const parentRef = (0, import_react52.useRef)(null);
|
|
6744
|
+
const [isOpen, setIsOpen] = (0, import_react52.useState)(false);
|
|
6689
6745
|
const virtualizer = (0, import_react_virtual.useVirtualizer)({
|
|
6690
6746
|
count: hasNextPage ? options.length + 1 : options.length,
|
|
6691
6747
|
getScrollElement: () => parentRef.current,
|
|
6692
6748
|
estimateSize: () => itemHeight,
|
|
6693
6749
|
overscan: 5
|
|
6694
6750
|
});
|
|
6695
|
-
const loadMore = (0,
|
|
6751
|
+
const loadMore = (0, import_react52.useCallback)(() => {
|
|
6696
6752
|
if (hasNextPage && !isFetchingNextPage) {
|
|
6697
6753
|
fetchNextPage();
|
|
6698
6754
|
}
|
|
6699
6755
|
}, [fetchNextPage, hasNextPage, isFetchingNextPage]);
|
|
6700
6756
|
const virtualItems = virtualizer.getVirtualItems();
|
|
6701
|
-
(0,
|
|
6757
|
+
(0, import_react52.useEffect)(() => {
|
|
6702
6758
|
if (!virtualItems.length) return;
|
|
6703
6759
|
const lastItem = virtualItems[virtualItems.length - 1];
|
|
6704
6760
|
if (lastItem && lastItem.index >= options.length - 5 && hasNextPage && !isFetchingNextPage) {
|
|
@@ -6857,7 +6913,7 @@ function Pagination({
|
|
|
6857
6913
|
disabled: !canGoPrevious,
|
|
6858
6914
|
children: [
|
|
6859
6915
|
/* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "sr-only", children: t("go_to_first_page") }),
|
|
6860
|
-
/* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
|
|
6916
|
+
/* @__PURE__ */ (0, import_jsx_runtime84.jsx)(import_lucide_react26.ChevronsLeft, {})
|
|
6861
6917
|
]
|
|
6862
6918
|
}
|
|
6863
6919
|
),
|
|
@@ -6873,7 +6929,7 @@ function Pagination({
|
|
|
6873
6929
|
disabled: !canGoPrevious,
|
|
6874
6930
|
children: [
|
|
6875
6931
|
/* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "sr-only", children: t("go_to_previous_page") }),
|
|
6876
|
-
/* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
|
|
6932
|
+
/* @__PURE__ */ (0, import_jsx_runtime84.jsx)(import_lucide_react26.ChevronLeft, {})
|
|
6877
6933
|
]
|
|
6878
6934
|
}
|
|
6879
6935
|
),
|
|
@@ -6889,7 +6945,7 @@ function Pagination({
|
|
|
6889
6945
|
disabled: !canGoNext,
|
|
6890
6946
|
children: [
|
|
6891
6947
|
/* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "sr-only", children: t("go_to_next_page") }),
|
|
6892
|
-
/* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
|
|
6948
|
+
/* @__PURE__ */ (0, import_jsx_runtime84.jsx)(import_lucide_react26.ChevronRight, {})
|
|
6893
6949
|
]
|
|
6894
6950
|
}
|
|
6895
6951
|
),
|
|
@@ -6903,7 +6959,7 @@ function Pagination({
|
|
|
6903
6959
|
disabled: !canGoNext,
|
|
6904
6960
|
children: [
|
|
6905
6961
|
/* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "sr-only", children: t("go_to_last_page") }),
|
|
6906
|
-
/* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
|
|
6962
|
+
/* @__PURE__ */ (0, import_jsx_runtime84.jsx)(import_lucide_react26.ChevronsRight, {})
|
|
6907
6963
|
]
|
|
6908
6964
|
}
|
|
6909
6965
|
)
|
|
@@ -6915,7 +6971,7 @@ function Pagination({
|
|
|
6915
6971
|
}
|
|
6916
6972
|
|
|
6917
6973
|
// src/popover/Popover.tsx
|
|
6918
|
-
var
|
|
6974
|
+
var React23 = __toESM(require("react"), 1);
|
|
6919
6975
|
var RadixPopover = __toESM(require("@radix-ui/react-popover"), 1);
|
|
6920
6976
|
var import_jsx_runtime85 = require("react/jsx-runtime");
|
|
6921
6977
|
var Popover = RadixPopover.Root;
|
|
@@ -6923,7 +6979,7 @@ var PopoverTrigger = RadixPopover.Trigger;
|
|
|
6923
6979
|
var PopoverAnchor = RadixPopover.Anchor;
|
|
6924
6980
|
var PopoverPortal = RadixPopover.Portal;
|
|
6925
6981
|
var PopoverClose = RadixPopover.Close;
|
|
6926
|
-
var PopoverContent =
|
|
6982
|
+
var PopoverContent = React23.forwardRef(({ className, sideOffset = 4, align = "center", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(RadixPopover.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
|
|
6927
6983
|
RadixPopover.Content,
|
|
6928
6984
|
{
|
|
6929
6985
|
ref,
|
|
@@ -7010,14 +7066,14 @@ function PopoverWithTooltip({
|
|
|
7010
7066
|
}
|
|
7011
7067
|
|
|
7012
7068
|
// src/radio/Radio.tsx
|
|
7013
|
-
var
|
|
7069
|
+
var import_react54 = require("react");
|
|
7014
7070
|
|
|
7015
7071
|
// src/radio-group/RadioGroup.tsx
|
|
7016
|
-
var
|
|
7072
|
+
var React24 = __toESM(require("react"), 1);
|
|
7017
7073
|
var RadioGroupPrimitive = __toESM(require("@radix-ui/react-radio-group"), 1);
|
|
7018
|
-
var
|
|
7074
|
+
var import_lucide_react27 = require("lucide-react");
|
|
7019
7075
|
var import_jsx_runtime87 = require("react/jsx-runtime");
|
|
7020
|
-
var RadioGroup2 =
|
|
7076
|
+
var RadioGroup2 = React24.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
|
|
7021
7077
|
RadioGroupPrimitive.Root,
|
|
7022
7078
|
{
|
|
7023
7079
|
ref,
|
|
@@ -7026,7 +7082,7 @@ var RadioGroup2 = React23.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
7026
7082
|
}
|
|
7027
7083
|
));
|
|
7028
7084
|
RadioGroup2.displayName = RadioGroupPrimitive.Root.displayName;
|
|
7029
|
-
var RadioGroupItem =
|
|
7085
|
+
var RadioGroupItem = React24.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
|
|
7030
7086
|
RadioGroupPrimitive.Item,
|
|
7031
7087
|
{
|
|
7032
7088
|
ref,
|
|
@@ -7037,17 +7093,17 @@ var RadioGroupItem = React23.forwardRef(({ className, ...props }, ref) => /* @__
|
|
|
7037
7093
|
className
|
|
7038
7094
|
),
|
|
7039
7095
|
...props,
|
|
7040
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
|
|
7096
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(import_lucide_react27.Circle, { className: "h-2.5 w-2.5 fill-current text-current" }) })
|
|
7041
7097
|
}
|
|
7042
7098
|
));
|
|
7043
7099
|
RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
|
|
7044
7100
|
|
|
7045
7101
|
// src/radio/useRadioOptions.ts
|
|
7046
|
-
var
|
|
7102
|
+
var import_react53 = require("react");
|
|
7047
7103
|
function useRadioOptions({ options, defaultValue, onChange }) {
|
|
7048
7104
|
const initialValue = (typeof defaultValue === "string" ? options.find((option) => option.value === defaultValue) : defaultValue) || "";
|
|
7049
|
-
const [selectedValue, setSelectedValue] = (0,
|
|
7050
|
-
const handleValueChange = (0,
|
|
7105
|
+
const [selectedValue, setSelectedValue] = (0, import_react53.useState)(initialValue);
|
|
7106
|
+
const handleValueChange = (0, import_react53.useCallback)(
|
|
7051
7107
|
(value) => {
|
|
7052
7108
|
setSelectedValue(value);
|
|
7053
7109
|
const selectedOption = options.find((option) => option.value === value) || "";
|
|
@@ -7065,7 +7121,7 @@ function useRadioOptions({ options, defaultValue, onChange }) {
|
|
|
7065
7121
|
|
|
7066
7122
|
// src/radio/Radio.tsx
|
|
7067
7123
|
var import_jsx_runtime88 = require("react/jsx-runtime");
|
|
7068
|
-
var Radio = (0,
|
|
7124
|
+
var Radio = (0, import_react54.forwardRef)(
|
|
7069
7125
|
({ options, value, onChange, error, className = "", disabled = false, renderOption }, ref) => {
|
|
7070
7126
|
const { selectedValue, handleValueChange } = useRadioOptions({
|
|
7071
7127
|
options,
|
|
@@ -7204,7 +7260,7 @@ function RatingProgress({
|
|
|
7204
7260
|
}
|
|
7205
7261
|
|
|
7206
7262
|
// src/rating-radio-group/RatingRadioGroup.tsx
|
|
7207
|
-
var
|
|
7263
|
+
var import_lucide_react28 = require("lucide-react");
|
|
7208
7264
|
var import_jsx_runtime91 = require("react/jsx-runtime");
|
|
7209
7265
|
var getStarColor = (optionValue) => (value) => {
|
|
7210
7266
|
if (value >= optionValue) return "#facc15";
|
|
@@ -7233,7 +7289,7 @@ function RatingRadioGroup({
|
|
|
7233
7289
|
}
|
|
7234
7290
|
),
|
|
7235
7291
|
/* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
|
|
7236
|
-
|
|
7292
|
+
import_lucide_react28.Star,
|
|
7237
7293
|
{
|
|
7238
7294
|
className: "cursor-pointer rounded peer-focus-visible:outline peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2 peer-focus-visible:outline-[#385bf8]",
|
|
7239
7295
|
size: 24,
|
|
@@ -7247,8 +7303,8 @@ function RatingRadioGroup({
|
|
|
7247
7303
|
}
|
|
7248
7304
|
|
|
7249
7305
|
// src/rating-stars/RatingStars.tsx
|
|
7250
|
-
var
|
|
7251
|
-
var
|
|
7306
|
+
var React25 = __toESM(require("react"), 1);
|
|
7307
|
+
var import_lucide_react29 = require("lucide-react");
|
|
7252
7308
|
var import_react_i18next18 = require("react-i18next");
|
|
7253
7309
|
var import_jsx_runtime92 = require("react/jsx-runtime");
|
|
7254
7310
|
function RatingStars({
|
|
@@ -7267,7 +7323,7 @@ function RatingStars({
|
|
|
7267
7323
|
const { t } = (0, import_react_i18next18.useTranslation)();
|
|
7268
7324
|
const normalizedRating = Math.max(0, Math.min(maxRating, rating));
|
|
7269
7325
|
const stars = Array.from({ length: maxRating }, (_, index) => index + 1);
|
|
7270
|
-
const componentId =
|
|
7326
|
+
const componentId = React25.useId();
|
|
7271
7327
|
const decimal = normalizedRating - Math.floor(normalizedRating);
|
|
7272
7328
|
const partialStarIndex = decimal > 0 ? Math.ceil(normalizedRating) : -1;
|
|
7273
7329
|
const gradientId = `star-gradient-${componentId.replace(/:/g, "")}`;
|
|
@@ -7292,7 +7348,7 @@ function RatingStars({
|
|
|
7292
7348
|
/* @__PURE__ */ (0, import_jsx_runtime92.jsx)("stop", { offset: `${decimal * 100}%`, stopColor: emptyColor })
|
|
7293
7349
|
] }) }) }),
|
|
7294
7350
|
stars.map((star) => /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
|
|
7295
|
-
|
|
7351
|
+
import_lucide_react29.Star,
|
|
7296
7352
|
{
|
|
7297
7353
|
size,
|
|
7298
7354
|
className: cn("shrink-0", starClassName),
|
|
@@ -7315,11 +7371,11 @@ function RatingStars({
|
|
|
7315
7371
|
}
|
|
7316
7372
|
|
|
7317
7373
|
// src/rotate-icon/RotateIcon.tsx
|
|
7318
|
-
var
|
|
7374
|
+
var import_lucide_react30 = require("lucide-react");
|
|
7319
7375
|
var import_jsx_runtime93 = require("react/jsx-runtime");
|
|
7320
7376
|
function RotateIcon({ active, className }) {
|
|
7321
7377
|
return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
|
|
7322
|
-
|
|
7378
|
+
import_lucide_react30.ChevronUp,
|
|
7323
7379
|
{
|
|
7324
7380
|
className: cn(
|
|
7325
7381
|
"h-4 w-4 transition-transform",
|
|
@@ -7331,7 +7387,7 @@ function RotateIcon({ active, className }) {
|
|
|
7331
7387
|
}
|
|
7332
7388
|
|
|
7333
7389
|
// src/search-button/SearchButton.tsx
|
|
7334
|
-
var
|
|
7390
|
+
var import_lucide_react31 = require("lucide-react");
|
|
7335
7391
|
var import_jsx_runtime94 = require("react/jsx-runtime");
|
|
7336
7392
|
function SearchButton({ onClick, className, icon, ariaLabel }) {
|
|
7337
7393
|
return /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
|
|
@@ -7342,13 +7398,13 @@ function SearchButton({ onClick, className, icon, ariaLabel }) {
|
|
|
7342
7398
|
"data-testid": "search-button",
|
|
7343
7399
|
"aria-label": ariaLabel,
|
|
7344
7400
|
type: "button",
|
|
7345
|
-
children: icon || /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
|
|
7401
|
+
children: icon || /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react31.Search, { size: 12, strokeWidth: 4, className: "text-[var(--chekin-color-gray-1)]" })
|
|
7346
7402
|
}
|
|
7347
7403
|
);
|
|
7348
7404
|
}
|
|
7349
7405
|
|
|
7350
7406
|
// src/search-input/SearchInput.tsx
|
|
7351
|
-
var
|
|
7407
|
+
var import_lucide_react32 = require("lucide-react");
|
|
7352
7408
|
var import_react_i18next19 = require("react-i18next");
|
|
7353
7409
|
var import_jsx_runtime95 = require("react/jsx-runtime");
|
|
7354
7410
|
function SearchInput({
|
|
@@ -7376,7 +7432,7 @@ function SearchInput({
|
|
|
7376
7432
|
tooltip && /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(HelpTooltip, { content: tooltip, side: "top", size: 16 })
|
|
7377
7433
|
] }),
|
|
7378
7434
|
/* @__PURE__ */ (0, import_jsx_runtime95.jsxs)("div", { className: "relative", children: [
|
|
7379
|
-
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
|
|
7435
|
+
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)(import_lucide_react32.Search, { className: "absolute left-4 top-1/2 h-5 w-5 -translate-y-1/2 text-[var(--chekin-color-gray-2)]" }),
|
|
7380
7436
|
/* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
|
|
7381
7437
|
Input,
|
|
7382
7438
|
{
|
|
@@ -7397,7 +7453,7 @@ function SearchInput({
|
|
|
7397
7453
|
),
|
|
7398
7454
|
(loading || onReset) && /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)("div", { className: "absolute right-2 top-1/2 flex -translate-y-1/2 items-center gap-1", children: [
|
|
7399
7455
|
loading && /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
|
|
7400
|
-
|
|
7456
|
+
import_lucide_react32.Loader2,
|
|
7401
7457
|
{
|
|
7402
7458
|
"aria-hidden": "true",
|
|
7403
7459
|
className: "h-5 w-5 animate-spin text-[var(--chekin-color-gray-2)]"
|
|
@@ -7411,7 +7467,7 @@ function SearchInput({
|
|
|
7411
7467
|
disabled: isBlocked,
|
|
7412
7468
|
className: "h-7 w-7 p-0 text-[var(--chekin-color-gray-2)]",
|
|
7413
7469
|
"aria-label": t("reset_search"),
|
|
7414
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
|
|
7470
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(import_lucide_react32.X, { className: "h-5 w-5" })
|
|
7415
7471
|
}
|
|
7416
7472
|
)
|
|
7417
7473
|
] })
|
|
@@ -7450,8 +7506,9 @@ var SectionTagColors = /* @__PURE__ */ ((SectionTagColors2) => {
|
|
|
7450
7506
|
})(SectionTagColors || {});
|
|
7451
7507
|
|
|
7452
7508
|
// src/section/Section.tsx
|
|
7453
|
-
var
|
|
7454
|
-
var
|
|
7509
|
+
var import_react55 = require("react");
|
|
7510
|
+
var import_lucide_react33 = require("lucide-react");
|
|
7511
|
+
var import_react_i18next20 = require("react-i18next");
|
|
7455
7512
|
|
|
7456
7513
|
// src/section/constants.ts
|
|
7457
7514
|
var SubSectionSize = /* @__PURE__ */ ((SubSectionSize2) => {
|
|
@@ -7470,11 +7527,11 @@ function TooltipInfo({ content, className }) {
|
|
|
7470
7527
|
className: cn("inline-flex text-[var(--chekin-color-gray-1)]", className),
|
|
7471
7528
|
onClick: (event) => event.stopPropagation(),
|
|
7472
7529
|
"aria-label": typeof content === "string" ? content : "More information",
|
|
7473
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
|
|
7530
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react33.CircleHelp, { className: "h-4 w-4" })
|
|
7474
7531
|
}
|
|
7475
7532
|
) });
|
|
7476
7533
|
}
|
|
7477
|
-
var Section = (0,
|
|
7534
|
+
var Section = (0, import_react55.forwardRef)(
|
|
7478
7535
|
({
|
|
7479
7536
|
children,
|
|
7480
7537
|
title,
|
|
@@ -7488,45 +7545,56 @@ var Section = (0, import_react54.forwardRef)(
|
|
|
7488
7545
|
linkContent,
|
|
7489
7546
|
hidden,
|
|
7490
7547
|
size
|
|
7491
|
-
}, ref) =>
|
|
7492
|
-
|
|
7493
|
-
|
|
7494
|
-
|
|
7495
|
-
|
|
7496
|
-
|
|
7497
|
-
|
|
7498
|
-
|
|
7499
|
-
|
|
7500
|
-
|
|
7501
|
-
|
|
7502
|
-
|
|
7503
|
-
|
|
7504
|
-
|
|
7505
|
-
|
|
7548
|
+
}, ref) => {
|
|
7549
|
+
const { t } = (0, import_react_i18next20.useTranslation)();
|
|
7550
|
+
return /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(
|
|
7551
|
+
"div",
|
|
7552
|
+
{
|
|
7553
|
+
ref,
|
|
7554
|
+
className: cn(
|
|
7555
|
+
"mb-6 box-border flex w-full cursor-default flex-col gap-6 rounded-lg border border-solid border-[var(--chekin-color-gray-3)] bg-white px-6 py-10",
|
|
7556
|
+
loading && "cursor-progress",
|
|
7557
|
+
disabled && "pointer-events-none opacity-50",
|
|
7558
|
+
{ "!hidden": hidden },
|
|
7559
|
+
className
|
|
7560
|
+
),
|
|
7561
|
+
children: [
|
|
7562
|
+
(title || subtitle) && /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex flex-col gap-2", children: [
|
|
7563
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(
|
|
7564
|
+
"div",
|
|
7565
|
+
{
|
|
7566
|
+
className: cn(
|
|
7567
|
+
"flex max-w-[85%] items-center text-lg font-bold text-[var(--chekin-color-brand-navy)] md:max-w-full",
|
|
7568
|
+
size !== 0 /* L */ && "subsection-title"
|
|
7569
|
+
),
|
|
7570
|
+
children: [
|
|
7571
|
+
title,
|
|
7572
|
+
titleTooltip && /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "ml-2.5", children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(TooltipInfo, { content: titleTooltip }) }),
|
|
7573
|
+
linkContent && /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "ml-6 text-sm font-semibold text-[var(--chekin-color-brand-blue)] no-underline hover:opacity-70 active:opacity-100", children: linkContent })
|
|
7574
|
+
]
|
|
7575
|
+
}
|
|
7576
|
+
),
|
|
7577
|
+
subtitle && /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "w-full max-w-[720px] md:max-w-full", children: [
|
|
7578
|
+
/* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "inline text-base font-normal text-[var(--chekin-color-gray-1)]", children: subtitle }),
|
|
7579
|
+
subtitleTooltip && /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "ml-1.5 inline-block align-text-top", children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(TooltipInfo, { content: subtitleTooltip }) })
|
|
7580
|
+
] })
|
|
7581
|
+
] }),
|
|
7582
|
+
loading && showLoader ? /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
|
|
7583
|
+
CircularLoader,
|
|
7506
7584
|
{
|
|
7507
|
-
|
|
7508
|
-
|
|
7509
|
-
|
|
7510
|
-
|
|
7511
|
-
children: [
|
|
7512
|
-
title,
|
|
7513
|
-
titleTooltip && /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "ml-2.5", children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(TooltipInfo, { content: titleTooltip }) }),
|
|
7514
|
-
linkContent && /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "ml-6 text-sm font-semibold text-[var(--chekin-color-brand-blue)] no-underline hover:opacity-70 active:opacity-100", children: linkContent })
|
|
7515
|
-
]
|
|
7585
|
+
width: 32,
|
|
7586
|
+
height: 32,
|
|
7587
|
+
label: t("loading"),
|
|
7588
|
+
className: "mx-auto mb-3 mt-2.5"
|
|
7516
7589
|
}
|
|
7517
|
-
)
|
|
7518
|
-
|
|
7519
|
-
|
|
7520
|
-
|
|
7521
|
-
|
|
7522
|
-
] }),
|
|
7523
|
-
loading && showLoader ? /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(Loader, { className: "mx-auto mb-3 mt-2.5" }) : children
|
|
7524
|
-
]
|
|
7525
|
-
}
|
|
7526
|
-
)
|
|
7590
|
+
) : children
|
|
7591
|
+
]
|
|
7592
|
+
}
|
|
7593
|
+
);
|
|
7594
|
+
}
|
|
7527
7595
|
);
|
|
7528
7596
|
Section.displayName = "Section";
|
|
7529
|
-
var SubSection = (0,
|
|
7597
|
+
var SubSection = (0, import_react55.forwardRef)(
|
|
7530
7598
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
|
|
7531
7599
|
Section,
|
|
7532
7600
|
{
|
|
@@ -7540,7 +7608,7 @@ var SubSection = (0, import_react54.forwardRef)(
|
|
|
7540
7608
|
)
|
|
7541
7609
|
);
|
|
7542
7610
|
SubSection.displayName = "SubSection";
|
|
7543
|
-
var DividingSubsection = (0,
|
|
7611
|
+
var DividingSubsection = (0, import_react55.forwardRef)(
|
|
7544
7612
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
|
|
7545
7613
|
SubSection,
|
|
7546
7614
|
{
|
|
@@ -7553,7 +7621,7 @@ var DividingSubsection = (0, import_react54.forwardRef)(
|
|
|
7553
7621
|
DividingSubsection.displayName = "DividingSubsection";
|
|
7554
7622
|
|
|
7555
7623
|
// src/selectors/Selectors.tsx
|
|
7556
|
-
var
|
|
7624
|
+
var import_react56 = require("react");
|
|
7557
7625
|
|
|
7558
7626
|
// src/selector-button/SelectorButton.tsx
|
|
7559
7627
|
var import_jsx_runtime98 = require("react/jsx-runtime");
|
|
@@ -7622,8 +7690,8 @@ var getValueArray = (value) => {
|
|
|
7622
7690
|
return [];
|
|
7623
7691
|
};
|
|
7624
7692
|
function getSelectorContent(label, disabled, readOnly, active) {
|
|
7625
|
-
if ((0,
|
|
7626
|
-
return (0,
|
|
7693
|
+
if ((0, import_react56.isValidElement)(label)) {
|
|
7694
|
+
return (0, import_react56.cloneElement)(label, {
|
|
7627
7695
|
disabled,
|
|
7628
7696
|
readOnly,
|
|
7629
7697
|
active
|
|
@@ -7668,7 +7736,7 @@ function SelectorsInternal({
|
|
|
7668
7736
|
}
|
|
7669
7737
|
};
|
|
7670
7738
|
const isAnyActive = getValueArray(value).length > 0;
|
|
7671
|
-
(0,
|
|
7739
|
+
(0, import_react56.useEffect)(() => {
|
|
7672
7740
|
onAnySelectorActive?.(isAnyActive);
|
|
7673
7741
|
}, [isAnyActive, onAnySelectorActive]);
|
|
7674
7742
|
return /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(import_jsx_runtime99.Fragment, { children: [
|
|
@@ -7713,7 +7781,7 @@ function SelectorsInternal({
|
|
|
7713
7781
|
)
|
|
7714
7782
|
] });
|
|
7715
7783
|
}
|
|
7716
|
-
var Selectors = (0,
|
|
7784
|
+
var Selectors = (0, import_react56.forwardRef)(SelectorsInternal);
|
|
7717
7785
|
|
|
7718
7786
|
// src/separator/Separator.tsx
|
|
7719
7787
|
var SeparatorPrimitive = __toESM(require("@radix-ui/react-separator"), 1);
|
|
@@ -7741,7 +7809,7 @@ function Separator3({
|
|
|
7741
7809
|
|
|
7742
7810
|
// src/sheet/Sheet.tsx
|
|
7743
7811
|
var SheetPrimitive = __toESM(require("@radix-ui/react-dialog"), 1);
|
|
7744
|
-
var
|
|
7812
|
+
var import_lucide_react34 = require("lucide-react");
|
|
7745
7813
|
var import_jsx_runtime101 = require("react/jsx-runtime");
|
|
7746
7814
|
function Sheet({ ...props }) {
|
|
7747
7815
|
return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(SheetPrimitive.Root, { "data-slot": "sheet", ...props });
|
|
@@ -7795,7 +7863,7 @@ function SheetContent({
|
|
|
7795
7863
|
children: [
|
|
7796
7864
|
children,
|
|
7797
7865
|
/* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(SheetPrimitive.Close, { className: "absolute right-4 top-4 rounded-[var(--chekin-radius-small)] opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:shadow-[var(--chekin-shadow-focus)] disabled:pointer-events-none", children: [
|
|
7798
|
-
/* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
|
|
7866
|
+
/* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_lucide_react34.XIcon, { className: "size-4" }),
|
|
7799
7867
|
/* @__PURE__ */ (0, import_jsx_runtime101.jsx)("span", { className: "sr-only", children: "Close" })
|
|
7800
7868
|
] })
|
|
7801
7869
|
]
|
|
@@ -7851,10 +7919,10 @@ function SheetDescription({
|
|
|
7851
7919
|
}
|
|
7852
7920
|
|
|
7853
7921
|
// src/sidebar/Sidebar.tsx
|
|
7854
|
-
var
|
|
7922
|
+
var React26 = __toESM(require("react"), 1);
|
|
7855
7923
|
var import_react_slot4 = require("@radix-ui/react-slot");
|
|
7856
7924
|
var import_class_variance_authority11 = require("class-variance-authority");
|
|
7857
|
-
var
|
|
7925
|
+
var import_lucide_react35 = require("lucide-react");
|
|
7858
7926
|
|
|
7859
7927
|
// src/skeleton/Skeleton.tsx
|
|
7860
7928
|
var import_jsx_runtime102 = require("react/jsx-runtime");
|
|
@@ -7873,19 +7941,19 @@ function Skeleton({ className, ...props }) {
|
|
|
7873
7941
|
}
|
|
7874
7942
|
|
|
7875
7943
|
// src/sidebar/SidebarContext.ts
|
|
7876
|
-
var
|
|
7877
|
-
var SidebarContext = (0,
|
|
7944
|
+
var import_react57 = require("react");
|
|
7945
|
+
var SidebarContext = (0, import_react57.createContext)(null);
|
|
7878
7946
|
|
|
7879
7947
|
// src/sidebar/useSidebarMenuButton.ts
|
|
7880
|
-
var
|
|
7948
|
+
var import_react59 = require("react");
|
|
7881
7949
|
|
|
7882
7950
|
// src/sidebar/SidebarMenuButtonContext.ts
|
|
7883
|
-
var
|
|
7884
|
-
var SidebarMenuButtonContext = (0,
|
|
7951
|
+
var import_react58 = require("react");
|
|
7952
|
+
var SidebarMenuButtonContext = (0, import_react58.createContext)(null);
|
|
7885
7953
|
|
|
7886
7954
|
// src/sidebar/useSidebarMenuButton.ts
|
|
7887
7955
|
function useSidebarMenuButton() {
|
|
7888
|
-
return (0,
|
|
7956
|
+
return (0, import_react59.useContext)(SidebarMenuButtonContext);
|
|
7889
7957
|
}
|
|
7890
7958
|
|
|
7891
7959
|
// src/sidebar/SidebarIcon.tsx
|
|
@@ -7926,16 +7994,16 @@ var SidebarIcon = ({
|
|
|
7926
7994
|
};
|
|
7927
7995
|
|
|
7928
7996
|
// src/sidebar/useSidebar.ts
|
|
7929
|
-
var
|
|
7997
|
+
var import_react60 = require("react");
|
|
7930
7998
|
function useSidebar() {
|
|
7931
|
-
const context = (0,
|
|
7999
|
+
const context = (0, import_react60.useContext)(SidebarContext);
|
|
7932
8000
|
if (!context) {
|
|
7933
8001
|
throw new Error("useSidebar must be used within a SidebarProvider.");
|
|
7934
8002
|
}
|
|
7935
8003
|
return context;
|
|
7936
8004
|
}
|
|
7937
8005
|
function useSidebarSafe() {
|
|
7938
|
-
return (0,
|
|
8006
|
+
return (0, import_react60.useContext)(SidebarContext);
|
|
7939
8007
|
}
|
|
7940
8008
|
|
|
7941
8009
|
// src/sidebar/Sidebar.tsx
|
|
@@ -7944,7 +8012,7 @@ var SIDEBAR_COOKIE_NAME_DEFAULT = "sidebar_state";
|
|
|
7944
8012
|
var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
|
|
7945
8013
|
var SIDEBAR_WIDTH_MOBILE = "18rem";
|
|
7946
8014
|
var SIDEBAR_KEYBOARD_SHORTCUT = "b";
|
|
7947
|
-
var SidebarProvider =
|
|
8015
|
+
var SidebarProvider = React26.forwardRef(
|
|
7948
8016
|
({
|
|
7949
8017
|
defaultOpen = true,
|
|
7950
8018
|
open: openProp,
|
|
@@ -7956,10 +8024,10 @@ var SidebarProvider = React25.forwardRef(
|
|
|
7956
8024
|
...props
|
|
7957
8025
|
}, ref) => {
|
|
7958
8026
|
const isMobile = useIsMobile({ breakpoint: 641 });
|
|
7959
|
-
const [openMobile, setOpenMobile] =
|
|
7960
|
-
const [_open, _setOpen] =
|
|
8027
|
+
const [openMobile, setOpenMobile] = React26.useState(false);
|
|
8028
|
+
const [_open, _setOpen] = React26.useState(defaultOpen);
|
|
7961
8029
|
const open = openProp ?? _open;
|
|
7962
|
-
const setOpen =
|
|
8030
|
+
const setOpen = React26.useCallback(
|
|
7963
8031
|
(value) => {
|
|
7964
8032
|
const openState = typeof value === "function" ? value(open) : value;
|
|
7965
8033
|
if (setOpenProp) {
|
|
@@ -7971,10 +8039,10 @@ var SidebarProvider = React25.forwardRef(
|
|
|
7971
8039
|
},
|
|
7972
8040
|
[setOpenProp, open, stateName]
|
|
7973
8041
|
);
|
|
7974
|
-
const toggleSidebar =
|
|
8042
|
+
const toggleSidebar = React26.useCallback(() => {
|
|
7975
8043
|
return isMobile ? setOpenMobile((value) => !value) : setOpen((value) => !value);
|
|
7976
8044
|
}, [isMobile, setOpen]);
|
|
7977
|
-
|
|
8045
|
+
React26.useEffect(() => {
|
|
7978
8046
|
const handleKeyDown = (event) => {
|
|
7979
8047
|
if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
|
|
7980
8048
|
event.preventDefault();
|
|
@@ -7985,7 +8053,7 @@ var SidebarProvider = React25.forwardRef(
|
|
|
7985
8053
|
return () => window.removeEventListener("keydown", handleKeyDown);
|
|
7986
8054
|
}, [toggleSidebar]);
|
|
7987
8055
|
const state = open ? "expanded" : "collapsed";
|
|
7988
|
-
const contextValue =
|
|
8056
|
+
const contextValue = React26.useMemo(
|
|
7989
8057
|
() => ({
|
|
7990
8058
|
state,
|
|
7991
8059
|
open,
|
|
@@ -8010,7 +8078,7 @@ var SidebarProvider = React25.forwardRef(
|
|
|
8010
8078
|
}
|
|
8011
8079
|
);
|
|
8012
8080
|
SidebarProvider.displayName = "SidebarProvider";
|
|
8013
|
-
var Sidebar =
|
|
8081
|
+
var Sidebar = React26.forwardRef(
|
|
8014
8082
|
({
|
|
8015
8083
|
side = "left",
|
|
8016
8084
|
variant = "sidebar",
|
|
@@ -8104,7 +8172,7 @@ var Sidebar = React25.forwardRef(
|
|
|
8104
8172
|
}
|
|
8105
8173
|
);
|
|
8106
8174
|
Sidebar.displayName = "Sidebar";
|
|
8107
|
-
var SidebarTrigger =
|
|
8175
|
+
var SidebarTrigger = React26.forwardRef(({ className, onClick, icon, ...props }, ref) => {
|
|
8108
8176
|
const { toggleSidebar, open, isMobile, openMobile } = useSidebar();
|
|
8109
8177
|
return /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)(
|
|
8110
8178
|
Button,
|
|
@@ -8124,14 +8192,14 @@ var SidebarTrigger = React25.forwardRef(({ className, onClick, icon, ...props },
|
|
|
8124
8192
|
},
|
|
8125
8193
|
...props,
|
|
8126
8194
|
children: [
|
|
8127
|
-
icon || (isMobile ? openMobile : open) ? icon || /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
8195
|
+
icon || (isMobile ? openMobile : open) ? icon || /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_lucide_react35.ArrowLeftFromLineIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_lucide_react35.ArrowRightFromLineIcon, {}),
|
|
8128
8196
|
/* @__PURE__ */ (0, import_jsx_runtime104.jsx)("span", { className: "sr-only", children: "Toggle Sidebar" })
|
|
8129
8197
|
]
|
|
8130
8198
|
}
|
|
8131
8199
|
);
|
|
8132
8200
|
});
|
|
8133
8201
|
SidebarTrigger.displayName = "SidebarTrigger";
|
|
8134
|
-
var SidebarRail =
|
|
8202
|
+
var SidebarRail = React26.forwardRef(
|
|
8135
8203
|
({ className, ...props }, ref) => {
|
|
8136
8204
|
const { toggleSidebar } = useSidebar();
|
|
8137
8205
|
return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
@@ -8157,7 +8225,7 @@ var SidebarRail = React25.forwardRef(
|
|
|
8157
8225
|
}
|
|
8158
8226
|
);
|
|
8159
8227
|
SidebarRail.displayName = "SidebarRail";
|
|
8160
|
-
var SidebarInset =
|
|
8228
|
+
var SidebarInset = React26.forwardRef(
|
|
8161
8229
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
8162
8230
|
"main",
|
|
8163
8231
|
{
|
|
@@ -8172,7 +8240,7 @@ var SidebarInset = React25.forwardRef(
|
|
|
8172
8240
|
)
|
|
8173
8241
|
);
|
|
8174
8242
|
SidebarInset.displayName = "SidebarInset";
|
|
8175
|
-
var SidebarInput =
|
|
8243
|
+
var SidebarInput = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
8176
8244
|
Input,
|
|
8177
8245
|
{
|
|
8178
8246
|
ref,
|
|
@@ -8182,7 +8250,7 @@ var SidebarInput = React25.forwardRef(({ className, ...props }, ref) => /* @__PU
|
|
|
8182
8250
|
}
|
|
8183
8251
|
));
|
|
8184
8252
|
SidebarInput.displayName = "SidebarInput";
|
|
8185
|
-
var SidebarHeader =
|
|
8253
|
+
var SidebarHeader = React26.forwardRef(
|
|
8186
8254
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
8187
8255
|
"div",
|
|
8188
8256
|
{
|
|
@@ -8194,7 +8262,7 @@ var SidebarHeader = React25.forwardRef(
|
|
|
8194
8262
|
)
|
|
8195
8263
|
);
|
|
8196
8264
|
SidebarHeader.displayName = "SidebarHeader";
|
|
8197
|
-
var SidebarFooter =
|
|
8265
|
+
var SidebarFooter = React26.forwardRef(
|
|
8198
8266
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
8199
8267
|
"div",
|
|
8200
8268
|
{
|
|
@@ -8206,7 +8274,7 @@ var SidebarFooter = React25.forwardRef(
|
|
|
8206
8274
|
)
|
|
8207
8275
|
);
|
|
8208
8276
|
SidebarFooter.displayName = "SidebarFooter";
|
|
8209
|
-
var SidebarSeparator =
|
|
8277
|
+
var SidebarSeparator = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
8210
8278
|
Separator3,
|
|
8211
8279
|
{
|
|
8212
8280
|
ref,
|
|
@@ -8216,7 +8284,7 @@ var SidebarSeparator = React25.forwardRef(({ className, ...props }, ref) => /* @
|
|
|
8216
8284
|
}
|
|
8217
8285
|
));
|
|
8218
8286
|
SidebarSeparator.displayName = "SidebarSeparator";
|
|
8219
|
-
var SidebarContent =
|
|
8287
|
+
var SidebarContent = React26.forwardRef(
|
|
8220
8288
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
8221
8289
|
"div",
|
|
8222
8290
|
{
|
|
@@ -8231,7 +8299,7 @@ var SidebarContent = React25.forwardRef(
|
|
|
8231
8299
|
)
|
|
8232
8300
|
);
|
|
8233
8301
|
SidebarContent.displayName = "SidebarContent";
|
|
8234
|
-
var SidebarGroup =
|
|
8302
|
+
var SidebarGroup = React26.forwardRef(
|
|
8235
8303
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
8236
8304
|
"div",
|
|
8237
8305
|
{
|
|
@@ -8243,7 +8311,7 @@ var SidebarGroup = React25.forwardRef(
|
|
|
8243
8311
|
)
|
|
8244
8312
|
);
|
|
8245
8313
|
SidebarGroup.displayName = "SidebarGroup";
|
|
8246
|
-
var SidebarGroupLabel =
|
|
8314
|
+
var SidebarGroupLabel = React26.forwardRef(({ className, asChild = false, ...props }, ref) => {
|
|
8247
8315
|
const Comp = asChild ? import_react_slot4.Slot : "div";
|
|
8248
8316
|
return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
8249
8317
|
Comp,
|
|
@@ -8260,7 +8328,7 @@ var SidebarGroupLabel = React25.forwardRef(({ className, asChild = false, ...pro
|
|
|
8260
8328
|
);
|
|
8261
8329
|
});
|
|
8262
8330
|
SidebarGroupLabel.displayName = "SidebarGroupLabel";
|
|
8263
|
-
var SidebarGroupAction =
|
|
8331
|
+
var SidebarGroupAction = React26.forwardRef(({ className, asChild = false, ...props }, ref) => {
|
|
8264
8332
|
const Comp = asChild ? import_react_slot4.Slot : "button";
|
|
8265
8333
|
return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
8266
8334
|
Comp,
|
|
@@ -8276,7 +8344,7 @@ var SidebarGroupAction = React25.forwardRef(({ className, asChild = false, ...pr
|
|
|
8276
8344
|
);
|
|
8277
8345
|
});
|
|
8278
8346
|
SidebarGroupAction.displayName = "SidebarGroupAction";
|
|
8279
|
-
var SidebarGroupContent =
|
|
8347
|
+
var SidebarGroupContent = React26.forwardRef(
|
|
8280
8348
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
8281
8349
|
"div",
|
|
8282
8350
|
{
|
|
@@ -8288,7 +8356,7 @@ var SidebarGroupContent = React25.forwardRef(
|
|
|
8288
8356
|
)
|
|
8289
8357
|
);
|
|
8290
8358
|
SidebarGroupContent.displayName = "SidebarGroupContent";
|
|
8291
|
-
var SidebarMenu =
|
|
8359
|
+
var SidebarMenu = React26.forwardRef(
|
|
8292
8360
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
8293
8361
|
"ul",
|
|
8294
8362
|
{
|
|
@@ -8300,7 +8368,7 @@ var SidebarMenu = React25.forwardRef(
|
|
|
8300
8368
|
)
|
|
8301
8369
|
);
|
|
8302
8370
|
SidebarMenu.displayName = "SidebarMenu";
|
|
8303
|
-
var SidebarMenuItem =
|
|
8371
|
+
var SidebarMenuItem = React26.forwardRef(
|
|
8304
8372
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
8305
8373
|
"li",
|
|
8306
8374
|
{
|
|
@@ -8332,7 +8400,7 @@ var sidebarMenuButtonVariants = (0, import_class_variance_authority11.cva)(
|
|
|
8332
8400
|
}
|
|
8333
8401
|
}
|
|
8334
8402
|
);
|
|
8335
|
-
var SidebarMenuButton =
|
|
8403
|
+
var SidebarMenuButton = React26.forwardRef(
|
|
8336
8404
|
({
|
|
8337
8405
|
asChild = false,
|
|
8338
8406
|
isActive = false,
|
|
@@ -8378,7 +8446,7 @@ var SidebarMenuButton = React25.forwardRef(
|
|
|
8378
8446
|
}
|
|
8379
8447
|
);
|
|
8380
8448
|
SidebarMenuButton.displayName = "SidebarMenuButton";
|
|
8381
|
-
var SidebarMenuAction =
|
|
8449
|
+
var SidebarMenuAction = React26.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
|
|
8382
8450
|
const Comp = asChild ? import_react_slot4.Slot : "button";
|
|
8383
8451
|
return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
8384
8452
|
Comp,
|
|
@@ -8395,7 +8463,7 @@ var SidebarMenuAction = React25.forwardRef(({ className, asChild = false, showOn
|
|
|
8395
8463
|
);
|
|
8396
8464
|
});
|
|
8397
8465
|
SidebarMenuAction.displayName = "SidebarMenuAction";
|
|
8398
|
-
var SidebarMenuBadge =
|
|
8466
|
+
var SidebarMenuBadge = React26.forwardRef(
|
|
8399
8467
|
({ className, ...props }, ref) => {
|
|
8400
8468
|
const { open, isMobile, openMobile } = useSidebar();
|
|
8401
8469
|
const isOpen = isMobile ? openMobile : open;
|
|
@@ -8415,8 +8483,8 @@ var SidebarMenuBadge = React25.forwardRef(
|
|
|
8415
8483
|
}
|
|
8416
8484
|
);
|
|
8417
8485
|
SidebarMenuBadge.displayName = "SidebarMenuBadge";
|
|
8418
|
-
var SidebarMenuSkeleton =
|
|
8419
|
-
const width =
|
|
8486
|
+
var SidebarMenuSkeleton = React26.forwardRef(({ className, showIcon = false, ...props }, ref) => {
|
|
8487
|
+
const width = React26.useMemo(() => `${Math.floor(Math.random() * 40) + 50}%`, []);
|
|
8420
8488
|
return /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)(
|
|
8421
8489
|
"div",
|
|
8422
8490
|
{
|
|
@@ -8439,7 +8507,7 @@ var SidebarMenuSkeleton = React25.forwardRef(({ className, showIcon = false, ...
|
|
|
8439
8507
|
);
|
|
8440
8508
|
});
|
|
8441
8509
|
SidebarMenuSkeleton.displayName = "SidebarMenuSkeleton";
|
|
8442
|
-
var SidebarMenuSub =
|
|
8510
|
+
var SidebarMenuSub = React26.forwardRef(
|
|
8443
8511
|
({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
|
|
8444
8512
|
"ul",
|
|
8445
8513
|
{
|
|
@@ -8454,7 +8522,7 @@ var SidebarMenuSub = React25.forwardRef(
|
|
|
8454
8522
|
)
|
|
8455
8523
|
);
|
|
8456
8524
|
SidebarMenuSub.displayName = "SidebarMenuSub";
|
|
8457
|
-
var SidebarMenuSubItem =
|
|
8525
|
+
var SidebarMenuSubItem = React26.forwardRef(
|
|
8458
8526
|
({ ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("li", { ref, ...props })
|
|
8459
8527
|
);
|
|
8460
8528
|
SidebarMenuSubItem.displayName = "SidebarMenuSubItem";
|
|
@@ -8478,7 +8546,7 @@ var sidebarMenuSubButtonVariants = (0, import_class_variance_authority11.cva)(
|
|
|
8478
8546
|
}
|
|
8479
8547
|
}
|
|
8480
8548
|
);
|
|
8481
|
-
var SidebarMenuSubButton =
|
|
8549
|
+
var SidebarMenuSubButton = React26.forwardRef(
|
|
8482
8550
|
({
|
|
8483
8551
|
asChild = false,
|
|
8484
8552
|
isActive,
|
|
@@ -8507,107 +8575,10 @@ SidebarMenuSubButton.displayName = "SidebarMenuSubButton";
|
|
|
8507
8575
|
var VALUE_PART = 1;
|
|
8508
8576
|
var getSidebarState = (stateName) => document.cookie.split("; ").find((row) => row.startsWith(`${stateName}=`))?.split("=")[VALUE_PART] === "true";
|
|
8509
8577
|
|
|
8510
|
-
// src/circular-loader/CircularLoader.tsx
|
|
8511
|
-
var import_react60 = __toESM(require("react"), 1);
|
|
8512
|
-
var import_jsx_runtime105 = require("react/jsx-runtime");
|
|
8513
|
-
var CircularLoader = import_react60.default.memo(
|
|
8514
|
-
({ visible = true, height, width, position, label, className }) => {
|
|
8515
|
-
if (!visible) return null;
|
|
8516
|
-
return /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(
|
|
8517
|
-
"div",
|
|
8518
|
-
{
|
|
8519
|
-
className: cn(
|
|
8520
|
-
"main-loader flex flex-col items-center justify-center gap-2",
|
|
8521
|
-
position === "center" && "h-full",
|
|
8522
|
-
className
|
|
8523
|
-
),
|
|
8524
|
-
role: "progressbar",
|
|
8525
|
-
children: [
|
|
8526
|
-
/* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(
|
|
8527
|
-
"svg",
|
|
8528
|
-
{
|
|
8529
|
-
viewBox: "25 25 50 50",
|
|
8530
|
-
className: "main-loader__svg text-[var(--circular-loader-color)]",
|
|
8531
|
-
style: {
|
|
8532
|
-
width: toCssSize(width),
|
|
8533
|
-
height: toCssSize(height)
|
|
8534
|
-
},
|
|
8535
|
-
children: [
|
|
8536
|
-
/* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
|
|
8537
|
-
"circle",
|
|
8538
|
-
{
|
|
8539
|
-
r: "20",
|
|
8540
|
-
cy: "50",
|
|
8541
|
-
cx: "50",
|
|
8542
|
-
className: "cover fill-none stroke-current opacity-5",
|
|
8543
|
-
strokeWidth: "7"
|
|
8544
|
-
}
|
|
8545
|
-
),
|
|
8546
|
-
/* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(
|
|
8547
|
-
"circle",
|
|
8548
|
-
{
|
|
8549
|
-
r: "20",
|
|
8550
|
-
cy: "50",
|
|
8551
|
-
cx: "50",
|
|
8552
|
-
className: "circle fill-none stroke-current",
|
|
8553
|
-
strokeDasharray: "1 200",
|
|
8554
|
-
strokeDashoffset: "0",
|
|
8555
|
-
strokeLinecap: "round",
|
|
8556
|
-
strokeWidth: "7",
|
|
8557
|
-
children: [
|
|
8558
|
-
/* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
|
|
8559
|
-
"animateTransform",
|
|
8560
|
-
{
|
|
8561
|
-
attributeName: "transform",
|
|
8562
|
-
dur: "2.25s",
|
|
8563
|
-
from: "0 50 50",
|
|
8564
|
-
repeatCount: "indefinite",
|
|
8565
|
-
to: "360 50 50",
|
|
8566
|
-
type: "rotate"
|
|
8567
|
-
}
|
|
8568
|
-
),
|
|
8569
|
-
/* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
|
|
8570
|
-
"animate",
|
|
8571
|
-
{
|
|
8572
|
-
attributeName: "stroke-dasharray",
|
|
8573
|
-
calcMode: "spline",
|
|
8574
|
-
dur: "1.8s",
|
|
8575
|
-
keyTimes: "0;0.5;1",
|
|
8576
|
-
keySplines: "0.42 0 0.58 1;0.42 0 0.58 1",
|
|
8577
|
-
repeatCount: "indefinite",
|
|
8578
|
-
values: "1 200;90 200;90 200"
|
|
8579
|
-
}
|
|
8580
|
-
),
|
|
8581
|
-
/* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
|
|
8582
|
-
"animate",
|
|
8583
|
-
{
|
|
8584
|
-
attributeName: "stroke-dashoffset",
|
|
8585
|
-
calcMode: "spline",
|
|
8586
|
-
dur: "1.8s",
|
|
8587
|
-
keyTimes: "0;0.5;1",
|
|
8588
|
-
keySplines: "0.42 0 0.58 1;0.42 0 0.58 1",
|
|
8589
|
-
repeatCount: "indefinite",
|
|
8590
|
-
values: "0;-35;-125"
|
|
8591
|
-
}
|
|
8592
|
-
)
|
|
8593
|
-
]
|
|
8594
|
-
}
|
|
8595
|
-
)
|
|
8596
|
-
]
|
|
8597
|
-
}
|
|
8598
|
-
),
|
|
8599
|
-
label && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("div", { className: "text-sm font-medium text-chekin-gray-1", children: label })
|
|
8600
|
-
]
|
|
8601
|
-
}
|
|
8602
|
-
);
|
|
8603
|
-
}
|
|
8604
|
-
);
|
|
8605
|
-
CircularLoader.displayName = "CircularLoader";
|
|
8606
|
-
|
|
8607
8578
|
// src/small-grid-single-item/SmallGridSingleItem.tsx
|
|
8608
8579
|
var import_react61 = require("react");
|
|
8609
|
-
var
|
|
8610
|
-
var
|
|
8580
|
+
var import_lucide_react36 = require("lucide-react");
|
|
8581
|
+
var import_jsx_runtime105 = require("react/jsx-runtime");
|
|
8611
8582
|
var SmallGridSingleItem = (0, import_react61.memo)(
|
|
8612
8583
|
({
|
|
8613
8584
|
title,
|
|
@@ -8623,7 +8594,7 @@ var SmallGridSingleItem = (0, import_react61.memo)(
|
|
|
8623
8594
|
const handleClick = (event) => {
|
|
8624
8595
|
if (!disabled && onClick) onClick(event);
|
|
8625
8596
|
};
|
|
8626
|
-
return /* @__PURE__ */ (0,
|
|
8597
|
+
return /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(
|
|
8627
8598
|
"div",
|
|
8628
8599
|
{
|
|
8629
8600
|
onClick: handleClick,
|
|
@@ -8637,24 +8608,24 @@ var SmallGridSingleItem = (0, import_react61.memo)(
|
|
|
8637
8608
|
className
|
|
8638
8609
|
),
|
|
8639
8610
|
children: [
|
|
8640
|
-
/* @__PURE__ */ (0,
|
|
8641
|
-
/* @__PURE__ */ (0,
|
|
8642
|
-
subtitle && /* @__PURE__ */ (0,
|
|
8611
|
+
/* @__PURE__ */ (0, import_jsx_runtime105.jsxs)("div", { children: [
|
|
8612
|
+
/* @__PURE__ */ (0, import_jsx_runtime105.jsx)("div", { className: "line-clamp-2 overflow-hidden text-ellipsis break-all", children: title }),
|
|
8613
|
+
subtitle && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("div", { className: "line-clamp-2 overflow-hidden text-ellipsis text-[15px] font-medium leading-6 text-[var(--chekin-color-gray-2)]", children: subtitle })
|
|
8643
8614
|
] }),
|
|
8644
|
-
!readOnly && /* @__PURE__ */ (0,
|
|
8645
|
-
onDelete && /* @__PURE__ */ (0,
|
|
8615
|
+
!readOnly && /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)("div", { className: "flex h-full items-center justify-end gap-2", children: [
|
|
8616
|
+
onDelete && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
|
|
8646
8617
|
Button,
|
|
8647
8618
|
{
|
|
8648
8619
|
disabled,
|
|
8649
8620
|
onClick: onDelete,
|
|
8650
8621
|
size: "icon",
|
|
8651
8622
|
variant: "outline",
|
|
8652
|
-
children: /* @__PURE__ */ (0,
|
|
8623
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_lucide_react36.Trash2, { className: "h-5 w-5 text-[var(--chekin-color-brand-red)]" })
|
|
8653
8624
|
}
|
|
8654
8625
|
),
|
|
8655
|
-
onEdit && /* @__PURE__ */ (0,
|
|
8626
|
+
onEdit && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(Button, { disabled, onClick: onEdit, size: "icon", variant: "outline", children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_lucide_react36.Pencil, { className: "h-5 w-5 text-[var(--chekin-color-brand-blue)]" }) })
|
|
8656
8627
|
] }),
|
|
8657
|
-
error && /* @__PURE__ */ (0,
|
|
8628
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("div", { className: "absolute bottom-1 right-2 text-xs text-[var(--chekin-color-brand-red)]", children: error })
|
|
8658
8629
|
]
|
|
8659
8630
|
}
|
|
8660
8631
|
);
|
|
@@ -8663,9 +8634,9 @@ var SmallGridSingleItem = (0, import_react61.memo)(
|
|
|
8663
8634
|
SmallGridSingleItem.displayName = "SmallGridSingleItem";
|
|
8664
8635
|
|
|
8665
8636
|
// src/sorting-action/SortingAction.tsx
|
|
8666
|
-
var
|
|
8667
|
-
var
|
|
8668
|
-
var
|
|
8637
|
+
var import_react_i18next21 = require("react-i18next");
|
|
8638
|
+
var import_lucide_react37 = require("lucide-react");
|
|
8639
|
+
var import_jsx_runtime106 = require("react/jsx-runtime");
|
|
8669
8640
|
function SortingAction({
|
|
8670
8641
|
value,
|
|
8671
8642
|
onSortChange,
|
|
@@ -8674,9 +8645,9 @@ function SortingAction({
|
|
|
8674
8645
|
variant = "by_other",
|
|
8675
8646
|
onOpenChange
|
|
8676
8647
|
}) {
|
|
8677
|
-
const { t } = (0,
|
|
8678
|
-
return /* @__PURE__ */ (0,
|
|
8679
|
-
/* @__PURE__ */ (0,
|
|
8648
|
+
const { t } = (0, import_react_i18next21.useTranslation)();
|
|
8649
|
+
return /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(DropdownMenu, { open, onOpenChange, children: [
|
|
8650
|
+
/* @__PURE__ */ (0, import_jsx_runtime106.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
|
|
8680
8651
|
"button",
|
|
8681
8652
|
{
|
|
8682
8653
|
type: "button",
|
|
@@ -8685,36 +8656,36 @@ function SortingAction({
|
|
|
8685
8656
|
className
|
|
8686
8657
|
),
|
|
8687
8658
|
"aria-label": "Open sorting menu",
|
|
8688
|
-
children: /* @__PURE__ */ (0,
|
|
8659
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_lucide_react37.ArrowDownUpIcon, { className: "h-4 w-4 text-[var(--chekin-color-gray-1)] group-hover/trigger:text-[var(--chekin-color-brand-navy)]" })
|
|
8689
8660
|
}
|
|
8690
8661
|
) }),
|
|
8691
|
-
/* @__PURE__ */ (0,
|
|
8692
|
-
/* @__PURE__ */ (0,
|
|
8662
|
+
/* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(DropdownMenuContent, { className: "w-full max-w-[256px]", align: "start", children: [
|
|
8663
|
+
/* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(
|
|
8693
8664
|
DropdownMenuItem,
|
|
8694
8665
|
{
|
|
8695
8666
|
active: value === "asc",
|
|
8696
8667
|
className: cn(value === "asc" && "text-[var(--chekin-color-brand-blue)]"),
|
|
8697
8668
|
onClick: () => onSortChange?.("asc"),
|
|
8698
8669
|
children: [
|
|
8699
|
-
/* @__PURE__ */ (0,
|
|
8670
|
+
/* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_lucide_react37.ArrowUp, { className: "h-4 w-4" }),
|
|
8700
8671
|
variant === "by_text" ? t("sort_a_z") : t("sort_in_asc")
|
|
8701
8672
|
]
|
|
8702
8673
|
}
|
|
8703
8674
|
),
|
|
8704
|
-
/* @__PURE__ */ (0,
|
|
8675
|
+
/* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(
|
|
8705
8676
|
DropdownMenuItem,
|
|
8706
8677
|
{
|
|
8707
8678
|
active: value === "desc",
|
|
8708
8679
|
className: cn(value === "desc" && "text-[var(--chekin-color-brand-blue)]"),
|
|
8709
8680
|
onClick: () => onSortChange?.("desc"),
|
|
8710
8681
|
children: [
|
|
8711
|
-
/* @__PURE__ */ (0,
|
|
8682
|
+
/* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_lucide_react37.ArrowDown, { className: "h-4 w-4" }),
|
|
8712
8683
|
variant === "by_text" ? t("sort_z_a") : t("sort_in_desc")
|
|
8713
8684
|
]
|
|
8714
8685
|
}
|
|
8715
8686
|
),
|
|
8716
|
-
value && /* @__PURE__ */ (0,
|
|
8717
|
-
/* @__PURE__ */ (0,
|
|
8687
|
+
value && /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(DropdownMenuItem, { onClick: () => onSortChange?.(null), children: [
|
|
8688
|
+
/* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_lucide_react37.Minus, { className: "h-4 w-4" }),
|
|
8718
8689
|
t("clear_sorting")
|
|
8719
8690
|
] })
|
|
8720
8691
|
] })
|
|
@@ -8723,9 +8694,9 @@ function SortingAction({
|
|
|
8723
8694
|
|
|
8724
8695
|
// src/status-button/StatusButton.tsx
|
|
8725
8696
|
var import_react62 = require("react");
|
|
8726
|
-
var
|
|
8727
|
-
var
|
|
8728
|
-
var
|
|
8697
|
+
var import_react_i18next22 = require("react-i18next");
|
|
8698
|
+
var import_lucide_react38 = require("lucide-react");
|
|
8699
|
+
var import_jsx_runtime107 = require("react/jsx-runtime");
|
|
8729
8700
|
function StatusButton({
|
|
8730
8701
|
hidden,
|
|
8731
8702
|
status,
|
|
@@ -8739,11 +8710,11 @@ function StatusButton({
|
|
|
8739
8710
|
variant = "default",
|
|
8740
8711
|
...props
|
|
8741
8712
|
}) {
|
|
8742
|
-
const { t } = (0,
|
|
8713
|
+
const { t } = (0, import_react_i18next22.useTranslation)();
|
|
8743
8714
|
const configMap = (0, import_react62.useMemo)(() => {
|
|
8744
8715
|
const defaultLoadingConfig = {
|
|
8745
8716
|
text: loadingText ?? `${t("saving")}...`,
|
|
8746
|
-
icon: /* @__PURE__ */ (0,
|
|
8717
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_lucide_react38.Loader2, { className: "h-4 w-4 animate-spin" }),
|
|
8747
8718
|
variant,
|
|
8748
8719
|
isLoading: true
|
|
8749
8720
|
};
|
|
@@ -8753,13 +8724,13 @@ function StatusButton({
|
|
|
8753
8724
|
validating: { ...defaultLoadingConfig, text: t("validating") },
|
|
8754
8725
|
error: {
|
|
8755
8726
|
text: t("error"),
|
|
8756
|
-
icon: /* @__PURE__ */ (0,
|
|
8727
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_lucide_react38.AlertCircle, { className: "h-4 w-4" }),
|
|
8757
8728
|
variant: "destructive",
|
|
8758
8729
|
isLoading: false
|
|
8759
8730
|
},
|
|
8760
8731
|
success: {
|
|
8761
8732
|
text: successText ?? t("saved_exclamation"),
|
|
8762
|
-
icon: /* @__PURE__ */ (0,
|
|
8733
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_lucide_react38.CheckCircle, { className: "h-4 w-4" }),
|
|
8763
8734
|
variant,
|
|
8764
8735
|
isLoading: false
|
|
8765
8736
|
},
|
|
@@ -8775,7 +8746,7 @@ function StatusButton({
|
|
|
8775
8746
|
if (hidden) {
|
|
8776
8747
|
return null;
|
|
8777
8748
|
}
|
|
8778
|
-
return /* @__PURE__ */ (0,
|
|
8749
|
+
return /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(
|
|
8779
8750
|
Button,
|
|
8780
8751
|
{
|
|
8781
8752
|
className: cn(
|
|
@@ -8791,45 +8762,45 @@ function StatusButton({
|
|
|
8791
8762
|
...props,
|
|
8792
8763
|
children: [
|
|
8793
8764
|
config.icon,
|
|
8794
|
-
/* @__PURE__ */ (0,
|
|
8765
|
+
/* @__PURE__ */ (0, import_jsx_runtime107.jsx)("span", { children: config.text })
|
|
8795
8766
|
]
|
|
8796
8767
|
}
|
|
8797
8768
|
);
|
|
8798
8769
|
}
|
|
8799
8770
|
|
|
8800
8771
|
// src/status-box/StatusBox.tsx
|
|
8801
|
-
var
|
|
8802
|
-
var
|
|
8772
|
+
var import_lucide_react39 = require("lucide-react");
|
|
8773
|
+
var import_jsx_runtime108 = require("react/jsx-runtime");
|
|
8803
8774
|
function StatusBox({ status, title, text }) {
|
|
8804
8775
|
if (status === "success") {
|
|
8805
|
-
return /* @__PURE__ */ (0,
|
|
8806
|
-
/* @__PURE__ */ (0,
|
|
8807
|
-
/* @__PURE__ */ (0,
|
|
8808
|
-
/* @__PURE__ */ (0,
|
|
8809
|
-
/* @__PURE__ */ (0,
|
|
8776
|
+
return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center gap-3 rounded-lg border border-green-100 bg-green-50 p-4", children: [
|
|
8777
|
+
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "rounded-full bg-green-100 p-1", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_lucide_react39.CheckIcon, { className: "h-5 w-5 text-green-600" }) }),
|
|
8778
|
+
/* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { children: [
|
|
8779
|
+
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "font-semibold text-green-800", children: title }),
|
|
8780
|
+
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "text-sm text-green-700", children: text })
|
|
8810
8781
|
] })
|
|
8811
8782
|
] });
|
|
8812
8783
|
}
|
|
8813
8784
|
if (status === "failed") {
|
|
8814
|
-
return /* @__PURE__ */ (0,
|
|
8815
|
-
/* @__PURE__ */ (0,
|
|
8816
|
-
/* @__PURE__ */ (0,
|
|
8817
|
-
/* @__PURE__ */ (0,
|
|
8818
|
-
/* @__PURE__ */ (0,
|
|
8785
|
+
return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center gap-3 rounded-lg border border-red-100 bg-red-50 p-4", children: [
|
|
8786
|
+
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "rounded-full bg-red-100 p-1", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_lucide_react39.XIcon, { className: "h-5 w-5 text-red-600" }) }),
|
|
8787
|
+
/* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { children: [
|
|
8788
|
+
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "font-semibold text-red-800", children: title }),
|
|
8789
|
+
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "text-sm text-red-700", children: text })
|
|
8819
8790
|
] })
|
|
8820
8791
|
] });
|
|
8821
8792
|
}
|
|
8822
|
-
return /* @__PURE__ */ (0,
|
|
8823
|
-
/* @__PURE__ */ (0,
|
|
8824
|
-
/* @__PURE__ */ (0,
|
|
8825
|
-
/* @__PURE__ */ (0,
|
|
8826
|
-
/* @__PURE__ */ (0,
|
|
8793
|
+
return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center gap-3 rounded-lg border border-amber-100 bg-amber-50 p-4", children: [
|
|
8794
|
+
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "rounded-full bg-amber-100 p-1", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_lucide_react39.AlertTriangleIcon, { className: "h-5 w-5 text-amber-600" }) }),
|
|
8795
|
+
/* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { children: [
|
|
8796
|
+
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "font-semibold text-amber-800", children: title }),
|
|
8797
|
+
/* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "text-sm text-amber-700", children: text })
|
|
8827
8798
|
] })
|
|
8828
8799
|
] });
|
|
8829
8800
|
}
|
|
8830
8801
|
|
|
8831
8802
|
// src/stepper/Stepper.tsx
|
|
8832
|
-
var
|
|
8803
|
+
var import_jsx_runtime109 = require("react/jsx-runtime");
|
|
8833
8804
|
function Stepper({
|
|
8834
8805
|
totalSteps,
|
|
8835
8806
|
activeStep,
|
|
@@ -8838,7 +8809,7 @@ function Stepper({
|
|
|
8838
8809
|
}) {
|
|
8839
8810
|
if (totalSteps <= 0) return null;
|
|
8840
8811
|
const clampedActiveStep = Math.max(1, Math.min(totalSteps, activeStep));
|
|
8841
|
-
return /* @__PURE__ */ (0,
|
|
8812
|
+
return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
|
|
8842
8813
|
"div",
|
|
8843
8814
|
{
|
|
8844
8815
|
className: cn("flex w-full items-center gap-2", className),
|
|
@@ -8849,7 +8820,7 @@ function Stepper({
|
|
|
8849
8820
|
children: new Array(totalSteps).fill(null).map((_, stepIndex) => {
|
|
8850
8821
|
const stepNumber = stepIndex + 1;
|
|
8851
8822
|
const isActive = cumulative ? stepNumber <= clampedActiveStep : stepNumber === clampedActiveStep;
|
|
8852
|
-
return /* @__PURE__ */ (0,
|
|
8823
|
+
return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
|
|
8853
8824
|
"span",
|
|
8854
8825
|
{
|
|
8855
8826
|
className: cn(
|
|
@@ -8866,14 +8837,14 @@ function Stepper({
|
|
|
8866
8837
|
|
|
8867
8838
|
// src/switch-blocks/SwitchBlocks.tsx
|
|
8868
8839
|
var import_react63 = require("react");
|
|
8869
|
-
var
|
|
8840
|
+
var import_jsx_runtime110 = require("react/jsx-runtime");
|
|
8870
8841
|
var SwitchBlocksInternal = (0, import_react63.forwardRef)(
|
|
8871
|
-
({ options, value, onChange, disabled, className }, ref) => /* @__PURE__ */ (0,
|
|
8842
|
+
({ options, value, onChange, disabled, className }, ref) => /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
|
|
8872
8843
|
"div",
|
|
8873
8844
|
{
|
|
8874
8845
|
ref,
|
|
8875
8846
|
className: cn("flex flex-wrap items-center justify-start gap-4", className),
|
|
8876
|
-
children: options.map((option) => /* @__PURE__ */ (0,
|
|
8847
|
+
children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
|
|
8877
8848
|
BoxOptionSelector,
|
|
8878
8849
|
{
|
|
8879
8850
|
id: option.id,
|
|
@@ -8895,7 +8866,7 @@ var SwitchBlocks = (0, import_react63.memo)(SwitchBlocksInternal);
|
|
|
8895
8866
|
|
|
8896
8867
|
// src/switch-group/SwitchGroup.tsx
|
|
8897
8868
|
var React27 = __toESM(require("react"), 1);
|
|
8898
|
-
var
|
|
8869
|
+
var import_jsx_runtime111 = require("react/jsx-runtime");
|
|
8899
8870
|
var SwitchGroup = React27.forwardRef(
|
|
8900
8871
|
({ options, value = [], onChange, disabled = false, className, error, ...props }, ref) => {
|
|
8901
8872
|
const handleOptionChange = (optionValue, checked) => {
|
|
@@ -8906,9 +8877,9 @@ var SwitchGroup = React27.forwardRef(
|
|
|
8906
8877
|
}
|
|
8907
8878
|
onChange(value.filter((selectedValue) => selectedValue !== optionValue));
|
|
8908
8879
|
};
|
|
8909
|
-
return /* @__PURE__ */ (0,
|
|
8910
|
-
options.map((option) => /* @__PURE__ */ (0,
|
|
8911
|
-
/* @__PURE__ */ (0,
|
|
8880
|
+
return /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)("div", { ref, className: cn("w-full space-y-4", className), ...props, children: [
|
|
8881
|
+
options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)("div", { className: "flex items-center justify-between gap-4", children: [
|
|
8882
|
+
/* @__PURE__ */ (0, import_jsx_runtime111.jsx)("div", { className: "flex flex-col", children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(
|
|
8912
8883
|
Label,
|
|
8913
8884
|
{
|
|
8914
8885
|
className: cn(
|
|
@@ -8917,7 +8888,7 @@ var SwitchGroup = React27.forwardRef(
|
|
|
8917
8888
|
),
|
|
8918
8889
|
children: [
|
|
8919
8890
|
option.label,
|
|
8920
|
-
option.description && /* @__PURE__ */ (0,
|
|
8891
|
+
option.description && /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(
|
|
8921
8892
|
"span",
|
|
8922
8893
|
{
|
|
8923
8894
|
className: cn(
|
|
@@ -8934,7 +8905,7 @@ var SwitchGroup = React27.forwardRef(
|
|
|
8934
8905
|
]
|
|
8935
8906
|
}
|
|
8936
8907
|
) }),
|
|
8937
|
-
/* @__PURE__ */ (0,
|
|
8908
|
+
/* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
|
|
8938
8909
|
Switch,
|
|
8939
8910
|
{
|
|
8940
8911
|
value: value.includes(option.value),
|
|
@@ -8944,7 +8915,7 @@ var SwitchGroup = React27.forwardRef(
|
|
|
8944
8915
|
}
|
|
8945
8916
|
)
|
|
8946
8917
|
] }, option.value)),
|
|
8947
|
-
error && /* @__PURE__ */ (0,
|
|
8918
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(ErrorMessage, { disabled, children: error })
|
|
8948
8919
|
] });
|
|
8949
8920
|
}
|
|
8950
8921
|
);
|
|
@@ -8954,7 +8925,7 @@ SwitchGroup.displayName = "SwitchGroup";
|
|
|
8954
8925
|
var import_react64 = require("react");
|
|
8955
8926
|
var TabsPrimitive2 = __toESM(require("@radix-ui/react-tabs"), 1);
|
|
8956
8927
|
var import_class_variance_authority12 = require("class-variance-authority");
|
|
8957
|
-
var
|
|
8928
|
+
var import_jsx_runtime112 = require("react/jsx-runtime");
|
|
8958
8929
|
var Tabs = TabsPrimitive2.Root;
|
|
8959
8930
|
var tabsListVariants = (0, import_class_variance_authority12.cva)("inline-flex items-center", {
|
|
8960
8931
|
variants: {
|
|
@@ -8968,7 +8939,7 @@ var tabsListVariants = (0, import_class_variance_authority12.cva)("inline-flex i
|
|
|
8968
8939
|
}
|
|
8969
8940
|
});
|
|
8970
8941
|
var TabsList = (0, import_react64.forwardRef)(
|
|
8971
|
-
({ className, variant, ...props }, ref) => /* @__PURE__ */ (0,
|
|
8942
|
+
({ className, variant, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
|
|
8972
8943
|
TabsPrimitive2.List,
|
|
8973
8944
|
{
|
|
8974
8945
|
ref,
|
|
@@ -8992,7 +8963,7 @@ var tabsTriggerVariants = (0, import_class_variance_authority12.cva)(
|
|
|
8992
8963
|
}
|
|
8993
8964
|
}
|
|
8994
8965
|
);
|
|
8995
|
-
var TabsTrigger = (0, import_react64.forwardRef)(({ className, variant, ...props }, ref) => /* @__PURE__ */ (0,
|
|
8966
|
+
var TabsTrigger = (0, import_react64.forwardRef)(({ className, variant, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
|
|
8996
8967
|
TabsPrimitive2.Trigger,
|
|
8997
8968
|
{
|
|
8998
8969
|
ref,
|
|
@@ -9001,11 +8972,11 @@ var TabsTrigger = (0, import_react64.forwardRef)(({ className, variant, ...props
|
|
|
9001
8972
|
}
|
|
9002
8973
|
));
|
|
9003
8974
|
TabsTrigger.displayName = TabsPrimitive2.Trigger.displayName;
|
|
9004
|
-
var TabsContent = (0, import_react64.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
8975
|
+
var TabsContent = (0, import_react64.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(TabsPrimitive2.Content, { ref, className, tabIndex: -1, ...props }));
|
|
9005
8976
|
TabsContent.displayName = TabsPrimitive2.Content.displayName;
|
|
9006
8977
|
|
|
9007
8978
|
// src/tabbed-section/TabbedSection.tsx
|
|
9008
|
-
var
|
|
8979
|
+
var import_jsx_runtime113 = require("react/jsx-runtime");
|
|
9009
8980
|
function TabbedSection({
|
|
9010
8981
|
triggers,
|
|
9011
8982
|
value,
|
|
@@ -9027,8 +8998,8 @@ function TabbedSection({
|
|
|
9027
8998
|
"[&>div:first-child]:gap-3",
|
|
9028
8999
|
className
|
|
9029
9000
|
);
|
|
9030
|
-
return /* @__PURE__ */ (0,
|
|
9031
|
-
/* @__PURE__ */ (0,
|
|
9001
|
+
return /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)(Tabs, { value: activeTab, onValueChange: onTabChange, className: "w-full", children: [
|
|
9002
|
+
/* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
|
|
9032
9003
|
BookmarkTabsList,
|
|
9033
9004
|
{
|
|
9034
9005
|
variant,
|
|
@@ -9036,12 +9007,12 @@ function TabbedSection({
|
|
|
9036
9007
|
children: triggers
|
|
9037
9008
|
}
|
|
9038
9009
|
),
|
|
9039
|
-
/* @__PURE__ */ (0,
|
|
9010
|
+
/* @__PURE__ */ (0, import_jsx_runtime113.jsx)("div", { className: contentContainerClassName, children })
|
|
9040
9011
|
] });
|
|
9041
9012
|
}
|
|
9042
9013
|
|
|
9043
9014
|
// src/table-placeholder/TablePlaceholder.tsx
|
|
9044
|
-
var
|
|
9015
|
+
var import_jsx_runtime114 = require("react/jsx-runtime");
|
|
9045
9016
|
function TablePlaceholder({
|
|
9046
9017
|
children,
|
|
9047
9018
|
text,
|
|
@@ -9054,21 +9025,21 @@ function TablePlaceholder({
|
|
|
9054
9025
|
if (!visible) {
|
|
9055
9026
|
return null;
|
|
9056
9027
|
}
|
|
9057
|
-
const content = /* @__PURE__ */ (0,
|
|
9058
|
-
iconSlot && /* @__PURE__ */ (0,
|
|
9059
|
-
title && /* @__PURE__ */ (0,
|
|
9060
|
-
text && /* @__PURE__ */ (0,
|
|
9061
|
-
children && /* @__PURE__ */ (0,
|
|
9028
|
+
const content = /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)("div", { className: "flex flex-col items-center justify-center px-4 py-14 text-center", children: [
|
|
9029
|
+
iconSlot && /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("div", { className: "mb-6", children: iconSlot }),
|
|
9030
|
+
title && /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("h3", { className: "mb-2 text-lg font-semibold", children: title }),
|
|
9031
|
+
text && /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("p", { className: "text-md max-w-sm font-medium", children: text }),
|
|
9032
|
+
children && /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("div", { className: "mt-6", children })
|
|
9062
9033
|
] });
|
|
9063
9034
|
if (insideTable) {
|
|
9064
|
-
return /* @__PURE__ */ (0,
|
|
9035
|
+
return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("td", { colSpan: 100, className, children: content }) });
|
|
9065
9036
|
}
|
|
9066
|
-
return /* @__PURE__ */ (0,
|
|
9037
|
+
return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("div", { className, children: content });
|
|
9067
9038
|
}
|
|
9068
9039
|
|
|
9069
9040
|
// src/task-card/TaskCard.tsx
|
|
9070
|
-
var
|
|
9071
|
-
var
|
|
9041
|
+
var import_lucide_react40 = require("lucide-react");
|
|
9042
|
+
var import_jsx_runtime115 = require("react/jsx-runtime");
|
|
9072
9043
|
function TaskCard({
|
|
9073
9044
|
title,
|
|
9074
9045
|
description,
|
|
@@ -9079,7 +9050,7 @@ function TaskCard({
|
|
|
9079
9050
|
}) {
|
|
9080
9051
|
const shouldShowCount = count !== void 0 && count > 1;
|
|
9081
9052
|
const shouldShowActions = shouldShowCount || onClick;
|
|
9082
|
-
return /* @__PURE__ */ (0,
|
|
9053
|
+
return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(
|
|
9083
9054
|
"div",
|
|
9084
9055
|
{
|
|
9085
9056
|
className: cn(
|
|
@@ -9095,7 +9066,7 @@ function TaskCard({
|
|
|
9095
9066
|
role: onClick ? "button" : void 0,
|
|
9096
9067
|
tabIndex: onClick ? 0 : void 0,
|
|
9097
9068
|
children: [
|
|
9098
|
-
/* @__PURE__ */ (0,
|
|
9069
|
+
/* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
|
|
9099
9070
|
"div",
|
|
9100
9071
|
{
|
|
9101
9072
|
className: cn(
|
|
@@ -9105,12 +9076,12 @@ function TaskCard({
|
|
|
9105
9076
|
)
|
|
9106
9077
|
}
|
|
9107
9078
|
),
|
|
9108
|
-
/* @__PURE__ */ (0,
|
|
9109
|
-
/* @__PURE__ */ (0,
|
|
9110
|
-
/* @__PURE__ */ (0,
|
|
9079
|
+
/* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col items-start", children: [
|
|
9080
|
+
/* @__PURE__ */ (0, import_jsx_runtime115.jsx)("h4", { className: "m-0 w-full break-words text-base font-semibold leading-6 text-[var(--chekin-color-brand-navy)]", children: title }),
|
|
9081
|
+
/* @__PURE__ */ (0, import_jsx_runtime115.jsx)("p", { className: "m-0 w-full text-sm font-medium leading-6 text-[var(--chekin-color-gray-1)]", children: description })
|
|
9111
9082
|
] }),
|
|
9112
|
-
shouldShowActions && /* @__PURE__ */ (0,
|
|
9113
|
-
shouldShowCount && /* @__PURE__ */ (0,
|
|
9083
|
+
shouldShowActions && /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("div", { className: "flex shrink-0 items-center gap-1", children: [
|
|
9084
|
+
shouldShowCount && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
|
|
9114
9085
|
"div",
|
|
9115
9086
|
{
|
|
9116
9087
|
className: cn(
|
|
@@ -9121,7 +9092,7 @@ function TaskCard({
|
|
|
9121
9092
|
children: count
|
|
9122
9093
|
}
|
|
9123
9094
|
),
|
|
9124
|
-
onClick && /* @__PURE__ */ (0,
|
|
9095
|
+
onClick && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
|
|
9125
9096
|
"button",
|
|
9126
9097
|
{
|
|
9127
9098
|
className: "flex h-8 w-0 min-w-0 cursor-pointer items-center justify-center overflow-hidden rounded-md border-0 bg-transparent p-0 text-[var(--chekin-color-gray-1)] opacity-0 transition-[width,opacity,min-width] duration-300 ease-in-out hover:bg-black/5 focus-visible:w-8 focus-visible:min-w-8 focus-visible:opacity-100 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--chekin-color-brand-blue)] group-hover:w-8 group-hover:min-w-8 group-hover:opacity-100",
|
|
@@ -9131,7 +9102,7 @@ function TaskCard({
|
|
|
9131
9102
|
},
|
|
9132
9103
|
"aria-label": "View details",
|
|
9133
9104
|
type: "button",
|
|
9134
|
-
children: /* @__PURE__ */ (0,
|
|
9105
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(import_lucide_react40.ArrowRight, { className: "h-5 w-5" })
|
|
9135
9106
|
}
|
|
9136
9107
|
)
|
|
9137
9108
|
] })
|
|
@@ -9219,7 +9190,7 @@ var toggleVariants = (0, import_class_variance_authority13.cva)(
|
|
|
9219
9190
|
);
|
|
9220
9191
|
|
|
9221
9192
|
// src/toggle-group/ToggleGroup.tsx
|
|
9222
|
-
var
|
|
9193
|
+
var import_jsx_runtime116 = require("react/jsx-runtime");
|
|
9223
9194
|
var ToggleGroupContext = React28.createContext({
|
|
9224
9195
|
size: "default",
|
|
9225
9196
|
variant: "default",
|
|
@@ -9227,7 +9198,7 @@ var ToggleGroupContext = React28.createContext({
|
|
|
9227
9198
|
});
|
|
9228
9199
|
var ToggleGroup = React28.forwardRef(({ className, variant, size, theme, children, ...props }, ref) => {
|
|
9229
9200
|
const isTabVariant = variant === "tab";
|
|
9230
|
-
return /* @__PURE__ */ (0,
|
|
9201
|
+
return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
|
|
9231
9202
|
ToggleGroupPrimitive.Root,
|
|
9232
9203
|
{
|
|
9233
9204
|
ref,
|
|
@@ -9237,7 +9208,7 @@ var ToggleGroup = React28.forwardRef(({ className, variant, size, theme, childre
|
|
|
9237
9208
|
className
|
|
9238
9209
|
),
|
|
9239
9210
|
...props,
|
|
9240
|
-
children: /* @__PURE__ */ (0,
|
|
9211
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(ToggleGroupContext.Provider, { value: { variant, size, theme }, children })
|
|
9241
9212
|
}
|
|
9242
9213
|
);
|
|
9243
9214
|
});
|
|
@@ -9246,7 +9217,7 @@ var ToggleGroupItem = React28.forwardRef(({ className, children, variant, size,
|
|
|
9246
9217
|
const context = React28.useContext(ToggleGroupContext);
|
|
9247
9218
|
const resolvedVariant = context.variant || variant;
|
|
9248
9219
|
const isTabVariant = resolvedVariant === "tab";
|
|
9249
|
-
return /* @__PURE__ */ (0,
|
|
9220
|
+
return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
|
|
9250
9221
|
ToggleGroupPrimitive.Item,
|
|
9251
9222
|
{
|
|
9252
9223
|
ref,
|
|
@@ -9259,9 +9230,9 @@ var ToggleGroupItem = React28.forwardRef(({ className, children, variant, size,
|
|
|
9259
9230
|
className
|
|
9260
9231
|
),
|
|
9261
9232
|
...props,
|
|
9262
|
-
children: isTabVariant ? /* @__PURE__ */ (0,
|
|
9263
|
-
/* @__PURE__ */ (0,
|
|
9264
|
-
/* @__PURE__ */ (0,
|
|
9233
|
+
children: isTabVariant ? /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("span", { className: "inline-grid", children: [
|
|
9234
|
+
/* @__PURE__ */ (0, import_jsx_runtime116.jsx)("span", { className: "invisible col-start-1 row-start-1 font-semibold", children }),
|
|
9235
|
+
/* @__PURE__ */ (0, import_jsx_runtime116.jsx)("span", { className: "col-start-1 row-start-1", children })
|
|
9265
9236
|
] }) : children
|
|
9266
9237
|
}
|
|
9267
9238
|
);
|
|
@@ -9270,7 +9241,7 @@ ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
|
|
|
9270
9241
|
|
|
9271
9242
|
// src/toggle-group/Toggles.tsx
|
|
9272
9243
|
var import_react66 = require("react");
|
|
9273
|
-
var
|
|
9244
|
+
var import_jsx_runtime117 = require("react/jsx-runtime");
|
|
9274
9245
|
var getValueArray2 = (value) => {
|
|
9275
9246
|
if (value) {
|
|
9276
9247
|
return Array.isArray(value) ? value : [value];
|
|
@@ -9366,16 +9337,16 @@ function TogglesInternal({
|
|
|
9366
9337
|
onValueChange: handleValueChange,
|
|
9367
9338
|
...multiple ? { type: "multiple", value: currentValue } : { type: "single", value: currentValue[0] ?? "" }
|
|
9368
9339
|
};
|
|
9369
|
-
return /* @__PURE__ */ (0,
|
|
9370
|
-
label && /* @__PURE__ */ (0,
|
|
9371
|
-
/* @__PURE__ */ (0,
|
|
9340
|
+
return /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("div", { ref, className, children: [
|
|
9341
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("div", { className: "mb-2", children: /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("div", { className: "select-none text-base font-normal text-[var(--chekin-color-brand-navy)]", children: label }) }),
|
|
9342
|
+
/* @__PURE__ */ (0, import_jsx_runtime117.jsx)(ToggleGroup, { className: groupClassName, ...toggleGroupProps, children: options.map((option, index) => {
|
|
9372
9343
|
const isSelected = Boolean(
|
|
9373
9344
|
getValueArray2(value).find((selectedValue) => selectedValue === option.value)
|
|
9374
9345
|
);
|
|
9375
9346
|
const isDisabled = disabled || disabledItems?.includes(option.value) || option.disabled;
|
|
9376
9347
|
const isMinSelected = getValueArray2(value).length <= minSelected;
|
|
9377
9348
|
const isItemReadOnly = readOnly || isMinSelected && isSelected || readonlyItems?.includes(option.value);
|
|
9378
|
-
return /* @__PURE__ */ (0,
|
|
9349
|
+
return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
|
|
9379
9350
|
ToggleGroupItem,
|
|
9380
9351
|
{
|
|
9381
9352
|
value: String(option.value),
|
|
@@ -9394,15 +9365,15 @@ var Toggles = (0, import_react66.forwardRef)(TogglesInternal);
|
|
|
9394
9365
|
var React29 = __toESM(require("react"), 1);
|
|
9395
9366
|
var LabelPrimitive2 = __toESM(require("@radix-ui/react-label"), 1);
|
|
9396
9367
|
var import_class_variance_authority14 = require("class-variance-authority");
|
|
9397
|
-
var
|
|
9368
|
+
var import_react_i18next23 = require("react-i18next");
|
|
9398
9369
|
|
|
9399
9370
|
// src/text-field/EndIcon.tsx
|
|
9400
|
-
var
|
|
9401
|
-
var EndIcon = ({ children }) => /* @__PURE__ */ (0,
|
|
9371
|
+
var import_jsx_runtime118 = require("react/jsx-runtime");
|
|
9372
|
+
var EndIcon = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("div", { className: "pointer-events-none absolute right-3.5 top-1/2 -translate-y-1/2 [&>*]:pointer-events-auto", children });
|
|
9402
9373
|
|
|
9403
9374
|
// src/text-field/FieldError.tsx
|
|
9404
|
-
var
|
|
9405
|
-
var FieldError = ({ id, children }) => /* @__PURE__ */ (0,
|
|
9375
|
+
var import_jsx_runtime119 = require("react/jsx-runtime");
|
|
9376
|
+
var FieldError = ({ id, children }) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
|
|
9406
9377
|
"p",
|
|
9407
9378
|
{
|
|
9408
9379
|
id,
|
|
@@ -9413,11 +9384,11 @@ var FieldError = ({ id, children }) => /* @__PURE__ */ (0, import_jsx_runtime120
|
|
|
9413
9384
|
);
|
|
9414
9385
|
|
|
9415
9386
|
// src/text-field/SupportingText.tsx
|
|
9416
|
-
var
|
|
9417
|
-
var SupportingText = ({ id, children }) => /* @__PURE__ */ (0,
|
|
9387
|
+
var import_jsx_runtime120 = require("react/jsx-runtime");
|
|
9388
|
+
var SupportingText = ({ id, children }) => /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("p", { id, className: "mt-1 text-xs italic text-[var(--chekin-color-gray-2)]", children });
|
|
9418
9389
|
|
|
9419
9390
|
// src/text-field/TextField.tsx
|
|
9420
|
-
var
|
|
9391
|
+
var import_jsx_runtime121 = require("react/jsx-runtime");
|
|
9421
9392
|
var textFieldRootClasses = [
|
|
9422
9393
|
"[--text-field-height:2.75rem]",
|
|
9423
9394
|
"[--text-field-radius:8px]",
|
|
@@ -9524,7 +9495,7 @@ var TextField = React29.forwardRef(
|
|
|
9524
9495
|
readOnly,
|
|
9525
9496
|
...props
|
|
9526
9497
|
}, ref) => {
|
|
9527
|
-
const { t } = (0,
|
|
9498
|
+
const { t } = (0, import_react_i18next23.useTranslation)();
|
|
9528
9499
|
const hasError = Boolean(error);
|
|
9529
9500
|
const autoId = React29.useId();
|
|
9530
9501
|
const inputId = props.id || autoId;
|
|
@@ -9538,7 +9509,7 @@ var TextField = React29.forwardRef(
|
|
|
9538
9509
|
const errorId = error ? `${inputId}-error` : void 0;
|
|
9539
9510
|
const ariaDescribedBy = errorId || descriptionId || void 0;
|
|
9540
9511
|
if (variant === "floating") {
|
|
9541
|
-
return /* @__PURE__ */ (0,
|
|
9512
|
+
return /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(
|
|
9542
9513
|
"div",
|
|
9543
9514
|
{
|
|
9544
9515
|
className: cn(
|
|
@@ -9547,8 +9518,8 @@ var TextField = React29.forwardRef(
|
|
|
9547
9518
|
wrapperClassName
|
|
9548
9519
|
),
|
|
9549
9520
|
children: [
|
|
9550
|
-
/* @__PURE__ */ (0,
|
|
9551
|
-
/* @__PURE__ */ (0,
|
|
9521
|
+
/* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { className: "relative", children: [
|
|
9522
|
+
/* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
|
|
9552
9523
|
"input",
|
|
9553
9524
|
{
|
|
9554
9525
|
id: inputId,
|
|
@@ -9562,7 +9533,7 @@ var TextField = React29.forwardRef(
|
|
|
9562
9533
|
...props
|
|
9563
9534
|
}
|
|
9564
9535
|
),
|
|
9565
|
-
label && /* @__PURE__ */ (0,
|
|
9536
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
|
|
9566
9537
|
LabelPrimitive2.Root,
|
|
9567
9538
|
{
|
|
9568
9539
|
htmlFor: inputId,
|
|
@@ -9576,17 +9547,17 @@ var TextField = React29.forwardRef(
|
|
|
9576
9547
|
children: label
|
|
9577
9548
|
}
|
|
9578
9549
|
),
|
|
9579
|
-
endIcon && /* @__PURE__ */ (0,
|
|
9550
|
+
endIcon && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(EndIcon, { children: endIcon })
|
|
9580
9551
|
] }),
|
|
9581
|
-
supportingText && !hasError && /* @__PURE__ */ (0,
|
|
9582
|
-
hasError && /* @__PURE__ */ (0,
|
|
9552
|
+
supportingText && !hasError && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(SupportingText, { id: descriptionId, children: supportingText }),
|
|
9553
|
+
hasError && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(FieldError, { id: errorId, children: error })
|
|
9583
9554
|
]
|
|
9584
9555
|
}
|
|
9585
9556
|
);
|
|
9586
9557
|
}
|
|
9587
|
-
return /* @__PURE__ */ (0,
|
|
9588
|
-
label && /* @__PURE__ */ (0,
|
|
9589
|
-
/* @__PURE__ */ (0,
|
|
9558
|
+
return /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { className: cn("flex w-full flex-col", textFieldRootClasses, wrapperClassName), children: [
|
|
9559
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { className: "mb-1 flex items-center gap-1", children: [
|
|
9560
|
+
/* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
|
|
9590
9561
|
LabelPrimitive2.Root,
|
|
9591
9562
|
{
|
|
9592
9563
|
htmlFor: inputId,
|
|
@@ -9594,14 +9565,14 @@ var TextField = React29.forwardRef(
|
|
|
9594
9565
|
children: label
|
|
9595
9566
|
}
|
|
9596
9567
|
),
|
|
9597
|
-
optional && /* @__PURE__ */ (0,
|
|
9598
|
-
/* @__PURE__ */ (0,
|
|
9599
|
-
/* @__PURE__ */ (0,
|
|
9568
|
+
optional && /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("span", { className: "text-base leading-4", children: [
|
|
9569
|
+
/* @__PURE__ */ (0, import_jsx_runtime121.jsx)("span", { className: "text-[var(--chekin-color-brand-navy)]", children: "- " }),
|
|
9570
|
+
/* @__PURE__ */ (0, import_jsx_runtime121.jsx)("span", { className: "italic text-[var(--chekin-color-gray-2)]", children: optionalLabel || t("optional") })
|
|
9600
9571
|
] }),
|
|
9601
9572
|
tooltip
|
|
9602
9573
|
] }),
|
|
9603
|
-
/* @__PURE__ */ (0,
|
|
9604
|
-
/* @__PURE__ */ (0,
|
|
9574
|
+
/* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { className: "relative", children: [
|
|
9575
|
+
/* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
|
|
9605
9576
|
"input",
|
|
9606
9577
|
{
|
|
9607
9578
|
id: inputId,
|
|
@@ -9615,10 +9586,10 @@ var TextField = React29.forwardRef(
|
|
|
9615
9586
|
...props
|
|
9616
9587
|
}
|
|
9617
9588
|
),
|
|
9618
|
-
endIcon && /* @__PURE__ */ (0,
|
|
9589
|
+
endIcon && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(EndIcon, { children: endIcon })
|
|
9619
9590
|
] }),
|
|
9620
|
-
supportingText && !hasError && /* @__PURE__ */ (0,
|
|
9621
|
-
hasError && /* @__PURE__ */ (0,
|
|
9591
|
+
supportingText && !hasError && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(SupportingText, { id: descriptionId, children: supportingText }),
|
|
9592
|
+
hasError && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(FieldError, { id: errorId, children: error })
|
|
9622
9593
|
] });
|
|
9623
9594
|
}
|
|
9624
9595
|
);
|
|
@@ -9626,12 +9597,12 @@ TextField.displayName = "TextField";
|
|
|
9626
9597
|
|
|
9627
9598
|
// src/textarea/Textarea.tsx
|
|
9628
9599
|
var import_react67 = require("react");
|
|
9629
|
-
var
|
|
9600
|
+
var import_jsx_runtime122 = require("react/jsx-runtime");
|
|
9630
9601
|
var Textarea = (0, import_react67.forwardRef)(
|
|
9631
9602
|
({ className, textareaClassName, label, disabled, name, invalid, ...textareaProps }, ref) => {
|
|
9632
9603
|
const inputId = (0, import_react67.useId)();
|
|
9633
|
-
return /* @__PURE__ */ (0,
|
|
9634
|
-
/* @__PURE__ */ (0,
|
|
9604
|
+
return /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)("div", { className: cn("relative", className), children: [
|
|
9605
|
+
/* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
|
|
9635
9606
|
"textarea",
|
|
9636
9607
|
{
|
|
9637
9608
|
ref,
|
|
@@ -9647,7 +9618,7 @@ var Textarea = (0, import_react67.forwardRef)(
|
|
|
9647
9618
|
...textareaProps
|
|
9648
9619
|
}
|
|
9649
9620
|
),
|
|
9650
|
-
label && /* @__PURE__ */ (0,
|
|
9621
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
|
|
9651
9622
|
"label",
|
|
9652
9623
|
{
|
|
9653
9624
|
htmlFor: inputId,
|
|
@@ -9665,34 +9636,34 @@ var Textarea = (0, import_react67.forwardRef)(
|
|
|
9665
9636
|
Textarea.displayName = "Textarea";
|
|
9666
9637
|
|
|
9667
9638
|
// src/three-dots-loader/ThreeDotsLoader.tsx
|
|
9668
|
-
var
|
|
9639
|
+
var import_jsx_runtime123 = require("react/jsx-runtime");
|
|
9669
9640
|
function Dots({
|
|
9670
9641
|
height,
|
|
9671
9642
|
width,
|
|
9672
9643
|
color
|
|
9673
9644
|
}) {
|
|
9674
|
-
return /* @__PURE__ */ (0,
|
|
9645
|
+
return /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(
|
|
9675
9646
|
"span",
|
|
9676
9647
|
{
|
|
9677
9648
|
className: "inline-flex items-center justify-center gap-[15%]",
|
|
9678
9649
|
style: { height, width },
|
|
9679
9650
|
"aria-hidden": "true",
|
|
9680
9651
|
children: [
|
|
9681
|
-
/* @__PURE__ */ (0,
|
|
9652
|
+
/* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
|
|
9682
9653
|
"span",
|
|
9683
9654
|
{
|
|
9684
9655
|
className: "h-[22%] w-[22%] animate-chekin-three-dots rounded-full [animation-delay:-0.32s]",
|
|
9685
9656
|
style: { backgroundColor: color }
|
|
9686
9657
|
}
|
|
9687
9658
|
),
|
|
9688
|
-
/* @__PURE__ */ (0,
|
|
9659
|
+
/* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
|
|
9689
9660
|
"span",
|
|
9690
9661
|
{
|
|
9691
9662
|
className: "h-[22%] w-[22%] animate-chekin-three-dots rounded-full [animation-delay:-0.16s]",
|
|
9692
9663
|
style: { backgroundColor: color }
|
|
9693
9664
|
}
|
|
9694
9665
|
),
|
|
9695
|
-
/* @__PURE__ */ (0,
|
|
9666
|
+
/* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
|
|
9696
9667
|
"span",
|
|
9697
9668
|
{
|
|
9698
9669
|
className: "h-[22%] w-[22%] animate-chekin-three-dots rounded-full",
|
|
@@ -9711,9 +9682,9 @@ function ThreeDotsLoader({
|
|
|
9711
9682
|
className,
|
|
9712
9683
|
labelPlacement = "right"
|
|
9713
9684
|
}) {
|
|
9714
|
-
const dots = /* @__PURE__ */ (0,
|
|
9685
|
+
const dots = /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(Dots, { color, height, width });
|
|
9715
9686
|
if (label) {
|
|
9716
|
-
return /* @__PURE__ */ (0,
|
|
9687
|
+
return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
|
|
9717
9688
|
"div",
|
|
9718
9689
|
{
|
|
9719
9690
|
className: cn(
|
|
@@ -9721,22 +9692,22 @@ function ThreeDotsLoader({
|
|
|
9721
9692
|
className
|
|
9722
9693
|
),
|
|
9723
9694
|
role: "progressbar",
|
|
9724
|
-
children: labelPlacement === "right" ? /* @__PURE__ */ (0,
|
|
9695
|
+
children: labelPlacement === "right" ? /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(import_jsx_runtime123.Fragment, { children: [
|
|
9725
9696
|
dots,
|
|
9726
|
-
/* @__PURE__ */ (0,
|
|
9727
|
-
] }) : /* @__PURE__ */ (0,
|
|
9728
|
-
/* @__PURE__ */ (0,
|
|
9697
|
+
/* @__PURE__ */ (0, import_jsx_runtime123.jsx)("div", { children: label })
|
|
9698
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(import_jsx_runtime123.Fragment, { children: [
|
|
9699
|
+
/* @__PURE__ */ (0, import_jsx_runtime123.jsx)("div", { children: label }),
|
|
9729
9700
|
dots
|
|
9730
9701
|
] })
|
|
9731
9702
|
}
|
|
9732
9703
|
);
|
|
9733
9704
|
}
|
|
9734
|
-
return /* @__PURE__ */ (0,
|
|
9705
|
+
return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)("div", { role: "progressbar", className, children: dots });
|
|
9735
9706
|
}
|
|
9736
9707
|
|
|
9737
9708
|
// src/uploaded-files-list/UploadedFilesList.tsx
|
|
9738
|
-
var
|
|
9739
|
-
var
|
|
9709
|
+
var import_lucide_react41 = require("lucide-react");
|
|
9710
|
+
var import_jsx_runtime124 = require("react/jsx-runtime");
|
|
9740
9711
|
function UploadedFilesList({
|
|
9741
9712
|
files,
|
|
9742
9713
|
onRemoveFile,
|
|
@@ -9745,20 +9716,20 @@ function UploadedFilesList({
|
|
|
9745
9716
|
if (!files.length) {
|
|
9746
9717
|
return null;
|
|
9747
9718
|
}
|
|
9748
|
-
return /* @__PURE__ */ (0,
|
|
9719
|
+
return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)("div", { className: cn("flex flex-wrap gap-2.5", className), children: files.map((file, index) => /* @__PURE__ */ (0, import_jsx_runtime124.jsxs)(
|
|
9749
9720
|
"div",
|
|
9750
9721
|
{
|
|
9751
9722
|
className: "flex cursor-default items-center gap-2 rounded border border-[var(--chekin-color-gray-2)] bg-[var(--chekin-color-surface-pressed)] py-1.5 pl-3 pr-1.5",
|
|
9752
9723
|
children: [
|
|
9753
|
-
/* @__PURE__ */ (0,
|
|
9754
|
-
/* @__PURE__ */ (0,
|
|
9724
|
+
/* @__PURE__ */ (0, import_jsx_runtime124.jsx)("span", { className: "text-nowrap text-sm font-medium leading-5 text-[var(--chekin-color-brand-navy)]", children: file.name }),
|
|
9725
|
+
/* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
|
|
9755
9726
|
"button",
|
|
9756
9727
|
{
|
|
9757
9728
|
type: "button",
|
|
9758
9729
|
onClick: () => onRemoveFile(file.name),
|
|
9759
9730
|
className: "flex h-[18px] w-[18px] shrink-0 cursor-pointer items-center justify-center rounded bg-[var(--chekin-color-gray-1)] transition-all hover:shadow-md active:opacity-95",
|
|
9760
9731
|
"aria-label": `Remove ${file.name}`,
|
|
9761
|
-
children: /* @__PURE__ */ (0,
|
|
9732
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(import_lucide_react41.X, { className: "h-3.5 w-3.5 text-white", strokeWidth: 3 })
|
|
9762
9733
|
}
|
|
9763
9734
|
)
|
|
9764
9735
|
]
|
|
@@ -9768,9 +9739,9 @@ function UploadedFilesList({
|
|
|
9768
9739
|
}
|
|
9769
9740
|
|
|
9770
9741
|
// src/wide-button/WideButton.tsx
|
|
9771
|
-
var
|
|
9742
|
+
var import_jsx_runtime125 = require("react/jsx-runtime");
|
|
9772
9743
|
function WideButton({ className, disabled, ...props }) {
|
|
9773
|
-
return /* @__PURE__ */ (0,
|
|
9744
|
+
return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
|
|
9774
9745
|
Button,
|
|
9775
9746
|
{
|
|
9776
9747
|
variant: "ghost",
|
|
@@ -9788,28 +9759,28 @@ function WideButton({ className, disabled, ...props }) {
|
|
|
9788
9759
|
|
|
9789
9760
|
// src/datepicker/DatePicker.tsx
|
|
9790
9761
|
var React33 = __toESM(require("react"), 1);
|
|
9791
|
-
var
|
|
9762
|
+
var import_lucide_react44 = require("lucide-react");
|
|
9792
9763
|
|
|
9793
9764
|
// src/drawer/Drawer.tsx
|
|
9794
9765
|
var React30 = __toESM(require("react"), 1);
|
|
9795
9766
|
var DialogPrimitive2 = __toESM(require("@radix-ui/react-dialog"), 1);
|
|
9796
9767
|
var import_react_draggable = __toESM(require("react-draggable"), 1);
|
|
9797
|
-
var
|
|
9768
|
+
var import_jsx_runtime126 = require("react/jsx-runtime");
|
|
9798
9769
|
var DRAWER_CLOSE_THRESHOLD = 72;
|
|
9799
9770
|
var DRAWER_MIN_OVERLAY_OPACITY = 0.1;
|
|
9800
9771
|
function Drawer({ ...props }) {
|
|
9801
|
-
return /* @__PURE__ */ (0,
|
|
9772
|
+
return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(DialogPrimitive2.Root, { "data-slot": "drawer", ...props });
|
|
9802
9773
|
}
|
|
9803
9774
|
function DrawerTrigger({ ...props }) {
|
|
9804
|
-
return /* @__PURE__ */ (0,
|
|
9775
|
+
return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(DialogPrimitive2.Trigger, { "data-slot": "drawer-trigger", ...props });
|
|
9805
9776
|
}
|
|
9806
9777
|
function DrawerPortal({ ...props }) {
|
|
9807
|
-
return /* @__PURE__ */ (0,
|
|
9778
|
+
return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(DialogPrimitive2.Portal, { "data-slot": "drawer-portal", ...props });
|
|
9808
9779
|
}
|
|
9809
9780
|
function DrawerClose({ ...props }) {
|
|
9810
|
-
return /* @__PURE__ */ (0,
|
|
9781
|
+
return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(DialogPrimitive2.Close, { "data-slot": "drawer-close", ...props });
|
|
9811
9782
|
}
|
|
9812
|
-
var DrawerOverlay = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
9783
|
+
var DrawerOverlay = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
|
|
9813
9784
|
DialogPrimitive2.Overlay,
|
|
9814
9785
|
{
|
|
9815
9786
|
ref,
|
|
@@ -9858,14 +9829,14 @@ var DrawerContent = React30.forwardRef(
|
|
|
9858
9829
|
},
|
|
9859
9830
|
[onClose]
|
|
9860
9831
|
);
|
|
9861
|
-
return /* @__PURE__ */ (0,
|
|
9862
|
-
lockScroll ? /* @__PURE__ */ (0,
|
|
9832
|
+
return /* @__PURE__ */ (0, import_jsx_runtime126.jsxs)(DrawerPortal, { container: finalContainer, children: [
|
|
9833
|
+
lockScroll ? /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
|
|
9863
9834
|
DrawerOverlay,
|
|
9864
9835
|
{
|
|
9865
9836
|
style: { opacity: overlayOpacity },
|
|
9866
9837
|
onClick: closeOnOverlayClick ? onClose : void 0
|
|
9867
9838
|
}
|
|
9868
|
-
) : /* @__PURE__ */ (0,
|
|
9839
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
|
|
9869
9840
|
"div",
|
|
9870
9841
|
{
|
|
9871
9842
|
className: cn(DrawerOverlayClasses),
|
|
@@ -9873,7 +9844,7 @@ var DrawerContent = React30.forwardRef(
|
|
|
9873
9844
|
onClick: closeOnOverlayClick ? onClose : void 0
|
|
9874
9845
|
}
|
|
9875
9846
|
),
|
|
9876
|
-
/* @__PURE__ */ (0,
|
|
9847
|
+
/* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
|
|
9877
9848
|
DialogPrimitive2.Content,
|
|
9878
9849
|
{
|
|
9879
9850
|
asChild: true,
|
|
@@ -9889,7 +9860,7 @@ var DrawerContent = React30.forwardRef(
|
|
|
9889
9860
|
}
|
|
9890
9861
|
},
|
|
9891
9862
|
...props,
|
|
9892
|
-
children: /* @__PURE__ */ (0,
|
|
9863
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime126.jsx)("div", { className: "fixed inset-x-0 bottom-0 top-auto z-50 outline-none", children: /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
|
|
9893
9864
|
import_react_draggable.default,
|
|
9894
9865
|
{
|
|
9895
9866
|
axis: "y",
|
|
@@ -9899,7 +9870,7 @@ var DrawerContent = React30.forwardRef(
|
|
|
9899
9870
|
onDrag: handleDrag,
|
|
9900
9871
|
onStop: handleStop,
|
|
9901
9872
|
position: { x: 0, y: dragOffsetY },
|
|
9902
|
-
children: /* @__PURE__ */ (0,
|
|
9873
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime126.jsxs)(
|
|
9903
9874
|
"div",
|
|
9904
9875
|
{
|
|
9905
9876
|
ref: nodeRef,
|
|
@@ -9908,15 +9879,15 @@ var DrawerContent = React30.forwardRef(
|
|
|
9908
9879
|
className
|
|
9909
9880
|
),
|
|
9910
9881
|
children: [
|
|
9911
|
-
showHandle && /* @__PURE__ */ (0,
|
|
9882
|
+
showHandle && /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
|
|
9912
9883
|
"div",
|
|
9913
9884
|
{
|
|
9914
9885
|
"data-drawer-handle": true,
|
|
9915
9886
|
className: "mx-auto flex h-8 w-24 cursor-grab touch-none items-center justify-center active:cursor-grabbing",
|
|
9916
|
-
children: /* @__PURE__ */ (0,
|
|
9887
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime126.jsx)("span", { className: "block h-1.5 w-12 rounded-full bg-[#D9D7D3]" })
|
|
9917
9888
|
}
|
|
9918
9889
|
),
|
|
9919
|
-
/* @__PURE__ */ (0,
|
|
9890
|
+
/* @__PURE__ */ (0, import_jsx_runtime126.jsx)("div", { className: "min-h-0 flex-1 overflow-y-auto", children })
|
|
9920
9891
|
]
|
|
9921
9892
|
}
|
|
9922
9893
|
)
|
|
@@ -9928,7 +9899,7 @@ var DrawerContent = React30.forwardRef(
|
|
|
9928
9899
|
}
|
|
9929
9900
|
);
|
|
9930
9901
|
DrawerContent.displayName = DialogPrimitive2.Content.displayName;
|
|
9931
|
-
var DrawerHeader = ({ className, ...props }) => /* @__PURE__ */ (0,
|
|
9902
|
+
var DrawerHeader = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
|
|
9932
9903
|
"div",
|
|
9933
9904
|
{
|
|
9934
9905
|
className: cn("flex flex-col gap-2 px-5 pt-2 text-center", className),
|
|
@@ -9936,9 +9907,9 @@ var DrawerHeader = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_r
|
|
|
9936
9907
|
}
|
|
9937
9908
|
);
|
|
9938
9909
|
DrawerHeader.displayName = "DrawerHeader";
|
|
9939
|
-
var DrawerFooter = ({ className, ...props }) => /* @__PURE__ */ (0,
|
|
9910
|
+
var DrawerFooter = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)("div", { className: cn("flex flex-col gap-2 p-5", className), ...props });
|
|
9940
9911
|
DrawerFooter.displayName = "DrawerFooter";
|
|
9941
|
-
var DrawerTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
9912
|
+
var DrawerTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
|
|
9942
9913
|
DialogPrimitive2.Title,
|
|
9943
9914
|
{
|
|
9944
9915
|
ref,
|
|
@@ -9948,7 +9919,7 @@ var DrawerTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
9948
9919
|
}
|
|
9949
9920
|
));
|
|
9950
9921
|
DrawerTitle.displayName = DialogPrimitive2.Title.displayName;
|
|
9951
|
-
var DrawerDescription = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
9922
|
+
var DrawerDescription = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
|
|
9952
9923
|
DialogPrimitive2.Description,
|
|
9953
9924
|
{
|
|
9954
9925
|
ref,
|
|
@@ -10381,7 +10352,7 @@ function useDatePickerWheel({
|
|
|
10381
10352
|
}
|
|
10382
10353
|
|
|
10383
10354
|
// src/datepicker/DatePickerWheelColumn.tsx
|
|
10384
|
-
var
|
|
10355
|
+
var import_jsx_runtime127 = require("react/jsx-runtime");
|
|
10385
10356
|
var spacerHeight = DATE_PICKER_OPTION_HEIGHT * DATE_PICKER_WHEEL_BUFFER_OPTIONS;
|
|
10386
10357
|
function DatePickerWheelColumn({
|
|
10387
10358
|
id,
|
|
@@ -10395,7 +10366,7 @@ function DatePickerWheelColumn({
|
|
|
10395
10366
|
onOptionSelect,
|
|
10396
10367
|
column
|
|
10397
10368
|
}) {
|
|
10398
|
-
return /* @__PURE__ */ (0,
|
|
10369
|
+
return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)("div", { className: "relative z-10 min-w-0", children: /* @__PURE__ */ (0, import_jsx_runtime127.jsxs)(
|
|
10399
10370
|
"div",
|
|
10400
10371
|
{
|
|
10401
10372
|
id,
|
|
@@ -10412,14 +10383,14 @@ function DatePickerWheelColumn({
|
|
|
10412
10383
|
WebkitOverflowScrolling: "touch"
|
|
10413
10384
|
},
|
|
10414
10385
|
children: [
|
|
10415
|
-
/* @__PURE__ */ (0,
|
|
10386
|
+
/* @__PURE__ */ (0, import_jsx_runtime127.jsx)("div", { style: { height: `${spacerHeight}px` } }),
|
|
10416
10387
|
items.map((item, index) => {
|
|
10417
10388
|
const { style } = getWheelOptionStyles(
|
|
10418
10389
|
index,
|
|
10419
10390
|
scrollTop,
|
|
10420
10391
|
DATE_PICKER_OPTION_HEIGHT
|
|
10421
10392
|
);
|
|
10422
|
-
return /* @__PURE__ */ (0,
|
|
10393
|
+
return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
|
|
10423
10394
|
"button",
|
|
10424
10395
|
{
|
|
10425
10396
|
id: `${id}-option-${index}`,
|
|
@@ -10435,14 +10406,14 @@ function DatePickerWheelColumn({
|
|
|
10435
10406
|
`${column}-${item}-${index}`
|
|
10436
10407
|
);
|
|
10437
10408
|
}),
|
|
10438
|
-
/* @__PURE__ */ (0,
|
|
10409
|
+
/* @__PURE__ */ (0, import_jsx_runtime127.jsx)("div", { style: { height: `${spacerHeight}px` } })
|
|
10439
10410
|
]
|
|
10440
10411
|
}
|
|
10441
10412
|
) });
|
|
10442
10413
|
}
|
|
10443
10414
|
|
|
10444
10415
|
// src/datepicker/DatePickerContent.tsx
|
|
10445
|
-
var
|
|
10416
|
+
var import_jsx_runtime128 = require("react/jsx-runtime");
|
|
10446
10417
|
function DatePickerBody({
|
|
10447
10418
|
baseId,
|
|
10448
10419
|
label,
|
|
@@ -10464,19 +10435,19 @@ function DatePickerBody({
|
|
|
10464
10435
|
onOptionSelect,
|
|
10465
10436
|
onDone
|
|
10466
10437
|
}) {
|
|
10467
|
-
return /* @__PURE__ */ (0,
|
|
10468
|
-
/* @__PURE__ */ (0,
|
|
10469
|
-
/* @__PURE__ */ (0,
|
|
10470
|
-
/* @__PURE__ */ (0,
|
|
10471
|
-
/* @__PURE__ */ (0,
|
|
10438
|
+
return /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)("div", { className: "px-6 pb-4 pt-1 bg-white", children: [
|
|
10439
|
+
/* @__PURE__ */ (0, import_jsx_runtime128.jsxs)("div", { className: "relative overflow-hidden rounded-[24px]", children: [
|
|
10440
|
+
/* @__PURE__ */ (0, import_jsx_runtime128.jsx)("div", { className: "pointer-events-none absolute inset-x-0 top-0 z-20 h-16 bg-gradient-to-b from-white via-white/80 to-transparent" }),
|
|
10441
|
+
/* @__PURE__ */ (0, import_jsx_runtime128.jsx)("div", { className: "pointer-events-none absolute inset-x-0 bottom-0 z-20 h-16 bg-gradient-to-t from-white via-white/80 to-transparent" }),
|
|
10442
|
+
/* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
|
|
10472
10443
|
"div",
|
|
10473
10444
|
{
|
|
10474
10445
|
"aria-hidden": true,
|
|
10475
10446
|
className: "pointer-events-none absolute inset-x-0 top-1/2 z-0 h-8 -translate-y-1/2 rounded-[12px] bg-black/[0.04]"
|
|
10476
10447
|
}
|
|
10477
10448
|
),
|
|
10478
|
-
/* @__PURE__ */ (0,
|
|
10479
|
-
/* @__PURE__ */ (0,
|
|
10449
|
+
/* @__PURE__ */ (0, import_jsx_runtime128.jsxs)("div", { className: "relative grid grid-cols-[1.35fr_0.7fr_1fr] gap-1", children: [
|
|
10450
|
+
/* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
|
|
10480
10451
|
DatePickerWheelColumn,
|
|
10481
10452
|
{
|
|
10482
10453
|
id: `${baseId}-month`,
|
|
@@ -10491,7 +10462,7 @@ function DatePickerBody({
|
|
|
10491
10462
|
onOptionSelect
|
|
10492
10463
|
}
|
|
10493
10464
|
),
|
|
10494
|
-
/* @__PURE__ */ (0,
|
|
10465
|
+
/* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
|
|
10495
10466
|
DatePickerWheelColumn,
|
|
10496
10467
|
{
|
|
10497
10468
|
id: `${baseId}-day`,
|
|
@@ -10506,7 +10477,7 @@ function DatePickerBody({
|
|
|
10506
10477
|
onOptionSelect
|
|
10507
10478
|
}
|
|
10508
10479
|
),
|
|
10509
|
-
/* @__PURE__ */ (0,
|
|
10480
|
+
/* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
|
|
10510
10481
|
DatePickerWheelColumn,
|
|
10511
10482
|
{
|
|
10512
10483
|
id: `${baseId}-year`,
|
|
@@ -10523,7 +10494,7 @@ function DatePickerBody({
|
|
|
10523
10494
|
)
|
|
10524
10495
|
] })
|
|
10525
10496
|
] }),
|
|
10526
|
-
/* @__PURE__ */ (0,
|
|
10497
|
+
/* @__PURE__ */ (0, import_jsx_runtime128.jsx)(Button, { type: "button", onClick: onDone, className: "mt-4 h-12 mb-8 w-full", children: doneLabel })
|
|
10527
10498
|
] });
|
|
10528
10499
|
}
|
|
10529
10500
|
function DatePickerContent({
|
|
@@ -10551,7 +10522,7 @@ function DatePickerContent({
|
|
|
10551
10522
|
onColumnKeyDown,
|
|
10552
10523
|
onOptionSelect
|
|
10553
10524
|
}) {
|
|
10554
|
-
const body = /* @__PURE__ */ (0,
|
|
10525
|
+
const body = /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
|
|
10555
10526
|
DatePickerBody,
|
|
10556
10527
|
{
|
|
10557
10528
|
baseId,
|
|
@@ -10576,27 +10547,27 @@ function DatePickerContent({
|
|
|
10576
10547
|
}
|
|
10577
10548
|
);
|
|
10578
10549
|
if (isMobile) {
|
|
10579
|
-
return /* @__PURE__ */ (0,
|
|
10550
|
+
return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(Drawer, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)(
|
|
10580
10551
|
DrawerContent,
|
|
10581
10552
|
{
|
|
10582
10553
|
onClose: () => onOpenChange(false),
|
|
10583
10554
|
className: "rounded-none rounded-t-[32px] border-0 p-0",
|
|
10584
10555
|
children: [
|
|
10585
|
-
/* @__PURE__ */ (0,
|
|
10586
|
-
/* @__PURE__ */ (0,
|
|
10556
|
+
/* @__PURE__ */ (0, import_jsx_runtime128.jsx)(DrawerTitle, { className: "sr-only", children: title }),
|
|
10557
|
+
/* @__PURE__ */ (0, import_jsx_runtime128.jsx)(DrawerDescription, { className: "sr-only", children: label }),
|
|
10587
10558
|
body
|
|
10588
10559
|
]
|
|
10589
10560
|
}
|
|
10590
10561
|
) });
|
|
10591
10562
|
}
|
|
10592
|
-
return /* @__PURE__ */ (0,
|
|
10563
|
+
return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(Dialog, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)(
|
|
10593
10564
|
DialogContent,
|
|
10594
10565
|
{
|
|
10595
10566
|
className: "max-w-[520px] rounded-[28px] border-0 p-0 shadow-xl",
|
|
10596
10567
|
showCloseButton: false,
|
|
10597
10568
|
children: [
|
|
10598
|
-
/* @__PURE__ */ (0,
|
|
10599
|
-
/* @__PURE__ */ (0,
|
|
10569
|
+
/* @__PURE__ */ (0, import_jsx_runtime128.jsx)(DialogTitle, { className: "sr-only", children: title }),
|
|
10570
|
+
/* @__PURE__ */ (0, import_jsx_runtime128.jsx)(DialogDescription, { className: "sr-only", children: label }),
|
|
10600
10571
|
body
|
|
10601
10572
|
]
|
|
10602
10573
|
}
|
|
@@ -10620,12 +10591,12 @@ var DEVICE = {
|
|
|
10620
10591
|
|
|
10621
10592
|
// src/field-trigger/FieldTrigger.tsx
|
|
10622
10593
|
var React32 = __toESM(require("react"), 1);
|
|
10623
|
-
var
|
|
10624
|
-
var
|
|
10594
|
+
var import_lucide_react43 = require("lucide-react");
|
|
10595
|
+
var import_react_i18next24 = require("react-i18next");
|
|
10625
10596
|
|
|
10626
10597
|
// src/field-error-message/FieldErrorMessage.tsx
|
|
10627
|
-
var
|
|
10628
|
-
var
|
|
10598
|
+
var import_lucide_react42 = require("lucide-react");
|
|
10599
|
+
var import_jsx_runtime129 = require("react/jsx-runtime");
|
|
10629
10600
|
function FieldErrorMessage({
|
|
10630
10601
|
id,
|
|
10631
10602
|
message,
|
|
@@ -10636,7 +10607,7 @@ function FieldErrorMessage({
|
|
|
10636
10607
|
}) {
|
|
10637
10608
|
const content = message ?? children;
|
|
10638
10609
|
if (!content) return null;
|
|
10639
|
-
return /* @__PURE__ */ (0,
|
|
10610
|
+
return /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(
|
|
10640
10611
|
"p",
|
|
10641
10612
|
{
|
|
10642
10613
|
id,
|
|
@@ -10648,21 +10619,21 @@ function FieldErrorMessage({
|
|
|
10648
10619
|
),
|
|
10649
10620
|
...props,
|
|
10650
10621
|
children: [
|
|
10651
|
-
/* @__PURE__ */ (0,
|
|
10652
|
-
|
|
10622
|
+
/* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
|
|
10623
|
+
import_lucide_react42.AlertCircle,
|
|
10653
10624
|
{
|
|
10654
10625
|
className: "h-[18px] w-[18px] shrink-0 text-white",
|
|
10655
10626
|
fill: "var(--error-message-color)"
|
|
10656
10627
|
}
|
|
10657
10628
|
),
|
|
10658
|
-
/* @__PURE__ */ (0,
|
|
10629
|
+
/* @__PURE__ */ (0, import_jsx_runtime129.jsx)("span", { children: content })
|
|
10659
10630
|
]
|
|
10660
10631
|
}
|
|
10661
10632
|
);
|
|
10662
10633
|
}
|
|
10663
10634
|
|
|
10664
10635
|
// src/field-trigger/FieldTrigger.tsx
|
|
10665
|
-
var
|
|
10636
|
+
var import_jsx_runtime130 = require("react/jsx-runtime");
|
|
10666
10637
|
var FieldTrigger = React32.forwardRef(
|
|
10667
10638
|
({
|
|
10668
10639
|
as = "button",
|
|
@@ -10694,20 +10665,20 @@ var FieldTrigger = React32.forwardRef(
|
|
|
10694
10665
|
onKeyDown,
|
|
10695
10666
|
...props
|
|
10696
10667
|
}, ref) => {
|
|
10697
|
-
const { t } = (0,
|
|
10668
|
+
const { t } = (0, import_react_i18next24.useTranslation)();
|
|
10698
10669
|
const hasValue = Boolean(valueText);
|
|
10699
10670
|
const isRaised = hasValue || forceFloatingLabel;
|
|
10700
10671
|
const optionalLabel = optional ? typeof optional === "string" ? optional : t("optional") : void 0;
|
|
10701
10672
|
const visibleLabelText = labelText ?? label;
|
|
10702
10673
|
const hasLabelMeta = Boolean(optionalLabel) || Boolean(tooltip);
|
|
10703
|
-
const resolvedLabelText = visibleLabelText && hasLabelMeta ? /* @__PURE__ */ (0,
|
|
10704
|
-
/* @__PURE__ */ (0,
|
|
10705
|
-
optionalLabel && /* @__PURE__ */ (0,
|
|
10674
|
+
const resolvedLabelText = visibleLabelText && hasLabelMeta ? /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("span", { className: "inline-flex max-w-full items-center gap-1.5 align-middle", children: [
|
|
10675
|
+
/* @__PURE__ */ (0, import_jsx_runtime130.jsx)("span", { className: "min-w-0 truncate", children: visibleLabelText }),
|
|
10676
|
+
optionalLabel && /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("span", { className: "shrink-0 text-[12px] relative top-[1px] font-normal leading-4 text-current opacity-70", children: [
|
|
10706
10677
|
"(",
|
|
10707
10678
|
optionalLabel,
|
|
10708
10679
|
")"
|
|
10709
10680
|
] }),
|
|
10710
|
-
tooltip && /* @__PURE__ */ (0,
|
|
10681
|
+
tooltip && /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
|
|
10711
10682
|
HelpTooltip,
|
|
10712
10683
|
{
|
|
10713
10684
|
content: tooltip,
|
|
@@ -10723,10 +10694,10 @@ var FieldTrigger = React32.forwardRef(
|
|
|
10723
10694
|
const hasInvalidState = Boolean(error);
|
|
10724
10695
|
const errorMessage = typeof error === "string" ? error : void 0;
|
|
10725
10696
|
const isBlocked = Boolean(disabled) || Boolean(loading);
|
|
10726
|
-
const resolvedTrailingAdornment = loading || trailingAdornment ? /* @__PURE__ */ (0,
|
|
10697
|
+
const resolvedTrailingAdornment = loading || trailingAdornment ? /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("span", { className: "flex items-center gap-2", children: [
|
|
10727
10698
|
trailingAdornment,
|
|
10728
|
-
loading && /* @__PURE__ */ (0,
|
|
10729
|
-
|
|
10699
|
+
loading && /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
|
|
10700
|
+
import_lucide_react43.Loader2,
|
|
10730
10701
|
{
|
|
10731
10702
|
"aria-hidden": "true",
|
|
10732
10703
|
className: "h-5 w-5 animate-spin text-[var(--chekin-color-gray-1)]"
|
|
@@ -10741,8 +10712,8 @@ var FieldTrigger = React32.forwardRef(
|
|
|
10741
10712
|
disabled ? "cursor-not-allowed opacity-50" : loading ? "cursor-progress" : isAirbnbVariant ? "cursor-pointer" : "cursor-text",
|
|
10742
10713
|
className
|
|
10743
10714
|
);
|
|
10744
|
-
const sharedContent = /* @__PURE__ */ (0,
|
|
10745
|
-
/* @__PURE__ */ (0,
|
|
10715
|
+
const sharedContent = /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(import_jsx_runtime130.Fragment, { children: [
|
|
10716
|
+
/* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(
|
|
10746
10717
|
"span",
|
|
10747
10718
|
{
|
|
10748
10719
|
className: cn(
|
|
@@ -10751,7 +10722,7 @@ var FieldTrigger = React32.forwardRef(
|
|
|
10751
10722
|
contentClassName
|
|
10752
10723
|
),
|
|
10753
10724
|
children: [
|
|
10754
|
-
/* @__PURE__ */ (0,
|
|
10725
|
+
/* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
|
|
10755
10726
|
"span",
|
|
10756
10727
|
{
|
|
10757
10728
|
id: labelId,
|
|
@@ -10764,7 +10735,7 @@ var FieldTrigger = React32.forwardRef(
|
|
|
10764
10735
|
children: animatedLabel
|
|
10765
10736
|
}
|
|
10766
10737
|
),
|
|
10767
|
-
children ? children : hasValue ? /* @__PURE__ */ (0,
|
|
10738
|
+
children ? children : hasValue ? /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
|
|
10768
10739
|
"span",
|
|
10769
10740
|
{
|
|
10770
10741
|
id: valueId,
|
|
@@ -10775,11 +10746,11 @@ var FieldTrigger = React32.forwardRef(
|
|
|
10775
10746
|
),
|
|
10776
10747
|
children: valueText
|
|
10777
10748
|
}
|
|
10778
|
-
) : /* @__PURE__ */ (0,
|
|
10749
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("span", { id: helperTextId, className: "sr-only", children: placeholder ?? label })
|
|
10779
10750
|
]
|
|
10780
10751
|
}
|
|
10781
10752
|
),
|
|
10782
|
-
resolvedTrailingAdornment && /* @__PURE__ */ (0,
|
|
10753
|
+
resolvedTrailingAdornment && /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
|
|
10783
10754
|
"span",
|
|
10784
10755
|
{
|
|
10785
10756
|
"aria-hidden": "true",
|
|
@@ -10791,9 +10762,9 @@ var FieldTrigger = React32.forwardRef(
|
|
|
10791
10762
|
}
|
|
10792
10763
|
)
|
|
10793
10764
|
] });
|
|
10794
|
-
return /* @__PURE__ */ (0,
|
|
10795
|
-
topLabel && /* @__PURE__ */ (0,
|
|
10796
|
-
as === "button" ? /* @__PURE__ */ (0,
|
|
10765
|
+
return /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("div", { className: "w-full", children: [
|
|
10766
|
+
topLabel && /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("p", { className: "mb-3 text-[16px] font-semibold leading-5 text-[#222222]", children: topLabel }),
|
|
10767
|
+
as === "button" ? /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
|
|
10797
10768
|
"button",
|
|
10798
10769
|
{
|
|
10799
10770
|
id,
|
|
@@ -10810,7 +10781,7 @@ var FieldTrigger = React32.forwardRef(
|
|
|
10810
10781
|
...props,
|
|
10811
10782
|
children: sharedContent
|
|
10812
10783
|
}
|
|
10813
|
-
) : /* @__PURE__ */ (0,
|
|
10784
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
|
|
10814
10785
|
"div",
|
|
10815
10786
|
{
|
|
10816
10787
|
id,
|
|
@@ -10827,14 +10798,14 @@ var FieldTrigger = React32.forwardRef(
|
|
|
10827
10798
|
children: sharedContent
|
|
10828
10799
|
}
|
|
10829
10800
|
),
|
|
10830
|
-
errorMessage && !hideErrorMessage && /* @__PURE__ */ (0,
|
|
10801
|
+
errorMessage && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(FieldErrorMessage, { id: errorId, message: errorMessage })
|
|
10831
10802
|
] });
|
|
10832
10803
|
}
|
|
10833
10804
|
);
|
|
10834
10805
|
FieldTrigger.displayName = "FieldTrigger";
|
|
10835
10806
|
|
|
10836
10807
|
// src/datepicker/DatePicker.tsx
|
|
10837
|
-
var
|
|
10808
|
+
var import_jsx_runtime131 = require("react/jsx-runtime");
|
|
10838
10809
|
var DEFAULT_MIN_DATE = new Date(1920, 0, 1);
|
|
10839
10810
|
var DatePicker = React33.forwardRef(
|
|
10840
10811
|
({
|
|
@@ -10951,8 +10922,8 @@ var DatePicker = React33.forwardRef(
|
|
|
10951
10922
|
setIsOpen(false);
|
|
10952
10923
|
}
|
|
10953
10924
|
}, [isBlocked]);
|
|
10954
|
-
return /* @__PURE__ */ (0,
|
|
10955
|
-
name && /* @__PURE__ */ (0,
|
|
10925
|
+
return /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)("div", { className: cn("relative w-full max-w-[var(--max-field-width)]", className), children: [
|
|
10926
|
+
name && /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
|
|
10956
10927
|
"input",
|
|
10957
10928
|
{
|
|
10958
10929
|
type: "hidden",
|
|
@@ -10960,7 +10931,7 @@ var DatePicker = React33.forwardRef(
|
|
|
10960
10931
|
value: resolvedValue ? formatDateInputValue(resolvedValue) : ""
|
|
10961
10932
|
}
|
|
10962
10933
|
),
|
|
10963
|
-
/* @__PURE__ */ (0,
|
|
10934
|
+
/* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
|
|
10964
10935
|
FieldTrigger,
|
|
10965
10936
|
{
|
|
10966
10937
|
id: triggerId,
|
|
@@ -10987,10 +10958,10 @@ var DatePicker = React33.forwardRef(
|
|
|
10987
10958
|
onClick: handleTriggerClick,
|
|
10988
10959
|
onKeyDown: handleTriggerKeyDown,
|
|
10989
10960
|
onBlur,
|
|
10990
|
-
trailingAdornment: /* @__PURE__ */ (0,
|
|
10961
|
+
trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(import_lucide_react44.Calendar, { className: "h-5 w-5 text-[#1F1F1B]", strokeWidth: 2 })
|
|
10991
10962
|
}
|
|
10992
10963
|
),
|
|
10993
|
-
/* @__PURE__ */ (0,
|
|
10964
|
+
/* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
|
|
10994
10965
|
DatePickerContent,
|
|
10995
10966
|
{
|
|
10996
10967
|
baseId: pickerId,
|
|
@@ -11024,7 +10995,7 @@ var DatePicker = React33.forwardRef(
|
|
|
11024
10995
|
DatePicker.displayName = "DatePicker";
|
|
11025
10996
|
|
|
11026
10997
|
// src/responsive-sheet/ResponsiveSheet.tsx
|
|
11027
|
-
var
|
|
10998
|
+
var import_jsx_runtime132 = require("react/jsx-runtime");
|
|
11028
10999
|
function ResponsiveSheet({
|
|
11029
11000
|
open,
|
|
11030
11001
|
onClose,
|
|
@@ -11059,7 +11030,7 @@ function ResponsiveSheet({
|
|
|
11059
11030
|
event.preventDefault();
|
|
11060
11031
|
}
|
|
11061
11032
|
};
|
|
11062
|
-
const content = /* @__PURE__ */ (0,
|
|
11033
|
+
const content = /* @__PURE__ */ (0, import_jsx_runtime132.jsxs)(
|
|
11063
11034
|
"div",
|
|
11064
11035
|
{
|
|
11065
11036
|
className: cn(
|
|
@@ -11067,7 +11038,7 @@ function ResponsiveSheet({
|
|
|
11067
11038
|
contentClassName
|
|
11068
11039
|
),
|
|
11069
11040
|
children: [
|
|
11070
|
-
title ? /* @__PURE__ */ (0,
|
|
11041
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(
|
|
11071
11042
|
"div",
|
|
11072
11043
|
{
|
|
11073
11044
|
className: cn(
|
|
@@ -11077,7 +11048,7 @@ function ResponsiveSheet({
|
|
|
11077
11048
|
children: title
|
|
11078
11049
|
}
|
|
11079
11050
|
) : null,
|
|
11080
|
-
description ? /* @__PURE__ */ (0,
|
|
11051
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(
|
|
11081
11052
|
"p",
|
|
11082
11053
|
{
|
|
11083
11054
|
className: cn(
|
|
@@ -11092,7 +11063,7 @@ function ResponsiveSheet({
|
|
|
11092
11063
|
}
|
|
11093
11064
|
);
|
|
11094
11065
|
if (isMobileMode) {
|
|
11095
|
-
return /* @__PURE__ */ (0,
|
|
11066
|
+
return /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(Drawer, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime132.jsxs)(
|
|
11096
11067
|
DrawerContent,
|
|
11097
11068
|
{
|
|
11098
11069
|
onClose,
|
|
@@ -11102,14 +11073,14 @@ function ResponsiveSheet({
|
|
|
11102
11073
|
onEscapeKeyDown: handleEscapeKeyDown,
|
|
11103
11074
|
className: cn(className, drawerClassName),
|
|
11104
11075
|
children: [
|
|
11105
|
-
title ? /* @__PURE__ */ (0,
|
|
11106
|
-
description ? /* @__PURE__ */ (0,
|
|
11076
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(DrawerTitle, { className: "sr-only", children: title }) : null,
|
|
11077
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(DrawerDescription, { className: "sr-only", children: description }) : null,
|
|
11107
11078
|
content
|
|
11108
11079
|
]
|
|
11109
11080
|
}
|
|
11110
11081
|
) });
|
|
11111
11082
|
}
|
|
11112
|
-
return /* @__PURE__ */ (0,
|
|
11083
|
+
return /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(Dialog, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime132.jsxs)(
|
|
11113
11084
|
DialogContent,
|
|
11114
11085
|
{
|
|
11115
11086
|
showCloseButton,
|
|
@@ -11119,8 +11090,8 @@ function ResponsiveSheet({
|
|
|
11119
11090
|
className: cn("max-w-[560px] border-0 p-0 shadow-xl", className, dialogClassName),
|
|
11120
11091
|
lockScroll: false,
|
|
11121
11092
|
children: [
|
|
11122
|
-
title ? /* @__PURE__ */ (0,
|
|
11123
|
-
description ? /* @__PURE__ */ (0,
|
|
11093
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(DialogTitle, { className: "sr-only", children: title }) : null,
|
|
11094
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(DialogDescription, { className: "sr-only", children: description }) : null,
|
|
11124
11095
|
content
|
|
11125
11096
|
]
|
|
11126
11097
|
}
|
|
@@ -11129,7 +11100,7 @@ function ResponsiveSheet({
|
|
|
11129
11100
|
|
|
11130
11101
|
// src/airbnb/input/Input.tsx
|
|
11131
11102
|
var React34 = __toESM(require("react"), 1);
|
|
11132
|
-
var
|
|
11103
|
+
var import_jsx_runtime133 = require("react/jsx-runtime");
|
|
11133
11104
|
var getInputValue = (value) => value != null ? String(value) : "";
|
|
11134
11105
|
var AirbnbInput = React34.forwardRef(
|
|
11135
11106
|
({
|
|
@@ -11212,7 +11183,7 @@ var AirbnbInput = React34.forwardRef(
|
|
|
11212
11183
|
setIsFocused(false);
|
|
11213
11184
|
onBlur?.(event);
|
|
11214
11185
|
};
|
|
11215
|
-
return /* @__PURE__ */ (0,
|
|
11186
|
+
return /* @__PURE__ */ (0, import_jsx_runtime133.jsx)("div", { className: cn("w-full max-w-[var(--max-field-width)]", wrapperClassName), children: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
|
|
11216
11187
|
FieldTrigger,
|
|
11217
11188
|
{
|
|
11218
11189
|
as: "div",
|
|
@@ -11244,7 +11215,7 @@ var AirbnbInput = React34.forwardRef(
|
|
|
11244
11215
|
forceFloatingLabel: shouldShowLabel,
|
|
11245
11216
|
forceLabelText: hasLabelMeta,
|
|
11246
11217
|
hideErrorMessage: !renderErrorMessage,
|
|
11247
|
-
children: /* @__PURE__ */ (0,
|
|
11218
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
|
|
11248
11219
|
"input",
|
|
11249
11220
|
{
|
|
11250
11221
|
...props,
|
|
@@ -11281,13 +11252,13 @@ AirbnbInput.displayName = "Input";
|
|
|
11281
11252
|
|
|
11282
11253
|
// src/airbnb/phone-field/PhoneField.tsx
|
|
11283
11254
|
var React40 = __toESM(require("react"), 1);
|
|
11284
|
-
var
|
|
11255
|
+
var import_lucide_react46 = require("lucide-react");
|
|
11285
11256
|
|
|
11286
11257
|
// src/airbnb/select/Select.tsx
|
|
11287
11258
|
var React39 = __toESM(require("react"), 1);
|
|
11288
11259
|
|
|
11289
11260
|
// src/airbnb/select/SelectDesktopMenu.tsx
|
|
11290
|
-
var
|
|
11261
|
+
var import_jsx_runtime134 = require("react/jsx-runtime");
|
|
11291
11262
|
function SelectDesktopMenu({
|
|
11292
11263
|
id,
|
|
11293
11264
|
options,
|
|
@@ -11306,7 +11277,7 @@ function SelectDesktopMenu({
|
|
|
11306
11277
|
noOptionsMessage
|
|
11307
11278
|
}) {
|
|
11308
11279
|
const emptyMessage = noOptionsMessage?.();
|
|
11309
|
-
return /* @__PURE__ */ (0,
|
|
11280
|
+
return /* @__PURE__ */ (0, import_jsx_runtime134.jsxs)(
|
|
11310
11281
|
"div",
|
|
11311
11282
|
{
|
|
11312
11283
|
id,
|
|
@@ -11319,12 +11290,12 @@ function SelectDesktopMenu({
|
|
|
11319
11290
|
onKeyDown,
|
|
11320
11291
|
className: cn("max-h-[280px] overflow-y-auto p-2 outline-none", menuClassName),
|
|
11321
11292
|
children: [
|
|
11322
|
-
options.length === 0 && emptyMessage ? /* @__PURE__ */ (0,
|
|
11293
|
+
options.length === 0 && emptyMessage ? /* @__PURE__ */ (0, import_jsx_runtime134.jsx)("div", { className: "px-4 py-3 text-base leading-6 text-[#6C6C6C]", children: emptyMessage }) : null,
|
|
11323
11294
|
options.map((option, index) => {
|
|
11324
11295
|
const isSelected = selectedValue?.value === option.value;
|
|
11325
11296
|
const isHighlighted = index === highlightedIndex;
|
|
11326
11297
|
const optionKey = `${String(option.value)}-${index}`;
|
|
11327
|
-
return /* @__PURE__ */ (0,
|
|
11298
|
+
return /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(
|
|
11328
11299
|
"button",
|
|
11329
11300
|
{
|
|
11330
11301
|
id: getOptionId2(index),
|
|
@@ -11356,7 +11327,7 @@ function SelectDesktopMenu({
|
|
|
11356
11327
|
}
|
|
11357
11328
|
|
|
11358
11329
|
// src/airbnb/select/SelectDesktopContent.tsx
|
|
11359
|
-
var
|
|
11330
|
+
var import_jsx_runtime135 = require("react/jsx-runtime");
|
|
11360
11331
|
function SelectDesktopContent({
|
|
11361
11332
|
isOpen,
|
|
11362
11333
|
listboxId,
|
|
@@ -11377,14 +11348,14 @@ function SelectDesktopContent({
|
|
|
11377
11348
|
noOptionsMessage
|
|
11378
11349
|
}) {
|
|
11379
11350
|
if (!isOpen) return null;
|
|
11380
|
-
return /* @__PURE__ */ (0,
|
|
11351
|
+
return /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
|
|
11381
11352
|
"div",
|
|
11382
11353
|
{
|
|
11383
11354
|
className: cn(
|
|
11384
11355
|
"absolute left-0 right-0 top-[calc(100%+8px)] z-20 overflow-hidden rounded-[20px] border border-[#DEDAD2] bg-white shadow-[0_14px_30px_rgba(18,18,18,0.08)]",
|
|
11385
11356
|
dropdownClassName
|
|
11386
11357
|
),
|
|
11387
|
-
children: /* @__PURE__ */ (0,
|
|
11358
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
|
|
11388
11359
|
SelectDesktopMenu,
|
|
11389
11360
|
{
|
|
11390
11361
|
id: listboxId,
|
|
@@ -11482,7 +11453,7 @@ function getMobileOptionStyles(index, scrollTop) {
|
|
|
11482
11453
|
}
|
|
11483
11454
|
|
|
11484
11455
|
// src/airbnb/select/SelectMobileWheel.tsx
|
|
11485
|
-
var
|
|
11456
|
+
var import_jsx_runtime136 = require("react/jsx-runtime");
|
|
11486
11457
|
function SelectMobileWheel({
|
|
11487
11458
|
id,
|
|
11488
11459
|
options,
|
|
@@ -11501,7 +11472,7 @@ function SelectMobileWheel({
|
|
|
11501
11472
|
}) {
|
|
11502
11473
|
const spacerHeight2 = getWheelSpacerHeight();
|
|
11503
11474
|
const emptyMessage = noOptionsMessage?.();
|
|
11504
|
-
return /* @__PURE__ */ (0,
|
|
11475
|
+
return /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(
|
|
11505
11476
|
"div",
|
|
11506
11477
|
{
|
|
11507
11478
|
id,
|
|
@@ -11513,10 +11484,10 @@ function SelectMobileWheel({
|
|
|
11513
11484
|
onKeyDown,
|
|
11514
11485
|
className: cn("relative overflow-hidden outline-none", menuClassName),
|
|
11515
11486
|
children: [
|
|
11516
|
-
options.length === 0 && emptyMessage ? /* @__PURE__ */ (0,
|
|
11517
|
-
/* @__PURE__ */ (0,
|
|
11518
|
-
/* @__PURE__ */ (0,
|
|
11519
|
-
/* @__PURE__ */ (0,
|
|
11487
|
+
options.length === 0 && emptyMessage ? /* @__PURE__ */ (0, import_jsx_runtime136.jsx)("div", { className: "flex min-h-[160px] items-center justify-center px-4 text-center text-base leading-6 text-[#6C6C6C]", children: emptyMessage }) : null,
|
|
11488
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)("div", { className: "pointer-events-none absolute inset-x-0 top-0 h-16 bg-gradient-to-b from-white via-white/80 to-transparent" }),
|
|
11489
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)("div", { className: "pointer-events-none absolute inset-x-0 bottom-0 h-16 bg-gradient-to-t from-white via-white/80 to-transparent" }),
|
|
11490
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
|
|
11520
11491
|
"div",
|
|
11521
11492
|
{
|
|
11522
11493
|
"aria-hidden": true,
|
|
@@ -11526,7 +11497,7 @@ function SelectMobileWheel({
|
|
|
11526
11497
|
)
|
|
11527
11498
|
}
|
|
11528
11499
|
),
|
|
11529
|
-
/* @__PURE__ */ (0,
|
|
11500
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(
|
|
11530
11501
|
"div",
|
|
11531
11502
|
{
|
|
11532
11503
|
ref: listRef,
|
|
@@ -11541,11 +11512,11 @@ function SelectMobileWheel({
|
|
|
11541
11512
|
WebkitOverflowScrolling: "touch"
|
|
11542
11513
|
},
|
|
11543
11514
|
children: [
|
|
11544
|
-
/* @__PURE__ */ (0,
|
|
11515
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)("div", { style: { height: `${spacerHeight2}px` } }),
|
|
11545
11516
|
options.map((option, index) => {
|
|
11546
11517
|
const { distance, style } = getMobileOptionStyles(index, scrollTop);
|
|
11547
11518
|
const optionKey = `${String(option.value)}-${index}`;
|
|
11548
|
-
return /* @__PURE__ */ (0,
|
|
11519
|
+
return /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
|
|
11549
11520
|
"button",
|
|
11550
11521
|
{
|
|
11551
11522
|
id: getOptionId2(index),
|
|
@@ -11566,7 +11537,7 @@ function SelectMobileWheel({
|
|
|
11566
11537
|
optionKey
|
|
11567
11538
|
);
|
|
11568
11539
|
}),
|
|
11569
|
-
/* @__PURE__ */ (0,
|
|
11540
|
+
/* @__PURE__ */ (0, import_jsx_runtime136.jsx)("div", { style: { height: `${spacerHeight2}px` } })
|
|
11570
11541
|
]
|
|
11571
11542
|
}
|
|
11572
11543
|
)
|
|
@@ -11576,7 +11547,7 @@ function SelectMobileWheel({
|
|
|
11576
11547
|
}
|
|
11577
11548
|
|
|
11578
11549
|
// src/airbnb/select/SelectMobileContent.tsx
|
|
11579
|
-
var
|
|
11550
|
+
var import_jsx_runtime137 = require("react/jsx-runtime");
|
|
11580
11551
|
function SelectMobileContent({
|
|
11581
11552
|
open,
|
|
11582
11553
|
onOpenChange,
|
|
@@ -11600,11 +11571,11 @@ function SelectMobileContent({
|
|
|
11600
11571
|
getOptionId: getOptionId2,
|
|
11601
11572
|
noOptionsMessage
|
|
11602
11573
|
}) {
|
|
11603
|
-
return /* @__PURE__ */ (0,
|
|
11604
|
-
/* @__PURE__ */ (0,
|
|
11605
|
-
/* @__PURE__ */ (0,
|
|
11606
|
-
/* @__PURE__ */ (0,
|
|
11607
|
-
/* @__PURE__ */ (0,
|
|
11574
|
+
return /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(Drawer, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime137.jsxs)(DrawerContent, { onClose, lockScroll: false, children: [
|
|
11575
|
+
/* @__PURE__ */ (0, import_jsx_runtime137.jsx)(DrawerTitle, { className: "sr-only", children: mobileTitle ?? label }),
|
|
11576
|
+
/* @__PURE__ */ (0, import_jsx_runtime137.jsx)(DrawerDescription, { className: "sr-only", children: label }),
|
|
11577
|
+
/* @__PURE__ */ (0, import_jsx_runtime137.jsxs)("div", { className: "px-6 pb-4 pt-1", children: [
|
|
11578
|
+
/* @__PURE__ */ (0, import_jsx_runtime137.jsx)(
|
|
11608
11579
|
SelectMobileWheel,
|
|
11609
11580
|
{
|
|
11610
11581
|
id: listboxId,
|
|
@@ -11623,15 +11594,15 @@ function SelectMobileContent({
|
|
|
11623
11594
|
noOptionsMessage
|
|
11624
11595
|
}
|
|
11625
11596
|
),
|
|
11626
|
-
/* @__PURE__ */ (0,
|
|
11597
|
+
/* @__PURE__ */ (0, import_jsx_runtime137.jsx)(Button, { type: "button", onClick: onDone, className: "mt-4 h-12 mb-8 w-full", children: doneLabel })
|
|
11627
11598
|
] })
|
|
11628
11599
|
] }) });
|
|
11629
11600
|
}
|
|
11630
11601
|
|
|
11631
11602
|
// src/airbnb/select/SelectTrigger.tsx
|
|
11632
11603
|
var React35 = __toESM(require("react"), 1);
|
|
11633
|
-
var
|
|
11634
|
-
var
|
|
11604
|
+
var import_lucide_react45 = require("lucide-react");
|
|
11605
|
+
var import_jsx_runtime138 = require("react/jsx-runtime");
|
|
11635
11606
|
var SelectTrigger2 = React35.forwardRef(
|
|
11636
11607
|
({
|
|
11637
11608
|
id,
|
|
@@ -11657,7 +11628,7 @@ var SelectTrigger2 = React35.forwardRef(
|
|
|
11657
11628
|
onKeyDown,
|
|
11658
11629
|
onBlur
|
|
11659
11630
|
}, ref) => {
|
|
11660
|
-
return /* @__PURE__ */ (0,
|
|
11631
|
+
return /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
|
|
11661
11632
|
FieldTrigger,
|
|
11662
11633
|
{
|
|
11663
11634
|
id,
|
|
@@ -11686,8 +11657,8 @@ var SelectTrigger2 = React35.forwardRef(
|
|
|
11686
11657
|
onClick,
|
|
11687
11658
|
onKeyDown,
|
|
11688
11659
|
onBlur,
|
|
11689
|
-
trailingAdornment: /* @__PURE__ */ (0,
|
|
11690
|
-
|
|
11660
|
+
trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
|
|
11661
|
+
import_lucide_react45.ChevronDown,
|
|
11691
11662
|
{
|
|
11692
11663
|
className: open ? "h-6 w-6 rotate-180 text-[#1F1F1B] transition-transform" : "h-6 w-6 text-[#1F1F1B] transition-transform"
|
|
11693
11664
|
}
|
|
@@ -12048,7 +12019,7 @@ function useSelectIds({ name, hasValue, error, hideErrorMessage }) {
|
|
|
12048
12019
|
}
|
|
12049
12020
|
|
|
12050
12021
|
// src/airbnb/select/Select.tsx
|
|
12051
|
-
var
|
|
12022
|
+
var import_jsx_runtime139 = require("react/jsx-runtime");
|
|
12052
12023
|
var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
|
|
12053
12024
|
options = [],
|
|
12054
12025
|
value,
|
|
@@ -12225,13 +12196,13 @@ var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
|
|
|
12225
12196
|
handleMobileOpenChange(false);
|
|
12226
12197
|
}
|
|
12227
12198
|
};
|
|
12228
|
-
return /* @__PURE__ */ (0,
|
|
12199
|
+
return /* @__PURE__ */ (0, import_jsx_runtime139.jsxs)(
|
|
12229
12200
|
"div",
|
|
12230
12201
|
{
|
|
12231
12202
|
ref: containerRef,
|
|
12232
12203
|
className: cn("relative w-full max-w-[var(--max-field-width)]", className),
|
|
12233
12204
|
children: [
|
|
12234
|
-
name && /* @__PURE__ */ (0,
|
|
12205
|
+
name && /* @__PURE__ */ (0, import_jsx_runtime139.jsx)("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
|
|
12235
12206
|
renderTrigger ? renderTrigger({
|
|
12236
12207
|
id: triggerId,
|
|
12237
12208
|
open: isOpen,
|
|
@@ -12253,7 +12224,7 @@ var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
|
|
|
12253
12224
|
onClick: handleTriggerClick,
|
|
12254
12225
|
onKeyDown: handleRootTriggerKeyDown,
|
|
12255
12226
|
onBlur
|
|
12256
|
-
}) : /* @__PURE__ */ (0,
|
|
12227
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(
|
|
12257
12228
|
SelectTrigger2,
|
|
12258
12229
|
{
|
|
12259
12230
|
id: triggerId,
|
|
@@ -12281,7 +12252,7 @@ var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
|
|
|
12281
12252
|
onBlur
|
|
12282
12253
|
}
|
|
12283
12254
|
),
|
|
12284
|
-
isMobile ? /* @__PURE__ */ (0,
|
|
12255
|
+
isMobile ? /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(
|
|
12285
12256
|
SelectMobileContent,
|
|
12286
12257
|
{
|
|
12287
12258
|
open: isOpen,
|
|
@@ -12306,7 +12277,7 @@ var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
|
|
|
12306
12277
|
getOptionId: getOptionId2,
|
|
12307
12278
|
noOptionsMessage
|
|
12308
12279
|
}
|
|
12309
|
-
) : /* @__PURE__ */ (0,
|
|
12280
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(
|
|
12310
12281
|
SelectDesktopContent,
|
|
12311
12282
|
{
|
|
12312
12283
|
isOpen,
|
|
@@ -12340,7 +12311,7 @@ var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
|
|
|
12340
12311
|
});
|
|
12341
12312
|
|
|
12342
12313
|
// src/airbnb/phone-field/PhoneField.tsx
|
|
12343
|
-
var
|
|
12314
|
+
var import_jsx_runtime140 = require("react/jsx-runtime");
|
|
12344
12315
|
function formatPhoneCodeOptionLabel(option) {
|
|
12345
12316
|
const label = String(option.label);
|
|
12346
12317
|
const value = String(option.value);
|
|
@@ -12387,9 +12358,9 @@ var PhoneField = React40.forwardRef(
|
|
|
12387
12358
|
const hasInvalidState = Boolean(error) || Boolean(invalid);
|
|
12388
12359
|
const isBlocked = Boolean(disabled) || Boolean(loading);
|
|
12389
12360
|
const isCodeBlocked = isBlocked || Boolean(codeReadOnly);
|
|
12390
|
-
return /* @__PURE__ */ (0,
|
|
12391
|
-
name && /* @__PURE__ */ (0,
|
|
12392
|
-
codeName && /* @__PURE__ */ (0,
|
|
12361
|
+
return /* @__PURE__ */ (0, import_jsx_runtime140.jsxs)("div", { className: cn("w-full max-w-[var(--max-field-width)]", className), children: [
|
|
12362
|
+
name && /* @__PURE__ */ (0, import_jsx_runtime140.jsx)("input", { type: "hidden", name, value: combinedValue, disabled }),
|
|
12363
|
+
codeName && /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
|
|
12393
12364
|
"input",
|
|
12394
12365
|
{
|
|
12395
12366
|
type: "hidden",
|
|
@@ -12398,7 +12369,7 @@ var PhoneField = React40.forwardRef(
|
|
|
12398
12369
|
disabled
|
|
12399
12370
|
}
|
|
12400
12371
|
),
|
|
12401
|
-
numberName && /* @__PURE__ */ (0,
|
|
12372
|
+
numberName && /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
|
|
12402
12373
|
"input",
|
|
12403
12374
|
{
|
|
12404
12375
|
type: "hidden",
|
|
@@ -12407,7 +12378,7 @@ var PhoneField = React40.forwardRef(
|
|
|
12407
12378
|
disabled
|
|
12408
12379
|
}
|
|
12409
12380
|
),
|
|
12410
|
-
topLabel && /* @__PURE__ */ (0,
|
|
12381
|
+
topLabel && /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
|
|
12411
12382
|
"label",
|
|
12412
12383
|
{
|
|
12413
12384
|
htmlFor: inputId,
|
|
@@ -12415,8 +12386,8 @@ var PhoneField = React40.forwardRef(
|
|
|
12415
12386
|
children: topLabel
|
|
12416
12387
|
}
|
|
12417
12388
|
),
|
|
12418
|
-
/* @__PURE__ */ (0,
|
|
12419
|
-
/* @__PURE__ */ (0,
|
|
12389
|
+
/* @__PURE__ */ (0, import_jsx_runtime140.jsxs)("div", { className: "flex items-stretch", children: [
|
|
12390
|
+
/* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
|
|
12420
12391
|
AirbnbSelect,
|
|
12421
12392
|
{
|
|
12422
12393
|
ref,
|
|
@@ -12447,7 +12418,7 @@ var PhoneField = React40.forwardRef(
|
|
|
12447
12418
|
onClick,
|
|
12448
12419
|
onKeyDown,
|
|
12449
12420
|
valueLabel
|
|
12450
|
-
}) => /* @__PURE__ */ (0,
|
|
12421
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime140.jsxs)(
|
|
12451
12422
|
"button",
|
|
12452
12423
|
{
|
|
12453
12424
|
id,
|
|
@@ -12469,9 +12440,9 @@ var PhoneField = React40.forwardRef(
|
|
|
12469
12440
|
triggerDisabled ? "cursor-not-allowed opacity-50" : triggerLoading ? "cursor-progress" : "cursor-pointer"
|
|
12470
12441
|
),
|
|
12471
12442
|
children: [
|
|
12472
|
-
/* @__PURE__ */ (0,
|
|
12473
|
-
/* @__PURE__ */ (0,
|
|
12474
|
-
|
|
12443
|
+
/* @__PURE__ */ (0, import_jsx_runtime140.jsx)("span", { children: valueLabel ?? codePlaceholder }),
|
|
12444
|
+
/* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
|
|
12445
|
+
import_lucide_react46.ChevronDown,
|
|
12475
12446
|
{
|
|
12476
12447
|
className: cn("h-5 w-5 transition-transform", open ? "rotate-180" : ""),
|
|
12477
12448
|
strokeWidth: 2
|
|
@@ -12482,7 +12453,7 @@ var PhoneField = React40.forwardRef(
|
|
|
12482
12453
|
)
|
|
12483
12454
|
}
|
|
12484
12455
|
),
|
|
12485
|
-
/* @__PURE__ */ (0,
|
|
12456
|
+
/* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
|
|
12486
12457
|
AirbnbInput,
|
|
12487
12458
|
{
|
|
12488
12459
|
id: inputId,
|
|
@@ -12514,7 +12485,7 @@ var PhoneField = React40.forwardRef(
|
|
|
12514
12485
|
}
|
|
12515
12486
|
)
|
|
12516
12487
|
] }),
|
|
12517
|
-
error && /* @__PURE__ */ (0,
|
|
12488
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(FieldErrorMessage, { message: error })
|
|
12518
12489
|
] });
|
|
12519
12490
|
}
|
|
12520
12491
|
);
|
|
@@ -12522,15 +12493,15 @@ PhoneField.displayName = "PhoneField";
|
|
|
12522
12493
|
|
|
12523
12494
|
// src/airbnb/search-input/SearchInput.tsx
|
|
12524
12495
|
var React41 = __toESM(require("react"), 1);
|
|
12525
|
-
var
|
|
12526
|
-
var
|
|
12527
|
-
var
|
|
12496
|
+
var import_react_i18next25 = require("react-i18next");
|
|
12497
|
+
var import_lucide_react47 = require("lucide-react");
|
|
12498
|
+
var import_jsx_runtime141 = require("react/jsx-runtime");
|
|
12528
12499
|
var AirbnbSearchInput = React41.forwardRef(({ onReset, placeholder, wrapperClassName, ...props }, ref) => {
|
|
12529
|
-
const { t } = (0,
|
|
12500
|
+
const { t } = (0, import_react_i18next25.useTranslation)();
|
|
12530
12501
|
const placeholderText = placeholder || t("search_property") + "...";
|
|
12531
|
-
return /* @__PURE__ */ (0,
|
|
12532
|
-
/* @__PURE__ */ (0,
|
|
12533
|
-
/* @__PURE__ */ (0,
|
|
12502
|
+
return /* @__PURE__ */ (0, import_jsx_runtime141.jsxs)("div", { className: cn("input-wrapper relative", wrapperClassName), children: [
|
|
12503
|
+
/* @__PURE__ */ (0, import_jsx_runtime141.jsx)(import_lucide_react47.Search, { className: "absolute left-4 top-1/2 h-5 w-5 -translate-y-1/2 transform text-[#9696B9]" }),
|
|
12504
|
+
/* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
|
|
12534
12505
|
"input",
|
|
12535
12506
|
{
|
|
12536
12507
|
...props,
|
|
@@ -12549,13 +12520,13 @@ var AirbnbSearchInput = React41.forwardRef(({ onReset, placeholder, wrapperClass
|
|
|
12549
12520
|
)
|
|
12550
12521
|
}
|
|
12551
12522
|
),
|
|
12552
|
-
onReset && /* @__PURE__ */ (0,
|
|
12523
|
+
onReset && /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
|
|
12553
12524
|
Button,
|
|
12554
12525
|
{
|
|
12555
12526
|
variant: "ghost",
|
|
12556
12527
|
onClick: onReset,
|
|
12557
12528
|
className: "absolute right-0 top-1/2 h-5 w-5 -translate-y-1/2 transform text-[#9696B9]",
|
|
12558
|
-
children: /* @__PURE__ */ (0,
|
|
12529
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(import_lucide_react47.X, { className: "h-5 w-5" })
|
|
12559
12530
|
}
|
|
12560
12531
|
)
|
|
12561
12532
|
] });
|
|
@@ -12564,10 +12535,10 @@ AirbnbSearchInput.displayName = "SearchInput";
|
|
|
12564
12535
|
|
|
12565
12536
|
// src/searchable-select/SearchableSelect.tsx
|
|
12566
12537
|
var React42 = __toESM(require("react"), 1);
|
|
12567
|
-
var
|
|
12538
|
+
var import_lucide_react48 = require("lucide-react");
|
|
12568
12539
|
var import_react_virtual2 = require("@tanstack/react-virtual");
|
|
12569
12540
|
var import_react68 = require("react");
|
|
12570
|
-
var
|
|
12541
|
+
var import_jsx_runtime142 = require("react/jsx-runtime");
|
|
12571
12542
|
var ROW_HEIGHT = 48;
|
|
12572
12543
|
var DESKTOP_LIST_HEIGHT = 280;
|
|
12573
12544
|
var MOBILE_LIST_HEIGHT = 420;
|
|
@@ -12736,7 +12707,7 @@ var SearchableSelectInternal = ({
|
|
|
12736
12707
|
}
|
|
12737
12708
|
}
|
|
12738
12709
|
}
|
|
12739
|
-
const content = /* @__PURE__ */ (0,
|
|
12710
|
+
const content = /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
|
|
12740
12711
|
SearchableSelectContent,
|
|
12741
12712
|
{
|
|
12742
12713
|
inputId: searchInputId,
|
|
@@ -12764,9 +12735,9 @@ var SearchableSelectInternal = ({
|
|
|
12764
12735
|
}
|
|
12765
12736
|
);
|
|
12766
12737
|
React42.useImperativeHandle(ref, () => triggerRef.current, []);
|
|
12767
|
-
return /* @__PURE__ */ (0,
|
|
12768
|
-
name && /* @__PURE__ */ (0,
|
|
12769
|
-
/* @__PURE__ */ (0,
|
|
12738
|
+
return /* @__PURE__ */ (0, import_jsx_runtime142.jsxs)("div", { ref: containerRef, className: cn("relative w-full max-w-[425px]", className), children: [
|
|
12739
|
+
name && /* @__PURE__ */ (0, import_jsx_runtime142.jsx)("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
|
|
12740
|
+
/* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
|
|
12770
12741
|
FieldTrigger,
|
|
12771
12742
|
{
|
|
12772
12743
|
id: `${reactId}-trigger`,
|
|
@@ -12801,8 +12772,8 @@ var SearchableSelectInternal = ({
|
|
|
12801
12772
|
},
|
|
12802
12773
|
onKeyDown: handleTriggerKeyDown,
|
|
12803
12774
|
onBlur,
|
|
12804
|
-
trailingAdornment: /* @__PURE__ */ (0,
|
|
12805
|
-
|
|
12775
|
+
trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
|
|
12776
|
+
import_lucide_react48.ChevronDown,
|
|
12806
12777
|
{
|
|
12807
12778
|
className: cn(
|
|
12808
12779
|
"h-6 w-6 text-[#1F1F1B] transition-transform",
|
|
@@ -12812,7 +12783,7 @@ var SearchableSelectInternal = ({
|
|
|
12812
12783
|
)
|
|
12813
12784
|
}
|
|
12814
12785
|
),
|
|
12815
|
-
isMobile ? /* @__PURE__ */ (0,
|
|
12786
|
+
isMobile ? /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
|
|
12816
12787
|
Drawer,
|
|
12817
12788
|
{
|
|
12818
12789
|
open,
|
|
@@ -12824,13 +12795,13 @@ var SearchableSelectInternal = ({
|
|
|
12824
12795
|
}
|
|
12825
12796
|
closeSelect();
|
|
12826
12797
|
},
|
|
12827
|
-
children: /* @__PURE__ */ (0,
|
|
12828
|
-
/* @__PURE__ */ (0,
|
|
12829
|
-
/* @__PURE__ */ (0,
|
|
12830
|
-
/* @__PURE__ */ (0,
|
|
12798
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime142.jsxs)(DrawerContent, { onClose: closeSelect, lockScroll: false, children: [
|
|
12799
|
+
/* @__PURE__ */ (0, import_jsx_runtime142.jsx)(DrawerTitle, { className: "sr-only", children: mobileTitle ?? label }),
|
|
12800
|
+
/* @__PURE__ */ (0, import_jsx_runtime142.jsx)(DrawerDescription, { className: "sr-only", children: label }),
|
|
12801
|
+
/* @__PURE__ */ (0, import_jsx_runtime142.jsx)("div", { className: "px-5 pb-5 pt-1", children: content })
|
|
12831
12802
|
] })
|
|
12832
12803
|
}
|
|
12833
|
-
) : open ? /* @__PURE__ */ (0,
|
|
12804
|
+
) : open ? /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
|
|
12834
12805
|
"div",
|
|
12835
12806
|
{
|
|
12836
12807
|
className: cn(
|
|
@@ -12897,16 +12868,16 @@ function SearchableSelectContent({
|
|
|
12897
12868
|
virtualizer.scrollToIndex(highlightedIndex, { align: "auto" });
|
|
12898
12869
|
}
|
|
12899
12870
|
}, [highlightedIndex, virtualizer]);
|
|
12900
|
-
return /* @__PURE__ */ (0,
|
|
12901
|
-
/* @__PURE__ */ (0,
|
|
12902
|
-
/* @__PURE__ */ (0,
|
|
12903
|
-
|
|
12871
|
+
return /* @__PURE__ */ (0, import_jsx_runtime142.jsxs)("div", { className: "p-2", children: [
|
|
12872
|
+
/* @__PURE__ */ (0, import_jsx_runtime142.jsxs)("div", { className: "relative mb-2", children: [
|
|
12873
|
+
/* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
|
|
12874
|
+
import_lucide_react48.Search,
|
|
12904
12875
|
{
|
|
12905
12876
|
"aria-hidden": "true",
|
|
12906
12877
|
className: "absolute left-4 top-1/2 h-5 w-5 -translate-y-1/2 text-[#9696B9]"
|
|
12907
12878
|
}
|
|
12908
12879
|
),
|
|
12909
|
-
/* @__PURE__ */ (0,
|
|
12880
|
+
/* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
|
|
12910
12881
|
"input",
|
|
12911
12882
|
{
|
|
12912
12883
|
id: inputId,
|
|
@@ -12925,7 +12896,7 @@ function SearchableSelectContent({
|
|
|
12925
12896
|
}
|
|
12926
12897
|
)
|
|
12927
12898
|
] }),
|
|
12928
|
-
loading && options.length === 0 ? /* @__PURE__ */ (0,
|
|
12899
|
+
loading && options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime142.jsx)("div", { className: "px-4 py-5 text-center text-base leading-6 text-[#6C6C6C]", children: loadingText }) : options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime142.jsx)("div", { className: "px-4 py-5 text-center text-base leading-6 text-[#6C6C6C]", children: emptyMessage }) : /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
|
|
12929
12900
|
"div",
|
|
12930
12901
|
{
|
|
12931
12902
|
id: listboxId,
|
|
@@ -12934,7 +12905,7 @@ function SearchableSelectContent({
|
|
|
12934
12905
|
"aria-labelledby": labelId,
|
|
12935
12906
|
className: cn("overflow-y-auto outline-none", menuClassName),
|
|
12936
12907
|
style: { height: Math.min(height, rowCount * ROW_HEIGHT) },
|
|
12937
|
-
children: /* @__PURE__ */ (0,
|
|
12908
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
|
|
12938
12909
|
"div",
|
|
12939
12910
|
{
|
|
12940
12911
|
className: "relative w-full",
|
|
@@ -12942,7 +12913,7 @@ function SearchableSelectContent({
|
|
|
12942
12913
|
children: virtualItems.map((virtualItem) => {
|
|
12943
12914
|
const option = options[virtualItem.index];
|
|
12944
12915
|
if (!option) {
|
|
12945
|
-
return /* @__PURE__ */ (0,
|
|
12916
|
+
return /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
|
|
12946
12917
|
"div",
|
|
12947
12918
|
{
|
|
12948
12919
|
className: "absolute left-0 top-0 flex w-full items-center px-4 text-base leading-6 text-[#6C6C6C]",
|
|
@@ -12957,7 +12928,7 @@ function SearchableSelectContent({
|
|
|
12957
12928
|
}
|
|
12958
12929
|
const isSelected = value?.value === option.value;
|
|
12959
12930
|
const isHighlighted = virtualItem.index === highlightedIndex;
|
|
12960
|
-
return /* @__PURE__ */ (0,
|
|
12931
|
+
return /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
|
|
12961
12932
|
"button",
|
|
12962
12933
|
{
|
|
12963
12934
|
id: getOptionId(idPrefix, virtualItem.index),
|
|
@@ -12979,7 +12950,7 @@ function SearchableSelectContent({
|
|
|
12979
12950
|
height: `${virtualItem.size}px`,
|
|
12980
12951
|
transform: `translateY(${virtualItem.start}px)`
|
|
12981
12952
|
},
|
|
12982
|
-
children: /* @__PURE__ */ (0,
|
|
12953
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime142.jsx)("span", { className: "truncate text-center", children: String(option.label) })
|
|
12983
12954
|
},
|
|
12984
12955
|
`${String(option.value)}-${virtualItem.index}`
|
|
12985
12956
|
);
|
|
@@ -13138,7 +13109,6 @@ function getNextEnabledIndex(options, startIndex, step) {
|
|
|
13138
13109
|
LargeModal,
|
|
13139
13110
|
LearnMoreButton,
|
|
13140
13111
|
Link,
|
|
13141
|
-
Loader,
|
|
13142
13112
|
LoadingBar,
|
|
13143
13113
|
METRIC_CARD_VARIANTS,
|
|
13144
13114
|
MetricCard,
|