@stubber/ui 1.0.0

package/dist/components/Toast.svelte

@@ -0,0 +1,49 @@
+<script>export let type = "default";
+export let title;
+export let label = "Note label";
+const backgroundColors = {
+  default: "bg-surface-100",
+  primary: "bg-primary-500",
+  success: "bg-success-700",
+  danger: "bg-danger-500",
+  warning: "bg-warning-400"
+};
+</script>
+  
+  <div class={`flex items-start p-4 shadow-6 rounded-md w-60 md:w-96 ${backgroundColors[type]} ${type === 'default' ? 'text-[#333333]' : 'text-white'}`}>
+    <div class="flex-shrink-0 mt-[0.2rem] flex items-center">
+      {#if type === 'default' || type === 'success'}
+        <i class="fa-sharp fa-regular fa-check w-5 h-5"></i>
+      {:else if type === 'primary'}
+        <svg class="w-5 h-5" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <path opacity="0.4" fill-rule="evenodd" clip-rule="evenodd" d="M8.5 2C5.46243 2 3 4.46243 3 7.5C3 10.5376 5.46243 13 8.5 13C11.5376 13 14 10.5376 14 7.5C14 4.46243 11.5376 2 8.5 2ZM2 7.5C2 3.91015 4.91015 1 8.5 1C12.0899 1 15 3.91015 15 7.5C15 11.0899 12.0899 14 8.5 14C4.91015 14 2 11.0899 2 7.5Z" fill="#F5F5F5"/>
+          <path d="M8.5 6C9.05228 6 9.5 5.55228 9.5 5C9.5 4.44772 9.05228 4 8.5 4C7.94772 4 7.5 4.44772 7.5 5C7.5 5.55228 7.94772 6 8.5 6Z" fill="#F5F5F5"/>
+          <path d="M8.5 7H7V8H8V11H9V7.5C9 7.22386 8.77614 7 8.5 7Z" fill="#F5F5F5"/>
+        </svg>
+      {:else if type === 'danger'}
+        <svg class="w-5 h-5" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <path opacity="0.4" fill-rule="evenodd" clip-rule="evenodd" d="M8.5 2C5.46243 2 3 4.46243 3 7.5C3 10.5376 5.46243 13 8.5 13C11.5376 13 14 10.5376 14 7.5C14 4.46243 11.5376 2 8.5 2ZM2 7.5C2 3.91015 4.91015 1 8.5 1C12.0899 1 15 3.91015 15 7.5C15 11.0899 12.0899 14 8.5 14C4.91015 14 2 11.0899 2 7.5Z" fill="#F5F5F5"/>
+          <path d="M8 4V8H9V4H8Z" fill="#D9D9D9"/>
+          <path d="M8.5 11C9.05228 11 9.5 10.5523 9.5 10C9.5 9.44772 9.05228 9 8.5 9C7.94772 9 7.5 9.44772 7.5 10C7.5 10.5523 7.94772 11 8.5 11Z" fill="#D9D9D9"/>
+        </svg>
+      {:else if type === 'warning'}
+        <svg class="w-5 h-5" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <path d="M8 5V9H9V5H8Z" fill="white"/>
+          <path d="M8.5 12C9.05228 12 9.5 11.5523 9.5 11C9.5 10.4477 9.05228 10 8.5 10C7.94772 10 7.5 10.44772 7.5 11C7.5 11.5523 7.94772 12 8.5 12Z" fill="white"/>
+          <path opacity="0.4" fill-rule="evenodd" clip-rule="evenodd" d="M7.63514 2C8.02005 1.33333 8.9823 1.33333 9.36719 2L15.4294 12.5C15.8143 13.1667 15.3331 14 14.5633 14H2.43899C1.66919 14 1.18807 13.1667 1.57297 12.5L7.63514 2ZM8.50117 2.5L2.43899 13L14.5633 13L8.50117 2.5Z" fill="white"/>
+        </svg>
+      {/if}
+    </div>
+    <div class="ml-4 flex-grow">
+      {#if title}
+        <h3 class="font-bold text-lg">{title}</h3>
+      {/if}
+      <p class={`text-sm ${type === 'default' ? 'text-gray-600' : ''}`}>{label}</p>
+    </div>
+    <button aria-label="Close" class="flex-shrink-0">
+      <svg class="w-4 h-4" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <path fill-rule="evenodd" clip-rule="evenodd" d="M5.7091 4.99809L9.35555 1.35164L8.64844 0.644531L5.00199 4.29098L1.35554 0.644531L0.648438 1.35164L4.29488 4.99809L0.648438 8.64453L1.35554 9.35164L5.00199 5.70519L8.64844 9.35164L9.35555 8.64453L5.7091 4.99809Z" fill="{type === 'default' ? '#333333' : 'white'}"/>
+      </svg>
+    </button>
+  </div>
+  

package/dist/components/Toast.svelte.d.ts

@@ -0,0 +1,18 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        type?: ("primary" | "success" | "warning" | "danger" | "default") | undefined;
+        title: string | undefined;
+        label?: string | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type ToastProps = typeof __propDef.props;
+export type ToastEvents = typeof __propDef.events;
+export type ToastSlots = typeof __propDef.slots;
+export default class Toast extends SvelteComponent<ToastProps, ToastEvents, ToastSlots> {
+}
+export {};

package/dist/components/Tooltip.svelte

@@ -0,0 +1,80 @@
+<script>
+  import { createPopperActions } from "svelte-popperjs";
+  export let placement = "top";
+
+  let popperRef, popperContent;
+
+  $: {
+    [popperRef, popperContent] = createPopperActions({
+      placement: placement,
+    });
+  }
+
+  const extraOpts = {
+    modifiers: [{ name: "offset", options: { offset: [0, 8] } }],
+  };
+
+  let showTooltip = false;
+</script>
+
+<!-- svelte-ignore a11y-click-events-have-key-events -->
+<div
+  use:popperRef
+  on:mouseenter={() => (showTooltip = true)}
+  on:mouseleave={() => (showTooltip = false)}
+  on:click={() => {
+    showTooltip = false;
+    setTimeout(() => {
+      showTooltip = true;
+    }, 0);
+  }}
+>
+  <slot name="subject" />
+</div>
+{#if showTooltip}
+  <div
+    id="tooltip"
+    class="z-10 bg-surface-900 rounded text-white p-1 px-3 drop-shadow-[0_3px_3px_rgba(0,0,0,0.4)]"
+    data-popper-placement={placement}
+    use:popperContent={extraOpts}
+  >
+    <span class="text-label">
+      <slot name="tooltip" />
+    </span>
+    <div id="arrow" class="arrow absolute w-0 h-0" />
+  </div>
+{/if}
+
+<style>
+  #tooltip[data-popper-placement^="top"] > .arrow {
+    border-left: 5px solid transparent;
+    border-right: 5px solid transparent;
+    border-top: 5px solid var(--surface-900);
+    bottom: -5px;
+    left: calc(50% - 5px);
+  }
+
+  #tooltip[data-popper-placement^="bottom"] > .arrow {
+    border-left: 5px solid transparent;
+    border-right: 5px solid transparent;
+    border-bottom: 5px solid var(--surface-900);
+    top: -5px;
+    left: calc(50% - 5px);
+  }
+
+  #tooltip[data-popper-placement^="left"] > .arrow {
+    border-top: 5px solid transparent;
+    border-bottom: 5px solid transparent;
+    border-left: 5px solid var(--surface-900);
+    right: -5px;
+    top: calc(50% - 5px);
+  }
+
+  #tooltip[data-popper-placement^="right"] > .arrow {
+    border-top: 5px solid transparent;
+    border-bottom: 5px solid transparent;
+    border-right: 5px solid var(--surface-900);
+    left: -5px;
+    top: calc(50% - 5px);
+  }
+</style>

