@getmicdrop/svelte-components 3.0.0 → 4.0.0

package/dist/components/Modal/ModalAudit.stories.svelte.d.ts

@@ -1,32 +0,0 @@
-export namespace meta {
-    export let title: string;
-    export { Modal as component };
-}
-export default ModalAudit;
-import Modal from "./Modal.svelte";
-type ModalAudit = SvelteComponent<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> & {
-    $$bindings?: string | undefined;
-};
-declare const ModalAudit: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: never;
-}, {
-    [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: {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-//# sourceMappingURL=ModalAudit.stories.svelte.d.ts.map

package/dist/components/Modal/ModalAudit.stories.svelte.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ModalAudit.stories.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Modal/ModalAudit.stories.svelte.js"],"names":[],"mappings":";;;;;kBAGoB,gBAAgB;;;;;;;;AAkUpC;;;;mBAAsH;6CATzE,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"}

package/dist/components/Modal/ModalStateManager.spec.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ModalStateManager.spec.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Modal/ModalStateManager.spec.js"],"names":[],"mappings":""}

package/dist/components/Modal/ModalStateManager.svelte

@@ -1,67 +0,0 @@
-<script>
-  import Icon from "../Icons/Icon.svelte";
-  import Button from "../Button/Button.svelte";
-
-  /** Whether the modal is currently processing an action */
-  export let isProcessing = false;
-
-  /** Whether the action completed successfully */
-  export let isSuccess = false;
-
-  /** Icon to show on success (from Icon component) */
-  export let successIcon = "CheckCircle";
-
-  /** Title to show on success */
-  export let successTitle = "Success";
-
-  /** Optional message to show on success */
-  export let successMessage = "";
-
-  /** Text to show while processing */
-  export let processingMessage = "Processing your request";
-
-  /** Button text for the success state */
-  export let successButtonText = "Continue";
-
-  /** Callback when success button is clicked */
-  export let onSuccessClose = () => {};
-
-  /** Custom success icon color class */
-  export let successIconColor = "text-accent-success";
-
-  /** Custom processing icon color class */
-  export let processingIconBgColor = "bg-orange-300";
-</script>
-
-{#if isProcessing && !isSuccess}
-  <!-- Processing State -->
-  <div class="py-6 px-4 flex flex-col items-center justify-center gap-4">
-    <div
-      class="w-12 h-12 {processingIconBgColor} rounded-full flex items-center justify-center"
-    >
-      <span class="animate-spin">
-        <Icon name="Reload" size="20" />
-      </span>
-    </div>
-    <p class="text-Text-Primary text-center font-medium">{processingMessage}</p>
-  </div>
-{:else if isSuccess}
-  <!-- Success State -->
-  <div class="py-6 px-4 flex flex-col items-center justify-center gap-4">
-    <div class={successIconColor}>
-      <Icon name={successIcon} size="48" />
-    </div>
-    <h2 class="text-xl font-semibold text-Text-Primary text-center">
-      {successTitle}
-    </h2>
-    {#if successMessage}
-      <p class="text-Text-Tartiary text-center text-sm">{successMessage}</p>
-    {/if}
-    <Button variant="blue-solid" size="full" on:click={onSuccessClose}>
-      {successButtonText}
-    </Button>
-  </div>
-{:else}
-  <!-- Normal State - render children -->
-  <slot />
-{/if}

package/dist/components/Modal/ModalStateManager.svelte.d.ts

@@ -1,58 +0,0 @@
-export default ModalStateManager;
-type ModalStateManager = SvelteComponent<$$__sveltets_2_PropsWithChildren<{
-    isSuccess?: boolean | undefined;
-    isProcessing?: boolean | undefined;
-    successIcon?: string | undefined;
-    successTitle?: string | undefined;
-    successMessage?: string | undefined;
-    processingMessage?: string | undefined;
-    successButtonText?: string | undefined;
-    onSuccessClose?: (() => void) | undefined;
-    successIconColor?: string | undefined;
-    processingIconBgColor?: string | undefined;
-}, {
-    default: {};
-}>, {
-    [evt: string]: CustomEvent<any>;
-}, {
-    default: {};
-}> & {
-    $$bindings?: string | undefined;
-};
-declare const ModalStateManager: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
-    isSuccess?: boolean | undefined;
-    isProcessing?: boolean | undefined;
-    successIcon?: string | undefined;
-    successTitle?: string | undefined;
-    successMessage?: string | undefined;
-    processingMessage?: string | undefined;
-    successButtonText?: string | undefined;
-    onSuccessClose?: (() => void) | undefined;
-    successIconColor?: string | undefined;
-    processingIconBgColor?: string | undefined;
-}, {
-    default: {};
-}>, {
-    [evt: string]: CustomEvent<any>;
-}, {
-    default: {};
-}, {}, string>;
-type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
-    default: any;
-} ? Props extends Record<string, never> ? any : {
-    children?: any;
-} : {});
-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=ModalStateManager.svelte.d.ts.map

package/dist/components/Modal/ModalStateManager.svelte.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ModalStateManager.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Modal/ModalStateManager.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;AAkGA;;;;;;;;;;;;;;;;;eAAmT;sCAT7Q,KAAK,EAAE,KAAK;;;;;6CALL,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/Modal/ModalTestWrapper.svelte.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ModalTestWrapper.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Modal/ModalTestWrapper.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;AAsCA;;;;;;;;;mBAA0K;6CAT7H,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/Modal/StatusModal.svelte

@@ -1,248 +0,0 @@
-<script>
-  import Button from "../Button/Button.svelte";
-  import Cancel from "../../assets/svg/cancel.svg";
-  import Modal from "./Modal.svelte";
-
-  /**
-   * @typedef {Object} Props
-   * @property {boolean} [show] - Whether the modal is visible
-   * @property {'small'|'default'|'large'} [size] - Modal size
-   * @property {string} [title] - Modal title
-   * @property {string} [subtitle] - For profile-style modals
-   * @property {string} [description] - Modal description
-   * @property {string} [buttonText] - Button text
-   * @property {'success'|'error'|'warning'|'info'} [iconType] - Icon type
-   * @property {string|null} [customIcon] - Custom icon URL
-   * @property {string|null} [image] - Profile image URL
-   * @property {boolean} [disabled] - Disabled state
-   * @property {boolean} [loading] - Loading state
-   * @property {string|null} [variant] - Alternative to iconType
-   * @property {Array} [actions] - Action buttons
-   * @property {boolean} [closeBtn] - Show close button
-   * @property {Function} [onconfirm] - Confirm callback
-   * @property {Function} [onclose] - Close callback
-   */
-
-  /** @type {Props} */
-  let {
-    show = $bindable(false),
-    size = "small",
-    title = "",
-    subtitle = "",
-    description = "",
-    buttonText = "Ok",
-    iconType = "success",
-    customIcon = null,
-    image = null,
-    disabled = false,
-    loading = false,
-    variant = null,
-    actions = [],
-    closeBtn = false,
-    onconfirm,
-    onclose
-  } = $props();
-
-  // Use variant if provided, otherwise fallback to iconType
-  let effectiveVariant = $derived(variant || iconType);
-
-  // Check if we're in profile mode (image instead of icon)
-  let isProfileMode = $derived(!!image);
-
-  const handleButtonClick = () => {
-    if (!disabled && !loading) {
-      onconfirm?.();
-      closeModal();
-    }
-  };
-
-  const handleAction = (action) => {
-    if (!disabled && !loading) {
-      action.onClick?.();
-      if (!action.keepOpen) {
-        closeModal();
-      }
-    }
-  };
-
-  const closeModal = () => {
-    show = false;
-    onclose?.();
-  };
-
-  const handleClose = () => {
-    if (disabled || loading) return;
-    closeModal();
-  };
-
-  // Get button variant for action buttons
-  const getActionVariant = (action) => {
-    if (action.variant) return action.variant;
-    const label = action.label.toLowerCase();
-    if (label.startsWith('delete') || label.startsWith('archive') || action.danger) {
-      return 'red-solid';
-    }
-    if (label === 'continue' || label === 'finish' || label === 'done' || label === 'save & notify') {
-      return 'blue-solid';
-    }
-    return 'gray-outline';
-  };
-
-  // Icon colors based on variant
-  const getIconColors = (type) => {
-    switch (type) {
-      case "success":
-        return {
-          bg: "bg-green-100 dark:bg-green-900/30",
-          icon: "text-green-600 dark:text-green-400",
-        };
-      case "error":
-        return {
-          bg: "bg-red-100 dark:bg-red-900/30",
-          icon: "text-red-600 dark:text-red-400",
-        };
-      case "warning":
-        return {
-          bg: "bg-amber-100 dark:bg-amber-900/30",
-          icon: "text-amber-600 dark:text-amber-400",
-        };
-      case "info":
-        return {
-          bg: "bg-blue-100 dark:bg-blue-900/30",
-          icon: "text-blue-600 dark:text-blue-400",
-        };
-      default:
-        return {
-          bg: "bg-green-100 dark:bg-green-900/30",
-          icon: "text-green-600 dark:text-green-400",
-        };
-    }
-  };
-
-  // Button variant based on status type
-  const getButtonVariant = (type) => {
-    switch (type) {
-      case "error":
-        return "red-solid";
-      case "warning":
-        return "blue-solid";
-      default:
-        return "blue-solid";
-    }
-  };
-
-  let colors = $derived(getIconColors(effectiveVariant));
-  let buttonVariant = $derived(getButtonVariant(effectiveVariant));
-</script>
-
-<Modal bind:show {size} oncancel={handleClose}>
-  {#snippet header()}
-    <div class="text-center">
-      {#if closeBtn}
-        <div class="flex justify-end -mt-2 -mr-2 mb-2">
-          <button
-            class="p-1 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none transition-colors"
-            onclick={handleClose}
-            {disabled}
-          >
-            <img src={Cancel} alt="Close" class="w-5 h-5" />
-          </button>
-        </div>
-      {/if}
-      {#if isProfileMode}
-        <!-- Profile mode: show image as rounded square -->
-        <div class="flex justify-center">
-          <img
-            src={image}
-            alt={title}
-            class="w-16 h-16 rounded-lg object-cover"
-          />
-        </div>
-        <div class="mt-4">
-          {#if title}
-            <h2 class="text-xl font-medium text-gray-900 dark:text-white">{title}</h2>
-          {/if}
-          {#if subtitle}
-            <p class="text-sm text-gray-500 dark:text-gray-400 mt-1">{subtitle}</p>
-          {/if}
-        </div>
-      {:else}
-        <!-- Status mode: show icon in colored circle -->
-        <div class="flex justify-center items-center">
-          {#if customIcon}
-            <div class="w-14 h-14 rounded-full {colors.bg} flex items-center justify-center">
-              <img src={customIcon} alt="Status icon" class="w-8 h-8" />
-            </div>
-          {:else}
-            <div class="w-14 h-14 rounded-full {colors.bg} flex items-center justify-center">
-              {#if effectiveVariant === "success"}
-                <svg class="w-7 h-7 {colors.icon}" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
-                </svg>
-              {:else if effectiveVariant === "error"}
-                <svg class="w-7 h-7 {colors.icon}" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
-                </svg>
-              {:else if effectiveVariant === "warning"}
-                <svg class="w-7 h-7 {colors.icon}" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />
-                </svg>
-              {:else if effectiveVariant === "info"}
-                <svg class="w-7 h-7 {colors.icon}" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
-                </svg>
-              {/if}
-            </div>
-          {/if}
-        </div>
-        {#if title}
-          <h2 class="text-xl font-medium text-gray-900 dark:text-white mt-4">{title}</h2>
-        {/if}
-      {/if}
-    </div>
-  {/snippet}
-
-  {#snippet body()}
-    <div class="text-center mt-4">
-      {#if description}
-        <p class="text-sm leading-relaxed {isProfileMode ? 'text-gray-900 dark:text-white font-medium' : 'text-gray-500 dark:text-gray-400'}">
-          {description}
-        </p>
-      {/if}
-    </div>
-  {/snippet}
-
-  {#snippet footer()}
-    <div class="w-full">
-      {#if actions.length > 0}
-        <!-- Multiple buttons mode -->
-        <div class="flex gap-3">
-          {#each actions as action}
-            <Button
-              size="full"
-              variant={getActionVariant(action)}
-              beforeIcon={action.beforeIcon}
-              afterIcon={action.afterIcon}
-              disabled={action.disabled || disabled}
-              loading={action.loading || (loading && action.primary)}
-              onclick={() => handleAction(action)}
-            >
-              {action.label}
-            </Button>
-          {/each}
-        </div>
-      {:else}
-        <!-- Single button mode -->
-        <Button
-          size="full"
-          variant={buttonVariant}
-          {disabled}
-          {loading}
-          onclick={handleButtonClick}
-        >
-          {buttonText}
-        </Button>
-      {/if}
-    </div>
-  {/snippet}
-</Modal>

package/dist/components/Modal/StatusModal.svelte.d.ts

@@ -1,138 +0,0 @@
-export default StatusModal;
-type StatusModal = {
-    $on?(type: string, callback: (e: any) => void): () => void;
-    $set?(props: Partial<Props>): void;
-};
-declare const StatusModal: import("svelte").Component<{
-    /**
-     * - Whether the modal is visible
-     */
-    show?: boolean | undefined;
-    /**
-     * - Modal size
-     */
-    size?: "default" | "small" | "large" | undefined;
-    /**
-     * - Modal title
-     */
-    title?: string | undefined;
-    /**
-     * - For profile-style modals
-     */
-    subtitle?: string | undefined;
-    /**
-     * - Modal description
-     */
-    description?: string | undefined;
-    /**
-     * - Button text
-     */
-    buttonText?: string | undefined;
-    /**
-     * - Icon type
-     */
-    iconType?: "info" | "success" | "warning" | "error" | undefined;
-    /**
-     * - Custom icon URL
-     */
-    customIcon?: string | null | undefined;
-    /**
-     * - Profile image URL
-     */
-    image?: string | null | undefined;
-    /**
-     * - Disabled state
-     */
-    disabled?: boolean | undefined;
-    /**
-     * - Loading state
-     */
-    loading?: boolean | undefined;
-    /**
-     * - Alternative to iconType
-     */
-    variant?: string | null | undefined;
-    /**
-     * - Action buttons
-     */
-    actions?: any[] | undefined;
-    /**
-     * - Show close button
-     */
-    closeBtn?: boolean | undefined;
-    /**
-     * - Confirm callback
-     */
-    onconfirm?: Function | undefined;
-    /**
-     * - Close callback
-     */
-    onclose?: Function | undefined;
-}, {}, "show">;
-type Props = {
-    /**
-     * - Whether the modal is visible
-     */
-    show?: boolean | undefined;
-    /**
-     * - Modal size
-     */
-    size?: "default" | "small" | "large" | undefined;
-    /**
-     * - Modal title
-     */
-    title?: string | undefined;
-    /**
-     * - For profile-style modals
-     */
-    subtitle?: string | undefined;
-    /**
-     * - Modal description
-     */
-    description?: string | undefined;
-    /**
-     * - Button text
-     */
-    buttonText?: string | undefined;
-    /**
-     * - Icon type
-     */
-    iconType?: "info" | "success" | "warning" | "error" | undefined;
-    /**
-     * - Custom icon URL
-     */
-    customIcon?: string | null | undefined;
-    /**
-     * - Profile image URL
-     */
-    image?: string | null | undefined;
-    /**
-     * - Disabled state
-     */
-    disabled?: boolean | undefined;
-    /**
-     * - Loading state
-     */
-    loading?: boolean | undefined;
-    /**
-     * - Alternative to iconType
-     */
-    variant?: string | null | undefined;
-    /**
-     * - Action buttons
-     */
-    actions?: any[] | undefined;
-    /**
-     * - Show close button
-     */
-    closeBtn?: boolean | undefined;
-    /**
-     * - Confirm callback
-     */
-    onconfirm?: Function | undefined;
-    /**
-     * - Close callback
-     */
-    onclose?: Function | undefined;
-};
-//# sourceMappingURL=StatusModal.svelte.d.ts.map

package/dist/components/Modal/StatusModal.svelte.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"StatusModal.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Modal/StatusModal.svelte.js"],"names":[],"mappings":";;;;;AA4OA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;eAA0D"}