@rovula/ui 0.0.15 → 0.0.16

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.
@@ -14,7 +14,7 @@ declare const meta: {
14
14
  fallback?: React.ReactNode;
15
15
  icon?: React.ReactNode;
16
16
  children?: React.ReactNode;
17
- size?: "sm" | "md" | "lg" | "xxs" | "xs" | undefined;
17
+ size?: "sm" | "md" | "lg" | "xs" | "xxs" | undefined;
18
18
  rounded?: "none" | "normal" | "full" | undefined;
19
19
  className?: string | undefined;
20
20
  imageClassName?: string | undefined;
@@ -27,7 +27,7 @@ declare const meta: {
27
27
  text?: string | undefined;
28
28
  icon?: React.ReactNode;
29
29
  children?: React.ReactNode;
30
- size?: "sm" | "md" | "lg" | "xxs" | "xs" | undefined;
30
+ size?: "sm" | "md" | "lg" | "xs" | "xxs" | undefined;
31
31
  rounded?: "none" | "normal" | "full" | undefined;
32
32
  className?: string | undefined;
33
33
  imageClassName?: string | undefined;
@@ -40,7 +40,7 @@ declare const meta: {
40
40
  text?: string | undefined;
41
41
  fallback?: React.ReactNode;
42
42
  children?: React.ReactNode;
43
- size?: "sm" | "md" | "lg" | "xxs" | "xs" | undefined;
43
+ size?: "sm" | "md" | "lg" | "xs" | "xxs" | undefined;
44
44
  rounded?: "none" | "normal" | "full" | undefined;
45
45
  className?: string | undefined;
46
46
  imageClassName?: string | undefined;
@@ -1,4 +1,4 @@
1
1
  export declare const avatarVariants: (props?: ({
2
- size?: "sm" | "md" | "lg" | "xxs" | "xs" | null | undefined;
2
+ size?: "sm" | "md" | "lg" | "xs" | "xxs" | null | undefined;
3
3
  rounded?: "none" | "normal" | "full" | null | undefined;
4
4
  } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
@@ -8,6 +8,7 @@ export { Checkbox } from "./components/Checkbox/Checkbox";
8
8
  export { Label } from "./components/Label/Label";
9
9
  export { Input } from "./components/Input/Input";
10
10
  export { Navbar } from "./components/Navbar";
11
+ export { default as ActionButton } from "./components/ActionButton/ActionButton";
11
12
  export { Avatar, AvatarGroup } from "./components/Avatar";
12
13
  export * from "./components/Table/Table";
13
14
  export * from "./components/DataTable/DataTable";
package/dist/index.d.ts CHANGED
@@ -176,6 +176,16 @@ type NavbarProps = {
176
176
  };
177
177
  declare const Navbar: FC<NavbarProps>;
178
178
 
179
+ declare const ActionButton: React__default.ForwardRefExoticComponent<{
180
+ title?: string | undefined;
181
+ size?: "sm" | "md" | "lg" | "xs" | undefined;
182
+ variant?: "solid" | "outline" | "icon" | undefined;
183
+ disabled?: boolean | undefined;
184
+ active?: boolean | undefined;
185
+ children?: React__default.ReactNode;
186
+ className?: string | undefined;
187
+ } & React__default.ButtonHTMLAttributes<HTMLButtonElement> & React__default.RefAttributes<HTMLButtonElement>>;
188
+
179
189
  type BaseAvatarProps = {
180
190
  imageUrl?: string;
181
191
  text?: string;
@@ -281,4 +291,4 @@ declare const getTimestampUTC: (date: Date) => number;
281
291
 
282
292
  declare function cn(...inputs: ClassValue[]): string;
283
293
 
284
- export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, Button, type ButtonProps, Checkbox, DataTable, type DataTableProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Dropdown, type DropdownProps, Input, type InputProps, Label, Navbar, type NavbarProps, type Options, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, Text, TextInput, cn, getEndDateOfDay, getStartDateOfDay, getStartEndTimestampOfDay, getTimestampUTC, resloveTimestamp };
294
+ export { ActionButton, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, Button, type ButtonProps, Checkbox, DataTable, type DataTableProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Dropdown, type DropdownProps, Input, type InputProps, Label, Navbar, type NavbarProps, type Options, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, Text, TextInput, cn, getEndDateOfDay, getStartDateOfDay, getStartEndTimestampOfDay, getTimestampUTC, resloveTimestamp };
package/dist/index.js CHANGED
@@ -10,6 +10,7 @@ export { Checkbox } from "./components/Checkbox/Checkbox";
10
10
  export { Label } from "./components/Label/Label";
11
11
  export { Input } from "./components/Input/Input";
12
12
  export { Navbar } from "./components/Navbar";
13
+ export { default as ActionButton } from "./components/ActionButton/ActionButton";
13
14
  export { Avatar, AvatarGroup } from "./components/Avatar";
14
15
  export * from "./components/Table/Table";
15
16
  export * from "./components/DataTable/DataTable";
@@ -628,28 +628,44 @@ video {
628
628
  /* #161C24 */
629
629
  --grey-default: var(--grey-100);
630
630
  --grey-foreground: var(--white);
631
+ --info-lighter: 208 242 255;
632
+ --info-light: 116 202 255;
631
633
  --info-100: 41 152 255;
632
634
  /* #2998FF */
633
635
  --info-120: 33 122 204;
634
636
  /* #217ACC */
637
+ --info-dark: 12 83 183;
638
+ --info-darker: 4 41 122;
635
639
  --info-default: var(--info-100);
636
640
  --info-foreground: var(--white);
641
+ --success-lighter: 233 252 212;
642
+ --success-light: 170 242 127;
637
643
  --success-100: 84 214 44;
638
644
  /* #54D62C */
639
645
  --success-120: 67 171 35;
640
646
  /* #43AB23 */
647
+ --success-dark: 34 154 22;
648
+ --success-darker:8 102 13;
641
649
  --success-default: var(--success-100);
642
650
  --success-foreground: var(--white);
651
+ --warning-lighter: 255 247 205;
652
+ --warning-light:255 225 106;
643
653
  --warning-100: 255 193 7;
644
654
  /* #FFC107 */
645
655
  --warning-120: 204 154 6;
646
656
  /* #CC9A06 */
657
+ --warning-dark: 183 129 3;
658
+ --warning-darker: 122 79 1;
647
659
  --warning-default: var(--warning-100);
648
660
  --warning-foreground: var(--white);
661
+ --error-lighter: 255 231 217;
662
+ --error-light: 255 164 141;
649
663
  --error-100: 255 77 53;
650
664
  /* #FF4D35 */
651
665
  --error-120: 204 62 42;
652
666
  /* #CC3E2A */
667
+ --error-dark: 183 33 54;
668
+ --error-darker: 122 12 46;
653
669
  --error-default: var(--error-100);
654
670
  --error-foreground: var(--white);
655
671
  --main-transparent-primary: 1 1 68;
@@ -108,23 +108,39 @@
108
108
  --grey-default: var(--grey-100);
109
109
  --grey-foreground: var(--white);
110
110
 
111
+ --info-lighter: 208 242 255;
112
+ --info-light: 116 202 255;
111
113
  --info-100: 41 152 255; /* #2998FF */
112
114
  --info-120: 33 122 204; /* #217ACC */
115
+ --info-dark: 12 83 183;
116
+ --info-darker: 4 41 122;
113
117
  --info-default: var(--info-100);
114
118
  --info-foreground: var(--white);
115
119
 
120
+ --success-lighter: 233 252 212;
121
+ --success-light: 170 242 127;
116
122
  --success-100: 84 214 44; /* #54D62C */
117
123
  --success-120: 67 171 35; /* #43AB23 */
124
+ --success-dark: 34 154 22;
125
+ --success-darker:8 102 13;
118
126
  --success-default: var(--success-100);
119
127
  --success-foreground: var(--white);
120
128
 
129
+ --warning-lighter: 255 247 205;
130
+ --warning-light:255 225 106;
121
131
  --warning-100: 255 193 7; /* #FFC107 */
122
132
  --warning-120: 204 154 6; /* #CC9A06 */
133
+ --warning-dark: 183 129 3;
134
+ --warning-darker: 122 79 1;
123
135
  --warning-default: var(--warning-100);
124
136
  --warning-foreground: var(--white);
125
137
 
138
+ --error-lighter: 255 231 217;
139
+ --error-light: 255 164 141;
126
140
  --error-100: 255 77 53; /* #FF4D35 */
127
141
  --error-120: 204 62 42; /* #CC3E2A */
142
+ --error-dark: 183 33 54;
143
+ --error-darker: 122 12 46;
128
144
  --error-default: var(--error-100);
129
145
  --error-foreground: var(--white);
130
146
 
@@ -118,26 +118,42 @@ module.exports = {
118
118
  foreground: "rgb(var(--grey2-foreground) / <alpha-value>)",
119
119
  },
120
120
  info: {
121
+ lighter: "rgb(var(--info-lighter)) / <alpha-value>)",
122
+ light: "rgb(var(--info-light)) / <alpha-value>)",
121
123
  100: "rgb(var(--info-100)) / <alpha-value>)",
122
124
  120: "rgb(var(--info-120)) / <alpha-value>)",
125
+ dark: "rgb(var(--info-dark)) / <alpha-value>)",
126
+ darker: "rgb(var(--info-darker)) / <alpha-value>)",
123
127
  DEFAULT: "rgb(var(--info-default) / <alpha-value>)",
124
128
  foreground: "rgb(var(--info-foreground) / <alpha-value>)",
125
129
  },
126
130
  success: {
131
+ lighter: "rgb(var(--success-lighter)) / <alpha-value>)",
132
+ light: "rgb(var(--success-light)) / <alpha-value>)",
127
133
  100: "rgb(var(--success-100)) / <alpha-value>)",
128
134
  120: "rgb(var(--success-120)) / <alpha-value>)",
135
+ dark: "rgb(var(--success-dark)) / <alpha-value>)",
136
+ darker: "rgb(var(--success-darker)) / <alpha-value>)",
129
137
  DEFAULT: "rgb(var(--success-default) / <alpha-value>)",
130
138
  foreground: "rgb(var(--success-foreground) / <alpha-value>)",
131
139
  },
132
140
  warning: {
141
+ lighter: "rgb(var(--warning-lighter)) / <alpha-value>)",
142
+ light: "rgb(var(--warning-light)) / <alpha-value>)",
133
143
  100: "rgb(var(--warning-100) / <alpha-value>)",
134
144
  120: "rgb(var(--warning-120) / <alpha-value>)",
145
+ dark: "rgb(var(--warning-dark)) / <alpha-value>)",
146
+ darker: "rgb(var(--warning-darker)) / <alpha-value>)",
135
147
  DEFAULT: "rgb(var(--warning-default) / <alpha-value>)",
136
148
  foreground: "rgb(var(--warning-foreground) / <alpha-value>)",
137
149
  },
138
150
  error: {
151
+ lighter: "rgb(var(--error-lighter)) / <alpha-value>)",
152
+ light: "rgb(var(--error-light)) / <alpha-value>)",
139
153
  100: "rgb(var(--error-100) / <alpha-value>)",
140
154
  120: "rgb(var(--error-120) / <alpha-value>)",
155
+ dark: "rgb(var(--error-dark)) / <alpha-value>)",
156
+ darker: "rgb(var(--error-darker)) / <alpha-value>)",
141
157
  DEFAULT: "rgb(var(--error-100) / <alpha-value>)",
142
158
  foreground: "rgb(var(--error-foreground) / <alpha-value>)",
143
159
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rovula/ui",
3
- "version": "0.0.15",
3
+ "version": "0.0.16",
4
4
  "main": "dist/cjs/bundle.js",
5
5
  "module": "dist/esm/bundle.js",
6
6
  "types": "dist/index.d.ts",
@@ -1,5 +1,3 @@
1
- "use-client";
2
-
3
1
  import { cn } from "@/utils/cn";
4
2
  import React, { forwardRef } from "react";
5
3
  import { actionButtonVariants } from "./ActionButton.styles";
package/src/index.ts CHANGED
@@ -10,6 +10,7 @@ export { Checkbox } from "./components/Checkbox/Checkbox";
10
10
  export { Label } from "./components/Label/Label";
11
11
  export { Input } from "./components/Input/Input";
12
12
  export { Navbar } from "./components/Navbar";
13
+ export { default as ActionButton } from "./components/ActionButton/ActionButton";
13
14
  export { Avatar, AvatarGroup } from "./components/Avatar";
14
15
  export * from "./components/Table/Table";
15
16
  export * from "./components/DataTable/DataTable";
@@ -108,23 +108,39 @@
108
108
  --grey-default: var(--grey-100);
109
109
  --grey-foreground: var(--white);
110
110
 
111
+ --info-lighter: 208 242 255;
112
+ --info-light: 116 202 255;
111
113
  --info-100: 41 152 255; /* #2998FF */
112
114
  --info-120: 33 122 204; /* #217ACC */
115
+ --info-dark: 12 83 183;
116
+ --info-darker: 4 41 122;
113
117
  --info-default: var(--info-100);
114
118
  --info-foreground: var(--white);
115
119
 
120
+ --success-lighter: 233 252 212;
121
+ --success-light: 170 242 127;
116
122
  --success-100: 84 214 44; /* #54D62C */
117
123
  --success-120: 67 171 35; /* #43AB23 */
124
+ --success-dark: 34 154 22;
125
+ --success-darker:8 102 13;
118
126
  --success-default: var(--success-100);
119
127
  --success-foreground: var(--white);
120
128
 
129
+ --warning-lighter: 255 247 205;
130
+ --warning-light:255 225 106;
121
131
  --warning-100: 255 193 7; /* #FFC107 */
122
132
  --warning-120: 204 154 6; /* #CC9A06 */
133
+ --warning-dark: 183 129 3;
134
+ --warning-darker: 122 79 1;
123
135
  --warning-default: var(--warning-100);
124
136
  --warning-foreground: var(--white);
125
137
 
138
+ --error-lighter: 255 231 217;
139
+ --error-light: 255 164 141;
126
140
  --error-100: 255 77 53; /* #FF4D35 */
127
141
  --error-120: 204 62 42; /* #CC3E2A */
142
+ --error-dark: 183 33 54;
143
+ --error-darker: 122 12 46;
128
144
  --error-default: var(--error-100);
129
145
  --error-foreground: var(--white);
130
146
 
@@ -118,26 +118,42 @@ module.exports = {
118
118
  foreground: "rgb(var(--grey2-foreground) / <alpha-value>)",
119
119
  },
120
120
  info: {
121
+ lighter: "rgb(var(--info-lighter)) / <alpha-value>)",
122
+ light: "rgb(var(--info-light)) / <alpha-value>)",
121
123
  100: "rgb(var(--info-100)) / <alpha-value>)",
122
124
  120: "rgb(var(--info-120)) / <alpha-value>)",
125
+ dark: "rgb(var(--info-dark)) / <alpha-value>)",
126
+ darker: "rgb(var(--info-darker)) / <alpha-value>)",
123
127
  DEFAULT: "rgb(var(--info-default) / <alpha-value>)",
124
128
  foreground: "rgb(var(--info-foreground) / <alpha-value>)",
125
129
  },
126
130
  success: {
131
+ lighter: "rgb(var(--success-lighter)) / <alpha-value>)",
132
+ light: "rgb(var(--success-light)) / <alpha-value>)",
127
133
  100: "rgb(var(--success-100)) / <alpha-value>)",
128
134
  120: "rgb(var(--success-120)) / <alpha-value>)",
135
+ dark: "rgb(var(--success-dark)) / <alpha-value>)",
136
+ darker: "rgb(var(--success-darker)) / <alpha-value>)",
129
137
  DEFAULT: "rgb(var(--success-default) / <alpha-value>)",
130
138
  foreground: "rgb(var(--success-foreground) / <alpha-value>)",
131
139
  },
132
140
  warning: {
141
+ lighter: "rgb(var(--warning-lighter)) / <alpha-value>)",
142
+ light: "rgb(var(--warning-light)) / <alpha-value>)",
133
143
  100: "rgb(var(--warning-100) / <alpha-value>)",
134
144
  120: "rgb(var(--warning-120) / <alpha-value>)",
145
+ dark: "rgb(var(--warning-dark)) / <alpha-value>)",
146
+ darker: "rgb(var(--warning-darker)) / <alpha-value>)",
135
147
  DEFAULT: "rgb(var(--warning-default) / <alpha-value>)",
136
148
  foreground: "rgb(var(--warning-foreground) / <alpha-value>)",
137
149
  },
138
150
  error: {
151
+ lighter: "rgb(var(--error-lighter)) / <alpha-value>)",
152
+ light: "rgb(var(--error-light)) / <alpha-value>)",
139
153
  100: "rgb(var(--error-100) / <alpha-value>)",
140
154
  120: "rgb(var(--error-120) / <alpha-value>)",
155
+ dark: "rgb(var(--error-dark)) / <alpha-value>)",
156
+ darker: "rgb(var(--error-darker)) / <alpha-value>)",
141
157
  DEFAULT: "rgb(var(--error-100) / <alpha-value>)",
142
158
  foreground: "rgb(var(--error-foreground) / <alpha-value>)",
143
159
  },