@moontra/moonui 2.3.5 → 2.3.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -18,9 +18,9 @@ var LabelPrimitive = require('@radix-ui/react-label');
18
18
  var PopoverPrimitive = require('@radix-ui/react-popover');
19
19
  var TabsPrimitive = require('@radix-ui/react-tabs');
20
20
  var DialogPrimitive = require('@radix-ui/react-dialog');
21
- var SelectPrimitive = require('@radix-ui/react-select');
22
- var DropdownMenuPrimitive = require('@radix-ui/react-dropdown-menu');
23
21
  var dateFns = require('date-fns');
22
+ var DropdownMenuPrimitive = require('@radix-ui/react-dropdown-menu');
23
+ var SelectPrimitive = require('@radix-ui/react-select');
24
24
  var SeparatorPrimitive = require('@radix-ui/react-separator');
25
25
  var TooltipPrimitive = require('@radix-ui/react-tooltip');
26
26
  var SwitchPrimitives = require('@radix-ui/react-switch');
@@ -52,8 +52,8 @@ var LabelPrimitive__namespace = /*#__PURE__*/_interopNamespace(LabelPrimitive);
52
52
  var PopoverPrimitive__namespace = /*#__PURE__*/_interopNamespace(PopoverPrimitive);
53
53
  var TabsPrimitive__namespace = /*#__PURE__*/_interopNamespace(TabsPrimitive);
54
54
  var DialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(DialogPrimitive);
55
- var SelectPrimitive__namespace = /*#__PURE__*/_interopNamespace(SelectPrimitive);
56
55
  var DropdownMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(DropdownMenuPrimitive);
56
+ var SelectPrimitive__namespace = /*#__PURE__*/_interopNamespace(SelectPrimitive);
57
57
  var SeparatorPrimitive__namespace = /*#__PURE__*/_interopNamespace(SeparatorPrimitive);
58
58
  var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitive);
59
59
  var SwitchPrimitives__namespace = /*#__PURE__*/_interopNamespace(SwitchPrimitives);
@@ -373,7 +373,9 @@ var badgeVariants = classVarianceAuthority.cva(
373
373
  "inline-flex items-center justify-center gap-1.5",
374
374
  "font-medium transition-colors duration-200",
375
375
  "border focus:outline-none",
376
- "focus-visible:ring-2 focus-visible:ring-offset-1"
376
+ "focus-visible:ring-2 focus-visible:ring-offset-1",
377
+ // Auto spacing between badges
378
+ "mr-2 mb-2 last:mr-0"
377
379
  ],
