negodesign 0.0.72 → 0.0.74

package/dist/components/{core → ui}/form/ui/input-email-or-phone.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { InputLabelProps } from "../data/InputLabel.svelte";
+import type { InputLabelProps } from "../data/InputLabel.svelte.ts";
 declare const InputEmailOrPhone: import("svelte").Component<InputLabelProps, {}, "value">;
 type InputEmailOrPhone = ReturnType<typeof InputEmailOrPhone>;
 export default InputEmailOrPhone;

package/dist/components/{core → ui}/form/ui/input-email.svelte

@@ -1,23 +1,23 @@
-<script lang="ts">
-  import type { InputLabelProps } from "../data/InputLabel.svelte";
-  import InputBase from "./input-base.svelte";
-  import { t } from "../../../../i18n";
-
-  /** Email input field with icon and label. */
-  let {
-    label,
-    placeholder,
-    value = $bindable(""),
-    ...restProps
-  }: InputLabelProps = $props();
-</script>
-
-<InputBase
-  type="email"
-  label={label || $t("input.email.label")}
-  placeholder={placeholder || $t("input.email.placeholder")}
-  isLabel
-  isIcon
-  bind:value
-  {...restProps}
-/>
+<script lang="ts">
+  import type { InputLabelProps } from "../data/InputLabel.svelte.js";
+  import InputBase from "./input-base.svelte";
+  import { t } from "../../../../i18n";
+
+  /** Email input field with icon and label. */
+  let {
+    label,
+    placeholder,
+    value = $bindable(""),
+    ...restProps
+  }: InputLabelProps = $props();
+</script>
+
+<InputBase
+  type="email"
+  label={label || $t("input.email.label")}
+  placeholder={placeholder || $t("input.email.placeholder")}
+  isLabel
+  isIcon
+  bind:value
+  {...restProps}
+/>

package/dist/components/{core → ui}/form/ui/input-email.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { InputLabelProps } from "../data/InputLabel.svelte";
+import type { InputLabelProps } from "../data/InputLabel.svelte.ts";
 declare const InputEmail: import("svelte").Component<InputLabelProps, {}, "value">;
 type InputEmail = ReturnType<typeof InputEmail>;
 export default InputEmail;

package/dist/components/{core → ui}/form/ui/input-password-confirm.svelte

@@ -1,23 +1,23 @@
-<script lang="ts">
-  import type { InputLabelProps } from "../data/InputLabel.svelte";
-  import InputBase from "./input-base.svelte";
-  import { t } from "../../../../i18n";
-
-  /** Password confirmation input field with icon and label. */
-  let {
-    label,
-    placeholder,
-    value = $bindable(""),
-    ...restProps
-  }: InputLabelProps = $props();
-</script>
-
-<InputBase
-  type="password"
-  label={label || $t("input.password-confirm.label")}
-  placeholder={placeholder || $t("input.password-confirm.placeholder")}
-  isLabel
-  isIcon
-  bind:value
-  {...restProps}
-/>
+<script lang="ts">
+  import type { InputLabelProps } from "../data/InputLabel.svelte.js";
+  import InputBase from "./input-base.svelte";
+  import { t } from "../../../../i18n";
+
+  /** Password confirmation input field with icon and label. */
+  let {
+    label,
+    placeholder,
+    value = $bindable(""),
+    ...restProps
+  }: InputLabelProps = $props();
+</script>
+
+<InputBase
+  type="password"
+  label={label || $t("input.password-confirm.label")}
+  placeholder={placeholder || $t("input.password-confirm.placeholder")}
+  isLabel
+  isIcon
+  bind:value
+  {...restProps}
+/>

package/dist/components/{core → ui}/form/ui/input-password-confirm.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { InputLabelProps } from "../data/InputLabel.svelte";
+import type { InputLabelProps } from "../data/InputLabel.svelte.ts";
 declare const InputPasswordConfirm: import("svelte").Component<InputLabelProps, {}, "value">;
 type InputPasswordConfirm = ReturnType<typeof InputPasswordConfirm>;
 export default InputPasswordConfirm;

package/dist/components/{core → ui}/form/ui/input-password.svelte

