@fragment-build/ui 1.5.0 → 1.6.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.
package/README.md CHANGED
@@ -5,7 +5,7 @@
5
5
  <h1>Fragment UI (Work in Progress)</h1>
6
6
  <p>Create SaaS UIs with a simple and straightforward design system and component library</p>
7
7
  <a href="https://www.npmjs.org/package/@fragment-build/ui">
8
- <img alt="NPM package version" src="https://img.shields.io/github/package-json/v/@fragment-build/ui?label=npm&logo=npm">
8
+ <img alt="NPM package version" src="https://img.shields.io/npm/v/@fragment-build/ui?label=npm&logo=npm">
9
9
  </a>
10
10
  <a href="https://fragment-build.github.io/fragment-ui/">
11
11
  <img alt="Fragment UI Storybook" src="https://raw.githubusercontent.com/storybookjs/brand/main/badge/badge-storybook.svg">
@@ -8,7 +8,9 @@ export interface WidgetProps {
8
8
  startContent?: React.ReactNode;
9
9
  endContent?: React.ReactNode;
10
10
  };
11
- title: string;
11
+ title?: string;
12
12
  size?: 'sm' | 'md' | 'lg';
13
+ variant?: 'solid' | 'bordered' | 'light' | 'flat' | 'faded' | 'shadow' | 'ghost';
14
+ color?: 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger';
13
15
  }
14
16
  export declare const Widget: React.FC<WidgetProps>;
@@ -2,14 +2,14 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  /**
3
3
  * Primary UI component for Dashboard Widgets
4
4
  */
5
- import { tv } from "@nextui-org/react";
5
+ import { collapseAdjacentVariantBorders, colorVariants, tv } from "@nextui-org/react";
6
6
  import { Card, CardBody, CardHeader } from "../../components";