378
380
  {
379
381
  variants: {
@@ -465,6 +467,7 @@ function Badge({
465
467
  onRemove,
466
468
  leftIcon,
467
469
  rightIcon,
470
+ noAutoSpacing,
468
471
  children,
469
472
  ...props
470
473
  }) {
@@ -485,7 +488,13 @@ function Badge({
485
488
  return /* @__PURE__ */ jsxRuntime.jsxs(
486
489
  "div",
487
490
  {
488
- className: cn("moonui-theme", badgeVariants({ variant, size, radius }), className),
491
+ className: cn(
492
+ "moonui-theme",
493
+ badgeVariants({ variant, size, radius }),
494
+ // Remove auto-spacing if noAutoSpacing is true
495
+ noAutoSpacing && "mr-0 mb-0",
496
+ className
497
+ ),
489
498
  "data-removable": removable ? "" : void 0,
490
499
  ...props,
491
500
  children: [
@@ -3475,7 +3484,7 @@ var me = t__namespace.forwardRef((r, o) => {
3475
3484
  var e;
3476
3485
  return Array.from(((e = I.current) == null ? void 0 : e.querySelectorAll(ce)) || []);
3477
3486
  }
3478
- function X8(e) {
3487
+ function X7(e) {
3479
3488
  let s = V()[e];
3480
3489
  s && E.setState("value", s.getAttribute(T));
3481
3490
  }
@@ -3490,10 +3499,10 @@ var me = t__namespace.forwardRef((r, o) => {
3490
3499
  s = e > 0 ? we(s, N) : De(s, N), i = s == null ? void 0 : s.querySelector(ce);
3491
3500
  i ? E.setState("value", i.getAttribute(T)) : Q(e);
3492
3501
  }
3493
- let oe = () => X8(V().length - 1), ie = (e) => {
3502
+ let oe = () => X7(V().length - 1), ie = (e) => {
3494
3503
  e.preventDefault(), e.metaKey ? oe() : e.altKey ? re(1) : Q(1);
3495
3504
  }, se = (e) => {
3496
- e.preventDefault(), e.metaKey ? X8(0) : e.altKey ? re(-1) : Q(-1);
3505
+ e.preventDefault(), e.metaKey ? X7(0) : e.altKey ? re(-1) : Q(-1);
3497
3506
  };
3498
3507
  return t__namespace.createElement(Primitive2.div, { ref: o, tabIndex: -1, ...O, "cmdk-root": "", onKeyDown: (e) => {
3499
3508
  var s;
@@ -3520,7 +3529,7 @@ var me = t__namespace.forwardRef((r, o) => {
3520
3529
  break;
3521
3530
  }
3522
3531
  case "Home": {
3523
- e.preventDefault(), X8(0);
3532
+ e.preventDefault(), X7(0);
3524
3533
  break;
3525
3534
  }
3526
3535
  case "End": {
@@ -6765,46 +6774,6 @@ function filterRowModelFromRoot(rowsToFilter, filterRow, table) {
6765
6774
  rowsById: newFilteredRowsById
6766
6775
  };
6767
6776
  }
6768
- function getFacetedRowModel() {
6769
- return (table, columnId) => memo(() => [table.getPreFilteredRowModel(), table.getState().columnFilters, table.getState().globalFilter, table.getFilteredRowModel()], (preRowModel, columnFilters, globalFilter) => {
6770
- if (!preRowModel.rows.length || !(columnFilters != null && columnFilters.length) && !globalFilter) {
6771
- return preRowModel;
6772
- }
6773
- const filterableIds = [...columnFilters.map((d) => d.id).filter((d) => d !== columnId), globalFilter ? "__global__" : void 0].filter(Boolean);
6774
- const filterRowsImpl = (row) => {
6775
- for (let i = 0; i < filterableIds.length; i++) {
6776
- if (row.columnFilters[filterableIds[i]] === false) {
6777
- return false;
6778
- }
6779
- }
6780
- return true;
6781
- };
6782
- return filterRows(preRowModel.rows, filterRowsImpl, table);
6783
- }, getMemoOptions(table.options, "debugTable", "getFacetedRowModel"));
6784
- }
6785
- function getFacetedUniqueValues() {
6786
- return (table, columnId) => memo(() => {
6787
- var _table$getColumn;
6788
- return [(_table$getColumn = table.getColumn(columnId)) == null ? void 0 : _table$getColumn.getFacetedRowModel()];
6789
- }, (facetedRowModel) => {
6790
- if (!facetedRowModel)
6791
- return /* @__PURE__ */ new Map();
6792
- let facetedUniqueValues = /* @__PURE__ */ new Map();
6793
- for (let i = 0; i < facetedRowModel.flatRows.length; i++) {
6794
- const values = facetedRowModel.flatRows[i].getUniqueValues(columnId);
6795
- for (let j = 0; j < values.length; j++) {
6796
- const value = values[j];
6797
- if (facetedUniqueValues.has(value)) {
6798
- var _facetedUniqueValues$;
6799
- facetedUniqueValues.set(value, ((_facetedUniqueValues$ = facetedUniqueValues.get(value)) != null ? _facetedUniqueValues$ : 0) + 1);
6800
- } else {
6801
- facetedUniqueValues.set(value, 1);
6802
- }
6803
- }
6804
- }
6805
- return facetedUniqueValues;
6806
- }, getMemoOptions(table.options, "debugTable", `getFacetedUniqueValues_${columnId}`));
6807
- }
6808
6777
  function getFilteredRowModel() {
6809
6778
  return (table) => memo(() => [table.getPreFilteredRowModel(), table.getState().columnFilters, table.getState().globalFilter], (rowModel, columnFilters, globalFilter) => {
6810
6779
  if (!rowModel.rows.length || !(columnFilters != null && columnFilters.length) && !globalFilter) {
@@ -7261,749 +7230,52 @@ var TableCaption = t__namespace.forwardRef(({ className, ...props }, ref) => /*
7261
7230
  }
7262
7231
  ));
7263
7232
  TableCaption.displayName = "TableCaption";
7264
- var Select = SelectPrimitive__namespace.Root;
7265
- Select.displayName = "Select";
7266
- var SelectGroup = SelectPrimitive__namespace.Group;
7267
- var SelectValue = SelectPrimitive__namespace.Value;
7268
- var SelectTrigger = t__namespace.forwardRef(({ className, children, variant = "standard", size = "md", error, success, loading, leftIcon, rightIcon, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
7269
- SelectPrimitive__namespace.Trigger,
7270
- {
7271
- ref,
7272
- className: cn(
7273
- /* Base styles */
7274
- "flex w-full items-center justify-between gap-1 rounded-md transition-all duration-200",
7275
- "disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
7276
- "focus-visible:outline-none",
7277
- /* Error state */
7278
- error && "border-error focus-visible:ring-error/30 focus-visible:border-error",
7279
- /* Success state */
7280
- success && "border-success focus-visible:ring-success/30 focus-visible:border-success",
7281
- /* Size variants */
7282
- size === "sm" && "h-8 text-xs px-2",
7283
- size === "md" && "h-10 text-sm px-3",
7284
- size === "lg" && "h-12 text-base px-4",
7285
- /* Visual variants */
7286
- variant === "standard" && "border border-gray-300 dark:border-gray-700 bg-background dark:bg-gray-900 hover:border-gray-400 dark:hover:border-gray-600 focus-visible:ring-2 focus-visible:ring-primary/30 dark:focus-visible:ring-primary/50 focus-visible:border-primary dark:focus-visible:border-primary",
7287
- variant === "outline" && "border border-gray-300 dark:border-gray-700 bg-transparent hover:border-gray-400 dark:hover:border-gray-600 focus-visible:ring-2 focus-visible:ring-primary/30 dark:focus-visible:ring-primary/50 focus-visible:border-primary dark:focus-visible:border-primary",
7288
- variant === "ghost" && "border-none bg-gray-100 dark:bg-gray-800 hover:bg-gray-200 dark:hover:bg-gray-700 focus-visible:ring-2 focus-visible:ring-primary/30 dark:focus-visible:ring-primary/50",
7289
- variant === "underline" && "border-t-0 border-l-0 border-r-0 border-b border-gray-300 dark:border-gray-600 rounded-none px-0 hover:border-gray-400 dark:hover:border-gray-500 focus-visible:ring-0 focus-visible:border-b-2 focus-visible:border-primary dark:focus-visible:border-primary",
7290
- className
7291
- ),
7292
- ...props,
7293
- disabled: props.disabled || loading,
7294
- "data-error": error ? true : void 0,
7295
- "data-success": success ? true : void 0,
7296
- "data-loading": loading ? true : void 0,
7297
- children: [
7298
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center flex-1 gap-2", children: [
7299
- leftIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex items-center justify-center text-gray-500 dark:text-gray-400", children: leftIcon }),
7300
- loading ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
7301
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-3.5 w-3.5 animate-spin text-muted-foreground dark:text-gray-400" }),
7302
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground dark:text-gray-400", children: "Loading..." })
7303
- ] }) : children
7304
- ] }),
7305
- !loading && /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Icon, { asChild: true, children: rightIcon ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "opacity-60", children: rightIcon }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4 opacity-60 transition-transform duration-200 ease-out group-data-[state=open]:rotate-180" }) })
7306
- ]
7307
- }
7308
- ));
7309
- SelectTrigger.displayName = SelectPrimitive__namespace.Trigger.displayName;
7310
- var SelectScrollUpButton = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
7311
- SelectPrimitive__namespace.ScrollUpButton,
7312
- {
7313
- ref,
7314
- className: cn(
7315
- "flex cursor-default items-center justify-center py-1 text-muted-foreground hover:text-foreground transition-colors",
7316
- className
7317
- ),
7318
- ...props,
7319
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUp, { className: "h-4 w-4" })
7320
- }
7321
- ));
7322
- SelectScrollUpButton.displayName = SelectPrimitive__namespace.ScrollUpButton.displayName;
7323
- var SelectScrollDownButton = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
7324
- SelectPrimitive__namespace.ScrollDownButton,
7325
- {
7326
- ref,
7327
- className: cn(
7328
- "flex cursor-default items-center justify-center py-1 text-muted-foreground hover:text-foreground transition-colors",
7329
- className
7330
- ),
7331
- ...props,
7332
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4" })
7333
- }
7334
- ));
7335
- SelectScrollDownButton.displayName = SelectPrimitive__namespace.ScrollDownButton.displayName;
7336
- var SelectContent = t__namespace.forwardRef(({ className, children, position = "popper", side = "bottom", sideOffset = 4, align = "start", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
7337
- SelectPrimitive__namespace.Content,
7338
- {
7339
- ref,
7340
- side,
7341
- sideOffset,
7342
- align,
7343
- avoidCollisions: false,
7344
- className: cn(
7345
- [
7346
- "relative z-50 max-h-96 min-w-[8rem] overflow-hidden",
7347
- "rounded-md border border-gray-200 dark:border-gray-700",
7348
- "bg-white dark:bg-gray-900 text-foreground",
7349
- "shadow-lg dark:shadow-gray-900/20",
7350
- "data-[state=open]:animate-in data-[state=closed]:animate-out",
7351
- "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
7352
- "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
7353
- "data-[state=open]:duration-150"
7354
- ],
7355
- 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",
7356
- className
7357
- ),
7358
- position,
7359
- ...props,
7360
- children: [
7361
- /* @__PURE__ */ jsxRuntime.jsx(SelectScrollUpButton, {}),
7233
+ function DataTableBasic({
7234
+ columns,
7235
+ data,
7236
+ enableSorting = true,
7237
+ enablePagination = true,
7238
+ enableSearch = true,
7239
+ pageSize = 10,
7240
+ searchPlaceholder = "Search...",
7241
+ emptyMessage = "No results found.",
7242
+ className
7243
+ }) {
7244
+ const [sorting, setSorting] = t__namespace.useState([]);
7245
+ const [globalFilter, setGlobalFilter] = t__namespace.useState("");
7246
+ const table = useReactTable({
7247
+ data,
7248
+ columns,
7249
+ onSortingChange: enableSorting ? setSorting : void 0,
7250
+ onGlobalFilterChange: enableSearch ? setGlobalFilter : void 0,
7251
+ getCoreRowModel: getCoreRowModel(),
7252
+ getPaginationRowModel: enablePagination ? getPaginationRowModel() : void 0,
7253
+ getSortedRowModel: enableSorting ? getSortedRowModel() : void 0,
7254
+ getFilteredRowModel: enableSearch ? getFilteredRowModel() : void 0,
7255
+ state: {
7256
+ sorting,
7257
+ globalFilter
7258
+ },
7259
+ initialState: {
7260
+ pagination: {
7261
+ pageSize
7262
+ }
7263
+ }
7264
+ });
7265
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-4", className), children: [
7266
+ enableSearch && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative max-w-sm", children: [
7267
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: "absolute left-2 top-2.5 h-4 w-4 text-muted-foreground" }),
7362
7268
  /* @__PURE__ */ jsxRuntime.jsx(
7363
- SelectPrimitive__namespace.Viewport,
7269
+ Input,
7364
7270
  {
7365
- className: cn(
7366
- "p-1",
7367
- position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
7368
- ),
7369
- children
7271
+ placeholder: searchPlaceholder,
7272
+ value: globalFilter,
7273
+ onChange: (event) => setGlobalFilter(event.target.value),
7274
+ className: "pl-8"
7370
7275
  }
7371
- ),
7372
- /* @__PURE__ */ jsxRuntime.jsx(SelectScrollDownButton, {})
7373
- ]
7374
- }
7375
- ) }));
7376
- SelectContent.displayName = SelectPrimitive__namespace.Content.displayName;
7377
- var SelectLabel = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
7378
- SelectPrimitive__namespace.Label,
7379
- {
7380
- ref,
7381
- className: cn("moonui-theme", "py-1.5 pl-8 pr-2 text-sm font-semibold", className),
7382
- ...props
7383
- }
7384
- ));
7385
- SelectLabel.displayName = SelectPrimitive__namespace.Label.displayName;
7386
- var SelectItem = t__namespace.forwardRef(({ className, children, variant = "default", size = "md", rightIcon, customIndicator, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
7387
- SelectPrimitive__namespace.Item,
7388
- {
7389
- ref,
7390
- className: cn(
7391
- "relative flex w-full cursor-default select-none items-center rounded-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
7392
- /* Size variants */
7393
- size === "sm" && "py-1 pl-7 pr-2 text-xs",
7394
- size === "md" && "py-1.5 pl-8 pr-2 text-sm",
7395
- size === "lg" && "py-2 pl-9 pr-3 text-base",
7396
- /* Color variants */
7397
- variant === "default" && "focus:bg-accent focus:text-accent-foreground dark:focus:bg-gray-700 dark:focus:text-gray-100",
7398
- variant === "subtle" && "focus:bg-gray-100 dark:focus:bg-gray-800 focus:text-foreground dark:focus:text-gray-200",
7399
- variant === "destructive" && "text-error dark:text-red-400 focus:bg-error/10 dark:focus:bg-red-900/20 focus:text-error dark:focus:text-red-300",
7400
- variant === "success" && "text-success dark:text-green-400 focus:bg-success/10 dark:focus:bg-green-900/20 focus:text-success dark:focus:text-green-300",
7401
- variant === "warning" && "text-warning dark:text-yellow-400 focus:bg-warning/10 dark:focus:bg-yellow-900/20 focus:text-warning dark:focus:text-yellow-300",
7402
- className
7403
- ),
7404
- ...props,
7405
- children: [
7406
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemIndicator, { children: customIndicator || /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-4 w-4" }) }) }),
7407
- /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemText, { children }),
7408
- rightIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-auto pl-2 opacity-70", children: rightIcon })
7409
- ]
7410
- }
7411
- ));
7412
- SelectItem.displayName = SelectPrimitive__namespace.Item.displayName;
7413
- var SelectSeparator = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
7414
- SelectPrimitive__namespace.Separator,
7415
- {
7416
- ref,
7417
- className: cn("moonui-theme", "-mx-1 my-1 h-px bg-muted dark:bg-gray-700", className),
7418
- ...props
7419
- }
7420
- ));
7421
- SelectSeparator.displayName = SelectPrimitive__namespace.Separator.displayName;
7422
- var DropdownMenu = DropdownMenuPrimitive__namespace.Root;
7423
- var DropdownMenuTrigger = DropdownMenuPrimitive__namespace.Trigger;
7424
- var DropdownMenuGroup = DropdownMenuPrimitive__namespace.Group;
7425
- var DropdownMenuPortal = DropdownMenuPrimitive__namespace.Portal;
7426
- var DropdownMenuSub = DropdownMenuPrimitive__namespace.Sub;
7427
- var DropdownMenuRadioGroup = DropdownMenuPrimitive__namespace.RadioGroup;
7428
- var DropdownMenuSubTrigger = t__namespace.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
7429
- DropdownMenuPrimitive__namespace.SubTrigger,
7430
- {
7431
- ref,
7432
- className: cn(
7433
- "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent",
7434
- inset && "pl-8",
7435
- className
7436
- ),
7437
- ...props,
7438
- children: [
7439
- children,
7440
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "ml-auto h-4 w-4" })
7441
- ]
7442
- }
7443
- ));
7444
- DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive__namespace.SubTrigger.displayName;
7445
- var DropdownMenuSubContent = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
7446
- DropdownMenuPrimitive__namespace.SubContent,
7447
- {
7448
- ref,
7449
- className: cn(
7450
- "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg 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",
7451
- className
7452
- ),
7453
- ...props
7454
- }
7455
- ));
7456
- DropdownMenuSubContent.displayName = DropdownMenuPrimitive__namespace.SubContent.displayName;
7457
- var DropdownMenuContent = t__namespace.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
7458
- DropdownMenuPrimitive__namespace.Content,
7459
- {
7460
- ref,
7461
- sideOffset,
7462
- className: cn(
7463
- "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md 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",
7464
- className
7465
- ),
7466
- ...props
7467
- }
7468
- ) }));
7469
- DropdownMenuContent.displayName = DropdownMenuPrimitive__namespace.Content.displayName;
7470
- var DropdownMenuItem = t__namespace.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
7471
- DropdownMenuPrimitive__namespace.Item,
7472
- {
7473
- ref,
7474
- className: cn(
7475
- "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
7476
- inset && "pl-8",
7477
- className
7478
- ),
7479
- ...props
7480
- }
7481
- ));
7482
- DropdownMenuItem.displayName = DropdownMenuPrimitive__namespace.Item.displayName;
7483
- var DropdownMenuCheckboxItem = t__namespace.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
7484
- DropdownMenuPrimitive__namespace.CheckboxItem,
7485
- {
7486
- ref,
7487
- className: cn(
7488
- "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
7489
- className
7490
- ),
7491
- checked,
7492
- ...props,
7493
- children: [
7494
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-4 w-4" }) }) }),
7495
- children
7496
- ]
7497
- }
7498
- ));
7499
- DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive__namespace.CheckboxItem.displayName;
7500
- var DropdownMenuRadioItem = t__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
7501
- DropdownMenuPrimitive__namespace.RadioItem,
7502
- {
7503
- ref,
7504
- className: cn(
7505
- "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
7506
- className
7507
- ),
7508
- ...props,
7509
- children: [
7510
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Circle, { className: "h-2 w-2 fill-current" }) }) }),
7511
- children
7512
- ]
7513
- }
7514
- ));
7515
- DropdownMenuRadioItem.displayName = DropdownMenuPrimitive__namespace.RadioItem.displayName;
7516
- var DropdownMenuLabel = t__namespace.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
7517
- DropdownMenuPrimitive__namespace.Label,
7518
- {
7519
- ref,
7520
- className: cn(
7521
- "px-2 py-1.5 text-sm font-semibold",
7522
- inset && "pl-8",
7523
- className
7524
- ),
7525
- ...props
7526
- }
7527
- ));
7528
- DropdownMenuLabel.displayName = DropdownMenuPrimitive__namespace.Label.displayName;
7529
- var DropdownMenuSeparator = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
7530
- DropdownMenuPrimitive__namespace.Separator,
7531
- {
7532
- ref,
7533
- className: cn("moonui-theme", "-mx-1 my-1 h-px bg-muted", className),
7534
- ...props
7535
- }
7536
- ));
7537
- DropdownMenuSeparator.displayName = DropdownMenuPrimitive__namespace.Separator.displayName;
7538
- var DropdownMenuShortcut = ({
7539
- className,
7540
- ...props
7541
- }) => {
7542
- return /* @__PURE__ */ jsxRuntime.jsx(
7543
- "span",
7544
- {
7545
- className: cn("moonui-theme", "ml-auto text-xs tracking-widest opacity-60", className),
7546
- ...props
7547
- }
7548
- );
7549
- };
7550
- DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
7551
- var skeletonVariants = classVarianceAuthority.cva(
7552
- "animate-pulse rounded-md",
7553
- {
7554
- variants: {
7555
- variant: {
7556
- default: "bg-muted",
7557
- primary: "bg-primary/10",
7558
- secondary: "bg-secondary/10",
7559
- accent: "bg-accent"
7560
- },
7561
- size: {
7562
- default: "",
7563
- sm: "scale-90",
7564
- lg: "scale-110"
7565
- },
7566
- shape: {
7567
- rect: "rounded-md",
7568
- circle: "rounded-full",
7569
- pill: "rounded-full"
7570
- },
7571
- animation: {
7572
- pulse: "animate-pulse",
7573
- wave: "overflow-hidden relative after:absolute after:inset-0 after:-translate-x-full after:animate-[shimmer_2s_infinite] after:bg-gradient-to-r after:from-transparent after:via-white/10 after:to-transparent dark:after:via-white/5",
7574
- none: "animate-none"
7575
- }
7576
- },
7577
- defaultVariants: {
7578
- variant: "default",
7579
- size: "default",
7580
- shape: "rect",
7581
- animation: "pulse"
7582
- }
7583
- }
7584
- );
7585
- var Skeleton = t__namespace.forwardRef(
7586
- ({
7587
- className,
7588
- variant,
7589
- size,
7590
- shape,
7591
- animation,
7592
- height,
7593
- width,
7594
- isLoaded = false,
7595
- children,
7596
- fadeInDuration = 400,
7597
- motion: useMotion = false,
7598
- style,
7599
- ...props
7600
- }, ref) => {
7601
- const {
7602
- onDrag,
7603
- onDragEnd,
7604
- onDragStart,
7605
- onAnimationStart,
7606
- onAnimationEnd,
7607
- onAnimationIteration,
7608
- ...filteredProps
7609
- } = props;
7610
- if (isLoaded && children) {
7611
- if (useMotion) {
7612
- return /* @__PURE__ */ jsxRuntime.jsx(
7613
- framerMotion.motion.div,
7614
- {
7615
- ref,
7616
- initial: { opacity: 0 },
7617
- animate: { opacity: 1 },
7618
- transition: { duration: fadeInDuration / 1e3 },
7619
- className: cn("moonui-theme", className),
7620
- style: {
7621
- height,
7622
- width,
7623
- ...style
7624
- },
7625
- ...filteredProps,
7626
- children
7627
- }
7628
- );
7629
- }
7630
- return /* @__PURE__ */ jsxRuntime.jsx(
7631
- "div",
7632
- {
7633
- ref,
7634
- className: cn("moonui-theme", "animate-fade-in", className),
7635
- style: {
7636
- animationDuration: `${fadeInDuration}ms`,
7637
- height,
7638
- width,
7639
- ...style
7640
- },
7641
- ...props,
7642
- children
7643
- }
7644
- );
7645
- }
7646
- const SkeletonElement = useMotion ? framerMotion.motion.div : "div";
7647
- return /* @__PURE__ */ jsxRuntime.jsx(
7648
- SkeletonElement,
7649
- {
7650
- ref,
7651
- className: cn(
7652
- "moonui-theme",
7653
- skeletonVariants({ variant, size, shape, animation }),
7654
- "relative isolate",
7655
- className
7656
- ),
7657
- style: {
7658
- height,
7659
- width,
7660
- ...style
7661
- },
7662
- ...useMotion ? skeletonAnimation : {},
7663
- ...filteredProps
7664
- }
7665
- );
7666
- }
7667
- );
7668
- Skeleton.displayName = "Skeleton";
7669
- var SkeletonText = t__namespace.forwardRef(
7670
- ({
7671
- className,
7672
- lines = 3,
7673
- lineHeight = "0.85rem",
7674
- spacing = "0.5rem",
7675
- lastLineWidth = 80,
7676
- randomWidths = false,
7677
- variant = "default",
7678
- animation = "pulse",
7679
- ...props
7680
- }, ref) => {
7681
- return /* @__PURE__ */ jsxRuntime.jsx(
7682
- "div",
7683
- {
7684
- ref,
7685
- className: cn("moonui-theme", "flex flex-col", className),
7686
- style: { gap: spacing },
7687
- ...props,
7688
- children: Array.from({ length: lines }).map((_, i) => {
7689
- const isLastLine = i === lines - 1;
7690
- const widthPercentage = isLastLine ? lastLineWidth : randomWidths ? 85 + i % 3 * 5 : 100;
7691
- return /* @__PURE__ */ jsxRuntime.jsx(
7692
- Skeleton,
7693
- {
7694
- variant,
7695
- animation,
7696
- className: "w-full",
7697
- style: {
7698
- height: lineHeight,
7699
- width: `${widthPercentage}%`
7700
- }
7701
- },
7702
- i
7703
- );
7704
- })
7705
- }
7706
- );
7707
- }
7708
- );
7709
- SkeletonText.displayName = "SkeletonText";
7710
- var SkeletonAvatar = t__namespace.forwardRef(
7711
- ({
7712
- className,
7713
- size = "2.5rem",
7714
- variant = "default",
7715
- animation = "pulse",
7716
- ...props
7717
- }, ref) => {
7718
- return /* @__PURE__ */ jsxRuntime.jsx(
7719
- Skeleton,
7720
- {
7721
- ref,
7722
- variant,
7723
- animation,
7724
- shape: "circle",
7725
- className: cn("moonui-theme", "shrink-0", className),
7726
- style: {
7727
- height: size,
7728
- width: size
7729
- },
7730
- ...props
7731
- }
7732
- );
7733
- }
7734
- );
7735
- SkeletonAvatar.displayName = "SkeletonAvatar";
7736
- var SkeletonCard = t__namespace.forwardRef(
7737
- ({
7738
- className,
7739
- showHeader = true,
7740
- contentLines = 3,
7741
- showFooter = true,
7742
- variant = "default",
7743
- animation = "pulse",
7744
- ...props
7745
- }, ref) => {
7746
- return /* @__PURE__ */ jsxRuntime.jsxs(
7747
- "div",
7748
- {
7749
- ref,
7750
- className: cn(
7751
- "overflow-hidden rounded-md border border-border bg-background p-4",
7752
- className
7753
- ),
7754
- ...props,
7755
- children: [
7756
- showHeader && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-4 flex items-center gap-4", children: [
7757
- /* @__PURE__ */ jsxRuntime.jsx(SkeletonAvatar, { size: "2.5rem", variant, animation }),
7758
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1", children: [
7759
- /* @__PURE__ */ jsxRuntime.jsx(
7760
- Skeleton,
7761
- {
7762
- variant,
7763
- animation,
7764
- className: "mb-2 h-4 w-1/3"
7765
- }
7766
- ),
7767
- /* @__PURE__ */ jsxRuntime.jsx(
7768
- Skeleton,
7769
- {
7770
- variant,
7771
- animation,
7772
- className: "h-3 w-1/4"
7773
- }
7774
- )
7775
- ] })
7776
- ] }),
7777
- /* @__PURE__ */ jsxRuntime.jsx(
7778
- SkeletonText,
7779
- {
7780
- lines: contentLines,
7781
- variant,
7782
- animation,
7783
- className: "mb-4"
7784
- }
7785
- ),
7786
- showFooter && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mt-4 pt-4 border-t border-border", children: [
7787
- /* @__PURE__ */ jsxRuntime.jsx(
7788
- Skeleton,
7789
- {
7790
- variant,
7791
- animation,
7792
- className: "h-4 w-1/4"
7793
- }
7794
- ),
7795
- /* @__PURE__ */ jsxRuntime.jsx(
7796
- Skeleton,
7797
- {
7798
- variant,
7799
- animation,
7800
- className: "h-4 w-1/5"
7801
- }
7802
- )
7803
- ] })
7804
- ]
7805
- }
7806
- );
7807
- }
7808
- );
7809
- SkeletonCard.displayName = "SkeletonCard";
7810
- classVarianceAuthority.cva(
7811
- "w-full",
7812
- {
7813
- variants: {
7814
- variant: {
7815
- default: "",
7816
- bordered: "border rounded-lg",
7817
- striped: "[&_tbody_tr:nth-child(even)]:bg-muted/50",
7818
- cards: "gap-4 [&_tbody]:flex [&_tbody]:flex-col [&_tbody_tr]:rounded-lg [&_tbody_tr]:border [&_tbody_tr]:p-4"
7819
- },
7820
- size: {
7821
- default: "",
7822
- sm: "text-sm [&_th]:py-2 [&_td]:py-2",
7823
- lg: "text-base [&_th]:py-4 [&_td]:py-4"
7824
- },
7825
- density: {
7826
- default: "",
7827
- compact: "[&_th]:py-1 [&_td]:py-1",
7828
- comfortable: "[&_th]:py-6 [&_td]:py-6"
7829
- }
7830
- },
7831
- defaultVariants: {
7832
- variant: "default",
7833
- size: "default",
7834
- density: "default"
7835
- }
7836
- }
7837
- );
7838
- function DataTableLoading() {
7839
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
7840
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
7841
- /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-8 w-[250px]" }),
7842
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
7843
- /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-8 w-8" }),
7844
- /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-8 w-8" })
7845
- ] })
7846
- ] }),
7847
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-lg border", children: [
7848
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-4", children: Array.from({ length: 4 }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-8 flex-1" }, i)) }) }),
7849
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4 space-y-2", children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: "h-12 w-full" }, i)) })
7850
- ] })
7851
- ] });
7852
- }
7853
- function DataTable({
7854
- columns,
7855
- data,
7856
- enableFiltering = true,
7857
- enableSorting = true,
7858
- enableColumnVisibility = true,
7859
- enableRowSelection = false,
7860
- enablePagination = true,
7861
- pageSizeOptions = [10, 20, 30, 50, 100],
7862
- defaultPageSize: defaultPageSize2 = 10,
7863
- filterPlaceholder = "Filter...",
7864
- filterColumn,
7865
- isLoading = false,
7866
- emptyMessage = "No results found.",
7867
- title,
7868
- description,
7869
- enableExport = false,
7870
- onExport,
7871
- enableRefresh = false,
7872
- onRefresh,
7873
- toolbarActions,
7874
- customFilter,
7875
- onRowClick,
7876
- variant,
7877
- size,
7878
- density,
7879
- className
7880
- }) {
7881
- const [sorting, setSorting] = t__namespace.useState([]);
7882
- const [columnFilters, setColumnFilters] = t__namespace.useState([]);
7883
- const [columnVisibility, setColumnVisibility] = t__namespace.useState({});
7884
- const [rowSelection, setRowSelection] = t__namespace.useState({});
7885
- const [globalFilter, setGlobalFilter] = t__namespace.useState("");
7886
- const table = useReactTable({
7887
- data,
7888
- columns,
7889
- onSortingChange: enableSorting ? setSorting : void 0,
7890
- onColumnFiltersChange: enableFiltering ? setColumnFilters : void 0,
7891
- onColumnVisibilityChange: enableColumnVisibility ? setColumnVisibility : void 0,
7892
- onRowSelectionChange: enableRowSelection ? setRowSelection : void 0,
7893
- onGlobalFilterChange: enableFiltering && !filterColumn ? setGlobalFilter : void 0,
7894
- getCoreRowModel: getCoreRowModel(),
7895
- getPaginationRowModel: enablePagination ? getPaginationRowModel() : void 0,
7896
- getSortedRowModel: enableSorting ? getSortedRowModel() : void 0,
7897
- getFilteredRowModel: enableFiltering ? getFilteredRowModel() : void 0,
7898
- getFacetedRowModel: enableFiltering ? getFacetedRowModel() : void 0,
7899
- getFacetedUniqueValues: enableFiltering ? getFacetedUniqueValues() : void 0,
7900
- state: {
7901
- sorting,
7902
- columnFilters,
7903
- columnVisibility,
7904
- rowSelection,
7905
- globalFilter
7906
- },
7907
- initialState: {
7908
- pagination: {
7909
- pageSize: defaultPageSize2
7910
- }
7911
- }
7912
- });
7913
- if (isLoading) {
7914
- return /* @__PURE__ */ jsxRuntime.jsx(DataTableLoading, {});
7915
- }
7916
- const selectedRows = table.getFilteredSelectedRowModel().rows;
7917
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("moonui-theme", "space-y-4", className), children: [
7918
- (title || description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
7919
- title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold", children: title }),
7920
- description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: description })
7921
- ] }),
7922
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-4", children: [
7923
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 max-w-sm", children: enableFiltering && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: customFilter || /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
7924
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: "absolute left-2 top-2.5 h-4 w-4 text-muted-foreground" }),
7925
- /* @__PURE__ */ jsxRuntime.jsx(
7926
- Input,
7927
- {
7928
- placeholder: filterPlaceholder,
7929
- value: filterColumn ? table.getColumn(filterColumn)?.getFilterValue() ?? "" : globalFilter,
7930
- onChange: (event) => {
7931
- const value = event.target.value;
7932
- if (filterColumn) {
7933
- table.getColumn(filterColumn)?.setFilterValue(value);
7934
- } else {
7935
- setGlobalFilter(value);
7936
- }
7937
- },
7938
- className: "pl-8"
7939
- }
7940
- ),
7941
- (filterColumn && table.getColumn(filterColumn)?.getFilterValue() || !filterColumn && globalFilter) && /* @__PURE__ */ jsxRuntime.jsx(
7942
- Button,
7943
- {
7944
- variant: "ghost",
7945
- size: "sm",
7946
- className: "absolute right-0 top-0 h-full px-2",
7947
- onClick: () => {
7948
- if (filterColumn) {
7949
- table.getColumn(filterColumn)?.setFilterValue("");
7950
- } else {
7951
- setGlobalFilter("");
7952
- }
7953
- },
7954
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" })
7955
- }
7956
- )
7957
- ] }) }) }),
7958
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
7959
- enableRowSelection && selectedRows.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(Badge, { variant: "secondary", className: "whitespace-nowrap", children: [
7960
- selectedRows.length,
7961
- " selected"
7962
- ] }),
7963
- toolbarActions,
7964
- enableExport && onExport && /* @__PURE__ */ jsxRuntime.jsxs(
7965
- Button,
7966
- {
7967
- variant: "outline",
7968
- size: "sm",
7969
- onClick: () => onExport(table.getFilteredRowModel().rows.map((row) => row.original)),
7970
- children: [
7971
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Download, { className: "mr-2 h-4 w-4" }),
7972
- "Export"
7973
- ]
7974
- }
7975
- ),
7976
- enableRefresh && onRefresh && /* @__PURE__ */ jsxRuntime.jsx(
7977
- Button,
7978
- {
7979
- variant: "outline",
7980
- size: "icon",
7981
- onClick: onRefresh,
7982
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.RefreshCw, { className: "h-4 w-4" })
7983
- }
7984
- ),
7985
- enableColumnVisibility && /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu, { children: [
7986
- /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "outline", size: "icon", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Columns, { className: "h-4 w-4" }) }) }),
7987
- /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuContent, { align: "end", className: "w-[180px]", children: [
7988
- /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuLabel, { children: "Toggle columns" }),
7989
- /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuSeparator, {}),
7990
- table.getAllColumns().filter((column) => column.getCanHide()).map((column) => {
7991
- return /* @__PURE__ */ jsxRuntime.jsx(
7992
- DropdownMenuCheckboxItem,
7993
- {
7994
- className: "capitalize",
7995
- checked: column.getIsVisible(),
7996
- onCheckedChange: (value) => column.toggleVisibility(!!value),
7997
- children: column.id
7998
- },
7999
- column.id
8000
- );
8001
- })
8002
- ] })
8003
- ] })
8004
- ] })
8005
- ] }),
8006
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("rounded-lg", variant === "bordered" && "border"), children: /* @__PURE__ */ jsxRuntime.jsxs(Table, { children: [
7276
+ )
7277
+ ] }) }),
7278
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-md border", children: /* @__PURE__ */ jsxRuntime.jsxs(Table, { children: [
8007
7279
  /* @__PURE__ */ jsxRuntime.jsx(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsxRuntime.jsx(TableRow, { children: headerGroup.headers.map((header) => {
8008
7280
  return /* @__PURE__ */ jsxRuntime.jsx(TableHead, { children: header.isPlaceholder ? null : /* @__PURE__ */ jsxRuntime.jsxs(
8009
7281
  "div",
@@ -8023,27 +7295,17 @@ function DataTable({
8023
7295
  }
8024
7296
  ) }, header.id);
8025
7297
  }) }, headerGroup.id)) }),
