negodesign 0.0.1 → 0.0.3

package/dist/components/core/breadcrumb/breadcrumb-list.svelte

@@ -1,32 +1,32 @@
-<script lang="ts">
-  import * as Breadcrumb from "../../ui/breadcrumb/index.js";
-
-  type Props = {
-    items: {
-      url?: string;
-      label: string;
-    }[];
-  };
-
-  let { items }: Props = $props();
-</script>
-
-<Breadcrumb.Root>
-  <Breadcrumb.List>
-    {#each items as item, i (item.label)}
-      {@const isLast = i === items.length - 1}
-
-      <Breadcrumb.Item class={isLast ? "" : "hidden md:block"}>
-        {#if isLast}
-          <Breadcrumb.Page>{item.label}</Breadcrumb.Page>
-        {:else}
-          <Breadcrumb.Link href={item.url ?? "##"}>{item.label}</Breadcrumb.Link>
-        {/if}
-      </Breadcrumb.Item>
-
-      {#if !isLast}
-        <Breadcrumb.Separator class="hidden md:block" />
-      {/if}
-    {/each}
-  </Breadcrumb.List>
+<script lang="ts">
+  import * as Breadcrumb from "../../ui/breadcrumb/index.js";
+
+  type Props = {
+    items: {
+      url?: string;
+      label: string;
+    }[];
+  };
+
+  let { items }: Props = $props();
+</script>
+
+<Breadcrumb.Root>
+  <Breadcrumb.List>
+    {#each items as item, i (item.label)}
+      {@const isLast = i === items.length - 1}
+
+      <Breadcrumb.Item class={isLast ? "" : "hidden md:block"}>
+        {#if isLast}
+          <Breadcrumb.Page>{item.label}</Breadcrumb.Page>
+        {:else}
+          <Breadcrumb.Link href={item.url ?? "##"}>{item.label}</Breadcrumb.Link>
+        {/if}
+      </Breadcrumb.Item>
+
+      {#if !isLast}
+        <Breadcrumb.Separator class="hidden md:block" />
+      {/if}
+    {/each}
+  </Breadcrumb.List>
 </Breadcrumb.Root>

package/dist/components/core/button/ButtonBack.svelte

@@ -1,18 +1,18 @@
-<script lang="ts">
-  import Button from "../../ui/button/button.svelte";
-  import { ArrowLeft01Icon } from "@hugeicons/core-free-icons";
-  import { HugeiconsIcon } from "@hugeicons/svelte";
-  import { t } from "../../../i18n";
-  import type { ButtonProps } from "../../ui/button";
-
-  let { ...restProps }: ButtonProps = $props();
-</script>
-
-<Button
-  variant="outline"
-  class="inline-flex items-center gap-1 text-sm text-slate-600 hover:text-slate-900 transition-colors rounded-full bg-input"
-  {...restProps}
->
-  <HugeiconsIcon icon={ArrowLeft01Icon} size={16} />
-  <span class="sr-only">{$t("button.back")}</span>
-</Button>
+<script lang="ts">
+  import Button from "../../ui/button/button.svelte";
+  import { ArrowLeft01Icon } from "@hugeicons/core-free-icons";
+  import { HugeiconsIcon } from "@hugeicons/svelte";
+  import { t } from "../../../i18n";
+  import type { ButtonProps } from "../../ui/button";
+
+  let { ...restProps }: ButtonProps = $props();
+</script>
+
+<Button
+  variant="outline"
+  class="inline-flex items-center gap-1 text-sm text-slate-600 hover:text-slate-900 transition-colors rounded-full bg-input"
+  {...restProps}
+>
+  <HugeiconsIcon icon={ArrowLeft01Icon} size={16} />
+  <span class="sr-only">{$t("button.back")}</span>
+</Button>

package/dist/components/core/button/ButtonLogin.svelte

@@ -1,15 +1,15 @@
-<script lang="ts">
-  import Button, {
-    type ButtonProps,
-  } from "../../ui/button/button.svelte";
-  import { t } from "../../../i18n";
-  import { Login02Icon } from "@hugeicons/core-free-icons";
-  import { HugeiconsIcon } from "@hugeicons/svelte";
-
-  let { ...restProps }: ButtonProps = $props();
-</script>
-
-<Button class="w-full flex items-center gap-2" {...restProps}>
-  <HugeiconsIcon icon={Login02Icon} size={16} />
-  {$t("button.login")}
-</Button>
+<script lang="ts">
+  import Button, {
+    type ButtonProps,
+  } from "../../ui/button/button.svelte";
+  import { t } from "../../../i18n";
+  import { Login02Icon } from "@hugeicons/core-free-icons";
+  import { HugeiconsIcon } from "@hugeicons/svelte";
+
+  let { ...restProps }: ButtonProps = $props();
+</script>
+
+<Button class="w-full flex items-center gap-2" {...restProps}>
+  <HugeiconsIcon icon={Login02Icon} size={16} />
+  {$t("button.login")}
+</Button>

package/dist/components/core/button/ButtonLoginWith.svelte

@@ -1,57 +1,57 @@
-<script lang="ts">
-  import Button, {
-    type ButtonProps,
-  } from "../../ui/button/button.svelte";
-  import { HugeiconsIcon, type IconSvgElement } from "@hugeicons/svelte";
-  import { t } from "../../../i18n";
-  import {
-    GoogleIcon,
-    Facebook01Icon as Facebook,
-    Linkedin01Icon as Linkedin,
-  } from "@hugeicons/core-free-icons";
-  import type { Snippet } from "svelte";
-
-  type IconDefault = "GOOGLE" | "FACEBOOK" | "LINKEDLN";
-
-  type Props = {
-    icon?: IconSvgElement | IconDefault | Snippet;
-    label?: string;
-  };
-
-  let { icon, label, ...restProps }: Props & ButtonProps = $props();
-
-  const defaultIconMap: Record<IconDefault, IconSvgElement> = {
-    GOOGLE: GoogleIcon,
-    FACEBOOK: Facebook,
-    LINKEDLN: Linkedin,
-  };
-
-  const defaultLabelMap: Record<IconDefault, string> = {
-    GOOGLE: "Google",
-    FACEBOOK: "Facebook",
-    LINKEDLN: "Linkedin",
-  };
-
-  function isIconDefault(value: unknown): value is IconDefault {
-    return typeof value === "string" && value in defaultLabelMap;
-  }
-
-  let resolvedIcon = $derived(
-    isIconDefault(icon) ? defaultIconMap[icon] : icon,
-  );
-
-  let resolvedLabel = $derived(
-    label ?? (isIconDefault(icon) ? defaultLabelMap[icon] : ""),
-  );
-</script>
-
-<Button variant="outline" class="w-full flex items-center gap-2" {...restProps}>
-  {#if resolvedIcon}
-    {#if typeof resolvedIcon === "function"}
-      {@render resolvedIcon()}
-    {:else}
-      <HugeiconsIcon icon={resolvedIcon} size={16} />
-    {/if}
-  {/if}
-  {$t("button.login.with", { name: resolvedLabel })}
-</Button>
+<script lang="ts">
+  import Button, {
+    type ButtonProps,
+  } from "../../ui/button/button.svelte";
+  import { HugeiconsIcon, type IconSvgElement } from "@hugeicons/svelte";
+  import { t } from "../../../i18n";
+  import {
+    GoogleIcon,
+    Facebook01Icon as Facebook,
+    Linkedin01Icon as Linkedin,
+  } from "@hugeicons/core-free-icons";
+  import type { Snippet } from "svelte";
+
+  type IconDefault = "GOOGLE" | "FACEBOOK" | "LINKEDLN";
+
+  type Props = {
+    icon?: IconSvgElement | IconDefault | Snippet;
+    label?: string;
+  };
+
+  let { icon, label, ...restProps }: Props & ButtonProps = $props();
+
+  const defaultIconMap: Record<IconDefault, IconSvgElement> = {
+    GOOGLE: GoogleIcon,
+    FACEBOOK: Facebook,
+    LINKEDLN: Linkedin,
+  };
+
+  const defaultLabelMap: Record<IconDefault, string> = {
+    GOOGLE: "Google",
+    FACEBOOK: "Facebook",
+    LINKEDLN: "Linkedin",
+  };
+
+  function isIconDefault(value: unknown): value is IconDefault {
+    return typeof value === "string" && value in defaultLabelMap;
+  }
+
+  let resolvedIcon = $derived(
+    isIconDefault(icon) ? defaultIconMap[icon] : icon,
+  );
+
+  let resolvedLabel = $derived(
+    label ?? (isIconDefault(icon) ? defaultLabelMap[icon] : ""),
+  );
+</script>
+
+<Button variant="outline" class="w-full flex items-center gap-2" {...restProps}>
+  {#if resolvedIcon}
+    {#if typeof resolvedIcon === "function"}
+      {@render resolvedIcon()}
+    {:else}
+      <HugeiconsIcon icon={resolvedIcon} size={16} />
+    {/if}
+  {/if}
+  {$t("button.login.with", { name: resolvedLabel })}
+</Button>

package/dist/components/core/carousel/data/CarouselModel.d.ts

@@ -1,3 +1,4 @@
+export type CarouselItemType = "NUMBER" | "DOT" | "POINTER";
 export interface CarouselItem {
     title: string;
     description: string;
@@ -6,5 +7,5 @@ export interface CarouselItem {
 }
 export interface CarouselProps {
     items: CarouselItem[];
-    varient: 'NUMBER' | 'POINTER';
+    varient: CarouselItemType;
 }

package/dist/components/core/datatable/ui/DataTableActions.svelte

@@ -1,28 +1,28 @@
-<script lang="ts" generics="T">
-    import type { CellContext } from "@tanstack/table-core";
-    import * as DropdownMenu from "../../../ui/dropdown-menu/index.js";
-    import Button from "../../../button.svelte";
-    import { MoreHorizontalIcon } from "@hugeicons/core-free-icons";
-    import { HugeiconsIcon } from "@hugeicons/svelte";
-
-    let { row }: CellContext<T, unknown> = $props();
-</script>
-
-<DropdownMenu.Root>
-    <DropdownMenu.Trigger>
-        {#snippet child({ props })}
-            <Button {...props} variant="ghost" class="size-8 p-0">
-                <HugeiconsIcon icon={MoreHorizontalIcon} class="size-4" />
-                <span class="sr-only">Open menu</span>
-            </Button>
-        {/snippet}
-    </DropdownMenu.Trigger>
-    <DropdownMenu.Content align="end">
-        <DropdownMenu.Item onclick={() => console.log(row.original)}
-            >Copy</DropdownMenu.Item
-        >
-        <DropdownMenu.Item onclick={() => console.log(row.original)}
-            >Delete</DropdownMenu.Item
-        >
-    </DropdownMenu.Content>
-</DropdownMenu.Root>
+<script lang="ts" generics="T">
+    import type { CellContext } from "@tanstack/table-core";
+    import * as DropdownMenu from "../../../ui/dropdown-menu/index.js";
+    import Button from "../../../button.svelte";
+    import { MoreHorizontalIcon } from "@hugeicons/core-free-icons";
+    import { HugeiconsIcon } from "@hugeicons/svelte";
+
+    let { row }: CellContext<T, unknown> = $props();
+</script>
+
+<DropdownMenu.Root>
+    <DropdownMenu.Trigger>
+        {#snippet child({ props })}
+            <Button {...props} variant="ghost" class="size-8 p-0">
+                <HugeiconsIcon icon={MoreHorizontalIcon} class="size-4" />
+                <span class="sr-only">Open menu</span>
+            </Button>
+        {/snippet}
+    </DropdownMenu.Trigger>
+    <DropdownMenu.Content align="end">
+        <DropdownMenu.Item onclick={() => console.log(row.original)}
+            >Copy</DropdownMenu.Item
+        >
+        <DropdownMenu.Item onclick={() => console.log(row.original)}
+            >Delete</DropdownMenu.Item
+        >
+    </DropdownMenu.Content>
+</DropdownMenu.Root>

package/dist/components/core/datatable/ui/DataTableCheckbox.svelte

@@ -1,22 +1,22 @@
-<script lang="ts">
-    import { Checkbox } from "../../../ui/checkbox";
-
-    let {
-        checked = $bindable(false),
-        indeterminate = $bindable(false),
-        onCheckedChange,
-        ...restProps
-    }: {
-        checked?: boolean;
-        indeterminate?: boolean;
-        onCheckedChange?: (value: boolean) => void;
-        [key: string]: unknown;
-    } = $props();
-</script>
-
-<Checkbox
-    bind:checked
-    bind:indeterminate
-    onCheckedChange={(v) => onCheckedChange?.(!!v)}
-    {...restProps}
-/>
+<script lang="ts">
+    import { Checkbox } from "../../../ui/checkbox";
+
+    let {
+        checked = $bindable(false),
+        indeterminate = $bindable(false),
+        onCheckedChange,
+        ...restProps
+    }: {
+        checked?: boolean;
+        indeterminate?: boolean;
+        onCheckedChange?: (value: boolean) => void;
+        [key: string]: unknown;
+    } = $props();
+</script>
+
+<Checkbox
+    bind:checked
+    bind:indeterminate
+    onCheckedChange={(v) => onCheckedChange?.(!!v)}
+    {...restProps}
+/>

package/dist/components/core/datatable/ui/DataTableContent.svelte

@@ -1,59 +1,59 @@
-<script lang="ts" generics="T">
-    import type {
-        ColumnDef,
-        Table as TanstackTable,
-    } from "@tanstack/table-core";
-    import * as Table from "../../../ui/table/index.js";
-    import FlexRender from "../../../ui/data-table/flex-render.svelte";
-
-    type Props = {
-        table: TanstackTable<T>;
-        columns: ColumnDef<T>[];
-    };
-
-    let { table, columns }: Props = $props();
-</script>
-
-<div class="rounded-md border">
-    <Table.Root>
-        <Table.Header>
-            {#each table.getHeaderGroups() as headerGroup (headerGroup.id)}
-                <Table.Row>
-                    {#each headerGroup.headers as header (header.id)}
-                        <Table.Head class="[&:has([role=checkbox])]:ps-3">
-                            {#if !header.isPlaceholder}
-                                <FlexRender
-                                    content={header.column.columnDef.header}
-                                    context={header.getContext()}
-                                />
-                            {/if}
-                        </Table.Head>
-                    {/each}
-                </Table.Row>
-            {/each}
-        </Table.Header>
-        <Table.Body>
-            {#each table.getRowModel().rows as row (row.id)}
-                <Table.Row data-state={row.getIsSelected() && "selected"}>
-                    {#each row.getVisibleCells() as cell (cell.id)}
-                        <Table.Cell class="[&:has([role=checkbox])]:ps-3">
-                            <FlexRender
-                                content={cell.column.columnDef.cell}
-                                context={cell.getContext()}
-                            />
-                        </Table.Cell>
-                    {/each}
-                </Table.Row>
-            {:else}
-                <Table.Row>
-                    <Table.Cell
-                        colspan={columns.length}
-                        class="h-24 text-center"
-                    >
-                        No results.
-                    </Table.Cell>
-                </Table.Row>
-            {/each}
-        </Table.Body>
-    </Table.Root>
-</div>
+<script lang="ts" generics="T">
+    import type {
+        ColumnDef,
+        Table as TanstackTable,
+    } from "@tanstack/table-core";
+    import * as Table from "../../../ui/table/index.js";
+    import FlexRender from "../../../ui/data-table/flex-render.svelte";
+
+    type Props = {
+        table: TanstackTable<T>;
+        columns: ColumnDef<T>[];
+    };
+
+    let { table, columns }: Props = $props();
+</script>
+
+<div class="rounded-md border">
+    <Table.Root>
+        <Table.Header>
+            {#each table.getHeaderGroups() as headerGroup (headerGroup.id)}
+                <Table.Row>
+                    {#each headerGroup.headers as header (header.id)}
+                        <Table.Head class="[&:has([role=checkbox])]:ps-3">
+                            {#if !header.isPlaceholder}
+                                <FlexRender
+                                    content={header.column.columnDef.header}
+                                    context={header.getContext()}
+                                />
+                            {/if}
+                        </Table.Head>
+                    {/each}
+                </Table.Row>
+            {/each}
+        </Table.Header>
+        <Table.Body>
+            {#each table.getRowModel().rows as row (row.id)}
+                <Table.Row data-state={row.getIsSelected() && "selected"}>
+                    {#each row.getVisibleCells() as cell (cell.id)}
+                        <Table.Cell class="[&:has([role=checkbox])]:ps-3">
+                            <FlexRender
+                                content={cell.column.columnDef.cell}
+                                context={cell.getContext()}
+                            />
+                        </Table.Cell>
+                    {/each}
+                </Table.Row>
+            {:else}
+                <Table.Row>
+                    <Table.Cell
+                        colspan={columns.length}
+                        class="h-24 text-center"
+                    >
+                        No results.
+                    </Table.Cell>
+                </Table.Row>
+            {/each}
+        </Table.Body>
+    </Table.Root>
+</div>