@gamecp/ui 0.1.13 → 0.1.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +294 -1
- package/dist/index.d.ts +294 -1
- package/dist/index.js +1510 -0
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1469 -2
- package/dist/index.mjs.map +1 -1
- package/package.json +11 -5
package/dist/index.d.mts
CHANGED
|
@@ -194,6 +194,14 @@ interface GridProps {
|
|
|
194
194
|
}
|
|
195
195
|
declare function Grid({ children, cols, gap, className, }: GridProps): react_jsx_runtime.JSX.Element;
|
|
196
196
|
|
|
197
|
+
interface InfoBoxProps {
|
|
198
|
+
title: string;
|
|
199
|
+
children: React__default.ReactNode;
|
|
200
|
+
variant?: 'default' | 'warning' | 'info' | 'success';
|
|
201
|
+
className?: string;
|
|
202
|
+
}
|
|
203
|
+
declare function InfoBox({ title, children, variant, className }: InfoBoxProps): react_jsx_runtime.JSX.Element;
|
|
204
|
+
|
|
197
205
|
interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
198
206
|
href: string;
|
|
199
207
|
variant?: 'default' | 'primary' | 'muted';
|
|
@@ -312,8 +320,79 @@ interface SkeletonItemProps {
|
|
|
312
320
|
rounded?: boolean;
|
|
313
321
|
animate?: boolean;
|
|
314
322
|
}
|
|
323
|
+
interface SkeletonCardProps {
|
|
324
|
+
className?: string;
|
|
325
|
+
children: ReactNode;
|
|
326
|
+
}
|
|
327
|
+
interface SkeletonTableProps {
|
|
328
|
+
rows?: number;
|
|
329
|
+
columns?: number;
|
|
330
|
+
className?: string;
|
|
331
|
+
showHeader?: boolean;
|
|
332
|
+
}
|
|
333
|
+
interface SkeletonListProps {
|
|
334
|
+
items?: number;
|
|
335
|
+
className?: string;
|
|
336
|
+
itemHeight?: string;
|
|
337
|
+
}
|
|
315
338
|
declare function Skeleton({ className, children }: SkeletonProps): react_jsx_runtime.JSX.Element;
|
|
316
339
|
declare function SkeletonItem({ className, width, height, rounded, animate, }: SkeletonItemProps): react_jsx_runtime.JSX.Element;
|
|
340
|
+
declare function SkeletonCard({ className, children }: SkeletonCardProps): react_jsx_runtime.JSX.Element;
|
|
341
|
+
declare function SkeletonTable({ rows, columns, className, showHeader, }: SkeletonTableProps): react_jsx_runtime.JSX.Element;
|
|
342
|
+
declare function SkeletonList({ items, className, itemHeight, }: SkeletonListProps): react_jsx_runtime.JSX.Element;
|
|
343
|
+
declare function SkeletonSearchCard({ className }: {
|
|
344
|
+
className?: string;
|
|
345
|
+
}): react_jsx_runtime.JSX.Element;
|
|
346
|
+
declare function SkeletonGameServerCard({ className, }: {
|
|
347
|
+
className?: string;
|
|
348
|
+
}): react_jsx_runtime.JSX.Element;
|
|
349
|
+
declare function SkeletonGameCard({ className }: {
|
|
350
|
+
className?: string;
|
|
351
|
+
}): react_jsx_runtime.JSX.Element;
|
|
352
|
+
declare function SkeletonUserCard({ className }: {
|
|
353
|
+
className?: string;
|
|
354
|
+
}): react_jsx_runtime.JSX.Element;
|
|
355
|
+
declare function SkeletonNodeCard({ className }: {
|
|
356
|
+
className?: string;
|
|
357
|
+
}): react_jsx_runtime.JSX.Element;
|
|
358
|
+
declare function SkeletonTenantCard({ className }: {
|
|
359
|
+
className?: string;
|
|
360
|
+
}): react_jsx_runtime.JSX.Element;
|
|
361
|
+
declare function SkeletonStats({ className }: {
|
|
362
|
+
className?: string;
|
|
363
|
+
}): react_jsx_runtime.JSX.Element;
|
|
364
|
+
declare function SkeletonRecentActivity({ items, className, }: {
|
|
365
|
+
items?: number;
|
|
366
|
+
className?: string;
|
|
367
|
+
}): react_jsx_runtime.JSX.Element;
|
|
368
|
+
declare function SkeletonForm({ fields, className, }: {
|
|
369
|
+
fields?: number;
|
|
370
|
+
className?: string;
|
|
371
|
+
}): react_jsx_runtime.JSX.Element;
|
|
372
|
+
declare function SkeletonGameServerCards({ items, className, }: {
|
|
373
|
+
items?: number;
|
|
374
|
+
className?: string;
|
|
375
|
+
}): react_jsx_runtime.JSX.Element;
|
|
376
|
+
declare function SkeletonNodeCards({ items, className, }: {
|
|
377
|
+
items?: number;
|
|
378
|
+
className?: string;
|
|
379
|
+
}): react_jsx_runtime.JSX.Element;
|
|
380
|
+
declare function SkeletonNodeTable({ items, className, }: {
|
|
381
|
+
items?: number;
|
|
382
|
+
className?: string;
|
|
383
|
+
}): react_jsx_runtime.JSX.Element;
|
|
384
|
+
declare function SkeletonGameServerTable({ items, className, }: {
|
|
385
|
+
items?: number;
|
|
386
|
+
className?: string;
|
|
387
|
+
}): react_jsx_runtime.JSX.Element;
|
|
388
|
+
declare function SkeletonGamesTable({ items, className, }: {
|
|
389
|
+
items?: number;
|
|
390
|
+
className?: string;
|
|
391
|
+
}): react_jsx_runtime.JSX.Element;
|
|
392
|
+
declare function SkeletonEnvironmentsList({ items, className, }: {
|
|
393
|
+
items?: number;
|
|
394
|
+
className?: string;
|
|
395
|
+
}): react_jsx_runtime.JSX.Element;
|
|
317
396
|
|
|
318
397
|
type TypographyElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span' | 'div';
|
|
319
398
|
type TypographyVariant = 'default' | 'muted' | 'bold';
|
|
@@ -327,6 +406,220 @@ interface TypographyProps {
|
|
|
327
406
|
}
|
|
328
407
|
declare function Typography({ as: Element, variant, size, children, className }: TypographyProps): react_jsx_runtime.JSX.Element;
|
|
329
408
|
|
|
409
|
+
interface DataTableProps {
|
|
410
|
+
children: ReactNode;
|
|
411
|
+
className?: string;
|
|
412
|
+
containerClassName?: string;
|
|
413
|
+
stickyActions?: boolean;
|
|
414
|
+
}
|
|
415
|
+
interface DataTableHeaderProps {
|
|
416
|
+
children: ReactNode;
|
|
417
|
+
className?: string;
|
|
418
|
+
}
|
|
419
|
+
interface DataTableBodyProps {
|
|
420
|
+
children: ReactNode;
|
|
421
|
+
className?: string;
|
|
422
|
+
}
|
|
423
|
+
interface DataTableRowProps {
|
|
424
|
+
children: ReactNode;
|
|
425
|
+
className?: string;
|
|
426
|
+
onClick?: () => void;
|
|
427
|
+
hover?: boolean;
|
|
428
|
+
}
|
|
429
|
+
interface DataTableCellProps {
|
|
430
|
+
children: ReactNode;
|
|
431
|
+
className?: string;
|
|
432
|
+
align?: 'left' | 'center' | 'right';
|
|
433
|
+
padding?: 'sm' | 'md' | 'lg';
|
|
434
|
+
sticky?: 'left' | 'right';
|
|
435
|
+
stickyOffset?: number;
|
|
436
|
+
}
|
|
437
|
+
interface DataTableHeaderCellProps {
|
|
438
|
+
children: ReactNode;
|
|
439
|
+
className?: string;
|
|
440
|
+
align?: 'left' | 'center' | 'right';
|
|
441
|
+
padding?: 'sm' | 'md' | 'lg';
|
|
442
|
+
sticky?: 'left' | 'right';
|
|
443
|
+
stickyOffset?: number;
|
|
444
|
+
}
|
|
445
|
+
declare function DataTable({ children, className, containerClassName, stickyActions, }: DataTableProps): react_jsx_runtime.JSX.Element;
|
|
446
|
+
declare function DataTableHeader({ children, className, }: DataTableHeaderProps): react_jsx_runtime.JSX.Element;
|
|
447
|
+
declare function DataTableBody({ children, className, }: DataTableBodyProps): react_jsx_runtime.JSX.Element;
|
|
448
|
+
declare function DataTableRow({ children, className, onClick, hover, }: DataTableRowProps): react_jsx_runtime.JSX.Element;
|
|
449
|
+
declare function DataTableHeaderCell({ children, className, align, padding, sticky, stickyOffset, }: DataTableHeaderCellProps): react_jsx_runtime.JSX.Element;
|
|
450
|
+
declare function DataTableCell({ children, className, align, padding, sticky, stickyOffset, }: DataTableCellProps): react_jsx_runtime.JSX.Element;
|
|
451
|
+
declare function DataTableEmptyState({ icon: Icon, title, description, action, variant, }: {
|
|
452
|
+
icon: React.ComponentType<{
|
|
453
|
+
className?: string;
|
|
454
|
+
}>;
|
|
455
|
+
title: string;
|
|
456
|
+
description: string;
|
|
457
|
+
action?: ReactNode;
|
|
458
|
+
variant?: 'table' | 'div';
|
|
459
|
+
}): react_jsx_runtime.JSX.Element;
|
|
460
|
+
declare function DataTableLoadingState({ message, rows, columns, }: {
|
|
461
|
+
message?: string;
|
|
462
|
+
rows?: number;
|
|
463
|
+
columns?: number;
|
|
464
|
+
}): react_jsx_runtime.JSX.Element;
|
|
465
|
+
declare function StatusBadge({ status, variant, }: {
|
|
466
|
+
status: string;
|
|
467
|
+
variant?: 'default' | 'success' | 'warning' | 'error' | 'info';
|
|
468
|
+
}): react_jsx_runtime.JSX.Element;
|
|
469
|
+
declare function DataTableActions({ children, className, enhanced, }: {
|
|
470
|
+
children: ReactNode;
|
|
471
|
+
className?: string;
|
|
472
|
+
enhanced?: boolean;
|
|
473
|
+
}): react_jsx_runtime.JSX.Element;
|
|
474
|
+
declare function StickyActionsColumn({ children, className, }: {
|
|
475
|
+
children: ReactNode;
|
|
476
|
+
className?: string;
|
|
477
|
+
}): react_jsx_runtime.JSX.Element;
|
|
478
|
+
|
|
479
|
+
interface SearchCardProps {
|
|
480
|
+
title: string;
|
|
481
|
+
count: number;
|
|
482
|
+
total: number;
|
|
483
|
+
actionButton?: ReactNode;
|
|
484
|
+
children: ReactNode;
|
|
485
|
+
className?: string;
|
|
486
|
+
icon?: IconType;
|
|
487
|
+
description?: string;
|
|
488
|
+
}
|
|
489
|
+
interface SearchCardHeaderProps {
|
|
490
|
+
title: string;
|
|
491
|
+
count: number;
|
|
492
|
+
total: number;
|
|
493
|
+
actionButton?: ReactNode;
|
|
494
|
+
icon?: IconType;
|
|
495
|
+
description?: string;
|
|
496
|
+
}
|
|
497
|
+
interface SearchCardContentProps {
|
|
498
|
+
children: ReactNode;
|
|
499
|
+
className?: string;
|
|
500
|
+
}
|
|
501
|
+
declare function SearchCard({ title, count, total, actionButton, children, className, icon: Icon, description, }: SearchCardProps): react_jsx_runtime.JSX.Element;
|
|
502
|
+
declare function SearchCardHeader({ title, count, total, actionButton, icon: Icon, description, }: SearchCardHeaderProps): react_jsx_runtime.JSX.Element;
|
|
503
|
+
declare function SearchCardContent({ children, className, }: SearchCardContentProps): react_jsx_runtime.JSX.Element;
|
|
504
|
+
declare function SearchInput({ placeholder, value, onChange, className, }: {
|
|
505
|
+
placeholder: string;
|
|
506
|
+
value: string;
|
|
507
|
+
onChange: (value: string) => void;
|
|
508
|
+
className?: string;
|
|
509
|
+
}): react_jsx_runtime.JSX.Element;
|
|
510
|
+
declare function FilterSelect({ value, onChange, options, placeholder, className, multiple, searchable, }: {
|
|
511
|
+
value: string | string[];
|
|
512
|
+
onChange: (value: string | string[]) => void;
|
|
513
|
+
options: {
|
|
514
|
+
value: string;
|
|
515
|
+
label: string;
|
|
516
|
+
icon?: React.ReactNode;
|
|
517
|
+
}[];
|
|
518
|
+
placeholder: string;
|
|
519
|
+
className?: string;
|
|
520
|
+
multiple?: boolean;
|
|
521
|
+
searchable?: boolean;
|
|
522
|
+
}): react_jsx_runtime.JSX.Element;
|
|
523
|
+
declare function RefreshButton({ onClick, isLoading, className, }: {
|
|
524
|
+
onClick: () => void;
|
|
525
|
+
isLoading?: boolean;
|
|
526
|
+
className?: string;
|
|
527
|
+
}): react_jsx_runtime.JSX.Element;
|
|
528
|
+
declare function FilterToggleButton({ isOpen, onClick, onClear, activeCount, className, }: {
|
|
529
|
+
isOpen: boolean;
|
|
530
|
+
onClick: () => void;
|
|
531
|
+
onClear?: () => void;
|
|
532
|
+
activeCount?: number;
|
|
533
|
+
className?: string;
|
|
534
|
+
}): react_jsx_runtime.JSX.Element;
|
|
535
|
+
declare function MobileSearchLayout({ searchInput, filters, viewControls, activeFilterCount, onClearFilters, className, filterInline, searchButton, }: {
|
|
536
|
+
searchInput: ReactNode;
|
|
537
|
+
filters: ReactNode;
|
|
538
|
+
viewControls?: ReactNode;
|
|
539
|
+
activeFilterCount?: number;
|
|
540
|
+
onClearFilters?: () => void;
|
|
541
|
+
className?: string;
|
|
542
|
+
filterInline?: boolean;
|
|
543
|
+
searchButton?: ReactNode;
|
|
544
|
+
}): react_jsx_runtime.JSX.Element;
|
|
545
|
+
|
|
546
|
+
interface ViewToggleProps {
|
|
547
|
+
currentView: 'cards' | 'list';
|
|
548
|
+
onViewChange: (view: 'cards' | 'list') => void;
|
|
549
|
+
className?: string;
|
|
550
|
+
}
|
|
551
|
+
declare function ViewToggle({ currentView, onViewChange, className, }: ViewToggleProps): react_jsx_runtime.JSX.Element;
|
|
552
|
+
|
|
553
|
+
interface ActionButtonProps {
|
|
554
|
+
icon?: React__default.ComponentType<{
|
|
555
|
+
className?: string;
|
|
556
|
+
}>;
|
|
557
|
+
label?: string;
|
|
558
|
+
onClick?: () => void | Promise<void>;
|
|
559
|
+
href?: string;
|
|
560
|
+
disabled?: boolean;
|
|
561
|
+
loading?: boolean;
|
|
562
|
+
loadingIcon?: React__default.ComponentType<{
|
|
563
|
+
className?: string;
|
|
564
|
+
}>;
|
|
565
|
+
disableLoadingSpin?: boolean;
|
|
566
|
+
size?: 'sm' | 'md' | 'lg';
|
|
567
|
+
iconOnly?: boolean;
|
|
568
|
+
className?: string;
|
|
569
|
+
title?: string;
|
|
570
|
+
tooltipId?: string;
|
|
571
|
+
tooltipPlace?: 'top' | 'bottom' | 'left' | 'right';
|
|
572
|
+
tooltipOffset?: number;
|
|
573
|
+
tooltipDelayShow?: number;
|
|
574
|
+
tooltipDelayHide?: number;
|
|
575
|
+
type?: 'button' | 'submit' | 'reset';
|
|
576
|
+
variant?: 'primary' | 'secondary' | 'danger' | 'success' | 'warning' | 'info' | 'edit' | 'delete' | 'deactivate' | 'activate' | 'view' | 'metrics' | 'start' | 'stop' | 'restart' | 'pause' | 'clone';
|
|
577
|
+
terminalMode?: boolean;
|
|
578
|
+
fill?: boolean;
|
|
579
|
+
[key: string]: any;
|
|
580
|
+
}
|
|
581
|
+
declare function ActionButton({ icon: IconComponent, label, onClick, href, disabled, size, iconOnly, className, title, tooltipId, tooltipPlace, tooltipOffset, tooltipDelayShow, tooltipDelayHide, type, variant, terminalMode, fill, loading: externalLoading, // Extract loading prop to prevent it from being passed to DOM
|
|
582
|
+
loadingIcon: LoadingIconComponent, // Custom loading icon
|
|
583
|
+
disableLoadingSpin, // Disable spin animation for custom loading icons
|
|
584
|
+
...restProps }: ActionButtonProps): react_jsx_runtime.JSX.Element;
|
|
585
|
+
|
|
586
|
+
interface SharedTooltipProps {
|
|
587
|
+
id: string;
|
|
588
|
+
place?: 'top' | 'bottom' | 'left' | 'right';
|
|
589
|
+
offset?: number;
|
|
590
|
+
delayShow?: number;
|
|
591
|
+
delayHide?: number;
|
|
592
|
+
className?: string;
|
|
593
|
+
style?: React__default.CSSProperties;
|
|
594
|
+
children?: React__default.ReactNode;
|
|
595
|
+
}
|
|
596
|
+
declare function SharedTooltip({ id, place, offset, delayShow, delayHide, className, style, children, }: SharedTooltipProps): react_jsx_runtime.JSX.Element;
|
|
597
|
+
|
|
598
|
+
interface SpinnerProps {
|
|
599
|
+
size?: 'sm' | 'md' | 'lg' | 'xl';
|
|
600
|
+
color?: 'primary' | 'blue' | 'white' | 'current';
|
|
601
|
+
className?: string;
|
|
602
|
+
}
|
|
603
|
+
declare const Spinner: React__default.FC<SpinnerProps>;
|
|
604
|
+
|
|
605
|
+
interface IconButtonWithCountProps {
|
|
606
|
+
icon: ReactNode;
|
|
607
|
+
label?: string;
|
|
608
|
+
count?: number;
|
|
609
|
+
onClick: () => void;
|
|
610
|
+
onClear?: () => void;
|
|
611
|
+
showLabel?: boolean;
|
|
612
|
+
className?: string;
|
|
613
|
+
buttonClassName?: string;
|
|
614
|
+
countVariant?: 'primary' | 'secondary' | 'success' | 'warning' | 'error';
|
|
615
|
+
clearVariant?: 'overlay' | 'inline' | 'ghost';
|
|
616
|
+
tooltipId?: string;
|
|
617
|
+
tooltipContent?: string;
|
|
618
|
+
clearTooltipId?: string;
|
|
619
|
+
clearTooltipContent?: string;
|
|
620
|
+
}
|
|
621
|
+
declare function IconButtonWithCount({ icon, label, count, onClick, onClear, showLabel, className, buttonClassName, countVariant, clearVariant, tooltipId, tooltipContent, clearTooltipId, clearTooltipContent, }: IconButtonWithCountProps): react_jsx_runtime.JSX.Element;
|
|
622
|
+
|
|
330
623
|
/**
|
|
331
624
|
* @gamecp/ui - GameCP UI Component Library
|
|
332
625
|
*
|
|
@@ -336,4 +629,4 @@ declare function Typography({ as: Element, variant, size, children, className }:
|
|
|
336
629
|
|
|
337
630
|
declare const VERSION = "0.1.3";
|
|
338
631
|
|
|
339
|
-
export { Badge, type BadgeSize, type BadgeVariant, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, ConfirmDialog, type ConfirmDialogOptions, Container, EmptyState, FormInput, FormSection, Grid, Link, type LinkProps, LoadingSpinner, Modal, PageHeader, Skeleton, SkeletonItem, SmartDropdown, SmartSelect, Switch, Typography, VERSION, useConfirmDialog };
|
|
632
|
+
export { ActionButton, Badge, type BadgeSize, type BadgeVariant, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, ConfirmDialog, type ConfirmDialogOptions, Container, DataTable, DataTableActions, DataTableBody, DataTableCell, DataTableEmptyState, DataTableHeader, DataTableHeaderCell, DataTableLoadingState, DataTableRow, EmptyState, FilterSelect, FilterToggleButton, FormInput, FormSection, Grid, IconButtonWithCount, InfoBox, Link, type LinkProps, LoadingSpinner, MobileSearchLayout, Modal, PageHeader, RefreshButton, SearchCard, SearchCardContent, SearchCardHeader, SearchInput, SharedTooltip, Skeleton, SkeletonCard, SkeletonEnvironmentsList, SkeletonForm, SkeletonGameCard, SkeletonGameServerCard, SkeletonGameServerCards, SkeletonGameServerTable, SkeletonGamesTable, SkeletonItem, SkeletonList, SkeletonNodeCard, SkeletonNodeCards, SkeletonNodeTable, SkeletonRecentActivity, SkeletonSearchCard, SkeletonStats, SkeletonTable, SkeletonTenantCard, SkeletonUserCard, SmartDropdown, SmartSelect, Spinner, StatusBadge, StickyActionsColumn, Switch, Typography, VERSION, ViewToggle, useConfirmDialog };
|
package/dist/index.d.ts
CHANGED
|
@@ -194,6 +194,14 @@ interface GridProps {
|
|
|
194
194
|
}
|
|
195
195
|
declare function Grid({ children, cols, gap, className, }: GridProps): react_jsx_runtime.JSX.Element;
|
|
196
196
|
|
|
197
|
+
interface InfoBoxProps {
|
|
198
|
+
title: string;
|
|
199
|
+
children: React__default.ReactNode;
|
|
200
|
+
variant?: 'default' | 'warning' | 'info' | 'success';
|
|
201
|
+
className?: string;
|
|
202
|
+
}
|
|
203
|
+
declare function InfoBox({ title, children, variant, className }: InfoBoxProps): react_jsx_runtime.JSX.Element;
|
|
204
|
+
|
|
197
205
|
interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
198
206
|
href: string;
|
|
199
207
|
variant?: 'default' | 'primary' | 'muted';
|
|
@@ -312,8 +320,79 @@ interface SkeletonItemProps {
|
|
|
312
320
|
rounded?: boolean;
|
|
313
321
|
animate?: boolean;
|
|
314
322
|
}
|
|
323
|
+
interface SkeletonCardProps {
|
|
324
|
+
className?: string;
|
|
325
|
+
children: ReactNode;
|
|
326
|
+
}
|
|
327
|
+
interface SkeletonTableProps {
|
|
328
|
+
rows?: number;
|
|
329
|
+
columns?: number;
|
|
330
|
+
className?: string;
|
|
331
|
+
showHeader?: boolean;
|
|
332
|
+
}
|
|
333
|
+
interface SkeletonListProps {
|
|
334
|
+
items?: number;
|
|
335
|
+
className?: string;
|
|
336
|
+
itemHeight?: string;
|
|
337
|
+
}
|
|
315
338
|
declare function Skeleton({ className, children }: SkeletonProps): react_jsx_runtime.JSX.Element;
|
|
316
339
|
declare function SkeletonItem({ className, width, height, rounded, animate, }: SkeletonItemProps): react_jsx_runtime.JSX.Element;
|
|
340
|
+
declare function SkeletonCard({ className, children }: SkeletonCardProps): react_jsx_runtime.JSX.Element;
|
|
341
|
+
declare function SkeletonTable({ rows, columns, className, showHeader, }: SkeletonTableProps): react_jsx_runtime.JSX.Element;
|
|
342
|
+
declare function SkeletonList({ items, className, itemHeight, }: SkeletonListProps): react_jsx_runtime.JSX.Element;
|
|
343
|
+
declare function SkeletonSearchCard({ className }: {
|
|
344
|
+
className?: string;
|
|
345
|
+
}): react_jsx_runtime.JSX.Element;
|
|
346
|
+
declare function SkeletonGameServerCard({ className, }: {
|
|
347
|
+
className?: string;
|
|
348
|
+
}): react_jsx_runtime.JSX.Element;
|
|
349
|
+
declare function SkeletonGameCard({ className }: {
|
|
350
|
+
className?: string;
|
|
351
|
+
}): react_jsx_runtime.JSX.Element;
|
|
352
|
+
declare function SkeletonUserCard({ className }: {
|
|
353
|
+
className?: string;
|
|
354
|
+
}): react_jsx_runtime.JSX.Element;
|
|
355
|
+
declare function SkeletonNodeCard({ className }: {
|
|
356
|
+
className?: string;
|
|
357
|
+
}): react_jsx_runtime.JSX.Element;
|
|
358
|
+
declare function SkeletonTenantCard({ className }: {
|
|
359
|
+
className?: string;
|
|
360
|
+
}): react_jsx_runtime.JSX.Element;
|
|
361
|
+
declare function SkeletonStats({ className }: {
|
|
362
|
+
className?: string;
|
|
363
|
+
}): react_jsx_runtime.JSX.Element;
|
|
364
|
+
declare function SkeletonRecentActivity({ items, className, }: {
|
|
365
|
+
items?: number;
|
|
366
|
+
className?: string;
|
|
367
|
+
}): react_jsx_runtime.JSX.Element;
|
|
368
|
+
declare function SkeletonForm({ fields, className, }: {
|
|
369
|
+
fields?: number;
|
|
370
|
+
className?: string;
|
|
371
|
+
}): react_jsx_runtime.JSX.Element;
|
|
372
|
+
declare function SkeletonGameServerCards({ items, className, }: {
|
|
373
|
+
items?: number;
|
|
374
|
+
className?: string;
|
|
375
|
+
}): react_jsx_runtime.JSX.Element;
|
|
376
|
+
declare function SkeletonNodeCards({ items, className, }: {
|
|
377
|
+
items?: number;
|
|
378
|
+
className?: string;
|
|
379
|
+
}): react_jsx_runtime.JSX.Element;
|
|
380
|
+
declare function SkeletonNodeTable({ items, className, }: {
|
|
381
|
+
items?: number;
|
|
382
|
+
className?: string;
|
|
383
|
+
}): react_jsx_runtime.JSX.Element;
|
|
384
|
+
declare function SkeletonGameServerTable({ items, className, }: {
|
|
385
|
+
items?: number;
|
|
386
|
+
className?: string;
|
|
387
|
+
}): react_jsx_runtime.JSX.Element;
|
|
388
|
+
declare function SkeletonGamesTable({ items, className, }: {
|
|
389
|
+
items?: number;
|
|
390
|
+
className?: string;
|
|
391
|
+
}): react_jsx_runtime.JSX.Element;
|
|
392
|
+
declare function SkeletonEnvironmentsList({ items, className, }: {
|
|
393
|
+
items?: number;
|
|
394
|
+
className?: string;
|
|
395
|
+
}): react_jsx_runtime.JSX.Element;
|
|
317
396
|
|
|
318
397
|
type TypographyElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span' | 'div';
|
|
319
398
|
type TypographyVariant = 'default' | 'muted' | 'bold';
|
|
@@ -327,6 +406,220 @@ interface TypographyProps {
|
|
|
327
406
|
}
|
|
328
407
|
declare function Typography({ as: Element, variant, size, children, className }: TypographyProps): react_jsx_runtime.JSX.Element;
|
|
329
408
|
|
|
409
|
+
interface DataTableProps {
|
|
410
|
+
children: ReactNode;
|
|
411
|
+
className?: string;
|
|
412
|
+
containerClassName?: string;
|
|
413
|
+
stickyActions?: boolean;
|
|
414
|
+
}
|
|
415
|
+
interface DataTableHeaderProps {
|
|
416
|
+
children: ReactNode;
|
|
417
|
+
className?: string;
|
|
418
|
+
}
|
|
419
|
+
interface DataTableBodyProps {
|
|
420
|
+
children: ReactNode;
|
|
421
|
+
className?: string;
|
|
422
|
+
}
|
|
423
|
+
interface DataTableRowProps {
|
|
424
|
+
children: ReactNode;
|
|
425
|
+
className?: string;
|
|
426
|
+
onClick?: () => void;
|
|
427
|
+
hover?: boolean;
|
|
428
|
+
}
|
|
429
|
+
interface DataTableCellProps {
|
|
430
|
+
children: ReactNode;
|
|
431
|
+
className?: string;
|
|
432
|
+
align?: 'left' | 'center' | 'right';
|
|
433
|
+
padding?: 'sm' | 'md' | 'lg';
|
|
434
|
+
sticky?: 'left' | 'right';
|
|
435
|
+
stickyOffset?: number;
|
|
436
|
+
}
|
|
437
|
+
interface DataTableHeaderCellProps {
|
|
438
|
+
children: ReactNode;
|
|
439
|
+
className?: string;
|
|
440
|
+
align?: 'left' | 'center' | 'right';
|
|
441
|
+
padding?: 'sm' | 'md' | 'lg';
|
|
442
|
+
sticky?: 'left' | 'right';
|
|
443
|
+
stickyOffset?: number;
|
|
444
|
+
}
|
|
445
|
+
declare function DataTable({ children, className, containerClassName, stickyActions, }: DataTableProps): react_jsx_runtime.JSX.Element;
|
|
446
|
+
declare function DataTableHeader({ children, className, }: DataTableHeaderProps): react_jsx_runtime.JSX.Element;
|
|
447
|
+
declare function DataTableBody({ children, className, }: DataTableBodyProps): react_jsx_runtime.JSX.Element;
|
|
448
|
+
declare function DataTableRow({ children, className, onClick, hover, }: DataTableRowProps): react_jsx_runtime.JSX.Element;
|
|
449
|
+
declare function DataTableHeaderCell({ children, className, align, padding, sticky, stickyOffset, }: DataTableHeaderCellProps): react_jsx_runtime.JSX.Element;
|
|
450
|
+
declare function DataTableCell({ children, className, align, padding, sticky, stickyOffset, }: DataTableCellProps): react_jsx_runtime.JSX.Element;
|
|
451
|
+
declare function DataTableEmptyState({ icon: Icon, title, description, action, variant, }: {
|
|
452
|
+
icon: React.ComponentType<{
|
|
453
|
+
className?: string;
|
|
454
|
+
}>;
|
|
455
|
+
title: string;
|
|
456
|
+
description: string;
|
|
457
|
+
action?: ReactNode;
|
|
458
|
+
variant?: 'table' | 'div';
|
|
459
|
+
}): react_jsx_runtime.JSX.Element;
|
|
460
|
+
declare function DataTableLoadingState({ message, rows, columns, }: {
|
|
461
|
+
message?: string;
|
|
462
|
+
rows?: number;
|
|
463
|
+
columns?: number;
|
|
464
|
+
}): react_jsx_runtime.JSX.Element;
|
|
465
|
+
declare function StatusBadge({ status, variant, }: {
|
|
466
|
+
status: string;
|
|
467
|
+
variant?: 'default' | 'success' | 'warning' | 'error' | 'info';
|
|
468
|
+
}): react_jsx_runtime.JSX.Element;
|
|
469
|
+
declare function DataTableActions({ children, className, enhanced, }: {
|
|
470
|
+
children: ReactNode;
|
|
471
|
+
className?: string;
|
|
472
|
+
enhanced?: boolean;
|
|
473
|
+
}): react_jsx_runtime.JSX.Element;
|
|
474
|
+
declare function StickyActionsColumn({ children, className, }: {
|
|
475
|
+
children: ReactNode;
|
|
476
|
+
className?: string;
|
|
477
|
+
}): react_jsx_runtime.JSX.Element;
|
|
478
|
+
|
|
479
|
+
interface SearchCardProps {
|
|
480
|
+
title: string;
|
|
481
|
+
count: number;
|
|
482
|
+
total: number;
|
|
483
|
+
actionButton?: ReactNode;
|
|
484
|
+
children: ReactNode;
|
|
485
|
+
className?: string;
|
|
486
|
+
icon?: IconType;
|
|
487
|
+
description?: string;
|
|
488
|
+
}
|
|
489
|
+
interface SearchCardHeaderProps {
|
|
490
|
+
title: string;
|
|
491
|
+
count: number;
|
|
492
|
+
total: number;
|
|
493
|
+
actionButton?: ReactNode;
|
|
494
|
+
icon?: IconType;
|
|
495
|
+
description?: string;
|
|
496
|
+
}
|
|
497
|
+
interface SearchCardContentProps {
|
|
498
|
+
children: ReactNode;
|
|
499
|
+
className?: string;
|
|
500
|
+
}
|
|
501
|
+
declare function SearchCard({ title, count, total, actionButton, children, className, icon: Icon, description, }: SearchCardProps): react_jsx_runtime.JSX.Element;
|
|
502
|
+
declare function SearchCardHeader({ title, count, total, actionButton, icon: Icon, description, }: SearchCardHeaderProps): react_jsx_runtime.JSX.Element;
|
|
503
|
+
declare function SearchCardContent({ children, className, }: SearchCardContentProps): react_jsx_runtime.JSX.Element;
|
|
504
|
+
declare function SearchInput({ placeholder, value, onChange, className, }: {
|
|
505
|
+
placeholder: string;
|
|
506
|
+
value: string;
|
|
507
|
+
onChange: (value: string) => void;
|
|
508
|
+
className?: string;
|
|
509
|
+
}): react_jsx_runtime.JSX.Element;
|
|
510
|
+
declare function FilterSelect({ value, onChange, options, placeholder, className, multiple, searchable, }: {
|
|
511
|
+
value: string | string[];
|
|
512
|
+
onChange: (value: string | string[]) => void;
|
|
513
|
+
options: {
|
|
514
|
+
value: string;
|
|
515
|
+
label: string;
|
|
516
|
+
icon?: React.ReactNode;
|
|
517
|
+
}[];
|
|
518
|
+
placeholder: string;
|
|
519
|
+
className?: string;
|
|
520
|
+
multiple?: boolean;
|
|
521
|
+
searchable?: boolean;
|
|
522
|
+
}): react_jsx_runtime.JSX.Element;
|
|
523
|
+
declare function RefreshButton({ onClick, isLoading, className, }: {
|
|
524
|
+
onClick: () => void;
|
|
525
|
+
isLoading?: boolean;
|
|
526
|
+
className?: string;
|
|
527
|
+
}): react_jsx_runtime.JSX.Element;
|
|
528
|
+
declare function FilterToggleButton({ isOpen, onClick, onClear, activeCount, className, }: {
|
|
529
|
+
isOpen: boolean;
|
|
530
|
+
onClick: () => void;
|
|
531
|
+
onClear?: () => void;
|
|
532
|
+
activeCount?: number;
|
|
533
|
+
className?: string;
|
|
534
|
+
}): react_jsx_runtime.JSX.Element;
|
|
535
|
+
declare function MobileSearchLayout({ searchInput, filters, viewControls, activeFilterCount, onClearFilters, className, filterInline, searchButton, }: {
|
|
536
|
+
searchInput: ReactNode;
|
|
537
|
+
filters: ReactNode;
|
|
538
|
+
viewControls?: ReactNode;
|
|
539
|
+
activeFilterCount?: number;
|
|
540
|
+
onClearFilters?: () => void;
|
|
541
|
+
className?: string;
|
|
542
|
+
filterInline?: boolean;
|
|
543
|
+
searchButton?: ReactNode;
|
|
544
|
+
}): react_jsx_runtime.JSX.Element;
|
|
545
|
+
|
|
546
|
+
interface ViewToggleProps {
|
|
547
|
+
currentView: 'cards' | 'list';
|
|
548
|
+
onViewChange: (view: 'cards' | 'list') => void;
|
|
549
|
+
className?: string;
|
|
550
|
+
}
|
|
551
|
+
declare function ViewToggle({ currentView, onViewChange, className, }: ViewToggleProps): react_jsx_runtime.JSX.Element;
|
|
552
|
+
|
|
553
|
+
interface ActionButtonProps {
|
|
554
|
+
icon?: React__default.ComponentType<{
|
|
555
|
+
className?: string;
|
|
556
|
+
}>;
|
|
557
|
+
label?: string;
|
|
558
|
+
onClick?: () => void | Promise<void>;
|
|
559
|
+
href?: string;
|
|
560
|
+
disabled?: boolean;
|
|
561
|
+
loading?: boolean;
|
|
562
|
+
loadingIcon?: React__default.ComponentType<{
|
|
563
|
+
className?: string;
|
|
564
|
+
}>;
|
|
565
|
+
disableLoadingSpin?: boolean;
|
|
566
|
+
size?: 'sm' | 'md' | 'lg';
|
|
567
|
+
iconOnly?: boolean;
|
|
568
|
+
className?: string;
|
|
569
|
+
title?: string;
|
|
570
|
+
tooltipId?: string;
|
|
571
|
+
tooltipPlace?: 'top' | 'bottom' | 'left' | 'right';
|
|
572
|
+
tooltipOffset?: number;
|
|
573
|
+
tooltipDelayShow?: number;
|
|
574
|
+
tooltipDelayHide?: number;
|
|
575
|
+
type?: 'button' | 'submit' | 'reset';
|
|
576
|
+
variant?: 'primary' | 'secondary' | 'danger' | 'success' | 'warning' | 'info' | 'edit' | 'delete' | 'deactivate' | 'activate' | 'view' | 'metrics' | 'start' | 'stop' | 'restart' | 'pause' | 'clone';
|
|
577
|
+
terminalMode?: boolean;
|
|
578
|
+
fill?: boolean;
|
|
579
|
+
[key: string]: any;
|
|
580
|
+
}
|
|
581
|
+
declare function ActionButton({ icon: IconComponent, label, onClick, href, disabled, size, iconOnly, className, title, tooltipId, tooltipPlace, tooltipOffset, tooltipDelayShow, tooltipDelayHide, type, variant, terminalMode, fill, loading: externalLoading, // Extract loading prop to prevent it from being passed to DOM
|
|
582
|
+
loadingIcon: LoadingIconComponent, // Custom loading icon
|
|
583
|
+
disableLoadingSpin, // Disable spin animation for custom loading icons
|
|
584
|
+
...restProps }: ActionButtonProps): react_jsx_runtime.JSX.Element;
|
|
585
|
+
|
|
586
|
+
interface SharedTooltipProps {
|
|
587
|
+
id: string;
|
|
588
|
+
place?: 'top' | 'bottom' | 'left' | 'right';
|
|
589
|
+
offset?: number;
|
|
590
|
+
delayShow?: number;
|
|
591
|
+
delayHide?: number;
|
|
592
|
+
className?: string;
|
|
593
|
+
style?: React__default.CSSProperties;
|
|
594
|
+
children?: React__default.ReactNode;
|
|
595
|
+
}
|
|
596
|
+
declare function SharedTooltip({ id, place, offset, delayShow, delayHide, className, style, children, }: SharedTooltipProps): react_jsx_runtime.JSX.Element;
|
|
597
|
+
|
|
598
|
+
interface SpinnerProps {
|
|
599
|
+
size?: 'sm' | 'md' | 'lg' | 'xl';
|
|
600
|
+
color?: 'primary' | 'blue' | 'white' | 'current';
|
|
601
|
+
className?: string;
|
|
602
|
+
}
|
|
603
|
+
declare const Spinner: React__default.FC<SpinnerProps>;
|
|
604
|
+
|
|
605
|
+
interface IconButtonWithCountProps {
|
|
606
|
+
icon: ReactNode;
|
|
607
|
+
label?: string;
|
|
608
|
+
count?: number;
|
|
609
|
+
onClick: () => void;
|
|
610
|
+
onClear?: () => void;
|
|
611
|
+
showLabel?: boolean;
|
|
612
|
+
className?: string;
|
|
613
|
+
buttonClassName?: string;
|
|
614
|
+
countVariant?: 'primary' | 'secondary' | 'success' | 'warning' | 'error';
|
|
615
|
+
clearVariant?: 'overlay' | 'inline' | 'ghost';
|
|
616
|
+
tooltipId?: string;
|
|
617
|
+
tooltipContent?: string;
|
|
618
|
+
clearTooltipId?: string;
|
|
619
|
+
clearTooltipContent?: string;
|
|
620
|
+
}
|
|
621
|
+
declare function IconButtonWithCount({ icon, label, count, onClick, onClear, showLabel, className, buttonClassName, countVariant, clearVariant, tooltipId, tooltipContent, clearTooltipId, clearTooltipContent, }: IconButtonWithCountProps): react_jsx_runtime.JSX.Element;
|
|
622
|
+
|
|
330
623
|
/**
|
|
331
624
|
* @gamecp/ui - GameCP UI Component Library
|
|
332
625
|
*
|
|
@@ -336,4 +629,4 @@ declare function Typography({ as: Element, variant, size, children, className }:
|
|
|
336
629
|
|
|
337
630
|
declare const VERSION = "0.1.3";
|
|
338
631
|
|
|
339
|
-
export { Badge, type BadgeSize, type BadgeVariant, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, ConfirmDialog, type ConfirmDialogOptions, Container, EmptyState, FormInput, FormSection, Grid, Link, type LinkProps, LoadingSpinner, Modal, PageHeader, Skeleton, SkeletonItem, SmartDropdown, SmartSelect, Switch, Typography, VERSION, useConfirmDialog };
|
|
632
|
+
export { ActionButton, Badge, type BadgeSize, type BadgeVariant, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, ConfirmDialog, type ConfirmDialogOptions, Container, DataTable, DataTableActions, DataTableBody, DataTableCell, DataTableEmptyState, DataTableHeader, DataTableHeaderCell, DataTableLoadingState, DataTableRow, EmptyState, FilterSelect, FilterToggleButton, FormInput, FormSection, Grid, IconButtonWithCount, InfoBox, Link, type LinkProps, LoadingSpinner, MobileSearchLayout, Modal, PageHeader, RefreshButton, SearchCard, SearchCardContent, SearchCardHeader, SearchInput, SharedTooltip, Skeleton, SkeletonCard, SkeletonEnvironmentsList, SkeletonForm, SkeletonGameCard, SkeletonGameServerCard, SkeletonGameServerCards, SkeletonGameServerTable, SkeletonGamesTable, SkeletonItem, SkeletonList, SkeletonNodeCard, SkeletonNodeCards, SkeletonNodeTable, SkeletonRecentActivity, SkeletonSearchCard, SkeletonStats, SkeletonTable, SkeletonTenantCard, SkeletonUserCard, SmartDropdown, SmartSelect, Spinner, StatusBadge, StickyActionsColumn, Switch, Typography, VERSION, ViewToggle, useConfirmDialog };
|