8026
- /* @__PURE__ */ jsxRuntime.jsx(TableBody, { children: table.getRowModel().rows?.length ? /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: table.getRowModel().rows.map((row) => /* @__PURE__ */ jsxRuntime.jsx(
8027
- framerMotion.motion.tr,
7298
+ /* @__PURE__ */ jsxRuntime.jsx(TableBody, { children: table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ jsxRuntime.jsx(
7299
+ TableRow,
8028
7300
  {
8029
- initial: { opacity: 0, y: -10 },
8030
- animate: { opacity: 1, y: 0 },
8031
- exit: { opacity: 0, y: 10 },
8032
- transition: { duration: 0.2 },
8033
7301
  "data-state": row.getIsSelected() && "selected",
8034
- className: cn(
8035
- "border-b transition-colors",
8036
- onRowClick && "cursor-pointer hover:bg-muted/50",
8037
- row.getIsSelected() && "bg-muted"
8038
- ),
8039
- onClick: () => onRowClick?.(row.original),
8040
7302
  children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsxRuntime.jsx(TableCell, { children: flexRender(
8041
7303
  cell.column.columnDef.cell,
8042
7304
  cell.getContext()
8043
7305
  ) }, cell.id))
8044
7306
  },
8045
7307
  row.id
8046
- )) }) : /* @__PURE__ */ jsxRuntime.jsx(TableRow, { children: /* @__PURE__ */ jsxRuntime.jsx(
7308
+ )) : /* @__PURE__ */ jsxRuntime.jsx(TableRow, { children: /* @__PURE__ */ jsxRuntime.jsx(
8047
7309
  TableCell,
8048
7310
  {
8049
7311
  colSpan: columns.length,
@@ -8052,89 +7314,45 @@ function DataTable({
8052
7314
  }
8053
7315
  ) }) })
8054
7316
  ] }) }),
