negodesign 0.0.42 → 0.0.44

package/dist/components/core/card/product/01/CardProduct01.svelte

@@ -86,6 +86,12 @@
         onerror={(e) =>
           ((e.target as HTMLImageElement).src = ImgPlaceHolderGallery)}
       />
+    {:else}
+      <img
+        src={ImgPlaceHolderGallery}
+        alt="Not Found"
+        class="rounded-lg h-36 md:h-44 w-full object-cover object-center"
+      />
     {/if}
     <div class="absolute inset-0 bg-black/5 rounded-sm h-full w-full"></div>
   </aside>

package/dist/components/core/card/product/02/CardProduct02.svelte

@@ -85,6 +85,12 @@
         onerror={(e) =>
           ((e.target as HTMLImageElement).src = ImgPlaceHolderGallery)}
       />
+    {:else}
+      <img
+        src={ImgPlaceHolderGallery}
+        alt="Not Found"
+        class="rounded-lg h-36 md:h-44 w-full object-cover object-center"
+      />
     {/if}
     <div class="absolute inset-0 bg-black/5 rounded-sm h-full w-full"></div>
   </aside>

package/dist/components/core/card/product/data.js

@@ -2,7 +2,7 @@ import { GlobalIcon, MapPin, NecklaceIcon } from "@hugeicons/core-free-icons";
 const items = [
     {
         id: 1,
-        imageUrl: "https://images.unsplash.com/photo-1507525428034-b723cf961d3e?q=80&w=1170&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
+        //imageUrl: "https://images.unsplash.com/photo-1507525428034-b723cf961d3e?q=80&w=1170&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
         title: "Hotel Baía Azul",
         content: "Acomodação premium de frente para o mar com quartos luxuosos, restaurante internacional, piscina aquecida e serviço de transfer exclusivo para hóspedes.",
         isFavorite: true,

package/dist/components/core/footer/ui/01/Footer01.svelte

@@ -16,16 +16,7 @@
     onSubscribe,
   }: FooterProps = $props();
 
-  let email = $state("");
   const year = new Date().getFullYear();
-
-  function handleSubscribe(e: SubmitEvent) {
-    e.preventDefault();
-    const value = email.trim();
-    if (!value) return;
-    onSubscribe?.(value);
-    email = "";
-  }
 </script>
 
 <footer class="p-10">

package/dist/components/pages/privacy-policy-or-terms-of-use/01/PrivacyPolicyOrTermsOfUse01.svelte

@@ -12,16 +12,23 @@
 </script>
 
 <script lang="ts">
-  import type { DocPageData } from "../types";
   import { buildToc } from "../shared/toc";
   import PrivacyPolicyOrTermsOfUseBreadcrumb from "../shared/PrivacyPolicyOrTermsOfUseBreadcrumb.svelte";
   import DocSectionView from "../shared/DocSectionView.svelte";
   import DocsSidebar from "./DocsSidebar.svelte";
   import TableOfContents from "./TableOfContents.svelte";
+  import type { PrivacyPolicyOrTermsOfUseProps } from "../types";
 
-  let { data }: { data: DocPageData } = $props();
+  let {
+    breadcrumb,
+    sections,
+    title,
+    lastUpdated,
+    isVisibleMenuLeft = true,
+    isVisibleMenuRight,
+  }: PrivacyPolicyOrTermsOfUseProps = $props();
 
-  const toc = $derived(buildToc(data.sections));
+  const toc = $derived(buildToc(sections));
 
   /** Currently visible section, for highlighting in the TOC (simple scroll-spy). */
   let activeId = $state<string | undefined>(undefined);
@@ -48,26 +55,29 @@
 
 <div class="mx-auto max-w-7xl px-6 py-10">
   <div class="flex gap-10">
-    <DocsSidebar sections={data.sections} {activeId} />
+    {#if isVisibleMenuLeft}
+      <DocsSidebar {sections} {activeId} />
+    {/if}
 
     <main class="min-w-0 flex-1 flex flex-col gap-8">
       <header class="flex flex-col gap-4">
         <div>
-          <h1 class="text-3xl font-bold tracking-tight">{data.title}</h1>
+          <h1 class="text-3xl font-bold tracking-tight">{title}</h1>
           <p class="mt-1 text-sm text-muted-foreground">
-            Latest update: {data.lastUpdated}
+            Latest update: {lastUpdated}
           </p>
         </div>
-        <PrivacyPolicyOrTermsOfUseBreadcrumb items={data.breadcrumb} />
+        <PrivacyPolicyOrTermsOfUseBreadcrumb items={breadcrumb} />
       </header>
 
       <div class="flex flex-col gap-10">
-        {#each data.sections as section (section.id)}
+        {#each sections as section (section.id)}
           <DocSectionView {section} />
         {/each}
       </div>
     </main>
-
-    <TableOfContents items={toc} {activeId} />
+    {#if isVisibleMenuRight}
+      <TableOfContents items={toc} {activeId} />
+    {/if}
   </div>
 </div>

package/dist/components/pages/privacy-policy-or-terms-of-use/01/PrivacyPolicyOrTermsOfUse01.svelte.d.ts

@@ -1,7 +1,4 @@
-import type { DocPageData } from "../types";
-type $$ComponentProps = {
-    data: DocPageData;
-};
-declare const PrivacyPolicyOrTermsOfUse01: import("svelte").Component<$$ComponentProps, {}, "">;
+import type { PrivacyPolicyOrTermsOfUseProps } from "../types";
+declare const PrivacyPolicyOrTermsOfUse01: import("svelte").Component<PrivacyPolicyOrTermsOfUseProps, {}, "">;
 type PrivacyPolicyOrTermsOfUse01 = ReturnType<typeof PrivacyPolicyOrTermsOfUse01>;
 export default PrivacyPolicyOrTermsOfUse01;

package/dist/components/pages/privacy-policy-or-terms-of-use/02/PrivacyPolicyOrTermsOfUse02.svelte

@@ -11,14 +11,14 @@
 </script>
 
 <script lang="ts">
-  import type { DocPageData } from "../types";
   import DocsPageHero from "./DocsPageHero.svelte";
+  import type { PrivacyPolicyOrTermsOfUseProps } from "../types";
 
-  let { data }: { data: DocPageData } = $props();
+  let { ...data }: PrivacyPolicyOrTermsOfUseProps = $props();
 </script>
 
 <svelte:head>
   <title>{data.title}</title>
 </svelte:head>
 
-<DocsPageHero data={data} />
+<DocsPageHero {data} />

package/dist/components/pages/privacy-policy-or-terms-of-use/02/PrivacyPolicyOrTermsOfUse02.svelte.d.ts

@@ -1,7 +1,4 @@
-import type { DocPageData } from "../types";
-type $$ComponentProps = {
-    data: DocPageData;
-};
-declare const PrivacyPolicyOrTermsOfUse02: import("svelte").Component<$$ComponentProps, {}, "">;
+import type { PrivacyPolicyOrTermsOfUseProps } from "../types";
+declare const PrivacyPolicyOrTermsOfUse02: import("svelte").Component<PrivacyPolicyOrTermsOfUseProps, {}, "">;
 type PrivacyPolicyOrTermsOfUse02 = ReturnType<typeof PrivacyPolicyOrTermsOfUse02>;
 export default PrivacyPolicyOrTermsOfUse02;

package/dist/components/pages/privacy-policy-or-terms-of-use/PrivacyPolicyOrTermsOfUse.svelte

@@ -8,10 +8,10 @@
    * @component
    * @example
    * ```svelte
-    * <!-- Variant 1 (default) — docs layout with sidebar -->
+   * <!-- Variant 1 (default) — docs layout with sidebar -->
    * <PrivacyPolicyOrTermsOfUse variant={1} data={pageData} />
    *
-    * <!-- Variant 2 — layout with hero -->
+   * <!-- Variant 2 — layout with hero -->
    * <PrivacyPolicyOrTermsOfUse variant={2} data={pageData} />
    * ```
    */
@@ -22,11 +22,11 @@
   import PrivacyPolicyOrTermsOfUse01 from "./01/PrivacyPolicyOrTermsOfUse01.svelte";
   import PrivacyPolicyOrTermsOfUse02 from "./02/PrivacyPolicyOrTermsOfUse02.svelte";
 
-  let { variant = 1, data }: PrivacyPolicyOrTermsOfUseProps = $props();
+  let { variant = 1, ...data }: PrivacyPolicyOrTermsOfUseProps = $props();
 </script>
 
 {#if variant === 2}
-  <PrivacyPolicyOrTermsOfUse02 {data} />
+  <PrivacyPolicyOrTermsOfUse02 {...data} />
 {:else}
-  <PrivacyPolicyOrTermsOfUse01 {data} />
+  <PrivacyPolicyOrTermsOfUse01 {...data} />
 {/if}

package/dist/components/pages/privacy-policy-or-terms-of-use/types.d.ts

@@ -37,17 +37,6 @@ export interface DocSection {
     /** subsecções aninhadas */
     subsections?: DocSection[];
 }
-/** Dados completos de uma página de documentação/política. */
-export interface DocPageData {
-    /** título da página */
-    title: string;
-    /** data da última atualização */
-    lastUpdated: string;
-    /** itens do breadcrumb */
-    breadcrumb: BreadcrumbItem[];
-    /** secções de conteúdo (usadas pela sidebar, TOC e renderização) */
-    sections: DocSection[];
-}
 /** Item derivado automaticamente das secções, para a tabela de conteúdos (TOC). */
 export interface TocItem {
     id: string;
@@ -57,6 +46,14 @@ export interface TocItem {
 export interface PrivacyPolicyOrTermsOfUseProps {
     /** Variante do layout: 1 = sidebar+TOC, 2 = hero+coluna. */
     variant?: 1 | 2;
-    /** Dados completos da página de documento. */
-    data: DocPageData;
+    /** título da página */
+    title: string;
+    /** data da última atualização */
+    lastUpdated: string;
+    /** itens do breadcrumb */
+    breadcrumb: BreadcrumbItem[];
+    /** secções de conteúdo (usadas pela sidebar, TOC e renderização) */
+    sections: DocSection[];
+    isVisibleMenuLeft?: boolean;
+    isVisibleMenuRight?: boolean;
 }

package/dist/components/pages/product-details/01/ProductDetails01.svelte

@@ -20,17 +20,21 @@
   import ProductDetailReviews from "../shared/ProductDetailReviews.svelte";
   import ProductDetailTags from "../shared/ProductDetailTags.svelte";
   import ProductPurchasePanel from "../shared/ProductPurchasePanel.svelte";
-  import type { ProductDetailsData } from "../types";
+  import type { ProductDetailsData, ProductPromotionDetails } from "../types";
 
   let {
     data,
     isLoading = false,
+    promotions = [],
+    showPriceWithPromotions = false,
     onBuy,
     onFavorite,
     onCart,
   }: {
     data: ProductDetailsData;
     isLoading?: boolean;
+    promotions?: ProductPromotionDetails[];
+    showPriceWithPromotions?: boolean;
     onBuy?: (id: string | number) => void;
     onFavorite?: (id: string | number) => void;
     onCart?: (id: string | number) => void;
@@ -64,7 +68,7 @@
         <ProductDetailFeatures features={data.features} {isLoading} />
       {/if}
 
-      <ProductPurchasePanel {data} {isLoading} {onBuy} {onFavorite} {onCart} />
+      <ProductPurchasePanel {data} {isLoading} {promotions} {showPriceWithPromotions} {onBuy} {onFavorite} {onCart} />
     </div>
   </div>
 

package/dist/components/pages/product-details/01/ProductDetails01.svelte.d.ts

@@ -1,7 +1,9 @@
-import type { ProductDetailsData } from "../types";
+import type { ProductDetailsData, ProductPromotionDetails } from "../types";
 type $$ComponentProps = {
     data: ProductDetailsData;
     isLoading?: boolean;
+    promotions?: ProductPromotionDetails[];
+    showPriceWithPromotions?: boolean;
     onBuy?: (id: string | number) => void;
     onFavorite?: (id: string | number) => void;
     onCart?: (id: string | number) => void;

package/dist/components/pages/product-details/02/ProductDetails02.svelte

@@ -20,17 +20,21 @@
   import ProductDetailReviews from "../shared/ProductDetailReviews.svelte";
   import ProductDetailTags from "../shared/ProductDetailTags.svelte";
   import ProductPurchasePanel from "../shared/ProductPurchasePanel.svelte";
-  import type { ProductDetailsData } from "../types";
+  import type { ProductDetailsData, ProductPromotionDetails } from "../types";
 
   let {
     data,
     isLoading = false,
+    promotions = [],
+    showPriceWithPromotions = false,
     onBuy,
     onFavorite,
     onCart,
   }: {
     data: ProductDetailsData;
     isLoading?: boolean;
+    promotions?: ProductPromotionDetails[];
+    showPriceWithPromotions?: boolean;
     onBuy?: (id: string | number) => void;
     onFavorite?: (id: string | number) => void;
     onCart?: (id: string | number) => void;
@@ -72,6 +76,8 @@
         <ProductPurchasePanel
           {data}
           {isLoading}
+          {promotions}
+          {showPriceWithPromotions}
           {onBuy}
           {onFavorite}
           {onCart}

package/dist/components/pages/product-details/02/ProductDetails02.svelte.d.ts

@@ -1,7 +1,9 @@
-import type { ProductDetailsData } from "../types";
+import type { ProductDetailsData, ProductPromotionDetails } from "../types";
 type $$ComponentProps = {
     data: ProductDetailsData;
     isLoading?: boolean;
+    promotions?: ProductPromotionDetails[];
+    showPriceWithPromotions?: boolean;
     onBuy?: (id: string | number) => void;
     onFavorite?: (id: string | number) => void;
     onCart?: (id: string | number) => void;

package/dist/components/pages/product-details/03/ProductDetails03.svelte

@@ -19,18 +19,22 @@
   import ProductDetailTags from "../shared/ProductDetailTags.svelte";
   import ProductDetailTabs from "../shared/ProductDetailTabs.svelte";
   import ProductPurchasePanel from "../shared/ProductPurchasePanel.svelte";
-  import type { ProductDetailsData } from "../types";
+  import type { ProductDetailsData, ProductPromotionDetails } from "../types";
   import { useDevice } from "../../../../hooks/responsive.svelte";
 
   let {
     data,
     isLoading = false,
+    promotions = [],
+    showPriceWithPromotions = false,
     onBuy,
     onFavorite,
     onCart,
   }: {
     data: ProductDetailsData;
     isLoading?: boolean;
+    promotions?: ProductPromotionDetails[];
+    showPriceWithPromotions?: boolean;
     onBuy?: (id: string | number) => void;
     onFavorite?: (id: string | number) => void;
     onCart?: (id: string | number) => void;
@@ -55,7 +59,7 @@
 
       <ProductDetailTags tags={data.tags} {isLoading} />
 
-      <ProductPurchasePanel {data} {isLoading} {onBuy} {onFavorite} {onCart} />
+      <ProductPurchasePanel {data} {isLoading} {promotions} {showPriceWithPromotions} {onBuy} {onFavorite} {onCart} />
 
       {#if !responsive.isMobile}
         {#if data.location}

package/dist/components/pages/product-details/03/ProductDetails03.svelte.d.ts

@@ -1,7 +1,9 @@
-import type { ProductDetailsData } from "../types";
+import type { ProductDetailsData, ProductPromotionDetails } from "../types";
 type $$ComponentProps = {
     data: ProductDetailsData;
     isLoading?: boolean;
+    promotions?: ProductPromotionDetails[];
+    showPriceWithPromotions?: boolean;
     onBuy?: (id: string | number) => void;
     onFavorite?: (id: string | number) => void;
     onCart?: (id: string | number) => void;

package/dist/components/pages/product-details/ProductDetails.svelte

@@ -20,13 +20,15 @@
 <script lang="ts">
   import type { ProductDetailsProps } from "./types";
   import ProductDetails01 from "./01/ProductDetails01.svelte";
-  import ProductDetails03 from "./02/ProductDetails02.svelte";
-  import ProductDetails04 from "./03/ProductDetails03.svelte";
+  import ProductDetails02 from "./02/ProductDetails02.svelte";
+  import ProductDetails03 from "./03/ProductDetails03.svelte";
 
   let {
     varient = 1,
     data,
     isLoading = false,
+    promotions = [],
+    showPriceWithPromotions = false,
     onBuy,
     onFavorite,
     onCart,
@@ -34,9 +36,33 @@
 </script>
 
 {#if varient === 2}
-  <ProductDetails03 {data} {isLoading} {onBuy} {onFavorite} {onCart} />
+  <ProductDetails02
+    {data}
+    {isLoading}
+    {promotions}
+    {showPriceWithPromotions}
+    {onBuy}
+    {onFavorite}
+    {onCart}
+  />
 {:else if varient === 3}
-  <ProductDetails04 {data} {isLoading} {onBuy} {onFavorite} {onCart} />
+  <ProductDetails03
+    {data}
+    {isLoading}
+    {promotions}
+    {showPriceWithPromotions}
+    {onBuy}
+    {onFavorite}
+    {onCart}
+  />
 {:else}
-  <ProductDetails01 {data} {isLoading} {onBuy} {onFavorite} {onCart} />
+  <ProductDetails01
+    {data}
+    {isLoading}
+    {promotions}
+    {showPriceWithPromotions}
+    {onBuy}
+    {onFavorite}
+    {onCart}
+  />
 {/if}

package/dist/components/pages/product-details/shared/ProductPromotionDetails.svelte

@@ -0,0 +1,29 @@
+<script lang="ts">
+  import CardPromotionPrice from "../../../core/card/promotion/CardPromotionPrice.svelte";
+  import Skeleton from "../../../ui/skeleton/skeleton.svelte";
+  import type { ProductPromotionDetails } from "../types";
+
+  let {
+    promotions = [],
+    isLoading = false,
+  }: {
+    promotions?: ProductPromotionDetails[];
+    isLoading?: boolean;
+  } = $props();
+</script>
+
+{#if isLoading}
+  <div class="flex flex-col gap-2">
+    <Skeleton class="h-5 w-36 rounded-md" />
+    <Skeleton class="h-5 w-28 rounded-md" />
+  </div>
+{:else if promotions.length > 0}
+  <div class="flex flex-col gap-2">
+    <span class="text-sm font-medium text-muted-foreground">Promoções</span>
+    {#each promotions as promo (promo.id)}
+      <div class="flex items-center gap-2">
+        <CardPromotionPrice newPrice={promo.newPrice} oldPrice={promo.oldPrice} />
+      </div>
+    {/each}
+  </div>
+{/if}

package/dist/components/pages/product-details/shared/ProductPromotionDetails.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { ProductPromotionDetails } from "../types";
+type $$ComponentProps = {
+    promotions?: ProductPromotionDetails[];
+    isLoading?: boolean;
+};
+declare const ProductPromotionDetails: import("svelte").Component<$$ComponentProps, {}, "">;
+type ProductPromotionDetails = ReturnType<typeof ProductPromotionDetails>;
+export default ProductPromotionDetails;

package/dist/components/pages/product-details/shared/ProductPurchasePanel.svelte

@@ -14,17 +14,22 @@
   import ProductDetailActions from "./ProductDetailActions.svelte";
   import ProductDetailPrice from "./ProductDetailPrice.svelte";
   import ProductDetailRating from "./ProductDetailRating.svelte";
-  import type { ProductDetailsData } from "../types";
+  import ProductPromotionDetails from "./ProductPromotionDetails.svelte";
+  import type { ProductDetailsData, ProductPromotionDetails as ProductPromotionDetailsType } from "../types";
 
   let {
     data,
     isLoading = false,
+    promotions = [],
+    showPriceWithPromotions = false,
     onBuy,
     onFavorite,
     onCart,
   }: {
     data: ProductDetailsData;
     isLoading?: boolean;
+    promotions?: ProductPromotionDetailsType[];
+    showPriceWithPromotions?: boolean;
     onBuy?: (id: string | number) => void;
     onFavorite?: (id: string | number) => void;
     onCart?: (id: string | number) => void;
@@ -38,12 +43,16 @@
     {isLoading}
   />
 
-  <ProductDetailPrice
-    newPrice={data.newPrice}
-    oldPrice={data.oldPrice}
-    currency={data.currency}
-    {isLoading}
-  />
+  {#if !(showPriceWithPromotions && promotions.length > 0)}
+    <ProductDetailPrice
+      newPrice={data.newPrice}
+      oldPrice={data.oldPrice}
+      currency={data.currency}
+      {isLoading}
+    />
+  {/if}
+
+  <ProductPromotionDetails {promotions} {isLoading} />
 
   <ProductDetailActions
     id={data.id}

package/dist/components/pages/product-details/shared/ProductPurchasePanel.svelte.d.ts

@@ -1,7 +1,9 @@
-import type { ProductDetailsData } from "../types";
+import type { ProductDetailsData, ProductPromotionDetails as ProductPromotionDetailsType } from "../types";
 type $$ComponentProps = {
     data: ProductDetailsData;
     isLoading?: boolean;
+    promotions?: ProductPromotionDetailsType[];
+    showPriceWithPromotions?: boolean;
     onBuy?: (id: string | number) => void;
     onFavorite?: (id: string | number) => void;
     onCart?: (id: string | number) => void;

package/dist/components/pages/product-details/types.d.ts

@@ -141,6 +141,11 @@ export interface ProductDetailsData {
  * Propriedades do componente principal ProductDetails.
  * Suporta quatro variantes de layout e callbacks de interação.
  */
+export interface ProductPromotionDetails {
+    id: string | number;
+    newPrice: string | number;
+    oldPrice: string | number;
+}
 export interface ProductDetailsProps {
     /**
      * Variante do layout da página de detalhes.
@@ -159,6 +164,17 @@ export interface ProductDetailsProps {
      * @default false
      */
     isLoading?: boolean;
+    /**
+     * Lista de promoções associadas ao produto.
+     * Cada promoção contém um preço antigo e novo.
+     */
+    promotions?: ProductPromotionDetails[];
+    /**
+     * Quando true, oculta o preço regular do produto
+     * e apresenta apenas os preços das promoções.
+     * @default false
+     */
+    showPriceWithPromotions?: boolean;
     /**
      * Callback executado quando o utilizador clica no botão de compra.
      * Recebe o id do produto como argumento.

package/package.json

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