@altimateai/ui-components 0.0.1-beta.5 → 0.0.1-beta.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 (33) hide show
  1. package/dist/CoachForm.js +1 -1
  2. package/dist/storybook/Accordion.stories.tsx +52 -52
  3. package/dist/storybook/Alert.stories.tsx +61 -61
  4. package/dist/storybook/AlertDialog.stories.tsx +161 -161
  5. package/dist/storybook/Avatar.stories.tsx +58 -58
  6. package/dist/storybook/Badge.stories.tsx +36 -36
  7. package/dist/storybook/Button.stories.tsx +109 -109
  8. package/dist/storybook/Card.stories.tsx +69 -69
  9. package/dist/storybook/Checkbox.stories.tsx +65 -65
  10. package/dist/storybook/Command.stories.tsx +35 -35
  11. package/dist/storybook/DropdownMenu.stories.tsx +36 -36
  12. package/dist/storybook/Form.stories.tsx +114 -114
  13. package/dist/storybook/HoverCard.stories.tsx +99 -99
  14. package/dist/storybook/Input.stories.tsx +53 -53
  15. package/dist/storybook/Label.stories.tsx +42 -42
  16. package/dist/storybook/Menubar.stories.tsx +159 -159
  17. package/dist/storybook/Pagination.stories.tsx +152 -152
  18. package/dist/storybook/Popover.stories.tsx +23 -23
  19. package/dist/storybook/Progress.stories.tsx +89 -89
  20. package/dist/storybook/RadioGroup.stories.tsx +58 -58
  21. package/dist/storybook/Resizable.stories.tsx +119 -119
  22. package/dist/storybook/ScrollArea.stories.tsx +101 -101
  23. package/dist/storybook/Select.stories.tsx +95 -95
  24. package/dist/storybook/Sheet.stories.tsx +69 -69
  25. package/dist/storybook/Sidebar.stories.tsx +97 -97
  26. package/dist/storybook/Slider.stories.tsx +79 -79
  27. package/dist/storybook/Switch.stories.tsx +90 -90
  28. package/dist/storybook/Textarea.stories.tsx +50 -50
  29. package/dist/storybook/Toast.stories.tsx +107 -107
  30. package/dist/storybook/Tooltip.stories.tsx +28 -28
  31. package/dist/storybook/Typography.stories.tsx +178 -178
  32. package/package.json +2 -2
  33. package/readme.md +11 -11
package/dist/CoachForm.js CHANGED
@@ -33646,7 +33646,7 @@ ${n}
33646
33646
  urls: {
33647
33647
  origin: localStorage.getItem("agent_origin") || "",
33648
33648
  askPath: localStorage.getItem("agent_ask") || "",
33649
- proceedPath: localStorage.getItem("agent_ask") || ""
33649
+ proceedPath: localStorage.getItem("agent_proceed") || ""
33650
33650
  },
