shapes-ui 0.4.1 → 0.5.0

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 (149) hide show
  1. package/.github/ISSUE_TEMPLATE/bug_report.yml +47 -0
  2. package/.github/ISSUE_TEMPLATE/config.yml +1 -0
  3. package/.github/ISSUE_TEMPLATE/feature_request.yml +31 -0
  4. package/.github/pull_request_template.md +14 -0
  5. package/.github/workflows/pr-preview.yml +68 -0
  6. package/.github/workflows/release.yml +8 -0
  7. package/.idea/compiler.xml +6 -0
  8. package/.idea/copilot.data.migration.ask2agent.xml +6 -0
  9. package/.idea/vcs.xml +6 -0
  10. package/CHANGELOG.md +31 -0
  11. package/CODE_OF_CONDUCT.md +41 -0
  12. package/CONTRIBUTING.md +52 -0
  13. package/README.md +5 -0
  14. package/SECURITY.md +0 -0
  15. package/content/components/field.mdx +2 -2
  16. package/content/components/fieldset.mdx +1 -1
  17. package/content/components/menubar.mdx +4 -2
  18. package/content/components/meter.mdx +13 -1
  19. package/content/components/navigation-menu.mdx +6 -0
  20. package/content/components/number-field.mdx +24 -0
  21. package/content/components/popover.mdx +20 -0
  22. package/content/components/preview-card.mdx +11 -0
  23. package/content/components/progress.mdx +2 -0
  24. package/content/components/radio.mdx +20 -0
  25. package/content/components/select.mdx +30 -0
  26. package/content/components/slider.mdx +48 -0
  27. package/content/components/switch.mdx +26 -0
  28. package/content/components/tabs.mdx +32 -0
  29. package/content/components/toast.mdx +60 -0
  30. package/content/components/toggle.mdx +34 -2
  31. package/content/components/toolbar.mdx +26 -0
  32. package/content/components/tooltip.mdx +25 -0
  33. package/content-collections.ts +1 -1
  34. package/examples/__index.tsx +231 -0
  35. package/examples/checkbox-demo.tsx +1 -1
  36. package/examples/checkbox-form.tsx +3 -3
  37. package/examples/field-custom-control.tsx +33 -9
  38. package/examples/form-demo.tsx +5 -10
  39. package/examples/menu-advanced.tsx +1 -3
  40. package/examples/menu-align.tsx +19 -16
  41. package/examples/menu-checkbox.tsx +2 -3
  42. package/examples/menu-demo.tsx +1 -3
  43. package/examples/menu-group.tsx +1 -3
  44. package/examples/menu-radio.tsx +1 -3
  45. package/examples/menu-submenu.tsx +2 -3
  46. package/examples/menubar-advanced.tsx +91 -0
  47. package/examples/meter-demo.tsx +8 -21
  48. package/examples/meter-flip.tsx +13 -0
  49. package/examples/meter-no-label.tsx +12 -0
  50. package/examples/meter-no-value.tsx +12 -0
  51. package/examples/navigation-menu-demo.tsx +113 -1
  52. package/examples/number-field-buttons-end.tsx +20 -0
  53. package/examples/number-field-demo.tsx +17 -1
  54. package/examples/number-field-scrub.tsx +38 -0
  55. package/examples/popover-demo.tsx +18 -1
  56. package/examples/popover-form.tsx +46 -0
  57. package/examples/popover-positions.tsx +54 -0
  58. package/examples/preview-card-demo.tsx +26 -1
  59. package/examples/preview-card-links.tsx +38 -0
  60. package/examples/progress-demo.tsx +33 -1
  61. package/examples/radio-card.tsx +28 -0
  62. package/examples/radio-demo.tsx +19 -1
  63. package/examples/radio-description.tsx +26 -0
  64. package/examples/radio-orientation.tsx +21 -0
  65. package/examples/select-alignment.tsx +51 -0
  66. package/examples/select-demo.tsx +36 -1
  67. package/examples/select-disabled.tsx +38 -0
  68. package/examples/select-groups.tsx +54 -0
  69. package/examples/select-invalid.tsx +41 -0
  70. package/examples/select-scrollable.tsx +112 -0
  71. package/examples/slider-controlled.tsx +28 -0
  72. package/examples/slider-demo.tsx +3 -1
  73. package/examples/slider-disabled.tsx +7 -0
  74. package/examples/slider-edge.tsx +13 -0
  75. package/examples/slider-multiple.tsx +7 -0
  76. package/examples/slider-range.tsx +5 -0
  77. package/examples/slider-vertical.tsx +10 -0
  78. package/examples/switch-demo.tsx +19 -1
  79. package/examples/switch-disabled.tsx +20 -0
  80. package/examples/switch-sizes.tsx +24 -0
  81. package/examples/switch-with-label.tsx +16 -0
  82. package/examples/tabs-demo.tsx +14 -1
  83. package/examples/tabs-disabled.tsx +21 -0
  84. package/examples/tabs-line.tsx +18 -0
  85. package/examples/tabs-vertical.tsx +13 -0
  86. package/examples/toast-action.tsx +39 -0
  87. package/examples/toast-anchored.tsx +36 -0
  88. package/examples/toast-demo.tsx +27 -1
  89. package/examples/toast-positions.tsx +54 -0
  90. package/examples/toast-promise.tsx +51 -0
  91. package/examples/toast-stacked.tsx +30 -0
  92. package/examples/toast-timeout.tsx +43 -0
  93. package/examples/toast-update.tsx +38 -0
  94. package/examples/toast-variants.tsx +54 -0
  95. package/examples/toggle-controlled.tsx +20 -0
  96. package/examples/toggle-demo.tsx +7 -51
  97. package/examples/toggle-group-demo.tsx +19 -0
  98. package/examples/toggle-group-multiple.tsx +19 -0
  99. package/examples/toggle-icon-fill.tsx +12 -0
  100. package/examples/toolbar-demo.tsx +45 -21
  101. package/examples/toolbar-input-link.tsx +35 -0
  102. package/examples/toolbar-menu.tsx +53 -0
  103. package/examples/tooltip-demo.tsx +48 -0
  104. package/examples/tooltip-positions.tsx +60 -0
  105. package/package.json +8 -8
  106. package/public/r/drawer.json +1 -1
  107. package/public/r/field.json +1 -1
  108. package/public/r/menubar.json +1 -1
  109. package/public/r/meter.json +1 -1
  110. package/public/r/navigation-menu.json +1 -1
  111. package/public/r/number-field.json +4 -2
  112. package/public/r/popover.json +1 -1
  113. package/public/r/preview-card.json +1 -1
  114. package/public/r/progress.json +1 -1
  115. package/public/r/radio.json +1 -1
  116. package/public/r/select.json +1 -1
  117. package/public/r/slider.json +1 -1
  118. package/public/r/switch.json +1 -1
  119. package/public/r/tabs.json +1 -1
  120. package/public/r/toast.json +2 -1
  121. package/public/r/toggle.json +1 -1
  122. package/public/r/toolbar.json +1 -1
  123. package/public/r/tooltip.json +15 -0
  124. package/src/components/docs/layout/header.tsx +4 -14
  125. package/src/components/docs/layout/mobile-menu.tsx +27 -78
  126. package/src/components/docs/layout/nav-list.tsx +27 -21
  127. package/src/components/docs/layout/split-layout.tsx +6 -3
  128. package/src/components/ui/badge.tsx +1 -1
  129. package/src/components/ui/checkbox.tsx +1 -1
  130. package/src/components/ui/drawer.tsx +1 -1
  131. package/src/components/ui/field.tsx +9 -28
  132. package/src/components/ui/form.tsx +1 -1
  133. package/src/components/ui/menubar.tsx +52 -18
  134. package/src/components/ui/meter.tsx +12 -24
  135. package/src/components/ui/navigation-menu.tsx +121 -38
  136. package/src/components/ui/number-field.tsx +42 -46
  137. package/src/components/ui/popover.tsx +7 -2
  138. package/src/components/ui/preview-card.tsx +4 -2
  139. package/src/components/ui/progress.tsx +7 -18
  140. package/src/components/ui/radio.tsx +32 -19
  141. package/src/components/ui/select.tsx +6 -6
  142. package/src/components/ui/slider.tsx +8 -5
  143. package/src/components/ui/switch.tsx +13 -17
  144. package/src/components/ui/tabs.tsx +23 -10
  145. package/src/components/ui/toast.tsx +190 -29
  146. package/src/components/ui/toggle.tsx +1 -1
  147. package/src/components/ui/toolbar.tsx +17 -4
  148. package/src/components/ui/tooltip.tsx +54 -0
  149. package/src/routes/__root.tsx +3 -5
