@m5kdev/web-ui 0.1.0 → 0.1.1

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.
@@ -0,0 +1,361 @@
1
+
2
+ 
3
+ > @repo/web-ui@0.0.1 lint /Users/michalkow/Projects/m5/packages/web-ui
4
+ > biome check .
5
+
6
+ src/components/ColorPicker.tsx:17:12 ]8;;https://biomejs.dev/linter/rules/no-unused-variables\lint/correctness/noUnusedVariables]8;;\  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
7
+
8
+  ⚠ This variable err is unused.
9
+  
10
+   15 │   try {
11
+   16 │     return hexToHsva(hex);
12
+  > 17 │   } catch (err) {
13
+     │            ^^^
14
+   18 │     return { h: 0, s: 0, v: 0, a: 1 };
15
+   19 │   }
16
+  
17
+  ℹ Unused variables are often the result of an incomplete refactoring, typos, or other sources of bugs.
18
+  
19
+  ℹ Unsafe fix: If this is intentional, prepend err with an underscore.
20
+  
21
+   15 15 │     try {␍
22
+   16 16 │       return hexToHsva(hex);␍
23
+   17    │ - ··}·catch·(err)·{␍
24
+      17 │ + ··}·catch·(_err)·{␍
25
+   18 18 │       return { h: 0, s: 0, v: 0, a: 1 };␍
26
+   19 19 │     }␍
27
+  
28
+ 
29
+ src/components/MultiSelectDropdown.tsx:103:7 ]8;;https://biomejs.dev/linter/rules/no-for-each\lint/complexity/noForEach]8;;\ ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
30
+
31
+  ⚠ Prefer for...of instead of forEach.
32
+  
33
+   101 │       const ungrouped: MultiSelectOption[] = [];
34
+   102 │ 
35
+  > 103 │       options.forEach((option) => {
36
+      │       ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
37
+  > 104 │         if (option.group) {
38
+      ...
39
+  > 111 │         }
40
+  > 112 │       });
41
+      │       ^^
42
+   113 │ 
43
+   114 │       return { groups, ungrouped };
44
+  
45
+  ℹ forEach may lead to performance issues when working with large arrays. When combined with functions like filter or map, this causes multiple iterations over the same type.
46
+  
47
+ 
48
+ src/components/app-header.tsx:26:42 ]8;;https://biomejs.dev/linter/rules/no-array-index-key\lint/suspicious/noArrayIndexKey]8;;\ ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
49
+
50
+  ⚠ Avoid using the index of an array as key property in an element.
51
+  
52
+   24 │           <BreadcrumbList>
53
+   25 │             {breadcrumbs.map(({ href, label }, index) => (
54
+  > 26 │               <Fragment key={`${label}-${index}`}>
55
+     │                                          ^^^^^
56
+   27 │                 <BreadcrumbItem>
57
+   28 │                   {href ? (
58
+  
59
+  ℹ This is the source of the key value.
60
+  
61
+   23 │         <Breadcrumb>
62
+   24 │           <BreadcrumbList>
63
+  > 25 │             {breadcrumbs.map(({ href, label }, index) => (
64
+     │                                                ^^^^^
65
+   26 │               <Fragment key={`${label}-${index}`}>
66
+   27 │                 <BreadcrumbItem>
67
+  
68
+  ℹ The order of the items may change, and this also affects performances and component state.
69
+  
70
+  ℹ Check the ]8;;https://reactjs.org/docs/lists-and-keys.html#keys\React documentation]8;;\. 
71
+  
72
+ 
73
+ src/components/features-section-demo-1.tsx:100:73 ]8;;https://biomejs.dev/linter/rules/no-explicit-any\lint/suspicious/noExplicitAny]8;;\ ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
74
+
75
+  ⚠ Unexpected any. Specify a different type.
76
+  
77
+    98 │ };
78
+    99 │ 
79
+  > 100 │ export function GridPattern({ width, height, x, y, squares, ...props }: any) {
80
+      │                                                                         ^^^
81
+   101 │   const patternId = useId();
82
+   102 │ 
83
+  
84
+  ℹ any disables many type checking rules. Its use should be avoided.
85
+  
86
+ 
87
+ src/components/features-section-demo-1.tsx:124:9 ]8;;https://biomejs.dev/linter/rules/no-svg-without-title\lint/a11y/noSvgWithoutTitle]8;;\ ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
88
+
89
+  ⚠ Alternative text title element cannot be empty
90
+  
91
+   122 │       />
92
+   123 │       {squares && (
93
+  > 124 │         <svg x={x} y={y} className="overflow-visible">
94
+      │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
95
+   125 │           {squares.map(([x, y]: any) => (
96
+   126 │             <rect
97
+  
98
+  ℹ For accessibility purposes, SVGs should have an alternative text, provided via title element. If the svg element has role="img", you should add the aria-label or aria-labelledby attribute.
99
+  
100
+ 
101
+ src/components/features-section-demo-1.tsx:125:33 ]8;;https://biomejs.dev/linter/rules/no-explicit-any\lint/suspicious/noExplicitAny]8;;\ ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
102
+
103
+  ⚠ Unexpected any. Specify a different type.
104
+  
105
+   123 │       {squares && (
106
+   124 │         <svg x={x} y={y} className="overflow-visible">
107
+  > 125 │           {squares.map(([x, y]: any) => (
108
+      │                                 ^^^
109
+   126 │             <rect
110
+   127 │               strokeWidth="0"
111
+  
112
+  ℹ any disables many type checking rules. Its use should be avoided.
113
+  
114
+ 
115
+ src/components/features-section-demo-1.tsx:1:8 ]8;;https://biomejs.dev/linter/rules/no-unused-imports\lint/correctness/noUnusedImports]8;;\  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
116
+
117
+  ⚠ This import is unused.
118
+  
119
+  > 1 │ import React from "react";
120
+    │        ^^^^^
121
+   2 │ import { useId } from "react";
122
+   3 │ 
123
+  
124
+  ℹ Unused imports might be the result of an incomplete refactoring.
125
+  
126
+  ℹ Unsafe fix: Remove the unused imports.
127
+  
128
+   1 │ import·React·from·"react";
129
+   │ --------------------------
130
+ 
131
+ src/components/app-header.tsx:1:1 ]8;;https://biomejs.dev/assist/actions/organize-imports\assist/source/organizeImports]8;;\  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
132
+
133
+  ✖ The imports and exports are not sorted.
134
+  
135
+   > 1 │ import {
136
+     │ ^^^^^^^^
137
+   > 2 │   Breadcrumb,
138
+   > 3 │   BreadcrumbItem,
139
+   > 4 │   BreadcrumbLink,
140
+   > 5 │   BreadcrumbList,
141
+   > 6 │   BreadcrumbPage,
142
+   > 7 │   BreadcrumbSeparator,
143
+   > 8 │ } from "@/components/ui/breadcrumb";
144
+     │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
145
+    9 │ import { Separator } from "@/components/ui/separator";
146
+   10 │ import { SidebarTrigger } from "@/components/ui/sidebar";
147
+  
148
+  ℹ Safe fix: Organize Imports (Biome)
149
+  
150
+    1    │ - import·{␍
151
+    2    │ - ··Breadcrumb,␍
152
+    3    │ - ··BreadcrumbItem,␍
153
+    4    │ - ··BreadcrumbLink,␍
154
+    5    │ - ··BreadcrumbList,␍
155
+    6    │ - ··BreadcrumbPage,␍
156
+    7    │ - ··BreadcrumbSeparator,␍
157
+    8    │ - }·from·"@/components/ui/breadcrumb";␍
158
+    9    │ - import·{·Separator·}·from·"@/components/ui/separator";␍
159
+   10    │ - import·{·SidebarTrigger·}·from·"@/components/ui/sidebar";␍
160
+   11    │ - import·{·Fragment·}·from·"react";␍
161
+       1 │ + import·{·Fragment·}·from·"react";
162
+       2 │ + import·{␍
163
+       3 │ + ··Breadcrumb,␍
164
+       4 │ + ··BreadcrumbItem,␍
165
+       5 │ + ··BreadcrumbLink,␍
166
+       6 │ + ··BreadcrumbList,␍
167
+       7 │ + ··BreadcrumbPage,␍
168
+       8 │ + ··BreadcrumbSeparator,␍
169
+       9 │ + }·from·"@/components/ui/breadcrumb";␍
170
+      10 │ + import·{·Separator·}·from·"@/components/ui/separator";␍
171
+      11 │ + import·{·SidebarTrigger·}·from·"@/components/ui/sidebar";␍
172
+   12 12 │   ␍
173
+   13 13 │   export function AppHeader({␍
174
+  
175
+ 
176
+ src/components/app-header.tsx format ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
177
+
178
+  ✖ Formatter would have printed the following content:
179
+  
180
+   11 11 │   import { Fragment } from "react";␍
181
+   12 12 │   ␍
182
+   13    │ - export·function·AppHeader({␍
183
+   14    │ - ··breadcrumbs,␍
184
+   15    │ - }:·{␍
185
+   16    │ - ··breadcrumbs:·{·label:·string;·href?:·string·}[];␍
186
+   17    │ - })·{␍
187
+      13 │ + export·function·AppHeader({·breadcrumbs·}:·{·breadcrumbs:·{·label:·string;·href?:·string·}[]·})·{␍
188
+   18 14 │     return (␍
189
+   19 15 │       <header className="flex h-16 shrink-0 items-center gap-2 transition-[width,height] ease-linear group-has-[[data-collapsible=icon]]/sidebar-wrapper:h-12">␍
190
+  
191
+ 
192
+ src/components/blur-card.tsx:1:1 ]8;;https://biomejs.dev/assist/actions/organize-imports\assist/source/organizeImports]8;;\  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
193
+
194
+  ✖ The imports and exports are not sorted.
195
+  
196
+  > 1 │ import { Card } from "@/components/ui/card";
197
+    │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
198
+   2 │ import { cn } from "@/lib/utils";
199
+   3 │ import { motion } from "motion/react";
200
+  
201
+  ℹ Safe fix: Organize Imports (Biome)
202
+  
203
+    1     │ - import·{·Card·}·from·"@/components/ui/card";␍
204
+    2     │ - import·{·cn·}·from·"@/lib/utils";␍
205
+    3     │ - import·{·motion·}·from·"motion/react";␍
206
+    4     │ - import·type·{·ReactNode·}·from·"react";␍
207
+    5     │ - import·{·useState·}·from·"react";␍
208
+        1 │ + import·{·motion·}·from·"motion/react";␍
209
+        2 │ + import·type·{·ReactNode·}·from·"react";␍
210
+        3 │ + import·{·useState·}·from·"react";
211
+        4 │ + import·{·Card·}·from·"@/components/ui/card";␍
212
+        5 │ + import·{·cn·}·from·"@/lib/utils";␍
213
+    6  6 │   ␍
214
+    7  7 │   function BlurCardHeader({␍
215
+  
216
+ 
217
+ src/components/features-section-demo-1.tsx:1:1 ]8;;https://biomejs.dev/assist/actions/organize-imports\assist/source/organizeImports]8;;\  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
218
+
219
+  ✖ The imports and exports are not sorted.
220
+  
221
+  > 1 │ import React from "react";
222
+    │ ^^^^^^^^^^^^^^^^^^^^^^^^^^
223
+   2 │ import { useId } from "react";
224
+   3 │ 
225
+  
226
+  ℹ Safe fix: Organize Imports (Biome)
227
+  
228
+    1     │ - import·React·from·"react";
229
+    2     │ - import·{·useId·}·from·"react";
230
+        1 │ + import·React,·{·useId·}·from·"react";
231
+    3  2 │   
232
+    4  3 │   export default function FeaturesSectionDemo() {
233
+  
234
+ 
235
+ src/components/features-section-demo-1.tsx format ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
236
+
237
+  ✖ Formatter would have printed the following content:
238
+  
239
+    1     │ - import·React·from·"react";
240
+    2     │ - import·{·useId·}·from·"react";
241
+    3     │ - 
242
+    4     │ - export·default·function·FeaturesSectionDemo()·{
243
+    5     │ - ··return·(
244
+    6     │ - ····<div·className="py-20·lg:py-40">
245
+    7     │ - ······<div·className="grid·grid-cols-1·sm:grid-cols-2·md:grid-cols-3·lg:grid-cols-4·gap-10·md:gap-2·max-w-7xl·mx-auto">
246
+    8     │ - ········{grid.map((feature)·=>·(
247
+    9     │ - ··········<div
248
+    10     │ - ············key={feature.title}
249
+    11     │ - ············className="relative·bg-gradient-to-b·dark:from-neutral-900·from-neutral-100·dark:to-neutral-950·to-white·p-6·rounded-3xl·overflow-hidden"
250
+    12     │ - ··········>
251
+    13     │ - ············<Grid·size={20}·/>
252
+    14     │ - ············<p·className="text-base·font-bold·text-neutral-800·dark:text-white·relative·z-20">
253
+    15     │ - ··············{feature.title}
254
+    16     │ - ············</p>
255
+    17     │ - ············<p·className="text-neutral-600·dark:text-neutral-400·mt-4·text-base·font-normal·relative·z-20">
256
+    18     │ - ··············{feature.description}
257
+    19     │ - ············</p>
258
+    20     │ - ··········</div>
259
+    21     │ - ········))}
260
+    22     │ - ······</div>
261
+    23     │ - ····</div>
262
+    24     │ - ··);
263
+    25     │ - }
264
+    26     │ - 
265
+    27     │ - const·grid·=·[
266
+    28     │ - ··{
267
+    29     │ - ····title:·"HIPAA·and·SOC2·Compliant",
268
+    30     │ - ····description:
269
+    31     │ - ······"Our·applications·are·HIPAA·and·SOC2·compliant,·your·data·is·safe·with·us,·always.",
270
+    32     │ - ··},
271
+    33     │ - ··{
272
+    34     │ - ····title:·"Automated·Social·Media·Posting",
273
+    35     │ - ····description:
274
+    36     │ - ······"Schedule·and·automate·your·social·media·posts·across·multiple·platforms·to·save·time·and·maintain·a·consistent·online·presence.",
275
+    37     │ - ··},
276
+    38     │ - ··{
277
+    39     │ - ····title:·"Advanced·Analytics",
278
+    40     │ - ····description:
279
+    41     │ - ······"Gain·insights·into·your·social·media·performance·with·detailed·analytics·and·reporting·tools·to·measure·engagement·and·ROI.",
280
+    42     │ - ··},
281
+    43     │ - ··{
282
+    44     │ - ····title:·"Content·Calendar",
283
+    45     │ - ····description:
284
+    46     │ - ······"Plan·and·organize·your·social·media·content·with·an·intuitive·calendar·view,·ensuring·you·never·miss·a·post.",
285
+    47     │ - ··},
286
+    48     │ - ··{
287
+    49     │ - ····title:·"Audience·Targeting",
288
+    50     │ - ····description:
289
+    51     │ - ······"Reach·the·right·audience·with·advanced·targeting·options,·including·demographics,·interests,·and·behaviors.",
290
+    52     │ - ··},
291
+    53     │ - ··{
292
+    54     │ - ····title:·"Social·Listening",
293
+    55     │ - ····description:
294
+    56     │ - ······"Monitor·social·media·conversations·and·trends·to·stay·informed·about·what·your·audience·is·saying·and·respond·in·real-time.",
295
+    57     │ - ··},
296
+    58     │ - ··{
297
+    59     │ - ····title:·"Customizable·Templates",
298
+    60     │ - ····description:
299
+    61     │ - ······"Create·stunning·social·media·posts·with·our·customizable·templates,·designed·to·fit·your·brand's·unique·style·and·voice.",
300
+    62     │ - ··},
301
+    63     │ - ··{
302
+    64     │ - ····title:·"Collaboration·Tools",
303
+    65     │ - ····description:
304
+    66     │ - ······"Work·seamlessly·with·your·team·using·our·collaboration·tools,·allowing·you·to·assign·tasks,·share·drafts,·and·provide·feedback·in·real-time.",
305
+    67     │ - ··},
306
+    68     │ - ];
307
+    69     │ - 
308
+    70     │ - export·const·Grid·=·({
309
+    71     │ - ··pattern,
310
+    72     │ - ··size,
311
+    73     │ - }:·{
312
+    74     │ - ··pattern?:·number[][];
313
+    75     │ - ··size?:·number;
314
+    76     │ - })·=>·{
315
+    77     │ - ··const·p·=·pattern·??·[
316
+    78     │ - ····[Math.floor(Math.random()·*·4)·+·7,·Math.floor(Math.random()·*·6)·+·1],
317
+    79     │ - ····[Math.floor(Math.random()·*·4)·+·7,·Math.floor(Math.random()·*·6)·+·1],
318
+    80     │ - ····[Math.floor(Math.random()·*·4)·+·7,·Math.floor(Math.random()·*·6)·+·1],
319
+    81     │ - ····[Math.floor(Math.random()·*·4)·+·7,·Math.floor(Math.random()·*·6)·+·1],
320
+    82     │ - ····[Math.floor(Math.random()·*·4)·+·7,·Math.floor(Math.random()·*·6)·+·1],
321
+    83     │ - ··];
322
+    84     │ - ··return·(
323
+    85     │ - ····<div·className="pointer-events-none·absolute·left-1/2·top-0··-ml-20·-mt-2·h-full·w-full·[mask-image:linear-gradient(white,transparent)]">
324
+    86     │ - ······<div·className="absolute·inset-0·bg-gradient-to-r··[mask-image:radial-gradient(farthest-side_at_top,white,transparent)]·dark:from-zinc-900/30·from-zinc-100/30·to-zinc-300/30·dark:to-zinc-900/30·opacity-100">
325
+    87     │ - ········<GridPattern
326
+    88     │ - ··········width={size·??·20}
327
+    89     │ - ··········height={size·??·20}
328
+    90     │ - ··········x="-12"
329
+    91     │ - ··········y="4"
330
+    92     │ - ··········squares={p}
331
+    93     │ - ··········className="absolute·inset-0·h-full·w-full··mix-blend-overlay·dark:fill-white/10·dark:stroke-white/10·stroke-black/10·fill-black/10"
332
+    94     │ - ········/>
333
+    95     │ - ······</div>
334
+    96     │ - ····</div>
335
+    97     │ - ··);
336
+    98     │ - };
337
+    99     │ - 
338
+   100     │ - export·function·GridPattern({·width,·height,·x,·y,·squares,·...props·}:·any)·{
339
+   101     │ - ··const·patternId·=·useId();
340
+   102     │ - 
341
+   103     │ - ··return·(
342
+   104     │ - ····<svg·aria-hidden="true"·{...props}>
343
+   105     │ - ······<defs>
344
+   106     │ - ········<pattern
345
+   107     │ - ··········id={patternId}
346
+   108     │ - ··········width={width}
347
+   109     │ - ··········height={height}
348
+   110     │ - ··········patternUnits="userSpaceOnUse"
349
+   111     │ - ··········x={x}
350
+   112     │ - ··········y={y}
351
+   113     │ - ········>
352
+   114     │ - ··········<path·d={`M.5·${height}V.5H${width}`}·fill="none"·/>
353
+   115     │ - ········</pattern>
354
+   116     │ - ······</defs>
355
+   117     │ - ······<rect
356
+   118     │ - ········width="100%"
357
+   119     │ - ········height="100%"
358
+   120     │ - ········strokeWidth={0}
359
+   121     │ - ········fill={`url(#${patternId})`}
360
+   122     │ - ······/>
361
+   123