package/dist/components/Tooltip.svelte.d.ts

@@ -0,0 +1,29 @@
+/** @typedef {typeof __propDef.props}  TooltipProps */
+/** @typedef {typeof __propDef.events}  TooltipEvents */
+/** @typedef {typeof __propDef.slots}  TooltipSlots */
+export default class Tooltip extends SvelteComponent<{
+    placement?: string | undefined;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    subject: {};
+    tooltip: {};
+}> {
+}
+export type TooltipProps = typeof __propDef.props;
+export type TooltipEvents = typeof __propDef.events;
+export type TooltipSlots = typeof __propDef.slots;
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        placement?: string | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        subject: {};
+        tooltip: {};
+    };
+};
+export {};

package/dist/components/alert-dialog/alert-dialog-action.svelte

@@ -0,0 +1,16 @@
+<script>import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+import { buttonVariants } from "../button/index.js";
+import { cn } from "../../utils/shadcn-utils.js";
+let className = void 0;
+export { className as class };
+</script>
+
+<AlertDialogPrimitive.Action
+  class={cn(buttonVariants(), className)}
+  {...$$restProps}
+  on:click
+  on:keydown
+  let:builder
+>
+  <slot {builder} />
+</AlertDialogPrimitive.Action>

package/dist/components/alert-dialog/alert-dialog-action.svelte.d.ts