7
7
  const widget = tv({
8
8
  slots: {
9
- base: 'border-[1px] border-default-100',
9
+ base: 'px-7 py-5 gap-5',
10
10
  headerEndContent: 'ml-auto',
11
- header: 'px-7 pt-5',
12
- body: 'px-7 pb-5',
11
+ header: 'p-0',
12
+ body: 'p-0',
13
13
  },
14
14
  variants: {
15
15
  size: {
@@ -17,13 +17,293 @@ const widget = tv({
17
17
  md: 'lg:col-span-2',
18
18
  lg: 'lg:col-span-3',
19
19
  },
20
+ variant: {
21
+ solid: "border-none",
22
+ bordered: "border-small bg-transparent",
23
+ light: "bg-transparent",
24
+ flat: "border-none",
25
+ faded: "border-small",
26
+ shadow: "border-none",
27
+ ghost: "border-small bg-transparent",
28
+ },
29
+ color: {
30
+ default: "",
31
+ primary: "",
32
+ secondary: "",
33
+ success: "",
34
+ warning: "",
35
+ danger: "",
36
+ },
20
37
  },
21
38
  defaultVariants: {
22
39
  size: 'sm',
23
- }
40
+ variant: "bordered",
41
+ color: "default",
42
+ },
43
+ compoundVariants: [
44
+ // solid / color
45
+ {
46
+ variant: "solid",
47
+ color: "default",
48
+ class: colorVariants.solid.default,
49
+ },
50
+ {
51
+ variant: "solid",
52
+ color: "primary",
53
+ class: colorVariants.solid.primary,
54
+ },
55
+ {
56
+ variant: "solid",
57
+ color: "secondary",
58
+ class: colorVariants.solid.secondary,
59
+ },
60
+ {
61
+ variant: "solid",
62
+ color: "success",
63
+ class: colorVariants.solid.success,
64
+ },
65
+ {
66
+ variant: "solid",
67
+ color: "warning",
68
+ class: colorVariants.solid.warning,
69
+ },
70
+ {
71
+ variant: "solid",
72
+ color: "danger",
73
+ class: colorVariants.solid.danger,
74
+ },
75
+ // shadow / color
76
+ {
77
+ variant: "shadow",
78
+ color: "default",
79
+ class: colorVariants.shadow.default,
80
+ },
81
+ {
82
+ variant: "shadow",
83
+ color: "primary",
84
+ class: colorVariants.shadow.primary,
85
+ },
86
+ {
87
+ variant: "shadow",
88
+ color: "secondary",
89
+ class: colorVariants.shadow.secondary,
90
+ },
91
+ {
92
+ variant: "shadow",
93
+ color: "success",
94
+ class: colorVariants.shadow.success,
95
+ },
96
+ {
97
+ variant: "shadow",
98
+ color: "warning",
99
+ class: colorVariants.shadow.warning,
100
+ },
101
+ {
102
+ variant: "shadow",
103
+ color: "danger",
104
+ class: colorVariants.shadow.danger,
105
+ },
106
+ // bordered / color
107
+ {
108
+ variant: "bordered",
109
+ color: "default",
110
+ class: 'border-default-200',
111
+ },
112
+ {
113
+ variant: "bordered",
114
+ color: "primary",
115
+ class: colorVariants.bordered.primary,
116
+ },
117
+ {
118
+ variant: "bordered",
119
+ color: "secondary",
120
+ class: colorVariants.bordered.secondary,
121
+ },
122
+ {
123
+ variant: "bordered",
124
+ color: "success",
125
+ class: colorVariants.bordered.success,
126
+ },
127
+ {
128
+ variant: "bordered",
129
+ color: "warning",
130
+ class: colorVariants.bordered.warning,
131
+ },
132
+ {
133
+ variant: "bordered",
134
+ color: "danger",
135
+ class: colorVariants.bordered.danger,
136
+ },
137
+ // flat / color
138
+ {
139
+ variant: "flat",
140
+ color: "default",
141
+ class: colorVariants.flat.default,
142
+ },
143
+ {
144
+ variant: "flat",
145
+ color: "primary",
146
+ class: colorVariants.flat.primary,
147
+ },
148
+ {
149
+ variant: "flat",
150
+ color: "secondary",
151
+ class: colorVariants.flat.secondary,
152
+ },
153
+ {
154
+ variant: "flat",
155
+ color: "success",
156
+ class: colorVariants.flat.success,
157
+ },
158
+ {
159
+ variant: "flat",
160
+ color: "warning",
161
+ class: colorVariants.flat.warning,
162
+ },
163
+ {
164
+ variant: "flat",
165
+ color: "danger",
166
+ class: colorVariants.flat.danger,
167
+ },
168
+ // faded / color
169
+ {
170
+ variant: "faded",
171
+ color: "default",
172
+ class: colorVariants.faded.default,
173
+ },
174
+ {
175
+ variant: "faded",
176
+ color: "primary",
177
+ class: colorVariants.faded.primary,
178
+ },
179
+ {
180
+ variant: "faded",
181
+ color: "secondary",
182
+ class: colorVariants.faded.secondary,
183
+ },
184
+ {
185
+ variant: "faded",
186
+ color: "success",
187
+ class: colorVariants.faded.success,
188
+ },
189
+ {
190
+ variant: "faded",
191
+ color: "warning",
192
+ class: colorVariants.faded.warning,
193
+ },
194
+ {
195
+ variant: "faded",
196
+ color: "danger",
197
+ class: colorVariants.faded.danger,
198
+ },
199
+ // light / color
200
+ {
201
+ variant: "light",
202
+ color: "default",
203
+ class: [colorVariants.light.default, "data-[hover=true]:bg-default/40"],
204
+ },
205
+ {
206
+ variant: "light",
207
+ color: "primary",
208
+ class: [colorVariants.light.primary, "data-[hover=true]:bg-primary/20"],
209
+ },
210
+ {
211
+ variant: "light",
212
+ color: "secondary",
213
+ class: [colorVariants.light.secondary, "data-[hover=true]:bg-secondary/20"],
214
+ },
215
+ {
216
+ variant: "light",
217
+ color: "success",
218
+ class: [colorVariants.light.success, "data-[hover=true]:bg-success/20"],
219
+ },
220
+ {
221
+ variant: "light",
222
+ color: "warning",
223
+ class: [colorVariants.light.warning, "data-[hover=true]:bg-warning/20"],
224
+ },
225
+ {
226
+ variant: "light",
227
+ color: "danger",
228
+ class: [colorVariants.light.danger, "data-[hover=true]:bg-danger/20"],
229
+ },
230
+ // ghost / color
231
+ {
232
+ variant: "ghost",
233
+ color: "default",
234
+ class: colorVariants.ghost.default,
235
+ },
236
+ {
237
+ variant: "ghost",
238
+ color: "primary",
239
+ class: colorVariants.ghost.primary,
240
+ },
241
+ {
242
+ variant: "ghost",
243
+ color: "secondary",
244
+ class: colorVariants.ghost.secondary,
245
+ },
246
+ {
247
+ variant: "ghost",
248
+ color: "success",
249
+ class: colorVariants.ghost.success,
250
+ },
251
+ {
252
+ variant: "ghost",
253
+ color: "warning",
254
+ class: colorVariants.ghost.warning,
255
+ },
256
+ {
257
+ variant: "ghost",
258
+ color: "danger",
259
+ class: colorVariants.ghost.danger,
260
+ },
261
+ // isInGroup / bordered / ghost
262
+ {
263
+ isInGroup: true,
264
+ variant: ["ghost", "bordered"],
265
+ color: "default",
266
+ className: collapseAdjacentVariantBorders.default,
267
+ },
268
+ {
269
+ isInGroup: true,
270
+ variant: ["ghost", "bordered"],
271
+ color: "primary",
272
+ className: collapseAdjacentVariantBorders.primary,
273
+ },
274
+ {
275
+ isInGroup: true,
276
+ variant: ["ghost", "bordered"],
277
+ color: "secondary",
278
+ className: collapseAdjacentVariantBorders.secondary,
279
+ },
280
+ {
281
+ isInGroup: true,
282
+ variant: ["ghost", "bordered"],
283
+ color: "success",
284
+ className: collapseAdjacentVariantBorders.success,
285
+ },
286
+ {
287
+ isInGroup: true,
288
+ variant: ["ghost", "bordered"],
289
+ color: "warning",
290
+ className: collapseAdjacentVariantBorders.warning,
291
+ },
292
+ {
293
+ isInGroup: true,
294
+ variant: ["ghost", "bordered"],
295
+ color: "danger",
296
+ className: collapseAdjacentVariantBorders.danger,
297
+ },
298
+ // variant / hover
299
+ {
300
+ variant: ["solid", "faded", "flat", "bordered", "shadow"],
301
+ class: "data-[hover=true]:opacity-hover",
302
+ },
303
+ ],
24
304
  });
25
305
  export const Widget = ({ children, title, header, ...props }) => {
26
306
  const { base, body, header: headerClasses, headerEndContent } = widget(props);
27
- return (_jsxs(Card, { shadow: "none", classNames: { base: base(), body: body(), header: headerClasses(), }, children: [_jsxs(CardHeader, { children: [_jsx("h3", { children: title }), _jsx("div", { className: headerEndContent(), children: header?.endContent })] }), _jsx(CardBody, { children: children })] }));
307
+ return (_jsxs(Card, { shadow: "none", classNames: { base: base(), body: body(), header: headerClasses() }, children: [(title || header?.endContent) && (_jsxs(CardHeader, { children: [title && _jsx("h3", { children: title }), _jsx("div", { className: headerEndContent(), children: header?.endContent })] })), _jsx(CardBody, { children: children })] }));
28
308
  };
29
309
  //# sourceMappingURL=Widget.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Widget.js","sourceRoot":"","sources":["../../../src/fragments/widget/Widget.tsx"],"names":[],"mappings":";AAAA;;GAEG;AAEH,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAY9D,MAAM,MAAM,GAAG,EAAE,CAAC;IAChB,KAAK,EAAE;QACL,IAAI,EAAE,iCAAiC;QACvC,gBAAgB,EAAE,SAAS;QAC3B,MAAM,EAAE,WAAW;QACnB,IAAI,EAAE,WAAW;KAClB;IACD,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,EAAE,EAAE,eAAe;YACnB,EAAE,EAAE,eAAe;YACnB,EAAE,EAAE,eAAe;SACpB;KACF;IACD,eAAe,EAAE;QACf,IAAI,EAAE,IAAI;KACX;CACF,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,MAAM,GAA0B,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACrF,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,aAAa,EAAE,gBAAgB,EAAE,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAE9E,OAAO,CACL,MAAC,IAAI,IAAC,MAAM,EAAC,MAAM,EAAC,UAAU,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,MAAM,EAAE,aAAa,EAAE,GAAI,aACvF,MAAC,UAAU,eACT,uBAAK,KAAK,GAAM,EAChB,cAAK,SAAS,EAAE,gBAAgB,EAAE,YAAG,MAAM,EAAE,UAAU,GAAO,IACnD,EACb,KAAC,QAAQ,cACN,QAAQ,GACA,IACN,CACR,CAAC;AACJ,CAAC,CAAC"}
1
+ {"version":3,"file":"Widget.js","sourceRoot":"","sources":["../../../src/fragments/widget/Widget.tsx"],"names":[],"mappings":"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"}
@@ -4,3 +4,5 @@ declare const meta: Meta<typeof Widget>;
4
4
  export default meta;
5
5
  type Story = StoryObj<typeof meta>;
6
6
  export declare const Default: Story;
7
+ export declare const Flat: Story;
8
+ export declare const BorderedColored: Story;
@@ -1,4 +1,4 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
1
+ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { Widget } from "./Widget";
3
3
  import { Chart, Select, SelectItem } from "../../components";
4
4
  // More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction
@@ -29,4 +29,18 @@ export const Default = {
29
29
  ], height: "250px" })),
