negodesign 0.0.24 → 0.0.26

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 (139) hide show
  1. package/dist/assets/start.png +0 -0
  2. package/dist/components/core/breadcrumb/breadcrumb-list.svelte +31 -31
  3. package/dist/components/core/button/ButtonBack.svelte +18 -18
  4. package/dist/components/core/button/ButtonLogin.svelte +15 -15
  5. package/dist/components/core/button/ButtonLoginWith.svelte +57 -57
  6. package/dist/components/core/button/ButtonSend.svelte +15 -15
  7. package/dist/components/core/card/highlight/01/CardHighlight01.svelte +91 -0
  8. package/dist/components/core/card/highlight/01/CardHighlight01.svelte.d.ts +8 -0
  9. package/dist/components/core/card/highlight/02/CardHighlight02.svelte +93 -0
  10. package/dist/components/core/card/highlight/02/CardHighlight02.svelte.d.ts +8 -0
  11. package/dist/components/core/card/highlight/CardHighlight.svelte +22 -44
  12. package/dist/components/core/card/highlight/CardHighlight.svelte.d.ts +5 -2
  13. package/dist/components/core/card/highlight/data.js +32 -1
  14. package/dist/components/core/card/media/01/CardMedia01.svelte +111 -114
  15. package/dist/components/core/card/media/02/CardMedia02.svelte +110 -113
  16. package/dist/components/core/card/media/CardMedia.svelte +17 -17
  17. package/dist/components/core/card/profile/01/CardProfile01.svelte +98 -101
  18. package/dist/components/core/card/profile/02/CardProfile02.svelte +98 -97
  19. package/dist/components/core/card/profile/CardProfile.svelte +17 -17
  20. package/dist/components/core/card/promotion/CardPromotion.svelte +112 -81
  21. package/dist/components/core/card/promotion/data.js +31 -0
  22. package/dist/components/core/card/shared/CardButton.svelte +30 -30
  23. package/dist/components/core/card/shared/CardCart.svelte +36 -32
  24. package/dist/components/core/card/shared/CardCart.svelte.d.ts +1 -0
  25. package/dist/components/core/card/shared/CardDescription.svelte +38 -23
  26. package/dist/components/core/card/shared/CardDescription.svelte.d.ts +3 -0
  27. package/dist/components/core/card/shared/CardFavorite.svelte +33 -29
  28. package/dist/components/core/card/shared/CardFavorite.svelte.d.ts +1 -0
  29. package/dist/components/core/card/shared/CardStarRating.svelte +20 -20
  30. package/dist/components/core/card/shared/CardStartPrice.svelte +34 -0
  31. package/dist/components/core/card/shared/CardStartPrice.svelte.d.ts +8 -0
  32. package/dist/components/core/card/shared/CardTags.svelte +73 -56
  33. package/dist/components/core/card/shared/CardTags.svelte.d.ts +2 -1
  34. package/dist/components/core/card/shared/CardThumbnailVideo.svelte +169 -169
  35. package/dist/components/core/card/shared/TruncatableText.svelte +55 -55
  36. package/dist/components/core/card/types.d.ts +13 -0
  37. package/dist/components/core/carousel/{shared/ui/SimpleBadgeCarousel.svelte → badge/ui/CarouselBadge.svelte} +83 -80
  38. package/dist/components/core/carousel/badge/ui/CarouselBadge.svelte.d.ts +4 -0
  39. package/dist/components/core/carousel/hero/CarouselHero.svelte +158 -158
  40. package/dist/components/core/carousel/highlights/types.d.ts +12 -0
  41. package/dist/components/core/carousel/highlights/types.js +1 -0
  42. package/dist/components/core/carousel/highlights/ui/CarouselHighlights.svelte +63 -65
  43. package/dist/components/core/carousel/highlights/ui/CarouselHighlights.svelte.d.ts +1 -1
  44. package/dist/components/core/carousel/promotion/types.d.ts +11 -0
  45. package/dist/components/core/carousel/promotion/types.js +1 -0
  46. package/dist/components/core/carousel/promotion/ui/CarouselPromotion.svelte +64 -65
  47. package/dist/components/core/carousel/promotion/ui/CarouselPromotion.svelte.d.ts +1 -1
  48. package/dist/components/core/carousel/shared/ui/CarouselHeader.svelte +55 -0
  49. package/dist/components/core/carousel/shared/ui/CarouselHeader.svelte.d.ts +9 -0
  50. package/dist/components/core/carousel/types.d.ts +10 -26
  51. package/dist/components/core/datatable/ui/DataTableActions.svelte +28 -28
  52. package/dist/components/core/datatable/ui/DataTableCheckbox.svelte +22 -22
  53. package/dist/components/core/datatable/ui/DataTableContent.svelte +59 -59
  54. package/dist/components/core/datatable/ui/DataTableCore.svelte +151 -151
  55. package/dist/components/core/datatable/ui/DataTableDragHandle.svelte +8 -8
  56. package/dist/components/core/datatable/ui/DataTableListFilter.svelte +59 -59
  57. package/dist/components/core/datatable/ui/DataTableListPagination.svelte +35 -35
  58. package/dist/components/core/form/ui/input-base.svelte +81 -81
  59. package/dist/components/core/form/ui/input-email-or-phone.svelte +23 -23
  60. package/dist/components/core/form/ui/input-email.svelte +23 -23
  61. package/dist/components/core/form/ui/input-password-confirm.svelte +23 -23
  62. package/dist/components/core/form/ui/input-password.svelte +23 -23
  63. package/dist/components/core/form/ui/input-phone.svelte +33 -33
  64. package/dist/components/core/form/ui/input-username.svelte +22 -22
  65. package/dist/components/core/hero/SimpleHero.svelte +65 -65
  66. package/dist/components/core/label/LabelOr.svelte +25 -25
  67. package/dist/components/core/link/link-forget-password.svelte +12 -12
  68. package/dist/components/core/link/link-privacy-polity.svelte +12 -12
  69. package/dist/components/core/link/link-terms-of-service.svelte +12 -12
  70. package/dist/components/core/nav/ui/menu-links.svelte +27 -27
  71. package/dist/components/core/nav/ui/mobile/nav-menu-drawer.svelte +85 -85
  72. package/dist/components/core/nav/ui/nav-menu-bottom-sidebar.svelte +33 -33
  73. package/dist/components/core/nav/ui/nav-menu-sidebar.svelte +97 -97
  74. package/dist/components/core/nav/ui/nav-menu-top-bar-sidebar.svelte +103 -103
  75. package/dist/components/core/nav/ui/nav-menu.svelte +106 -106
  76. package/dist/components/core/panel/CarouselSlot.svelte +63 -38
  77. package/dist/components/core/panel/CarouselSlot.svelte.d.ts +5 -2
  78. package/dist/components/core/panel/LeftHero.svelte +116 -116
  79. package/dist/components/core/search/SearchInput.svelte +32 -32
  80. package/dist/components/core/search/shared/SearchInputCore.svelte +66 -66
  81. package/dist/components/core/sidebar/MenuBarSidebar.svelte +70 -70
  82. package/dist/components/core/tabs/ui/tab-underline.svelte +43 -43
  83. package/dist/components/pages/admin/01/ui/AdminContent.svelte +14 -14
  84. package/dist/components/pages/admin/01/ui/AdminPanel.svelte +46 -46
  85. package/dist/components/pages/security/login/01/ui/FormRegister.svelte +28 -28
  86. package/dist/components/pages/security/login/01/ui/LoginCard.svelte +107 -107
  87. package/dist/components/pages/security/login/PageLogin.svelte +22 -22
  88. package/dist/components/ui/badge/badge.svelte +49 -49
  89. package/dist/components/ui/button/button.svelte +82 -82
  90. package/dist/components/ui/chart/chart-container.svelte +80 -80
  91. package/dist/components/ui/chart/chart-style.svelte +37 -37
  92. package/dist/components/ui/chart/chart-tooltip.svelte +184 -184
  93. package/dist/components/ui/checkbox/checkbox.svelte +40 -40
  94. package/dist/components/ui/data-table/flex-render.svelte +40 -40
  95. package/dist/components/ui/drawer/drawer-close.svelte +7 -7
  96. package/dist/components/ui/drawer/drawer-content.svelte +33 -33
  97. package/dist/components/ui/drawer/drawer-description.svelte +17 -17
  98. package/dist/components/ui/drawer/drawer-footer.svelte +20 -20
  99. package/dist/components/ui/drawer/drawer-header.svelte +20 -20
  100. package/dist/components/ui/drawer/drawer-nested.svelte +12 -12
  101. package/dist/components/ui/drawer/drawer-overlay.svelte +17 -17
  102. package/dist/components/ui/drawer/drawer-portal.svelte +7 -7
  103. package/dist/components/ui/drawer/drawer-title.svelte +17 -17
  104. package/dist/components/ui/drawer/drawer-trigger.svelte +7 -7
  105. package/dist/components/ui/drawer/drawer.svelte +12 -12
  106. package/dist/components/ui/select/select-content.svelte +45 -45
  107. package/dist/components/ui/select/select-group-heading.svelte +21 -21
  108. package/dist/components/ui/select/select-group.svelte +17 -17
  109. package/dist/components/ui/select/select-item.svelte +41 -41
  110. package/dist/components/ui/select/select-label.svelte +20 -20
  111. package/dist/components/ui/select/select-portal.svelte +7 -7
  112. package/dist/components/ui/select/select-scroll-down-button.svelte +21 -21
  113. package/dist/components/ui/select/select-scroll-up-button.svelte +21 -21
  114. package/dist/components/ui/select/select-separator.svelte +18 -18
  115. package/dist/components/ui/select/select-trigger.svelte +30 -30
  116. package/dist/components/ui/select/select.svelte +11 -11
  117. package/dist/components/ui/sidebar/sidebar-menu-sub-button.svelte +39 -39
  118. package/dist/components/ui/star-rating/star-rating-star.svelte +41 -41
  119. package/dist/components/ui/star-rating/star-rating.svelte +20 -20
  120. package/dist/components/ui/table/table-body.svelte +15 -15
  121. package/dist/components/ui/table/table-caption.svelte +20 -20
  122. package/dist/components/ui/table/table-cell.svelte +15 -15
  123. package/dist/components/ui/table/table-footer.svelte +20 -20
  124. package/dist/components/ui/table/table-head.svelte +15 -15
  125. package/dist/components/ui/table/table-header.svelte +20 -20
  126. package/dist/components/ui/table/table-row.svelte +15 -15
  127. package/dist/components/ui/table/table.svelte +17 -17
  128. package/dist/components/ui/tabs/tabs-content.svelte +17 -17
  129. package/dist/components/ui/tabs/tabs-list.svelte +40 -40
  130. package/dist/components/ui/tabs/tabs-trigger.svelte +23 -23
  131. package/dist/components/ui/tabs/tabs.svelte +19 -19
  132. package/dist/globals.css +143 -15
  133. package/dist/hooks/responsive.svelte.d.ts +1 -1
  134. package/dist/hooks/responsive.svelte.js +1 -1
  135. package/dist/index.d.ts +2 -2
  136. package/dist/index.js +2 -2
  137. package/dist/styles/globals.css +149 -149
  138. package/package.json +113 -113
  139. package/dist/components/core/carousel/shared/ui/SimpleBadgeCarousel.svelte.d.ts +0 -4