@@ -0,0 +1,23 @@
+import { SvelteComponent } from "svelte";
+import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+declare const __propDef: {
+    props: AlertDialogPrimitive.ActionProps;
+    slots: {
+        default: {
+            builder: {
+                readonly type: "button";
+            } & {
+                [x: `data-melt-${string}`]: "";
+            } & {
+                action: (node: HTMLElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"click" | "keydown">;
+            };
+        };
+    };
+    events: AlertDialogPrimitive.ActionEvents;
+};
+export type AlertDialogActionProps = typeof __propDef.props;
+export type AlertDialogActionEvents = typeof __propDef.events;
+export type AlertDialogActionSlots = typeof __propDef.slots;
+export default class AlertDialogAction extends SvelteComponent<AlertDialogActionProps, AlertDialogActionEvents, AlertDialogActionSlots> {
+}
+export {};

package/dist/components/alert-dialog/alert-dialog-cancel.svelte

@@ -0,0 +1,16 @@
+<script>import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+import { buttonVariants } from "../button/index.js";
+import { cn } from "../../utils/shadcn-utils.js";
+let className = void 0;
+export { className as class };
+</script>
+
+<AlertDialogPrimitive.Cancel
+  class={cn(buttonVariants({ variant: "outline" }), "mt-2 sm:mt-0", className)}
+  {...$$restProps}
+  on:click
+  on:keydown
+  let:builder
+>
+  <slot {builder} />
+</AlertDialogPrimitive.Cancel>

package/dist/components/alert-dialog/alert-dialog-cancel.svelte.d.ts

@@ -0,0 +1,23 @@
+import { SvelteComponent } from "svelte";
+import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+declare const __propDef: {
+    props: AlertDialogPrimitive.CancelProps;
+    slots: {
+        default: {
+            builder: {
+                readonly type: "button";
+            } & {
+                [x: `data-melt-${string}`]: "";
+            } & {
+                action: (node: HTMLElement) => import("@melt-ui/svelte/internal/types").MeltActionReturn<"click" | "keydown">;
+            };
+        };
+    };
+    events: AlertDialogPrimitive.CancelEvents;
+};
+export type AlertDialogCancelProps = typeof __propDef.props;
+export type AlertDialogCancelEvents = typeof __propDef.events;
+export type AlertDialogCancelSlots = typeof __propDef.slots;
+export default class AlertDialogCancel extends SvelteComponent<AlertDialogCancelProps, AlertDialogCancelEvents, AlertDialogCancelSlots> {
+}
+export {};

package/dist/components/alert-dialog/alert-dialog-content.svelte

@@ -0,0 +1,23 @@
+<script>import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+import * as AlertDialog from "./index.js";
+import { cn, flyAndScale } from "../../utils/shadcn-utils.js";
+export let transition = flyAndScale;
+export let transitionConfig = void 0;
+let className = void 0;
+export { className as class };
+</script>
+
+<AlertDialog.Portal>
+  <AlertDialog.Overlay />
+  <AlertDialogPrimitive.Content
+    {transition}
+    {transitionConfig}
+    class={cn(
+      "bg-background fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border p-6 shadow-lg sm:rounded-lg md:w-full",
+      className
+    )}
+    {...$$restProps}
+  >
+    <slot />
+  </AlertDialogPrimitive.Content>
+</AlertDialog.Portal>

package/dist/components/alert-dialog/alert-dialog-content.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponent } from "svelte";
+import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+declare const __propDef: {
+    props: AlertDialogPrimitive.ContentProps;
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type AlertDialogContentProps = typeof __propDef.props;
+export type AlertDialogContentEvents = typeof __propDef.events;
+export type AlertDialogContentSlots = typeof __propDef.slots;
+export default class AlertDialogContent extends SvelteComponent<AlertDialogContentProps, AlertDialogContentEvents, AlertDialogContentSlots> {
+}
+export {};

package/dist/components/alert-dialog/alert-dialog-description.svelte

@@ -0,0 +1,12 @@
+<script>import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+import { cn } from "../../utils/shadcn-utils.js";
+let className = void 0;
+export { className as class };
+</script>
+
+<AlertDialogPrimitive.Description
+  class={cn("text-muted-foreground text-sm", className)}
+  {...$$restProps}
+>
+  <slot />
+</AlertDialogPrimitive.Description>

package/dist/components/alert-dialog/alert-dialog-description.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponent } from "svelte";
+import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+declare const __propDef: {
+    props: AlertDialogPrimitive.DescriptionProps;
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type AlertDialogDescriptionProps = typeof __propDef.props;
+export type AlertDialogDescriptionEvents = typeof __propDef.events;
+export type AlertDialogDescriptionSlots = typeof __propDef.slots;
+export default class AlertDialogDescription extends SvelteComponent<AlertDialogDescriptionProps, AlertDialogDescriptionEvents, AlertDialogDescriptionSlots> {
+}
+export {};

package/dist/components/alert-dialog/alert-dialog-footer.svelte

@@ -0,0 +1,11 @@
+<script>import { cn } from "../../utils/shadcn-utils.js";
+let className = void 0;
+export { className as class };
+</script>
+
+<div
+  class={cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className)}
+  {...$$restProps}
+>
+  <slot />
+</div>

