@catalystsoftware/ui 1.0.5 → 1.0.6

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.
Files changed (155) hide show
  1. package/dist/data/data.tsx +29 -29
  2. package/dist/data/tailwind.config.js +3821 -261
  3. package/dist/data.tsx +29 -29
  4. package/package.json +4 -3
  5. package/components/catalyst-ui/buttons/burger.tsx +0 -207
  6. package/components/catalyst-ui/core/data-display/timeline.tsx +0 -210
  7. package/components/catalyst-ui/core/feedback/alert.tsx +0 -491
  8. package/components/catalyst-ui/core/feedback/spinner-1.tsx +0 -65
  9. package/components/catalyst-ui/core/feedback/toast.tsx +0 -1857
  10. package/components/catalyst-ui/core/navigation/menu.tsx +0 -164
  11. package/components/catalyst-ui/forms/toggle-class.tsx +0 -176
  12. package/components/catalyst-ui/hooks/use-copy-to-clipboard.tsx +0 -419
  13. package/components/catalyst-ui/hooks/use-counter.tsx +0 -13
  14. package/components/catalyst-ui/hooks/use-event-listener.tsx +0 -23
  15. package/components/catalyst-ui/hooks/use-export-markdown.tsx +0 -47
  16. package/components/catalyst-ui/hooks/use-focus.tsx +0 -17
  17. package/components/catalyst-ui/hooks/use-interval.tsx +0 -23
  18. package/components/catalyst-ui/hooks/use-is-client.tsx +0 -16
  19. package/components/catalyst-ui/hooks/use-media-query.tsx +0 -19
  20. package/components/catalyst-ui/hooks/use-mobile.tsx +0 -19
  21. package/components/catalyst-ui/hooks/use-resize-observer.tsx +0 -81
  22. package/components/catalyst-ui/hooks/use-timeout.tsx +0 -21
  23. package/components/catalyst-ui/hooks/use-timer.tsx +0 -209
  24. package/components/catalyst-ui/hooks/use-toggle.tsx +0 -12
  25. package/components/catalyst-ui/media/image.tsx +0 -13
  26. package/components/catalyst-ui/overlays/dual-sidebar.tsx +0 -4142
  27. package/components/catalyst-ui/overlays/sidebar-original.tsx +0 -726
  28. package/components/catalyst-ui/primitives/accordion.tsx +0 -250
  29. package/components/catalyst-ui/primitives/alert-dialog.tsx +0 -126
  30. package/components/catalyst-ui/primitives/aspect-ratio.tsx +0 -9
  31. package/components/catalyst-ui/primitives/avatar.tsx +0 -296
  32. package/components/catalyst-ui/primitives/badge.tsx +0 -57
  33. package/components/catalyst-ui/primitives/breadcrumb.tsx +0 -101
  34. package/components/catalyst-ui/primitives/button.tsx +0 -265
  35. package/components/catalyst-ui/primitives/calendar-v4.tsx +0 -208
  36. package/components/catalyst-ui/primitives/calendar.tsx +0 -295
  37. package/components/catalyst-ui/primitives/card.tsx +0 -618
  38. package/components/catalyst-ui/primitives/carousel.tsx +0 -238
  39. package/components/catalyst-ui/primitives/chart.tsx +0 -347
  40. package/components/catalyst-ui/primitives/checkbox.tsx +0 -225
  41. package/components/catalyst-ui/primitives/collapsible.tsx +0 -212
  42. package/components/catalyst-ui/primitives/command.tsx +0 -393
  43. package/components/catalyst-ui/primitives/context-menu.tsx +0 -236
  44. package/components/catalyst-ui/primitives/dialog.tsx +0 -471
  45. package/components/catalyst-ui/primitives/drawer.tsx +0 -761
  46. package/components/catalyst-ui/primitives/dropdown-menu.tsx +0 -290
  47. package/components/catalyst-ui/primitives/empty.tsx +0 -104
  48. package/components/catalyst-ui/primitives/field.tsx +0 -244
  49. package/components/catalyst-ui/primitives/hover-card.tsx +0 -124
  50. package/components/catalyst-ui/primitives/input-otp.tsx +0 -76
  51. package/components/catalyst-ui/primitives/input.tsx +0 -64
  52. package/components/catalyst-ui/primitives/item.tsx +0 -196
  53. package/components/catalyst-ui/primitives/kbd.tsx +0 -75
  54. package/components/catalyst-ui/primitives/label.tsx +0 -24
  55. package/components/catalyst-ui/primitives/navigation-menu.tsx +0 -150
  56. package/components/catalyst-ui/primitives/pagination.tsx +0 -198
  57. package/components/catalyst-ui/primitives/popover.tsx +0 -232
  58. package/components/catalyst-ui/primitives/progress.tsx +0 -34
  59. package/components/catalyst-ui/primitives/radio-group.tsx +0 -43
  60. package/components/catalyst-ui/primitives/resizable.tsx +0 -56
  61. package/components/catalyst-ui/primitives/select.tsx +0 -155
  62. package/components/catalyst-ui/primitives/separator.tsx +0 -74
  63. package/components/catalyst-ui/primitives/sheet.tsx +0 -126
  64. package/components/catalyst-ui/primitives/skeleton.tsx +0 -15
  65. package/components/catalyst-ui/primitives/slider.tsx +0 -27
  66. package/components/catalyst-ui/primitives/switch.tsx +0 -187
  67. package/components/catalyst-ui/primitives/tabs.tsx +0 -335
  68. package/components/catalyst-ui/primitives/textarea.tsx +0 -24
  69. package/components/catalyst-ui/primitives/toggle-group.tsx +0 -55
  70. package/components/catalyst-ui/primitives/toggle.tsx +0 -42
  71. package/components/catalyst-ui/primitives/tooltip.tsx +0 -116
  72. package/components/catalyst-ui/utils/basic-auth.tsx +0 -40
  73. package/components/catalyst-ui/utils/context-storage.tsx +0 -19
  74. package/components/catalyst-ui/utils/cors-middleware.tsx +0 -71
  75. package/components/catalyst-ui/utils/deferred-content.tsx +0 -595
  76. package/components/catalyst-ui/utils/honeypot-middleware.tsx +0 -38
  77. package/components/catalyst-ui/utils/incId.tsx +0 -75
  78. package/components/catalyst-ui/utils/jwk-auth.tsx +0 -36
  79. package/components/catalyst-ui/utils/request-id.tsx +0 -14
  80. package/components/catalyst-ui/utils/secure-headers.tsx +0 -37
  81. package/components/catalyst-ui/utils/server-timing.tsx +0 -23
  82. package/components/catalyst-ui/utils/utils.ts +0 -43
  83. package/components/catalyst-ui/utils/with-cookie.tsx +0 -43
  84. package/components/catalyst-ui/x/accordian-x.tsx +0 -428
  85. package/components/catalyst-ui/x/alert-x.tsx +0 -413
  86. package/components/catalyst-ui/x/animated-text-x.tsx +0 -2242
  87. package/components/catalyst-ui/x/avatar-x.tsx +0 -515
  88. package/components/catalyst-ui/x/badge-x.tsx +0 -670
  89. package/components/catalyst-ui/x/button-X.tsx +0 -2857
  90. package/components/catalyst-ui/x/button-group-x.tsx +0 -847
  91. package/components/catalyst-ui/x/calendar-x.tsx +0 -1910
  92. package/components/catalyst-ui/x/card-x.tsx +0 -2597
  93. package/components/catalyst-ui/x/checkbox-x.tsx +0 -656
  94. package/components/catalyst-ui/x/collapsible-x.tsx +0 -1360
  95. package/components/catalyst-ui/x/combobox-x.tsx +0 -911
  96. package/components/catalyst-ui/x/data-table-x.tsx +0 -1753
  97. package/components/catalyst-ui/x/date-picker-x.tsx +0 -648
  98. package/components/catalyst-ui/x/dialog-x.tsx +0 -659
  99. package/components/catalyst-ui/x/dropdown-menu-x.tsx +0 -612
  100. package/components/catalyst-ui/x/hover-card-x.tsx +0 -375
  101. package/components/catalyst-ui/x/icon-x.tsx +0 -840
  102. package/components/catalyst-ui/x/input-mask-x.tsx +0 -981
  103. package/components/catalyst-ui/x/input-otp-x.tsx +0 -659
  104. package/components/catalyst-ui/x/loader-x.tsx +0 -1757
  105. package/components/catalyst-ui/x/pagination-x.tsx +0 -622
  106. package/components/catalyst-ui/x/popover-x.tsx +0 -744
  107. package/components/catalyst-ui/x/radio-group-x.tsx +0 -499
  108. package/components/catalyst-ui/x/select-x.tsx +0 -1127
  109. package/components/catalyst-ui/x/sheet-x.tsx +0 -668
  110. package/components/catalyst-ui/x/switch-x.tsx +0 -681
  111. package/components/catalyst-ui/x/table-x.tsx +0 -574
  112. package/components/catalyst-ui/x/tabs-x.tsx +0 -839
  113. package/components/catalyst-ui/x/textarea-x.tsx +0 -1263
  114. package/components/catalyst-ui/x/tooltip-x.tsx +0 -396
  115. package/components/catalyst-ui/x/tracker-x.tsx +0 -560
  116. package/data/bg-data.tsx +0 -901
  117. package/data/buttons-data.tsx +0 -2327
  118. package/data/charts-data.tsx +0 -102
  119. package/data/chat-data.tsx +0 -83
  120. package/data/code-data.tsx +0 -1040
  121. package/data/comboboxes-data.tsx +0 -1843
  122. package/data/command-data.tsx +0 -1381
  123. package/data/core-data.tsx +0 -15953
  124. package/data/crm-data.tsx +0 -47
  125. package/data/data.tsx +0 -159
  126. package/data/date-and-time-data.tsx +0 -554
  127. package/data/dependencies.tsx +0 -7
  128. package/data/ecommerce-data.tsx +0 -1387
  129. package/data/forms-data.tsx +0 -7890
  130. package/data/hooks-data.tsx +0 -5487
  131. package/data/index.ts +0 -34
  132. package/data/inputs-data.tsx +0 -557
  133. package/data/interactive-data.tsx +0 -5394
  134. package/data/lofi-data.tsx +0 -18295
  135. package/data/marketing-data.tsx +0 -2546
  136. package/data/media-data.tsx +0 -1510
  137. package/data/motion-data.tsx +0 -5801
  138. package/data/overlay-data.tsx +0 -4136
  139. package/data/pdf-data.tsx +0 -124
  140. package/data/pos-data.tsx +0 -213
  141. package/data/postcss.config.js +0 -6
  142. package/data/primitive-data.tsx +0 -5170
  143. package/data/prompt-data.tsx +0 -1226
  144. package/data/requiredLibs.ts +0 -4
  145. package/data/sandbox-data.tsx +0 -1
  146. package/data/sidebars-data.tsx +0 -5421
  147. package/data/stacks-data.tsx +0 -32
  148. package/data/table-data.tsx +0 -706
  149. package/data/tailwind.config.js +0 -270
  150. package/data/tailwind.config.ngin.js +0 -3830
  151. package/data/tailwind.css +0 -431
  152. package/data/tools-data.tsx +0 -6910
  153. package/data/typography-data.tsx +0 -2050
  154. package/data/utils-data.tsx +0 -6500
  155. package/data/x-data.tsx +0 -1171