30
30
  },
31
31
  };
32
+ export const Flat = {
33
+ args: {
34
+ children: (_jsxs(_Fragment, { children: [_jsx("h1", { className: "text-center text-5xl mt-3", children: "30%" }), _jsx("h3", { className: "text-center text-xl mt-2 mb-3", children: "Project Cost Saving" })] })),
35
+ color: 'primary',
36
+ variant: 'flat',
37
+ },
38
+ };
39
+ export const BorderedColored = {
40
+ args: {
41
+ children: (_jsxs(_Fragment, { children: [_jsx("h1", { className: "text-center text-5xl mt-3", children: "30%" }), _jsx("h3", { className: "text-center text-xl mt-2 mb-3", children: "Project Cost Saving" })] })),
42
+ color: 'primary',
43
+ variant: 'bordered',
44
+ },
45
+ };
32
46
  //# sourceMappingURL=Widget.stories.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Widget.stories.js","sourceRoot":"","sources":["../../../src/fragments/widget/Widget.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAE7D,qGAAqG;AACrG,MAAM,IAAI,GAAwB;IAChC,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,MAAM;IACjB,IAAI,EAAE,CAAC,UAAU,CAAC;CACnB,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,8FAA8F;AAC9F,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE;QACJ,KAAK,EAAE,WAAW;QAClB,MAAM,EAAE;YACN,UAAU,EAAE,CACV,KAAC,MAAM,IAAC,mBAAmB,EAAE,CAAC,OAAO,CAAC,EAAE,UAAU,QAAC,UAAU,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,YAChF,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,CACpI,KAAC,UAAU,IAAsB,KAAK,EAAE,QAAQ,CAAC,KAAK,YACnD,QAAQ,CAAC,KAAK,IADA,QAAQ,CAAC,KAAK,CAElB,CACd,CAAC,GACK,CACV;SACF;QACD,QAAQ,EAAE,CACR,KAAC,KAAK,IACJ,IAAI,EAAC,MAAM,EACX,MAAM,EAAE;gBACN;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC;oBAC1C,KAAK,EAAE,SAAS;iBACjB;gBACD;oBACE,IAAI,EAAE,KAAK;oBACX,IAAI,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC;oBAC1C,KAAK,EAAE,SAAS;iBACjB;aACF,EACD,MAAM,EAAC,OAAO,GACd,CACH;KACF;CACF,CAAC"}