package/dist/components/alert-dialog/alert-dialog-footer.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponent } from "svelte";
+import type { HTMLAttributes } from "svelte/elements";
+declare const __propDef: {
+    props: HTMLAttributes<HTMLDivElement>;
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type AlertDialogFooterProps = typeof __propDef.props;
+export type AlertDialogFooterEvents = typeof __propDef.events;
+export type AlertDialogFooterSlots = typeof __propDef.slots;
+export default class AlertDialogFooter extends SvelteComponent<AlertDialogFooterProps, AlertDialogFooterEvents, AlertDialogFooterSlots> {
+}
+export {};

package/dist/components/alert-dialog/alert-dialog-header.svelte

@@ -0,0 +1,8 @@
+<script>import { cn } from "../../utils/shadcn-utils.js";
+let className = void 0;
+export { className as class };
+</script>
+
+<div class={cn("flex flex-col space-y-2 text-center sm:text-left", className)} {...$$restProps}>
+  <slot />
+</div>

package/dist/components/alert-dialog/alert-dialog-header.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponent } from "svelte";
+import type { HTMLAttributes } from "svelte/elements";
+declare const __propDef: {
+    props: HTMLAttributes<HTMLDivElement>;
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type AlertDialogHeaderProps = typeof __propDef.props;
+export type AlertDialogHeaderEvents = typeof __propDef.events;
+export type AlertDialogHeaderSlots = typeof __propDef.slots;
+export default class AlertDialogHeader extends SvelteComponent<AlertDialogHeaderProps, AlertDialogHeaderEvents, AlertDialogHeaderSlots> {
+}
+export {};

package/dist/components/alert-dialog/alert-dialog-overlay.svelte

@@ -0,0 +1,17 @@
+<script>import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+import { fade } from "svelte/transition";
+import { cn } from "../../utils/shadcn-utils.js";
+let className = void 0;
+export let transition = fade;
+export let transitionConfig = {
+  duration: 150
+};
+export { className as class };
+</script>
+
+<AlertDialogPrimitive.Overlay
+  {transition}
+  {transitionConfig}
+  class={cn("bg-background/80 fixed inset-0 z-50 backdrop-blur-sm ", className)}
+  {...$$restProps}
+/>

package/dist/components/alert-dialog/alert-dialog-overlay.svelte.d.ts

@@ -0,0 +1,15 @@
+import { SvelteComponent } from "svelte";
+import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+declare const __propDef: {
+    props: AlertDialogPrimitive.OverlayProps;
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type AlertDialogOverlayProps = typeof __propDef.props;
+export type AlertDialogOverlayEvents = typeof __propDef.events;
+export type AlertDialogOverlaySlots = typeof __propDef.slots;
+export default class AlertDialogOverlay extends SvelteComponent<AlertDialogOverlayProps, AlertDialogOverlayEvents, AlertDialogOverlaySlots> {
+}
+export {};

package/dist/components/alert-dialog/alert-dialog-portal.svelte

@@ -0,0 +1,6 @@
+<script>import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+</script>
+
+<AlertDialogPrimitive.Portal {...$$restProps}>
+  <slot />
+</AlertDialogPrimitive.Portal>

package/dist/components/alert-dialog/alert-dialog-portal.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponent } from "svelte";
+import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+declare const __propDef: {
+    props: AlertDialogPrimitive.PortalProps;
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type AlertDialogPortalProps = typeof __propDef.props;
+export type AlertDialogPortalEvents = typeof __propDef.events;
+export type AlertDialogPortalSlots = typeof __propDef.slots;
+export default class AlertDialogPortal extends SvelteComponent<AlertDialogPortalProps, AlertDialogPortalEvents, AlertDialogPortalSlots> {
+}
+export {};

package/dist/components/alert-dialog/alert-dialog-title.svelte

@@ -0,0 +1,10 @@
+<script>import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+import { cn } from "../../utils/shadcn-utils.js";
+let className = void 0;
+export let level = "h3";
+export { className as class };
+</script>
+
+<AlertDialogPrimitive.Title class={cn("text-lg font-semibold", className)} {level} {...$$restProps}>
+  <slot />
+</AlertDialogPrimitive.Title>

package/dist/components/alert-dialog/alert-dialog-title.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponent } from "svelte";
+import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+declare const __propDef: {
+    props: AlertDialogPrimitive.TitleProps;
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type AlertDialogTitleProps = typeof __propDef.props;
+export type AlertDialogTitleEvents = typeof __propDef.events;
+export type AlertDialogTitleSlots = typeof __propDef.slots;
+export default class AlertDialogTitle extends SvelteComponent<AlertDialogTitleProps, AlertDialogTitleEvents, AlertDialogTitleSlots> {
+}
+export {};

package/dist/components/alert-dialog/index.d.ts

@@ -0,0 +1,13 @@
+import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+import Title from "./alert-dialog-title.svelte";
+import Action from "./alert-dialog-action.svelte";
+import Cancel from "./alert-dialog-cancel.svelte";
+import Portal from "./alert-dialog-portal.svelte";
+import Footer from "./alert-dialog-footer.svelte";
+import Header from "./alert-dialog-header.svelte";
+import Overlay from "./alert-dialog-overlay.svelte";
+import Content from "./alert-dialog-content.svelte";
+import Description from "./alert-dialog-description.svelte";
+declare const Root: typeof AlertDialogPrimitive.Root;
+declare const Trigger: typeof AlertDialogPrimitive.Trigger;
+export { Root, Title, Action, Cancel, Portal, Footer, Header, Trigger, Overlay, Content, Description, Root as AlertDialog, Title as AlertDialogTitle, Action as AlertDialogAction, Cancel as AlertDialogCancel, Portal as AlertDialogPortal, Footer as AlertDialogFooter, Header as AlertDialogHeader, Trigger as AlertDialogTrigger, Overlay as AlertDialogOverlay, Content as AlertDialogContent, Description as AlertDialogDescription, };

package/dist/components/alert-dialog/index.js

@@ -0,0 +1,15 @@
+import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+import Title from "./alert-dialog-title.svelte";
+import Action from "./alert-dialog-action.svelte";
+import Cancel from "./alert-dialog-cancel.svelte";
+import Portal from "./alert-dialog-portal.svelte";
+import Footer from "./alert-dialog-footer.svelte";
+import Header from "./alert-dialog-header.svelte";
+import Overlay from "./alert-dialog-overlay.svelte";
+import Content from "./alert-dialog-content.svelte";
+import Description from "./alert-dialog-description.svelte";
+const Root = AlertDialogPrimitive.Root;
+const Trigger = AlertDialogPrimitive.Trigger;
+export { Root, Title, Action, Cancel, Portal, Footer, Header, Trigger, Overlay, Content, Description, 
+//
+Root as AlertDialog, Title as AlertDialogTitle, Action as AlertDialogAction, Cancel as AlertDialogCancel, Portal as AlertDialogPortal, Footer as AlertDialogFooter, Header as AlertDialogHeader, Trigger as AlertDialogTrigger, Overlay as AlertDialogOverlay, Content as AlertDialogContent, Description as AlertDialogDescription, };

package/dist/components/badge/badge.svelte

@@ -0,0 +1,16 @@
+<script>import { badgeVariants } from "./index.js";
+import { cn } from "../../utils/shadcn-utils.js";
+let className = void 0;
+export let href = void 0;
+export let variant = "default";
+export { className as class };
+</script>
+
+<svelte:element
+  this={href ? "a" : "span"}
+  {href}
+  class={cn(badgeVariants({ variant, className }))}
+  {...$$restProps}
+>
+  <slot />
+</svelte:element>

package/dist/components/badge/badge.svelte.d.ts

@@ -0,0 +1,22 @@
+import { SvelteComponent } from "svelte";
+import { type Variant } from "./index.js";
+declare const __propDef: {
+    props: {
+        [x: string]: any;
+        href?: string | undefined;
+        variant?: Variant;
+        class?: string | undefined | null;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type BadgeProps = typeof __propDef.props;
+export type BadgeEvents = typeof __propDef.events;
+export type BadgeSlots = typeof __propDef.slots;
+export default class Badge extends SvelteComponent<BadgeProps, BadgeEvents, BadgeSlots> {
+}
+export {};

package/dist/components/badge/index.d.ts

@@ -0,0 +1,60 @@
+import { type VariantProps } from "tailwind-variants";
+export { default as Badge } from "./badge.svelte";
+export declare const badgeVariants: import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: string;
+        secondary: string;
+        destructive: string;
+        outline: string;
+        stubref: string;
+    };
+}, undefined, "focus:ring-ring inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-offset-2", import("tailwind-variants/dist/config").TVConfig<{
+    variant: {
+        default: string;
+        secondary: string;
+        destructive: string;
+        outline: string;
+        stubref: string;
+    };
+}, {
+    variant: {
+        default: string;
+        secondary: string;
+        destructive: string;
+        outline: string;
+        stubref: string;
+    };
+}>, {
+    variant: {
+        default: string;
+        secondary: string;
+        destructive: string;
+        outline: string;
+        stubref: string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: string;
+        secondary: string;
+        destructive: string;
+        outline: string;
+        stubref: string;
+    };
+}, undefined, "focus:ring-ring inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-offset-2", import("tailwind-variants/dist/config").TVConfig<{
+    variant: {
+        default: string;
+        secondary: string;
+        destructive: string;
+        outline: string;
+        stubref: string;
+    };
+}, {
+    variant: {
+        default: string;
+        secondary: string;
+        destructive: string;
+        outline: string;
+        stubref: string;
+    };
+}>, unknown, unknown, undefined>>;
+export type Variant = VariantProps<typeof badgeVariants>["variant"];

package/dist/components/badge/index.js

@@ -0,0 +1,17 @@
+import { tv } from "tailwind-variants";
+export { default as Badge } from "./badge.svelte";
+export const badgeVariants = tv({
+    base: "focus:ring-ring inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-offset-2",
+    variants: {
+        variant: {
+            default: "bg-primary text-primary-foreground hover:bg-primary/80 border-transparent",
+            secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 border-transparent",
+            destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/80 border-transparent",
+            outline: "text-foreground",
+            stubref: "border-primary text-primary",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+    },
+});

package/dist/components/breadcrumb/breadcrumb-ellipsis.svelte

@@ -0,0 +1,16 @@
+<script>import { cn } from "../../utils/shadcn-utils.js";
+export let el = void 0;
+let className = void 0;
+export { className as class };
+</script>
+
+<span
+  bind:this={el}
+  role="presentation"
+  aria-hidden="true"
+  class={cn("flex h-9 w-9 items-center justify-center", className)}
+  {...$$restProps}
+>
+  <i class="fa-regular fa-ellipsis" />
+  <span class="sr-only">More</span>
+</span>