8055
- enablePagination && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between", children: [
8056
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [
8057
- /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
8058
- table.getFilteredRowModel().rows.length,
7317
+ enablePagination && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end space-x-2", children: [
7318
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 text-sm text-muted-foreground", children: [
7319
+ table.getFilteredRowModel().rows.length,
7320
+ " row(s)"
7321
+ ] }),
7322
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-x-2", children: [
7323
+ /* @__PURE__ */ jsxRuntime.jsxs(
7324
+ Button,
7325
+ {
7326
+ variant: "outline",
7327
+ size: "sm",
7328
+ onClick: () => table.previousPage(),
7329
+ disabled: !table.getCanPreviousPage(),
7330
+ children: [
7331
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "h-4 w-4" }),
7332
+ "Previous"
7333
+ ]
7334
+ }
7335
+ ),
7336
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm", children: [
7337
+ "Page ",
7338
+ table.getState().pagination.pageIndex + 1,
8059
7339
  " of",
8060
7340
  " ",
8061
- table.getCoreRowModel().rows.length,
8062
- " row(s)"
8063
- ] }),
8064
- enableRowSelection && selectedRows.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
8065
- "\u2022 ",
8066
- selectedRows.length,
8067
- " selected"
8068
- ] })
8069
- ] }),
8070
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
8071
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
8072
- /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm", children: "Rows per page" }),
8073
- /* @__PURE__ */ jsxRuntime.jsxs(
8074
- Select,
8075
- {
8076
- value: `${table.getState().pagination.pageSize}`,
8077
- onValueChange: (value) => {
8078
- table.setPageSize(Number(value));
8079
- },
8080
- children: [
8081
- /* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { className: "h-8 w-[70px]", children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, { placeholder: table.getState().pagination.pageSize }) }),
8082
- /* @__PURE__ */ jsxRuntime.jsx(SelectContent, { side: "top", children: pageSizeOptions.map((pageSize) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: `${pageSize}`, children: pageSize }, pageSize)) })
8083
- ]
8084
- }
8085
- )
7341
+ table.getPageCount()
8086
7342
  ] }),
8087
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1", children: [
8088
- /* @__PURE__ */ jsxRuntime.jsx(
8089
- Button,
8090
- {
8091
- variant: "outline",
8092
- size: "icon",
8093
- onClick: () => table.setPageIndex(0),
8094
- disabled: !table.getCanPreviousPage(),
8095
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronsLeft, { className: "h-4 w-4" })
8096
- }
8097
- ),
8098
- /* @__PURE__ */ jsxRuntime.jsx(
8099
- Button,
8100
- {
8101
- variant: "outline",
8102
- size: "icon",
8103
- onClick: () => table.previousPage(),
8104
- disabled: !table.getCanPreviousPage(),
8105
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "h-4 w-4" })
8106
- }
8107
- ),
8108
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 text-sm", children: [
8109
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Page" }),
8110
- /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-medium", children: [
8111
- table.getState().pagination.pageIndex + 1,
8112
- " of",
8113
- " ",
8114
- table.getPageCount()
8115
- ] })
8116
- ] }),
8117
- /* @__PURE__ */ jsxRuntime.jsx(
8118
- Button,
8119
- {
8120
- variant: "outline",
8121
- size: "icon",
8122
- onClick: () => table.nextPage(),
8123
- disabled: !table.getCanNextPage(),
8124
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-4 w-4" })
8125
- }
8126
- ),
8127
- /* @__PURE__ */ jsxRuntime.jsx(
8128
- Button,
8129
- {
8130
- variant: "outline",
8131
- size: "icon",
8132
- onClick: () => table.setPageIndex(table.getPageCount() - 1),
8133
- disabled: !table.getCanNextPage(),
8134
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronsRight, { className: "h-4 w-4" })
8135
- }
8136
- )
8137
- ] })
7343
+ /* @__PURE__ */ jsxRuntime.jsxs(
7344
+ Button,
7345
+ {
7346
+ variant: "outline",
7347
+ size: "sm",
7348
+ onClick: () => table.nextPage(),
7349
+ disabled: !table.getCanNextPage(),
7350
+ children: [
7351
+ "Next",
7352
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-4 w-4" })
7353
+ ]
7354
+ }
7355
+ )
8138
7356
  ] })
