@bearmenu/ui 0.7.1 → 0.8.2

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 (123) hide show
  1. package/dist/{chunk-4JOV7FXW.js → chunk-2DEIXTBN.js} +1 -1
  2. package/dist/{chunk-UUJVXN2O.js → chunk-66MAPLXS.js} +3 -1
  3. package/dist/{chunk-Y5D5LP4A.js → chunk-7BWTYWM3.js} +14 -3
  4. package/dist/{chunk-ZFNOCP6W.js → chunk-H3BV4VAG.js} +15 -1
  5. package/dist/{chunk-TL4YU2O5.js → chunk-UKBNQO6Q.js} +2 -2
  6. package/dist/{chunk-UX6SWAKH.js → chunk-UZ3PCIE5.js} +119 -28
  7. package/dist/{chunk-YLNYXPIH.js → chunk-VBA45GLP.js} +1 -1
  8. package/dist/{chunk-A5ONAJCE.js → chunk-VG3PND3D.js} +1 -1
  9. package/dist/{chunk-ZBBUKXM5.js → chunk-X3WMRKOW.js} +1 -1
  10. package/dist/{chunk-HCM6LKM5.js → chunk-XNA2INVQ.js} +2 -2
  11. package/dist/{chunk-AV777R4G.js → chunk-YYGB4G4Q.js} +1 -1
  12. package/dist/components/accordion.js +1 -1
  13. package/dist/components/alert-dialog.js +1 -1
  14. package/dist/components/alert.js +1 -1
  15. package/dist/components/avatar.d.ts +10 -1
  16. package/dist/components/avatar.js +41 -14
  17. package/dist/components/badge.d.ts +11 -2
  18. package/dist/components/badge.js +1 -1
  19. package/dist/components/breadcrumb.js +1 -1
  20. package/dist/components/button.d.ts +1 -1
  21. package/dist/components/button.js +1 -1
  22. package/dist/components/calendar.js +3 -3
  23. package/dist/components/card.js +1 -1
  24. package/dist/components/carousel.js +1 -1
  25. package/dist/components/circular-progress.js +1 -1
  26. package/dist/components/combobox.js +3 -3
  27. package/dist/components/command.js +1 -1
  28. package/dist/components/currency-input.js +2 -2
  29. package/dist/components/date-input.js +1 -1
  30. package/dist/components/description-list.js +1 -1
  31. package/dist/components/drawer.js +5 -1
  32. package/dist/components/dropdown-menu.js +1 -1
  33. package/dist/components/empty-state.js +2 -2
  34. package/dist/components/field.js +2 -2
  35. package/dist/components/filter-category-row.js +2 -2
  36. package/dist/components/form.js +1 -1
  37. package/dist/components/haptic-button.js +1 -1
  38. package/dist/components/input-group.js +1 -1
  39. package/dist/components/input.js +1 -1
  40. package/dist/components/item.js +1 -1
  41. package/dist/components/kbd.js +1 -1
  42. package/dist/components/label.js +1 -1
  43. package/dist/components/link-button.js +1 -1
  44. package/dist/components/multi-select-combobox.js +4 -4
  45. package/dist/components/pagination.js +1 -1
  46. package/dist/components/place-about-tab.d.ts +17 -1
  47. package/dist/components/place-about-tab.js +4 -4
  48. package/dist/components/place-card.js +2 -2
  49. package/dist/components/place-details-mobile.js +7 -7
  50. package/dist/components/place-schedule-week.js +2 -2
  51. package/dist/components/popover.js +1 -1
  52. package/dist/components/searchable-select.js +3 -3
  53. package/dist/components/select.js +2 -2
  54. package/dist/components/selection-bar.js +1 -1
  55. package/dist/components/sheet.d.ts +23 -0
  56. package/dist/components/sheet.js +51 -14
  57. package/dist/components/sliding-panels.js +5 -1
  58. package/dist/components/sonner.js +2 -2
  59. package/dist/components/stepper.js +4 -1
  60. package/dist/components/table.js +1 -1
  61. package/dist/components/tabs.js +1 -1
  62. package/dist/components/tag-group.js +1 -1
  63. package/dist/components/tag.js +1 -1
  64. package/dist/components/text.d.ts +18 -0
  65. package/dist/components/text.js +1 -1
  66. package/dist/components/toggle-group.js +1 -1
  67. package/dist/components/toggle.js +1 -1
  68. package/dist/lib/card-hover.d.ts +75 -0
  69. package/dist/lib/card-hover.js +18 -0
  70. package/package.json +1 -1
  71. package/src/components/accordion.tsx +1 -1
  72. package/src/components/avatar.stories.tsx +59 -26
  73. package/src/components/avatar.test.tsx +129 -0
  74. package/src/components/avatar.tsx +93 -37
  75. package/src/components/badge.tsx +15 -3
  76. package/src/components/breadcrumb.tsx +1 -1
  77. package/src/components/button.tsx +16 -1
  78. package/src/components/calendar.tsx +2 -2
  79. package/src/components/circular-progress.tsx +1 -1
  80. package/src/components/command.tsx +2 -2
  81. package/src/components/currency-input.tsx +1 -1
  82. package/src/components/description-list.tsx +1 -1
  83. package/src/components/drawer.tsx +5 -1
  84. package/src/components/dropdown-menu.tsx +1 -1
  85. package/src/components/field.tsx +1 -1
  86. package/src/components/input-group.tsx +1 -1
  87. package/src/components/input.tsx +1 -1
  88. package/src/components/item.tsx +1 -1
  89. package/src/components/kbd.tsx +1 -1
  90. package/src/components/label.tsx +1 -1
  91. package/src/components/place-about-tab.tsx +131 -18
  92. package/src/components/place-card.tsx +1 -1
  93. package/src/components/place-details-mobile.tsx +2 -2
  94. package/src/components/popover.tsx +9 -1
  95. package/src/components/select.tsx +2 -2
  96. package/src/components/selection-bar.tsx +1 -1
  97. package/src/components/sheet.tsx +72 -12
  98. package/src/components/sliding-panels.stories.tsx +70 -0
  99. package/src/components/sliding-panels.test.tsx +116 -0
  100. package/src/components/sliding-panels.tsx +14 -0
  101. package/src/components/sonner.tsx +2 -2
  102. package/src/components/stepper.tsx +4 -1
  103. package/src/components/table.tsx +1 -1
  104. package/src/components/tabs.tsx +1 -1
  105. package/src/components/tag-group.tsx +1 -1
  106. package/src/components/tag.tsx +1 -1
  107. package/src/components/text.test.tsx +37 -3
  108. package/src/components/text.tsx +32 -3
  109. package/src/components/toggle.tsx +1 -1
  110. package/src/globals.css +53 -11
  111. package/src/lib/card-hover.ts +87 -0
  112. package/dist/chunk-EBAMCZDW.js +0 -112
  113. package/dist/chunk-VQNDZVI7.js +0 -106
  114. package/dist/components/toast.d.ts +0 -18
  115. package/dist/components/toast.js +0 -3
  116. package/dist/components/toaster.d.ts +0 -5
  117. package/dist/components/toaster.js +0 -25
  118. package/dist/components/use-toast.d.ts +0 -42
  119. package/dist/components/use-toast.js +0 -2
  120. package/src/components/toast.stories.tsx +0 -63
  121. package/src/components/toast.tsx +0 -130
  122. package/src/components/toaster.tsx +0 -31
  123. package/src/components/use-toast.ts +0 -180