@@ -1,40 +1,40 @@
1
- <script lang="ts" module>
2
- import { tv, type VariantProps } from "tailwind-variants";
3
-
4
- export const tabsListVariants = tv({
5
- base: "rounded-4xl p-[3px] group-data-horizontal/tabs:h-9 group-data-vertical/tabs:rounded-2xl data-[variant=line]:rounded-none group/tabs-list text-muted-foreground inline-flex w-fit items-center justify-center group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col",
6
- variants: {
7
- variant: {
8
- default: "cn-tabs-list-variant-default bg-muted",
9
- line: "cn-tabs-list-variant-line gap-1 bg-transparent",
10
- },
11
- },
12
- defaultVariants: {
13
- variant: "default",
14
- },
15
- });
16
-
17
- export type TabsListVariant = VariantProps<typeof tabsListVariants>["variant"];
18
- </script>
19
-
20
- <script lang="ts">
21
- import { Tabs as TabsPrimitive } from "bits-ui";
22
- import { cn } from "../../../utils.js";
23
-
24
- let {
25
- ref = $bindable(null),
26
- variant = "default",
27
- class: className,
28
- ...restProps
29
- }: TabsPrimitive.ListProps & {
30
- variant?: TabsListVariant;
31
- } = $props();
32
- </script>
33
-
34
- <TabsPrimitive.List
35
- bind:ref
36
- data-slot="tabs-list"
37
- data-variant={variant}
38
- class={cn(tabsListVariants({ variant }), className)}
39
- {...restProps}
40
- />
1
+ <script lang="ts" module>
2
+ import { tv, type VariantProps } from "tailwind-variants";
3
+
4
+ export const tabsListVariants = tv({
5
+ base: "rounded-4xl p-[3px] group-data-horizontal/tabs:h-9 group-data-vertical/tabs:rounded-2xl data-[variant=line]:rounded-none group/tabs-list text-muted-foreground inline-flex w-fit items-center justify-center group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col",
6
+ variants: {
7
+ variant: {
8
+ default: "cn-tabs-list-variant-default bg-muted",
9
+ line: "cn-tabs-list-variant-line gap-1 bg-transparent",
10
+ },
11
+ },
12
+ defaultVariants: {
13
+ variant: "default",
14
+ },
15
+ });
16
+
17
+ export type TabsListVariant = VariantProps<typeof tabsListVariants>["variant"];
18
+ </script>
19
+
20
+ <script lang="ts">
21
+ import { Tabs as TabsPrimitive } from "bits-ui";
22
+ import { cn } from "../../../utils.js";
23
+
24
+ let {
25
+ ref = $bindable(null),
26
+ variant = "default",
27
+ class: className,
28
+ ...restProps
29
+ }: TabsPrimitive.ListProps & {
30
+ variant?: TabsListVariant;
31
+ } = $props();
32
+ </script>
33
+
34
+ <TabsPrimitive.List
35
+ bind:ref
36
+ data-slot="tabs-list"
37
+ data-variant={variant}
38
+ class={cn(tabsListVariants({ variant }), className)}
39
+ {...restProps}
40
+ />
@@ -1,23 +1,23 @@
1
- <script lang="ts">
2
- import { Tabs as TabsPrimitive } from "bits-ui";
3
- import { cn } from "../../../utils.js";
4
-
5
- let {
6
- ref = $bindable(null),
7
- class: className,
8
- ...restProps
9
- }: TabsPrimitive.TriggerProps = $props();
10
- </script>
11
-
12
- <TabsPrimitive.Trigger
13
- bind:ref
14
- data-slot="tabs-trigger"
15
- class={cn(
16
- "gap-1.5 rounded-xl border border-transparent px-2 py-1 text-sm font-medium group-data-vertical/tabs:px-2.5 group-data-vertical/tabs:py-1.5 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-4 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring text-foreground/60 hover:text-foreground dark:text-muted-foreground dark:hover:text-foreground relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center whitespace-nowrap transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
17
- "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent",
18
- "data-active:bg-background dark:data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 data-active:text-foreground",
19
- "after:bg-foreground after:absolute after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100",
20
- className
21
- )}
22
- {...restProps}
23
- />
1
+ <script lang="ts">
2
+ import { Tabs as TabsPrimitive } from "bits-ui";
3
+ import { cn } from "../../../utils.js";
4
+
5
+ let {
6
+ ref = $bindable(null),
7
+ class: className,
8
+ ...restProps
9
+ }: TabsPrimitive.TriggerProps = $props();
10
+ </script>
11
+
12
+ <TabsPrimitive.Trigger
13
+ bind:ref
14
+ data-slot="tabs-trigger"
15
+ class={cn(
16
+ "gap-1.5 rounded-xl border border-transparent px-2 py-1 text-sm font-medium group-data-vertical/tabs:px-2.5 group-data-vertical/tabs:py-1.5 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-4 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring text-foreground/60 hover:text-foreground dark:text-muted-foreground dark:hover:text-foreground relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center whitespace-nowrap transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
17
+ "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent",
18
+ "data-active:bg-background dark:data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 data-active:text-foreground",
19
+ "after:bg-foreground after:absolute after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100",
20
+ className
21
+ )}
22
+ {...restProps}
23
+ />
@@ -1,19 +1,19 @@
1
- <script lang="ts">
2
- import { Tabs as TabsPrimitive } from "bits-ui";
3
- import { cn } from "../../../utils.js";
4
-
5
- let {
6
- ref = $bindable(null),
7
- value = $bindable(""),
8
- class: className,
9
- ...restProps
10
- }: TabsPrimitive.RootProps = $props();
11
- </script>
12
-
13
- <TabsPrimitive.Root
14
- bind:ref
15
- bind:value
16
- data-slot="tabs"
17
- class={cn("gap-2 group/tabs flex data-[orientation=horizontal]:flex-col", className)}
18
- {...restProps}
19
- />
1
+ <script lang="ts">
2
+ import { Tabs as TabsPrimitive } from "bits-ui";
3
+ import { cn } from "../../../utils.js";
4
+
5
+ let {
6
+ ref = $bindable(null),
7
+ value = $bindable(""),
8
+ class: className,
9
+ ...restProps
10
+ }: TabsPrimitive.RootProps = $props();
11
+ </script>
12
+
13
+ <TabsPrimitive.Root
14
+ bind:ref
15
+ bind:value
16
+ data-slot="tabs"
17
+ class={cn("gap-2 group/tabs flex data-[orientation=horizontal]:flex-col", className)}
18
+ {...restProps}
19
+ />
package/dist/globals.css CHANGED
@@ -6,11 +6,13 @@
6
6
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
7
7
  "Courier New", monospace;
