@algorithm-shift/design-system 1.2.3 → 1.2.5
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.css +1768 -138
- package/dist/index.css.map +1 -1
- package/dist/index.d.mts +109 -5
- package/dist/index.d.ts +109 -5
- package/dist/index.js +1582 -22
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1556 -21
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +1698 -116
- package/package.json +15 -2
package/dist/index.js
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
2
3
|
var __defProp = Object.defineProperty;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
5
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
8
|
var __export = (target, all) => {
|
|
7
9
|
for (var name in all)
|
|
@@ -15,15 +17,42 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
15
17
|
}
|
|
16
18
|
return to;
|
|
17
19
|
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
18
28
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
29
|
|
|
20
30
|
// src/index.ts
|
|
21
31
|
var index_exports = {};
|
|
22
32
|
__export(index_exports, {
|
|
23
33
|
Button: () => Button,
|
|
24
|
-
|
|
34
|
+
CheckboxInput: () => CheckboxInput,
|
|
35
|
+
DateRange: () => DateRange,
|
|
36
|
+
Dropdown: () => Dropdown,
|
|
37
|
+
EmailInput: () => EmailInput,
|
|
25
38
|
FlexLayout: () => Flex_default,
|
|
26
39
|
GridLayout: () => Grid_default,
|
|
40
|
+
Logo: () => Logo_default,
|
|
41
|
+
MultiCheckbox: () => MultiCheckbox,
|
|
42
|
+
Notification: () => Notification_default,
|
|
43
|
+
PasswordInput: () => PasswordInput,
|
|
44
|
+
PhoneInput: () => PhoneInput,
|
|
45
|
+
Profile: () => Profile_default,
|
|
46
|
+
RadioInput: () => RadioInput,
|
|
47
|
+
Spacer: () => Spacer_default,
|
|
48
|
+
Stages: () => Stages_default,
|
|
49
|
+
SwitchToggle: () => SwitchToggle,
|
|
50
|
+
Table: () => Table_default,
|
|
51
|
+
Tabs: () => Tabs_default,
|
|
52
|
+
TextInput: () => TextInput,
|
|
53
|
+
Textarea: () => Textarea2,
|
|
54
|
+
Typography: () => Typography_default,
|
|
55
|
+
UrlInput: () => UrlInput,
|
|
27
56
|
buttonVariants: () => buttonVariants,
|
|
28
57
|
cn: () => cn
|
|
29
58
|
});
|
|
@@ -85,51 +114,1582 @@ function Button({
|
|
|
85
114
|
);
|
|
86
115
|
}
|
|
87
116
|
|
|
88
|
-
// src/components/
|
|
117
|
+
// src/components/Layout/Flex.tsx
|
|
89
118
|
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
90
|
-
|
|
119
|
+
var Flex = ({
|
|
120
|
+
children,
|
|
121
|
+
className,
|
|
122
|
+
style
|
|
123
|
+
}) => {
|
|
124
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className, style, children });
|
|
125
|
+
};
|
|
126
|
+
var Flex_default = Flex;
|
|
127
|
+
|
|
128
|
+
// src/components/Layout/Grid.tsx
|
|
129
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
130
|
+
var Grid = ({
|
|
131
|
+
children,
|
|
132
|
+
className,
|
|
133
|
+
style
|
|
134
|
+
}) => {
|
|
135
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className, style, children });
|
|
136
|
+
};
|
|
137
|
+
var Grid_default = Grid;
|
|
138
|
+
|
|
139
|
+
// src/components/Basic/Typography/Typography.tsx
|
|
140
|
+
var import_react = __toESM(require("react"));
|
|
141
|
+
var Typography = ({
|
|
142
|
+
className,
|
|
143
|
+
style,
|
|
144
|
+
tagName,
|
|
145
|
+
textContent
|
|
146
|
+
}) => {
|
|
147
|
+
const Tag = tagName || "h1";
|
|
148
|
+
return import_react.default.createElement(
|
|
149
|
+
Tag,
|
|
150
|
+
{
|
|
151
|
+
style,
|
|
152
|
+
className: cn(className, "pointer-events-auto")
|
|
153
|
+
},
|
|
154
|
+
[
|
|
155
|
+
import_react.default.createElement("span", {
|
|
156
|
+
key: "html",
|
|
157
|
+
className: "pointer-events-none",
|
|
158
|
+
dangerouslySetInnerHTML: { __html: textContent }
|
|
159
|
+
})
|
|
160
|
+
]
|
|
161
|
+
);
|
|
162
|
+
};
|
|
163
|
+
var Typography_default = Typography;
|
|
164
|
+
|
|
165
|
+
// src/components/Basic/Shape/Shape.tsx
|
|
166
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
167
|
+
|
|
168
|
+
// src/components/Inputs/TextInput/TextInput.tsx
|
|
169
|
+
var React2 = __toESM(require("react"));
|
|
170
|
+
|
|
171
|
+
// src/components/ui/input.tsx
|
|
172
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
173
|
+
function Input({ className, type, ...props }) {
|
|
174
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
175
|
+
"input",
|
|
176
|
+
{
|
|
177
|
+
type,
|
|
178
|
+
"data-slot": "input",
|
|
179
|
+
className: cn(
|
|
180
|
+
"file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
|
|
181
|
+
"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
|
|
182
|
+
"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
|
183
|
+
className
|
|
184
|
+
),
|
|
185
|
+
...props
|
|
186
|
+
}
|
|
187
|
+
);
|
|
188
|
+
}
|
|
189
|
+
|
|
190
|
+
// src/components/Inputs/TextInput/TextInput.tsx
|
|
191
|
+
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
192
|
+
var TextInput = ({ className, style, ...props }) => {
|
|
193
|
+
const placeholder = props.placeholder || "Placeholder text";
|
|
194
|
+
const regexPattern = props.regexPattern ?? "";
|
|
195
|
+
const errorMessage = props.errorMessage ?? "Required";
|
|
196
|
+
const noOfCharacters = props.noOfCharacters ?? 100;
|
|
197
|
+
const isRequired = props.isRequired ?? false;
|
|
198
|
+
const isEditable = props.isEditable ?? true;
|
|
199
|
+
const isDisabled = props.isDisabled ?? false;
|
|
200
|
+
const isReadonly = props.isReadonly ?? false;
|
|
201
|
+
const isAutocomplete = props.isAutocomplete ?? false;
|
|
202
|
+
const [value, setValue] = React2.useState("");
|
|
203
|
+
const [error, setError] = React2.useState(null);
|
|
204
|
+
const handleChange = (e) => {
|
|
205
|
+
const val = e.target.value;
|
|
206
|
+
if (val.length > noOfCharacters) return;
|
|
207
|
+
setValue(val);
|
|
208
|
+
if (isRequired && val.trim() === "") {
|
|
209
|
+
setError(errorMessage);
|
|
210
|
+
} else if (regexPattern && !new RegExp(regexPattern).test(val)) {
|
|
211
|
+
setError(errorMessage);
|
|
212
|
+
} else {
|
|
213
|
+
setError(null);
|
|
214
|
+
}
|
|
215
|
+
};
|
|
216
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
|
|
217
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
218
|
+
Input,
|
|
219
|
+
{
|
|
220
|
+
type: "text",
|
|
221
|
+
className,
|
|
222
|
+
style,
|
|
223
|
+
value,
|
|
224
|
+
autoComplete: isAutocomplete ? "on" : "off",
|
|
225
|
+
placeholder,
|
|
226
|
+
onChange: handleChange,
|
|
227
|
+
disabled: isDisabled || !isEditable,
|
|
228
|
+
readOnly: isReadonly,
|
|
229
|
+
required: isRequired,
|
|
230
|
+
maxLength: noOfCharacters,
|
|
231
|
+
pattern: regexPattern || void 0
|
|
232
|
+
}
|
|
233
|
+
),
|
|
234
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mt-1 text-xs text-red-500", children: error })
|
|
235
|
+
] });
|
|
236
|
+
};
|
|
237
|
+
|
|
238
|
+
// src/components/Inputs/EmailInput/EmailInput.tsx
|
|
239
|
+
var React3 = __toESM(require("react"));
|
|
240
|
+
|
|
241
|
+
// node_modules/lucide-react/dist/esm/createLucideIcon.js
|
|
242
|
+
var import_react3 = require("react");
|
|
243
|
+
|
|
244
|
+
// node_modules/lucide-react/dist/esm/shared/src/utils.js
|
|
245
|
+
var toKebabCase = (string) => string.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
|
|
246
|
+
var toCamelCase = (string) => string.replace(
|
|
247
|
+
/^([A-Z])|[\s-_]+(\w)/g,
|
|
248
|
+
(match, p1, p2) => p2 ? p2.toUpperCase() : p1.toLowerCase()
|
|
249
|
+
);
|
|
250
|
+
var toPascalCase = (string) => {
|
|
251
|
+
const camelCase = toCamelCase(string);
|
|
252
|
+
return camelCase.charAt(0).toUpperCase() + camelCase.slice(1);
|
|
253
|
+
};
|
|
254
|
+
var mergeClasses = (...classes) => classes.filter((className, index, array) => {
|
|
255
|
+
return Boolean(className) && className.trim() !== "" && array.indexOf(className) === index;
|
|
256
|
+
}).join(" ").trim();
|
|
257
|
+
var hasA11yProp = (props) => {
|
|
258
|
+
for (const prop in props) {
|
|
259
|
+
if (prop.startsWith("aria-") || prop === "role" || prop === "title") {
|
|
260
|
+
return true;
|
|
261
|
+
}
|
|
262
|
+
}
|
|
263
|
+
};
|
|
264
|
+
|
|
265
|
+
// node_modules/lucide-react/dist/esm/Icon.js
|
|
266
|
+
var import_react2 = require("react");
|
|
267
|
+
|
|
268
|
+
// node_modules/lucide-react/dist/esm/defaultAttributes.js
|
|
269
|
+
var defaultAttributes = {
|
|
270
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
271
|
+
width: 24,
|
|
272
|
+
height: 24,
|
|
273
|
+
viewBox: "0 0 24 24",
|
|
274
|
+
fill: "none",
|
|
275
|
+
stroke: "currentColor",
|
|
276
|
+
strokeWidth: 2,
|
|
277
|
+
strokeLinecap: "round",
|
|
278
|
+
strokeLinejoin: "round"
|
|
279
|
+
};
|
|
280
|
+
|
|
281
|
+
// node_modules/lucide-react/dist/esm/Icon.js
|
|
282
|
+
var Icon = (0, import_react2.forwardRef)(
|
|
283
|
+
({
|
|
284
|
+
color = "currentColor",
|
|
285
|
+
size = 24,
|
|
286
|
+
strokeWidth = 2,
|
|
287
|
+
absoluteStrokeWidth,
|
|
288
|
+
className = "",
|
|
289
|
+
children,
|
|
290
|
+
iconNode,
|
|
291
|
+
...rest
|
|
292
|
+
}, ref) => (0, import_react2.createElement)(
|
|
293
|
+
"svg",
|
|
294
|
+
{
|
|
295
|
+
ref,
|
|
296
|
+
...defaultAttributes,
|
|
297
|
+
width: size,
|
|
298
|
+
height: size,
|
|
299
|
+
stroke: color,
|
|
300
|
+
strokeWidth: absoluteStrokeWidth ? Number(strokeWidth) * 24 / Number(size) : strokeWidth,
|
|
301
|
+
className: mergeClasses("lucide", className),
|
|
302
|
+
...!children && !hasA11yProp(rest) && { "aria-hidden": "true" },
|
|
303
|
+
...rest
|
|
304
|
+
},
|
|
305
|
+
[
|
|
306
|
+
...iconNode.map(([tag, attrs]) => (0, import_react2.createElement)(tag, attrs)),
|
|
307
|
+
...Array.isArray(children) ? children : [children]
|
|
308
|
+
]
|
|
309
|
+
)
|
|
310
|
+
);
|
|
311
|
+
|
|
312
|
+
// node_modules/lucide-react/dist/esm/createLucideIcon.js
|
|
313
|
+
var createLucideIcon = (iconName, iconNode) => {
|
|
314
|
+
const Component = (0, import_react3.forwardRef)(
|
|
315
|
+
({ className, ...props }, ref) => (0, import_react3.createElement)(Icon, {
|
|
316
|
+
ref,
|
|
317
|
+
iconNode,
|
|
318
|
+
className: mergeClasses(
|
|
319
|
+
`lucide-${toKebabCase(toPascalCase(iconName))}`,
|
|
320
|
+
`lucide-${iconName}`,
|
|
321
|
+
className
|
|
322
|
+
),
|
|
323
|
+
...props
|
|
324
|
+
})
|
|
325
|
+
);
|
|
326
|
+
Component.displayName = toPascalCase(iconName);
|
|
327
|
+
return Component;
|
|
328
|
+
};
|
|
329
|
+
|
|
330
|
+
// node_modules/lucide-react/dist/esm/icons/check.js
|
|
331
|
+
var __iconNode = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
|
|
332
|
+
var Check = createLucideIcon("check", __iconNode);
|
|
333
|
+
|
|
334
|
+
// node_modules/lucide-react/dist/esm/icons/chevron-down.js
|
|
335
|
+
var __iconNode2 = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
|
|
336
|
+
var ChevronDown = createLucideIcon("chevron-down", __iconNode2);
|
|
337
|
+
|
|
338
|
+
// node_modules/lucide-react/dist/esm/icons/chevron-left.js
|
|
339
|
+
var __iconNode3 = [["path", { d: "m15 18-6-6 6-6", key: "1wnfg3" }]];
|
|
340
|
+
var ChevronLeft = createLucideIcon("chevron-left", __iconNode3);
|
|
341
|
+
|
|
342
|
+
// node_modules/lucide-react/dist/esm/icons/chevron-right.js
|
|
343
|
+
var __iconNode4 = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
|
|
344
|
+
var ChevronRight = createLucideIcon("chevron-right", __iconNode4);
|
|
345
|
+
|
|
346
|
+
// node_modules/lucide-react/dist/esm/icons/chevron-up.js
|
|
347
|
+
var __iconNode5 = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]];
|
|
348
|
+
var ChevronUp = createLucideIcon("chevron-up", __iconNode5);
|
|
349
|
+
|
|
350
|
+
// node_modules/lucide-react/dist/esm/icons/circle.js
|
|
351
|
+
var __iconNode6 = [["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]];
|
|
352
|
+
var Circle = createLucideIcon("circle", __iconNode6);
|
|
353
|
+
|
|
354
|
+
// node_modules/lucide-react/dist/esm/icons/mail.js
|
|
355
|
+
var __iconNode7 = [
|
|
356
|
+
["path", { d: "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7", key: "132q7q" }],
|
|
357
|
+
["rect", { x: "2", y: "4", width: "20", height: "16", rx: "2", key: "izxlao" }]
|
|
358
|
+
];
|
|
359
|
+
var Mail = createLucideIcon("mail", __iconNode7);
|
|
360
|
+
|
|
361
|
+
// node_modules/lucide-react/dist/esm/icons/scan-eye.js
|
|
362
|
+
var __iconNode8 = [
|
|
363
|
+
["path", { d: "M3 7V5a2 2 0 0 1 2-2h2", key: "aa7l1z" }],
|
|
364
|
+
["path", { d: "M17 3h2a2 2 0 0 1 2 2v2", key: "4qcy5o" }],
|
|
365
|
+
["path", { d: "M21 17v2a2 2 0 0 1-2 2h-2", key: "6vwrx8" }],
|
|
366
|
+
["path", { d: "M7 21H5a2 2 0 0 1-2-2v-2", key: "ioqczr" }],
|
|
367
|
+
["circle", { cx: "12", cy: "12", r: "1", key: "41hilf" }],
|
|
368
|
+
[
|
|
369
|
+
"path",
|
|
370
|
+
{
|
|
371
|
+
d: "M18.944 12.33a1 1 0 0 0 0-.66 7.5 7.5 0 0 0-13.888 0 1 1 0 0 0 0 .66 7.5 7.5 0 0 0 13.888 0",
|
|
372
|
+
key: "11ak4c"
|
|
373
|
+
}
|
|
374
|
+
]
|
|
375
|
+
];
|
|
376
|
+
var ScanEye = createLucideIcon("scan-eye", __iconNode8);
|
|
377
|
+
|
|
378
|
+
// src/components/Inputs/EmailInput/EmailInput.tsx
|
|
379
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
380
|
+
var EmailInput = ({ className, style, ...props }) => {
|
|
381
|
+
const placeholder = props.placeholder ?? "Placeholder text";
|
|
382
|
+
const regexPattern = props.regexPattern ?? "";
|
|
383
|
+
const errorMessage = props.errorMessage ?? "Required";
|
|
384
|
+
const noOfCharacters = props.noOfCharacters ?? 100;
|
|
385
|
+
const isRequired = props.isRequired ?? false;
|
|
386
|
+
const isEditable = props.isEditable ?? true;
|
|
387
|
+
const isDisabled = props.isDisabled ?? false;
|
|
388
|
+
const isReadonly = props.isReadonly ?? false;
|
|
389
|
+
const isAutocomplete = props.isAutocomplete ?? false;
|
|
390
|
+
const [value, setValue] = React3.useState("");
|
|
391
|
+
const [error, setError] = React3.useState(null);
|
|
392
|
+
const handleChange = (e) => {
|
|
393
|
+
const val = e.target.value;
|
|
394
|
+
if (val.length > noOfCharacters) return;
|
|
395
|
+
setValue(val);
|
|
396
|
+
if (isRequired && val.trim() === "") {
|
|
397
|
+
setError(errorMessage);
|
|
398
|
+
} else if (regexPattern && !new RegExp(regexPattern).test(val)) {
|
|
399
|
+
setError(errorMessage);
|
|
400
|
+
} else {
|
|
401
|
+
setError(null);
|
|
402
|
+
}
|
|
403
|
+
};
|
|
404
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
|
|
405
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex justify-start items-center relative", children: [
|
|
406
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Mail, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-[#BDBDBD]" }),
|
|
407
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
408
|
+
Input,
|
|
409
|
+
{
|
|
410
|
+
type: "email",
|
|
411
|
+
value,
|
|
412
|
+
className,
|
|
413
|
+
style,
|
|
414
|
+
autoComplete: isAutocomplete ? "on" : "off",
|
|
415
|
+
placeholder,
|
|
416
|
+
onChange: handleChange,
|
|
417
|
+
disabled: isDisabled || !isEditable,
|
|
418
|
+
readOnly: isReadonly,
|
|
419
|
+
required: isRequired,
|
|
420
|
+
maxLength: noOfCharacters,
|
|
421
|
+
pattern: regexPattern || void 0
|
|
422
|
+
}
|
|
423
|
+
)
|
|
424
|
+
] }),
|
|
425
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "mt-1 text-xs text-red-500", children: error })
|
|
426
|
+
] });
|
|
427
|
+
};
|
|
428
|
+
|
|
429
|
+
// src/components/Inputs/PasswordInput/PasswordInput.tsx
|
|
430
|
+
var React4 = __toESM(require("react"));
|
|
431
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
432
|
+
var PasswordInput = ({ className, style, ...props }) => {
|
|
433
|
+
const placeholder = props.placeholder ?? "Placeholder text";
|
|
434
|
+
const regexPattern = props.regexPattern ?? "";
|
|
435
|
+
const errorMessage = props.errorMessage ?? "Required";
|
|
436
|
+
const noOfCharacters = props.noOfCharacters ?? 100;
|
|
437
|
+
const isRequired = props.isRequired ?? false;
|
|
438
|
+
const isEditable = props.isEditable ?? true;
|
|
439
|
+
const isDisabled = props.isDisabled ?? false;
|
|
440
|
+
const isReadonly = props.isReadonly ?? false;
|
|
441
|
+
const isAutocomplete = props.isAutocomplete ?? false;
|
|
442
|
+
const [value, setValue] = React4.useState("");
|
|
443
|
+
const [error, setError] = React4.useState(null);
|
|
444
|
+
const handleChange = (e) => {
|
|
445
|
+
const val = e.target.value;
|
|
446
|
+
if (val.length > noOfCharacters) return;
|
|
447
|
+
setValue(val);
|
|
448
|
+
if (isRequired && val.trim() === "") {
|
|
449
|
+
setError(errorMessage);
|
|
450
|
+
} else if (regexPattern && !new RegExp(regexPattern).test(val)) {
|
|
451
|
+
setError(errorMessage);
|
|
452
|
+
} else {
|
|
453
|
+
setError(null);
|
|
454
|
+
}
|
|
455
|
+
};
|
|
456
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
|
|
457
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex justify-start items-center relative", children: [
|
|
458
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ScanEye, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-[#BDBDBD]" }),
|
|
459
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
|
460
|
+
Input,
|
|
461
|
+
{
|
|
462
|
+
type: "password",
|
|
463
|
+
id: "password-field",
|
|
464
|
+
className,
|
|
465
|
+
style,
|
|
466
|
+
value,
|
|
467
|
+
autoComplete: isAutocomplete ? "on" : "off",
|
|
468
|
+
placeholder,
|
|
469
|
+
onChange: handleChange,
|
|
470
|
+
disabled: isDisabled || !isEditable,
|
|
471
|
+
readOnly: isReadonly,
|
|
472
|
+
required: isRequired,
|
|
473
|
+
maxLength: noOfCharacters,
|
|
474
|
+
pattern: regexPattern || void 0
|
|
475
|
+
}
|
|
476
|
+
)
|
|
477
|
+
] }),
|
|
478
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "mt-1 text-xs text-red-500", children: error })
|
|
479
|
+
] });
|
|
480
|
+
};
|
|
481
|
+
|
|
482
|
+
// src/components/Inputs/Textarea/Textarea.tsx
|
|
483
|
+
var React5 = __toESM(require("react"));
|
|
484
|
+
|
|
485
|
+
// src/components/ui/textarea.tsx
|
|
486
|
+
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
487
|
+
function Textarea({ className, ...props }) {
|
|
488
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
489
|
+
"textarea",
|
|
490
|
+
{
|
|
491
|
+
"data-slot": "textarea",
|
|
492
|
+
className: cn(
|
|
493
|
+
"border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
|
|
494
|
+
className
|
|
495
|
+
),
|
|
496
|
+
...props
|
|
497
|
+
}
|
|
498
|
+
);
|
|
499
|
+
}
|
|
500
|
+
|
|
501
|
+
// src/components/Inputs/Textarea/Textarea.tsx
|
|
502
|
+
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
503
|
+
var Textarea2 = ({ className, style, ...props }) => {
|
|
504
|
+
const placeholder = props.placeholder ?? "Placeholder text";
|
|
505
|
+
const regexPattern = props.regexPattern ?? "";
|
|
506
|
+
const errorMessage = props.errorMessage ?? "Required";
|
|
507
|
+
const noOfCharacters = props.noOfCharacters ?? 100;
|
|
508
|
+
const isRequired = props.isRequired ?? false;
|
|
509
|
+
const isEditable = props.isEditable ?? true;
|
|
510
|
+
const isDisabled = props.isDisabled ?? false;
|
|
511
|
+
const isReadonly = props.isReadonly ?? false;
|
|
512
|
+
const isAutocomplete = props.isAutocomplete ?? false;
|
|
513
|
+
const [value, setValue] = React5.useState("");
|
|
514
|
+
const [error, setError] = React5.useState(null);
|
|
515
|
+
const handleChange = (e) => {
|
|
516
|
+
const val = e.target.value;
|
|
517
|
+
if (val.length > noOfCharacters) return;
|
|
518
|
+
setValue(val);
|
|
519
|
+
if (isRequired && val.trim() === "") {
|
|
520
|
+
setError(errorMessage);
|
|
521
|
+
} else if (regexPattern && !new RegExp(regexPattern).test(val)) {
|
|
522
|
+
setError(errorMessage);
|
|
523
|
+
} else {
|
|
524
|
+
setError(null);
|
|
525
|
+
}
|
|
526
|
+
};
|
|
527
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
|
|
528
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
529
|
+
Textarea,
|
|
530
|
+
{
|
|
531
|
+
id: "textarea-field",
|
|
532
|
+
className,
|
|
533
|
+
style,
|
|
534
|
+
value,
|
|
535
|
+
autoComplete: isAutocomplete ? "on" : "off",
|
|
536
|
+
placeholder,
|
|
537
|
+
onChange: handleChange,
|
|
538
|
+
disabled: isDisabled || !isEditable,
|
|
539
|
+
readOnly: isReadonly,
|
|
540
|
+
required: isRequired,
|
|
541
|
+
maxLength: noOfCharacters
|
|
542
|
+
}
|
|
543
|
+
),
|
|
544
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { className: "mt-1 text-xs text-red-500", children: error })
|
|
545
|
+
] });
|
|
546
|
+
};
|
|
547
|
+
|
|
548
|
+
// src/components/Inputs/UrlInput/UrlInput.tsx
|
|
549
|
+
var React6 = __toESM(require("react"));
|
|
550
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
551
|
+
var UrlInput = ({ className, style, ...props }) => {
|
|
552
|
+
const placeholder = props.placeholder ?? "Placeholder text";
|
|
553
|
+
const regexPattern = props.regexPattern ?? "";
|
|
554
|
+
const errorMessage = props.errorMessage ?? "Required";
|
|
555
|
+
const noOfCharacters = props.noOfCharacters ?? 100;
|
|
556
|
+
const isRequired = props.isRequired ?? false;
|
|
557
|
+
const isEditable = props.isEditable ?? true;
|
|
558
|
+
const isDisabled = props.isDisabled ?? false;
|
|
559
|
+
const isReadonly = props.isReadonly ?? false;
|
|
560
|
+
const isAutocomplete = props.isAutocomplete ?? false;
|
|
561
|
+
const [value, setValue] = React6.useState("");
|
|
562
|
+
const [error, setError] = React6.useState(null);
|
|
563
|
+
const handleChange = (e) => {
|
|
564
|
+
const val = e.target.value;
|
|
565
|
+
if (val.length > noOfCharacters) return;
|
|
566
|
+
setValue(val);
|
|
567
|
+
if (isRequired && val.trim() === "") {
|
|
568
|
+
setError(errorMessage);
|
|
569
|
+
} else if (regexPattern && !new RegExp(regexPattern).test(val)) {
|
|
570
|
+
setError(errorMessage);
|
|
571
|
+
} else {
|
|
572
|
+
setError(null);
|
|
573
|
+
}
|
|
574
|
+
};
|
|
575
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
|
|
576
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex justify-start items-center relative", children: [
|
|
577
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "bg-[#E9E9E9] absolute px-10 text-center top-1/2 h-full justify-center items-center flex w-10 -translate-y-1/2 text-[#383838] font-[500] text-[12px]", children: "https://" }),
|
|
578
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
579
|
+
Input,
|
|
580
|
+
{
|
|
581
|
+
type: "url",
|
|
582
|
+
className,
|
|
583
|
+
style,
|
|
584
|
+
id: "url-field",
|
|
585
|
+
value,
|
|
586
|
+
autoComplete: isAutocomplete ? "on" : "off",
|
|
587
|
+
placeholder,
|
|
588
|
+
onChange: handleChange,
|
|
589
|
+
disabled: isDisabled || !isEditable,
|
|
590
|
+
readOnly: isReadonly,
|
|
591
|
+
required: isRequired,
|
|
592
|
+
maxLength: noOfCharacters,
|
|
593
|
+
pattern: regexPattern || void 0
|
|
594
|
+
}
|
|
595
|
+
)
|
|
596
|
+
] }),
|
|
597
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("p", { className: "mt-1 text-xs text-red-500", children: error })
|
|
598
|
+
] });
|
|
599
|
+
};
|
|
600
|
+
|
|
601
|
+
// src/components/ui/checkbox.tsx
|
|
602
|
+
var CheckboxPrimitive = __toESM(require("@radix-ui/react-checkbox"));
|
|
603
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
604
|
+
function Checkbox({
|
|
91
605
|
className,
|
|
92
|
-
asChild = false,
|
|
93
606
|
...props
|
|
94
607
|
}) {
|
|
95
|
-
return /* @__PURE__ */ (0,
|
|
96
|
-
|
|
608
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
609
|
+
CheckboxPrimitive.Root,
|
|
97
610
|
{
|
|
98
|
-
"data-slot": "
|
|
99
|
-
className:
|
|
611
|
+
"data-slot": "checkbox",
|
|
612
|
+
className: cn(
|
|
613
|
+
"peer border-input dark:bg-input/30 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
|
|
614
|
+
className
|
|
615
|
+
),
|
|
616
|
+
...props,
|
|
617
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
618
|
+
CheckboxPrimitive.Indicator,
|
|
619
|
+
{
|
|
620
|
+
"data-slot": "checkbox-indicator",
|
|
621
|
+
className: "flex items-center justify-center text-current transition-none",
|
|
622
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Check, { className: "size-3.5" })
|
|
623
|
+
}
|
|
624
|
+
)
|
|
625
|
+
}
|
|
626
|
+
);
|
|
627
|
+
}
|
|
628
|
+
|
|
629
|
+
// src/components/ui/label.tsx
|
|
630
|
+
var LabelPrimitive = __toESM(require("@radix-ui/react-label"));
|
|
631
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
632
|
+
function Label({
|
|
633
|
+
className,
|
|
634
|
+
...props
|
|
635
|
+
}) {
|
|
636
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
637
|
+
LabelPrimitive.Root,
|
|
638
|
+
{
|
|
639
|
+
"data-slot": "label",
|
|
640
|
+
className: cn(
|
|
641
|
+
"flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
|
|
642
|
+
className
|
|
643
|
+
),
|
|
100
644
|
...props
|
|
101
645
|
}
|
|
102
646
|
);
|
|
103
647
|
}
|
|
104
648
|
|
|
105
|
-
// src/components/
|
|
106
|
-
var
|
|
107
|
-
var
|
|
108
|
-
|
|
649
|
+
// src/components/Inputs/Checkbox/Checkbox.tsx
|
|
650
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
651
|
+
var CheckboxInput = ({ className, style, ...props }) => {
|
|
652
|
+
const text = props.text ? props.text : "Subscribe";
|
|
653
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className, style, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex items-center space-x-2", children: [
|
|
654
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Checkbox, { id: "newsletter" }),
|
|
655
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Label, { htmlFor: "newsletter", children: text })
|
|
656
|
+
] }) });
|
|
657
|
+
};
|
|
658
|
+
|
|
659
|
+
// src/components/ui/radio-group.tsx
|
|
660
|
+
var RadioGroupPrimitive = __toESM(require("@radix-ui/react-radio-group"));
|
|
661
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
662
|
+
function RadioGroup({
|
|
109
663
|
className,
|
|
110
|
-
|
|
111
|
-
})
|
|
112
|
-
return /* @__PURE__ */ (0,
|
|
664
|
+
...props
|
|
665
|
+
}) {
|
|
666
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
667
|
+
RadioGroupPrimitive.Root,
|
|
668
|
+
{
|
|
669
|
+
"data-slot": "radio-group",
|
|
670
|
+
className: cn("grid gap-3", className),
|
|
671
|
+
...props
|
|
672
|
+
}
|
|
673
|
+
);
|
|
674
|
+
}
|
|
675
|
+
function RadioGroupItem({
|
|
676
|
+
className,
|
|
677
|
+
...props
|
|
678
|
+
}) {
|
|
679
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
680
|
+
RadioGroupPrimitive.Item,
|
|
681
|
+
{
|
|
682
|
+
"data-slot": "radio-group-item",
|
|
683
|
+
className: cn(
|
|
684
|
+
"border-input text-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 aspect-square size-4 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
|
|
685
|
+
className
|
|
686
|
+
),
|
|
687
|
+
...props,
|
|
688
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
689
|
+
RadioGroupPrimitive.Indicator,
|
|
690
|
+
{
|
|
691
|
+
"data-slot": "radio-group-indicator",
|
|
692
|
+
className: "relative flex items-center justify-center",
|
|
693
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Circle, { className: "fill-primary absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2" })
|
|
694
|
+
}
|
|
695
|
+
)
|
|
696
|
+
}
|
|
697
|
+
);
|
|
698
|
+
}
|
|
699
|
+
|
|
700
|
+
// src/components/Inputs/RadioInput/RadioInput.tsx
|
|
701
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
702
|
+
var RadioInput = ({ className, style, ...props }) => {
|
|
703
|
+
const text = Array.isArray(props.text) ? props.text : [props.text ?? "Subscribe"];
|
|
704
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className, style, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(RadioGroup, { defaultValue: "option-1", children: text?.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex items-center space-x-2", children: [
|
|
705
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(RadioGroupItem, { value: item, id: `r${index}` }),
|
|
706
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Label, { htmlFor: `r${index}`, children: item })
|
|
707
|
+
] }, index)) }) });
|
|
113
708
|
};
|
|
114
|
-
var Flex_default = Flex;
|
|
115
709
|
|
|
116
|
-
// src/components/
|
|
117
|
-
var
|
|
118
|
-
var
|
|
710
|
+
// src/components/Inputs/MultiCheckbox/MultiCheckbox.tsx
|
|
711
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
712
|
+
var MultiCheckbox = ({ className, style, ...props }) => {
|
|
713
|
+
const text = Array.isArray(props.text) ? props.text : [props.text ?? "Subscribe"];
|
|
714
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className, style, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex gap-3 flex-col", children: text?.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center space-x-2", children: [
|
|
715
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Checkbox, { id: `newsletter-${index}` }),
|
|
716
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Label, { htmlFor: `newsletter-${index}`, children: item })
|
|
717
|
+
] }, index)) }) });
|
|
718
|
+
};
|
|
719
|
+
|
|
720
|
+
// src/components/Global/TinyMceEditor.tsx
|
|
721
|
+
var import_react4 = require("react");
|
|
722
|
+
var import_tinymce_react = require("@tinymce/tinymce-react");
|
|
723
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
724
|
+
|
|
725
|
+
// src/components/Inputs/RichText/RichText.tsx
|
|
726
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
727
|
+
|
|
728
|
+
// src/components/Inputs/Dropdown/Dropdown.tsx
|
|
729
|
+
var React7 = __toESM(require("react"));
|
|
730
|
+
|
|
731
|
+
// src/components/ui/select.tsx
|
|
732
|
+
var SelectPrimitive = __toESM(require("@radix-ui/react-select"));
|
|
733
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
734
|
+
function Select({
|
|
735
|
+
...props
|
|
736
|
+
}) {
|
|
737
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SelectPrimitive.Root, { "data-slot": "select", ...props });
|
|
738
|
+
}
|
|
739
|
+
function SelectValue({
|
|
740
|
+
...props
|
|
741
|
+
}) {
|
|
742
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SelectPrimitive.Value, { "data-slot": "select-value", ...props });
|
|
743
|
+
}
|
|
744
|
+
function SelectTrigger({
|
|
745
|
+
className,
|
|
746
|
+
size = "default",
|
|
119
747
|
children,
|
|
748
|
+
...props
|
|
749
|
+
}) {
|
|
750
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
751
|
+
SelectPrimitive.Trigger,
|
|
752
|
+
{
|
|
753
|
+
"data-slot": "select-trigger",
|
|
754
|
+
"data-size": size,
|
|
755
|
+
className: cn(
|
|
756
|
+
"border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
757
|
+
className
|
|
758
|
+
),
|
|
759
|
+
...props,
|
|
760
|
+
children: [
|
|
761
|
+
children,
|
|
762
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ChevronDown, { className: "size-4 opacity-50" }) })
|
|
763
|
+
]
|
|
764
|
+
}
|
|
765
|
+
);
|
|
766
|
+
}
|
|
767
|
+
function SelectContent({
|
|
768
|
+
className,
|
|
769
|
+
children,
|
|
770
|
+
position = "popper",
|
|
771
|
+
...props
|
|
772
|
+
}) {
|
|
773
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SelectPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
774
|
+
SelectPrimitive.Content,
|
|
775
|
+
{
|
|
776
|
+
"data-slot": "select-content",
|
|
777
|
+
className: cn(
|
|
778
|
+
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md",
|
|
779
|
+
position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
|
|
780
|
+
className
|
|
781
|
+
),
|
|
782
|
+
position,
|
|
783
|
+
...props,
|
|
784
|
+
children: [
|
|
785
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SelectScrollUpButton, {}),
|
|
786
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
787
|
+
SelectPrimitive.Viewport,
|
|
788
|
+
{
|
|
789
|
+
className: cn(
|
|
790
|
+
"p-1",
|
|
791
|
+
position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"
|
|
792
|
+
),
|
|
793
|
+
children
|
|
794
|
+
}
|
|
795
|
+
),
|
|
796
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SelectScrollDownButton, {})
|
|
797
|
+
]
|
|
798
|
+
}
|
|
799
|
+
) });
|
|
800
|
+
}
|
|
801
|
+
function SelectItem({
|
|
802
|
+
className,
|
|
803
|
+
children,
|
|
804
|
+
...props
|
|
805
|
+
}) {
|
|
806
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
807
|
+
SelectPrimitive.Item,
|
|
808
|
+
{
|
|
809
|
+
"data-slot": "select-item",
|
|
810
|
+
className: cn(
|
|
811
|
+
"focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
|
|
812
|
+
className
|
|
813
|
+
),
|
|
814
|
+
...props,
|
|
815
|
+
children: [
|
|
816
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "absolute right-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Check, { className: "size-4" }) }) }),
|
|
817
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SelectPrimitive.ItemText, { children })
|
|
818
|
+
]
|
|
819
|
+
}
|
|
820
|
+
);
|
|
821
|
+
}
|
|
822
|
+
function SelectScrollUpButton({
|
|
823
|
+
className,
|
|
824
|
+
...props
|
|
825
|
+
}) {
|
|
826
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
827
|
+
SelectPrimitive.ScrollUpButton,
|
|
828
|
+
{
|
|
829
|
+
"data-slot": "select-scroll-up-button",
|
|
830
|
+
className: cn(
|
|
831
|
+
"flex cursor-default items-center justify-center py-1",
|
|
832
|
+
className
|
|
833
|
+
),
|
|
834
|
+
...props,
|
|
835
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ChevronUp, { className: "size-4" })
|
|
836
|
+
}
|
|
837
|
+
);
|
|
838
|
+
}
|
|
839
|
+
function SelectScrollDownButton({
|
|
840
|
+
className,
|
|
841
|
+
...props
|
|
842
|
+
}) {
|
|
843
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
844
|
+
SelectPrimitive.ScrollDownButton,
|
|
845
|
+
{
|
|
846
|
+
"data-slot": "select-scroll-down-button",
|
|
847
|
+
className: cn(
|
|
848
|
+
"flex cursor-default items-center justify-center py-1",
|
|
849
|
+
className
|
|
850
|
+
),
|
|
851
|
+
...props,
|
|
852
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ChevronDown, { className: "size-4" })
|
|
853
|
+
}
|
|
854
|
+
);
|
|
855
|
+
}
|
|
856
|
+
|
|
857
|
+
// src/components/Global/SelectDropdown.tsx
|
|
858
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
859
|
+
function SelectDropdown({
|
|
860
|
+
options,
|
|
861
|
+
placeholder = "Select an option",
|
|
862
|
+
value,
|
|
863
|
+
onChange,
|
|
120
864
|
className,
|
|
865
|
+
id,
|
|
866
|
+
disabled,
|
|
867
|
+
readOnly,
|
|
121
868
|
style
|
|
869
|
+
}) {
|
|
870
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Select, { value, onValueChange: onChange, disabled, children: [
|
|
871
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
872
|
+
SelectTrigger,
|
|
873
|
+
{
|
|
874
|
+
id,
|
|
875
|
+
className,
|
|
876
|
+
style: style ?? {},
|
|
877
|
+
"aria-readonly": readOnly,
|
|
878
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SelectValue, { placeholder })
|
|
879
|
+
}
|
|
880
|
+
),
|
|
881
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SelectContent, { children: options.map((opt) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SelectItem, { value: opt.value, children: opt.label }, opt.value)) })
|
|
882
|
+
] });
|
|
883
|
+
}
|
|
884
|
+
|
|
885
|
+
// src/components/Inputs/Dropdown/Dropdown.tsx
|
|
886
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
887
|
+
var Dropdown = ({ className, style, ...props }) => {
|
|
888
|
+
const text = Array.isArray(props.text) ? props.text : [props.text ?? "Default"];
|
|
889
|
+
const placeholder = props.placeholder ? props.placeholder : "Placeholder text";
|
|
890
|
+
const formatList = text.map((item) => ({
|
|
891
|
+
label: item || "value1",
|
|
892
|
+
value: item
|
|
893
|
+
}));
|
|
894
|
+
const regexPattern = props.regexPattern ?? "";
|
|
895
|
+
const errorMessage = props.errorMessage ?? "Required";
|
|
896
|
+
const isRequired = props.isRequired ?? false;
|
|
897
|
+
const isEditable = props.isEditable ?? true;
|
|
898
|
+
const isDisabled = props.isDisabled ?? false;
|
|
899
|
+
const isReadonly = props.isReadonly ?? false;
|
|
900
|
+
const isAutocomplete = props.isAutocomplete ?? false;
|
|
901
|
+
const [value, setValue] = React7.useState("");
|
|
902
|
+
const [error, setError] = React7.useState(null);
|
|
903
|
+
const handleChange = (val) => {
|
|
904
|
+
setValue(val);
|
|
905
|
+
if (isRequired && val.trim() === "") {
|
|
906
|
+
setError(errorMessage);
|
|
907
|
+
} else if (regexPattern && !new RegExp(regexPattern).test(val)) {
|
|
908
|
+
setError(errorMessage);
|
|
909
|
+
} else {
|
|
910
|
+
setError(null);
|
|
911
|
+
}
|
|
912
|
+
};
|
|
913
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
|
|
914
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex gap-3 flex-col", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
915
|
+
SelectDropdown,
|
|
916
|
+
{
|
|
917
|
+
options: formatList,
|
|
918
|
+
placeholder,
|
|
919
|
+
id: "select-field",
|
|
920
|
+
value,
|
|
921
|
+
className,
|
|
922
|
+
style,
|
|
923
|
+
autoComplete: isAutocomplete ? "on" : "off",
|
|
924
|
+
onChange: handleChange,
|
|
925
|
+
disabled: isDisabled || !isEditable,
|
|
926
|
+
readOnly: isReadonly,
|
|
927
|
+
required: isRequired,
|
|
928
|
+
pattern: regexPattern || void 0
|
|
929
|
+
}
|
|
930
|
+
) }),
|
|
931
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { className: "mt-1 text-xs text-red-500", children: error })
|
|
932
|
+
] });
|
|
933
|
+
};
|
|
934
|
+
|
|
935
|
+
// src/components/ui/switch.tsx
|
|
936
|
+
var SwitchPrimitive = __toESM(require("@radix-ui/react-switch"));
|
|
937
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
938
|
+
function Switch({
|
|
939
|
+
className,
|
|
940
|
+
...props
|
|
941
|
+
}) {
|
|
942
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
943
|
+
SwitchPrimitive.Root,
|
|
944
|
+
{
|
|
945
|
+
"data-slot": "switch",
|
|
946
|
+
className: cn(
|
|
947
|
+
"peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
|
|
948
|
+
className
|
|
949
|
+
),
|
|
950
|
+
...props,
|
|
951
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
952
|
+
SwitchPrimitive.Thumb,
|
|
953
|
+
{
|
|
954
|
+
"data-slot": "switch-thumb",
|
|
955
|
+
className: cn(
|
|
956
|
+
"bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0"
|
|
957
|
+
)
|
|
958
|
+
}
|
|
959
|
+
)
|
|
960
|
+
}
|
|
961
|
+
);
|
|
962
|
+
}
|
|
963
|
+
|
|
964
|
+
// src/components/Inputs/SwitchToggle/SwitchToggle.tsx
|
|
965
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
966
|
+
var SwitchToggle = ({ className, style, ...props }) => {
|
|
967
|
+
const text = Array.isArray(props.text) ? props.text : [props.text ?? "Subscribe"];
|
|
968
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className, style, children: text?.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center space-x-2 mb-2", children: [
|
|
969
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Switch, { id: `switch-${index}` }),
|
|
970
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Label, { htmlFor: `switch-${index}`, children: item })
|
|
971
|
+
] }, index)) });
|
|
972
|
+
};
|
|
973
|
+
|
|
974
|
+
// src/components/Inputs/PhoneInput/PhoneInput.tsx
|
|
975
|
+
var React8 = __toESM(require("react"));
|
|
976
|
+
var import_react_international_phone = require("react-international-phone");
|
|
977
|
+
var import_style = require("react-international-phone/style.css");
|
|
978
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
979
|
+
var PhoneInput = ({ className, style, ...props }) => {
|
|
980
|
+
const placeholder = props.placeholder ?? "Enter phone number";
|
|
981
|
+
const [value, setValue] = React8.useState("");
|
|
982
|
+
const regexPattern = props.regexPattern ?? "";
|
|
983
|
+
const errorMessage = props.errorMessage ?? "Required";
|
|
984
|
+
const noOfCharacters = props.noOfCharacters ?? 100;
|
|
985
|
+
const isRequired = props.isRequired ?? false;
|
|
986
|
+
const isEditable = props.isEditable ?? true;
|
|
987
|
+
const isDisabled = props.isDisabled ?? false;
|
|
988
|
+
const [error, setError] = React8.useState(null);
|
|
989
|
+
const handleChange = (val) => {
|
|
990
|
+
if (val.length > noOfCharacters) return;
|
|
991
|
+
setValue(val);
|
|
992
|
+
if (isRequired && val.trim() === "") {
|
|
993
|
+
setError(errorMessage);
|
|
994
|
+
} else if (regexPattern && !new RegExp(regexPattern).test(val)) {
|
|
995
|
+
setError(errorMessage);
|
|
996
|
+
} else {
|
|
997
|
+
setError(null);
|
|
998
|
+
}
|
|
999
|
+
};
|
|
1000
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
|
|
1001
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
1002
|
+
import_react_international_phone.PhoneInput,
|
|
1003
|
+
{
|
|
1004
|
+
defaultCountry: "in",
|
|
1005
|
+
value,
|
|
1006
|
+
onChange: (phone) => handleChange(phone),
|
|
1007
|
+
inputProps: {
|
|
1008
|
+
id: "phone-field",
|
|
1009
|
+
required: isRequired
|
|
1010
|
+
},
|
|
1011
|
+
placeholder,
|
|
1012
|
+
disabled: isDisabled || !isEditable,
|
|
1013
|
+
required: isRequired,
|
|
1014
|
+
className,
|
|
1015
|
+
style
|
|
1016
|
+
}
|
|
1017
|
+
),
|
|
1018
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("p", { className: "mt-1 text-xs text-red-500", children: error })
|
|
1019
|
+
] });
|
|
1020
|
+
};
|
|
1021
|
+
|
|
1022
|
+
// src/components/Inputs/DatePicker/DatePicker.tsx
|
|
1023
|
+
var import_react5 = __toESM(require("react"));
|
|
1024
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
1025
|
+
|
|
1026
|
+
// src/components/Inputs/DateRange/DateRange.tsx
|
|
1027
|
+
var React11 = __toESM(require("react"));
|
|
1028
|
+
var import_date_fns = require("date-fns");
|
|
1029
|
+
|
|
1030
|
+
// src/components/ui/calendar.tsx
|
|
1031
|
+
var React10 = __toESM(require("react"));
|
|
1032
|
+
var import_react_day_picker = require("react-day-picker");
|
|
1033
|
+
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
1034
|
+
function Calendar({
|
|
1035
|
+
className,
|
|
1036
|
+
classNames,
|
|
1037
|
+
showOutsideDays = true,
|
|
1038
|
+
captionLayout = "label",
|
|
1039
|
+
buttonVariant = "ghost",
|
|
1040
|
+
formatters,
|
|
1041
|
+
components,
|
|
1042
|
+
...props
|
|
1043
|
+
}) {
|
|
1044
|
+
const defaultClassNames = (0, import_react_day_picker.getDefaultClassNames)();
|
|
1045
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1046
|
+
import_react_day_picker.DayPicker,
|
|
1047
|
+
{
|
|
1048
|
+
showOutsideDays,
|
|
1049
|
+
className: cn(
|
|
1050
|
+
"bg-background group/calendar p-3 [--cell-size:--spacing(8)] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent",
|
|
1051
|
+
String.raw`rtl:**:[.rdp-button\_next>svg]:rotate-180`,
|
|
1052
|
+
String.raw`rtl:**:[.rdp-button\_previous>svg]:rotate-180`,
|
|
1053
|
+
className
|
|
1054
|
+
),
|
|
1055
|
+
captionLayout,
|
|
1056
|
+
formatters: {
|
|
1057
|
+
formatMonthDropdown: (date) => date.toLocaleString("default", { month: "short" }),
|
|
1058
|
+
...formatters
|
|
1059
|
+
},
|
|
1060
|
+
classNames: {
|
|
1061
|
+
root: cn("w-fit", defaultClassNames.root),
|
|
1062
|
+
months: cn(
|
|
1063
|
+
"flex gap-4 flex-col md:flex-row relative",
|
|
1064
|
+
defaultClassNames.months
|
|
1065
|
+
),
|
|
1066
|
+
month: cn("flex flex-col w-full gap-4", defaultClassNames.month),
|
|
1067
|
+
nav: cn(
|
|
1068
|
+
"flex items-center gap-1 w-full absolute top-0 inset-x-0 justify-between",
|
|
1069
|
+
defaultClassNames.nav
|
|
1070
|
+
),
|
|
1071
|
+
button_previous: cn(
|
|
1072
|
+
buttonVariants({ variant: buttonVariant }),
|
|
1073
|
+
"size-(--cell-size) aria-disabled:opacity-50 p-0 select-none",
|
|
1074
|
+
defaultClassNames.button_previous
|
|
1075
|
+
),
|
|
1076
|
+
button_next: cn(
|
|
1077
|
+
buttonVariants({ variant: buttonVariant }),
|
|
1078
|
+
"size-(--cell-size) aria-disabled:opacity-50 p-0 select-none",
|
|
1079
|
+
defaultClassNames.button_next
|
|
1080
|
+
),
|
|
1081
|
+
month_caption: cn(
|
|
1082
|
+
"flex items-center justify-center h-(--cell-size) w-full px-(--cell-size)",
|
|
1083
|
+
defaultClassNames.month_caption
|
|
1084
|
+
),
|
|
1085
|
+
dropdowns: cn(
|
|
1086
|
+
"w-full flex items-center text-sm font-medium justify-center h-(--cell-size) gap-1.5",
|
|
1087
|
+
defaultClassNames.dropdowns
|
|
1088
|
+
),
|
|
1089
|
+
dropdown_root: cn(
|
|
1090
|
+
"relative has-focus:border-ring border border-input shadow-xs has-focus:ring-ring/50 has-focus:ring-[3px] rounded-md",
|
|
1091
|
+
defaultClassNames.dropdown_root
|
|
1092
|
+
),
|
|
1093
|
+
dropdown: cn(
|
|
1094
|
+
"absolute bg-popover inset-0 opacity-0",
|
|
1095
|
+
defaultClassNames.dropdown
|
|
1096
|
+
),
|
|
1097
|
+
caption_label: cn(
|
|
1098
|
+
"select-none font-medium",
|
|
1099
|
+
captionLayout === "label" ? "text-sm" : "rounded-md pl-2 pr-1 flex items-center gap-1 text-sm h-8 [&>svg]:text-muted-foreground [&>svg]:size-3.5",
|
|
1100
|
+
defaultClassNames.caption_label
|
|
1101
|
+
),
|
|
1102
|
+
table: "w-full border-collapse",
|
|
1103
|
+
weekdays: cn("flex", defaultClassNames.weekdays),
|
|
1104
|
+
weekday: cn(
|
|
1105
|
+
"text-muted-foreground rounded-md flex-1 font-normal text-[0.8rem] select-none",
|
|
1106
|
+
defaultClassNames.weekday
|
|
1107
|
+
),
|
|
1108
|
+
week: cn("flex w-full mt-2", defaultClassNames.week),
|
|
1109
|
+
week_number_header: cn(
|
|
1110
|
+
"select-none w-(--cell-size)",
|
|
1111
|
+
defaultClassNames.week_number_header
|
|
1112
|
+
),
|
|
1113
|
+
week_number: cn(
|
|
1114
|
+
"text-[0.8rem] select-none text-muted-foreground",
|
|
1115
|
+
defaultClassNames.week_number
|
|
1116
|
+
),
|
|
1117
|
+
day: cn(
|
|
1118
|
+
"relative w-full h-full p-0 text-center [&:first-child[data-selected=true]_button]:rounded-l-md [&:last-child[data-selected=true]_button]:rounded-r-md group/day aspect-square select-none",
|
|
1119
|
+
defaultClassNames.day
|
|
1120
|
+
),
|
|
1121
|
+
range_start: cn(
|
|
1122
|
+
"rounded-l-md bg-accent",
|
|
1123
|
+
defaultClassNames.range_start
|
|
1124
|
+
),
|
|
1125
|
+
range_middle: cn("rounded-none", defaultClassNames.range_middle),
|
|
1126
|
+
range_end: cn("rounded-r-md bg-accent", defaultClassNames.range_end),
|
|
1127
|
+
today: cn(
|
|
1128
|
+
"bg-accent text-accent-foreground rounded-md data-[selected=true]:rounded-none",
|
|
1129
|
+
defaultClassNames.today
|
|
1130
|
+
),
|
|
1131
|
+
outside: cn(
|
|
1132
|
+
"text-muted-foreground aria-selected:text-muted-foreground",
|
|
1133
|
+
defaultClassNames.outside
|
|
1134
|
+
),
|
|
1135
|
+
disabled: cn(
|
|
1136
|
+
"text-muted-foreground opacity-50",
|
|
1137
|
+
defaultClassNames.disabled
|
|
1138
|
+
),
|
|
1139
|
+
hidden: cn("invisible", defaultClassNames.hidden),
|
|
1140
|
+
...classNames
|
|
1141
|
+
},
|
|
1142
|
+
components: {
|
|
1143
|
+
Root: ({ className: className2, rootRef, ...props2 }) => {
|
|
1144
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1145
|
+
"div",
|
|
1146
|
+
{
|
|
1147
|
+
"data-slot": "calendar",
|
|
1148
|
+
ref: rootRef,
|
|
1149
|
+
className: cn(className2),
|
|
1150
|
+
...props2
|
|
1151
|
+
}
|
|
1152
|
+
);
|
|
1153
|
+
},
|
|
1154
|
+
Chevron: ({ className: className2, orientation, ...props2 }) => {
|
|
1155
|
+
if (orientation === "left") {
|
|
1156
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ChevronLeft, { className: cn("size-4", className2), ...props2 });
|
|
1157
|
+
}
|
|
1158
|
+
if (orientation === "right") {
|
|
1159
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1160
|
+
ChevronRight,
|
|
1161
|
+
{
|
|
1162
|
+
className: cn("size-4", className2),
|
|
1163
|
+
...props2
|
|
1164
|
+
}
|
|
1165
|
+
);
|
|
1166
|
+
}
|
|
1167
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ChevronDown, { className: cn("size-4", className2), ...props2 });
|
|
1168
|
+
},
|
|
1169
|
+
DayButton: CalendarDayButton,
|
|
1170
|
+
WeekNumber: ({ children, ...props2 }) => {
|
|
1171
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("td", { ...props2, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "flex size-(--cell-size) items-center justify-center text-center", children }) });
|
|
1172
|
+
},
|
|
1173
|
+
...components
|
|
1174
|
+
},
|
|
1175
|
+
...props
|
|
1176
|
+
}
|
|
1177
|
+
);
|
|
1178
|
+
}
|
|
1179
|
+
function CalendarDayButton({
|
|
1180
|
+
className,
|
|
1181
|
+
day,
|
|
1182
|
+
modifiers,
|
|
1183
|
+
...props
|
|
1184
|
+
}) {
|
|
1185
|
+
const defaultClassNames = (0, import_react_day_picker.getDefaultClassNames)();
|
|
1186
|
+
const ref = React10.useRef(null);
|
|
1187
|
+
React10.useEffect(() => {
|
|
1188
|
+
if (modifiers.focused) ref.current?.focus();
|
|
1189
|
+
}, [modifiers.focused]);
|
|
1190
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1191
|
+
Button,
|
|
1192
|
+
{
|
|
1193
|
+
ref,
|
|
1194
|
+
variant: "ghost",
|
|
1195
|
+
size: "icon",
|
|
1196
|
+
"data-day": day.date.toLocaleDateString(),
|
|
1197
|
+
"data-selected-single": modifiers.selected && !modifiers.range_start && !modifiers.range_end && !modifiers.range_middle,
|
|
1198
|
+
"data-range-start": modifiers.range_start,
|
|
1199
|
+
"data-range-end": modifiers.range_end,
|
|
1200
|
+
"data-range-middle": modifiers.range_middle,
|
|
1201
|
+
className: cn(
|
|
1202
|
+
"data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground data-[range-middle=true]:bg-accent data-[range-middle=true]:text-accent-foreground data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-ring/50 dark:hover:text-accent-foreground flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:ring-[3px] data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md [&>span]:text-xs [&>span]:opacity-70",
|
|
1203
|
+
defaultClassNames.day,
|
|
1204
|
+
className
|
|
1205
|
+
),
|
|
1206
|
+
...props
|
|
1207
|
+
}
|
|
1208
|
+
);
|
|
1209
|
+
}
|
|
1210
|
+
|
|
1211
|
+
// src/components/ui/popover.tsx
|
|
1212
|
+
var PopoverPrimitive = __toESM(require("@radix-ui/react-popover"));
|
|
1213
|
+
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
1214
|
+
function Popover({
|
|
1215
|
+
...props
|
|
1216
|
+
}) {
|
|
1217
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(PopoverPrimitive.Root, { "data-slot": "popover", ...props });
|
|
1218
|
+
}
|
|
1219
|
+
function PopoverTrigger({
|
|
1220
|
+
...props
|
|
1221
|
+
}) {
|
|
1222
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(PopoverPrimitive.Trigger, { "data-slot": "popover-trigger", ...props });
|
|
1223
|
+
}
|
|
1224
|
+
function PopoverContent({
|
|
1225
|
+
className,
|
|
1226
|
+
align = "center",
|
|
1227
|
+
sideOffset = 4,
|
|
1228
|
+
...props
|
|
1229
|
+
}) {
|
|
1230
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(PopoverPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
1231
|
+
PopoverPrimitive.Content,
|
|
1232
|
+
{
|
|
1233
|
+
"data-slot": "popover-content",
|
|
1234
|
+
align,
|
|
1235
|
+
sideOffset,
|
|
1236
|
+
className: cn(
|
|
1237
|
+
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
|
|
1238
|
+
className
|
|
1239
|
+
),
|
|
1240
|
+
...props
|
|
1241
|
+
}
|
|
1242
|
+
) });
|
|
1243
|
+
}
|
|
1244
|
+
|
|
1245
|
+
// src/components/Inputs/DateRange/DateRange.tsx
|
|
1246
|
+
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
1247
|
+
var DateRange = ({ className, style }) => {
|
|
1248
|
+
const [date, setDate] = React11.useState({
|
|
1249
|
+
from: /* @__PURE__ */ new Date(),
|
|
1250
|
+
to: (0, import_date_fns.addDays)(/* @__PURE__ */ new Date(), 7)
|
|
1251
|
+
});
|
|
1252
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className, style, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Popover, { children: [
|
|
1253
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1254
|
+
Button,
|
|
1255
|
+
{
|
|
1256
|
+
id: "date",
|
|
1257
|
+
variant: "outline",
|
|
1258
|
+
className: cn(
|
|
1259
|
+
"w-[300px] justify-start text-left font-normal text-[11px]",
|
|
1260
|
+
!date && "text-muted-foreground"
|
|
1261
|
+
),
|
|
1262
|
+
children: date?.from ? date.to ? /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_jsx_runtime29.Fragment, { children: [
|
|
1263
|
+
(0, import_date_fns.format)(date.from, "LLL dd, y"),
|
|
1264
|
+
" -",
|
|
1265
|
+
" ",
|
|
1266
|
+
(0, import_date_fns.format)(date.to, "LLL dd, y")
|
|
1267
|
+
] }) : (0, import_date_fns.format)(date.from, "LLL dd, y") : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { children: "Pick a date range" })
|
|
1268
|
+
}
|
|
1269
|
+
) }),
|
|
1270
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(PopoverContent, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1271
|
+
Calendar,
|
|
1272
|
+
{
|
|
1273
|
+
mode: "range",
|
|
1274
|
+
defaultMonth: date?.from,
|
|
1275
|
+
selected: date,
|
|
1276
|
+
onSelect: setDate,
|
|
1277
|
+
numberOfMonths: 2
|
|
1278
|
+
}
|
|
1279
|
+
) })
|
|
1280
|
+
] }) });
|
|
1281
|
+
};
|
|
1282
|
+
|
|
1283
|
+
// src/components/ui/data-table.tsx
|
|
1284
|
+
var import_react_table = require("@tanstack/react-table");
|
|
1285
|
+
|
|
1286
|
+
// src/components/ui/table.tsx
|
|
1287
|
+
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
1288
|
+
function Table({ className, ...props }) {
|
|
1289
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1290
|
+
"div",
|
|
1291
|
+
{
|
|
1292
|
+
"data-slot": "table-container",
|
|
1293
|
+
className: "relative w-full overflow-x-auto rounded-md border border-gray-200 bg-white",
|
|
1294
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1295
|
+
"table",
|
|
1296
|
+
{
|
|
1297
|
+
"data-slot": "table",
|
|
1298
|
+
className: cn("w-full text-sm", className),
|
|
1299
|
+
...props
|
|
1300
|
+
}
|
|
1301
|
+
)
|
|
1302
|
+
}
|
|
1303
|
+
);
|
|
1304
|
+
}
|
|
1305
|
+
function TableHeader({ className, ...props }) {
|
|
1306
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1307
|
+
"thead",
|
|
1308
|
+
{
|
|
1309
|
+
"data-slot": "table-header",
|
|
1310
|
+
className: cn(
|
|
1311
|
+
"bg-gray-100 text-gray-700 [&>tr]:border-b [&>tr]:border-gray-200 [&>tr>th]:border-r [&>tr>th]:border-gray-200 [&>tr>th]:last:border-r-0",
|
|
1312
|
+
className
|
|
1313
|
+
),
|
|
1314
|
+
...props
|
|
1315
|
+
}
|
|
1316
|
+
);
|
|
1317
|
+
}
|
|
1318
|
+
function TableBody({ className, ...props }) {
|
|
1319
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1320
|
+
"tbody",
|
|
1321
|
+
{
|
|
1322
|
+
"data-slot": "table-body",
|
|
1323
|
+
className: cn(
|
|
1324
|
+
"[&>tr]:border-b [&>tr]:border-gray-200 [&>tr:last-child]:border-0 [&>tr>td]:border-r [&>tr>td]:border-gray-200 [&>tr>td]:last:border-r-0",
|
|
1325
|
+
className
|
|
1326
|
+
),
|
|
1327
|
+
...props
|
|
1328
|
+
}
|
|
1329
|
+
);
|
|
1330
|
+
}
|
|
1331
|
+
function TableRow({ className, ...props }) {
|
|
1332
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1333
|
+
"tr",
|
|
1334
|
+
{
|
|
1335
|
+
"data-slot": "table-row",
|
|
1336
|
+
className: cn(
|
|
1337
|
+
"border-b border-gray-200 hover:bg-gray-50 transition-colors",
|
|
1338
|
+
className
|
|
1339
|
+
),
|
|
1340
|
+
...props
|
|
1341
|
+
}
|
|
1342
|
+
);
|
|
1343
|
+
}
|
|
1344
|
+
function TableHead({ className, ...props }) {
|
|
1345
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1346
|
+
"th",
|
|
1347
|
+
{
|
|
1348
|
+
"data-slot": "table-head",
|
|
1349
|
+
className: cn(
|
|
1350
|
+
"h-12 px-6 text-left align-middle font-semibold whitespace-nowrap",
|
|
1351
|
+
className
|
|
1352
|
+
),
|
|
1353
|
+
...props
|
|
1354
|
+
}
|
|
1355
|
+
);
|
|
1356
|
+
}
|
|
1357
|
+
function TableCell({ className, ...props }) {
|
|
1358
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1359
|
+
"td",
|
|
1360
|
+
{
|
|
1361
|
+
"data-slot": "table-cell",
|
|
1362
|
+
className: cn(
|
|
1363
|
+
"px-6 py-4 align-middle text-gray-700",
|
|
1364
|
+
className
|
|
1365
|
+
),
|
|
1366
|
+
...props
|
|
1367
|
+
}
|
|
1368
|
+
);
|
|
1369
|
+
}
|
|
1370
|
+
|
|
1371
|
+
// src/components/ui/data-table.tsx
|
|
1372
|
+
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
1373
|
+
function DataTable({
|
|
1374
|
+
columns,
|
|
1375
|
+
rowActions,
|
|
1376
|
+
data,
|
|
1377
|
+
loading,
|
|
1378
|
+
getRowSelection,
|
|
1379
|
+
onCellClick,
|
|
1380
|
+
cellClickEnabled = () => false
|
|
1381
|
+
}) {
|
|
1382
|
+
const table = (0, import_react_table.useReactTable)({
|
|
1383
|
+
data,
|
|
1384
|
+
columns,
|
|
1385
|
+
enableRowSelection: true,
|
|
1386
|
+
onRowSelectionChange: getRowSelection ? (updaterOrValue) => {
|
|
1387
|
+
const value = typeof updaterOrValue === "function" ? updaterOrValue(table.getState().rowSelection) : updaterOrValue;
|
|
1388
|
+
getRowSelection(value);
|
|
1389
|
+
} : void 0,
|
|
1390
|
+
getCoreRowModel: (0, import_react_table.getCoreRowModel)()
|
|
1391
|
+
});
|
|
1392
|
+
const handleCellClick = (rowData, columnId) => {
|
|
1393
|
+
if (onCellClick) {
|
|
1394
|
+
onCellClick(rowData, columnId);
|
|
1395
|
+
}
|
|
1396
|
+
};
|
|
1397
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "overflow-hidden rounded-md border w-full", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(Table, { children: [
|
|
1398
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TableRow, { children: headerGroup.headers.map((header) => {
|
|
1399
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TableHead, { children: header.isPlaceholder ? null : (0, import_react_table.flexRender)(
|
|
1400
|
+
header.column.columnDef.header,
|
|
1401
|
+
header.getContext()
|
|
1402
|
+
) }, header.id);
|
|
1403
|
+
}) }, headerGroup.id)) }),
|
|
1404
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TableBody, { children: loading ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TableRow, { children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TableCell, { colSpan: columns.length, className: "h-24 text-center", children: "Loading..." }) }) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_jsx_runtime31.Fragment, { children: table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
|
1405
|
+
TableRow,
|
|
1406
|
+
{
|
|
1407
|
+
"data-state": row.getIsSelected() && "selected",
|
|
1408
|
+
className: "relative group",
|
|
1409
|
+
children: [
|
|
1410
|
+
row.getVisibleCells().map((cell) => {
|
|
1411
|
+
const isCellClickable = cellClickEnabled(row.original, cell.column.id);
|
|
1412
|
+
const dynamicClass = cell.column.columnDef.meta?.cellClass || "";
|
|
1413
|
+
const dynamicStyle = cell.column.columnDef.meta?.cellStyle || {};
|
|
1414
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
1415
|
+
TableCell,
|
|
1416
|
+
{
|
|
1417
|
+
className: `${dynamicClass} ${isCellClickable ? "underline cursor-pointer" : ""}`,
|
|
1418
|
+
style: dynamicStyle,
|
|
1419
|
+
onClick: () => {
|
|
1420
|
+
if (isCellClickable) {
|
|
1421
|
+
handleCellClick(row.original, cell.column.id);
|
|
1422
|
+
}
|
|
1423
|
+
},
|
|
1424
|
+
children: (0, import_react_table.flexRender)(cell.column.columnDef.cell, cell.getContext())
|
|
1425
|
+
},
|
|
1426
|
+
cell.id
|
|
1427
|
+
);
|
|
1428
|
+
}),
|
|
1429
|
+
rowActions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "absolute top-0 right-0 bg-white py-3 min-w-[100px] z-50 shadow-md flex items-center justify-center gap-3 p-2 opacity-0 group-hover:opacity-100 duration-300 h-full", children: rowActions.map((action, index) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("p", { className: "text-[#383838] text-[12px] cursor-pointer font-[400]", children: action.header }, index)) })
|
|
1430
|
+
]
|
|
1431
|
+
},
|
|
1432
|
+
row.id
|
|
1433
|
+
)) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TableRow, { children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TableCell, { colSpan: columns.length, className: "h-24 text-center", children: "No results." }) }) }) })
|
|
1434
|
+
] }) });
|
|
1435
|
+
}
|
|
1436
|
+
|
|
1437
|
+
// src/components/DataDisplay/Table/Table.tsx
|
|
1438
|
+
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
1439
|
+
var Table2 = ({ columns, data, rowActions }) => {
|
|
1440
|
+
const rawColumns = Array.isArray(columns) ? columns : [];
|
|
1441
|
+
const rawData = Array.isArray(data) ? data : [];
|
|
1442
|
+
const rawRowActions = Array.isArray(rowActions) ? rowActions : [];
|
|
1443
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(DataTable, { columns: rawColumns, data: rawData, rowActions: rawRowActions });
|
|
1444
|
+
};
|
|
1445
|
+
var Table_default = Table2;
|
|
1446
|
+
|
|
1447
|
+
// src/components/ui/dropdown-menu.tsx
|
|
1448
|
+
var DropdownMenuPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"));
|
|
1449
|
+
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
1450
|
+
function DropdownMenu({
|
|
1451
|
+
...props
|
|
1452
|
+
}) {
|
|
1453
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(DropdownMenuPrimitive.Root, { "data-slot": "dropdown-menu", ...props });
|
|
1454
|
+
}
|
|
1455
|
+
function DropdownMenuTrigger({
|
|
1456
|
+
...props
|
|
1457
|
+
}) {
|
|
1458
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1459
|
+
DropdownMenuPrimitive.Trigger,
|
|
1460
|
+
{
|
|
1461
|
+
"data-slot": "dropdown-menu-trigger",
|
|
1462
|
+
...props
|
|
1463
|
+
}
|
|
1464
|
+
);
|
|
1465
|
+
}
|
|
1466
|
+
function DropdownMenuContent({
|
|
1467
|
+
className,
|
|
1468
|
+
sideOffset = 4,
|
|
1469
|
+
...props
|
|
1470
|
+
}) {
|
|
1471
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1472
|
+
DropdownMenuPrimitive.Content,
|
|
1473
|
+
{
|
|
1474
|
+
"data-slot": "dropdown-menu-content",
|
|
1475
|
+
sideOffset,
|
|
1476
|
+
className: cn(
|
|
1477
|
+
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md",
|
|
1478
|
+
className
|
|
1479
|
+
),
|
|
1480
|
+
...props
|
|
1481
|
+
}
|
|
1482
|
+
) });
|
|
1483
|
+
}
|
|
1484
|
+
function DropdownMenuItem({
|
|
1485
|
+
className,
|
|
1486
|
+
inset,
|
|
1487
|
+
variant = "default",
|
|
1488
|
+
...props
|
|
1489
|
+
}) {
|
|
1490
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1491
|
+
DropdownMenuPrimitive.Item,
|
|
1492
|
+
{
|
|
1493
|
+
"data-slot": "dropdown-menu-item",
|
|
1494
|
+
"data-inset": inset,
|
|
1495
|
+
"data-variant": variant,
|
|
1496
|
+
className: cn(
|
|
1497
|
+
"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
1498
|
+
className
|
|
1499
|
+
),
|
|
1500
|
+
...props
|
|
1501
|
+
}
|
|
1502
|
+
);
|
|
1503
|
+
}
|
|
1504
|
+
|
|
1505
|
+
// src/components/Navigation/Tabs/Tabs.tsx
|
|
1506
|
+
var import_jsx_runtime34 = require("react/jsx-runtime");
|
|
1507
|
+
var Tabs = ({ tabs, className, style }) => {
|
|
1508
|
+
const rawTabs = Array.isArray(tabs) ? tabs : [];
|
|
1509
|
+
const baseClasses = "text-[12px] text-[#E9E9E9] p-2 text-center rounded-md transition-colors border-none outline-none focus:outline-none focus:ring-0 focus:ring-offset-0 cursor-pointer select-none ";
|
|
1510
|
+
const activeClasses = "bg-white/10 text-white";
|
|
1511
|
+
const hoverClasses = "hover:bg-white/5";
|
|
1512
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className, style, children: rawTabs.map((tab, index) => {
|
|
1513
|
+
const finalClasses = [
|
|
1514
|
+
baseClasses,
|
|
1515
|
+
tab.isActive ? activeClasses : hoverClasses,
|
|
1516
|
+
tab.className || ""
|
|
1517
|
+
].join(" ");
|
|
1518
|
+
const hasDropdown = Array.isArray(tab.children) && tab.children.length > 0 && tab.isDropDown;
|
|
1519
|
+
if (hasDropdown) {
|
|
1520
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(DropdownMenu, { children: [
|
|
1521
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
1522
|
+
DropdownMenuTrigger,
|
|
1523
|
+
{
|
|
1524
|
+
className: `${finalClasses} inline-flex items-center gap-1`,
|
|
1525
|
+
children: [
|
|
1526
|
+
tab.header,
|
|
1527
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(ChevronDown, { className: "h-4 w-4 opacity-80" })
|
|
1528
|
+
]
|
|
1529
|
+
}
|
|
1530
|
+
),
|
|
1531
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
1532
|
+
DropdownMenuContent,
|
|
1533
|
+
{
|
|
1534
|
+
align: "start",
|
|
1535
|
+
sideOffset: 6,
|
|
1536
|
+
className: "z-50 min-w-[160px] rounded-md border border-gray-200 bg-white p-1 shadow-lg",
|
|
1537
|
+
children: tab.children.map((item) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
1538
|
+
DropdownMenuItem,
|
|
1539
|
+
{
|
|
1540
|
+
asChild: true,
|
|
1541
|
+
className: "cursor-pointer rounded-sm px-3 py-2 text-[12px] text-gray-800 hover:bg-gray-100 focus:bg-gray-100",
|
|
1542
|
+
children: item.header
|
|
1543
|
+
},
|
|
1544
|
+
item.id
|
|
1545
|
+
))
|
|
1546
|
+
}
|
|
1547
|
+
)
|
|
1548
|
+
] }, index);
|
|
1549
|
+
}
|
|
1550
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: finalClasses, style: { backgroundColor: "transparent", border: "none", ...tab.style }, role: "button", tabIndex: 0, children: tab.header }, index);
|
|
1551
|
+
}) });
|
|
1552
|
+
};
|
|
1553
|
+
var Tabs_default = Tabs;
|
|
1554
|
+
|
|
1555
|
+
// src/components/Navigation/Stages/Stages.tsx
|
|
1556
|
+
var import_react6 = __toESM(require("react"));
|
|
1557
|
+
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
1558
|
+
var StagesComponent = ({ stages, isShowBtn, buttonText, className, style }) => {
|
|
1559
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className, style, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex items-center justify-between bg-gray-50 p-2 rounded-lg border border-gray-200 w-full", children: [
|
|
1560
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "flex items-center", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("button", { className: "p-2 hover:bg-gray-100 rounded", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("svg", { className: "w-4 h-4 text-gray-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }) }) }) }),
|
|
1561
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "flex items-center flex-1 px-2", children: stages.map((stage, index) => /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_react6.default.Fragment, { children: [
|
|
1562
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
1563
|
+
"button",
|
|
1564
|
+
{
|
|
1565
|
+
className: `
|
|
1566
|
+
min-w-[120px] px-4 py-2 rounded-full text-sm font-medium transition-colors duration-200 whitespace-nowrap ${stage.isActive ? "bg-[#034486] text-white shadow-md" : "bg-white text-gray-700 hover:bg-gray-100 border border-gray-200"}`,
|
|
1567
|
+
children: stage.header
|
|
1568
|
+
}
|
|
1569
|
+
),
|
|
1570
|
+
index < stages.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "flex-shrink-0 w-3 h-px bg-gray-300" })
|
|
1571
|
+
] }, stage.id)) }),
|
|
1572
|
+
isShowBtn && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "flex items-center", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("button", { className: "bg-[#034486] text-white px-6 py-2 rounded-lg text-sm font-medium transition-colors duration-200 shadow-sm", children: buttonText }) })
|
|
1573
|
+
] }) });
|
|
1574
|
+
};
|
|
1575
|
+
var Stages_default = StagesComponent;
|
|
1576
|
+
|
|
1577
|
+
// src/components/Navigation/Spacer/Spacer.tsx
|
|
1578
|
+
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
1579
|
+
var Spacer = ({ className, style }) => {
|
|
1580
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: `${className}`, style });
|
|
1581
|
+
};
|
|
1582
|
+
var Spacer_default = Spacer;
|
|
1583
|
+
|
|
1584
|
+
// src/components/Navigation/Profile/Profile.tsx
|
|
1585
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
1586
|
+
var Profile = ({ profileType, showName, userName, className, style }) => {
|
|
1587
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className, style, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex gap-2 items-center justify-between w-30 cursor-pointer", children: [
|
|
1588
|
+
showName && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("h4", { className: "text-[#000000] dark:text-[#fff] text-[13px] font-[500] mb-0", children: userName }),
|
|
1589
|
+
profileType === "avatar" ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
1590
|
+
"img",
|
|
1591
|
+
{
|
|
1592
|
+
src: "https://builder.development.algorithmshift.ai/images/toolset/profile.svg",
|
|
1593
|
+
alt: "auto",
|
|
1594
|
+
width: 24,
|
|
1595
|
+
height: 24
|
|
1596
|
+
}
|
|
1597
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "w-6 h-6 bg-[#12715b] rounded-full text-[#fff] text-center text-[11px] flex items-center justify-center", children: "A" })
|
|
1598
|
+
] }) });
|
|
1599
|
+
};
|
|
1600
|
+
var Profile_default = Profile;
|
|
1601
|
+
|
|
1602
|
+
// src/components/Navigation/Notification/Notification.tsx
|
|
1603
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
1604
|
+
var Notification = ({ className, style, badgeType, badgeCount, hideBadgeWhenZero }) => {
|
|
1605
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className, style, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "w-[34px] h-[34px] bg-[#E9E9E9] rounded-md text-center flex items-center justify-center relative", children: [
|
|
1606
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
1607
|
+
"img",
|
|
1608
|
+
{
|
|
1609
|
+
src: "https://builder.development.algorithmshift.ai/images/toolset/notification.svg",
|
|
1610
|
+
alt: "auto",
|
|
1611
|
+
width: 18,
|
|
1612
|
+
height: 18
|
|
1613
|
+
}
|
|
1614
|
+
),
|
|
1615
|
+
badgeType === "number" && !(hideBadgeWhenZero && badgeCount === 0) && badgeCount > 0 ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "text-[10px] text-[#fff] bg-[#FF4A4A] w-[20px] h-[20px] rounded-full absolute top-0 right-0 transform translate-x-1/2 -translate-y-1/2 leading-[20px]", children: badgeCount }) : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "bg-[#FF4A4A] w-[10px] h-[10px] rounded-full absolute top-0 right-0 transform translate-x-1/2 -translate-y-1/2 leading-[20px]" })
|
|
1616
|
+
] }) });
|
|
1617
|
+
};
|
|
1618
|
+
var Notification_default = Notification;
|
|
1619
|
+
|
|
1620
|
+
// src/components/Navigation/Logo/Logo.tsx
|
|
1621
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
1622
|
+
var ImageControl = ({
|
|
1623
|
+
className,
|
|
1624
|
+
style,
|
|
1625
|
+
imageUrl
|
|
122
1626
|
}) => {
|
|
123
|
-
|
|
1627
|
+
let src;
|
|
1628
|
+
let extraProps;
|
|
1629
|
+
if (imageUrl) {
|
|
1630
|
+
src = imageUrl;
|
|
1631
|
+
extraProps = {
|
|
1632
|
+
className: "w-full h-full"
|
|
1633
|
+
};
|
|
1634
|
+
} else {
|
|
1635
|
+
src = "https://builder.development.algorithmshift.ai/_next/image?url=%2Fdrag_and_drop.png&w=1920&q=75";
|
|
1636
|
+
extraProps = {
|
|
1637
|
+
width: 50,
|
|
1638
|
+
height: 50,
|
|
1639
|
+
className: "opacity-50"
|
|
1640
|
+
};
|
|
1641
|
+
}
|
|
1642
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className, style, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("img", { src, alt: "Preview", sizes: "100vw", ...extraProps }) });
|
|
124
1643
|
};
|
|
125
|
-
var
|
|
1644
|
+
var Logo_default = ImageControl;
|
|
126
1645
|
// Annotate the CommonJS export names for ESM import in node:
|
|
127
1646
|
0 && (module.exports = {
|
|
128
1647
|
Button,
|
|
129
|
-
|
|
1648
|
+
CheckboxInput,
|
|
1649
|
+
DateRange,
|
|
1650
|
+
Dropdown,
|
|
1651
|
+
EmailInput,
|
|
130
1652
|
FlexLayout,
|
|
131
1653
|
GridLayout,
|
|
1654
|
+
Logo,
|
|
1655
|
+
MultiCheckbox,
|
|
1656
|
+
Notification,
|
|
1657
|
+
PasswordInput,
|
|
1658
|
+
PhoneInput,
|
|
1659
|
+
Profile,
|
|
1660
|
+
RadioInput,
|
|
1661
|
+
Spacer,
|
|
1662
|
+
Stages,
|
|
1663
|
+
SwitchToggle,
|
|
1664
|
+
Table,
|
|
1665
|
+
Tabs,
|
|
1666
|
+
TextInput,
|
|
1667
|
+
Textarea,
|
|
1668
|
+
Typography,
|
|
1669
|
+
UrlInput,
|
|
132
1670
|
buttonVariants,
|
|
133
1671
|
cn
|
|
134
1672
|
});
|
|
1673
|
+
/*! Bundled license information:
|
|
1674
|
+
|
|
1675
|
+
lucide-react/dist/esm/shared/src/utils.js:
|
|
1676
|
+
lucide-react/dist/esm/defaultAttributes.js:
|
|
1677
|
+
lucide-react/dist/esm/Icon.js:
|
|
1678
|
+
lucide-react/dist/esm/createLucideIcon.js:
|
|
1679
|
+
lucide-react/dist/esm/icons/check.js:
|
|
1680
|
+
lucide-react/dist/esm/icons/chevron-down.js:
|
|
1681
|
+
lucide-react/dist/esm/icons/chevron-left.js:
|
|
1682
|
+
lucide-react/dist/esm/icons/chevron-right.js:
|
|
1683
|
+
lucide-react/dist/esm/icons/chevron-up.js:
|
|
1684
|
+
lucide-react/dist/esm/icons/circle.js:
|
|
1685
|
+
lucide-react/dist/esm/icons/mail.js:
|
|
1686
|
+
lucide-react/dist/esm/icons/scan-eye.js:
|
|
1687
|
+
lucide-react/dist/esm/lucide-react.js:
|
|
1688
|
+
(**
|
|
1689
|
+
* @license lucide-react v0.542.0 - ISC
|
|
1690
|
+
*
|
|
1691
|
+
* This source code is licensed under the ISC license.
|
|
1692
|
+
* See the LICENSE file in the root directory of this source tree.
|
|
1693
|
+
*)
|
|
1694
|
+
*/
|
|
135
1695
|
//# sourceMappingURL=index.js.map
|