@srcroot/ui 0.0.61 → 0.0.63

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 (27) hide show
  1. package/dist/index.js +3 -3
  2. package/package.json +1 -1
  3. package/src/registry/analytics/google-analytics.tsx +25 -23
  4. package/src/registry/analytics/google-tag-manager.tsx +54 -49
  5. package/src/registry/analytics/meta-pixel.tsx +29 -25
  6. package/src/registry/analytics/microsoft-clarity.tsx +19 -17
  7. package/src/registry/analytics/tiktok-pixel.tsx +15 -13
  8. package/src/registry/ui/alert.tsx +50 -48
  9. package/src/registry/ui/aspect-ratio.tsx +27 -25
  10. package/src/registry/ui/badge.tsx +40 -37
  11. package/src/registry/ui/breadcrumb.tsx +106 -106
  12. package/src/registry/ui/button-group.tsx +52 -46
  13. package/src/registry/ui/card.tsx +68 -58
  14. package/src/registry/ui/container.tsx +34 -31
  15. package/src/registry/ui/empty-state.tsx +32 -30
  16. package/src/registry/ui/form-field.tsx +79 -68
  17. package/src/registry/ui/image.tsx +128 -120
  18. package/src/registry/ui/input-group.tsx +78 -72
  19. package/src/registry/ui/kbd.tsx +46 -44
  20. package/src/registry/ui/loading-spinner.tsx +84 -80
  21. package/src/registry/ui/marquee.tsx +43 -45
  22. package/src/registry/ui/native-select.tsx +42 -40
  23. package/src/registry/ui/pagination.tsx +115 -101
  24. package/src/registry/ui/radio.tsx +96 -66
  25. package/src/registry/ui/skeleton.tsx +15 -14
  26. package/src/registry/ui/slot.tsx +56 -55
  27. package/src/registry/ui/text.tsx +42 -41
package/src/registry/ui/text.tsx CHANGED
@@ -1,61 +1,62 @@
1
- import * as React from "react"
2
- import { cva, type VariantProps } from "class-variance-authority"
3
- import { cn } from "@/lib/utils"
1
+ "use client";
2
+ import * as React from "react";
3
+ import { cva, type VariantProps } from "class-variance-authority";
4
+ import { cn } from "@/lib/utils";
4
5
 
5
6
  const textVariants = cva("", {
6
- variants: {
7
- variant: {
8
- h1: "scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl",
9
- h2: "scroll-m-20 text-3xl font-semibold tracking-tight",
10
- h3: "scroll-m-20 text-2xl font-semibold tracking-tight",
11
- h4: "scroll-m-20 text-xl font-semibold tracking-tight",
12
- h5: "scroll-m-20 text-lg font-semibold tracking-tight",
13
- h6: "scroll-m-20 text-base font-semibold tracking-tight",
14
- p: "leading-7 [&:not(:first-child)]:mt-6",
15
- lead: "text-xl text-muted-foreground",
16
- large: "text-lg font-semibold",
17
- small: "text-sm font-medium leading-none",
18
- muted: "text-sm text-muted-foreground",
19
- code: "relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm font-semibold",
20
- },
7
+ variants: {
8
+ variant: {
9
+ h1: "scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl",
10
+ h2: "scroll-m-20 text-3xl font-semibold tracking-tight",
11
+ h3: "scroll-m-20 text-2xl font-semibold tracking-tight",
12
+ h4: "scroll-m-20 text-xl font-semibold tracking-tight",
13
+ h5: "scroll-m-20 text-lg font-semibold tracking-tight",
14
+ h6: "scroll-m-20 text-base font-semibold tracking-tight",
15
+ p: "leading-7 [&:not(:first-child)]:mt-6",
16
+ lead: "text-xl text-muted-foreground",
17
+ large: "text-lg font-semibold",
18
+ small: "text-sm font-medium leading-none",
19
+ muted: "text-sm text-muted-foreground",
20
+ code: "relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm font-semibold",
21
21
  },
22
- defaultVariants: {
23
- variant: "p",
24
- },
25
- })
22
+ },
23
+ defaultVariants: {
24
+ variant: "p",
25
+ },
26
+ });
26
27
 
27
- type TextVariants = VariantProps<typeof textVariants>
28
+ type TextVariants = VariantProps<typeof textVariants>;
28
29
 
29
30
  interface TextProps extends TextVariants {
30
- className?: string
31
- children?: React.ReactNode
32
- as?: "p" | "span" | "div" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "label"
31
+ className?: string;
32
+ children?: React.ReactNode;
33
+ as?: "p" | "span" | "div" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "label";
33
34
  }
34
35
 
35
36
  /**
36
37
  * Text component for typography
37
- *
38
+ *
38
39
  * @example
39
40
  * // As a heading
40
41
  * <Text as="h1" variant="h1">Page Title</Text>
41
- *
42
+ *
42
43
  * // Using heading styles on a different element
43
44
  * <Text as="span" variant="h2">Styled as H2</Text>
44
- *
45
+ *
45
46
  * // Muted text
46
47
  * <Text variant="muted">Secondary information</Text>
47
48
  */
48
49
  const Text = React.forwardRef<HTMLElement, TextProps>(
49
- ({ as: Component = "p", className, variant, ...props }, ref) => {
50
- return (
51
- <Component
52
- ref={ref as any}
53
- className={cn(textVariants({ variant }), className)}
54
- {...props}
55
- />
56
- )
57
- }
58
- )
59
- Text.displayName = "Text"
50
+ ({ as: Component = "p", className, variant, ...props }, ref) => {
51
+ return (
52
+ <Component
53
+ ref={ref as any}
54
+ className={cn(textVariants({ variant }), className)}
55
+ {...props}
56
+ />
57
+ );
58
+ },
59
+ );
60
+ Text.displayName = "Text";
60
61
 
61
- export { Text, textVariants }
62
+ export { Text, textVariants };