sodtrack-web-ui 0.7.13 → 0.8.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/dist/alert.mjs CHANGED
@@ -1,5 +1,5 @@
1
- export { Alert } from './chunk-OO4FIPNF.mjs';
1
+ export { Alert } from './chunk-EFMITOLW.mjs';
2
+ import './chunk-GY2JBRY6.mjs';
2
3
  import './chunk-P3UP2HUA.mjs';
3
4
  import './chunk-2MWIFYP3.mjs';
4
- import './chunk-GY2JBRY6.mjs';
5
5
  import './chunk-PLJ6ZHAI.mjs';
package/dist/button.d.mts CHANGED
@@ -8,7 +8,7 @@ type ButtonProps = {
8
8
  } & React__default.DetailedHTMLProps<React__default.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement> & VariantProps<typeof button>;
9
9
  declare const Button: FC<ButtonProps>;
10
10
  declare const button: (props?: ({
11
- size?: "small" | "large" | "medium" | undefined;
11
+ size?: "large" | "medium" | "small" | undefined;
12
12
  variant?: "link" | "contained" | "outlined" | "ghost" | "standard" | undefined;
13
13
  loading?: boolean | undefined;
14
14
  } & ({
package/dist/button.mjs CHANGED
@@ -1,5 +1,5 @@
1
- export { Button } from './chunk-22IACXYD.mjs';
1
+ export { Button } from './chunk-QQLQXUJA.mjs';
2
+ import './chunk-GY2JBRY6.mjs';
2
3
  import './chunk-P3UP2HUA.mjs';
3
4
  import './chunk-2MWIFYP3.mjs';
4
- import './chunk-GY2JBRY6.mjs';
5
5
  import './chunk-PLJ6ZHAI.mjs';
@@ -3,7 +3,7 @@ import { FC, HTMLAttributes } from 'react';
3
3
 
4
4
  declare const chipStatus: (props?: ({
5
5
  variant?: "success" | "info" | "warning" | "error" | undefined;
6
- size?: "xs" | "sm" | "md" | undefined;
6
+ size?: "sm" | "md" | "xs" | undefined;
7
7
  } & ({
8
8
  class?: string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | any | {
9
9
  [x: string]: any;
@@ -6,7 +6,7 @@ type IconButtonProps = {
6
6
  } & VariantProps<typeof iconButton> & React__default.DetailedHTMLProps<React__default.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;
7
7
  declare const iconButton: (props?: ({
8
8
  variant?: "contained" | "outlined" | "ghost" | "standard" | undefined;
9
- size?: "small" | "large" | "medium" | undefined;
9
+ size?: "large" | "medium" | "small" | undefined;
10
10
  } & ({
11
11
  class?: string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | any | {
12
12
  [x: string]: any;
package/dist/index.css CHANGED
@@ -361,13 +361,24 @@ video {
361
361
  .z-30 {
362
362
  z-index: 30;
363
363
  }
364
+ .mx-1 {
365
+ margin-left: 0.25rem;
366
+ margin-right: 0.25rem;
367
+ }
364
368
  .mx-4 {
365
369
  margin-left: 1rem;
366
370
  margin-right: 1rem;
367
371
  }
372
+ .my-1 {
373
+ margin-top: 0.25rem;
374
+ margin-bottom: 0.25rem;
375
+ }
368
376
  .-mt-1 {
369
377
  margin-top: -0.25rem;
370
378
  }
379
+ .mb-4 {
380
+ margin-bottom: 1rem;
381
+ }
371
382
  .ml-3 {
372
383
  margin-left: 0.75rem;
373
384
  }
@@ -398,6 +409,12 @@ video {
398
409
  .h-14 {
399
410
  height: 3.5rem;
400
411
  }
412
+ .h-2 {
413
+ height: 0.5rem;
414
+ }
415
+ .h-4 {
416
+ height: 1rem;
417
+ }
401
418
  .h-6 {
402
419
  height: 1.5rem;
403
420
  }
@@ -407,6 +424,9 @@ video {
407
424
  .h-\[1\.375rem\] {
408
425
  height: 1.375rem;
409
426
  }
427
+ .h-\[20rem\] {
428
+ height: 20rem;
429
+ }
410
430
  .h-full {
411
431
  height: 100%;
412
432
  }
@@ -422,6 +442,12 @@ video {
422
442
  .w-12 {
423
443
  width: 3rem;
424
444
  }
445
+ .w-2 {
446
+ width: 0.5rem;
447
+ }
448
+ .w-4 {
449
+ width: 1rem;
450
+ }
425
451
  .w-6 {
426
452
  width: 1.5rem;
427
453
  }
@@ -444,6 +470,9 @@ video {
444
470
  .max-w-\[20\.5rem\] {
445
471
  max-width: 20.5rem;
446
472
  }
473
+ .flex-1 {
474
+ flex: 1 1 0%;
475
+ }
447
476
  .flex-shrink-0 {
448
477
  flex-shrink: 0;
449
478
  }
@@ -461,6 +490,14 @@ video {
461
490
  .cursor-pointer {
462
491
  cursor: pointer;
463
492
  }
493
+ .touch-none {
494
+ touch-action: none;
495
+ }
496
+ .select-none {
497
+ -webkit-user-select: none;
498
+ -moz-user-select: none;
499
+ user-select: none;
500
+ }
464
501
  .flex-col {
465
502
  flex-direction: column;
466
503
  }
@@ -479,18 +516,30 @@ video {
479
516
  .gap-2 {
480
517
  gap: 0.5rem;
481
518
  }
519
+ .overflow-hidden {
520
+ overflow: hidden;
521
+ }
482
522
  .rounded {
483
523
  border-radius: 0.25rem;
484
524
  }
485
525
  .rounded-2xl {
486
526
  border-radius: 1rem;
487
527
  }
528
+ .rounded-\[inherit\] {
529
+ border-radius: inherit;
530
+ }
488
531
  .rounded-full {
489
532
  border-radius: 9999px;
490
533
  }
491
534
  .rounded-lg {
492
535
  border-radius: 0.5rem;
493
536
  }
537
+ .rounded-md {
538
+ border-radius: 0.375rem;
539
+ }
540
+ .border {
541
+ border-width: 1px;
542
+ }
494
543
  .border-b-1 {
495
544
  border-bottom-width: 1px;
496
545
  }
@@ -506,6 +555,10 @@ video {
506
555
  --tw-bg-opacity: 1;
507
556
  background-color: rgb(207 235 254 / var(--tw-bg-opacity));
508
557
  }
558
+ .bg-neutral-200 {
559
+ --tw-bg-opacity: 1;
560
+ background-color: rgb(225 231 230 / var(--tw-bg-opacity));
561
+ }
509
562
  .bg-neutral-300 {
510
563
  --tw-bg-opacity: 1;
511
564
  background-color: rgb(207 217 215 / var(--tw-bg-opacity));
@@ -550,6 +603,10 @@ video {
550
603
  padding-left: 0.25rem;
551
604
  padding-right: 0.25rem;
552
605
  }
606
+ .px-2 {
607
+ padding-left: 0.5rem;
608
+ padding-right: 0.5rem;
609
+ }
553
610
  .px-3 {
554
611
  padding-left: 0.75rem;
555
612
  padding-right: 0.75rem;
@@ -570,6 +627,10 @@ video {
570
627
  padding-top: 0.25rem;
571
628
  padding-bottom: 0.25rem;
572
629
  }
630
+ .py-2 {
631
+ padding-top: 0.5rem;
632
+ padding-bottom: 0.5rem;
633
+ }
573
634
  .pl-4 {
574
635
  padding-left: 1rem;
575
636
  }
@@ -594,6 +655,9 @@ video {
594
655
  font-size: 0.75rem;
595
656
  line-height: 1rem;
596
657
  }
658
+ .font-medium {
659
+ font-weight: 500;
660
+ }
597
661
  .font-semibold {
598
662
  font-weight: 600;
599
663
  }
@@ -606,6 +670,9 @@ video {
606
670
  .leading-\[130\%\] {
607
671
  line-height: 130%;
608
672
  }
673
+ .leading-none {
674
+ line-height: 1;
675
+ }
609
676
  .text-error-500 {
610
677
  --tw-text-opacity: 1;
611
678
  color: rgb(241 96 89 / var(--tw-text-opacity));
@@ -756,6 +823,17 @@ video {
756
823
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
757
824
  transition-duration: 150ms;
758
825
  }
826
+ .transition-colors {
827
+ transition-property:
828
+ color,
829
+ background-color,
830
+ border-color,
831
+ text-decoration-color,
832
+ fill,
833
+ stroke;
834
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
835
+ transition-duration: 150ms;
836
+ }
759
837
  .ease-linear {
760
838
  transition-timing-function: linear;
761
839
  }
@@ -1067,6 +1145,15 @@ video {
1067
1145
  .aria-selected\:\[\&\>button\]\:pb-\[0\.53125rem\] > button[aria-selected=true] {
1068
1146
  padding-bottom: 0.53125rem;
1069
1147
  }
1148
+ .\[\&\>div\]\:\!flex > div {
1149
+ display: flex !important;
1150
+ }
1151
+ .\[\&\>div\]\:h-full > div {
1152
+ height: 100%;
1153
+ }
1154
+ .\[\&\>div\]\:flex-col > div {
1155
+ flex-direction: column;
1156
+ }
1070
1157
  .\[\&_svg\]\:h-\[0\.875rem\] svg {
1071
1158
  height: 0.875rem;
1072
1159
  }
package/dist/index.mjs CHANGED
@@ -1,13 +1,13 @@
1
+ export { Spinner } from './chunk-RLA4I2X2.mjs';
1
2
  export { Tabs, TabsContent, TabsList, TabsTrigger } from './chunk-2OWGGXTX.mjs';
2
- export { TextField } from './chunk-VIVTNX5U.mjs';
3
+ export { TextField } from './chunk-FULNSEPZ.mjs';
3
4
  export { Tooltip, TooltipProvider } from './chunk-FRPPC3Z5.mjs';
4
- export { Alert } from './chunk-OO4FIPNF.mjs';
5
- export { Button } from './chunk-22IACXYD.mjs';
5
+ export { Alert } from './chunk-EFMITOLW.mjs';
6
+ export { Button } from './chunk-QQLQXUJA.mjs';
6
7
  export { ChipForm } from './chunk-RZ2JP5UH.mjs';
7
- import './chunk-P3UP2HUA.mjs';
8
8
  export { ChipStatus } from './chunk-WSAW6L2X.mjs';
9
9
  export { IconButton } from './chunk-JVSF3AX2.mjs';
10
- export { Spinner } from './chunk-TLX6BZS2.mjs';
11
- import './chunk-2MWIFYP3.mjs';
12
10
  import './chunk-GY2JBRY6.mjs';
11
+ import './chunk-P3UP2HUA.mjs';
12
+ import './chunk-2MWIFYP3.mjs';
13
13
  import './chunk-PLJ6ZHAI.mjs';
@@ -0,0 +1,7 @@
1
+ import * as React from 'react';
2
+ import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
3
+
4
+ declare const ScrollArea: React.ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ScrollAreaProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
5
+ declare const ScrollBar: React.ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ScrollAreaScrollbarProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
6
+
7
+ export { ScrollArea, ScrollBar };
@@ -0,0 +1,49 @@
1
+ import { cn } from './chunk-P3UP2HUA.mjs';
2
+ import { require_jsx_runtime } from './chunk-2MWIFYP3.mjs';
3
+ import { __toESM, require_react } from './chunk-PLJ6ZHAI.mjs';
4
+ import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
5
+
6
+ // src/components/scrollarea.tsx
7
+ var React = __toESM(require_react());
8
+ var import_jsx_runtime = __toESM(require_jsx_runtime());
9
+ var ScrollArea = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
10
+ ScrollAreaPrimitive.Root,
11
+ {
12
+ ref,
13
+ className: cn("relative h-full overflow-hidden", className),
14
+ ...props,
15
+ children: [
16
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ScrollAreaPrimitive.Viewport, { className: "h-full w-full rounded-[inherit] [&>div]:!flex [&>div]:h-full [&>div]:flex-col", children }),
17
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ScrollBar, {}),
18
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ScrollAreaPrimitive.Corner, {})
19
+ ]
20
+ }
21
+ ));
22
+ ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
23
+ var ScrollBar = React.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
24
+ ScrollAreaPrimitive.ScrollAreaScrollbar,
25
+ {
26
+ ref,
27
+ orientation,
28
+ className: cn(
29
+ "flex touch-none select-none bg-neutral-200 transition-colors",
30
+ orientation === "vertical" && "h-full w-4 py-2",
31
+ orientation === "horizontal" && "h-4 flex-col px-2",
32
+ className
33
+ ),
34
+ ...props,
35
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
36
+ ScrollAreaPrimitive.ScrollAreaThumb,
37
+ {
38
+ className: cn(
39
+ "relative flex-1 rounded bg-primary-500",
40
+ orientation === "vertical" && "mx-1 w-2",
41
+ orientation === "horizontal" && "my-1 h-2"
42
+ )
43
+ }
44
+ )
45
+ }
46
+ ));
47
+ ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
48
+
49
+ export { ScrollArea, ScrollBar };
package/dist/spinner.mjs CHANGED
@@ -1,4 +1,4 @@
1
- export { Spinner } from './chunk-TLX6BZS2.mjs';
2
- import './chunk-2MWIFYP3.mjs';
1
+ export { Spinner } from './chunk-RLA4I2X2.mjs';
3
2
  import './chunk-GY2JBRY6.mjs';
3
+ import './chunk-2MWIFYP3.mjs';
4
4
  import './chunk-PLJ6ZHAI.mjs';
@@ -1,5 +1,5 @@
1
- export { TextField } from './chunk-VIVTNX5U.mjs';
1
+ export { TextField } from './chunk-FULNSEPZ.mjs';
2
+ import './chunk-GY2JBRY6.mjs';
2
3
  import './chunk-P3UP2HUA.mjs';
3
4
  import './chunk-2MWIFYP3.mjs';
4
- import './chunk-GY2JBRY6.mjs';
5
5
  import './chunk-PLJ6ZHAI.mjs';
package/package.json CHANGED
@@ -1,9 +1,9 @@
1
1
  {
2
2
  "name": "sodtrack-web-ui",
3
- "version": "0.7.13",
3
+ "version": "0.8.0",
4
4
  "description": "UI components for Sodtrack Web",
5
5
  "exports": {
6
- "./styles.css": "./dist/index.css",
6
+ "./dist/index.css": "./dist/index.css",
7
7
  ".": {
8
8
  "import": {
9
9
  "types": "./dist/index.d.mts",
@@ -46,6 +46,7 @@
46
46
  },
47
47
  "dependencies": {
48
48
  "@radix-ui/react-label": "^2.0.2",
49
+ "@radix-ui/react-scroll-area": "^1.0.5",
49
50
  "@radix-ui/react-tabs": "^1.0.4",
50
51
  "@radix-ui/react-tooltip": "^1.0.7",
51
52
  "cva": "1.0.0-beta.1"
@@ -1,6 +1,6 @@
1
+ import { TriangleAlertIcon, CircleCheckIcon, CircleXIcon, InfoIcon, CloseIcon } from './chunk-GY2JBRY6.mjs';
1
2
  import { cn } from './chunk-P3UP2HUA.mjs';
2
3
  import { require_jsx_runtime } from './chunk-2MWIFYP3.mjs';
3
- import { TriangleAlertIcon, CircleCheckIcon, CircleXIcon, InfoIcon, CloseIcon } from './chunk-GY2JBRY6.mjs';
4
4
  import { __toESM, require_react } from './chunk-PLJ6ZHAI.mjs';
5
5
  import { cva } from 'cva';
6
6
 
@@ -1,6 +1,6 @@
1
+ import { ChevronDownIcon } from './chunk-GY2JBRY6.mjs';
1
2
  import { cn } from './chunk-P3UP2HUA.mjs';
2
3
  import { require_jsx_runtime } from './chunk-2MWIFYP3.mjs';
3
- import { ChevronDownIcon } from './chunk-GY2JBRY6.mjs';
4
4
  import { __toESM, require_react } from './chunk-PLJ6ZHAI.mjs';
5
5
  import { Label } from '@radix-ui/react-label';
6
6
 
@@ -1,6 +1,6 @@
1
+ import { LoaderCircleIcon } from './chunk-GY2JBRY6.mjs';
1
2
  import { cn } from './chunk-P3UP2HUA.mjs';
2
3
  import { require_jsx_runtime } from './chunk-2MWIFYP3.mjs';
3
- import { LoaderCircleIcon } from './chunk-GY2JBRY6.mjs';
4
4
  import { __toESM, require_react } from './chunk-PLJ6ZHAI.mjs';
5
5
  import { cva } from 'cva';
6
6
 
@@ -1,5 +1,5 @@
1
- import { require_jsx_runtime } from './chunk-2MWIFYP3.mjs';
2
1
  import { LoaderCircleIcon } from './chunk-GY2JBRY6.mjs';
2
+ import { require_jsx_runtime } from './chunk-2MWIFYP3.mjs';
3
3
  import { __toESM } from './chunk-PLJ6ZHAI.mjs';
4
4
  import { cva } from 'cva';
5
5