8
8
  --color-red-500: oklch(63.7% 0.237 25.331);
9
+ --color-red-600: oklch(57.7% 0.245 27.325);
9
10
  --color-red-900: oklch(39.6% 0.141 25.723);
10
11
  --color-yellow-500: oklch(79.5% 0.184 86.047);
11
12
  --color-green-500: oklch(72.3% 0.219 149.579);
12
13
  --color-blue-50: oklch(97% 0.014 254.604);
13
14
  --color-blue-500: oklch(62.3% 0.214 259.815);
15
+ --color-blue-700: oklch(48.8% 0.243 264.376);
14
16
  --color-blue-900: oklch(37.9% 0.146 265.522);
15
17
  --color-slate-400: oklch(70.4% 0.04 256.788);
16
18
  --color-slate-500: oklch(55.4% 0.046 257.417);
@@ -55,6 +57,7 @@
55
57
  --font-weight-medium: 500;
56
58
  --font-weight-semibold: 600;
57
59
  --font-weight-bold: 700;
60
+ --font-weight-extrabold: 800;
58
61
  --tracking-tight: -0.025em;
59
62
  --tracking-wider: 0.05em;
60
63
  --tracking-widest: 0.1em;
@@ -282,6 +285,9 @@
282
285
  .end-2 {
283
286
  inset-inline-end: calc(var(--spacing) * 2);
284
287
  }