1
+ {"version":3,"file":"Widget.stories.js","sourceRoot":"","sources":["../../../src/fragments/widget/Widget.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAE7D,qGAAqG;AACrG,MAAM,IAAI,GAAwB;IAChC,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,MAAM;IACjB,IAAI,EAAE,CAAC,UAAU,CAAC;CACnB,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,8FAA8F;AAC9F,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE;QACJ,KAAK,EAAE,WAAW;QAClB,MAAM,EAAE;YACN,UAAU,EAAE,CACV,KAAC,MAAM,IAAC,mBAAmB,EAAE,CAAC,OAAO,CAAC,EAAE,UAAU,QAAC,UAAU,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,YAChF,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,CACpI,KAAC,UAAU,IAAsB,KAAK,EAAE,QAAQ,CAAC,KAAK,YACnD,QAAQ,CAAC,KAAK,IADA,QAAQ,CAAC,KAAK,CAElB,CACd,CAAC,GACK,CACV;SACF;QACD,QAAQ,EAAE,CACR,KAAC,KAAK,IACJ,IAAI,EAAC,MAAM,EACX,MAAM,EAAE;gBACN;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC;oBAC1C,KAAK,EAAE,SAAS;iBACjB;gBACD;oBACE,IAAI,EAAE,KAAK;oBACX,IAAI,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC;oBAC1C,KAAK,EAAE,SAAS;iBACjB;aACF,EACD,MAAM,EAAC,OAAO,GACd,CACH;KACF;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,IAAI,GAAU;IACzB,IAAI,EAAE;QACJ,QAAQ,EAAE,CACR,8BACE,aAAI,SAAS,EAAC,2BAA2B,oBAAS,EAClD,aAAI,SAAS,EAAC,+BAA+B,oCAAyB,IACrE,CACJ;QACD,KAAK,EAAE,SAAS;QAChB,OAAO,EAAE,MAAM;KAChB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAU;IACpC,IAAI,EAAE;QACJ,QAAQ,EAAE,CACR,8BACE,aAAI,SAAS,EAAC,2BAA2B,oBAAS,EAClD,aAAI,SAAS,EAAC,+BAA+B,oCAAyB,IACrE,CACJ;QACD,KAAK,EAAE,SAAS;QAChB,OAAO,EAAE,UAAU;KACpB;CACF,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fragment-build/ui",
3
- "version": "1.5.0",
3
+ "version": "1.6.0",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "repository": {
@@ -19,24 +19,24 @@
19
19
  "@storybook/react-vite": "8.0.9",
20
20
  "@storybook/test": "8.0.9",
21
21
  "@types/lodash.defaultsdeep": "4.6.9",
22
- "@types/react": "18.2.79",
23
- "@types/react-dom": "18.2.25",
24
- "@typescript-eslint/eslint-plugin": "7.7.1",
25
- "@typescript-eslint/parser": "7.7.1",
22
+ "@types/react": "18.3.1",
23
+ "@types/react-dom": "18.3.0",
24
+ "@typescript-eslint/eslint-plugin": "7.8.0",
25
+ "@typescript-eslint/parser": "7.8.0",
26
26
  "@vitejs/plugin-react": "4.2.1",
27
27
  "@vitejs/plugin-react-swc": "3.6.0",
28
28
  "autoprefixer": "10.4.19",
29
29
  "eslint": "8.57.0",
30
- "eslint-plugin-react-hooks": "4.6.0",
30
+ "eslint-plugin-react-hooks": "4.6.2",
31
31
  "eslint-plugin-react-refresh": "0.4.6",
32
32
  "eslint-plugin-storybook": "0.8.0",
33
33
  "postcss": "8.4.38",
34
- "react": "18.2.0",
35
- "react-dom": "18.2.0",
34
+ "react": "18.3.1",
35
+ "react-dom": "18.3.1",
36
36
  "storybook": "8.0.9",
37
37
  "storybook-dark-mode": "4.0.1",
38
38
  "typescript": "5.4.5",
39
- "vite": "5.2.10"
39
+ "vite": "5.2.11"
40
40
  },
41
41
  "scripts": {
42
42
  "build": "tsc",
@@ -48,7 +48,7 @@
48
48
  "dependencies": {
49
49
  "@nextui-org/react": "2.3.6",
50
50
  "@react-hooks-library/core": "0.6.2",
51
- "@tabler/icons-react": "3.2.0",
51
+ "@tabler/icons-react": "3.3.0",
52
52
  "apexcharts": "3.49.0",
53
53
  "framer-motion": "11.1.7",
54
54
  "lodash.defaultsdeep": "4.6.1",