package/src/components/ui/tooltip.tsx ADDED
@@ -0,0 +1,54 @@
1
+ "use client";
2
+
3
+ import { Tooltip as TooltipPrimitive } from "@base-ui/react/tooltip";
4
+
5
+ import { cn } from "@/lib/utils";
6
+
7
+ function TooltipProvider({ delay = 0, ...props }: TooltipPrimitive.Provider.Props) {
8
+ return <TooltipPrimitive.Provider data-slot="tooltip-provider" delay={delay} {...props} />;
9
+ }
10
+
11
+ function Tooltip({ ...props }: TooltipPrimitive.Root.Props) {
12
+ return <TooltipPrimitive.Root data-slot="tooltip" {...props} />;
13
+ }
14
+
15
+ function TooltipTrigger({ ...props }: TooltipPrimitive.Trigger.Props) {
16
+ return <TooltipPrimitive.Trigger data-slot="tooltip-trigger" {...props} />;
17
+ }
18
+
19
+ function TooltipPopup({
20
+ className,
21
+ side = "top",
22
+ sideOffset = 4,
23
+ align = "center",
24
+ alignOffset = 0,
25
+ children,
26
+ ...props
27
+ }: TooltipPrimitive.Popup.Props &
28
+ Pick<TooltipPrimitive.Positioner.Props, "align" | "alignOffset" | "side" | "sideOffset">) {
29
+ return (
30
+ <TooltipPrimitive.Portal>
31
+ <TooltipPrimitive.Positioner
32
+ align={align}
33
+ alignOffset={alignOffset}
34
+ side={side}
35
+ sideOffset={sideOffset}
36
+ className="isolate z-50"
37
+ >
38
+ <TooltipPrimitive.Popup
39
+ data-slot="tooltip-popup"
40
+ className={cn(
41
+ "z-50 w-fit max-w-xs origin-(--transform-origin) rounded-md bg-foreground px-3 py-1.5 text-xs text-background data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-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 data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95",
42
+ className,
43
+ )}
44
+ {...props}
45
+ >
46
+ {children}
47
+ <TooltipPrimitive.Arrow className="z-50 size-2.5 translate-y-[calc(-50%-2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground data-[side=bottom]:top-1 data-[side=inline-end]:top-1/2! data-[side=inline-end]:-left-1 data-[side=inline-end]:-translate-y-1/2 data-[side=inline-start]:top-1/2! data-[side=inline-start]:-right-1 data-[side=inline-start]:-translate-y-1/2 data-[side=left]:top-1/2! data-[side=left]:-right-1 data-[side=left]:-translate-y-1/2 data-[side=right]:top-1/2! data-[side=right]:-left-1 data-[side=right]:-translate-y-1/2 data-[side=top]:-bottom-2.5" />
48
+ </TooltipPrimitive.Popup>
49
+ </TooltipPrimitive.Positioner>
50
+ </TooltipPrimitive.Portal>
51
+ );
52
+ }
53
+
54
+ export { Tooltip, TooltipTrigger, TooltipPopup, TooltipProvider };
package/src/routes/__root.tsx CHANGED
@@ -40,17 +40,15 @@ export const Route = createRootRoute({
40
40
 
41
41
  function RootDocument({ children }: { children: React.ReactNode }) {
42
42
  return (
43
- <Suspense fallback={<SuspenseFallback className=" h-dvh" />}>
43
+ <Suspense fallback={<SuspenseFallback className="" />}>
44
44
  <ThemeProvider>
45
45
  <html lang="en">
46
46
  <head>
47
47
  <HeadContent />
48
48
  </head>
49
- <body className="flex h-dvh flex-col">
49
+ <body className="flex h-dvh flex-col overflow-hidden">
50
50
  <Header />
51
- <main className=" container mx-auto flex flex-1 overflow-hidden border-x">
52
- {children}
53
- </main>
51
+ <main className=" container mx-auto flex min-h-0 flex-1 border-x">{children}</main>
54
52
  <Footer />
55
53
  <TanStackDevtools
56
54
  config={{