@@ -1,124 +0,0 @@
1
- import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
2
- import { cva, type VariantProps } from "class-variance-authority";
3
- import { cn } from "~/components/catalyst-ui";
4
- import React from "react";
5
-
6
- const hoverCardContentVariants = cva(
7
- "z-50 w-64 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none 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",
8
- {
9
- variants: {
10
- variant: {
11
- default: "bg-popover text-popover-foreground",
12
- light: "bg-neutral-200 text-neutral-950 dark:bg-neutral-50",
13
- error: "bg-destructive text-white border-destructive",
14
- dark: "bg-neutral-900 text-white dark:bg-neutral-950 border-neutral-800",
15
- },
16
- rounded: {
17
- default: "rounded-md",
18
- full: "rounded-full",
19
- none: "rounded-none",
20
- },
21
- arrow: {
22
- true: "",
23
- false: "[&_svg]:invisible",
24
- },
25
- },
26
- defaultVariants: {
27
- variant: "default",
28
- rounded: "default",
29
- arrow: true,
30
- },
31
- }
32
- );
33
-
34
- type HoverCardVariantContextValue = VariantProps<typeof hoverCardContentVariants>;
35
-
36
- const HoverCardVariantContext = React.createContext<HoverCardVariantContextValue>({});
37
-
38
- const HoverCard = ({
39
- children,
40
- variant,
41
- rounded,
42
- arrow,
43
- sideOffset = 4,
44
- align = "center",
45
- ...props
46
- }: HoverCardPrimitive.HoverCardProps & HoverCardVariantContextValue) => {
47
- return (
48
- <HoverCardVariantContext.Provider value={{ variant, rounded, arrow, align, sideOffset }}>
49
- <HoverCardPrimitive.Root {...props}>
50
- {children}
51
- </HoverCardPrimitive.Root>
52
- </HoverCardVariantContext.Provider>
53
- );
54
- };
55
-
56
- const HoverCardTrigger = HoverCardPrimitive.Trigger;
57
-
58
-
59
-
60
-
61
-
62
-
63
-
64
-
65
-
66
- const HoverCardContent = React.forwardRef<
67
- React.ElementRef<typeof HoverCardPrimitive.Content>,
68
- React.ComponentPropsWithoutRef<typeof HoverCardPrimitive.Content>
69
- >(({ className, ...props }, ref) => {
70
- const { variant, rounded, arrow, align, sideOffset } = React.useContext(HoverCardVariantContext);
71
-
72
- return (
73
- <HoverCardPrimitive.Content
74
- ref={ref}
75
- align={align}
76
- sideOffset={sideOffset}
77
- className={cn(
78
- hoverCardContentVariants({ variant, rounded, arrow }),
79
- className
80
- )}
81
- {...props}
82
- />
83
- );
84
- });
85
- HoverCardContent.displayName = HoverCardPrimitive.Content.displayName;
86
-
87
- export {
88
- HoverCard,
89
- HoverCardTrigger,
90
- HoverCardContent,
91
- hoverCardContentVariants,
92
- };
93
-
94
-
95
- /**
96
- import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
97
- import { cn } from "~/components/catalyst-ui";
98
- import React from "react";
99
-
100
- // @dev app/components/catalyst-ui/data/primitive-data.tsx:4355
101
- const HoverCard = HoverCardPrimitive.Root;
102
- const HoverCardTrigger = HoverCardPrimitive.Trigger;
103
-
104
- const HoverCardContent = React.forwardRef<
105
- React.ElementRef<typeof HoverCardPrimitive.Content>,
106
- React.ComponentPropsWithoutRef<typeof HoverCardPrimitive.Content>
107
- >(({ className, align = "center", sideOffset = 4, ...props }, ref) => (
108
- <HoverCardPrimitive.Content
109
- ref={ref}
110
- align={align}
111
- sideOffset={sideOffset}
112
- className={cn(
113
- "z-50 w-64 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none 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",
114
- className
115
- )}
116
- {...props}
117
- />
118
- ));
119
- HoverCardContent.displayName = HoverCardPrimitive.Content.displayName;
120
-
121
- export {
122
- HoverCard, HoverCardTrigger, HoverCardContent,
123
-
124
- } */
@@ -1,76 +0,0 @@
1
- import { OTPInput, OTPInputContext } from "input-otp";
2
- import { Dot, Minus } from "lucide-react";
3
- import { cn } from "~/components/catalyst-ui";
4
- import React from "react";
5
-
6
- // @dev app/components/catalyst-ui/data/primitive-data.tsx:1207
7
-
8
- const InputOTP = React.forwardRef<
9
- React.ElementRef<typeof OTPInput>,
10
- React.ComponentPropsWithoutRef<typeof OTPInput>
11
- >(({ className, containerClassName, ...props }, ref) => (
12
- <OTPInput
13
- ref={ref}
14
- containerClassName={cn(
15
- "flex items-center gap-2 has-[:disabled]:opacity-50",
16
- containerClassName
17
- )}
18
- className={cn("disabled:cursor-not-allowed", className)}
19
- {...props}
20
- />
21
- ));
22
- InputOTP.displayName = "InputOTP";
23
-
24
- const InputOTPGroup = React.forwardRef<
25
- React.ElementRef<"div">,
26
- React.ComponentPropsWithoutRef<"div">
27
- >(({ className, ...props }, ref) => (
28
- <div ref={ref} className={cn("flex items-center", className)} {...props} />
29
- ));
30
- InputOTPGroup.displayName = "InputOTPGroup";
31
-
32
- const InputOTPSlot = React.forwardRef<
33
- React.ElementRef<"div">,
34
- React.ComponentPropsWithoutRef<"div"> & { index: number }
35
- >(({ index, className, ...props }, ref) => {
36
- const inputOTPContext = React.useContext(OTPInputContext);
37
- const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index];
38
-
39
- return (
40
- <div
41
- ref={ref}
42
- className={cn(
43
- "relative flex h-10 w-10 items-center justify-center border-y border-r border-input text-sm transition-all first:rounded-l-md first:border-l last:rounded-r-md",
44
- isActive && "z-10 ring-2 ring-ring ring-offset-background",
45
- className
46
- )}
47
- {...props}
48
- >
49
- {char}
50
- {hasFakeCaret && (
51
- <div className="pointer-events-none absolute inset-0 flex items-center justify-center">
52
- <div className="h-4 w-px animate-caret-blink bg-foreground duration-1000" />
53
- </div>
54
- )}
55
- </div>
56
- );
57
- });
58
- InputOTPSlot.displayName = "InputOTPSlot";
59
-
60
- const InputOTPSeparator = React.forwardRef<
61
- React.ElementRef<"div">,
62
- React.ComponentPropsWithoutRef<"div">
63
- >(({ ...props }, ref) => (
64
- <div ref={ref} role="separator" {...props}>
65
- <Dot />
66
- </div>
67
- ));
68
- InputOTPSeparator.displayName = "InputOTPSeparator";
69
-
70
-
71
- export {
72
- InputOTP,
73
- InputOTPGroup,
74
- InputOTPSlot,
75
- InputOTPSeparator,
76
- }
@@ -1,64 +0,0 @@
1
- import { cn } from '~/components/catalyst-ui'
2
- import React, { createContext, useContext } from 'react'
3
- import { cva, type VariantProps } from 'class-variance-authority'
4
-
5
- export const inputVariants = cva(
6
- 'flex w-full rounded-md border bg-background text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50',
7
- {
8
- variants: {
9
- variant: {
10
- default: 'border-input focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus:bg-background focus:text-foreground',
11
- filled: 'bg-muted border-transparent shadow-none',
12
- ghost: 'border-transparent shadow-none hover:bg-accent hover:text-accent-foreground',
13
- },
14
- size: {
15
- sm: 'h-8 px-3 py-1',
16
- default: 'h-10 px-3 py-2',
17
- lg: 'h-12 px-4 py-3',
18
- },
19
- rounded: {
20
- none: 'rounded-none',
21
- sm: 'rounded-sm',
22
- default: 'rounded-md',
23
- lg: 'rounded-lg',
24
- full: 'rounded-full',
25
- },
26
- state: {
27
- default: '',
28
- error: 'border-destructive focus-visible:ring-destructive',
29
- success: 'border-green-500 focus-visible:ring-green-500',
30
- warning: 'border-amber-500 focus-visible:ring-amber-500',
31
- disabled: 'cursor-not-allowed opacity-50',
32
- readOnly: 'read-only:bg-muted',
33
- },
34
- },
35
- defaultVariants: {
36
- variant: 'default',
37
- size: 'default',
38
- rounded: 'default',
39
- state: 'default',
40
- disabled: false,
41
- readOnly: false,
42
- },
43
- }
44
- )
45
-
46
- // @dev app/components/catalyst-ui/data/primitive-data.tsx:3859
47
- export interface InputProps
48
- extends React.InputHTMLAttributes<HTMLInputElement> { }
49
-
50
- const Input = React.forwardRef<HTMLInputElement, InputProps>(
51
- ({ className, type, variant, size, rounded, state, disabled, readOnly, ...props }, ref) => {
52
- return (
53
- <input
54
- type={type}
55
- className={cn(inputVariants({ variant, size, rounded, state, disabled, readOnly }), className)}
56
- ref={ref}
57
- {...props}
58
- />
59
- )
60
- }
61
- )
62
- Input.displayName = 'Input'
63
-
64
- export { Input, type InputProps }
@@ -1,196 +0,0 @@
1
- import * as React from "react";
2
- import { Slot, } from "@radix-ui/react-slot";
3
- import { cva, type VariantProps, } from "class-variance-authority";
4
-
5
- import { cn, } from "~/components/catalyst-ui";
6
- import { Separator, } from "~/components/catalyst-ui";
7
-
8
- // @dev app/components/catalyst-ui/data/primitive-data.tsx:170
9
-
10
-
11
- function ItemGroup({ className, ...props }: React.ComponentProps<"div">) {
12
- return (
13
- <div
14
- role="list"
15
- data-slot="item-group"
16
- className={cn("group/item-group flex flex-col", className)}
17
- {...props}
18
- />
19
- )
20
- }
21
-
22
- function ItemSeparator({
23
- className,
24
- ...props
25
- }: React.ComponentProps<typeof Separator>) {
26
- return (
27
- <Separator
28
- data-slot="item-separator"
29
- orientation="horizontal"
30
- className={cn("my-0", className)}
31
- {...props}
32
- />
33
- )
34
- }
35
-
36
- const itemVariants = cva(
37
- "group/item flex items-center border border-transparent text-sm rounded-md transition-colors [a]:hover:bg-accent/50 [a]:transition-colors duration-100 flex-wrap outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
38
- {
39
- variants: {
40
- variant: {
41
- default: "bg-transparent",
42
- outline: "border-border",
43
- muted: "bg-muted/50",
44
- },
45
- size: {
46
- default: "p-4 gap-4 ",
47
- sm: "py-3 px-4 gap-2.5",
48
- },
49
- },
50
- defaultVariants: {
51
- variant: "default",
52
- size: "default",
53
- },
54
- }
55
- )
56
-
57
- function Item({
58
- className,
59
- variant = "default",
60
- size = "default",
61
- asChild = false,
62
- ...props
63
- }: React.ComponentProps<"div"> &
64
- VariantProps<typeof itemVariants> & { asChild?: boolean }) {
65
- const Comp = asChild ? Slot : "div"
66
- return (
67
- <Comp
68
- data-slot="item"
69
- data-variant={variant}
70
- data-size={size}
71
- className={cn(itemVariants({ variant, size, className }))}
72
- {...props}
73
- />
74
- )
75
- }
76
-
77
- const itemMediaVariants = cva(
78
- "flex shrink-0 items-center justify-center gap-2 group-has-[[data-slot=item-description]]/item:self-start [&_svg]:pointer-events-none group-has-[[data-slot=item-description]]/item:translate-y-0.5",
79
- {
80
- variants: {
81
- variant: {
82
- default: "bg-transparent",
83
- icon: "size-8 border rounded-sm bg-muted [&_svg:not([class*='size-'])]:size-4",
84
- image:
85
- "size-10 rounded-sm overflow-hidden [&_img]:size-full [&_img]:object-cover",
86
- },
87
- },
88
- defaultVariants: {
89
- variant: "default",
90
- },
91
- }
92
- )
93
-
94
- function ItemMedia({
95
- className,
96
- variant = "default",
97
- ...props
98
- }: React.ComponentProps<"div"> & VariantProps<typeof itemMediaVariants>) {
99
- return (
100
- <div
101
- data-slot="item-media"
102
- data-variant={variant}
103
- className={cn(itemMediaVariants({ variant, className }))}
104
- {...props}
105
- />
106
- )
107
- }
108
-
109
- function ItemContent({ className, ...props }: React.ComponentProps<"div">) {
110
- return (
111
- <div
112
- data-slot="item-content"
113
- className={cn(
114
- "flex flex-1 flex-col gap-1 [&+[data-slot=item-content]]:flex-none",
115
- className
116
- )}
117
- {...props}
118
- />
119
- )
120
- }
121
-
122
- function ItemTitle({ className, ...props }: React.ComponentProps<"div">) {
123
- return (
124
- <div
125
- data-slot="item-title"
126
- className={cn(
127
- "flex w-fit items-center gap-2 text-sm leading-snug font-medium",
128
- className
129
- )}
130
- {...props}
131
- />
132
- )
133
- }
134
-
135
- function ItemDescription({ className, ...props }: React.ComponentProps<"p">) {
136
- return (
137
- <p
138
- data-slot="item-description"
139
- className={cn(
140
- "text-muted-foreground line-clamp-2 text-sm leading-normal font-normal text-balance",
141
- "[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4",
142
- className
143
- )}
144
- {...props}
145
- />
146
- )
147
- }
148
-
149
- function ItemActions({ className, ...props }: React.ComponentProps<"div">) {
150
- return (
151
- <div
152
- data-slot="item-actions"
153
- className={cn("flex items-center gap-2", className)}
154
- {...props}
155
- />
156
- )
157
- }
158
-
159
- function ItemHeader({ className, ...props }: React.ComponentProps<"div">) {
160
- return (
161
- <div
162
- data-slot="item-header"
163
- className={cn(
164
- "flex basis-full items-center justify-between gap-2",
165
- className
166
- )}
167
- {...props}
168
- />
169
- )
170
- }
171
-
172
- function ItemFooter({ className, ...props }: React.ComponentProps<"div">) {
173
- return (
174
- <div
175
- data-slot="item-footer"
176
- className={cn(
177
- "flex basis-full items-center justify-between gap-2",
178
- className
179
- )}
180
- {...props}
181
- />
182
- )
183
- }
184
-
185
- export {
186
- Item,
187
- ItemMedia,
188
- ItemContent,
189
- ItemActions,
190
- ItemGroup,
191
- ItemSeparator,
192
- ItemTitle,
193
- ItemDescription,
194
- ItemHeader,
195
- ItemFooter,
196
- }
@@ -1,75 +0,0 @@
1
- // Claude - 10:09pm Thursday Oct 9th 2025
2
-
3
- import React from 'react'
4
- import { cva, type VariantProps } from 'class-variance-authority'
5
- import { cn } from '~/components/catalyst-ui'
6
-
7
- const kbdVariants = cva(
8
- "inline-flex items-center justify-center rounded border px-1.5 py-0.5 font-mono text-[0.7rem] font-semibold tracking-wide whitespace-nowrap",
9
- {
10
- variants: {
11
- variant: {
12
- default: "border-border bg-muted text-muted-foreground",
13
- outline: "border-border bg-background text-foreground",
14
- },
15
- size: {
16
- default: "h-5 min-w-5",
17
- sm: "h-4 min-w-4 px-1 text-[0.65rem]",
18
- lg: "h-6 min-w-6 px-2 text-xs",
19
- },
20
- },
21
- defaultVariants: {
22
- variant: "default",
23
- size: "default",
24
- },
25
- }
26
- )
27
-
28
- function KBD({
29
- className,
30
- variant,
31
- size,
32
- ...props
33
- }: React.ComponentProps<"kbd"> & VariantProps<typeof kbdVariants>) {
34
- return (
35
- <kbd
36
- className={cn(kbdVariants({ variant, size, className }))}
37
- {...props}
38
- />
39
- )
40
- }
41
-
42
- export function KBDDemo() {
43
- return (
44
- <div className="space-y-8 p-6 max-w-2xl mx-auto">
45
- <div>
46
- <h2 className="text-2xl font-bold mb-4">Keyboard Shortcuts</h2>
47
- <div className="flex gap-4 flex-wrap items-center">
48
- <div className="flex items-center gap-2">
49
- <KBD>Ctrl</KBD>
50
- <span>+</span>
51
- <KBD>C</KBD>
52
- </div>
53
- <div className="flex items-center gap-2">
54
- <KBD>⌘</KBD>
55
- <span>+</span>
56
- <KBD>V</KBD>
57
- </div>
58
- </div>
59
- </div>
60
-
61
- <div>
62
- <h2 className="text-2xl font-bold mb-4">Variants & Sizes</h2>
63
- <div className="flex gap-4 flex-wrap items-center">
64
- <KBD variant="default">Esc</KBD>
65
- <KBD variant="outline">Tab</KBD>
66
- <KBD size="sm">Enter</KBD>
67
- <KBD size="lg">Space</KBD>
68
- </div>
69
- </div>
70
- </div>
71
- )
72
- }
73
-
74
-
75
- export { KBD, kbdVariants }
@@ -1,24 +0,0 @@
1
- import React from 'react'
2
- import * as LabelPrimitive from '@radix-ui/react-label'
3
- import { cva, type VariantProps } from 'class-variance-authority'
4
- import { cn } from '~/components/catalyst-ui'
5
-
6
- // @dev app/components/catalyst-ui/data/primitive-data.tsx:3806
7
- const labelVariants = cva(
8
- 'text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70'
9
- )
10
-
11
- const Label = React.forwardRef<
12
- React.ElementRef<typeof LabelPrimitive.Root>,
13
- React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> &
14
- VariantProps<typeof labelVariants>
15
- >(({ className, ...props }, ref) => (
16
- <LabelPrimitive.Root
17
- ref={ref}
18
- className={cn(labelVariants(), className)}
19
- {...props}
20
- />
21
- ))
22
- Label.displayName = LabelPrimitive.Root.displayName
23
-
24
- export { Label }