288
+ .-top-6 {
289
+ top: calc(var(--spacing) * -6);
290
+ }
285
291
  .-top-12 {
286
292
  top: calc(var(--spacing) * -12);
287
293
  }
@@ -315,6 +321,9 @@
315
321
  .top-8 {
316
322
  top: calc(var(--spacing) * 8);
317
323
  }
324
+ .-right-8 {
325
+ right: calc(var(--spacing) * -8);
326
+ }
318
327
  .right-0 {
319
328
  right: 0px;
320
329
  }
@@ -330,6 +339,9 @@
330
339
  .right-4 {
331
340
  right: calc(var(--spacing) * 4);
332
341
  }
342
+ .right-10 {
343
+ right: calc(var(--spacing) * 10);
344
+ }
333
345
  .-bottom-12 {
334
346
  bottom: calc(var(--spacing) * -12);
335
347
  }
@@ -345,6 +357,9 @@
345
357
  .bottom-2 {
346
358
  bottom: calc(var(--spacing) * 2);
347
359
  }
360
+ .-left-8 {
361
+ left: calc(var(--spacing) * -8);
362
+ }
348
363
  .left-0 {
349
364
  left: 0px;
350
365
  }
@@ -480,9 +495,15 @@
480
495
  .-mr-2 {
481
496
  margin-right: calc(var(--spacing) * -2);
482
497
  }