8139
7357
  ] })
8140
7358
  ] });
@@ -8153,13 +7371,6 @@ function createSortableHeader(label) {
8153
7371
  }
8154
7372
  );
8155
7373
  }
8156
- function createFilterableColumn(accessorKey, header, filterFn) {
8157
- return {
8158
- accessorKey,
8159
- header: createSortableHeader(header),
8160
- filterFn
8161
- };
8162
- }
8163
7374
  function Calendar({
8164
7375
  mode = "single",
8165
7376
  selected,
@@ -8815,54 +8026,183 @@ function DraggableList({
8815
8026
  renderItem,
8816
8027
  keyExtractor,
8817
8028
  className,
8818
- disabled = false
8819
- }) {
8820
- const [draggedIndex, setDraggedIndex] = t__namespace.useState(null);
8821
- const handleDragStart = (e, index) => {
8822
- if (disabled)
8823
- return;
8824
- setDraggedIndex(index);
8825
- e.dataTransfer.effectAllowed = "move";
8826
- };
8827
- const handleDragOver = (e) => {
8828
- e.preventDefault();
8829
- e.dataTransfer.dropEffect = "move";
8830
- };
8831
- const handleDrop = (e, dropIndex) => {
8832
- e.preventDefault();
8833
- if (disabled || draggedIndex === null || draggedIndex === dropIndex) {
8834
- setDraggedIndex(null);
8835
- return;
8836
- }
8837
- const newItems = [...items];
8838
- const draggedItem = newItems[draggedIndex];
8839
- newItems.splice(draggedIndex, 1);
8840
- newItems.splice(dropIndex, 0, draggedItem);
8841
- onReorder(newItems);
8842
- setDraggedIndex(null);
8843
- };
8844
- const handleDragEnd = () => {
8845
- setDraggedIndex(null);
8846
- };
8847
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("moonui-theme", "space-y-2", className), children: items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
8848
- "div",
8029
+ disabled = false
8030
+ }) {
8031
+ const [draggedIndex, setDraggedIndex] = t__namespace.useState(null);
8032
+ const handleDragStart = (e, index) => {
8033
+ if (disabled)
8034
+ return;
8035
+ setDraggedIndex(index);
8036
+ e.dataTransfer.effectAllowed = "move";
8037
+ };
8038
+ const handleDragOver = (e) => {
8039
+ e.preventDefault();
8040
+ e.dataTransfer.dropEffect = "move";
8041
+ };
8042
+ const handleDrop = (e, dropIndex) => {
8043
+ e.preventDefault();
8044
+ if (disabled || draggedIndex === null || draggedIndex === dropIndex) {
8045
+ setDraggedIndex(null);
8046
+ return;
8047
+ }
8048
+ const newItems = [...items];
8049
+ const draggedItem = newItems[draggedIndex];
8050
+ newItems.splice(draggedIndex, 1);
8051
+ newItems.splice(dropIndex, 0, draggedItem);
8052
+ onReorder(newItems);
8053
+ setDraggedIndex(null);
8054
+ };
8055
+ const handleDragEnd = () => {
8056
+ setDraggedIndex(null);
8057
+ };
8058
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("moonui-theme", "space-y-2", className), children: items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
8059
+ "div",
8060
+ {
8061
+ draggable: !disabled,
8062
+ onDragStart: (e) => handleDragStart(e, index),
8063
+ onDragOver: handleDragOver,
8064
+ onDrop: (e) => handleDrop(e, index),
8065
+ onDragEnd: handleDragEnd,
8066
+ className: cn(
8067
+ "transition-opacity duration-200",
8068
+ !disabled && "cursor-move hover:opacity-80",
8069
+ draggedIndex === index && "opacity-50",
8070
+ disabled && "cursor-not-allowed"
8071
+ ),
8072
+ children: renderItem(item, index)
8073
+ },
8074
+ keyExtractor(item)
8075
+ )) });
8076
+ }
8077
+ var DropdownMenu = DropdownMenuPrimitive__namespace.Root;
8078
+ var DropdownMenuTrigger = DropdownMenuPrimitive__namespace.Trigger;
8079
+ var DropdownMenuGroup = DropdownMenuPrimitive__namespace.Group;
8080
+ var DropdownMenuPortal = DropdownMenuPrimitive__namespace.Portal;
8081
+ var DropdownMenuSub = DropdownMenuPrimitive__namespace.Sub;
8082
+ var DropdownMenuRadioGroup = DropdownMenuPrimitive__namespace.RadioGroup;
8083
+ var DropdownMenuSubTrigger = t__namespace.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
8084
+ DropdownMenuPrimitive__namespace.SubTrigger,
8085
+ {
8086
+ ref,
8087
+ className: cn(
8088
+ "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent",
8089
+ inset && "pl-8",
8090
+ className
8091
+ ),
8092
+ ...props,
8093
+ children: [
8094
+ children,
8095
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "ml-auto h-4 w-4" })
8096
+ ]
8097
+ }
8098
+ ));
8099
+ DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive__namespace.SubTrigger.displayName;
8100
+ var DropdownMenuSubContent = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
8101
+ DropdownMenuPrimitive__namespace.SubContent,
8102
+ {
8103
+ ref,
8104
+ className: cn(
8105
+ "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg 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",
8106
+ className
8107
+ ),
8108
+ ...props
8109
+ }
8110
+ ));
8111
+ DropdownMenuSubContent.displayName = DropdownMenuPrimitive__namespace.SubContent.displayName;
8112
+ var DropdownMenuContent = t__namespace.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
8113
+ DropdownMenuPrimitive__namespace.Content,
8114
+ {
8115
+ ref,
8116
+ sideOffset,
8117
+ className: cn(
8118
+ "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md 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",
8119
+ className
8120
+ ),
8121
+ ...props
8122
+ }
8123
+ ) }));
8124
+ DropdownMenuContent.displayName = DropdownMenuPrimitive__namespace.Content.displayName;
8125
+ var DropdownMenuItem = t__namespace.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
8126
+ DropdownMenuPrimitive__namespace.Item,
8127
+ {
8128
+ ref,
8129
+ className: cn(
8130
+ "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
8131
+ inset && "pl-8",
8132
+ className
8133
+ ),
8134
+ ...props
8135
+ }
8136
+ ));
8137
+ DropdownMenuItem.displayName = DropdownMenuPrimitive__namespace.Item.displayName;
8138
+ var DropdownMenuCheckboxItem = t__namespace.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
8139
+ DropdownMenuPrimitive__namespace.CheckboxItem,
8140
+ {
8141
+ ref,
8142
+ className: cn(
8143
+ "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
8144
+ className
8145
+ ),
8146
+ checked,
8147
+ ...props,
8148
+ children: [
8149
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-4 w-4" }) }) }),
8150
+ children
8151
+ ]
8152
+ }
8153
+ ));
8154
+ DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive__namespace.CheckboxItem.displayName;
8155
+ var DropdownMenuRadioItem = t__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
8156
+ DropdownMenuPrimitive__namespace.RadioItem,
8157
+ {
8158
+ ref,
8159
+ className: cn(
8160
+ "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
8161
+ className
8162
+ ),
8163
+ ...props,
8164
+ children: [
8165
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Circle, { className: "h-2 w-2 fill-current" }) }) }),
8166
+ children
8167
+ ]
8168
+ }
8169
+ ));
8170
+ DropdownMenuRadioItem.displayName = DropdownMenuPrimitive__namespace.RadioItem.displayName;
8171
+ var DropdownMenuLabel = t__namespace.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
8172
+ DropdownMenuPrimitive__namespace.Label,
8173
+ {
8174
+ ref,
8175
+ className: cn(
8176
+ "px-2 py-1.5 text-sm font-semibold",
8177
+ inset && "pl-8",
8178
+ className
8179
+ ),
8180
+ ...props
8181
+ }
8182
+ ));
8183
+ DropdownMenuLabel.displayName = DropdownMenuPrimitive__namespace.Label.displayName;
8184
+ var DropdownMenuSeparator = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
8185
+ DropdownMenuPrimitive__namespace.Separator,
8186
+ {
8187
+ ref,
8188
+ className: cn("moonui-theme", "-mx-1 my-1 h-px bg-muted", className),
8189
+ ...props
8190
+ }
8191
+ ));
8192
+ DropdownMenuSeparator.displayName = DropdownMenuPrimitive__namespace.Separator.displayName;
8193
+ var DropdownMenuShortcut = ({
8194
+ className,
8195
+ ...props
8196
+ }) => {
8197
+ return /* @__PURE__ */ jsxRuntime.jsx(
8198
+ "span",
8849
8199
  {
8850
- draggable: !disabled,
8851
- onDragStart: (e) => handleDragStart(e, index),
8852
- onDragOver: handleDragOver,
8853
- onDrop: (e) => handleDrop(e, index),
8854
- onDragEnd: handleDragEnd,
8855
- className: cn(
8856
- "transition-opacity duration-200",
8857
- !disabled && "cursor-move hover:opacity-80",
8858
- draggedIndex === index && "opacity-50",
8859
- disabled && "cursor-not-allowed"
8860
- ),
8861
- children: renderItem(item, index)
8862
- },
8863
- keyExtractor(item)
8864
- )) });
8865
- }
8200
+ className: cn("moonui-theme", "ml-auto text-xs tracking-widest opacity-60", className),
8201
+ ...props
8202
+ }
8203
+ );
8204
+ };
8205
+ DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
8866
8206
  var progressVariants = classVarianceAuthority.cva(
8867
8207
  "relative overflow-hidden bg-muted",
8868
8208
  {
@@ -9928,83 +9268,241 @@ var PaginationContent = t__namespace.forwardRef(({ className, ...props }, ref) =
9928
9268
  "ul",
9929
9269
  {
9930
9270
  ref,
9931
- className: cn("moonui-theme", "flex flex-row items-center gap-1", className),
9271
+ className: cn("moonui-theme", "flex flex-row items-center gap-1", className),
9272
+ ...props
9273
+ }
9274
+ ));
9275
+ PaginationContent.displayName = "PaginationContent";
9276
+ var PaginationItem = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("li", { ref, className: cn("moonui-theme", "", className), ...props }));
9277
+ PaginationItem.displayName = "PaginationItem";
9278
+ var PaginationLink = ({
9279
+ className,
9280
+ isActive,
9281
+ size = "icon",
9282
+ ...props
9283
+ }) => /* @__PURE__ */ jsxRuntime.jsx(
9284
+ "a",
9285
+ {
9286
+ "aria-current": isActive ? "page" : void 0,
9287
+ className: cn(
9288
+ buttonVariants({
9289
+ variant: isActive ? "outline" : "ghost",
9290
+ size
9291
+ }),
9292
+ className
9293
+ ),
9294
+ ...props
9295
+ }
9296
+ );
9297
+ PaginationLink.displayName = "PaginationLink";
9298
+ var PaginationPrevious = ({
9299
+ className,
9300
+ ...props
9301
+ }) => /* @__PURE__ */ jsxRuntime.jsxs(
9302
+ PaginationLink,
9303
+ {
9304
+ "aria-label": "Go to previous page",
9305
+ size: "md",
9306
+ className: cn("moonui-theme", "gap-1 pl-2.5", className),
9307
+ ...props,
9308
+ children: [
9309
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "h-4 w-4" }),
9310
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Previous" })
9311
+ ]
9312
+ }
9313
+ );
9314
+ PaginationPrevious.displayName = "PaginationPrevious";
9315
+ var PaginationNext = ({
9316
+ className,
9317
+ ...props
9318
+ }) => /* @__PURE__ */ jsxRuntime.jsxs(
9319
+ PaginationLink,
9320
+ {
9321
+ "aria-label": "Go to next page",
9322
+ size: "md",
9323
+ className: cn("moonui-theme", "gap-1 pr-2.5", className),
9324
+ ...props,
9325
+ children: [
9326
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Next" }),
9327
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-4 w-4" })
9328
+ ]
9329
+ }
9330
+ );
9331
+ PaginationNext.displayName = "PaginationNext";
9332
+ var PaginationEllipsis = ({
9333
+ className,
9334
+ ...props
9335
+ }) => /* @__PURE__ */ jsxRuntime.jsxs(
9336
+ "span",
9337
+ {
9338
+ "aria-hidden": true,
9339
+ className: cn("moonui-theme", "flex h-9 w-9 items-center justify-center", className),
9340
+ ...props,
9341
+ children: [
9342
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MoreHorizontal, { className: "h-4 w-4" }),
9343
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "More pages" })
9344
+ ]
9345
+ }
9346
+ );
9347
+ PaginationEllipsis.displayName = "PaginationEllipsis";
9348
+ var Select = SelectPrimitive__namespace.Root;
9349
+ Select.displayName = "Select";
9350
+ var SelectGroup = SelectPrimitive__namespace.Group;
9351
+ var SelectValue = SelectPrimitive__namespace.Value;
9352
+ var SelectTrigger = t__namespace.forwardRef(({ className, children, variant = "standard", size = "md", error, success, loading, leftIcon, rightIcon, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
9353
+ SelectPrimitive__namespace.Trigger,
9354
+ {
9355
+ ref,
9356
+ className: cn(
9357
+ /* Base styles */
9358
+ "flex w-full items-center justify-between gap-1 rounded-md transition-all duration-200",
9359
+ "disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
9360
+ "focus-visible:outline-none",
9361
+ /* Error state */
9362
+ error && "border-error focus-visible:ring-error/30 focus-visible:border-error",
9363
+ /* Success state */
9364
+ success && "border-success focus-visible:ring-success/30 focus-visible:border-success",
9365
+ /* Size variants */
9366
+ size === "sm" && "h-8 text-xs px-2",
9367
+ size === "md" && "h-10 text-sm px-3",
9368
+ size === "lg" && "h-12 text-base px-4",
9369
+ /* Visual variants */
9370
+ variant === "standard" && "border border-gray-300 dark:border-gray-700 bg-background dark:bg-gray-900 hover:border-gray-400 dark:hover:border-gray-600 focus-visible:ring-2 focus-visible:ring-primary/30 dark:focus-visible:ring-primary/50 focus-visible:border-primary dark:focus-visible:border-primary",
9371
+ variant === "outline" && "border border-gray-300 dark:border-gray-700 bg-transparent hover:border-gray-400 dark:hover:border-gray-600 focus-visible:ring-2 focus-visible:ring-primary/30 dark:focus-visible:ring-primary/50 focus-visible:border-primary dark:focus-visible:border-primary",
9372
+ variant === "ghost" && "border-none bg-gray-100 dark:bg-gray-800 hover:bg-gray-200 dark:hover:bg-gray-700 focus-visible:ring-2 focus-visible:ring-primary/30 dark:focus-visible:ring-primary/50",
9373
+ variant === "underline" && "border-t-0 border-l-0 border-r-0 border-b border-gray-300 dark:border-gray-600 rounded-none px-0 hover:border-gray-400 dark:hover:border-gray-500 focus-visible:ring-0 focus-visible:border-b-2 focus-visible:border-primary dark:focus-visible:border-primary",
9374
+ className
9375
+ ),
9376
+ ...props,
9377
+ disabled: props.disabled || loading,
9378
+ "data-error": error ? true : void 0,
9379
+ "data-success": success ? true : void 0,
9380
+ "data-loading": loading ? true : void 0,
9381
+ children: [
9382
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center flex-1 gap-2", children: [
9383
+ leftIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex items-center justify-center text-gray-500 dark:text-gray-400", children: leftIcon }),
9384
+ loading ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
9385
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-3.5 w-3.5 animate-spin text-muted-foreground dark:text-gray-400" }),
9386
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground dark:text-gray-400", children: "Loading..." })
9387
+ ] }) : children
9388
+ ] }),
9389
+ !loading && /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Icon, { asChild: true, children: rightIcon ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "opacity-60", children: rightIcon }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4 opacity-60 transition-transform duration-200 ease-out group-data-[state=open]:rotate-180" }) })
9390
+ ]
9391
+ }
9392
+ ));
9393
+ SelectTrigger.displayName = SelectPrimitive__namespace.Trigger.displayName;
9394
+ var SelectScrollUpButton = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
9395
+ SelectPrimitive__namespace.ScrollUpButton,
9396
+ {
9397
+ ref,
9398
+ className: cn(
9399
+ "flex cursor-default items-center justify-center py-1 text-muted-foreground hover:text-foreground transition-colors",
9400
+ className
9401
+ ),
9402
+ ...props,
9403
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUp, { className: "h-4 w-4" })
9404
+ }
9405
+ ));
9406
+ SelectScrollUpButton.displayName = SelectPrimitive__namespace.ScrollUpButton.displayName;
9407
+ var SelectScrollDownButton = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
9408
+ SelectPrimitive__namespace.ScrollDownButton,
9409
+ {
9410
+ ref,
9411
+ className: cn(
9412
+ "flex cursor-default items-center justify-center py-1 text-muted-foreground hover:text-foreground transition-colors",
9413
+ className
9414
+ ),
9415
+ ...props,
9416
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4" })
9417
+ }
9418
+ ));
9419
+ SelectScrollDownButton.displayName = SelectPrimitive__namespace.ScrollDownButton.displayName;
9420
+ var SelectContent = t__namespace.forwardRef(({ className, children, position = "popper", side = "bottom", sideOffset = 4, align = "start", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
9421
+ SelectPrimitive__namespace.Content,
9422
+ {
9423
+ ref,
9424
+ side,
9425
+ sideOffset,
9426
+ align,
9427
+ avoidCollisions: false,
9428
+ className: cn(
9429
+ [
9430
+ "relative z-50 max-h-96 min-w-[8rem] overflow-hidden",
9431
+ "rounded-md border border-gray-200 dark:border-gray-700",
9432
+ "bg-white dark:bg-gray-900 text-foreground",
9433
+ "shadow-lg dark:shadow-gray-900/20",
9434
+ "data-[state=open]:animate-in data-[state=closed]:animate-out",
9435
+ "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
9436
+ "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
9437
+ "data-[state=open]:duration-150"
9438
+ ],
9439
+ 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",
9440
+ className
9441
+ ),
9442
+ position,
9443
+ ...props,
9444
+ children: [
9445
+ /* @__PURE__ */ jsxRuntime.jsx(SelectScrollUpButton, {}),
9446
+ /* @__PURE__ */ jsxRuntime.jsx(
9447
+ SelectPrimitive__namespace.Viewport,
9448
+ {
9449
+ className: cn(
9450
+ "p-1",
9451
+ position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
9452
+ ),
9453
+ children
9454
+ }
9455
+ ),
9456
+ /* @__PURE__ */ jsxRuntime.jsx(SelectScrollDownButton, {})
9457
+ ]
9458
+ }
9459
+ ) }));
9460
+ SelectContent.displayName = SelectPrimitive__namespace.Content.displayName;
9461
+ var SelectLabel = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
9462
+ SelectPrimitive__namespace.Label,
9463
+ {
9464
+ ref,
9465
+ className: cn("moonui-theme", "py-1.5 pl-8 pr-2 text-sm font-semibold", className),
9932
9466
  ...props
9933
9467
  }