@@ -1,112 +0,0 @@
1
- import { __spreadProps, __spreadValues, __objRest } from './chunk-3GWWZKX7.js';
2
- import * as React from 'react';
3
-
4
- var TOAST_LIMIT = 1;
5
- var TOAST_REMOVE_DELAY = 1e6;
6
- var count = 0;
7
- function genId() {
8
- count = (count + 1) % Number.MAX_SAFE_INTEGER;
9
- return count.toString();
10
- }
11
- var toastTimeouts = /* @__PURE__ */ new Map();
12
- var addToRemoveQueue = (toastId) => {
13
- if (toastTimeouts.has(toastId)) {
14
- return;
15
- }
16
- const timeout = setTimeout(() => {
17
- toastTimeouts.delete(toastId);
18
- dispatch({
19
- type: "REMOVE_TOAST",
20
- toastId
21
- });
22
- }, TOAST_REMOVE_DELAY);
23
- toastTimeouts.set(toastId, timeout);
24
- };
25
- var reducer = (state, action) => {
26
- switch (action.type) {
27
- case "ADD_TOAST":
28
- return __spreadProps(__spreadValues({}, state), {
29
- toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT)
30
- });
31
- case "UPDATE_TOAST":
32
- return __spreadProps(__spreadValues({}, state), {
33
- toasts: state.toasts.map((t) => t.id === action.toast.id ? __spreadValues(__spreadValues({}, t), action.toast) : t)
34
- });
35
- case "DISMISS_TOAST": {
36
- const { toastId } = action;
37
- if (toastId) {
38
- addToRemoveQueue(toastId);
39
- } else {
40
- state.toasts.forEach((toast2) => {
41
- addToRemoveQueue(toast2.id);
42
- });
43
- }
44
- return __spreadProps(__spreadValues({}, state), {
45
- toasts: state.toasts.map(
46
- (t) => t.id === toastId || toastId === void 0 ? __spreadProps(__spreadValues({}, t), {
47
- open: false
48
- }) : t
49
- )
50
- });
51
- }
52
- case "REMOVE_TOAST":
53
- if (action.toastId === void 0) {
54
- return __spreadProps(__spreadValues({}, state), {
55
- toasts: []
56
- });
57
- }
58
- return __spreadProps(__spreadValues({}, state), {
59
- toasts: state.toasts.filter((t) => t.id !== action.toastId)
60
- });
61
- }
62
- };
63
- var listeners = [];
64
- var memoryState = { toasts: [] };
65
- function dispatch(action) {
66
- memoryState = reducer(memoryState, action);
67
- listeners.forEach((listener) => {
68
- listener(memoryState);
69
- });
70
- }
71
- function toast(_a) {
72
- var props = __objRest(_a, []);
73
- const id = genId();
74
- const update = (props2) => dispatch({
75
- type: "UPDATE_TOAST",
76
- toast: __spreadProps(__spreadValues({}, props2), { id })
77
- });
78
- const dismiss = () => dispatch({ type: "DISMISS_TOAST", toastId: id });
79
- dispatch({
80
- type: "ADD_TOAST",
81
- toast: __spreadProps(__spreadValues({}, props), {
82
- id,
83
- open: true,
84
- onOpenChange: (open) => {
85
- if (!open) dismiss();
86
- }
87
- })
88
- });
89
- return {
90
- id,
91
- dismiss,
92
- update
93
- };
94
- }
95
- function useToast() {
96
- const [state, setState] = React.useState(memoryState);
97
- React.useEffect(() => {
98
- listeners.push(setState);
99
- return () => {
100
- const index = listeners.indexOf(setState);
101
- if (index > -1) {
102
- listeners.splice(index, 1);
103
- }
104
- };
105
- }, [state]);
106
- return __spreadProps(__spreadValues({}, state), {
107
- toast,
108
- dismiss: (toastId) => dispatch({ type: "DISMISS_TOAST", toastId })
109
- });
110
- }
111
-
112
- export { reducer, toast, useToast };
@@ -1,106 +0,0 @@
1
- import { cn } from './chunk-FEK5XGZW.js';
2
- import { __objRest, __spreadValues, __spreadProps } from './chunk-3GWWZKX7.js';
3
- import * as React from 'react';
4
- import * as ToastPrimitives from '@radix-ui/react-toast';
5
- import { cva } from 'class-variance-authority';
6
- import { X } from 'lucide-react';
7
- import { jsx } from 'react/jsx-runtime';
8
-
9
- var ToastProvider = ToastPrimitives.Provider;
10
- var ToastViewport = React.forwardRef((_a, ref) => {
11
- var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
12
- return /* @__PURE__ */ jsx(
13
- ToastPrimitives.Viewport,
14
- __spreadValues({
15
- ref,
16
- className: cn(
17
- "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
18
- className
19
- )
20
- }, props)
21
- );
22
- });
23
- ToastViewport.displayName = ToastPrimitives.Viewport.displayName;
24
- var toastVariants = cva(
25
- "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-xl p-6 pr-8 shadow-2xl transition-[transform,opacity] duration-[var(--duration-standard)] ease-[var(--ease-standard)] data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=open]:duration-[var(--duration-standard)] data-[state=closed]:duration-[var(--duration-exit-standard)] data-[state=open]:ease-[var(--ease-enter)] data-[state=closed]:ease-[var(--ease-exit)] data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
26
- {
27
- variants: {
28
- variant: {
29
- default: "glass text-foreground border border-border/50",
30
- destructive: "destructive border border-destructive/60 bg-destructive text-destructive-foreground"
31
- }
32
- },
33
- defaultVariants: {
34
- variant: "default"
35
- }
36
- }
37
- );
38
- var Toast = React.forwardRef((_a, ref) => {
39
- var _b = _a, { className, variant } = _b, props = __objRest(_b, ["className", "variant"]);
40
- return /* @__PURE__ */ jsx(
41
- ToastPrimitives.Root,
42
- __spreadValues({
43
- ref,
44
- className: cn(toastVariants({ variant }), className)
45
- }, props)
46
- );
47
- });
48
- Toast.displayName = ToastPrimitives.Root.displayName;
49
- var ToastAction = React.forwardRef((_a, ref) => {
50
- var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
51
- return /* @__PURE__ */ jsx(
52
- ToastPrimitives.Action,
53
- __spreadValues({
54
- ref,
55
- className: cn(
56
- "inline-flex h-8 shrink-0 items-center justify-center rounded-lg border border-muted bg-transparent px-3 text-xs font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
57
- className
58
- )
59
- }, props)
60
- );
61
- });
62
- ToastAction.displayName = ToastPrimitives.Action.displayName;
63
- var ToastClose = React.forwardRef((_a, ref) => {
64
- var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
65
- return /* @__PURE__ */ jsx(
66
- ToastPrimitives.Close,
67
- __spreadProps(__spreadValues({
68
- ref,
69
- className: cn(
70
- "absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-white group-[.destructive]:opacity-100 group-[.destructive]:hover:text-white group-[.destructive]:focus:ring-white/50 group-[.destructive]:focus:ring-offset-destructive",
71
- className
72
- ),
73
- "toast-close": ""
74
- }, props), {
75
- children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
76
- })
77
- );
78
- });
79
- ToastClose.displayName = ToastPrimitives.Close.displayName;
80
- var ToastTitle = React.forwardRef((_a, ref) => {
81
- var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
82
- return /* @__PURE__ */ jsx(
83
- ToastPrimitives.Title,
84
- __spreadValues({
85
- ref,
86
- className: cn(
87
- "text-sm font-semibold group-[.destructive]:text-destructive-foreground",
88
- className
89
- )
90
- }, props)
91
- );
92
- });
93
- ToastTitle.displayName = ToastPrimitives.Title.displayName;
94
- var ToastDescription = React.forwardRef((_a, ref) => {
95
- var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
96
- return /* @__PURE__ */ jsx(
97
- ToastPrimitives.Description,
98
- __spreadValues({
99
- ref,
100
- className: cn("text-sm opacity-90 group-[.destructive]:text-white", className)
101
- }, props)
102
- );
103
- });
104
- ToastDescription.displayName = ToastPrimitives.Description.displayName;
105
-
106
- export { Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport };
@@ -1,18 +0,0 @@
1
- import * as class_variance_authority_types from 'class-variance-authority/types';
2
- import * as React from 'react';
3
- import * as ToastPrimitives from '@radix-ui/react-toast';
4
- import { VariantProps } from 'class-variance-authority';
5
-
6
- declare const ToastProvider: React.FC<ToastPrimitives.ToastProviderProps>;
7
- declare const ToastViewport: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastViewportProps & React.RefAttributes<HTMLOListElement>, "ref"> & React.RefAttributes<HTMLOListElement>>;
8
- declare const Toast: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastProps & React.RefAttributes<HTMLLIElement>, "ref"> & VariantProps<(props?: ({
9
- variant?: "default" | "destructive" | null | undefined;
10
- } & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLLIElement>>;
11
- declare const ToastAction: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastActionProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
12
- declare const ToastClose: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastCloseProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
13
- declare const ToastTitle: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastTitleProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
14
- declare const ToastDescription: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastDescriptionProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
15
- type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>;
16
- type ToastActionElement = React.ReactElement<typeof ToastAction>;
17
-
18
- export { Toast, ToastAction, type ToastActionElement, ToastClose, ToastDescription, type ToastProps, ToastProvider, ToastTitle, ToastViewport };
@@ -1,3 +0,0 @@
1
- export { Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport } from '../chunk-VQNDZVI7.js';
2
- import '../chunk-FEK5XGZW.js';
3
- import '../chunk-3GWWZKX7.js';
@@ -1,5 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
-
3
- declare function Toaster(): react_jsx_runtime.JSX.Element;
4
-
5
- export { Toaster };
@@ -1,25 +0,0 @@
1
- import { useToast } from '../chunk-EBAMCZDW.js';
2
- import { ToastProvider, Toast, ToastTitle, ToastDescription, ToastClose, ToastViewport } from '../chunk-VQNDZVI7.js';
3
- import '../chunk-FEK5XGZW.js';
4
- import { __objRest, __spreadProps, __spreadValues } from '../chunk-3GWWZKX7.js';
5
- import { jsxs, jsx } from 'react/jsx-runtime';
6
-
7
- function Toaster() {
8
- const { toasts } = useToast();
9
- return /* @__PURE__ */ jsxs(ToastProvider, { children: [
10
- toasts.map((_a) => {
11
- var _b = _a, { id, title, description, action } = _b, props = __objRest(_b, ["id", "title", "description", "action"]);
12
- return /* @__PURE__ */ jsxs(Toast, __spreadProps(__spreadValues({}, props), { children: [
13
- /* @__PURE__ */ jsxs("div", { className: "grid gap-1", children: [
14
- title && /* @__PURE__ */ jsx(ToastTitle, { children: title }),
15
- description && /* @__PURE__ */ jsx(ToastDescription, { children: description })
16
- ] }),
17
- action,
18
- /* @__PURE__ */ jsx(ToastClose, {})
19
- ] }), id);
20
- }),
21
- /* @__PURE__ */ jsx(ToastViewport, {})
22
- ] });
23
- }
24
-
25
- export { Toaster };
@@ -1,42 +0,0 @@
1
- import * as React from 'react';
2
- import { ToastProps, ToastActionElement } from './toast.js';
3
- import 'class-variance-authority/types';
4
- import '@radix-ui/react-toast';
5
- import 'class-variance-authority';
6
-
7
- type ToasterToast = ToastProps & {
8
- id: string;
9
- title?: React.ReactNode;
10
- description?: React.ReactNode;
11
- action?: ToastActionElement;
12
- };
13
- type Action = {
14
- type: "ADD_TOAST";
15
- toast: ToasterToast;
16
- } | {
17
- type: "UPDATE_TOAST";
18
- toast: Partial<ToasterToast>;
19
- } | {
20
- type: "DISMISS_TOAST";
21
- toastId?: ToasterToast["id"];
22
- } | {
23
- type: "REMOVE_TOAST";
24
- toastId?: ToasterToast["id"];
25
- };
26
- interface State {
27
- toasts: ToasterToast[];
28
- }
29
- declare const reducer: (state: State, action: Action) => State;
30
- type Toast = Omit<ToasterToast, "id">;
31
- declare function toast({ ...props }: Toast): {
32
- id: string;
33
- dismiss: () => void;
34
- update: (props: ToasterToast) => void;
35
- };
36
- declare function useToast(): {
37
- toast: typeof toast;
38
- dismiss: (toastId?: string) => void;
39
- toasts: ToasterToast[];
40
- };
41
-
42
- export { reducer, toast, useToast };
@@ -1,2 +0,0 @@
1
- export { reducer, toast, useToast } from '../chunk-EBAMCZDW.js';
2
- import '../chunk-3GWWZKX7.js';
@@ -1,63 +0,0 @@
1
- import type { Meta, StoryObj } from "@storybook/react";
2
- import {
3
- Toast,
4
- ToastAction,
5
- ToastClose,
6
- ToastDescription,
7
- ToastProvider,
8
- ToastTitle,
9
- ToastViewport,
10
- } from "./toast";
11
-
12
- const meta = {
13
- title: "Components/Toast",
14
- component: Toast,
15
- tags: ["autodocs"],
16
- decorators: [
17
- (Story) => (
18
- <ToastProvider>
19
- <Story />
20
- <ToastViewport />
21
- </ToastProvider>
22
- ),
23
- ],
24
- } satisfies Meta<typeof Toast>;
25
-
26
- export default meta;
27
- type Story = StoryObj<typeof meta>;
28
-
29
- export const Default: Story = {
30
- render: () => (
31
- <Toast open>
32
- <div className="grid gap-1">
33
- <ToastTitle>Notification</ToastTitle>
34
- <ToastDescription>Your changes have been saved.</ToastDescription>
35
- </div>
36
- <ToastClose />
37
- </Toast>
38
- ),
39
- };
40
-
41
- export const Destructive: Story = {
42
- render: () => (
43
- <Toast variant="destructive" open>
44
- <div className="grid gap-1">
45
- <ToastTitle>Error</ToastTitle>
46
- <ToastDescription>Something went wrong.</ToastDescription>
47
- </div>
48
- <ToastClose />
49
- </Toast>
50
- ),
51
- };
52
-
53
- export const WithAction: Story = {
54
- render: () => (
55
- <Toast open>
56
- <div className="grid gap-1">
57
- <ToastTitle>Event Created</ToastTitle>
58
- <ToastDescription>Friday, March 14 at 2:00 PM</ToastDescription>
59
- </div>
60
- <ToastAction altText="Undo">Undo</ToastAction>
61
- </Toast>
62
- ),
63
- };
@@ -1,130 +0,0 @@
1
- "use client";
2
-
3
- import * as React from "react";
4
- import * as ToastPrimitives from "@radix-ui/react-toast";
5
- import { cva, type VariantProps } from "class-variance-authority";
6
- import { X } from "lucide-react";
7
- import { cn } from "../lib/utils";
8
-
9
- const ToastProvider = ToastPrimitives.Provider;
10
-
11
- const ToastViewport = React.forwardRef<
12
- React.ElementRef<typeof ToastPrimitives.Viewport>,
13
- React.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport>
14
- >(({ className, ...props }, ref) => (
15
- <ToastPrimitives.Viewport
16
- ref={ref}
17
- className={cn(
18
- "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
19
- className
20
- )}
21
- {...props}
22
- />
23
- ));
24
- ToastViewport.displayName = ToastPrimitives.Viewport.displayName;
25
-
26
- const toastVariants = cva(
27
- "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-xl p-6 pr-8 shadow-2xl transition-[transform,opacity] duration-[var(--duration-standard)] ease-[var(--ease-standard)] data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=open]:duration-[var(--duration-standard)] data-[state=closed]:duration-[var(--duration-exit-standard)] data-[state=open]:ease-[var(--ease-enter)] data-[state=closed]:ease-[var(--ease-exit)] data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
28
- {
29
- variants: {
30
- variant: {
31
- default: "glass text-foreground border border-border/50",
32
- destructive:
33
- "destructive border border-destructive/60 bg-destructive text-destructive-foreground",
34
- },
35
- },
36
- defaultVariants: {
37
- variant: "default",
38
- },
39
- }
40
- );
41
-
42
- const Toast = React.forwardRef<
43
- React.ElementRef<typeof ToastPrimitives.Root>,
44
- React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> & VariantProps<typeof toastVariants>
45
- >(({ className, variant, ...props }, ref) => {
46
- return (
47
- <ToastPrimitives.Root
48
- ref={ref}
49
- className={cn(toastVariants({ variant }), className)}
50
- {...props}
51
- />
52
- );
53
- });
54
- Toast.displayName = ToastPrimitives.Root.displayName;
55
-
56
- const ToastAction = React.forwardRef<
57
- React.ElementRef<typeof ToastPrimitives.Action>,
58
- React.ComponentPropsWithoutRef<typeof ToastPrimitives.Action>
59
- >(({ className, ...props }, ref) => (
60
- <ToastPrimitives.Action
61
- ref={ref}
62
- className={cn(
63
- "inline-flex h-8 shrink-0 items-center justify-center rounded-lg border border-muted bg-transparent px-3 text-xs font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
64
- className
65
- )}
66
- {...props}
67
- />
68
- ));
69
- ToastAction.displayName = ToastPrimitives.Action.displayName;
70
-
71
- const ToastClose = React.forwardRef<
72
- React.ElementRef<typeof ToastPrimitives.Close>,
73
- React.ComponentPropsWithoutRef<typeof ToastPrimitives.Close>
74
- >(({ className, ...props }, ref) => (
75
- <ToastPrimitives.Close
76
- ref={ref}
77
- className={cn(
78
- "absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-white group-[.destructive]:opacity-100 group-[.destructive]:hover:text-white group-[.destructive]:focus:ring-white/50 group-[.destructive]:focus:ring-offset-destructive",
79
- className
80
- )}
81
- toast-close=""
82
- {...props}
83
- >
84
- <X className="h-4 w-4" />
85
- </ToastPrimitives.Close>
86
- ));
87
- ToastClose.displayName = ToastPrimitives.Close.displayName;
88
-
89
- const ToastTitle = React.forwardRef<
90
- React.ElementRef<typeof ToastPrimitives.Title>,
91
- React.ComponentPropsWithoutRef<typeof ToastPrimitives.Title>
92
- >(({ className, ...props }, ref) => (
93
- <ToastPrimitives.Title
94
- ref={ref}
95
- className={cn(
96
- "text-sm font-semibold group-[.destructive]:text-destructive-foreground",
97
- className
98
- )}
99
- {...props}
100
- />
101
- ));
102
- ToastTitle.displayName = ToastPrimitives.Title.displayName;
103
-
104
- const ToastDescription = React.forwardRef<
105
- React.ElementRef<typeof ToastPrimitives.Description>,
106
- React.ComponentPropsWithoutRef<typeof ToastPrimitives.Description>
107
- >(({ className, ...props }, ref) => (
108
- <ToastPrimitives.Description
109
- ref={ref}
110
- className={cn("text-sm opacity-90 group-[.destructive]:text-white", className)}
111
- {...props}
112
- />
113
- ));
114
- ToastDescription.displayName = ToastPrimitives.Description.displayName;
115
-
116
- type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>;
117
-
118
- type ToastActionElement = React.ReactElement<typeof ToastAction>;
119
-
120
- export {
121
- type ToastProps,
122
- type ToastActionElement,
123
- ToastProvider,
124
- ToastViewport,
125
- Toast,
126
- ToastTitle,
127
- ToastDescription,
128
- ToastClose,
129
- ToastAction,
130
- };
@@ -1,31 +0,0 @@
1
- "use client";
2
-
3
- import {
4
- Toast,
5
- ToastClose,
6
- ToastDescription,
7
- ToastProvider,
8
- ToastTitle,
9
- ToastViewport,
10
- } from "./toast";
11
- import { useToast } from "./use-toast";
12
-
13
- export function Toaster() {
14
- const { toasts } = useToast();
15
-
16
- return (
17
- <ToastProvider>
18
- {toasts.map(({ id, title, description, action, ...props }) => (
19
- <Toast key={id} {...props}>
20
- <div className="grid gap-1">
21
- {title && <ToastTitle>{title}</ToastTitle>}
22
- {description && <ToastDescription>{description}</ToastDescription>}
23
- </div>
24
- {action}
25
- <ToastClose />
26
- </Toast>
27
- ))}
28
- <ToastViewport />
29
- </ToastProvider>
30
- );
31
- }