@@ -1,23 +1,23 @@
-<script lang="ts">
-  import type { InputLabelProps } from "../data/InputLabel.svelte";
-  import InputBase from "./input-base.svelte";
-  import { t } from "../../../../i18n";
-
-  /** Password input field with icon and label. */
-  let {
-    label,
-    placeholder,
-    value = $bindable(""),
-    ...restProps
-  }: InputLabelProps = $props();
-</script>
-
-<InputBase
-  type="password"
-  label={label || $t("input.password.label")}
-  placeholder={placeholder || $t("input.password.placeholder")}
-  isLabel
-  isIcon
-  bind:value
-  {...restProps}
-/>
+<script lang="ts">
+  import type { InputLabelProps } from "../data/InputLabel.svelte.js";
+  import InputBase from "./input-base.svelte";
+  import { t } from "../../../../i18n";
+
+  /** Password input field with icon and label. */
+  let {
+    label,
+    placeholder,
+    value = $bindable(""),
+    ...restProps
+  }: InputLabelProps = $props();
+</script>
+
+<InputBase
+  type="password"
+  label={label || $t("input.password.label")}
+  placeholder={placeholder || $t("input.password.placeholder")}
+  isLabel
+  isIcon
+  bind:value
+  {...restProps}
+/>

package/dist/components/{core → ui}/form/ui/input-password.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { InputLabelProps } from "../data/InputLabel.svelte";
+import type { InputLabelProps } from "../data/InputLabel.svelte.ts";
 declare const InputPassword: import("svelte").Component<InputLabelProps, {}, "value">;
 type InputPassword = ReturnType<typeof InputPassword>;
 export default InputPassword;

package/dist/components/{core → ui}/form/ui/input-phone.svelte