9934
9468
  ));
9935
- PaginationContent.displayName = "PaginationContent";
9936
- var PaginationItem = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("li", { ref, className: cn("moonui-theme", "", className), ...props }));
9937
- PaginationItem.displayName = "PaginationItem";
9938
- var PaginationLink = ({
9939
- className,
9940
- isActive,
9941
- size = "icon",
9942
- ...props
9943
- }) => /* @__PURE__ */ jsxRuntime.jsx(
9944
- "a",
9469
+ SelectLabel.displayName = SelectPrimitive__namespace.Label.displayName;
9470
+ var SelectItem = t__namespace.forwardRef(({ className, children, variant = "default", size = "md", rightIcon, customIndicator, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
9471
+ SelectPrimitive__namespace.Item,
9945
9472
  {
9946
- "aria-current": isActive ? "page" : void 0,
9473
+ ref,
9947
9474
  className: cn(
9948
- buttonVariants({
9949
- variant: isActive ? "outline" : "ghost",
9950
- size
9951
- }),
9475
+ "relative flex w-full cursor-default select-none items-center rounded-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
9476
+ /* Size variants */
9477
+ size === "sm" && "py-1 pl-7 pr-2 text-xs",
9478
+ size === "md" && "py-1.5 pl-8 pr-2 text-sm",
9479
+ size === "lg" && "py-2 pl-9 pr-3 text-base",
9480
+ /* Color variants */
9481
+ variant === "default" && "focus:bg-accent focus:text-accent-foreground dark:focus:bg-gray-700 dark:focus:text-gray-100",
9482
+ variant === "subtle" && "focus:bg-gray-100 dark:focus:bg-gray-800 focus:text-foreground dark:focus:text-gray-200",
9483
+ variant === "destructive" && "text-error dark:text-red-400 focus:bg-error/10 dark:focus:bg-red-900/20 focus:text-error dark:focus:text-red-300",
9484
+ variant === "success" && "text-success dark:text-green-400 focus:bg-success/10 dark:focus:bg-green-900/20 focus:text-success dark:focus:text-green-300",
9485
+ variant === "warning" && "text-warning dark:text-yellow-400 focus:bg-warning/10 dark:focus:bg-yellow-900/20 focus:text-warning dark:focus:text-yellow-300",
9952
9486
  className
9953
9487
  ),
9954
- ...props
9955
- }
9956
- );
9957
- PaginationLink.displayName = "PaginationLink";
9958
- var PaginationPrevious = ({
9959
- className,
9960
- ...props
9961
- }) => /* @__PURE__ */ jsxRuntime.jsxs(
9962
- PaginationLink,
9963
- {
9964
- "aria-label": "Go to previous page",
9965
- size: "md",
9966
- className: cn("moonui-theme", "gap-1 pl-2.5", className),
9967
- ...props,
9968
- children: [
9969
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "h-4 w-4" }),
9970
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Previous" })
9971
- ]
9972
- }
9973
- );
9974
- PaginationPrevious.displayName = "PaginationPrevious";
9975
- var PaginationNext = ({
9976
- className,
9977
- ...props
9978
- }) => /* @__PURE__ */ jsxRuntime.jsxs(
9979
- PaginationLink,
9980
- {
9981
- "aria-label": "Go to next page",
9982
- size: "md",
9983
- className: cn("moonui-theme", "gap-1 pr-2.5", className),
9984
9488
  ...props,
9985
9489
  children: [
9986
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Next" }),
9987
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-4 w-4" })
9490
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemIndicator, { children: customIndicator || /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-4 w-4" }) }) }),
9491
+ /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemText, { children }),
9492
+ rightIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-auto pl-2 opacity-70", children: rightIcon })
9988
9493
  ]
9989
9494
  }
9990
- );
9991
- PaginationNext.displayName = "PaginationNext";
9992
- var PaginationEllipsis = ({
9993
- className,
9994
- ...props
9995
- }) => /* @__PURE__ */ jsxRuntime.jsxs(
9996
- "span",
9495
+ ));
9496
+ SelectItem.displayName = SelectPrimitive__namespace.Item.displayName;
9497
+ var SelectSeparator = t__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
9498
+ SelectPrimitive__namespace.Separator,
9997
9499
  {
9998
- "aria-hidden": true,
9999
- className: cn("moonui-theme", "flex h-9 w-9 items-center justify-center", className),
10000
- ...props,
10001
- children: [
10002
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MoreHorizontal, { className: "h-4 w-4" }),
10003
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "More pages" })
10004
- ]
9500
+ ref,
9501
+ className: cn("moonui-theme", "-mx-1 my-1 h-px bg-muted dark:bg-gray-700", className),
9502
+ ...props
10005
9503
  }