498
+ .mr-0 {
499
+ margin-right: 0px;
500
+ }
483
501
  .mr-0\.5 {
484
502
  margin-right: calc(var(--spacing) * 0.5);
485
503
  }
504
+ .mr-2 {
505
+ margin-right: calc(var(--spacing) * 2);
506
+ }
486
507
  .-mb-8 {
487
508
  margin-bottom: calc(var(--spacing) * -8);
488
509
  }
@@ -492,6 +513,9 @@
492
513
  .mb-2 {
493
514
  margin-bottom: calc(var(--spacing) * 2);
494
515
  }
516
+ .mb-3 {
517
+ margin-bottom: calc(var(--spacing) * 3);
518
+ }
495
519
  .mb-4 {
496
520
  margin-bottom: calc(var(--spacing) * 4);
497
521
  }
@@ -507,8 +531,8 @@
507
531
  .mb-10 {
508
532
  margin-bottom: calc(var(--spacing) * 10);
509
533
  }
510
- .ml-10 {
511
- margin-left: calc(var(--spacing) * 10);
534
+ .ml-0 {
535
+ margin-left: 0px;
512
536
  }
513
537
  .ml-auto {
514
538
  margin-left: auto;
@@ -687,6 +711,9 @@
687
711
  .h-24 {
688
712
  height: calc(var(--spacing) * 24);
689
713
  }
714
+ .h-25 {
715
+ height: calc(var(--spacing) * 25);
716
+ }
690
717
  .h-50 {
691
718
  height: calc(var(--spacing) * 50);
692
719
  }
@@ -789,8 +816,17 @@
789
816
  .w-12 {
790
817
  width: calc(var(--spacing) * 12);
791
818
  }
792
- .w-37\.5 {
793
- width: calc(var(--spacing) * 37.5);
819
+ .w-20 {
820
+ width: calc(var(--spacing) * 20);
821
+ }
822
+ .w-25 {
823
+ width: calc(var(--spacing) * 25);
824
+ }
825
+ .w-30 {
826
+ width: calc(var(--spacing) * 30);
827
+ }
828
+ .w-50 {
829
+ width: calc(var(--spacing) * 50);
794
830
  }
795
831
  .w-56 {
796
832
  width: calc(var(--spacing) * 56);
@@ -801,6 +837,9 @@
801
837
  .w-72 {
802
838
  width: calc(var(--spacing) * 72);
803
839
  }
840
+ .w-75 {
841
+ width: calc(var(--spacing) * 75);
842
+ }
804
843
  .w-\[15px\] {
805
844
  width: 15px;
806
845
  }
@@ -873,6 +912,9 @@
873
912
  .min-w-5 {
874
913
  min-width: calc(var(--spacing) * 5);
875
914
  }
915
+ .min-w-25 {
916
+ min-width: calc(var(--spacing) * 25);
917
+ }
876
918
  .min-w-36 {
877
919
  min-width: calc(var(--spacing) * 36);
878
920
  }
@@ -988,6 +1030,9 @@
988
1030
  .cursor-pointer {
989
1031
  cursor: pointer;
990
1032
  }
1033
+ .cursor-pointer\! {
1034
+ cursor: pointer !important;
1035
+ }
991
1036
  .cursor-text {
992
1037
  cursor: text;
993
1038
  }
@@ -1223,6 +1268,9 @@
1223
1268
  .rounded-tr-\[35px\] {
1224
1269
  border-top-right-radius: 35px;
1225
1270
  }
1271
+ .rounded-tr-lg {
1272
+ border-top-right-radius: var(--radius);
1273
+ }
1226
1274
  .rounded-bl-lg {
1227
1275
  border-bottom-left-radius: var(--radius);
1228
1276
  }
@@ -1353,6 +1401,18 @@
1353
1401
  background-color: color-mix(in oklab, var(--color-black) 10%, transparent);
1354
1402
  }
1355
1403
  }
1404
+ .bg-black\/15 {
1405
+ background-color: color-mix(in srgb, #000 15%, transparent);
1406
+ @supports (color: color-mix(in lab, red, red)) {
1407
+ background-color: color-mix(in oklab, var(--color-black) 15%, transparent);
1408
+ }
1409
+ }
1410
+ .bg-black\/20 {
1411
+ background-color: color-mix(in srgb, #000 20%, transparent);
1412
+ @supports (color: color-mix(in lab, red, red)) {
1413
+ background-color: color-mix(in oklab, var(--color-black) 20%, transparent);
1414
+ }
1415
+ }
1356
1416
  .bg-black\/50 {
1357
1417
  background-color: color-mix(in srgb, #000 50%, transparent);
1358
1418
  @supports (color: color-mix(in lab, red, red)) {
@@ -1377,6 +1437,9 @@
1377
1437
  .bg-blue-500 {
1378
1438
  background-color: var(--color-blue-500);
1379
1439
  }
1440
+ .bg-blue-700\! {
1441
+ background-color: var(--color-blue-700) !important;
1442
+ }
1380
1443
  .bg-blue-900 {
1381
1444
  background-color: var(--color-blue-900);
1382
1445
  }
@@ -1404,6 +1467,9 @@
1404
1467
  background-color: color-mix(in oklab, var(--foreground) 20%, transparent);
1405
1468
  }
1406
1469
  }
1470
+ .bg-gray-50 {
1471
+ background-color: var(--color-gray-50);
1472
+ }
1407
1473
  .bg-gray-100 {
1408
1474
  background-color: var(--color-gray-100);
1409
1475
  }
@@ -1551,6 +1617,9 @@
1551
1617
  .px-4 {
1552
1618
  padding-inline: calc(var(--spacing) * 4);
1553
1619
  }
1620
+ .px-5 {
1621
+ padding-inline: calc(var(--spacing) * 5);
1622
+ }
1554
1623
  .px-6 {
1555
1624
  padding-inline: calc(var(--spacing) * 6);
1556
1625
  }
@@ -1731,6 +1800,10 @@
1731
1800
  --tw-font-weight: var(--font-weight-bold);
1732
1801
  font-weight: var(--font-weight-bold);
1733
1802
  }
1803
+ .font-extrabold {
1804
+ --tw-font-weight: var(--font-weight-extrabold);
1805
+ font-weight: var(--font-weight-extrabold);
1806
+ }
1734
1807
  .font-medium {
1735
1808
  --tw-font-weight: var(--font-weight-medium);
1736
1809
  font-weight: var(--font-weight-medium);
@@ -1818,6 +1891,9 @@
1818
1891
  .text-primary-foreground {
1819
1892
  color: var(--primary-foreground);
1820
1893
  }
1894
+ .text-red-600 {
1895
+ color: var(--color-red-600);
1896
+ }
1821
1897
  .text-secondary-foreground {
1822
1898
  color: var(--secondary-foreground);
1823
1899
  }
@@ -1845,6 +1921,9 @@
1845
1921
  .text-white {
1846
1922
  color: var(--color-white);
1847
1923
  }
1924
+ .text-white\! {
1925
+ color: var(--color-white) !important;
1926
+ }
1848
1927
  .text-white\/80 {
1849
1928
  color: color-mix(in srgb, #fff 80%, transparent);
1850
1929
  @supports (color: color-mix(in lab, red, red)) {
@@ -3239,12 +3318,18 @@
3239
3318
  }
3240
3319
  }
3241
3320
  @media (width >= 48rem) {
3321
+ .md\:right-10 {
3322
+ right: calc(var(--spacing) * 10);
3323
+ }
3242
3324
  .md\:mx-4 {
3243
3325
  margin-inline: calc(var(--spacing) * 4);
3244
3326
  }
3245
3327
  .md\:my-2 {
3246
3328
  margin-block: calc(var(--spacing) * 2);
3247
3329
  }
3330
+ .md\:mt-3 {
3331
+ margin-top: calc(var(--spacing) * 3);
3332
+ }
3248
3333
  .md\:mt-10 {
3249
3334
  margin-top: calc(var(--spacing) * 10);
3250
3335
  }
@@ -3254,8 +3339,11 @@
3254
3339
  .md\:flex {
3255
3340
  display: flex;
3256
3341
  }
3257
- .md\:h-37\.5 {
3258
- height: calc(var(--spacing) * 37.5);
3342
+ .md\:h-20 {
3343
+ height: calc(var(--spacing) * 20);
3344
+ }
3345
+ .md\:h-25 {
3346
+ height: calc(var(--spacing) * 25);
3259
3347
  }
3260
3348
  .md\:h-100 {
3261
3349
  height: calc(var(--spacing) * 100);
@@ -3281,8 +3369,11 @@
3281
3369
  .md\:w-11\/12 {
3282
3370
  width: calc(11 / 12 * 100%);
3283
3371
  }
3284
- .md\:w-37\.5 {
3285
- width: calc(var(--spacing) * 37.5);
3372
+ .md\:w-20 {
3373
+ width: calc(var(--spacing) * 20);
3374
+ }
3375
+ .md\:w-25 {
3376
+ width: calc(var(--spacing) * 25);
3286
3377
  }
3287
3378
  .md\:w-225 {
3288
3379
  width: calc(var(--spacing) * 225);
@@ -3290,6 +3381,12 @@
3290
3381
  .md\:max-w-md {
3291
3382
  max-width: var(--container-md);
3292
3383
  }
3384
+ .md\:min-w-32 {
3385
+ min-width: calc(var(--spacing) * 32);
3386
+ }
3387
+ .md\:basis-1\/2 {
3388
+ flex-basis: calc(1 / 2 * 100%);
3389
+ }
3293
3390
  .md\:grid-cols-2 {
3294
3391
  grid-template-columns: repeat(2, minmax(0, 1fr));
3295
3392
  }
@@ -3299,6 +3396,9 @@
3299
3396
  .md\:gap-1\.5 {
3300
3397
  gap: calc(var(--spacing) * 1.5);
3301
3398
  }
3399
+ .md\:gap-2 {
3400
+ gap: calc(var(--spacing) * 2);
3401
+ }
3302
3402
  .md\:gap-5 {
3303
3403
  gap: calc(var(--spacing) * 5);
3304
3404
  }
@@ -3330,6 +3430,10 @@
3330
3430
  font-size: var(--text-2xl);
3331
3431
  line-height: var(--tw-leading, var(--text-2xl--line-height));
3332
3432
  }
3433
+ .md\:text-3xl {
3434
+ font-size: var(--text-3xl);
3435
+ line-height: var(--tw-leading, var(--text-3xl--line-height));
3436
+ }
3333
3437
  .md\:text-4xl {
3334
3438
  font-size: var(--text-4xl);
3335
3439
  line-height: var(--tw-leading, var(--text-4xl--line-height));
@@ -3350,6 +3454,12 @@
3350
3454
  font-size: var(--text-xl);
3351
3455
  line-height: var(--tw-leading, var(--text-xl--line-height));
3352
3456
  }
3457
+ .md\:text-\[14px\] {
3458
+ font-size: 14px;
3459
+ }
3460
+ .md\:text-\[15px\] {
3461
+ font-size: 15px;
3462
+ }
3353
3463
  .md\:text-\[20px\] {
3354
3464
  font-size: 20px;
3355
3465
  }
@@ -3390,6 +3500,9 @@
3390
3500
  .lg\:right-0 {
3391
3501
  right: 0px;
3392
3502
  }
3503
+ .lg\:right-12 {
3504
+ right: calc(var(--spacing) * 12);
3505
+ }
3393
3506
  .lg\:-bottom-3 {
3394
3507
  bottom: calc(var(--spacing) * -3);
3395
3508
  }
@@ -3399,14 +3512,20 @@
3399
3512
  .lg\:block {
3400
3513
  display: block;
3401
3514
  }
3402
- .lg\:h-50 {
3403
- height: calc(var(--spacing) * 50);
3515
+ .lg\:h-24 {
3516
+ height: calc(var(--spacing) * 24);
3517
+ }
3518
+ .lg\:h-45 {
3519
+ height: calc(var(--spacing) * 45);
3404
3520
  }
3405
3521
  .lg\:h-105 {
3406
3522
  height: calc(var(--spacing) * 105);
3407
3523
  }
3408
- .lg\:w-50 {
3409
- width: calc(var(--spacing) * 50);
3524
+ .lg\:w-32 {
3525
+ width: calc(var(--spacing) * 32);
3526
+ }
3527
+ .lg\:w-45 {
3528
+ width: calc(var(--spacing) * 45);
3410
3529
  }
3411
3530
  .lg\:w-105 {
3412
3531
  width: calc(var(--spacing) * 105);
@@ -3414,6 +3533,12 @@
3414
3533
  .lg\:max-w-100 {
3415
3534
  max-width: calc(var(--spacing) * 100);
3416
3535
  }
3536
+ .lg\:basis-1\/4 {
3537
+ flex-basis: calc(1 / 4 * 100%);
3538
+ }
3539
+ .lg\:basis-auto {
3540
+ flex-basis: auto;
3541
+ }
3417
3542
  .lg\:grid-cols-3 {
3418
3543
  grid-template-columns: repeat(3, minmax(0, 1fr));
3419
3544
  }
@@ -3423,9 +3548,9 @@
3423
3548
  .lg\:gap-15 {
3424
3549
  gap: calc(var(--spacing) * 15);
3425
3550
  }
3426
- .lg\:text-2xl {
3427
- font-size: var(--text-2xl);
3428
- line-height: var(--tw-leading, var(--text-2xl--line-height));
3551
+ .lg\:text-4xl {
3552
+ font-size: var(--text-4xl);
3553
+ line-height: var(--tw-leading, var(--text-4xl--line-height));
3429
3554
  }
3430
3555
  .lg\:text-\[80px\] {
3431
3556
  font-size: 80px;
@@ -3469,6 +3594,9 @@
3469
3594
  .dark\:border-gray-700:is(.dark *) {
3470
3595
  border-color: var(--color-gray-700);
3471
3596
  }
3597
+ .dark\:bg-background:is(.dark *) {
3598
+ background-color: var(--background);
3599
+ }
3472
3600
  .dark\:bg-black:is(.dark *) {
3473
3601
  background-color: var(--color-black);
3474
3602
  }
@@ -1,3 +1,3 @@
1
- export declare function useIsMobile(): {
1
+ export declare function useDevice(): {
2
2
  readonly isMobile: boolean;
3
3
  };
@@ -1,6 +1,6 @@
1
1
  import { onMount } from "svelte";
2
2
  const MOBILE_BREAKPOINT = 768;
3
- export function useIsMobile() {
3
+ export function useDevice() {
4
4
  let isMobile = $state(false);
5
5
  onMount(() => {
6
6
  const update = () => {
package/dist/index.d.ts CHANGED
@@ -12,7 +12,7 @@ import AdminPanel from "./components/pages/admin/01/ui/AdminPanel.svelte";
12
12
  import PrivacyPolicyOrTermsOfUse from "./components/pages/privacy-policy-or-terms-of-use/PrivacyPolicyOrTermsOfUse.svelte";
13
13
  import PageOtpVerification from "./components/pages/security/otp-verification/PageOtpVerification.svelte";
14
14
  import PageForgetPassword from "./components/pages/security/forget-password/PageForgetPassword.svelte";
15
- import SimpleBadgeCarousel from "./components/core/carousel/shared/ui/SimpleBadgeCarousel.svelte";
15
+ import CarouselBadge from "./components/core/carousel/badge/ui/CarouselBadge.svelte";
16
16
  import PageResetPassword from "./components/pages/security/reset-password/PageResetPassword.svelte";
17
17
  import TabUnderline from "./components/core/tabs/ui/tab-underline.svelte";
18
18
  import CarouselHero from "./components/core/carousel/hero/CarouselHero.svelte";
@@ -34,7 +34,7 @@ export { getMergedTranslations } from "./i18n/config";
34
34
  export { getLocales } from "./i18n/config";
35
35
  export {
36
36
  /** Componente raiz do Negodesign. Configura o tema, idioma e traduções. @property {Record<string, Record<string, string>>} translations - Traduções customizadas @property {Snippet} children - Conteúdo da aplicação */
37
- NegoDesign, NavMenu, SearchInput, SimpleBadgeCarousel, CarouselHero,
37
+ NegoDesign, NavMenu, SearchInput, CarouselBadge, CarouselHero,
38
38
  /** Carousel de promoções com cards de produto. @see CarouselPromotionProps */
39
39
  CarouselPromotion,
40
40
  /** Carousel de destaques com cards de organização. @see CarouselHighlightsProps */
package/dist/index.js CHANGED
@@ -12,7 +12,7 @@ import AdminPanel from "./components/pages/admin/01/ui/AdminPanel.svelte";
12
12
  import PrivacyPolicyOrTermsOfUse from "./components/pages/privacy-policy-or-terms-of-use/PrivacyPolicyOrTermsOfUse.svelte";
13
13
  import PageOtpVerification from "./components/pages/security/otp-verification/PageOtpVerification.svelte";
14
14
  import PageForgetPassword from "./components/pages/security/forget-password/PageForgetPassword.svelte";
15
- import SimpleBadgeCarousel from "./components/core/carousel/shared/ui/SimpleBadgeCarousel.svelte";
15
+ import CarouselBadge from "./components/core/carousel/badge/ui/CarouselBadge.svelte";
16
16
  import PageResetPassword from "./components/pages/security/reset-password/PageResetPassword.svelte";
17
17
  import TabUnderline from "./components/core/tabs/ui/tab-underline.svelte";
18
18
  import CarouselHero from "./components/core/carousel/hero/CarouselHero.svelte";
@@ -34,7 +34,7 @@ export { getMergedTranslations } from "./i18n/config";
34
34
  export { getLocales } from "./i18n/config";
35
35
  export {
36
36
  /** Componente raiz do Negodesign. Configura o tema, idioma e traduções. @property {Record<string, Record<string, string>>} translations - Traduções customizadas @property {Snippet} children - Conteúdo da aplicação */
37
- NegoDesign, NavMenu, SearchInput, SimpleBadgeCarousel, CarouselHero,
37
+ NegoDesign, NavMenu, SearchInput, CarouselBadge, CarouselHero,
38
38
  /** Carousel de promoções com cards de produto. @see CarouselPromotionProps */
39
39
  CarouselPromotion,
40
40
  /** Carousel de destaques com cards de organização. @see CarouselHighlightsProps */