negodesign 0.0.50 → 0.0.52

package/dist/components/core/card/profile/CardProfile.svelte

@@ -2,7 +2,7 @@
   import type { CardProfileProps } from "../types";
   import CardProfile01 from "./01/CardProfile01.svelte";
   import CardProfile02 from "./02/CardProfile02.svelte";
-  
+
   type Props = {
     variant?: 1 | 2;
     isLoading?: boolean;
@@ -12,7 +12,7 @@
 </script>
 
 {#if variant === 2}
-  <CardProfile02 {...restProps} />
+  <CardProfile02 {...restProps} {isLoading} />
 {:else}
-  <CardProfile01 {...restProps} />
+  <CardProfile01 {...restProps} {isLoading} />
 {/if}

package/dist/components/core/card/shared/CardThumbnailVideo.svelte

@@ -134,6 +134,12 @@
           class:opacity-0={videoUrl && showVideo}
           onerror={(e) => ((e.target as HTMLImageElement).src = ImgPlaceholder)}
         />
+      {:else}
+        <img
+          src={ImgPlaceholder}
+          alt={imageUrl}
+          class="rounded-lg w-50 h-[50px] object-cover object-center"
+        />
       {/if}
 
       {#if videoUrl && isVisible}

package/dist/components/core/carousel/grid/media/types.d.ts

@@ -22,4 +22,10 @@ export interface CarouselGridMediaProps {
     items: CardMediaProps[];
     /** Estado de carregamento (skeleton) */
     isLoading?: boolean;
+    /** Callback acionado ao clicar no botão de favorito */
+    onFavoriteClick?: (id: string | number) => void;
+    /** Callback acionado ao clicar no botão de perfil */
+    onButtonProfile?: (id: string | number) => void;
+    /** Callback acionado ao clicar no botão de detalhes */
+    onButtonDetails?: (id: string | number) => void;
 }

package/dist/components/core/carousel/grid/media/ui/CarouselGridMedia.svelte

@@ -17,6 +17,9 @@
     isLoading = false,
     isDescriptionIcon,
     isDescriptionLabel,
+    onFavoriteClick,
+    onButtonProfile,
+    onButtonDetails,
   }: CarouselGridMediaProps = $props();
 
   const responsive = useDevice();
@@ -34,7 +37,7 @@
       {#if isLoading}
         {#each Array.from( { length: responsive.isMobile ? 3 : 6 }, ) as _, i (`loading-${i}`)}
           {#if responsive.isMobile}
-            <Carousel.Item class="pl-2 basis-auto w-[300px]">
+            <Carousel.Item class="pl-2 basis-auto w-75">
               <CardMedia id={i} {variant} isLoading />
             </Carousel.Item>
           {:else}
@@ -46,12 +49,24 @@
       {:else}
         {#each items as item, i (`media-${item.id ?? i}`)}
           {#if responsive.isMobile}
-            <Carousel.Item class="pl-2 basis-auto w-[300px]">
+            <Carousel.Item class="pl-2 basis-auto w-75">
               <CardMedia
                 {...item}
                 {variant}
                 {isDescriptionIcon}
                 {isDescriptionLabel}
+                onFavoriteClick={(id: string | number) => {
+                  item?.onFavoriteClick?.(id);
+                  onFavoriteClick?.(id);
+                }}
+                onButtonProfile={(id: string | number) => {
+                  item?.onButtonProfile?.(id);
+                  onButtonProfile?.(id);
+                }}
+                onButtonDetails={(id: string | number) => {
+                  item?.onButtonDetails?.(id);
+                  onButtonDetails?.(id);
+                }}
               />
             </Carousel.Item>
           {:else}
@@ -61,6 +76,18 @@
                 {variant}
                 {isDescriptionIcon}
                 {isDescriptionLabel}
+                onFavoriteClick={(id: string | number) => {
+                  item?.onFavoriteClick?.(id);
+                  onFavoriteClick?.(id);
+                }}
+                onButtonProfile={(id: string | number) => {
+                  item?.onButtonProfile?.(id);
+                  onButtonProfile?.(id);
+                }}
+                onButtonDetails={(id: string | number) => {
+                  item?.onButtonDetails?.(id);
+                  onButtonDetails?.(id);
+                }}
               />
             </div>
           {/if}

package/dist/components/core/carousel/grid/product/ui/CarouselGridProduct.svelte

@@ -34,7 +34,7 @@
       {#if isLoading}
         {#each Array.from( { length: responsive.isMobile ? 3 : 6 }, ) as _, i (`loading-${i}`)}
           {#if responsive.isMobile}
-            <Carousel.Item class="pl-2 basis-auto w-[300px]">
+            <Carousel.Item class="pl-2 basis-auto w-75">
               <CardProduct id={i} {variant} isLoading />
             </Carousel.Item>
           {:else}
@@ -46,7 +46,7 @@
       {:else}
         {#each items as item, i (`product-${item.id ?? i}`)}
           {#if responsive.isMobile}
-            <Carousel.Item class="pl-2 basis-auto w-[300px]">
+            <Carousel.Item class="pl-2 basis-auto w-75">
               <CardProduct
                 {...item}
                 {variant}

package/dist/components/pages/company-profile/CompanyProfile.svelte

@@ -85,7 +85,7 @@
       items={sections}
       active={activeSection}
       onSelect={scrollToSection}
-      className="mt-6"
+      className="mt-2"
     />
   {/if}
 
@@ -98,7 +98,9 @@
       />
     {/if}
 
-    <div class="flex min-w-0 flex-1 flex-col gap-6 md:px-5 md:pl-10 lg:pl-12 pb-5 md:pb-10">
+    <div
+      class="flex min-w-0 flex-1 flex-col gap-6 md:px-5 md:pl-10 lg:pl-12 pt-2 pb-5 md:pb-10"
+    >
       <div
         id="banner"
         bind:this={sectionEls["banner"]}

package/dist/globals.css

@@ -530,9 +530,6 @@
   .mt-5 {
     margin-top: calc(var(--spacing) * 5);
   }
-  .mt-6 {
-    margin-top: calc(var(--spacing) * 6);
-  }
   .mt-7 {
     margin-top: calc(var(--spacing) * 7);
   }
@@ -816,6 +813,9 @@
   .h-75 {
     height: calc(var(--spacing) * 75);
   }
+  .h-\[50px\] {
+    height: 50px;
+  }
   .h-\[65px\] {
     height: 65px;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "negodesign",
-	"version": "0.0.50",
+	"version": "0.0.52",
 	"type": "module",
 	"license": "MIT",
 	"sideEffects": [