10006
- );
10007
- PaginationEllipsis.displayName = "PaginationEllipsis";
9504
+ ));
9505
+ SelectSeparator.displayName = SelectPrimitive__namespace.Separator.displayName;
10008
9506
  var countryCodes = [
10009
9507
  { code: "+1", country: "US", flag: "\u{1F1FA}\u{1F1F8}", name: "United States" },
10010
9508
  { code: "+44", country: "GB", flag: "\u{1F1EC}\u{1F1E7}", name: "United Kingdom" },
@@ -12084,106 +11582,365 @@ var SimpleEditor = t__namespace.default.forwardRef(
12084
11582
  },
12085
11583
  disabled
12086
11584
  }
12087
- )
12088
- ] })
12089
- ]
11585
+ )
11586
+ ] })
11587
+ ]
11588
+ }
11589
+ ) });
11590
+ return /* @__PURE__ */ jsxRuntime.jsxs(
11591
+ "div",
11592
+ {
11593
+ ref,
11594
+ className: cn(
11595
+ "border border-gray-200 dark:border-zinc-700 rounded-lg overflow-hidden focus-within:ring-2 focus-within:ring-ring focus-within:border-transparent",
11596
+ disabled && "opacity-50 cursor-not-allowed",
11597
+ className
11598
+ ),
11599
+ ...props,
11600
+ children: [
11601
+ toolbar,
11602
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
11603
+ isPreview ? /* @__PURE__ */ jsxRuntime.jsx(
11604
+ framerMotion.motion.div,
11605
+ {
11606
+ initial: { opacity: 0 },
11607
+ animate: { opacity: 1 },
11608
+ className: "bg-slate-50 dark:bg-zinc-900/95",
11609
+ style: { minHeight, maxHeight, overflow: "auto" },
11610
+ children: /* @__PURE__ */ jsxRuntime.jsx(
11611
+ "textarea",
11612
+ {
11613
+ ref: sourceRef,
11614
+ value: sourceContent,
11615
+ onChange: (e) => setSourceContent(e.target.value),
11616
+ className: "w-full h-full bg-transparent p-4 font-mono text-sm text-gray-900 dark:text-gray-100 resize-none focus:outline-none",
11617
+ style: { minHeight: minHeight - 32 },
11618
+ disabled,
11619
+ placeholder: "HTML source code..."
11620
+ }
11621
+ )
11622
+ }
11623
+ ) : /* @__PURE__ */ jsxRuntime.jsx(
11624
+ framerMotion.motion.div,
11625
+ {
11626
+ ref: editorRef,
11627
+ contentEditable: !disabled,
11628
+ suppressContentEditableWarning: true,
11629
+ className: cn(
11630
+ "p-4 outline-none prose prose-sm dark:prose-invert max-w-none overflow-y-auto",
11631
+ "bg-slate-50 dark:bg-zinc-900/95",
11632
+ "text-gray-900 dark:text-gray-100",
11633
+ "focus:ring-0",
11634
+ "[&_h1]:text-3xl [&_h1]:font-bold [&_h1]:mb-4",
11635
+ "[&_h2]:text-2xl [&_h2]:font-bold [&_h2]:mb-3",
11636
+ "[&_h3]:text-xl [&_h3]:font-bold [&_h3]:mb-2",
11637
+ "[&_h4]:text-lg [&_h4]:font-bold [&_h4]:mb-2",
11638
+ "[&_h5]:text-base [&_h5]:font-bold [&_h5]:mb-1",
11639
+ "[&_h6]:text-sm [&_h6]:font-bold [&_h6]:mb-1",
11640
+ "[&_ul]:list-disc [&_ul]:pl-6 [&_ul]:mb-4",
11641
+ "[&_ol]:list-decimal [&_ol]:pl-6 [&_ol]:mb-4",
11642
+ "[&_li]:mb-1",
11643
+ "[&_blockquote]:border-l-4 [&_blockquote]:border-gray-300 [&_blockquote]:pl-4 [&_blockquote]:italic",
11644
+ "[&_pre]:bg-gray-100 [&_pre]:dark:bg-gray-800 [&_pre]:p-4 [&_pre]:rounded [&_pre]:overflow-x-auto"
11645
+ ),
11646
+ style: { minHeight, maxHeight },
11647
+ onInput: handleInput,
11648
+ onKeyDown: handleKeyDown,
11649
+ "data-placeholder": placeholder,
11650
+ initial: { opacity: 0 },
11651
+ animate: { opacity: 1 }
11652
+ }
11653
+ ),
11654
+ !content && !isPreview && /* @__PURE__ */ jsxRuntime.jsx(
11655
+ "div",
11656
+ {
11657
+ className: "absolute top-4 left-4 text-muted-foreground pointer-events-none",
11658
+ style: { fontSize: "16px" },
11659
+ children: placeholder
11660
+ }
11661
+ )
11662
+ ] }),
11663
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-4 py-2 border-t bg-gray-50/50 dark:bg-zinc-800/50 backdrop-blur-sm text-xs text-gray-600 dark:text-gray-400", children: /* @__PURE__ */ jsxRuntime.jsx(CharacterCount, { content }) })
11664
+ ]
11665
+ }
11666
+ );
11667
+ }
11668
+ );
11669
+ SimpleEditor.displayName = "SimpleEditor";
11670
+ var CharacterCount = ({ content }) => {
11671
+ const [count4, setCount] = t.useState(0);
11672
+ t.useEffect(() => {
11673
+ const getPlainText = (html) => {
11674
+ const div = document.createElement("div");
11675
+ div.innerHTML = html;
11676
+ return div.textContent || div.innerText || "";
11677
+ };
11678
+ setCount(getPlainText(content).length);
11679
+ }, [content]);
11680
+ return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
11681
+ count4,
11682
+ " characters"
11683
+ ] });
11684
+ };
11685
+ var skeletonVariants = classVarianceAuthority.cva(
11686
+ "animate-pulse rounded-md",
11687
+ {
11688
+ variants: {
11689
+ variant: {
11690
+ default: "bg-muted",
11691
+ primary: "bg-primary/10",
11692
+ secondary: "bg-secondary/10",
11693
+ accent: "bg-accent"
11694
+ },
11695
+ size: {
11696
+ default: "",
11697
+ sm: "scale-90",
11698
+ lg: "scale-110"
11699
+ },
11700
+ shape: {
11701
+ rect: "rounded-md",
11702
+ circle: "rounded-full",
11703
+ pill: "rounded-full"
11704
+ },
11705
+ animation: {
11706
+ pulse: "animate-pulse",
11707
+ wave: "overflow-hidden relative after:absolute after:inset-0 after:-translate-x-full after:animate-[shimmer_2s_infinite] after:bg-gradient-to-r after:from-transparent after:via-white/10 after:to-transparent dark:after:via-white/5",
11708
+ none: "animate-none"
11709
+ }
11710
+ },
11711
+ defaultVariants: {
11712
+ variant: "default",
11713
+ size: "default",
11714
+ shape: "rect",
11715
+ animation: "pulse"
11716
+ }
11717
+ }
11718
+ );
11719
+ var Skeleton = t__namespace.forwardRef(
11720
+ ({
11721
+ className,
11722
+ variant,
11723
+ size,
11724
+ shape,
11725
+ animation,
11726
+ height,
11727
+ width,
11728
+ isLoaded = false,
11729
+ children,
11730
+ fadeInDuration = 400,
11731
+ motion: useMotion = false,
11732
+ style,
11733
+ ...props
11734
+ }, ref) => {
11735
+ const {
11736
+ onDrag,
11737
+ onDragEnd,
11738
+ onDragStart,
11739
+ onAnimationStart,
11740
+ onAnimationEnd,
11741
+ onAnimationIteration,
11742
+ ...filteredProps
11743
+ } = props;
11744
+ if (isLoaded && children) {
11745
+ if (useMotion) {
11746
+ return /* @__PURE__ */ jsxRuntime.jsx(
11747
+ framerMotion.motion.div,
11748
+ {
11749
+ ref,
11750
+ initial: { opacity: 0 },
11751
+ animate: { opacity: 1 },
11752
+ transition: { duration: fadeInDuration / 1e3 },
11753
+ className: cn("moonui-theme", className),
11754
+ style: {
11755
+ height,
11756
+ width,
11757
+ ...style
11758
+ },
11759
+ ...filteredProps,
11760
+ children
11761
+ }
11762
+ );
11763
+ }
11764
+ return /* @__PURE__ */ jsxRuntime.jsx(
11765
+ "div",
11766
+ {
11767
+ ref,
11768
+ className: cn("moonui-theme", "animate-fade-in", className),
11769
+ style: {
11770
+ animationDuration: `${fadeInDuration}ms`,
11771
+ height,
11772
+ width,
11773
+ ...style
11774
+ },
11775
+ ...props,
11776
+ children
11777
+ }
11778
+ );
11779
+ }
11780
+ const SkeletonElement = useMotion ? framerMotion.motion.div : "div";
11781
+ return /* @__PURE__ */ jsxRuntime.jsx(
11782
+ SkeletonElement,
11783
+ {
11784
+ ref,
11785
+ className: cn(
11786
+ "moonui-theme",
11787
+ skeletonVariants({ variant, size, shape, animation }),
11788
+ "relative isolate",
11789
+ className
11790
+ ),
11791
+ style: {
11792
+ height,
11793
+ width,
11794
+ ...style
11795
+ },
11796
+ ...useMotion ? skeletonAnimation : {},
11797
+ ...filteredProps
11798
+ }
11799
+ );
11800
+ }
11801
+ );
11802
+ Skeleton.displayName = "Skeleton";
11803
+ var SkeletonText = t__namespace.forwardRef(
11804
+ ({
11805
+ className,
11806
+ lines = 3,
11807
+ lineHeight = "0.85rem",
11808
+ spacing = "0.5rem",
11809
+ lastLineWidth = 80,
11810
+ randomWidths = false,
11811
+ variant = "default",
11812
+ animation = "pulse",
11813
+ ...props
11814
+ }, ref) => {
11815
+ return /* @__PURE__ */ jsxRuntime.jsx(
11816
+ "div",
11817
+ {
11818
+ ref,
11819
+ className: cn("moonui-theme", "flex flex-col", className),
11820
+ style: { gap: spacing },
11821
+ ...props,
11822
+ children: Array.from({ length: lines }).map((_, i) => {
11823
+ const isLastLine = i === lines - 1;
11824
+ const widthPercentage = isLastLine ? lastLineWidth : randomWidths ? 85 + i % 3 * 5 : 100;
11825
+ return /* @__PURE__ */ jsxRuntime.jsx(
11826
+ Skeleton,
11827
+ {
11828
+ variant,
11829
+ animation,
11830
+ className: "w-full",
11831
+ style: {
11832
+ height: lineHeight,
11833
+ width: `${widthPercentage}%`
11834
+ }
11835
+ },
11836
+ i
11837
+ );
11838
+ })
12090
11839
  }
12091
- ) });
11840
+ );
11841
+ }
11842
+ );
11843
+ SkeletonText.displayName = "SkeletonText";
11844
+ var SkeletonAvatar = t__namespace.forwardRef(
11845
+ ({
11846
+ className,
11847
+ size = "2.5rem",
11848
+ variant = "default",
11849
+ animation = "pulse",
11850
+ ...props
11851
+ }, ref) => {
11852
+ return /* @__PURE__ */ jsxRuntime.jsx(
11853
+ Skeleton,
11854
+ {
11855
+ ref,
11856
+ variant,
11857
+ animation,
11858
+ shape: "circle",
11859
+ className: cn("moonui-theme", "shrink-0", className),
11860
+ style: {
11861
+ height: size,
11862
+ width: size
11863
+ },
11864
+ ...props
11865
+ }
11866
+ );
11867
+ }
11868
+ );
11869
+ SkeletonAvatar.displayName = "SkeletonAvatar";
11870
+ var SkeletonCard = t__namespace.forwardRef(
11871
+ ({
11872
+ className,
11873
+ showHeader = true,
11874
+ contentLines = 3,
11875
+ showFooter = true,
11876
+ variant = "default",
11877
+ animation = "pulse",
11878
+ ...props
11879
+ }, ref) => {
12092
11880
  return /* @__PURE__ */ jsxRuntime.jsxs(
12093
11881
  "div",
12094
11882
  {
12095
11883
  ref,
12096
11884
  className: cn(
12097
- "border border-gray-200 dark:border-zinc-700 rounded-lg overflow-hidden focus-within:ring-2 focus-within:ring-ring focus-within:border-transparent",
12098
- disabled && "opacity-50 cursor-not-allowed",
11885
+ "overflow-hidden rounded-md border border-border bg-background p-4",
12099
11886
  className
12100
11887
  ),
12101
11888
  ...props,
12102
11889
  children: [
12103
- toolbar,
12104
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
12105
- isPreview ? /* @__PURE__ */ jsxRuntime.jsx(
12106
- framerMotion.motion.div,
12107
- {
12108
- initial: { opacity: 0 },
12109
- animate: { opacity: 1 },
12110
- className: "bg-slate-50 dark:bg-zinc-900/95",
12111
- style: { minHeight, maxHeight, overflow: "auto" },
12112
- children: /* @__PURE__ */ jsxRuntime.jsx(
12113
- "textarea",
12114
- {
12115
- ref: sourceRef,
12116
- value: sourceContent,
12117
- onChange: (e) => setSourceContent(e.target.value),
12118
- className: "w-full h-full bg-transparent p-4 font-mono text-sm text-gray-900 dark:text-gray-100 resize-none focus:outline-none",
12119
- style: { minHeight: minHeight - 32 },
12120
- disabled,
12121
- placeholder: "HTML source code..."
12122
- }
12123
- )
12124
- }
12125
- ) : /* @__PURE__ */ jsxRuntime.jsx(
12126
- framerMotion.motion.div,
11890
+ showHeader && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-4 flex items-center gap-4", children: [
11891
+ /* @__PURE__ */ jsxRuntime.jsx(SkeletonAvatar, { size: "2.5rem", variant, animation }),
11892
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1", children: [
11893
+ /* @__PURE__ */ jsxRuntime.jsx(
11894
+ Skeleton,
11895
+ {
11896
+ variant,
11897
+ animation,
11898
+ className: "mb-2 h-4 w-1/3"
11899
+ }
11900
+ ),
11901
+ /* @__PURE__ */ jsxRuntime.jsx(
11902
+ Skeleton,
11903
+ {
11904
+ variant,
11905
+ animation,
11906
+ className: "h-3 w-1/4"
11907
+ }
11908
+ )
11909
+ ] })
11910
+ ] }),
11911
+ /* @__PURE__ */ jsxRuntime.jsx(
11912
+ SkeletonText,
11913
+ {
11914
+ lines: contentLines,
11915
+ variant,
11916
+ animation,
11917
+ className: "mb-4"
11918
+ }
11919
+ ),
11920
+ showFooter && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mt-4 pt-4 border-t border-border", children: [
11921
+ /* @__PURE__ */ jsxRuntime.jsx(
11922
+ Skeleton,
12127
11923
  {
12128
- ref: editorRef,
12129
- contentEditable: !disabled,
12130
- suppressContentEditableWarning: true,
12131
- className: cn(
12132
- "p-4 outline-none prose prose-sm dark:prose-invert max-w-none overflow-y-auto",
12133
- "bg-slate-50 dark:bg-zinc-900/95",
12134
- "text-gray-900 dark:text-gray-100",
12135
- "focus:ring-0",
12136
- "[&_h1]:text-3xl [&_h1]:font-bold [&_h1]:mb-4",
12137
- "[&_h2]:text-2xl [&_h2]:font-bold [&_h2]:mb-3",
12138
- "[&_h3]:text-xl [&_h3]:font-bold [&_h3]:mb-2",
12139
- "[&_h4]:text-lg [&_h4]:font-bold [&_h4]:mb-2",
12140
- "[&_h5]:text-base [&_h5]:font-bold [&_h5]:mb-1",
12141
- "[&_h6]:text-sm [&_h6]:font-bold [&_h6]:mb-1",
12142
- "[&_ul]:list-disc [&_ul]:pl-6 [&_ul]:mb-4",
12143
- "[&_ol]:list-decimal [&_ol]:pl-6 [&_ol]:mb-4",
12144
- "[&_li]:mb-1",
12145
- "[&_blockquote]:border-l-4 [&_blockquote]:border-gray-300 [&_blockquote]:pl-4 [&_blockquote]:italic",
12146
- "[&_pre]:bg-gray-100 [&_pre]:dark:bg-gray-800 [&_pre]:p-4 [&_pre]:rounded [&_pre]:overflow-x-auto"
12147
- ),
12148
- style: { minHeight, maxHeight },
12149
- onInput: handleInput,
12150
- onKeyDown: handleKeyDown,
12151
- "data-placeholder": placeholder,
12152
- initial: { opacity: 0 },
12153
- animate: { opacity: 1 }
11924
+ variant,
11925
+ animation,
11926
+ className: "h-4 w-1/4"
12154
11927
  }
12155
11928
  ),
