@getmicdrop/svelte-components 3.0.0 → 3.1.0

package/dist/components/Avatar/Avatar.svelte

@@ -0,0 +1,56 @@
+<script>
+  /**
+   * Avatar Component - Flowbite-style native implementation
+   *
+   * Displays a user avatar image with optional fallback initials
+   */
+
+  /** @type {string} Image source URL */
+  export let src = "";
+  /** @type {string} Alt text for the image */
+  export let alt = "";
+  /** @type {boolean} Whether to use rounded (circle) shape */
+  export let rounded = false;
+  /** @type {'xs' | 'sm' | 'md' | 'lg' | 'xl'} Size variant */
+  export let size = "md";
+  /** @type {string} Fallback initials when no image */
+  export let initials = "";
+  /** @type {string} Additional CSS classes */
+  let className = "";
+  export { className as class };
+
+  // Size classes
+  const sizeClasses = {
+    xs: "w-6 h-6 text-xs",
+    sm: "w-8 h-8 text-xs",
+    md: "w-10 h-10 text-sm",
+    lg: "w-14 h-14 text-base",
+    xl: "w-20 h-20 text-lg"
+  };
+
+  $: sizeClass = sizeClasses[size] || sizeClasses.md;
+  $: roundedClass = rounded ? "rounded-full" : "rounded";
+</script>
+
+{#if src}
+  <img
+    {src}
+    {alt}
+    class="object-cover {sizeClass} {roundedClass} {className}"
+  />
+{:else if initials}
+  <div
+    class="flex items-center justify-center font-medium text-gray-600 bg-gray-200 dark:bg-gray-700 dark:text-gray-300 {sizeClass} {roundedClass} {className}"
+  >
+    {initials}
+  </div>
+{:else}
+  <!-- Default placeholder -->
+  <div
+    class="flex items-center justify-center bg-gray-200 dark:bg-gray-700 {sizeClass} {roundedClass} {className}"
+  >
+    <svg class="w-1/2 h-1/2 text-gray-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+      <path fill-rule="evenodd" d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z" clip-rule="evenodd"></path>
+    </svg>
+  </div>
+{/if}

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

@@ -0,0 +1,37 @@
+export default Avatar;
+type Avatar = SvelteComponent<{
+    class?: string | undefined;
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+    rounded?: boolean | undefined;
+    src?: string | undefined;
+    alt?: string | undefined;
+    initials?: string | undefined;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}> & {
+    $$bindings?: string | undefined;
+};
+declare const Avatar: $$__sveltets_2_IsomorphicComponent<{
+    class?: string | undefined;
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+    rounded?: boolean | undefined;
+    src?: string | undefined;
+    alt?: string | undefined;
+    initials?: string | undefined;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+//# sourceMappingURL=Avatar.svelte.d.ts.map

package/dist/components/Avatar/Avatar.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Avatar.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Avatar/Avatar.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;AAqEA;;;;;;;;;mBAAqK;6CATxH,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}

package/dist/components/Badges/Badge.stories.svelte

@@ -1,9 +1,10 @@
-<script context="module">
-  import { Story, Template } from "@storybook/addon-svelte-csf";
+<script module>
+  import { defineMeta } from "@storybook/addon-svelte-csf";
 
+  
   import Badge from "./Badge.svelte";
 
-  export const meta = {
+  const { Story } = defineMeta({
     title: "Components/Badge",
     component: Badge,
     argTypes: {
@@ -28,12 +29,10 @@
       },
       className: { control: "text" },
     },
-  };
+  });
+
 </script>
 
-<Template let:args>
-  <Badge {...args}>Badge Text</Badge>
-</Template>
 
 <!-- Size Variants -->
 <Story name="Small Badge">

package/dist/components/Badges/Badge.stories.svelte.d.ts

@@ -1,23 +1,3 @@
-export namespace meta {
-    export let title: string;
-    export { Badge as component };
-    export namespace argTypes {
-        namespace size {
-            let control: string;
-            let options: string[];
-        }
-        namespace variant {
-            let control_1: string;
-            export { control_1 as control };
-            let options_1: string[];
-            export { options_1 as options };
-        }
-        namespace className {
-            let control_2: string;
-            export { control_2 as control };
-        }
-    }
-}
 export default Badge;
 type Badge = SvelteComponent<{
     [x: string]: never;

package/dist/components/Badges/Badge.stories.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.stories.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Badges/Badge.stories.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqGA;;;;mBAAiH;kBAhG7F,gBAAgB;6CAuFS,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"Badge.stories.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Badges/Badge.stories.svelte.js"],"names":[],"mappings":";;;;;;;;AAoGA;;;;mBAAiH;kBA9F7F,gBAAgB;6CAqFS,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,eAAe,QAAQ,CAAC"}