@@ -1,33 +1,33 @@
-<script lang="ts">
-  import { PhoneInput } from "../../../ui/phone-input";
-  import type { InputLabelProps } from "../data/InputLabel.svelte";
-  import { Label } from "../../../ui/label";
-  import { t } from "../../../../i18n";
-
-  /** Phone input field with icon and label. */
-  let {
-    label,
-    isLabel,
-    placeholder,
-    value = $bindable(""),
-  }: InputLabelProps = $props();
-</script>
-
-{#if isLabel}
-  <div class="flex flex-col gap-3 w-full">
-    {#if label}
-      <Label>{label}</Label>
-    {:else}
-      <Label>{$t("input.email-or-phone.label")}</Label>
-    {/if}
-    <PhoneInput
-      placeholder={placeholder || $t("input.email-or-phone.placeholder")}
-      bind:value
-    />
-  </div>
-{:else}
-  <PhoneInput
-    placeholder={placeholder || $t("input.email-or-phone.placeholder")}
-    bind:value
-  />
-{/if}
+<script lang="ts">
+  import { PhoneInput } from "../../phone-input";
+  import type { InputLabelProps } from "../data/InputLabel.svelte.js";
+  import { Label } from "../../label";
+  import { t } from "../../../../i18n";
+
+  /** Phone input field with icon and label. */
+  let {
+    label,
+    isLabel,
+    placeholder,
+    value = $bindable(""),
+  }: InputLabelProps = $props();
+</script>
+
+{#if isLabel}
+  <div class="flex flex-col gap-3 w-full">
+    {#if label}
+      <Label>{label}</Label>
+    {:else}
+      <Label>{$t("input.email-or-phone.label")}</Label>
+    {/if}
+    <PhoneInput
+      placeholder={placeholder || $t("input.email-or-phone.placeholder")}
+      bind:value
+    />
+  </div>
+{:else}
+  <PhoneInput
+    placeholder={placeholder || $t("input.email-or-phone.placeholder")}
+    bind:value
+  />
+{/if}

package/dist/components/{core → ui}/form/ui/input-phone.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { InputLabelProps } from "../data/InputLabel.svelte";
+import type { InputLabelProps } from "../data/InputLabel.svelte.ts";
 declare const InputPhone: import("svelte").Component<InputLabelProps, {}, "value">;
 type InputPhone = ReturnType<typeof InputPhone>;
 export default InputPhone;

package/dist/components/{core → ui}/form/ui/input-username.svelte

@@ -1,22 +1,22 @@
-<script lang="ts">
-  import type { InputLabelProps } from "../data/InputLabel.svelte";
-  import InputBase from "./input-base.svelte";
-  import { t } from "../../../../i18n";
-
-  /** Username input field with icon and label. */
-  let {
-    label,
-    placeholder,
-    value = $bindable(""),
-    ...restProps
-  }: InputLabelProps = $props();
-</script>
-
-<InputBase
-  label={label || $t("input.username.label")}
-  placeholder={placeholder || $t("input.username.placeholder")}
-  isLabel
-  isIcon
-  bind:value
-  {...restProps}
-/>
+<script lang="ts">
+  import type { InputLabelProps } from "../data/InputLabel.svelte.js";
+  import InputBase from "./input-base.svelte";
+  import { t } from "../../../../i18n";
+
+  /** Username input field with icon and label. */
+  let {
+    label,
+    placeholder,
+    value = $bindable(""),
+    ...restProps
+  }: InputLabelProps = $props();
+</script>
+
+<InputBase
+  label={label || $t("input.username.label")}
+  placeholder={placeholder || $t("input.username.placeholder")}
+  isLabel
+  isIcon
+  bind:value
+  {...restProps}
+/>

package/dist/components/{core → ui}/form/ui/input-username.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { InputLabelProps } from "../data/InputLabel.svelte";
+import type { InputLabelProps } from "../data/InputLabel.svelte.ts";
 declare const InputUsername: import("svelte").Component<InputLabelProps, {}, "value">;
 type InputUsername = ReturnType<typeof InputUsername>;
 export default InputUsername;

package/dist/components/{core/grid → ui/grid/core}/ui/01/Grid01.svelte

@@ -1,30 +1,30 @@
-<script lang="ts">
-    import type { ItemGridProps } from "../../data/types";
-    import DescriptionGrid from "../shared/DescriptionGrid.svelte";
-    import IconRenderGrid from "../shared/IconRenderGrid.svelte";
-    import TitleGrid from "../shared/TitleGrid.svelte";
-
-    let {
-        id,
-        icon,
-        title,
-        isLoading,
-        iconClass,
-        titleClass,
-        description,
-        itemClassName,
-        descriptionClass,
-        onClick,
-    }: ItemGridProps = $props();
-</script>
-
-<button
-    onclick={() => {
-        if (id && onClick) onClick(id);
-    }}
-    class="flex flex-col justify-center items-center gap-2 rounded-xl {itemClassName}"
->
-    <IconRenderGrid {icon} {iconClass} {isLoading} />
-    <TitleGrid {titleClass} {title} {isLoading} />
-    <DescriptionGrid {descriptionClass} {description} {isLoading} />
-</button>
+<script lang="ts">
+    import type { ItemGridProps } from "../../data/types";
+    import DescriptionGrid from "../shared/DescriptionGrid.svelte";
+    import IconRenderGrid from "../shared/IconRenderGrid.svelte";
+    import TitleGrid from "../shared/TitleGrid.svelte";
+
+    let {
+        id,
+        icon,
+        title,
+        isLoading,
+        iconClass,
+        titleClass,
+        description,
+        itemClassName,
+        descriptionClass,
+        onClick,
+    }: ItemGridProps = $props();
+</script>
+
+<button
+    onclick={() => {
+        if (id && onClick) onClick(id);
+    }}
+    class="flex flex-col justify-center items-center gap-2 rounded-xl {itemClassName}"
+>
+    <IconRenderGrid {icon} {iconClass} {isLoading} />
+    <TitleGrid {titleClass} {title} {isLoading} />
+    <DescriptionGrid {descriptionClass} {description} {isLoading} />
+</button>

package/dist/components/{core/grid → ui/grid/core}/ui/02/Grid02.svelte

@@ -1,30 +1,30 @@
-<script lang="ts">
-    import type { ItemGridProps } from "../../data/types";
-    import DescriptionGrid from "../shared/DescriptionGrid.svelte";
-    import IconRenderGrid from "../shared/IconRenderGrid.svelte";
-    import TitleGrid from "../shared/TitleGrid.svelte";
-
-    let {
-        id,
-        icon,
-        title,
-        isLoading,
-        description,
-        iconClass,
-        titleClass,
-        itemClassName,
-        descriptionClass,
-        onClick,
-    }: ItemGridProps = $props();
-</script>
-
-<button
-    onclick={() => {
-        if (id && onClick) onClick(id);
-    }}
-    class="flex flex-col justify-center items-center gap-2 border rounded-lg p-2 cursor-pointer {itemClassName}"
->
-    <IconRenderGrid {icon} {iconClass} {isLoading} />
-    <TitleGrid {titleClass} {title} {isLoading} />
-    <DescriptionGrid {descriptionClass} {description} {isLoading} />
-</button>
+<script lang="ts">
+    import type { ItemGridProps } from "../../data/types";
+    import DescriptionGrid from "../shared/DescriptionGrid.svelte";
+    import IconRenderGrid from "../shared/IconRenderGrid.svelte";
+    import TitleGrid from "../shared/TitleGrid.svelte";
+
+    let {
+        id,
+        icon,
+        title,
+        isLoading,
+        description,
+        iconClass,
+        titleClass,
+        itemClassName,
+        descriptionClass,
+        onClick,
+    }: ItemGridProps = $props();
+</script>
+
+<button
+    onclick={() => {
+        if (id && onClick) onClick(id);
+    }}
+    class="flex flex-col justify-center items-center gap-2 border rounded-lg p-2 cursor-pointer {itemClassName}"
+>
+    <IconRenderGrid {icon} {iconClass} {isLoading} />
+    <TitleGrid {titleClass} {title} {isLoading} />
+    <DescriptionGrid {descriptionClass} {description} {isLoading} />
+</button>

package/dist/components/{core/grid → ui/grid/core}/ui/ItemsPanel.svelte

@@ -1,26 +1,26 @@
-<script lang="ts">
-  import type { GridProps } from "../data/types";
-  import PanelCarousel from "./ItemsPanelCarousel.svelte";
-  import PanelGrid from "./ItemsPanelGrid.svelte";
-
-  let {
-    style = "grid",
-    onClick,
-    ...restProps
-  }: GridProps & {
-    style?: "inline" | "grid";
-  } = $props();
-
-  let selectedKey = $state<string | number | undefined>("");
-
-  function selectItem(id: string | number) {
-    selectedKey = `${id}`;
-    onClick?.(id);
-  }
-</script>
-
-{#if style == "inline"}
-  <PanelCarousel {...restProps} {selectedKey} onClick={selectItem} />
-{:else}
-  <PanelGrid {...restProps} {selectedKey} onClick={selectItem} />
-{/if}
+<script lang="ts">
+  import type { GridProps } from "../data/types";
+  import PanelCarousel from "./ItemsPanelCarousel.svelte";
+  import PanelGrid from "./ItemsPanelGrid.svelte";
+
+  let {
+    style = "grid",
+    onClick,
+    ...restProps
+  }: GridProps & {
+    style?: "inline" | "grid";
+  } = $props();
+
+  let selectedKey = $state<string | number | undefined>("");
+
+  function selectItem(id: string | number) {
+    selectedKey = `${id}`;
+    onClick?.(id);
+  }
+</script>
+
+{#if style == "inline"}
+  <PanelCarousel {...restProps} {selectedKey} onClick={selectItem} />
+{:else}
+  <PanelGrid {...restProps} {selectedKey} onClick={selectItem} />
+{/if}

package/dist/components/{core/grid → ui/grid/core}/ui/ItemsPanelCarousel.svelte

@@ -1,37 +1,37 @@
-<script lang="ts">
-  import * as Carousel from "../../../ui/carousel/index.js";
-  import type { GridProps } from "../data/types";
-  import Grid02 from "./02/Grid02.svelte";
-  import Grid01 from "./01/Grid01.svelte";
-
-  let { variant, isLoading, items, itemClassName, onClick }: GridProps =
-    $props();
-</script>
-
-<Carousel.Root>
-  <Carousel.Content>
-    {#if isLoading}
-      <div class="flex items-center justify-between w-full gap-1 md:gap-2">
-        {#each Array.from({ length: 10 }) as _, i (`skeleton-${i}`)}
-          <Carousel.Item class="basis-auto relative">
-            {#if variant == 2}
-              <Grid02 title={`${i}`} description="" icon="" {isLoading} />
-            {:else}
-              <Grid01 title={`${i}`} description="" icon="" {isLoading} />
-            {/if}
-          </Carousel.Item>
-        {/each}
-      </div>
-    {:else}
-      {#each items as item, i (`panel-${i}`)}
-        <Carousel.Item class="basis-auto relative">
-          {#if variant == 2}
-            <Grid02 {...item} {onClick} {itemClassName} />
-          {:else}
-            <Grid01 {...item} {onClick} {itemClassName} />
-          {/if}
-        </Carousel.Item>
-      {/each}
-    {/if}
-  </Carousel.Content>
-</Carousel.Root>
+<script lang="ts">
+  import * as Carousel from "../../../carousel/index.js";
+  import type { GridProps } from "../data/types";
+  import Grid02 from "./02/Grid02.svelte";
+  import Grid01 from "./01/Grid01.svelte";
+
+  let { variant, isLoading, items, itemClassName, onClick }: GridProps =
+    $props();
+</script>
+
+<Carousel.Root>
+  <Carousel.Content>
+    {#if isLoading}
+      <div class="flex items-center justify-between w-full gap-1 md:gap-2">
+        {#each Array.from({ length: 10 }) as _, i (`skeleton-${i}`)}
+          <Carousel.Item class="basis-auto relative">
+            {#if variant == 2}
+              <Grid02 title={`${i}`} description="" icon="" {isLoading} />
+            {:else}
+              <Grid01 title={`${i}`} description="" icon="" {isLoading} />
+            {/if}
+          </Carousel.Item>
+        {/each}
+      </div>
+    {:else}
+      {#each items as item, i (`panel-${i}`)}
+        <Carousel.Item class="basis-auto relative">
+          {#if variant == 2}
+            <Grid02 {...item} {onClick} {itemClassName} />
+          {:else}
+            <Grid01 {...item} {onClick} {itemClassName} />
+          {/if}
+        </Carousel.Item>
+      {/each}
+    {/if}
+  </Carousel.Content>
+</Carousel.Root>

package/dist/components/{core/grid → ui/grid/core}/ui/ItemsPanelGrid.svelte

@@ -1,43 +1,43 @@
-<script lang="ts">
-  import { useDevice } from "../../../../hooks/responsive.svelte";
-  import type { GridProps } from "../data/types";
-  import Grid02 from "./02/Grid02.svelte";
-  import Grid01 from "./01/Grid01.svelte";
-
-  let {
-    variant,
-    className,
-    isLoading,
-    items,
-    itemClassName,
-    onClick,
-  }: GridProps = $props();
-
-  const styleMobile = "flex justify-between overflow-x-auto no-scrollbar";
-
-  const responsive = useDevice();
-</script>
-
-<div
-  class="gap-4 my-2 {responsive.isMobile
-    ? styleMobile
-    : 'grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 max-h-237.5 overflow-y-auto'} {className}"
->
-  {#if isLoading}
-    {#each Array.from({ length: responsive.isMobile ? 3 : 10 }) as it, i (i)}
-      {#if variant == 2}
-        <Grid02 title={`${it}`} description="" icon="" {isLoading} />
-      {:else}
-        <Grid01 title={`${it}`} description="" icon="" {isLoading} />
-      {/if}
-    {/each}
-  {:else}
-    {#each items as item, i (i)}
-      {#if variant == 2}
-        <Grid02 {...item} {onClick} {itemClassName} />
-      {:else}
-        <Grid01 {...item} {onClick} {itemClassName} />
-      {/if}
-    {/each}
-  {/if}
-</div>
+<script lang="ts">
+  import { useDevice } from "../../../../../hooks/responsive.svelte";
+  import type { GridProps } from "../data/types";
+  import Grid02 from "./02/Grid02.svelte";
+  import Grid01 from "./01/Grid01.svelte";
+
+  let {
+    variant,
+    className,
+    isLoading,
+    items,
+    itemClassName,
+    onClick,
+  }: GridProps = $props();
+
+  const styleMobile = "flex justify-between overflow-x-auto no-scrollbar";
+
+  const responsive = useDevice();
+</script>
+
+<div
+  class="gap-4 my-2 {responsive.isMobile
+    ? styleMobile
+    : 'grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 max-h-237.5 overflow-y-auto'} {className}"
+>
+  {#if isLoading}
+    {#each Array.from({ length: responsive.isMobile ? 3 : 10 }) as it, i (i)}
+      {#if variant == 2}
+        <Grid02 title={`${it}`} description="" icon="" {isLoading} />
+      {:else}
+        <Grid01 title={`${it}`} description="" icon="" {isLoading} />
+      {/if}
+    {/each}
+  {:else}
+    {#each items as item, i (i)}
+      {#if variant == 2}
+        <Grid02 {...item} {onClick} {itemClassName} />
+      {:else}
+        <Grid01 {...item} {onClick} {itemClassName} />
+      {/if}
+    {/each}
+  {/if}
+</div>