33651
33651
  children: /* @__PURE__ */ z.jsx("div", { children: /* @__PURE__ */ z.jsx(
33652
33652
  A5,
@@ -1,52 +1,52 @@
1
- import type { Meta, StoryObj } from "@storybook/react";
2
- import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "../shadcn";
3
-
4
- const meta: Meta<typeof Accordion> = {
5
- title: "Shadcn/Components/Accordion",
6
- component: Accordion,
7
- };
8
-
9
- export default meta;
10
- type Story = StoryObj<typeof Accordion>;
11
-
12
- export const Default: Story = {
13
- render: () => (
14
- <Accordion type="single" collapsible className="al-w-full">
15
- <AccordionItem value="item-1">
16
- <AccordionTrigger>Is it accessible?</AccordionTrigger>
17
- <AccordionContent>Yes. It adheres to the WAI-ARIA design pattern.</AccordionContent>
18
- </AccordionItem>
19
- <AccordionItem value="item-2">
20
- <AccordionTrigger>Is it styled?</AccordionTrigger>
21
- <AccordionContent>
22
- Yes. It comes with default styles that matches the other components&apos; aesthetic.
23
- </AccordionContent>
24
- </AccordionItem>
25
- <AccordionItem value="item-3">
26
- <AccordionTrigger>Is it animated?</AccordionTrigger>
27
- <AccordionContent>
28
- Yes. It&apos;s animated by default, but you can disable it if you prefer.
29
- </AccordionContent>
30
- </AccordionItem>
31
- </Accordion>
32
- ),
33
- };
34
-
35
- export const Multiple: Story = {
36
- render: () => (
37
- <Accordion type="multiple" className="al-w-full">
38
- <AccordionItem value="item-1">
39
- <AccordionTrigger>Can I open multiple items?</AccordionTrigger>
40
- <AccordionContent>
41
- Yes. Just set the type prop to &quot;multiple&quot; on the Accordion component.
42
- </AccordionContent>
43
- </AccordionItem>
44
- <AccordionItem value="item-2">
45
- <AccordionTrigger>Can I customize the styling?</AccordionTrigger>
46
- <AccordionContent>
47
- Yes. The component accepts className props for customization.
48
- </AccordionContent>
49
- </AccordionItem>
50
- </Accordion>
51
- ),
52
- };
1
+ import type { Meta, StoryObj } from "@storybook/react";
2
+ import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "../shadcn";
3
+
4
+ const meta: Meta<typeof Accordion> = {
5
+ title: "Shadcn/Components/Accordion",
6
+ component: Accordion,
7
+ };
8
+
9
+ export default meta;
10
+ type Story = StoryObj<typeof Accordion>;
11
+
12
+ export const Default: Story = {
13
+ render: () => (
14
+ <Accordion type="single" collapsible className="al-w-full">
15
+ <AccordionItem value="item-1">
16
+ <AccordionTrigger>Is it accessible?</AccordionTrigger>
17
+ <AccordionContent>Yes. It adheres to the WAI-ARIA design pattern.</AccordionContent>
18
+ </AccordionItem>
19
+ <AccordionItem value="item-2">
20
+ <AccordionTrigger>Is it styled?</AccordionTrigger>
21
+ <AccordionContent>
22
+ Yes. It comes with default styles that matches the other components&apos; aesthetic.
23
+ </AccordionContent>
24
+ </AccordionItem>
25
+ <AccordionItem value="item-3">
26
+ <AccordionTrigger>Is it animated?</AccordionTrigger>
27
+ <AccordionContent>
28
+ Yes. It&apos;s animated by default, but you can disable it if you prefer.
29
+ </AccordionContent>
30
+ </AccordionItem>
31
+ </Accordion>
32
+ ),
33
+ };
34
+
35
+ export const Multiple: Story = {
36
+ render: () => (
37
+ <Accordion type="multiple" className="al-w-full">
38
+ <AccordionItem value="item-1">
39
+ <AccordionTrigger>Can I open multiple items?</AccordionTrigger>
40
+ <AccordionContent>
41
+ Yes. Just set the type prop to &quot;multiple&quot; on the Accordion component.
42
+ </AccordionContent>
43
+ </AccordionItem>
44
+ <AccordionItem value="item-2">
45
+ <AccordionTrigger>Can I customize the styling?</AccordionTrigger>
46
+ <AccordionContent>
47
+ Yes. The component accepts className props for customization.
48
+ </AccordionContent>
49
+ </AccordionItem>
50
+ </Accordion>
51
+ ),
52
+ };
@@ -1,61 +1,61 @@
1
- import { Meta, StoryFn } from "@storybook/react";
2
- import { Alert, AlertTitle, AlertDescription } from "../shadcn";
3
- import { InfoCircleIcon } from "@ac-assets/icons";
4
-
5
- export default {
6
- title: "Shadcn/Components/Alert",
7
- component: Alert,
8
- argTypes: {
9
- variant: {
10
- control: "select",
11
- options: ["default", "destructive"],
12
- },
13
- },
14
- } as Meta;
15
-
16
- const Template: StoryFn = args => (
17
- <Alert {...args}>
18
- <AlertTitle>Heads up!</AlertTitle>
19
- <AlertDescription>
20
- You can add components and dependencies to your app using the cli.
21
- </AlertDescription>
22
- </Alert>
23
- );
24
-
25
- export const Default = Template.bind({});
26
- Default.args = {
27
- variant: "default",
28
- };
29
-
30
- export const Destructive = Template.bind({});
31
- Destructive.args = {
32
- variant: "destructive",
33
- };
34
-
35
- export const WithIcon: StoryFn = () => (
36
- <Alert>
37
- <InfoCircleIcon className="al-h-4 al-w-4" />
38
- <AlertTitle>Info Alert</AlertTitle>
39
- <AlertDescription>This is an informational alert with an icon.</AlertDescription>
40
- </Alert>
41
- );
42
-
43
- export const DestructiveWithIcon: StoryFn = () => (
44
- <Alert variant="destructive">
45
- <InfoCircleIcon className="al-h-4 al-w-4" />
46
- <AlertTitle>Error Alert</AlertTitle>
47
- <AlertDescription>Something went wrong! Please try again later.</AlertDescription>
48
- </Alert>
49
- );
50
-
51
- export const TitleOnly: StoryFn = () => (
52
- <Alert>
53
- <AlertTitle>Simple Alert with Title Only</AlertTitle>
54
- </Alert>
55
- );
56
-
57
- export const DescriptionOnly: StoryFn = () => (
58
- <Alert>
59
- <AlertDescription>Simple Alert with Description Only</AlertDescription>
60
- </Alert>
61
- );
1
+ import { Meta, StoryFn } from "@storybook/react";
2
+ import { Alert, AlertTitle, AlertDescription } from "../shadcn";
3
+ import { InfoCircleIcon } from "@ac-assets/icons";
4
+
5
+ export default {
6
+ title: "Shadcn/Components/Alert",
7
+ component: Alert,
8
+ argTypes: {
9
+ variant: {
10
+ control: "select",
11
+ options: ["default", "destructive"],
12
+ },
13
+ },
14
+ } as Meta;
15
+
16
+ const Template: StoryFn = args => (
17
+ <Alert {...args}>
18
+ <AlertTitle>Heads up!</AlertTitle>
19
+ <AlertDescription>
20
+ You can add components and dependencies to your app using the cli.
21
+ </AlertDescription>
22
+ </Alert>
23
+ );
24
+
25
+ export const Default = Template.bind({});
26
+ Default.args = {
27
+ variant: "default",
28
+ };
29
+
30
+ export const Destructive = Template.bind({});
31
+ Destructive.args = {
32
+ variant: "destructive",
33
+ };
34
+
35
+ export const WithIcon: StoryFn = () => (
36
+ <Alert>
37
+ <InfoCircleIcon className="al-h-4 al-w-4" />
38
+ <AlertTitle>Info Alert</AlertTitle>
39
+ <AlertDescription>This is an informational alert with an icon.</AlertDescription>
40
+ </Alert>
41
+ );
42
+
43
+ export const DestructiveWithIcon: StoryFn = () => (
44
+ <Alert variant="destructive">
45
+ <InfoCircleIcon className="al-h-4 al-w-4" />
46
+ <AlertTitle>Error Alert</AlertTitle>
47
+ <AlertDescription>Something went wrong! Please try again later.</AlertDescription>
48
+ </Alert>
49
+ );
50
+
51
+ export const TitleOnly: StoryFn = () => (
52
+ <Alert>
53
+ <AlertTitle>Simple Alert with Title Only</AlertTitle>
54
+ </Alert>
55
+ );
56
+
57
+ export const DescriptionOnly: StoryFn = () => (
58
+ <Alert>
59
+ <AlertDescription>Simple Alert with Description Only</AlertDescription>
60
+ </Alert>
61
+ );
@@ -1,161 +1,161 @@
1
- import { Meta, StoryFn } from "@storybook/react";
2
- import {
3
- AlertDialog,
4
- AlertDialogTrigger,
5
- AlertDialogContent,
6
- AlertDialogHeader,
7
- AlertDialogFooter,
8
- AlertDialogTitle,
9
- AlertDialogDescription,
10
- AlertDialogAction,
11
- AlertDialogCancel,
12
- } from "../shadcn";
13
-
14
- export default {
15
- title: "Shadcn/Components/AlertDialog",
16
- component: AlertDialog,
17
- } as Meta;
18
-
19
- const Template: StoryFn = () => (
20
- <AlertDialog>
21
- <AlertDialogTrigger>Open Dialog</AlertDialogTrigger>
22
- <AlertDialogContent>
23
- <AlertDialogHeader>
24
- <AlertDialogTitle>Are you absolutely sure?</AlertDialogTitle>
25
- <AlertDialogDescription>
26
- This action cannot be undone. This will permanently delete your account and remove your
27
- data from our servers.
28
- </AlertDialogDescription>
29
- </AlertDialogHeader>
30
- <AlertDialogFooter>
31
- <AlertDialogCancel>Cancel</AlertDialogCancel>
32
- <AlertDialogAction>Continue</AlertDialogAction>
33
- </AlertDialogFooter>
34
- </AlertDialogContent>
35
- </AlertDialog>
36
- );
37
-
38
- export const Default = Template.bind({});
39
-
40
- export const DestructiveAction: StoryFn = () => (
41
- <AlertDialog>
42
- <AlertDialogTrigger className="al-bg-destructive al-text-destructive-foreground hover:al-bg-destructive/90 al-h-10 al-px-4 al-py-2 al-rounded-md">
43
- Delete Account
44
- </AlertDialogTrigger>
45
- <AlertDialogContent>
46
- <AlertDialogHeader>
47
- <AlertDialogTitle>Delete Account</AlertDialogTitle>
48
- <AlertDialogDescription>
49
- This will permanently delete your account and remove all your data. This action cannot be
50
- undone.
51
- </AlertDialogDescription>
52
- </AlertDialogHeader>
53
- <AlertDialogFooter>
54
- <AlertDialogCancel>Cancel</AlertDialogCancel>
55
- <AlertDialogAction className="al-bg-destructive al-text-destructive-foreground hover:al-bg-destructive/90">
56
- Delete
57
- </AlertDialogAction>
58
- </AlertDialogFooter>
59
- </AlertDialogContent>
60
- </AlertDialog>
61
- );
62
-
63
- export const WithCustomTrigger: StoryFn = () => (
64
- <AlertDialog>
65
- <AlertDialogTrigger asChild>
66
- <button className="al-rounded-full al-bg-primary al-p-2">
67
- <span className="al-sr-only">Open Dialog</span>
68
- <svg
69
- width="24"
70
- height="24"
71
- viewBox="0 0 24 24"
72
- fill="none"
73
- stroke="currentColor"
74
- strokeWidth="2"
75
- strokeLinecap="round"
76
- strokeLinejoin="round"
77
- >
78
- <path d="M3 6h18" />
79
- <path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6" />
80
- <path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2" />
81
- </svg>
82
- </button>
83
- </AlertDialogTrigger>
84
- <AlertDialogContent>
85
- <AlertDialogHeader>
86
- <AlertDialogTitle>Delete Item</AlertDialogTitle>
87
- <AlertDialogDescription>Are you sure you want to delete this item?</AlertDialogDescription>
88
- </AlertDialogHeader>
89
- <AlertDialogFooter>
90
- <AlertDialogCancel>Cancel</AlertDialogCancel>
91
- <AlertDialogAction>Delete</AlertDialogAction>
92
- </AlertDialogFooter>
93
- </AlertDialogContent>
94
- </AlertDialog>
95
- );
96
-
97
- export const WithForm: StoryFn = () => (
98
- <AlertDialog>
99
- <AlertDialogTrigger>Unsubscribe</AlertDialogTrigger>
100
- <AlertDialogContent>
101
- <AlertDialogHeader>
102
- <AlertDialogTitle>Unsubscribe from Newsletter</AlertDialogTitle>
103
- <AlertDialogDescription>
104
- Please tell us why you&apos;re unsubscribing:
105
- </AlertDialogDescription>
106
- </AlertDialogHeader>
107
- <div className="al-grid al-gap-4 al-py-4">
108
- <div className="al-grid al-gap-2">
109
- <label htmlFor="reason" className="al-text-sm al-font-medium al-leading-none">
110
- Reason
111
- </label>
112
- <select
113
- id="reason"
114
- className="al-flex al-h-10 al-w-full al-rounded-md al-border al-border-input al-bg-background al-px-3 al-py-2 al-text-sm al-ring-offset-background"
115
- >
116
- <option>Too many emails</option>
117
- <option>Content not relevant</option>
118
- <option>Other</option>
119
- </select>
120
- </div>
121
- </div>
122
- <AlertDialogFooter>
123
- <AlertDialogCancel>Cancel</AlertDialogCancel>
124
- <AlertDialogAction>Confirm</AlertDialogAction>
125
- </AlertDialogFooter>
126
- </AlertDialogContent>
127
- </AlertDialog>
128
- );
129
-
130
- export const LongContent: StoryFn = () => (
131
- <AlertDialog>
132
- <AlertDialogTrigger>Show Terms</AlertDialogTrigger>
133
- <AlertDialogContent className="al-max-h-[90vh] al-overflow-y-auto">
134
- <AlertDialogHeader>
135
- <AlertDialogTitle>Terms of Service</AlertDialogTitle>
136
- <AlertDialogDescription className="al-whitespace-pre-line">
137
- {`Please read these terms carefully before using our service.
138
-
139
- 1. Introduction
140
- These terms and conditions govern your use of our service.
141
-
142
- 2. Acceptance of Terms
143
- By accessing or using our service, you agree to be bound by these terms.
144
-
145
- 3. Privacy Policy
146
- Your privacy is important to us. Please review our privacy policy.
147
-
148
- 4. User Obligations
149
- You agree to use our service in accordance with these terms.
150
-
151
- 5. Termination
152
- We reserve the right to terminate your access to our service.`}
153
- </AlertDialogDescription>
154
- </AlertDialogHeader>
155
- <AlertDialogFooter>
156
- <AlertDialogCancel>Decline</AlertDialogCancel>
157
- <AlertDialogAction>Accept</AlertDialogAction>
158
- </AlertDialogFooter>
159
- </AlertDialogContent>
160
- </AlertDialog>
161
- );
1
+ import { Meta, StoryFn } from "@storybook/react";
2
+ import {
3
+ AlertDialog,
4
+ AlertDialogTrigger,
5
+ AlertDialogContent,
6
+ AlertDialogHeader,
7
+ AlertDialogFooter,
8
+ AlertDialogTitle,
9
+ AlertDialogDescription,
10
+ AlertDialogAction,
11
+ AlertDialogCancel,
12
+ } from "../shadcn";
13
+
14
+ export default {
15
+ title: "Shadcn/Components/AlertDialog",
16
+ component: AlertDialog,
17
+ } as Meta;
18
+
19
+ const Template: StoryFn = () => (
20
+ <AlertDialog>
21
+ <AlertDialogTrigger>Open Dialog</AlertDialogTrigger>
22
+ <AlertDialogContent>
23
+ <AlertDialogHeader>
24
+ <AlertDialogTitle>Are you absolutely sure?</AlertDialogTitle>
25
+ <AlertDialogDescription>
26
+ This action cannot be undone. This will permanently delete your account and remove your
27
+ data from our servers.
28
+ </AlertDialogDescription>
29
+ </AlertDialogHeader>
30
+ <AlertDialogFooter>
31
+ <AlertDialogCancel>Cancel</AlertDialogCancel>
32
+ <AlertDialogAction>Continue</AlertDialogAction>
33
+ </AlertDialogFooter>
34
+ </AlertDialogContent>
35
+ </AlertDialog>
36
+ );
37
+
38
+ export const Default = Template.bind({});
39
+
40
+ export const DestructiveAction: StoryFn = () => (
41
+ <AlertDialog>
42
+ <AlertDialogTrigger className="al-bg-destructive al-text-destructive-foreground hover:al-bg-destructive/90 al-h-10 al-px-4 al-py-2 al-rounded-md">
43
+ Delete Account
44
+ </AlertDialogTrigger>
45
+ <AlertDialogContent>
46
+ <AlertDialogHeader>
47
+ <AlertDialogTitle>Delete Account</AlertDialogTitle>
48
+ <AlertDialogDescription>
49
+ This will permanently delete your account and remove all your data. This action cannot be
50
+ undone.
51
+ </AlertDialogDescription>
52
+ </AlertDialogHeader>
53
+ <AlertDialogFooter>
54
+ <AlertDialogCancel>Cancel</AlertDialogCancel>
55
+ <AlertDialogAction className="al-bg-destructive al-text-destructive-foreground hover:al-bg-destructive/90">
56
+ Delete
57
+ </AlertDialogAction>
58
+ </AlertDialogFooter>
59
+ </AlertDialogContent>
60
+ </AlertDialog>
61
+ );
62
+
63
+ export const WithCustomTrigger: StoryFn = () => (
64
+ <AlertDialog>
65
+ <AlertDialogTrigger asChild>
66
+ <button className="al-rounded-full al-bg-primary al-p-2">
67
+ <span className="al-sr-only">Open Dialog</span>
68
+ <svg
69
+ width="24"
70
+ height="24"
71
+ viewBox="0 0 24 24"
72
+ fill="none"
73
+ stroke="currentColor"
74
+ strokeWidth="2"
75
+ strokeLinecap="round"
76
+ strokeLinejoin="round"
77
+ >
78
+ <path d="M3 6h18" />
79
+ <path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6" />
80
+ <path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2" />
81
+ </svg>
82
+ </button>
83
+ </AlertDialogTrigger>
84
+ <AlertDialogContent>
85
+ <AlertDialogHeader>
86
+ <AlertDialogTitle>Delete Item</AlertDialogTitle>
87
+ <AlertDialogDescription>Are you sure you want to delete this item?</AlertDialogDescription>
88
+ </AlertDialogHeader>
89
+ <AlertDialogFooter>
90
+ <AlertDialogCancel>Cancel</AlertDialogCancel>
91
+ <AlertDialogAction>Delete</AlertDialogAction>
92
+ </AlertDialogFooter>
93
+ </AlertDialogContent>
94
+ </AlertDialog>
95
+ );
96
+
97
+ export const WithForm: StoryFn = () => (
98
+ <AlertDialog>
99
+ <AlertDialogTrigger>Unsubscribe</AlertDialogTrigger>
100
+ <AlertDialogContent>
101
+ <AlertDialogHeader>
102
+ <AlertDialogTitle>Unsubscribe from Newsletter</AlertDialogTitle>
103
+ <AlertDialogDescription>
104
+ Please tell us why you&apos;re unsubscribing:
105
+ </AlertDialogDescription>
106
+ </AlertDialogHeader>
107
+ <div className="al-grid al-gap-4 al-py-4">
108
+ <div className="al-grid al-gap-2">
109
+ <label htmlFor="reason" className="al-text-sm al-font-medium al-leading-none">
110
+ Reason
111
+ </label>
112
+ <select
113
+ id="reason"
114
+ className="al-flex al-h-10 al-w-full al-rounded-md al-border al-border-input al-bg-background al-px-3 al-py-2 al-text-sm al-ring-offset-background"
115
+ >
116
+ <option>Too many emails</option>
117
+ <option>Content not relevant</option>
118
+ <option>Other</option>
119
+ </select>
120
+ </div>
121
+ </div>
122
+ <AlertDialogFooter>
123
+ <AlertDialogCancel>Cancel</AlertDialogCancel>
124
+ <AlertDialogAction>Confirm</AlertDialogAction>
125
+ </AlertDialogFooter>
126
+ </AlertDialogContent>
127
+ </AlertDialog>
128
+ );
129
+
130
+ export const LongContent: StoryFn = () => (
131
+ <AlertDialog>
132
+ <AlertDialogTrigger>Show Terms</AlertDialogTrigger>
133
+ <AlertDialogContent className="al-max-h-[90vh] al-overflow-y-auto">
134
+ <AlertDialogHeader>
135
+ <AlertDialogTitle>Terms of Service</AlertDialogTitle>
136
+ <AlertDialogDescription className="al-whitespace-pre-line">
137
+ {`Please read these terms carefully before using our service.
138
+
139
+ 1. Introduction
140
+ These terms and conditions govern your use of our service.
141
+
142
+ 2. Acceptance of Terms
143
+ By accessing or using our service, you agree to be bound by these terms.
144
+
145
+ 3. Privacy Policy
146
+ Your privacy is important to us. Please review our privacy policy.
147
+
148
+ 4. User Obligations
149
+ You agree to use our service in accordance with these terms.
150
+
151
+ 5. Termination
152
+ We reserve the right to terminate your access to our service.`}
153
+ </AlertDialogDescription>
154
+ </AlertDialogHeader>
155
+ <AlertDialogFooter>
156
+ <AlertDialogCancel>Decline</AlertDialogCancel>
157
+ <AlertDialogAction>Accept</AlertDialogAction>
158
+ </AlertDialogFooter>
159
+ </AlertDialogContent>
160
+ </AlertDialog>
161
+ );