12156
- !content && !isPreview && /* @__PURE__ */ jsxRuntime.jsx(
12157
- "div",
11929
+ /* @__PURE__ */ jsxRuntime.jsx(
11930
+ Skeleton,
12158
11931
  {
12159
- className: "absolute top-4 left-4 text-muted-foreground pointer-events-none",
12160
- style: { fontSize: "16px" },
12161
- children: placeholder
11932
+ variant,
11933
+ animation,
11934
+ className: "h-4 w-1/5"
12162
11935
  }
12163
11936
  )
12164
- ] }),
12165
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-4 py-2 border-t bg-gray-50/50 dark:bg-zinc-800/50 backdrop-blur-sm text-xs text-gray-600 dark:text-gray-400", children: /* @__PURE__ */ jsxRuntime.jsx(CharacterCount, { content }) })
11937
+ ] })
12166
11938
  ]
12167
11939
  }
12168
11940
  );
12169
11941
  }
12170
11942
  );
12171
- SimpleEditor.displayName = "SimpleEditor";
12172
- var CharacterCount = ({ content }) => {
12173
- const [count4, setCount] = t.useState(0);
12174
- t.useEffect(() => {
12175
- const getPlainText = (html) => {
12176
- const div = document.createElement("div");
12177
- div.innerHTML = html;
12178
- return div.textContent || div.innerText || "";
12179
- };
12180
- setCount(getPlainText(content).length);
12181
- }, [content]);
12182
- return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
12183
- count4,
12184
- " characters"
12185
- ] });
12186
- };
11943
+ SkeletonCard.displayName = "SkeletonCard";
12187
11944
  var SwipeableCard = t__namespace.forwardRef(
12188
11945
  ({ className, children, onSwipeLeft, onSwipeRight, threshold = 100, disabled = false, ...props }, ref) => {
12189
11946
  const [startX, setStartX] = t__namespace.useState(0);
@@ -12719,7 +12476,6 @@ exports.CommandItem = CommandItem;
12719
12476
  exports.CommandList = CommandList;
12720
12477
  exports.CommandSeparator = CommandSeparator;
12721
12478
  exports.CommandShortcut = CommandShortcut;
12722
- exports.DataTable = DataTable;
12723
12479
  exports.DatePicker = DatePicker;
12724
12480
  exports.DateRangePicker = DateRangePicker;
12725
12481
  exports.DateTimePicker = DateTimePicker;
@@ -12809,7 +12565,7 @@ exports.MoonUICommandItem = CommandItem;
12809
12565
  exports.MoonUICommandList = CommandList;
12810
12566
  exports.MoonUICommandSeparator = CommandSeparator;
12811
12567
  exports.MoonUICommandShortcut = CommandShortcut;
12812
- exports.MoonUIDataTable = DataTable;
12568
+ exports.MoonUIDataTableBasic = DataTableBasic;
12813
12569
  exports.MoonUIDatePicker = DatePicker;
12814
12570
  exports.MoonUIDateRangePicker = DateRangePicker;
12815
12571
  exports.MoonUIDateTimePicker = DateTimePicker;
@@ -12996,10 +12752,9 @@ exports.buttonVariants = buttonVariants;
12996
12752
  exports.cn = cn;
12997
12753
  exports.collapsibleContentVariants = collapsibleContentVariants;
12998
12754
  exports.collapsibleTriggerVariants = collapsibleTriggerVariants;
12999
- exports.createFilterableColumn = createFilterableColumn;
13000
- exports.createSortableHeader = createSortableHeader;
13001
12755
  exports.moonUIBadgeVariants = badgeVariants;
13002
12756
  exports.moonUIButtonVariants = buttonVariants;
12757
+ exports.moonUICreateSortableHeader = createSortableHeader;
13003
12758
  exports.moonUISkeletonVariants = skeletonVariants;
13004
12759
  exports.moonUIToggleVariants = toggleVariants;
13005
12760
  exports.popoverContentVariants = popoverContentVariants;