@useupup/svelte 3.3.0

package/dist/components/UploaderPanel.svelte

@@ -0,0 +1,363 @@
+<script lang="ts">
+  import { useUploaderFiles, useUploaderI18n, useUploaderOptions, useUploaderRuntime, useUploaderSource, useUploaderTheme, useUploaderUploadControls, useUploaderView } from '../context/uploader-context'
+  import { devinoDark, devinoLight, logoDark, logoLight } from '../assets/logos'
+  import useUploaderPanel from '../composables/useUploaderPanel'
+  import { cn } from '@useupup/core/internal'
+  import { UploadStatus, formatUiMessage } from '@useupup/core'
+  import SourceView from './SourceView.svelte'
+  import SourceSelector from './SourceSelector.svelte'
+  import FileList from './FileList.svelte'
+
+  const { files } = useUploaderFiles()
+  const { activeSource } = useUploaderSource()
+  const { sourceOverlayOpen, sourceOverlayClosing, dropRejected, closeSourceOverlay } = useUploaderView()
+  const { isOnline, motionMode } = useUploaderRuntime()
+  const { translations: tr } = useUploaderI18n()
+  const { isDark: dark } = useUploaderTheme()
+  const { mini, showBranding } = useUploaderOptions()
+  const { upload: { uploadStatus } } = useUploaderUploadControls()
+  const { isDragging, absoluteIsDragging, absoluteHasBorder, handleDragOver, handleDragLeave, handleDrop, handlePaste } = useUploaderPanel()
+
+  // The dashed dropzone frame is the idle-view affordance: shown only when the
+  // panel is an empty, at-rest dropzone (no active source, no add-more flow, no
+  // files). It supersedes the old pulsing CSS border.
+  const showDropzoneFrame = $derived(
+    $absoluteHasBorder && !$activeSource && !$sourceOverlayOpen && !$files.size,
+  )
+
+  // The add-more overlay: once files exist, the source surface slides up over the
+  // still-mounted, dimmed file list, and stays mounted through the reverse
+  // close-slide (`sourceOverlayClosing`).
+  const hasFiles = $derived($files.size > 0)
+  const showSourceOverlay = $derived(
+    hasFiles && ($sourceOverlayOpen || $sourceOverlayClosing || !!$activeSource),
+  )
+
+  // Focus management (minimal — no focus trap; the dimmed list is `inert`).
+  // On open (or an inner view swap) pull focus into the overlay so keyboard/SR
+  // users don't land on the inert list underneath, capturing the trigger. On
+  // settled close, restore focus to the trigger if it's still connected.
+  let overlayEl: HTMLDivElement | null = $state(null)
+  let triggerEl: HTMLElement | null = null
+
+  $effect(() => {
+    if (!($sourceOverlayOpen || $activeSource)) return
+    const el = overlayEl
+    if (!el) return
+    if (!triggerEl && document.activeElement instanceof HTMLElement)
+      triggerEl = document.activeElement
+    el.querySelector<HTMLElement>('button:not([disabled])')?.focus()
+  })
+
+  $effect(() => {
+    if ($sourceOverlayOpen || $sourceOverlayClosing || $activeSource) return
+    const trigger = triggerEl
+    if (!trigger) return
+    triggerEl = null
+    if (trigger.isConnected) trigger.focus()
+  })
+
+  // Polite screen-reader announcement for upload-lifecycle transitions. It is a
+  // pure projection of uploadStatus (no new event plumbing).
+  const uploadAnnouncement = $derived(
+    $uploadStatus === UploadStatus.UPLOADING
+      ? tr.announceUploadStarted
+      : $uploadStatus === UploadStatus.SUCCESSFUL
+        ? tr.announceUploadComplete
+        : $uploadStatus === UploadStatus.FAILED
+          ? tr.announceUploadFailed
+          : '',
+  )
+
+  // Sheet swipe-to-dismiss state (plain vars — dragging must not re-render).
+  let swipeStartY: number | null = null
+  let swiped = false
+
+  function onGripClick() {
+    if (!swiped) closeSourceOverlay()
+    swiped = false
+  }
+  function onGripPointerDown(e: PointerEvent) {
+    swipeStartY = e.clientY
+    ;(e.currentTarget as HTMLElement).setPointerCapture(e.pointerId)
+  }
+  function onGripPointerMove(e: PointerEvent) {
+    const startY = swipeStartY
+    const sheet = overlayEl
+    if (startY === null || !sheet) return
+    const dy = Math.max(0, e.clientY - startY)
+    sheet.style.transition = 'none'
+    sheet.style.transform = `translateY(${dy}px)`
+  }
+  function onGripPointerUp(e: PointerEvent) {
+    const startY = swipeStartY
+    const sheet = overlayEl
+    swipeStartY = null
+    if (startY === null || !sheet) return
+    const dy = Math.max(0, e.clientY - startY)
+    sheet.style.transition = ''
+    sheet.style.transform = ''
+    if (dy > 72) {
+      swiped = true
+      closeSourceOverlay()
+    }
+  }
+
+  function onOverlayKeydown(e: KeyboardEvent) {
+    if (e.key === 'Escape' && !$sourceOverlayClosing) closeSourceOverlay()
+  }
+</script>
+
+<div
+  data-testid="upup-dropzone"
+  data-upup-slot="uploader-panel"
+  data-motion={$motionMode}
+  role="region"
+  aria-label={tr.dropzoneLabel}
+  aria-dropeffect={$isDragging ? 'copy' : 'none'}
+  ondragover={handleDragOver}
+  ondragleave={handleDragLeave}
+  ondrop={handleDrop}
+  onpaste={handlePaste}
+  class={cn('upup-relative upup-flex upup-flex-1 upup-flex-col upup-overflow-hidden upup-rounded-lg', {
+    'upup-border upup-border-[#0ea5e9]': $absoluteHasBorder && !showDropzoneFrame,
+    'upup-border-[#38bdf8] dark:upup-border-[#38bdf8]': $absoluteHasBorder && !showDropzoneFrame && $dark,
+    'upup-border-dashed': !$isDragging && !showDropzoneFrame,
+    'upup-bg-[#e0f2fe] upup-backdrop-blur-sm': $absoluteIsDragging && !$dark,
+    'upup-bg-[#0b2a3a] upup-backdrop-blur-sm dark:upup-bg-[#0b2a3a]': $absoluteIsDragging && $dark,
+  })}
+>
+  <div role="status" aria-live="polite" class="upup-sr-only">
+    {uploadAnnouncement}
+  </div>
+
+  <!-- Drop-rejection toast: a file was dropped onto a read-only drive
+       picker (core DragDropController → transient-UI store). Auto-clears
+       after the store's 3s window drives an unmount — no JS timer here. -->
+  {#if $dropRejected}
+    <div
+      data-testid="upup-drop-rejected-toast"
+      data-upup-slot="drop-rejected-toast"
+      role="status"
+      aria-live="polite"
+      class={cn(
+        'upup-animate-informer-in upup-absolute upup-inset-x-4 upup-top-4 upup-z-30 upup-flex upup-items-center upup-gap-2.5 upup-rounded-xl upup-px-3.5 upup-py-2.5 upup-text-[13px] upup-leading-snug upup-ring-1',
+        $dark
+          ? 'upup-bg-rose-500/[0.14] upup-text-rose-200 upup-ring-rose-400/30'
+          : 'upup-bg-rose-50 upup-text-rose-700 upup-ring-rose-300/60',
+      )}
+    >
+      <svg
+        viewBox="0 0 24 24"
+        width="16"
+        height="16"
+        fill="none"
+        stroke="currentColor"
+        stroke-width="1.9"
+        stroke-linecap="round"
+        stroke-linejoin="round"
+        aria-hidden="true"
+        class="upup-flex-none"
+      >
+        <circle cx="12" cy="12" r="9" />
+        <path d="M12 8v4" />
+        <path d="M12 16h.01" />
+      </svg>
+      <span>
+        {formatUiMessage(tr.dropRejected, { provider: $dropRejected })}
+      </span>
+    </div>
+  {/if}
+
+  {#if !$isOnline}
+    <div class={cn('upup-absolute upup-inset-x-0 upup-top-0 upup-z-30 upup-px-3 upup-py-1.5 upup-text-center upup-text-xs upup-font-medium upup-text-white upup-bg-yellow-500', { 'upup-bg-yellow-600': $dark })}>
+      No internet connection — uploads will resume when you reconnect.
+    </div>
+  {/if}
+
+  {#if showDropzoneFrame}
+    <!-- An <svg> is a replaced element: absolute insets position it but do NOT
+         stretch it (it keeps the 300x150 default), so the frame needs its size
+         stated explicitly alongside its inset. Hugs the panel edge (4px) so the
+         in-frame branding row has breathing room above the bottom dashes. -->
+    <svg
+      data-upup-slot="dropzone-frame"
+      aria-hidden="true"
+      class="upup-pointer-events-none upup-absolute upup-inset-1 upup-h-[calc(100%-0.5rem)] upup-w-[calc(100%-0.5rem)]"
+    >
+      <rect
+        x="1"
+        y="1"
+        rx="14"
+        ry="14"
+        fill="none"
+        stroke-width="1.5"
+        stroke-dasharray="5 7"
+        stroke={$dark
+          ? ($absoluteIsDragging ? 'rgba(56,189,248,0.65)' : 'rgba(56,189,248,0.35)')
+          : ($absoluteIsDragging ? 'rgba(2,132,199,0.7)' : 'rgba(2,132,199,0.4)')}
+        class={cn($absoluteIsDragging && 'upup-animate-fx-dash-march')}
+        style="width: calc(100% - 2px); height: calc(100% - 2px)"
+      />
+    </svg>
+  {/if}
+
+  <!-- Drag-over prompt: an explicit "drop it here" affordance (icon + text) so
+       the drag state never reads as a mere glow. Pointer events pass through —
+       the panel underneath owns the drop. -->
+  {#if $absoluteIsDragging}
+    <div
+      data-testid="upup-drag-overlay"
+      data-upup-slot="drag-overlay"
+      aria-hidden="true"
+      class={cn(
+        'upup-animate-fx-view upup-pointer-events-none upup-absolute upup-inset-0 upup-z-10 upup-flex upup-flex-col upup-items-center upup-justify-center upup-gap-3',
+        $dark ? 'upup-bg-[#0b1220]/70' : 'upup-bg-white/70',
+      )}
+    >
+      <span
+        class={cn(
+          'upup-flex upup-h-16 upup-w-16 upup-items-center upup-justify-center upup-rounded-2xl',
+          $dark
+            ? 'upup-bg-[#38bdf8]/15 upup-text-[#38bdf8]'
+            : 'upup-bg-[#0284c7]/10 upup-text-[#0284c7]',
+        )}
+      >
+        <svg
+          viewBox="0 0 24 24"
+          width="30"
+          height="30"
+          fill="none"
+          stroke="currentColor"
+          stroke-width="1.8"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          aria-hidden="true"
+        >
+          <path d="M12 4v11" />
+          <path d="m7 10 5 5 5-5" />
+          <path d="M4 17v1a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-1" />
+        </svg>
+      </span>
+      <span
+        class={cn(
+          'upup-text-[15px] upup-font-semibold',
+          $dark ? 'upup-text-[#e2e8f0]' : 'upup-text-[#0f172a]',
+        )}
+      >
+        {tr.dropToUpload}
+      </span>
+    </div>
+  {/if}
+
+  <!-- Content area (source surface / file list) flexes above the in-panel
+       branding row so the dashed frame — inset-1 of this panel — wraps
+       EVERYTHING including the brand, per the mock. -->
+  <div class="upup-relative upup-flex upup-min-h-0 upup-flex-1 upup-flex-col">
+    <!-- Idle primary: the source surface fills the panel when empty. -->
+    {#if !hasFiles}
+      {#if $activeSource}
+        <SourceView />
+      {:else}
+        <SourceSelector />
+      {/if}
+    {/if}
+    <FileList />
+  </div>
+
+  <!-- Add-more DRAWER (states-tour-v2 sheet): the source surface slides up as a
+       translucent bottom sheet over the dimmed, still-mounted file list — the
+       files stay visible behind it so nothing feels lost. Swipe the grip down
+       (or Escape / the grip click) to close. -->
+  {#if showSourceOverlay}
+    <div
+      bind:this={overlayEl}
+      data-upup-slot="source-overlay"
+      role={$sourceOverlayClosing ? undefined : 'dialog'}
+      aria-modal={$sourceOverlayClosing ? undefined : 'true'}
+      aria-label={tr.addingMoreFiles}
+      class={cn(
+        'upup-absolute upup-inset-x-3 upup-bottom-3 upup-top-11 upup-z-20 upup-flex upup-flex-col upup-overflow-hidden upup-rounded-2xl upup-ring-1 upup-ring-inset upup-backdrop-blur-md',
+        $sourceOverlayClosing
+          ? 'upup-fx-overlay-close-slide upup-pointer-events-none'
+          : 'upup-fx-overlay-slide',
+        $dark
+          ? 'upup-bg-[#0b1220]/[0.85] upup-ring-white/[0.08] upup-shadow-[0_-18px_40px_-18px_rgba(0,0,0,0.65)]'
+          : 'upup-bg-white/[0.85] upup-ring-black/[0.08] upup-shadow-[0_-18px_40px_-18px_rgba(15,23,42,0.25)]',
+      )}
+      onkeydown={onOverlayKeydown}
+    >
+      <!-- Sheet grip: click closes; drag down past the threshold closes
+           (pointer capture — no transitionend reliance). -->
+      <button
+        type="button"
+        data-testid="upup-sheet-grip"
+        data-upup-slot="sheet-grip"
+        aria-label={tr.overlayBack}
+        class="upup-absolute upup-left-1/2 upup-top-1.5 upup-z-10 upup-flex upup-h-6 upup-w-20 upup--translate-x-1/2 upup-cursor-grab upup-touch-none upup-items-center upup-justify-center upup-rounded-full"
+        onclick={onGripClick}
+        onpointerdown={onGripPointerDown}
+        onpointermove={onGripPointerMove}
+        onpointerup={onGripPointerUp}
+      >
+        <span
+          aria-hidden="true"
+          class={cn(
+            'upup-h-1 upup-w-10 upup-rounded-full',
+            $dark ? 'upup-bg-white/20' : 'upup-bg-black/20',
+          )}
+        ></span>
+      </button>
+      {#if $activeSource}
+        <SourceView />
+      {:else}
+        <SourceSelector />
+      {/if}
+    </div>
+  {/if}
+
+  <!-- Branding row INSIDE the panel (and the dashed frame). The add-more sheet
+       slides over it, per the states-tour mock. Hidden while a source view is
+       active — the drive browser / camera / url views own the full panel — and
+       once files are selected: the file-list screen needs the vertical space
+       (round-7 item 1). -->
+  {#if !mini && showBranding && !$activeSource && !hasFiles}
+    <div
+      data-testid="upup-branding"
+      class="upup-flex upup-w-full upup-flex-none upup-flex-col upup-items-center upup-justify-between upup-gap-1 upup-px-6 upup-pb-5 upup-pt-1.5 md:upup-flex-row"
+    >
+      <a
+        href="https://useupup.com/"
+        target="_blank"
+        rel="noopener noreferrer"
+        class="upup-flex upup-items-center upup-gap-[5px]"
+      >
+        {#if $dark}
+          <img src={logoDark} width={61} height={13} alt="logo-dark" />
+        {:else}
+          <img src={logoLight} width={61} height={13} alt="logo-light" />
+        {/if}
+      </a>
+      <a
+        href="https://devino.ca/"
+        target="_blank"
+        rel="noopener noreferrer"
+        class="upup-flex upup-flex-row upup-items-center upup-justify-end upup-gap-1"
+      >
+        <span
+          class={cn(
+            'upup-mr-0.5 upup-text-xs upup-leading-5 upup-text-[#6D6D6D] md:upup-text-sm',
+            { 'upup-text-gray-300 dark:upup-text-gray-300': $dark },
+          )}
+        >
+          {tr.builtBy}
+        </span>
+        {#if $dark}
+          <img src={devinoDark} width={61} height={13} alt="logo-dark" />
+        {:else}
+          <img src={devinoLight} width={61} height={13} alt="logo-light" />
+        {/if}
+      </a>
+    </div>
+  {/if}
+</div>

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

@@ -0,0 +1,4 @@
+declare const UploaderPanel: import("svelte").Component<Record<string, never>, {}, "">;
+type UploaderPanel = ReturnType<typeof UploaderPanel>;
+export default UploaderPanel;
+//# sourceMappingURL=UploaderPanel.svelte.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"UploaderPanel.svelte.d.ts","sourceRoot":"","sources":["../../src/components/UploaderPanel.svelte.ts"],"names":[],"mappings":"AAsQA,QAAA,MAAM,aAAa,2DAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}

package/dist/components/UrlUploader.svelte

@@ -0,0 +1,71 @@
+<script lang="ts">
+  import {
+    useUploaderFiles,
+    useUploaderI18n,
+    useUploaderOptions,
+    useUploaderRuntime,
+    useUploaderSource,
+    useUploaderTheme,
+  } from '../context/uploader-context'
+  import useFetchFileByUrl from '../composables/useFetchFileByUrl'
+  import { cn } from '@useupup/core/internal'
+  import SourceViewContainer from './shared/SourceViewContainer.svelte'
+
+  const { core } = useUploaderRuntime()
+  const { setFiles } = useUploaderFiles()
+  const { setActiveSource } = useUploaderSource()
+  const { translations: tr } = useUploaderI18n()
+  const { icons: { LoaderIcon } } = useUploaderOptions()
+  const { isDark: dark, slotOverrides: slotClasses } = useUploaderTheme()
+
+  let url = $state('')
+  const { loading, fetchImage } = useFetchFileByUrl()
+
+  async function handleFormSubmit(e: SubmitEvent) {
+    e.preventDefault()
+    core?.emit('url-submit', { url })
+    const file = await fetchImage(url)
+    if (file) {
+      Object.assign(file, { url })
+      setFiles([file])
+      url = ''
+      setActiveSource(undefined)
+    }
+  }
+</script>
+
+<SourceViewContainer data-testid="upup-url-uploader" data-upup-slot="url-uploader">
+  <form onsubmit={handleFormSubmit} class="upup-px-3 upup-py-2">
+    <input
+      type="url"
+      name="upup-url"
+      aria-label={tr.enterFileUrl}
+      placeholder={tr.enterFileUrl}
+      class={cn(
+        'upup-w-full upup-rounded-md upup-border-2 upup-border-[#e0e0e0] upup-bg-transparent upup-px-3 upup-py-2 upup-outline-none',
+        {
+          'upup-border-[#6D6D6D] upup-text-[#6D6D6D] dark:upup-border-[#6D6D6D] dark:upup-text-[#6D6D6D]': $dark,
+        },
+        $slotClasses.urlInput,
+      )}
+      bind:value={url}
+    />
+    <button
+      class={cn(
+        'upup-disabled:bg-[#e0e0e0] upup-mt-2 upup-w-full upup-rounded-md upup-bg-[#0ea5e9] upup-p-2 upup-text-white upup-transition-all upup-duration-300',
+        {
+          'upup-disabled:bg-[#6D6D6D] dark:upup-disabled:bg-[#6D6D6D] upup-bg-[#38bdf8] dark:upup-bg-[#38bdf8]': $dark,
+        },
+        $slotClasses.urlFetchButton,
+      )}
+      type="submit"
+      disabled={!url}
+    >
+      {#if $loading}
+        <LoaderIcon />
+      {:else}
+        {tr.fetch}
+      {/if}
+    </button>
+  </form>
+</SourceViewContainer>

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

@@ -0,0 +1,4 @@
+declare const UrlUploader: import("svelte").Component<Record<string, never>, {}, "">;
+type UrlUploader = ReturnType<typeof UrlUploader>;
+export default UrlUploader;
+//# sourceMappingURL=UrlUploader.svelte.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"UrlUploader.svelte.d.ts","sourceRoot":"","sources":["../../src/components/UrlUploader.svelte.ts"],"names":[],"mappings":"AAuEA,QAAA,MAAM,WAAW,2DAAwC,CAAC;AAC1D,KAAK,WAAW,GAAG,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;AAClD,eAAe,WAAW,CAAC"}

package/dist/components/icons/AudioIcon.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">
+  import Icon from '../Icon.svelte'
+  let { class: className = undefined }: { class?: string } = $props()
+</script>
+<Icon name="audio" class={className} />

package/dist/components/icons/AudioIcon.svelte.d.ts

@@ -0,0 +1,7 @@
+type $$ComponentProps = {
+    class?: string;
+};
+declare const AudioIcon: import("svelte").Component<$$ComponentProps, {}, "">;
+type AudioIcon = ReturnType<typeof AudioIcon>;
+export default AudioIcon;
+//# sourceMappingURL=AudioIcon.svelte.d.ts.map

package/dist/components/icons/AudioIcon.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AudioIcon.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/icons/AudioIcon.svelte.ts"],"names":[],"mappings":"AAKC,KAAK,gBAAgB,GAAI;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAS7C,QAAA,MAAM,SAAS,sDAAwC,CAAC;AACxD,KAAK,SAAS,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAC9C,eAAe,SAAS,CAAC"}

package/dist/components/icons/BoxIcon.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">
+  import Icon from '../Icon.svelte'
+  let { class: className = undefined }: { class?: string } = $props()
+</script>
+<Icon name="box" class={className} />

package/dist/components/icons/BoxIcon.svelte.d.ts

@@ -0,0 +1,7 @@
+type $$ComponentProps = {
+    class?: string;
+};
+declare const BoxIcon: import("svelte").Component<$$ComponentProps, {}, "">;
+type BoxIcon = ReturnType<typeof BoxIcon>;
+export default BoxIcon;
+//# sourceMappingURL=BoxIcon.svelte.d.ts.map

package/dist/components/icons/BoxIcon.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BoxIcon.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/icons/BoxIcon.svelte.ts"],"names":[],"mappings":"AAKC,KAAK,gBAAgB,GAAI;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAS7C,QAAA,MAAM,OAAO,sDAAwC,CAAC;AACtD,KAAK,OAAO,GAAG,UAAU,CAAC,OAAO,OAAO,CAAC,CAAC;AAC1C,eAAe,OAAO,CAAC"}

package/dist/components/icons/CameraIcon.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">
+  import Icon from '../Icon.svelte'
+  let { class: className = undefined }: { class?: string } = $props()
+</script>
+<Icon name="camera" class={className} />

package/dist/components/icons/CameraIcon.svelte.d.ts

@@ -0,0 +1,7 @@
+type $$ComponentProps = {
+    class?: string;
+};
+declare const CameraIcon: import("svelte").Component<$$ComponentProps, {}, "">;
+type CameraIcon = ReturnType<typeof CameraIcon>;
+export default CameraIcon;
+//# sourceMappingURL=CameraIcon.svelte.d.ts.map

package/dist/components/icons/CameraIcon.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CameraIcon.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/icons/CameraIcon.svelte.ts"],"names":[],"mappings":"AAKC,KAAK,gBAAgB,GAAI;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAS7C,QAAA,MAAM,UAAU,sDAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}

package/dist/components/icons/DropboxIcon.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">
+  import Icon from '../Icon.svelte'
+  let { class: className = undefined }: { class?: string } = $props()
+</script>
+<Icon name="dropbox" class={className} />

package/dist/components/icons/DropboxIcon.svelte.d.ts

@@ -0,0 +1,7 @@
+type $$ComponentProps = {
+    class?: string;
+};
+declare const DropboxIcon: import("svelte").Component<$$ComponentProps, {}, "">;
+type DropboxIcon = ReturnType<typeof DropboxIcon>;
+export default DropboxIcon;
+//# sourceMappingURL=DropboxIcon.svelte.d.ts.map

package/dist/components/icons/DropboxIcon.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropboxIcon.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/icons/DropboxIcon.svelte.ts"],"names":[],"mappings":"AAKC,KAAK,gBAAgB,GAAI;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAS7C,QAAA,MAAM,WAAW,sDAAwC,CAAC;AAC1D,KAAK,WAAW,GAAG,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;AAClD,eAAe,WAAW,CAAC"}

package/dist/components/icons/GoogleDriveIcon.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">
+  import Icon from '../Icon.svelte'
+  let { class: className = undefined }: { class?: string } = $props()
+</script>
+<Icon name="google-drive" class={className} />

package/dist/components/icons/GoogleDriveIcon.svelte.d.ts

@@ -0,0 +1,7 @@
+type $$ComponentProps = {
+    class?: string;
+};
+declare const GoogleDriveIcon: import("svelte").Component<$$ComponentProps, {}, "">;
+type GoogleDriveIcon = ReturnType<typeof GoogleDriveIcon>;
+export default GoogleDriveIcon;
+//# sourceMappingURL=GoogleDriveIcon.svelte.d.ts.map

package/dist/components/icons/GoogleDriveIcon.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GoogleDriveIcon.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/icons/GoogleDriveIcon.svelte.ts"],"names":[],"mappings":"AAKC,KAAK,gBAAgB,GAAI;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAS7C,QAAA,MAAM,eAAe,sDAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}

package/dist/components/icons/LinkIcon.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">
+  import Icon from '../Icon.svelte'
+  let { class: className = undefined }: { class?: string } = $props()
+</script>
+<Icon name="link" class={className} />

package/dist/components/icons/LinkIcon.svelte.d.ts

@@ -0,0 +1,7 @@
+type $$ComponentProps = {
+    class?: string;
+};
+declare const LinkIcon: import("svelte").Component<$$ComponentProps, {}, "">;
+type LinkIcon = ReturnType<typeof LinkIcon>;
+export default LinkIcon;
+//# sourceMappingURL=LinkIcon.svelte.d.ts.map

package/dist/components/icons/LinkIcon.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinkIcon.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/icons/LinkIcon.svelte.ts"],"names":[],"mappings":"AAKC,KAAK,gBAAgB,GAAI;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAS7C,QAAA,MAAM,QAAQ,sDAAwC,CAAC;AACvD,KAAK,QAAQ,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC5C,eAAe,QAAQ,CAAC"}

package/dist/components/icons/MyDeviceIcon.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">
+  import Icon from '../Icon.svelte'
+  let { class: className = undefined }: { class?: string } = $props()
+</script>
+<Icon name="my-device" class={className} />

package/dist/components/icons/MyDeviceIcon.svelte.d.ts

@@ -0,0 +1,7 @@
+type $$ComponentProps = {
+    class?: string;
+};
+declare const MyDeviceIcon: import("svelte").Component<$$ComponentProps, {}, "">;
+type MyDeviceIcon = ReturnType<typeof MyDeviceIcon>;
+export default MyDeviceIcon;
+//# sourceMappingURL=MyDeviceIcon.svelte.d.ts.map

package/dist/components/icons/MyDeviceIcon.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MyDeviceIcon.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/icons/MyDeviceIcon.svelte.ts"],"names":[],"mappings":"AAKC,KAAK,gBAAgB,GAAI;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAS7C,QAAA,MAAM,YAAY,sDAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}

package/dist/components/icons/OneDriveIcon.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">
+  import Icon from '../Icon.svelte'
+  let { class: className = undefined }: { class?: string } = $props()
+</script>
+<Icon name="one-drive" class={className} />

package/dist/components/icons/OneDriveIcon.svelte.d.ts

@@ -0,0 +1,7 @@
+type $$ComponentProps = {
+    class?: string;
+};
+declare const OneDriveIcon: import("svelte").Component<$$ComponentProps, {}, "">;
+type OneDriveIcon = ReturnType<typeof OneDriveIcon>;
+export default OneDriveIcon;
+//# sourceMappingURL=OneDriveIcon.svelte.d.ts.map

package/dist/components/icons/OneDriveIcon.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OneDriveIcon.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/icons/OneDriveIcon.svelte.ts"],"names":[],"mappings":"AAKC,KAAK,gBAAgB,GAAI;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAS7C,QAAA,MAAM,YAAY,sDAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}

package/dist/components/icons/ScreenCaptureIcon.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">
+  import Icon from '../Icon.svelte'
+  let { class: className = undefined }: { class?: string } = $props()
+</script>
+<Icon name="screen-capture" class={className} />

package/dist/components/icons/ScreenCaptureIcon.svelte.d.ts

@@ -0,0 +1,7 @@
+type $$ComponentProps = {
+    class?: string;
+};
+declare const ScreenCaptureIcon: import("svelte").Component<$$ComponentProps, {}, "">;
+type ScreenCaptureIcon = ReturnType<typeof ScreenCaptureIcon>;
+export default ScreenCaptureIcon;
+//# sourceMappingURL=ScreenCaptureIcon.svelte.d.ts.map

package/dist/components/icons/ScreenCaptureIcon.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScreenCaptureIcon.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/icons/ScreenCaptureIcon.svelte.ts"],"names":[],"mappings":"AAKC,KAAK,gBAAgB,GAAI;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAS7C,QAAA,MAAM,iBAAiB,sDAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}