negodesign 0.0.60 → 0.0.62

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

@@ -1,19 +1,19 @@
-<script lang="ts">
-  import Skeleton from "../../../ui/skeleton/skeleton.svelte";
-  import ImgPlaceholderCompany from "../../../../assets/placeholder-company.png";
-
-  let { logo, isLoading = false }: { logo?: string; isLoading?: boolean } =
-    $props();
-</script>
-
-{#if isLoading}
-  <Skeleton class="w-12 h-12 rounded-lg bg-gray-300" />
-{:else if logo}
-  <img
-    src={logo}
-    alt={logo}
-    class="w-12 h-12 rounded-lg"
-    onerror={(e) =>
-      ((e.target as HTMLImageElement).src = ImgPlaceholderCompany)}
-  />
-{/if}
+<script lang="ts">
+  import Skeleton from "../../../ui/skeleton/skeleton.svelte";
+  import ImgPlaceholderCompany from "../../../../assets/placeholder-company.png";
+
+  let { logo, isLoading = false }: { logo?: string; isLoading?: boolean } =
+    $props();
+</script>
+
+{#if isLoading}
+  <Skeleton class="w-12 h-12 rounded-lg bg-gray-300" />
+{:else if logo}
+  <img
+    src={logo}
+    alt={logo}
+    class="w-12 h-12 rounded-lg"
+    onerror={(e) =>
+      ((e.target as HTMLImageElement).src = ImgPlaceholderCompany)}
+  />
+{/if}

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

@@ -1,45 +1,45 @@
-<script lang="ts">
-  import { Mail01Icon, WhatsappIcon } from "@hugeicons/core-free-icons";
-  import { HugeiconsIcon } from "@hugeicons/svelte";
-  import type { CardPhoneOrWhatsappProps } from "../types";
-
-  let {
-    id,
-    className,
-    buttonClass,
-    btnWhatsappClass,
-    btnEmailClass,
-    onEmailClick,
-    onWhatsappClick,
-  }: CardPhoneOrWhatsappProps = $props();
-
-  let isFlex = $derived(onEmailClick && onWhatsappClick);
-</script>
-
-<div class="flex border-t border-gray-300 dark:border-gray-700 {className}">
-  {#if onEmailClick}
-    <button
-      class="flex-1 flex justify-center items-center gap-2 p-3 hover:bg-red-800 hover:text-white cursor-pointer rounded-bl-lg {!isFlex
-        ? 'rounded-br-lg'
-        : ''} {buttonClass} {btnEmailClass}"
-      onclick={() => onEmailClick?.(id)}
-    >
-      <HugeiconsIcon icon={Mail01Icon} size={20} />
-      <span>Email</span>
-    </button>
-  {/if}
-  {#if isFlex}
-    <div class="border-l border-gray-300 dark:border-gray-700"></div>
-  {/if}
-  {#if onWhatsappClick}
-    <button
-      class="flex-1 flex justify-center items-center gap-2 p-3 hover:bg-green-600 hover:text-white cursor-pointer rounded-br-lg {!isFlex
-        ? 'rounded-bl-lg'
-        : ''} {buttonClass} {btnWhatsappClass}"
-      onclick={() => onWhatsappClick?.(id)}
-    >
-      <HugeiconsIcon icon={WhatsappIcon} size={20} />
-      <span>Whatsapp</span>
-    </button>
-  {/if}
-</div>
+<script lang="ts">
+  import { Mail01Icon, WhatsappIcon } from "@hugeicons/core-free-icons";
+  import { HugeiconsIcon } from "@hugeicons/svelte";
+  import type { CardPhoneOrWhatsappProps } from "../types";
+
+  let {
+    id,
+    className,
+    buttonClass,
+    btnWhatsappClass,
+    btnEmailClass,
+    onEmailClick,
+    onWhatsappClick,
+  }: CardPhoneOrWhatsappProps = $props();
+
+  let isFlex = $derived(onEmailClick && onWhatsappClick);
+</script>
+
+<div class="flex border-t border-gray-300 dark:border-gray-700 {className}">
+  {#if onEmailClick}
+    <button
+      class="flex-1 flex justify-center items-center gap-2 p-3 hover:bg-red-800 hover:text-white cursor-pointer rounded-bl-lg {!isFlex
+        ? 'rounded-br-lg'
+        : ''} {buttonClass} {btnEmailClass}"
+      onclick={() => onEmailClick?.(id)}
+    >
+      <HugeiconsIcon icon={Mail01Icon} size={20} />
+      <span>Email</span>
+    </button>
+  {/if}
+  {#if isFlex}
+    <div class="border-l border-gray-300 dark:border-gray-700"></div>
+  {/if}
+  {#if onWhatsappClick}
+    <button
+      class="flex-1 flex justify-center items-center gap-2 p-3 hover:bg-green-600 hover:text-white cursor-pointer rounded-br-lg {!isFlex
+        ? 'rounded-bl-lg'
+        : ''} {buttonClass} {btnWhatsappClass}"
+      onclick={() => onWhatsappClick?.(id)}
+    >
+      <HugeiconsIcon icon={WhatsappIcon} size={20} />
+      <span>Whatsapp</span>
+    </button>
+  {/if}
+</div>

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

@@ -1,24 +1,24 @@
-<script lang="ts">
-  import Skeleton from "../../../ui/skeleton/skeleton.svelte";
-  import * as StarRating from "../../../ui/star-rating";
-
-  type Props = {
-    startNumber: number;
-    startMax: number;
-    isLoading?: boolean;
-  };
-
-  let { startNumber, startMax, isLoading }: Props = $props();
-</script>
-
-{#if isLoading}
-  <Skeleton class="w-12 h-6 rounded-lg bg-gray-300/90" />
-{:else if startNumber}
-  <StarRating.Root max={startMax} value={startNumber} class="size-15 h-auto">
-    {#snippet children({ items })}
-      {#each items as item (item.index)}
-        <StarRating.Star {...item} class="py-0! my-0!" />
-      {/each}
-    {/snippet}
-  </StarRating.Root>
-{/if}
+<script lang="ts">
+  import Skeleton from "../../../ui/skeleton/skeleton.svelte";
+  import * as StarRating from "../../../ui/star-rating";
+
+  type Props = {
+    startNumber: number;
+    startMax: number;
+    isLoading?: boolean;
+  };
+
+  let { startNumber, startMax, isLoading }: Props = $props();
+</script>
+
+{#if isLoading}
+  <Skeleton class="w-12 h-6 rounded-lg bg-gray-300/90" />
+{:else if startNumber}
+  <StarRating.Root max={startMax} value={startNumber} class="size-15 h-auto">
+    {#snippet children({ items })}
+      {#each items as item (item.index)}
+        <StarRating.Star {...item} class="py-0! my-0!" />
+      {/each}
+    {/snippet}
+  </StarRating.Root>
+{/if}

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

@@ -1,95 +1,95 @@
-<script lang="ts">
-  import { HugeiconsIcon } from "@hugeicons/svelte";
-  import type { CardTagsProps } from "../types";
-  import Skeleton from "../../../ui/skeleton/skeleton.svelte";
-  import * as Popover from "../../../ui/popover"; // adjust path to your setup
-
-  type Props = {
-    className?: string;
-    tags?: CardTagsProps[];
-    isTagBorderBottom?: boolean;
-    isWrap?: boolean;
-    isLoading?: boolean;
-  };
-
-  const {
-    tags = [],
-    className,
-    isTagBorderBottom,
-    isWrap = false,
-    isLoading = false,
-  }: Props = $props();
-
-  let isJustify = $derived(tags?.length == 2 || tags?.length == 3);
-  let open = $state(false);
-</script>
-
-{#snippet createBadge(tag: CardTagsProps, clasName?: string)}
-  <div
-    class="flex items-center h-5 shrink-0 {isTagBorderBottom
-      ? 'border border-gray-200 rounded-full px-2 py-1'
-      : ''} {clasName}"
-  >
-    {#if tag.icon}
-      <HugeiconsIcon icon={tag.icon} class="mr-0.5 h-3.75 w-3.75 shrink-0" />
-    {/if}
-    <div class="whitespace-nowrap">{tag.text}</div>
-  </div>
-{/snippet}
-
-{#snippet skeletonTag()}
-  <div class="my-2 flex gap-5">
-    {#each Array.from({ length: 3 }) as it, i (i)}
-      <Skeleton class="h-5 w-25 bg-black/50" />
-    {/each}
-  </div>
-{/snippet}
-
-{#snippet tagsRow()}
-  {#if isWrap}
-    <div class="flex flex-wrap gap-2 md:gap-5 {className}">
-      {#if isLoading}
-        {@render skeletonTag()}
-      {:else if tags && tags.length > 0}
-        {#each tags as tag, i (i)}
-          {@render createBadge(tag)}
-        {/each}
-      {/if}
-    </div>
-  {:else}
-    <div
-      class="flex overflow-x-auto no-scrollbar w-full min-w-0
-          {isJustify ? 'justify-between gap-3' : 'gap-4 md:gap-5 lg:gap-10'}
-          {className}"
-    >
-      {#if isLoading}
-        {@render skeletonTag()}
-      {:else if tags && tags.length > 0}
-        {#each tags as tag, i (i)}
-          {@render createBadge(tag)}
-        {/each}
-      {/if}
-    </div>
-  {/if}
-{/snippet}
-
-<Popover.Root bind:open>
-  <Popover.Trigger
-    onmouseenter={() => (open = true)}
-    onmouseleave={() => (open = false)}
-    class="block w-full text-left h-8"
-  >
-    {@render tagsRow()}
-  </Popover.Trigger>
-  <Popover.Content
-    class="w-auto max-w-xs p-3"
-    onmouseenter={() => (open = true)}
-    onmouseleave={() => (open = false)}
-  >
-    <div class="flex flex-col gap-2">
-      {#each tags as tag, i (i)}
-        {@render createBadge(tag, "gap-2")}
-      {/each}
-    </div>
-  </Popover.Content>
-</Popover.Root>
+<script lang="ts">
+  import { HugeiconsIcon } from "@hugeicons/svelte";
+  import type { CardTagsProps } from "../types";
+  import Skeleton from "../../../ui/skeleton/skeleton.svelte";
+  import * as Popover from "../../../ui/popover"; // adjust path to your setup
+
+  type Props = {
+    className?: string;
+    tags?: CardTagsProps[];
+    isTagBorderBottom?: boolean;
+    isWrap?: boolean;
+    isLoading?: boolean;
+  };
+
+  const {
+    tags = [],
+    className,
+    isTagBorderBottom,
+    isWrap = false,
+    isLoading = false,
+  }: Props = $props();
+
+  let isJustify = $derived(tags?.length == 2 || tags?.length == 3);
+  let open = $state(false);
+</script>
+
+{#snippet createBadge(tag: CardTagsProps, clasName?: string)}
+  <div
+    class="flex items-center h-5 shrink-0 {isTagBorderBottom
+      ? 'border border-gray-200 rounded-full px-2 py-1'
+      : ''} {clasName}"
+  >
+    {#if tag.icon}
+      <HugeiconsIcon icon={tag.icon} class="mr-0.5 h-3.75 w-3.75 shrink-0" />
+    {/if}
+    <div class="whitespace-nowrap">{tag.text}</div>
+  </div>
+{/snippet}
+
+{#snippet skeletonTag()}
+  <div class="my-2 flex gap-5">
+    {#each Array.from({ length: 3 }) as it, i (i)}
+      <Skeleton class="h-5 w-25 bg-black/50" />
+    {/each}
+  </div>
+{/snippet}
+
+{#snippet tagsRow()}
+  {#if isWrap}
+    <div class="flex flex-wrap gap-2 md:gap-5 {className}">
+      {#if isLoading}
+        {@render skeletonTag()}
+      {:else if tags && tags.length > 0}
+        {#each tags as tag, i (i)}
+          {@render createBadge(tag)}
+        {/each}
+      {/if}
+    </div>
+  {:else}
+    <div
+      class="flex overflow-x-auto no-scrollbar w-full min-w-0
+          {isJustify ? 'justify-between gap-3' : 'gap-4 md:gap-5 lg:gap-10'}
+          {className}"
+    >
+      {#if isLoading}
+        {@render skeletonTag()}
+      {:else if tags && tags.length > 0}
+        {#each tags as tag, i (i)}
+          {@render createBadge(tag)}
+        {/each}
+      {/if}
+    </div>
+  {/if}
+{/snippet}
+
+<Popover.Root bind:open>
+  <Popover.Trigger
+    onmouseenter={() => (open = true)}
+    onmouseleave={() => (open = false)}
+    class="block w-full text-left h-8"
+  >
+    {@render tagsRow()}
+  </Popover.Trigger>
+  <Popover.Content
+    class="w-auto max-w-xs p-3"
+    onmouseenter={() => (open = true)}
+    onmouseleave={() => (open = false)}
+  >
+    <div class="flex flex-col gap-2">
+      {#each tags as tag, i (i)}
+        {@render createBadge(tag, "gap-2")}
+      {/each}
+    </div>
+  </Popover.Content>
+</Popover.Root>