@slotted/angular 0.0.0-stage → 0.1.0-beta.1

package/fesm2022/slotted-angular-upload.mjs

@@ -0,0 +1,1523 @@
+import { getLiveAnnouncer } from '@slotted/core/live-announcer';
+import { createControllable } from '@slotted/core/state';
+import { formatDuration, formatBytes, isViewable, uploadSummary, estimateRemaining, createUploadRunner, selectFiles, splitName } from '@slotted/core/upload';
+import { NgTemplateOutlet } from '@angular/common';
+import * as i0 from '@angular/core';
+import { InjectionToken, inject, input, output, computed, DestroyRef, ViewEncapsulation, ChangeDetectionStrategy, Component, ElementRef, HostAttributeToken, model, booleanAttribute, signal, effect, untracked, forwardRef, numberAttribute } from '@angular/core';
+import { NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
+import { injectLocale, injectMessages } from '@slotted/angular/i18n';
+import { SlGlyph, SlIcon } from '@slotted/angular/icon';
+import { SlProgressBar } from '@slotted/angular/progress-indicator';
+import { uploadMessages } from '@slotted/core/i18n';
+import { SlDialog, SlDialogTitle } from '@slotted/angular/dialog';
+import { DomSanitizer } from '@angular/platform-browser';
+
+const FALLBACK = {
+    variant: 'dropzone',
+    layout: 'list',
+    size: 'md',
+    preview: 'auto',
+    view: 'auto',
+    duplicates: 'reject',
+    clickToBrowse: true,
+    allowDrop: true,
+    allowPaste: true,
+    preventDocumentDrop: true,
+    autoUpload: true,
+    pendingBlocksSubmit: true,
+    adapter: undefined,
+    concurrency: 3,
+    retries: 0,
+    retryDelay: 1000,
+    stallAfter: 10000,
+    maxRows: 6,
+    fileKey: undefined,
+};
+const UPLOAD_DEFAULTS = new InjectionToken('slotted upload defaults', {
+    providedIn: 'root',
+    factory: () => FALLBACK,
+});
+/**
+ * An application decides once what its uploads accept, where they send and how
+ * many run at once. An upload that states any of them itself still wins. Every
+ * word and the locale that writes sizes and durations come from the language
+ * in force (`provideSlotted`).
+ *
+ * The adapter is here for the same reason: an application sends to one place,
+ * and repeating the sender on every form is how one of them ends up pointing
+ * somewhere else.
+ */
+function provideUploadDefaults(defaults) {
+    return {
+        provide: UPLOAD_DEFAULTS,
+        useFactory: () => ({ ...FALLBACK, ...defaults }),
+    };
+}
+function injectUploadDefaults() {
+    return inject(UPLOAD_DEFAULTS);
+}
+/** The two formatters a row and a summary read, bound to one locale. */
+function uploadFormatters(locale) {
+    return {
+        bytes: (value) => formatBytes(value, locale),
+        duration: (seconds) => formatDuration(seconds, locale),
+    };
+}
+
+/**
+ * What a file is drawn as on its tile: one glyph per kind, the plain file for
+ * anything no kind claims. The row's tile and the viewer's stage read the same
+ * map, so a kind never has two marks.
+ */
+const KIND_GLYPH = {
+    archive: 'file-archive',
+    audio: 'file-audio',
+    document: 'file-type',
+    image: 'file-image',
+    other: 'file',
+    pdf: 'file-text',
+    presentation: 'presentation',
+    spreadsheet: 'file-spreadsheet',
+    video: 'file-video',
+};
+/**
+ * A file, full screen, on a surface of its own.
+ *
+ * A preview that left the page was the first answer and it was the wrong one:
+ * it loses the form the reader was in the middle of filling in. The tab
+ * survives as the escape hatch in the header, where a PDF is better read in the
+ * browser's own full window.
+ *
+ * `dialog` owns the layer, the scrim, the focus containment, the scroll lock and
+ * Escape, exactly as it does in React; what this owns is the stage, the header
+ * and the two controls that move through the set. The first answer drew the
+ * surface here instead, on the ground that the Angular dialog is opened through
+ * a service — it is not: `sl-dialog` is a component with `open` and projected
+ * content, and drawing the surface by hand shipped a panel with no layer, no
+ * scrim and no containment, sitting in the page under the family.
+ */
+class SlUploadViewer {
+    files = input([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "files" }] : /* istanbul ignore next */ []));
+    viewing = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "viewing" }] : /* istanbul ignore next */ []));
+    urls = input(new Map(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "urls" }] : /* istanbul ignore next */ []));
+    /** The upload's own `messages`, laid over the catalog of the language in force. */
+    messages = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "messages" }] : /* istanbul ignore next */ []));
+    /** What the size is written in. Absent, the language in force. */
+    locale = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "locale" }] : /* istanbul ignore next */ []));
+    /** The family's size, restated on the layer: it is portalled out of the root. */
+    size = input('md', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    viewingChange = output();
+    kindGlyph = KIND_GLYPH;
+    contextLocale = injectLocale();
+    /** The family's words in the language in force, with the upload's `messages` laid over them. */
+    t = injectMessages(uploadMessages, this.messages);
+    /**
+     * Only what the viewer can render, so previous and next skip a spreadsheet
+     * sitting between two photographs rather than stopping on it.
+     */
+    shown = computed(() => this.files().filter((file) => file.file !== undefined && isViewable(file)), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "shown" }] : /* istanbul ignore next */ []));
+    index = computed(() => this.shown().findIndex((file) => file.key === this.viewing()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "index" }] : /* istanbul ignore next */ []));
+    current = computed(() => {
+        const key = this.viewing();
+        if (key === null)
+            return undefined;
+        return this.shown()[this.index()] ?? this.files().find((file) => file.key === key);
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "current" }] : /* istanbul ignore next */ []));
+    url = computed(() => {
+        const file = this.current();
+        return file === undefined ? undefined : this.urls().get(file.key);
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "url" }] : /* istanbul ignore next */ []));
+    /**
+     * The frame's source, trusted explicitly. Angular refuses an interpolated
+     * resource URL and renders an empty frame instead, which is what a PDF was
+     * here until it was measured. What is trusted is not a consumer's string: it
+     * is the object URL this family made, with `URL.createObjectURL`, for a file
+     * the reader chose in this browser.
+     */
+    sanitizer = inject(DomSanitizer);
+    frameUrl = computed(() => {
+        const url = this.url();
+        return url === undefined ? null : this.sanitizer.bypassSecurityTrustResourceUrl(url);
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "frameUrl" }] : /* istanbul ignore next */ []));
+    stage = computed(() => {
+        const file = this.current();
+        if (file === undefined || this.url() === undefined)
+            return 'unsupported';
+        const type = file.type.split(';')[0] ?? '';
+        if (type.startsWith('image/'))
+            return 'image';
+        if (type.startsWith('video/'))
+            return 'video';
+        if (type.startsWith('audio/'))
+            return 'audio';
+        /*
+         * A PDF is framed without `sandbox` and everything else with it, and the
+         * asymmetry is measured rather than assumed. Chrome's PDF viewer is blocked in
+         * a sandboxed frame — with `sandbox=""` and with `sandbox="allow-scripts"`
+         * alike, both photographed against a one-page document — so the sandbox that
+         * protects a dropped `text/html` file is also what made every PDF preview a
+         * grey box, which is how a reader met it.
+         *
+         * What makes the exception safe is the type: the object URL carries the file's
+         * own media type, Chrome dispatches `application/pdf` to the PDF viewer by
+         * that type and does not sniff HTML out of it — an HTML document served as
+         * `application/pdf` in an unsandboxed frame ran no script, measured the same
+         * way. Text keeps the sandbox, with neither `allow-scripts` nor
+         * `allow-same-origin`, because an object URL inherits this document's origin.
+         */
+        if (type === 'application/pdf')
+            return 'pdf';
+        if (type.startsWith('text/'))
+            return 'text';
+        return 'unsupported';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "stage" }] : /* istanbul ignore next */ []));
+    metaText = computed(() => {
+        const file = this.current();
+        if (file === undefined)
+            return '';
+        const size = formatBytes(file.size, this.locale() ?? this.contextLocale());
+        const kind = this.t(file.kind);
+        return this.index() === -1
+            ? this.t('viewerMeta', { size, kind })
+            : this.t('viewerMetaPosition', {
+                size,
+                kind,
+                index: this.index() + 1,
+                count: this.shown().length,
+            });
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "metaText" }] : /* istanbul ignore next */ []));
+    extensionLabel = computed(() => {
+        const name = this.current()?.name ?? '';
+        const dot = name.lastIndexOf('.');
+        return dot <= 0 ? this.t('noExtension') : name.slice(dot + 1).toUpperCase();
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "extensionLabel" }] : /* istanbul ignore next */ []));
+    constructor() {
+        const onKey = (event) => {
+            if (this.current() === undefined)
+                return;
+            this.onKey(event);
+        };
+        document.addEventListener('keydown', onKey);
+        inject(DestroyRef).onDestroy(() => document.removeEventListener('keydown', onKey));
+    }
+    onKey(event) {
+        if (this.current() === undefined)
+            return;
+        const shown = this.shown();
+        /* Escape is the dialog's, and it arrives here as a close request instead. */
+        if (event.key === 'ArrowLeft')
+            this.move(-1, event);
+        else if (event.key === 'ArrowRight')
+            this.move(1, event);
+        else if (event.key === 'Home')
+            this.emit(shown[0]?.key ?? null, 'keyboard', event);
+        else if (event.key === 'End')
+            this.emit(shown.at(-1)?.key ?? null, 'keyboard', event);
+        else
+            return;
+        event.preventDefault();
+    }
+    move(step, source) {
+        const next = this.shown()[this.index() + step];
+        if (next !== undefined)
+            this.emit(next.key, 'keyboard', source);
+    }
+    close(source) {
+        this.emit(null, 'pointer', source);
+    }
+    /**
+     * The layer closed itself — Escape, the scrim, or the dialog's own control.
+     * Only the reasons this family declares survive the translation; the rest is
+     * a dismissal, which is what `dismiss` means in every state model here.
+     */
+    onDialogRequest(request) {
+        if (request.value)
+            return;
+        const reason = request.reason === 'escape' || request.reason === 'outsidePress' ? request.reason : 'dismiss';
+        this.emit(null, reason, request.source);
+    }
+    openExternally() {
+        const url = this.url();
+        if (url !== undefined)
+            window.open(url, '_blank', 'noopener,noreferrer');
+    }
+    emit(key, reason, source) {
+        this.viewingChange.emit({ key, reason, source });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlUploadViewer, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SlUploadViewer, isStandalone: true, selector: "div[slUploadViewer]", inputs: { files: { classPropertyName: "files", publicName: "files", isSignal: true, isRequired: false, transformFunction: null }, viewing: { classPropertyName: "viewing", publicName: "viewing", isSignal: true, isRequired: false, transformFunction: null }, urls: { classPropertyName: "urls", publicName: "urls", isSignal: true, isRequired: false, transformFunction: null }, messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { viewingChange: "viewingChange" }, host: { listeners: { "keydown": "onKey($event)" }, properties: { "attr.hidden": "current() ? null : \"\"" } }, exportAs: ["slUploadViewer"], ngImport: i0, template: `
+    <!--
+      The layer stands whether or not a file is open, and the open input is what
+      moves it. Written the other way round — the dialog created by the same
+      block that opens it — the presence machine reached open in an effect after
+      the view had been made and the layer's own template was never refreshed:
+      the component reported itself open and mounted, with nothing in the
+      document to show for it.
+    -->
+    <sl-dialog
+      (openChangeRequest)="onDialogRequest($event)"
+      [open]="current() !== undefined"
+      fullScreen="always"
+    >
+      @if (current(); as file) {
+        <div [attr.data-size]="size()" data-part="viewer" data-ui="upload">
+          <div data-part="viewerHeader">
+            <div>
+              <h2 data-part="viewerTitle" slDialogTitle>{{ file.name }}</h2>
+              <span data-part="viewerMeta">{{ metaText() }}</span>
+            </div>
+            <span data-part="viewerActions">
+              @if (url()) {
+                <button
+                  (click)="openExternally()"
+                  [attr.aria-label]="t('viewerExternal')"
+                  data-part="viewerExternal"
+                  type="button"
+                >
+                  <span slIcon><svg slGlyph name="external"></svg></span>
+                </button>
+              }
+              <button
+                (click)="close($event)"
+                [attr.aria-label]="t('viewerClose')"
+                data-part="viewerClose"
+                type="button"
+              >
+                <span slIcon><svg slGlyph name="x"></svg></span>
+              </button>
+            </span>
+          </div>
+
+          <div data-part="viewerStage">
+            @if (shown().length > 1) {
+              <button
+                (click)="move(-1, $event)"
+                [attr.aria-label]="t('viewerPrevious')"
+                [disabled]="index() <= 0"
+                data-part="viewerPrevious"
+                type="button"
+              >
+                <span slIcon directional><svg slGlyph name="chevron-right"></svg></span>
+              </button>
+            }
+
+            @switch (stage()) {
+              @case ('image') {
+                <img [alt]="file.name" [src]="url()" />
+              }
+              @case ('video') {
+                <video [src]="url()" controls></video>
+              }
+              @case ('audio') {
+                <audio [src]="url()" controls></audio>
+              }
+              @case ('pdf') {
+                <iframe [src]="frameUrl()" [title]="file.name"></iframe>
+              }
+              @case ('text') {
+                <iframe [src]="frameUrl()" [title]="file.name" sandbox=""></iframe>
+              }
+              @default {
+                <span
+                  [attr.data-extension]="extensionLabel()"
+                  [attr.data-kind]="file.kind"
+                  data-part="preview"
+                >
+                  <span slIcon><svg slGlyph [name]="kindGlyph[file.kind]"></svg></span>
+                </span>
+                <p>{{ t('viewerUnsupported') }}</p>
+              }
+            }
+
+            @if (shown().length > 1) {
+              <button
+                (click)="move(1, $event)"
+                [attr.aria-label]="t('viewerNext')"
+                [disabled]="index() === -1 || index() >= shown().length - 1"
+                data-part="viewerNext"
+                type="button"
+              >
+                <span slIcon directional><svg slGlyph name="chevron-right"></svg></span>
+              </button>
+            }
+          </div>
+        </div>
+      }
+    </sl-dialog>
+  `, isInline: true, dependencies: [{ kind: "component", type: SlDialog, selector: "sl-dialog", inputs: ["modal", "outsidePress"], exportAs: ["slDialog"] }, { kind: "directive", type: SlDialogTitle, selector: "[slDialogTitle]", exportAs: ["slDialogTitle"] }, { kind: "component", type: SlGlyph, selector: "svg[slGlyph]", inputs: ["name", "solid"] }, { kind: "component", type: SlIcon, selector: "[slIcon]", inputs: ["directional", "label", "size", "tone"], exportAs: ["slIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlUploadViewer, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'div[slUploadViewer]',
+                    standalone: true,
+                    exportAs: 'slUploadViewer',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    imports: [SlDialog, SlDialogTitle, SlGlyph, SlIcon],
+                    host: {
+                        '[attr.hidden]': 'current() ? null : ""',
+                        '(keydown)': 'onKey($event)',
+                    },
+                    template: `
+    <!--
+      The layer stands whether or not a file is open, and the open input is what
+      moves it. Written the other way round — the dialog created by the same
+      block that opens it — the presence machine reached open in an effect after
+      the view had been made and the layer's own template was never refreshed:
+      the component reported itself open and mounted, with nothing in the
+      document to show for it.
+    -->
+    <sl-dialog
+      (openChangeRequest)="onDialogRequest($event)"
+      [open]="current() !== undefined"
+      fullScreen="always"
+    >
+      @if (current(); as file) {
+        <div [attr.data-size]="size()" data-part="viewer" data-ui="upload">
+          <div data-part="viewerHeader">
+            <div>
+              <h2 data-part="viewerTitle" slDialogTitle>{{ file.name }}</h2>
+              <span data-part="viewerMeta">{{ metaText() }}</span>
+            </div>
+            <span data-part="viewerActions">
+              @if (url()) {
+                <button
+                  (click)="openExternally()"
+                  [attr.aria-label]="t('viewerExternal')"
+                  data-part="viewerExternal"
+                  type="button"
+                >
+                  <span slIcon><svg slGlyph name="external"></svg></span>
+                </button>
+              }
+              <button
+                (click)="close($event)"
+                [attr.aria-label]="t('viewerClose')"
+                data-part="viewerClose"
+                type="button"
+              >
+                <span slIcon><svg slGlyph name="x"></svg></span>
+              </button>
+            </span>
+          </div>
+
+          <div data-part="viewerStage">
+            @if (shown().length > 1) {
+              <button
+                (click)="move(-1, $event)"
+                [attr.aria-label]="t('viewerPrevious')"
+                [disabled]="index() <= 0"
+                data-part="viewerPrevious"
+                type="button"
+              >
+                <span slIcon directional><svg slGlyph name="chevron-right"></svg></span>
+              </button>
+            }
+
+            @switch (stage()) {
+              @case ('image') {
+                <img [alt]="file.name" [src]="url()" />
+              }
+              @case ('video') {
+                <video [src]="url()" controls></video>
+              }
+              @case ('audio') {
+                <audio [src]="url()" controls></audio>
+              }
+              @case ('pdf') {
+                <iframe [src]="frameUrl()" [title]="file.name"></iframe>
+              }
+              @case ('text') {
+                <iframe [src]="frameUrl()" [title]="file.name" sandbox=""></iframe>
+              }
+              @default {
+                <span
+                  [attr.data-extension]="extensionLabel()"
+                  [attr.data-kind]="file.kind"
+                  data-part="preview"
+                >
+                  <span slIcon><svg slGlyph [name]="kindGlyph[file.kind]"></svg></span>
+                </span>
+                <p>{{ t('viewerUnsupported') }}</p>
+              }
+            }
+
+            @if (shown().length > 1) {
+              <button
+                (click)="move(1, $event)"
+                [attr.aria-label]="t('viewerNext')"
+                [disabled]="index() === -1 || index() >= shown().length - 1"
+                data-part="viewerNext"
+                type="button"
+              >
+                <span slIcon directional><svg slGlyph name="chevron-right"></svg></span>
+              </button>
+            }
+          </div>
+        </div>
+      }
+    </sl-dialog>
+  `,
+                }]
+        }], ctorParameters: () => [], propDecorators: { files: [{ type: i0.Input, args: [{ isSignal: true, alias: "files", required: false }] }], viewing: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewing", required: false }] }], urls: [{ type: i0.Input, args: [{ isSignal: true, alias: "urls", required: false }] }], messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: false }] }], locale: [{ type: i0.Input, args: [{ isSignal: true, alias: "locale", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], viewingChange: [{ type: i0.Output, args: ["viewingChange"] }] } });
+
+/**
+ * Files, and what happens to them.
+ *
+ * One family for what `docs/component-features.md` §17 lists as three: a drop
+ * region, a file input, and the manager that shows what is being sent.
+ *
+ * **The trigger is the `<label>` and the region is not.** What the reader
+ * focuses is an `<input type="file">` clipped to one pixel inside the trigger,
+ * so the input's accessible name is the trigger's own text rather than every
+ * word in the box.
+ *
+ * **The family calls an adapter and reports what it says.** It holds no URL, no
+ * method, no header and no credential.
+ */
+class SlUpload {
+    defaults = injectUploadDefaults();
+    host = inject(ElementRef).nativeElement;
+    destroyRef = inject(DestroyRef);
+    /**
+     * A static `id` the consumer wrote, read before any binding computes, so the
+     * binding never writes over it.
+     */
+    static count = 0;
+    writtenId = inject(new HostAttributeToken('id'), { optional: true });
+    controlId = this.writtenId ?? `slotted-upload-${(SlUpload.count += 1)}`;
+    descriptionId = `${this.controlId}-description`;
+    kindGlyph = KIND_GLYPH;
+    /** Present means the consumer owns the selection. */
+    files = model([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "files" }] : /* istanbul ignore next */ []));
+    /** Present means the consumer owns which file the viewer is open on. */
+    viewing = model(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "viewing" }] : /* istanbul ignore next */ []));
+    filesChange2 = output({ alias: 'filesRequest' });
+    viewingRequest = output();
+    reject = output();
+    accept = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "accept" }] : /* istanbul ignore next */ []));
+    multiple = input(false, { ...(ngDevMode ? { debugName: "multiple" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    directory = input(false, { ...(ngDevMode ? { debugName: "directory" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    capture = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "capture" }] : /* istanbul ignore next */ []));
+    maxFiles = input(undefined, { ...(ngDevMode ? { debugName: "maxFiles" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    minFiles = input(undefined, { ...(ngDevMode ? { debugName: "minFiles" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    maxSize = input(undefined, { ...(ngDevMode ? { debugName: "maxSize" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    minSize = input(undefined, { ...(ngDevMode ? { debugName: "minSize" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    maxTotalSize = input(undefined, { ...(ngDevMode ? { debugName: "maxTotalSize" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    /**
+     * The consumer's own rule. It is `fileValidator` in the class and `validate`
+     * in a template, because `Validator.validate` is a method this class already
+     * has and two members cannot share a name.
+     */
+    fileValidator = input(undefined, { ...(ngDevMode ? { debugName: "fileValidator" } : /* istanbul ignore next */ {}), alias: 'validate' });
+    transform = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "transform" }] : /* istanbul ignore next */ []));
+    variant = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    layout = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
+    size = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    preview = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "preview" }] : /* istanbul ignore next */ []));
+    view = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "view" }] : /* istanbul ignore next */ []));
+    duplicates = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "duplicates" }] : /* istanbul ignore next */ []));
+    clickToBrowse = input(undefined, { ...(ngDevMode ? { debugName: "clickToBrowse" } : /* istanbul ignore next */ {}), transform: optionalBoolean });
+    allowDrop = input(undefined, { ...(ngDevMode ? { debugName: "allowDrop" } : /* istanbul ignore next */ {}), transform: optionalBoolean });
+    allowPaste = input(undefined, { ...(ngDevMode ? { debugName: "allowPaste" } : /* istanbul ignore next */ {}), transform: optionalBoolean });
+    preventDocumentDrop = input(undefined, { ...(ngDevMode ? { debugName: "preventDocumentDrop" } : /* istanbul ignore next */ {}), transform: optionalBoolean });
+    autoUpload = input(undefined, { ...(ngDevMode ? { debugName: "autoUpload" } : /* istanbul ignore next */ {}), transform: optionalBoolean });
+    pendingBlocksSubmit = input(undefined, { ...(ngDevMode ? { debugName: "pendingBlocksSubmit" } : /* istanbul ignore next */ {}), transform: optionalBoolean });
+    adapter = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "adapter" }] : /* istanbul ignore next */ []));
+    concurrency = input(undefined, { ...(ngDevMode ? { debugName: "concurrency" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    retries = input(undefined, { ...(ngDevMode ? { debugName: "retries" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    retryDelay = input(undefined, { ...(ngDevMode ? { debugName: "retryDelay" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    stallAfter = input(undefined, { ...(ngDevMode ? { debugName: "stallAfter" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    maxRows = input(undefined, { ...(ngDevMode ? { debugName: "maxRows" } : /* istanbul ignore next */ {}), transform: optionalNumber });
+    /** What sizes and durations are written in. Absent, the language in force. */
+    locale = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "locale" }] : /* istanbul ignore next */ []));
+    fileKey = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "fileKey" }] : /* istanbul ignore next */ []));
+    /**
+     * Words laid over the catalog of the language in force, key by key: the
+     * controls, the word for each status and each kind, the sentences about the
+     * queue, and why a file was refused (`rejection.*`). Only the application
+     * knows whether a limit is a policy, a plan or a bug, so a refusal is worded
+     * here.
+     */
+    messages = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "messages" }] : /* istanbul ignore next */ []));
+    label = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    description = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []));
+    name = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    readOnly = input(false, { ...(ngDevMode ? { debugName: "readOnly" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    invalid = input(false, { ...(ngDevMode ? { debugName: "invalid" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    required = input(false, { ...(ngDevMode ? { debugName: "required" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    formDisabled = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "formDisabled" }] : /* istanbul ignore next */ []));
+    dragging = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "dragging" }] : /* istanbul ignore next */ []));
+    documentDrag = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "documentDrag" }] : /* istanbul ignore next */ []));
+    verdict = signal(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "verdict" }] : /* istanbul ignore next */ []));
+    urls = signal(new Map(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "urls" }] : /* istanbul ignore next */ []));
+    pausable = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "pausable" }] : /* istanbul ignore next */ []));
+    samples = signal([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "samples" }] : /* istanbul ignore next */ []));
+    depth = 0;
+    runner = null;
+    statuses = new Map();
+    /** `null` until the first run, which records the initial list without saying it. */
+    finished = null;
+    onChangeFn = () => undefined;
+    onTouchedFn = () => undefined;
+    onValidatorChange = () => undefined;
+    resolvedVariant = computed(() => this.variant() ?? this.defaults.variant, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedVariant" }] : /* istanbul ignore next */ []));
+    resolvedLayout = computed(() => this.layout() ?? this.defaults.layout, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedLayout" }] : /* istanbul ignore next */ []));
+    resolvedSize = computed(() => this.size() ?? this.defaults.size, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedSize" }] : /* istanbul ignore next */ []));
+    resolvedPreview = computed(() => this.preview() ?? this.defaults.preview, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedPreview" }] : /* istanbul ignore next */ []));
+    resolvedView = computed(() => this.view() ?? this.defaults.view, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedView" }] : /* istanbul ignore next */ []));
+    contextLocale = injectLocale();
+    resolvedLocale = computed(() => this.locale() ?? this.contextLocale(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedLocale" }] : /* istanbul ignore next */ []));
+    /** The family's words in the language in force, with this upload's `messages` laid over them. */
+    t = injectMessages(uploadMessages, this.messages);
+    resolvedDisabled = computed(() => this.disabled() || this.formDisabled(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedDisabled" }] : /* istanbul ignore next */ []));
+    formatters = computed(() => uploadFormatters(this.resolvedLocale()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "formatters" }] : /* istanbul ignore next */ []));
+    summary = computed(() => uploadSummary(this.files()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "summary" }] : /* istanbul ignore next */ []));
+    insideField = computed(() => this.host.closest('[data-ui="field"]') !== null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "insideField" }] : /* istanbul ignore next */ []));
+    visibleRows = computed(() => {
+        const rows = this.maxRows() ?? this.defaults.maxRows;
+        return rows === 0 ? this.files().length : rows;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "visibleRows" }] : /* istanbul ignore next */ []));
+    showList = computed(() => this.files().length > 0 && !(this.resolvedVariant() === 'field' && this.files().length === 1), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "showList" }] : /* istanbul ignore next */ []));
+    fieldSummary = computed(() => {
+        const list = this.files();
+        if (list.length === 0)
+            return '—';
+        const first = list[0];
+        if (list.length === 1 && first !== undefined) {
+            return `${first.name} · ${this.formatters().bytes(first.size)}`;
+        }
+        return this.t('selection', { count: list.length });
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "fieldSummary" }] : /* istanbul ignore next */ []));
+    summaryText = computed(() => {
+        const summary = this.summary();
+        const remaining = summary.pending ? estimateRemaining(this.samples(), summary) : null;
+        const counts = { uploaded: summary.counts.success, total: summary.total };
+        return remaining === null
+            ? this.t('summary', counts)
+            : this.t('summaryRemaining', {
+                ...counts,
+                duration: this.formatters().duration(remaining),
+            });
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "summaryText" }] : /* istanbul ignore next */ []));
+    /** Whether a click anywhere in the region opens the picker, which is when it answers a pointer. */
+    browsable = computed(() => (this.clickToBrowse() ?? this.defaults.clickToBrowse) && this.accepting(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "browsable" }] : /* istanbul ignore next */ []));
+    describedBy = computed(() => {
+        const parts = [this.description() === undefined ? undefined : this.descriptionId].filter(Boolean);
+        return parts.length === 0 ? null : parts.join(' ');
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "describedBy" }] : /* istanbul ignore next */ []));
+    constructor() {
+        /* The runner is rebuilt when the adapter or its policy changes, and torn
+           down with the component: an aborted transfer is what a page navigating
+           away owes the reader. */
+        effect((onCleanup) => {
+            const adapter = this.adapter() ?? this.defaults.adapter;
+            if (adapter === undefined) {
+                this.runner = null;
+                this.pausable.set(false);
+                return;
+            }
+            const runner = createUploadRunner({
+                adapter,
+                concurrency: this.concurrency() ?? this.defaults.concurrency,
+                retries: this.retries() ?? this.defaults.retries,
+                retryDelay: this.retryDelay() ?? this.defaults.retryDelay,
+                stallAfter: this.stallAfter() ?? this.defaults.stallAfter,
+                onPatch: (key, patch) => this.patch(key, patch),
+            });
+            this.runner = runner;
+            this.pausable.set(runner.pausable);
+            onCleanup(() => runner.destroy());
+        });
+        /*
+         * The status changes the reader did not necessarily cause and may not be
+         * looking at are said: a transfer that failed, one that was stopped, and
+         * the queue finishing. The previous status of every row is kept so each is
+         * said once; a row seen for the first time is the list's initial content,
+         * which the contract keeps silent.
+         */
+        effect(() => {
+            const list = this.files();
+            const summary = this.summary();
+            untracked(() => {
+                const announcer = getLiveAnnouncer();
+                for (const file of list) {
+                    const before = this.statuses.get(file.key);
+                    if (before === undefined || before === file.status)
+                        continue;
+                    if (file.status === 'error' || file.status === 'canceled') {
+                        announcer?.announce(this.t('fileNotice', { name: file.name, message: this.t(file.status) }));
+                    }
+                }
+                this.statuses = new Map(list.map((file) => [file.key, file.status]));
+                const finished = summary.complete && summary.total > 0;
+                if (finished && this.finished === false) {
+                    announcer?.announce(this.t('finished', { uploaded: summary.counts.success, total: summary.total }));
+                }
+                this.finished = finished;
+            });
+        });
+        /*
+         * The family created the object URLs, so the family revokes them. §14
+         * requires the revocation by name; Ant Design leaves it to the consumer and
+         * Uppy owns a plugin for it.
+         */
+        effect(() => {
+            const list = this.files();
+            const wanted = new Map(this.urls());
+            let moved = false;
+            for (const file of list) {
+                if (file.file === undefined || wanted.has(file.key) || !isViewable(file))
+                    continue;
+                wanted.set(file.key, URL.createObjectURL(file.file));
+                moved = true;
+            }
+            const live = new Set(list.map((file) => file.key));
+            for (const [key, url] of wanted) {
+                if (live.has(key))
+                    continue;
+                URL.revokeObjectURL(url);
+                wanted.delete(key);
+                moved = true;
+            }
+            if (moved)
+                this.urls.set(wanted);
+        });
+        /* The throughput window the remaining time is read from. */
+        effect(() => {
+            const loaded = this.summary().loaded;
+            const samples = this.samples();
+            if (samples.at(-1)?.loaded === loaded)
+                return;
+            this.samples.set([...samples, { at: Date.now(), loaded }].slice(-8));
+        });
+        /*
+         * None of the nine surveyed implementations answers what happens when a
+         * form is submitted while the bytes are still moving. The native submit is
+         * refused on the control the reader can see, and Reactive Forms hears the
+         * same thing through `Validator`.
+         */
+        effect(() => {
+            const blocked = this.pendingBlocked();
+            const element = this.host.querySelector('[data-part="input"]');
+            element?.setCustomValidity(blocked ? this.t('pending') : '');
+            this.onValidatorChange();
+        });
+        this.destroyRef.onDestroy(() => {
+            for (const url of this.urls().values())
+                URL.revokeObjectURL(url);
+            this.runner?.destroy();
+            this.documentGuard?.();
+        });
+        effect((onCleanup) => {
+            if (!(this.preventDocumentDrop() ?? this.defaults.preventDocumentDrop))
+                return;
+            onCleanup(this.guardDocument());
+        });
+    }
+    documentGuard = null;
+    /**
+     * A file dropped beside the region navigates the browser to that file and
+     * loses the form. The drag it knows about is published so an application can
+     * draw its own full-screen zone — which is a decision about the application,
+     * not about a control.
+     */
+    guardDocument() {
+        const inside = (event) => event.target?.closest?.('[data-ui="upload"]') !== null &&
+            event.target?.closest?.('[data-ui="upload"]') !== undefined;
+        const over = (event) => {
+            if (![...(event.dataTransfer?.types ?? [])].includes('Files'))
+                return;
+            this.documentDrag.set(true);
+            if (!inside(event)) {
+                event.preventDefault();
+                if (event.dataTransfer !== null)
+                    event.dataTransfer.dropEffect = 'none';
+            }
+        };
+        const drop = (event) => {
+            this.documentDrag.set(false);
+            if (!inside(event))
+                event.preventDefault();
+        };
+        document.addEventListener('dragover', over);
+        document.addEventListener('drop', drop);
+        document.addEventListener('dragend', drop);
+        this.documentGuard = () => {
+            document.removeEventListener('dragover', over);
+            document.removeEventListener('drop', drop);
+            document.removeEventListener('dragend', drop);
+            this.documentGuard = null;
+        };
+        return this.documentGuard;
+    }
+    /* ── Reactive Forms ─────────────────────────────────────────────────── */
+    writeValue(value) {
+        if (value === null) {
+            this.files.set([]);
+            return;
+        }
+        /* A form may hand back either shape; the value the family emits is always
+           the richer one, because a row draws more than its bytes. */
+        const normalised = value.map((entry) => entry instanceof File
+            ? {
+                key: `${entry.name}:${entry.size}:${entry.lastModified}`,
+                file: entry,
+                name: entry.name,
+                size: entry.size,
+                type: entry.type,
+                kind: 'other',
+                status: 'success',
+                loaded: entry.size,
+                attempts: 0,
+            }
+            : entry);
+        this.files.set(normalised);
+    }
+    registerOnChange(fn) {
+        this.onChangeFn = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouchedFn = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.formDisabled.set(isDisabled);
+    }
+    registerOnValidatorChange(fn) {
+        this.onValidatorChange = fn;
+    }
+    validate() {
+        const errors = {};
+        const summary = this.summary();
+        const min = this.minFiles();
+        const max = this.maxFiles();
+        if (this.required() && summary.counts.success === 0)
+            errors['required'] = true;
+        if (min !== undefined && summary.counts.success < min)
+            errors['minFiles'] = { min };
+        if (max !== undefined && summary.total - summary.counts.rejected > max) {
+            errors['maxFiles'] = { max };
+        }
+        if (this.pendingBlocked())
+            errors['uploadPending'] = true;
+        return Object.keys(errors).length === 0 ? null : errors;
+    }
+    pendingBlocked() {
+        return ((this.pendingBlocksSubmit() ?? this.defaults.pendingBlocksSubmit) && this.summary().pending);
+    }
+    /* ── The selection ──────────────────────────────────────────────────── */
+    accepting() {
+        return !this.resolvedDisabled() && !this.readOnly();
+    }
+    request(next, reason, source) {
+        const state = createControllable({
+            controlled: undefined,
+            initial: this.files(),
+            onRequest: (change) => this.filesChange2.emit(change),
+            equals: (a, b) => a === b,
+        });
+        state.request(next, reason, source);
+        this.files.set(next);
+        this.onChangeFn(next);
+        this.onValidatorChange();
+    }
+    patch(key, changes) {
+        this.files.set(this.files().map((file) => file.key === key ? { ...file, ...changes } : file));
+        this.onChangeFn(this.files());
+        this.onValidatorChange();
+    }
+    async take(incoming, reason, source) {
+        if (!this.accepting() || incoming.length === 0)
+            return;
+        const transform = this.transform();
+        const prepared = transform === undefined ? [...incoming] : await transform([...incoming]);
+        const existing = this.files();
+        const outcome = selectFiles(prepared, existing, {
+            accept: this.accept(),
+            multiple: this.multiple(),
+            directory: this.directory(),
+            maxFiles: this.maxFiles(),
+            maxSize: this.maxSize(),
+            minSize: this.minSize(),
+            maxTotalSize: this.maxTotalSize(),
+            duplicates: this.duplicates() ?? this.defaults.duplicates,
+            validate: this.fileValidator(),
+            fileKey: this.fileKey() ?? this.defaults.fileKey,
+        });
+        this.request(outcome.files, reason, source);
+        /* A refused file joins the list too, and is announced below with its reason. */
+        const kept = outcome.files.filter((file) => file.status !== 'rejected' && !existing.includes(file)).length;
+        const announcer = getLiveAnnouncer();
+        if (kept > 0)
+            announcer?.announce(this.t('added', { count: kept }));
+        if (outcome.rejected.length > 0) {
+            this.reject.emit(outcome.rejected);
+            for (const file of outcome.rejected) {
+                announcer?.announce(this.t('fileNotice', { name: file.name, message: this.messageText(file) }));
+            }
+        }
+        if (!(this.autoUpload() ?? this.defaults.autoUpload))
+            return;
+        for (const file of outcome.files) {
+            if (file.status !== 'ready' || file.file === undefined)
+                continue;
+            this.runner?.enqueue(file.key, file.file);
+        }
+    }
+    onPicked(event) {
+        const element = event.target;
+        void this.take([...(element.files ?? [])], 'select', event);
+        /* Emptied so that choosing the same file twice is two selections rather
+           than one silent nothing. */
+        element.value = '';
+    }
+    /* ── The drag ───────────────────────────────────────────────────────── */
+    judge(transferred) {
+        const items = [...(transferred?.items ?? [])].filter((item) => item.kind === 'file');
+        const max = this.maxFiles();
+        if (items.length === 0)
+            return 'invalid';
+        if (!this.multiple() && items.length > 1)
+            return 'invalid';
+        if (max !== undefined && items.length > max)
+            return 'invalid';
+        const accept = this.accept();
+        if (accept === undefined || accept.trim() === '')
+            return 'target';
+        return items.some((item) => item.type !== '' && !matchesTypeOnly(item.type, accept))
+            ? 'invalid'
+            : 'target';
+    }
+    onDragEnter(event) {
+        if (!(this.allowDrop() ?? this.defaults.allowDrop) || !this.accepting())
+            return;
+        /*
+         * `dragenter` and `dragleave` fire for every element the pointer crosses, so
+         * a drag moving onto a child fires `dragleave` on the region. Clearing the
+         * state there makes the highlight flicker across the whole zone.
+         */
+        this.depth += 1;
+        this.dragging.set(true);
+        this.verdict.set(this.judge(event.dataTransfer));
+    }
+    onDragLeave() {
+        if (!(this.allowDrop() ?? this.defaults.allowDrop) || !this.accepting())
+            return;
+        this.depth -= 1;
+        if (this.depth > 0)
+            return;
+        this.depth = 0;
+        this.dragging.set(false);
+        this.verdict.set(null);
+    }
+    onDragOver(event) {
+        if (!(this.allowDrop() ?? this.defaults.allowDrop) || !this.accepting())
+            return;
+        /* The default action of `dragover` is to refuse the drop. */
+        event.preventDefault();
+    }
+    onDrop(event) {
+        if (!(this.allowDrop() ?? this.defaults.allowDrop) || !this.accepting())
+            return;
+        event.preventDefault();
+        this.depth = 0;
+        this.dragging.set(false);
+        this.verdict.set(null);
+        void this.take([...(event.dataTransfer?.files ?? [])], 'pointer', event);
+    }
+    onPaste(event) {
+        if (!(this.allowPaste() ?? this.defaults.allowPaste) || !this.accepting())
+            return;
+        const pasted = [...(event.clipboardData?.files ?? [])];
+        if (pasted.length > 0)
+            void this.take(pasted, 'keyboard', event);
+    }
+    onZoneClick(event) {
+        if (!(this.clickToBrowse() ?? this.defaults.clickToBrowse) || !this.accepting())
+            return;
+        if (event.target.closest('[data-part="trigger"]'))
+            return;
+        this.host.querySelector('[data-part="trigger"]')?.click();
+    }
+    /* ── One row ────────────────────────────────────────────────────────── */
+    stem(file) {
+        return splitName(file.name).stem;
+    }
+    extension(file) {
+        return splitName(file.name).extension;
+    }
+    extensionLabel(file) {
+        const extension = splitName(file.name).extension;
+        return extension === '' ? this.t('noExtension') : extension.slice(1).toUpperCase();
+    }
+    url(file) {
+        return this.urls().get(file.key);
+    }
+    openable(file) {
+        return this.resolvedView() !== 'none' && this.url(file) !== undefined && isViewable(file);
+    }
+    showBar(file) {
+        return ['uploading', 'paused', 'stalled'].includes(file.status);
+    }
+    percent(file) {
+        return file.total !== undefined && file.total > 0 ? (file.loaded / file.total) * 100 : null;
+    }
+    statusText(file) {
+        const word = this.t(file.status);
+        const percent = this.percent(file);
+        return this.showBar(file) && percent !== null ? `${word} · ${Math.round(percent)}%` : word;
+    }
+    /** The status word for a failure; for a refusal, the catalog's sentence for its reason. */
+    messageText(file) {
+        if (file.status !== 'rejected')
+            return this.t('error');
+        return file.reason === 'size'
+            ? this.t('rejection.size', { size: this.formatters().bytes(file.size) })
+            : this.t(`rejection.${file.reason ?? 'custom'}`);
+    }
+    actions(file) {
+        if (this.readOnly())
+            return [];
+        /* The control's name is the action's message holding the file's name, so a
+           language writes its own order. */
+        const named = { name: file.name };
+        /* Five marks chosen against each other, because they appear together on one
+           row: a cross means *stop this* and a bin means *take it away*. */
+        const start = {
+            part: 'start',
+            glyph: 'play',
+            label: this.t('start', named),
+            action: 'start',
+        };
+        const resume = {
+            part: 'start',
+            glyph: 'play',
+            label: this.t('resume', named),
+            action: 'resume',
+        };
+        const pause = {
+            part: 'pause',
+            glyph: 'pause',
+            label: this.t('pause', named),
+            action: 'pause',
+        };
+        const retry = {
+            part: 'retry',
+            glyph: 'rotate-ccw',
+            label: this.t('retry', named),
+            action: 'retry',
+        };
+        const cancel = {
+            part: 'cancel',
+            glyph: 'x',
+            label: this.t('cancel', named),
+            action: 'cancel',
+        };
+        const remove = {
+            part: 'remove',
+            glyph: 'trash',
+            label: this.t('remove', named),
+            action: 'remove',
+        };
+        switch (file.status) {
+            case 'ready':
+                return [start, remove];
+            case 'queued':
+                return [cancel, remove];
+            case 'uploading':
+                return this.pausable() ? [pause, cancel] : [cancel];
+            case 'paused':
+                return [resume, cancel];
+            case 'stalled':
+                return [cancel];
+            case 'error':
+                return [retry, remove];
+            case 'canceled':
+                return [start, remove];
+            default:
+                return [remove];
+        }
+    }
+    act(file, action, source) {
+        if (action === 'remove') {
+            this.runner?.remove(file.key);
+            this.request(this.files().filter((entry) => entry.key !== file.key), 'remove', source);
+            if (this.viewing() === file.key)
+                this.setViewing(null, 'dismiss', source);
+            this.onTouchedFn();
+            return;
+        }
+        if (file.file === undefined || this.runner === null)
+            return;
+        if (action === 'start' || action === 'retry')
+            this.runner.start(file.key, file.file);
+        else if (action === 'pause')
+            this.runner.pause(file.key);
+        else if (action === 'resume')
+            this.runner.resume(file.key);
+        else
+            this.runner.cancel(file.key);
+    }
+    clear(source) {
+        for (const file of this.files())
+            this.runner?.remove(file.key);
+        this.request([], 'clear', source);
+    }
+    open(file, source) {
+        this.setViewing(file.key, 'pointer', source);
+    }
+    setViewing(key, reason, source) {
+        const state = createControllable({
+            controlled: undefined,
+            initial: this.viewing(),
+            onRequest: (change) => this.viewingRequest.emit(change),
+        });
+        state.request(key, reason, source);
+        this.viewing.set(key);
+    }
+    /* ── The five a template cannot write ───────────────────────────────── */
+    browse() {
+        this.host.querySelector('[data-part="input"]')?.click();
+    }
+    upload() {
+        for (const file of this.files()) {
+            if (file.status !== 'ready' || file.file === undefined)
+                continue;
+            this.runner?.start(file.key, file.file);
+        }
+    }
+    retryAll() {
+        for (const file of this.files()) {
+            if (file.status !== 'error' || file.file === undefined)
+                continue;
+            this.runner?.start(file.key, file.file);
+        }
+    }
+    cancelAll() {
+        for (const file of this.files())
+            this.runner?.cancel(file.key);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlUpload, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SlUpload, isStandalone: true, selector: "div[slUpload]", inputs: { files: { classPropertyName: "files", publicName: "files", isSignal: true, isRequired: false, transformFunction: null }, viewing: { classPropertyName: "viewing", publicName: "viewing", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, directory: { classPropertyName: "directory", publicName: "directory", isSignal: true, isRequired: false, transformFunction: null }, capture: { classPropertyName: "capture", publicName: "capture", isSignal: true, isRequired: false, transformFunction: null }, maxFiles: { classPropertyName: "maxFiles", publicName: "maxFiles", isSignal: true, isRequired: false, transformFunction: null }, minFiles: { classPropertyName: "minFiles", publicName: "minFiles", isSignal: true, isRequired: false, transformFunction: null }, maxSize: { classPropertyName: "maxSize", publicName: "maxSize", isSignal: true, isRequired: false, transformFunction: null }, minSize: { classPropertyName: "minSize", publicName: "minSize", isSignal: true, isRequired: false, transformFunction: null }, maxTotalSize: { classPropertyName: "maxTotalSize", publicName: "maxTotalSize", isSignal: true, isRequired: false, transformFunction: null }, fileValidator: { classPropertyName: "fileValidator", publicName: "validate", isSignal: true, isRequired: false, transformFunction: null }, transform: { classPropertyName: "transform", publicName: "transform", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, layout: { classPropertyName: "layout", publicName: "layout", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, preview: { classPropertyName: "preview", publicName: "preview", isSignal: true, isRequired: false, transformFunction: null }, view: { classPropertyName: "view", publicName: "view", isSignal: true, isRequired: false, transformFunction: null }, duplicates: { classPropertyName: "duplicates", publicName: "duplicates", isSignal: true, isRequired: false, transformFunction: null }, clickToBrowse: { classPropertyName: "clickToBrowse", publicName: "clickToBrowse", isSignal: true, isRequired: false, transformFunction: null }, allowDrop: { classPropertyName: "allowDrop", publicName: "allowDrop", isSignal: true, isRequired: false, transformFunction: null }, allowPaste: { classPropertyName: "allowPaste", publicName: "allowPaste", isSignal: true, isRequired: false, transformFunction: null }, preventDocumentDrop: { classPropertyName: "preventDocumentDrop", publicName: "preventDocumentDrop", isSignal: true, isRequired: false, transformFunction: null }, autoUpload: { classPropertyName: "autoUpload", publicName: "autoUpload", isSignal: true, isRequired: false, transformFunction: null }, pendingBlocksSubmit: { classPropertyName: "pendingBlocksSubmit", publicName: "pendingBlocksSubmit", isSignal: true, isRequired: false, transformFunction: null }, adapter: { classPropertyName: "adapter", publicName: "adapter", isSignal: true, isRequired: false, transformFunction: null }, concurrency: { classPropertyName: "concurrency", publicName: "concurrency", isSignal: true, isRequired: false, transformFunction: null }, retries: { classPropertyName: "retries", publicName: "retries", isSignal: true, isRequired: false, transformFunction: null }, retryDelay: { classPropertyName: "retryDelay", publicName: "retryDelay", isSignal: true, isRequired: false, transformFunction: null }, stallAfter: { classPropertyName: "stallAfter", publicName: "stallAfter", isSignal: true, isRequired: false, transformFunction: null }, maxRows: { classPropertyName: "maxRows", publicName: "maxRows", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, fileKey: { classPropertyName: "fileKey", publicName: "fileKey", isSignal: true, isRequired: false, transformFunction: null }, messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { files: "filesChange", viewing: "viewingChange", filesChange2: "filesRequest", viewingRequest: "viewingRequest", reject: "reject" }, host: { attributes: { "data-ui": "upload", "data-part": "root" }, properties: { "attr.data-variant": "resolvedVariant()", "attr.data-layout": "resolvedLayout()", "attr.data-size": "resolvedSize()", "attr.data-disabled": "resolvedDisabled() ? '' : null", "attr.data-readonly": "readOnly() ? '' : null", "attr.data-invalid": "invalid() ? '' : null", "attr.data-required": "required() ? '' : null", "attr.data-loading": "summary().pending ? '' : null", "attr.data-complete": "summary().complete ? '' : null", "attr.data-dragging": "dragging() || documentDrag() ? '' : null" } }, providers: [
+            { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SlUpload), multi: true },
+            { provide: NG_VALIDATORS, useExisting: forwardRef(() => SlUpload), multi: true },
+        ], exportAs: ["slUpload"], ngImport: i0, template: `
+    @if (label() && !insideField()) {
+      <span data-part="label">{{ label() }}</span>
+    }
+    @if (description() && !insideField()) {
+      <p [id]="descriptionId" data-part="description">{{ description() }}</p>
+    }
+
+    @if (resolvedVariant() === 'button') {
+      <ng-container [ngTemplateOutlet]="triggerTemplate" />
+    } @else {
+      <div
+        (dragenter)="onDragEnter($event)"
+        (dragleave)="onDragLeave()"
+        (dragover)="onDragOver($event)"
+        (drop)="onDrop($event)"
+        (paste)="onPaste($event)"
+        (click)="onZoneClick($event)"
+        [attr.data-drop-target]="verdict() === 'target' ? '' : null"
+        [attr.data-drop-invalid]="verdict() === 'invalid' ? '' : null"
+        [attr.data-browsable]="browsable() ? '' : null"
+        data-part="dropzone"
+      >
+        <!-- The region carries the mark, so the trigger inside it does not. -->
+        @if (resolvedVariant() === 'dropzone') {
+          <span slIcon><svg slGlyph name="upload"></svg></span>
+          {{ t('dropzone') }}
+        }
+        <ng-container [ngTemplateOutlet]="triggerTemplate" />
+        @if (resolvedVariant() === 'field') {
+          <span data-part="meta">{{ fieldSummary() }}</span>
+        }
+      </div>
+    }
+
+    @if (files().length > 1) {
+      <div data-part="summary">
+        <span>{{ summaryText() }}</span>
+        @if (!readOnly()) {
+          <button (click)="clear($event)" data-part="clear" type="button">
+            {{ t('clear') }}
+          </button>
+        }
+      </div>
+    }
+
+    @if (showList()) {
+      <ul [style.--slotted-upload-visible-rows]="visibleRows()" data-part="list">
+        @for (file of files(); track file.key) {
+          <li [attr.data-status]="file.status" data-part="item">
+            @if (resolvedPreview() !== 'none' || resolvedLayout() === 'grid') {
+              <span
+                [attr.data-extension]="extensionLabel(file)"
+                [attr.data-kind]="file.kind"
+                data-part="preview"
+              >
+                @if (url(file) && file.type.startsWith('image/')) {
+                  <img [src]="url(file)" alt="" />
+                } @else {
+                  <span slIcon><svg slGlyph [name]="kindGlyph[file.kind]"></svg></span>
+                }
+              </span>
+            }
+
+            <div data-part="body">
+              @if (openable(file)) {
+                <button (click)="open(file, $event)" data-part="filename" dir="auto" type="button">
+                  <span data-part="name">{{ stem(file) }}</span>
+                  @if (extension(file)) {
+                    <span data-part="extension">{{ extension(file) }}</span>
+                  }
+                </button>
+              } @else {
+                <span data-part="filename" dir="auto">
+                  <span data-part="name">{{ stem(file) }}</span>
+                  @if (extension(file)) {
+                    <span data-part="extension">{{ extension(file) }}</span>
+                  }
+                </span>
+              }
+              <div data-part="detail">
+                <span data-part="meta">{{ formatters().bytes(file.size) }}</span>
+                <span data-part="status">{{ statusText(file) }}</span>
+              </div>
+            </div>
+
+            <span data-part="actions">
+              @for (action of actions(file); track action.part) {
+                <button
+                  (click)="act(file, action.action, $event)"
+                  [attr.aria-label]="action.label"
+                  [attr.data-part]="action.part"
+                  type="button"
+                >
+                  <span slIcon><svg slGlyph [name]="action.glyph"></svg></span>
+                </button>
+              }
+            </span>
+
+            @if (showBar(file)) {
+              <div data-part="progress">
+                <div
+                  [tone]="file.status === 'uploading' ? 'accent' : 'warning'"
+                  [value]="percent(file)"
+                  decorative
+                  size="sm"
+                  slProgressBar
+                ></div>
+              </div>
+            }
+
+            @if (file.status === 'rejected' || file.status === 'error') {
+              <p data-part="message">{{ messageText(file) }}</p>
+            }
+          </li>
+        }
+      </ul>
+    }
+
+    <ng-content />
+
+    <div
+      (viewingChange)="setViewing($event.key, $event.reason, $event.source)"
+      [files]="files()"
+      [locale]="resolvedLocale()"
+      [messages]="messages()"
+      [size]="resolvedSize()"
+      [urls]="urls()"
+      [viewing]="resolvedView() === 'none' ? null : viewing()"
+      slUploadViewer
+    ></div>
+
+    <ng-template #triggerTemplate>
+      <label #trigger data-part="trigger">
+        @if (resolvedVariant() !== 'dropzone') {
+          <span slIcon><svg slGlyph name="upload"></svg></span>
+        }
+        <input
+          #control
+          (change)="onPicked($event)"
+          [attr.accept]="accept() ?? null"
+          [attr.aria-describedby]="describedBy()"
+          [attr.capture]="capture() ?? null"
+          [attr.disabled]="resolvedDisabled() ? '' : null"
+          [attr.id]="controlId"
+          [attr.multiple]="multiple() ? '' : null"
+          [attr.name]="name() ?? null"
+          [attr.required]="required() ? '' : null"
+          [attr.webkitdirectory]="directory() ? '' : null"
+          data-part="input"
+          type="file"
+        />
+        {{ t('trigger') }}
+      </label>
+    </ng-template>
+  `, isInline: true, styles: ["@layer slotted.components{[data-ui=upload][data-part=root],[data-ui=upload][data-part=viewer]{--_font-size: var(--slotted-control-font-size-md, 13px);--_glyph-size: var(--slotted-control-icon-size-md, 16px);--_inner-size: var(--slotted-control-inner-size-md, 24px);--_control-height: var(--slotted-control-height-md, 34px);--_control-inset: var(--slotted-control-padding-inline-md, 13px);--_gap: var(--slotted-control-gap-md, 8px);--_preview-size: var(--slotted-upload-preview-size, calc(2 * var(--_glyph-size)));--_state-hover: color-mix( in oklab, currentcolor var(--slotted-upload-state-layer-hover, 8%), transparent );--_state-active: color-mix( in oklab, currentcolor var(--slotted-upload-state-layer-active, 14%), transparent );--_section-gap: var(--slotted-upload-section-gap, var(--slotted-space-5, .75rem));--_item-gap: var(--slotted-upload-item-gap, var(--slotted-space-4, .5rem));--_line-gap: var(--slotted-upload-line-gap, var(--slotted-space-1, .125rem));--_item-inset-block: var(--slotted-upload-item-padding-block, var(--slotted-space-4, .5rem));--_item-inset-inline: var( --slotted-upload-item-padding-inline, var(--slotted-space-5, .75rem) );--_radius: var(--slotted-upload-radius, var(--slotted-radius-md, 6px));--_item-radius: var(--slotted-upload-item-radius, var(--slotted-radius-md, 6px));--_border-width: var(--slotted-upload-border-width, var(--slotted-border-width-thin, 1px));--_zone-inset-block: var(--slotted-upload-zone-padding-block, var(--slotted-space-9, 2rem));--_zone-inset-inline: var(--slotted-upload-zone-padding-inline, var(--slotted-space-6, 1rem));--_zone-border-width: var( --slotted-upload-zone-border-width, var(--slotted-border-width-medium, 1.5px) );--_zone-edge: var(--slotted-upload-zone-border-color, var(--slotted-border-strong));--_zone-ground: var(--slotted-upload-zone-background, var(--slotted-surface-sunken));--_zone-glyph-size: var(--slotted-upload-zone-icon-size, calc(1.5 * var(--_glyph-size)));--_action-glyph-size: max(var(--slotted-upload-icon-size-min, 14px), var(--_glyph-size));--_action-size: var( --slotted-upload-action-size, max( var(--slotted-target-min, 24px), min( calc(var(--_action-glyph-size) + 2 * var(--slotted-space-2, .25rem)), var(--_inner-size) ) ) );--_status-text: var(--slotted-text-muted);--_item-surface: var(--slotted-upload-item-background, var(--slotted-surface));--_item-border: var(--slotted-upload-item-border-color, var(--slotted-border-subtle));--_kind-tile: var(--slotted-upload-kind-other);--_leading: round(up, calc(1em * var(--slotted-line-height-md, 1.5)), 1px);color:var(--slotted-text);font-family:var(--slotted-upload-font-family, var(--slotted-control-font-family));font-size:var(--_font-size);line-height:var(--_leading)}[data-ui=upload][data-part=root]{container-name:slotted-upload;container-type:inline-size;inline-size:100%;display:flex;flex-direction:column;gap:var(--_section-gap)}[data-ui=upload][data-size=sm]{--_font-size: var(--slotted-control-font-size-sm, 12px);--_glyph-size: var(--slotted-control-icon-size-sm, 14px);--_inner-size: var(--slotted-control-inner-size-sm, 22px);--_control-height: var(--slotted-control-height-sm, 30px);--_control-inset: var(--slotted-control-padding-inline-sm, 10px);--_gap: var(--slotted-control-gap-sm, 6px)}[data-ui=upload][data-size=lg]{--_font-size: var(--slotted-control-font-size-lg, 14px);--_glyph-size: var(--slotted-control-icon-size-lg, 18px);--_inner-size: var(--slotted-control-inner-size-lg, 28px);--_control-height: var(--slotted-control-height-lg, 38px);--_control-inset: var(--slotted-control-padding-inline-lg, 16px);--_gap: var(--slotted-control-gap-lg, 8px)}[data-ui=upload] [data-part=label]{color:var(--slotted-text);flex:none;font-weight:var(--slotted-upload-label-font-weight, var(--slotted-font-weight-medium, 500))}[data-ui=upload] [data-part=description]{color:var(--slotted-text-muted);flex:none;margin:0}[data-ui=upload] [data-part=dropzone]{--_zone-border-color: var(--_zone-edge);--_zone-surface: var(--_zone-ground);align-items:center;background-color:var(--_zone-surface);border:var(--_zone-border-width) dashed var(--_zone-border-color);border-radius:var(--_radius);display:flex;flex:none;flex-direction:column;gap:var(--_gap);padding-block:var(--_zone-inset-block);padding-inline:var(--_zone-inset-inline);text-align:center;transition:background-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),border-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing)}[data-ui=upload] [data-part=dropzone]>[data-ui=icon]{--slotted-icon-size: var(--_zone-glyph-size);color:var(--slotted-text-muted)}[data-ui=upload] [data-part=dropzone][data-drop-target]{--_zone-border-color: var(--slotted-tone-accent-border);--_zone-surface: var(--slotted-tone-accent-surface)}[data-ui=upload] [data-part=dropzone][data-drop-invalid]{--_zone-border-color: var(--slotted-tone-danger-border);--_zone-surface: var(--slotted-tone-danger-surface)}[data-ui=upload] [data-part=dropzone][data-browsable]{cursor:pointer}[data-ui=upload]:not([data-disabled]) [data-part=dropzone][data-browsable]:not([data-drop-target],[data-drop-invalid]):hover{--_zone-surface: color-mix( in oklab, var(--slotted-text) var(--slotted-upload-zone-state-layer-hover, 4%), var(--_zone-ground) )}[data-ui=upload]:not([data-disabled]) [data-part=dropzone][data-browsable]:not([data-drop-target],[data-drop-invalid]):active{--_zone-surface: color-mix( in oklab, var(--slotted-text) var(--slotted-upload-zone-state-layer-active, 8%), var(--_zone-ground) )}[data-ui=upload]:not([data-disabled],[data-invalid]) [data-part=dropzone][data-browsable]:not([data-drop-target],[data-drop-invalid]):is(:hover,:active){--_zone-border-color: var(--slotted-text-muted)}[data-ui=upload]:not([data-disabled]) [data-part=dropzone][data-browsable]:not([data-drop-target],[data-drop-invalid]):has([data-part=trigger]:hover){--_zone-border-color: var(--_zone-edge);--_zone-surface: var(--_zone-ground)}[data-ui=upload][data-disabled][data-part=root]{--_zone-edge: var(--slotted-disabled-border);--_zone-ground: var(--slotted-disabled-background)}[data-ui=upload][data-disabled] [data-part=dropzone]{color:var(--slotted-disabled-foreground)}[data-ui=upload][data-invalid][data-part=root]{--_zone-edge: var(--slotted-tone-danger-border)}[data-ui=upload] [data-part=trigger]{align-items:center;background-color:var(--slotted-upload-trigger-background, var(--slotted-surface));block-size:var(--_control-height);border:var(--slotted-control-border-width, 1px) solid var(--slotted-control-border-color);border-radius:var(--slotted-control-radius, 4px);box-shadow:var(--slotted-control-shadow);color:var(--slotted-text);cursor:pointer;display:inline-flex;flex:none;font:inherit;font-weight:var(--slotted-control-font-weight, 600);gap:var(--_gap);justify-content:center;padding-inline:var(--_control-inset);position:relative;transition:background-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),border-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),translate var(--slotted-duration-instant) var(--slotted-control-transition-easing);white-space:nowrap}[data-ui=upload] [data-part=trigger]>[data-ui=icon]{--slotted-icon-size: var(--_glyph-size)}[data-ui=upload]:not([data-disabled]) [data-part=trigger]:hover{background-color:var(--slotted-tone-secondary-subtle-hover)}[data-ui=upload]:not([data-disabled]) [data-part=trigger]:active{background-color:var(--slotted-tone-secondary-subtle-active);translate:0 var(--slotted-border-width-thin, 1px)}[data-ui=upload][data-disabled] [data-part=trigger]{background-color:var(--slotted-disabled-background);border-color:var(--slotted-disabled-border);box-shadow:none;color:var(--slotted-disabled-foreground);cursor:default}[data-ui=upload] [data-part=trigger]:has(:focus-visible){outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}[data-ui=upload][data-invalid] [data-part=trigger]{--slotted-focus-ring-color: var(--slotted-focus-ring-color-invalid);border-color:var(--slotted-tone-danger-border);--_invalid-edge-width: var(--slotted-control-invalid-edge-width, 1px);box-shadow:inset 0 0 0 var(--_invalid-edge-width) var(--slotted-tone-danger-border)}[data-ui=upload] [data-part=input]{block-size:1px;border:0;clip-path:inset(50%);inline-size:1px;inset-block-start:50%;inset-inline-start:50%;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap}[data-ui=upload] [data-part=input]:focus-visible{outline:none}[data-ui=upload] [data-part=summary]{align-items:center;color:var(--slotted-text-muted);display:flex;flex:none;gap:var(--_gap);justify-content:space-between}[data-ui=upload] [data-part=clear]{appearance:none;flex:none;white-space:nowrap;background-color:transparent;border:0;border-radius:var(--slotted-control-radius, 4px);color:inherit;cursor:pointer;font:inherit;padding-block:var(--slotted-space-1, .125rem);padding-inline:var(--slotted-space-3, .375rem);text-decoration-line:underline;text-underline-offset:.2em;transition:background-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing)}[data-ui=upload] [data-part=clear]:enabled:hover{background-color:var(--_state-hover)}[data-ui=upload] [data-part=clear]:enabled:active{background-color:var(--_state-active)}[data-ui=upload] [data-part=clear]:disabled{color:var(--slotted-disabled-foreground);cursor:default}[data-ui=upload] [data-part=clear]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}[data-ui=upload] [data-part=list]{--_row-block-size: calc( max(var(--_preview-size), 2lh) + 2 * var(--_item-inset-block) + 2 * var(--_border-width) + var(--_item-gap) );display:flex;flex-direction:column;gap:var(--_item-gap);list-style:none;margin:0;flex:1 1 auto;min-block-size:var(--_row-block-size);max-block-size:calc(var(--slotted-upload-visible-rows, 6) * var(--_row-block-size));overflow-y:auto;padding:0}[data-ui=upload] [data-part=item]{align-items:center;flex:none;background-color:var(--_item-surface);border:var(--_border-width) solid var(--_item-border);border-radius:var(--_item-radius);column-gap:var(--_gap);display:grid;grid-template-areas:\"preview body actions\" \"message message message\";grid-template-columns:auto minmax(0,1fr) auto;overflow:hidden;padding-block:var(--_item-inset-block);padding-inline:var(--_item-inset-inline);position:relative;row-gap:var(--_line-gap);transition:background-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),border-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),opacity var(--slotted-duration-medium) var(--slotted-easing-enter),translate var(--slotted-duration-medium) var(--slotted-easing-enter)}@starting-style{[data-ui=upload] [data-part=item]{opacity:0;translate:0 calc(-1 * var(--slotted-space-2, .25rem))}}[data-ui=upload] [data-part=item][data-status=success]{--_status-text: var(--slotted-tone-success-text)}[data-ui=upload] [data-part=item][data-status=ready]{border-style:dashed}[data-ui=upload] [data-part=item][data-status=paused],[data-ui=upload] [data-part=item][data-status=stalled]{--_status-text: var(--slotted-tone-warning-text)}[data-ui=upload] [data-part=item][data-status=rejected],[data-ui=upload] [data-part=item][data-status=error]{--_status-text: var(--slotted-tone-danger-text);--_item-surface: var(--slotted-tone-danger-surface);--_item-border: var(--slotted-tone-danger-border)}[data-ui=upload] [data-part=item][data-status=canceled]{--_status-text: var(--slotted-text-muted)}[data-ui=upload][data-disabled] [data-part=item]{color:var(--slotted-disabled-foreground)}[data-ui=upload] [data-part=preview]{align-items:center;background-color:var(--_kind-tile);block-size:var(--_preview-size);border-radius:var(--slotted-upload-preview-radius, var(--slotted-radius-sm, 4px));color:var(--slotted-upload-kind-foreground);display:inline-flex;flex-direction:column;grid-area:preview;inline-size:var(--_preview-size);justify-content:center;overflow:hidden}[data-ui=upload] [data-part=preview]>img{block-size:100%;inline-size:100%;object-fit:cover}[data-ui=upload] [data-part=preview]>[data-ui=icon]{--slotted-icon-size: var(--_glyph-size)}[data-ui=upload] [data-part=preview][data-kind=pdf]{--_kind-tile: var(--slotted-upload-kind-pdf)}[data-ui=upload] [data-part=preview][data-kind=document]{--_kind-tile: var(--slotted-upload-kind-document)}[data-ui=upload] [data-part=preview][data-kind=spreadsheet]{--_kind-tile: var(--slotted-upload-kind-spreadsheet)}[data-ui=upload] [data-part=preview][data-kind=presentation]{--_kind-tile: var(--slotted-upload-kind-presentation)}[data-ui=upload] [data-part=preview][data-kind=image]{--_kind-tile: var(--slotted-upload-kind-image)}[data-ui=upload] [data-part=preview][data-kind=video]{--_kind-tile: var(--slotted-upload-kind-video)}[data-ui=upload] [data-part=preview][data-kind=audio]{--_kind-tile: var(--slotted-upload-kind-audio)}[data-ui=upload] [data-part=preview][data-kind=archive]{--_kind-tile: var(--slotted-upload-kind-archive)}[data-ui=upload] [data-part=item]>[data-part=body]{display:flex;flex-direction:column;gap:var(--_line-gap);grid-area:body;min-inline-size:0}[data-ui=upload] [data-part=filename]{display:flex;font-weight:var(--slotted-upload-name-font-weight, var(--slotted-font-weight-medium, 500));min-inline-size:0;unicode-bidi:isolate}[data-ui=upload] button[data-part=filename]{appearance:none;background:none;border:0;color:inherit;cursor:pointer;font-family:inherit;font-size:inherit;line-height:inherit;padding:0;text-align:start;transition:translate var(--slotted-duration-instant) var(--slotted-control-transition-easing)}[data-ui=upload] button[data-part=filename]:enabled:hover{text-decoration-line:underline;text-underline-offset:.2em}[data-ui=upload] button[data-part=filename]:enabled:active{text-decoration-line:underline;text-underline-offset:.2em;translate:0 var(--slotted-border-width-thin, 1px)}[data-ui=upload] button[data-part=filename]:focus-visible{border-radius:var(--slotted-control-radius, 4px);outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}[data-ui=upload][data-layout=grid] button[data-part=preview]{appearance:none;border:0;cursor:pointer;padding:0}[data-ui=upload] [data-part=name]{flex:0 1 auto;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[data-ui=upload] [data-part=extension]{flex:none}[data-ui=upload] [data-part=detail]{align-items:baseline;color:var(--slotted-text-muted);display:flex;flex-wrap:wrap;font-size:var(--slotted-font-size-xs, .75rem);line-height:var(--_leading);min-inline-size:0}[data-ui=upload] [data-part=meta]{font-variant-numeric:tabular-nums;white-space:nowrap}[data-ui=upload] [data-part=status]{color:var(--_status-text);font-weight:var(--slotted-upload-status-font-weight, var(--slotted-font-weight-medium, 500));min-inline-size:0}[data-ui=upload] [data-part=meta]:has(+[data-part=status]):after{color:var(--slotted-text-muted);content:\" \\b7\";margin-inline-end:.4em}[data-ui=upload] [data-part=message]{color:var(--_status-text);font-size:var(--slotted-font-size-xs, .75rem);line-height:var(--_leading);grid-area:message;margin:0}[data-ui=upload] [data-part=progress]{display:block;inset-block-end:0;inset-inline:0;position:absolute}[data-ui=upload] [data-part=actions]{display:inline-flex;gap:var(--slotted-space-1, .125rem);grid-area:actions;justify-content:flex-end}[data-ui=upload] [data-part=viewerExternal],[data-ui=upload] [data-part=viewerClose],[data-ui=upload] [data-part=start],[data-ui=upload] [data-part=pause],[data-ui=upload] [data-part=retry],[data-ui=upload] [data-part=cancel],[data-ui=upload] [data-part=remove]{align-items:center;appearance:none;background-color:transparent;block-size:var(--_action-size);border:0;border-radius:var(--slotted-upload-action-radius, var(--slotted-control-radius, 4px));color:inherit;cursor:pointer;display:inline-flex;flex:none;font:inherit;inline-size:var(--_action-size);justify-content:center;padding:0;transition:background-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing)}[data-ui=upload] [data-part=viewerExternal]>[data-ui=icon],[data-ui=upload] [data-part=viewerClose]>[data-ui=icon],[data-ui=upload] [data-part=start]>[data-ui=icon],[data-ui=upload] [data-part=pause]>[data-ui=icon],[data-ui=upload] [data-part=retry]>[data-ui=icon],[data-ui=upload] [data-part=cancel]>[data-ui=icon],[data-ui=upload] [data-part=remove]>[data-ui=icon]{--slotted-icon-size: var(--_action-glyph-size)}@media(pointer:coarse){[data-ui=upload] :is([data-part=viewerExternal],[data-part=viewerClose],[data-part=start],[data-part=pause],[data-part=retry],[data-part=cancel],[data-part=remove]){position:relative}[data-ui=upload] :is([data-part=viewerExternal],[data-part=viewerClose],[data-part=start],[data-part=pause],[data-part=retry],[data-part=cancel],[data-part=remove]):after{content:\"\";inset:min(0px,calc((100% - var(--slotted-target-comfortable, 44px)) / 2));position:absolute}[data-ui=upload] :is([data-part=viewerExternal],[data-part=start],[data-part=pause],[data-part=retry],[data-part=cancel]):has(+:is([data-part=viewerClose],[data-part=pause],[data-part=retry],[data-part=cancel],[data-part=remove]):not([hidden])):after{inset-inline-end:0}[data-ui=upload] :is([data-part=viewerExternal],[data-part=start],[data-part=pause],[data-part=retry],[data-part=cancel]):not([hidden])+:is([data-part=viewerClose],[data-part=pause],[data-part=retry],[data-part=cancel],[data-part=remove]):after{inset-inline-start:0}}[data-ui=upload] [data-part=viewerExternal]:enabled:hover,[data-ui=upload] [data-part=viewerClose]:enabled:hover,[data-ui=upload] [data-part=start]:enabled:hover,[data-ui=upload] [data-part=pause]:enabled:hover,[data-ui=upload] [data-part=retry]:enabled:hover,[data-ui=upload] [data-part=cancel]:enabled:hover,[data-ui=upload] [data-part=remove]:enabled:hover{background-color:var(--_state-hover)}[data-ui=upload] [data-part=viewerExternal]:enabled:active,[data-ui=upload] [data-part=viewerClose]:enabled:active,[data-ui=upload] [data-part=start]:enabled:active,[data-ui=upload] [data-part=pause]:enabled:active,[data-ui=upload] [data-part=retry]:enabled:active,[data-ui=upload] [data-part=cancel]:enabled:active,[data-ui=upload] [data-part=remove]:enabled:active{background-color:var(--_state-active)}[data-ui=upload] [data-part=viewerExternal]:disabled,[data-ui=upload] [data-part=viewerClose]:disabled,[data-ui=upload] [data-part=start]:disabled,[data-ui=upload] [data-part=pause]:disabled,[data-ui=upload] [data-part=retry]:disabled,[data-ui=upload] [data-part=cancel]:disabled,[data-ui=upload] [data-part=remove]:disabled{color:var(--slotted-disabled-foreground);cursor:default}[data-ui=upload] [data-part=viewerExternal]:focus-visible,[data-ui=upload] [data-part=viewerClose]:focus-visible,[data-ui=upload] [data-part=start]:focus-visible,[data-ui=upload] [data-part=pause]:focus-visible,[data-ui=upload] [data-part=retry]:focus-visible,[data-ui=upload] [data-part=cancel]:focus-visible,[data-ui=upload] [data-part=remove]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:calc(-1 * var(--slotted-focus-ring-width, 2px))}[data-ui=upload][data-part=viewer]{background-color:var(--slotted-surface);block-size:100%;display:grid;grid-row:1 / -1;grid-template-rows:auto minmax(0,1fr);inline-size:100%}[data-ui=upload] [data-part=viewerHeader]{align-items:center;border-block-end:var(--_border-width) solid var(--slotted-border-subtle);column-gap:var(--_gap);display:grid;grid-template-columns:minmax(0,1fr) auto;padding-block:var(--slotted-space-4, .5rem);padding-inline:var(--slotted-space-6, 1rem)}[data-ui=upload] [data-part=viewerTitle]{font-size:var(--slotted-font-size-md, .875rem);line-height:var(--_leading);font-weight:var(--slotted-font-weight-semibold, 600);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[data-ui=upload] [data-part=viewerMeta]{color:var(--slotted-text-muted);font-size:var(--slotted-font-size-xs, .75rem);line-height:var(--_leading)}[data-ui=upload] [data-part=viewerActions]{align-items:center;display:inline-flex;gap:var(--slotted-space-1, .125rem)}[data-ui=upload] [data-part=viewerStage]{background-color:var(--slotted-surface-sunken);display:grid;min-block-size:0;overflow:hidden;padding:var(--slotted-space-6, 1rem);place-items:center;position:relative}[data-ui=upload] [data-part=viewerStage]>img,[data-ui=upload] [data-part=viewerStage]>iframe{align-self:stretch;block-size:auto;inline-size:auto;justify-self:stretch;min-block-size:0;min-inline-size:0}[data-ui=upload] [data-part=viewerStage]>img{object-fit:contain}[data-ui=upload] [data-part=viewerStage]>iframe{background-color:var(--slotted-surface);border:0}[data-ui=upload] [data-part=viewerStage]>video,[data-ui=upload] [data-part=viewerStage]>audio{max-block-size:100%;max-inline-size:100%;min-block-size:0;min-inline-size:0}[data-ui=upload] [data-part=viewerStage]>[data-part=preview]{block-size:var(--slotted-upload-viewer-tile-size, 6rem);inline-size:var(--slotted-upload-viewer-tile-size, 6rem)}[data-ui=upload] [data-part=viewerStage]>[data-part=preview]>[data-ui=icon]{--slotted-icon-size: calc(3 * var(--_glyph-size))}[data-ui=upload] [data-part=viewerStage]>p{color:var(--slotted-text-muted);margin:0;max-inline-size:28ch;text-align:center}[data-ui=upload] [data-part=viewerStage]:has(>[data-part=preview]){align-items:center;display:flex;flex-direction:column;gap:var(--slotted-space-5, .75rem);justify-content:center}[data-ui=upload] [data-part=viewerPrevious],[data-ui=upload] [data-part=viewerNext]{align-items:center;appearance:none;background-color:color-mix(in oklab,var(--slotted-surface) var(--slotted-upload-viewer-control-opacity, 92%),transparent);block-size:var(--slotted-upload-viewer-control-size, 2.5rem);border:0;border-radius:var(--slotted-radius-full, 9999px);box-shadow:var(--slotted-shadow-sm);color:var(--slotted-text);cursor:pointer;display:inline-flex;inline-size:var(--slotted-upload-viewer-control-size, 2.5rem);justify-content:center;padding:0;position:absolute;transition:background-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),translate var(--slotted-duration-instant) var(--slotted-control-transition-easing)}[data-ui=upload] [data-part=viewerPrevious]{inset-inline-start:var(--slotted-space-5, .75rem)}[data-ui=upload] [data-part=viewerNext]{inset-inline-end:var(--slotted-space-5, .75rem)}[data-ui=upload] [data-part=viewerPrevious]>[data-ui=icon],[data-ui=upload] [data-part=viewerNext]>[data-ui=icon]{--slotted-icon-size: var(--_glyph-size)}[data-ui=upload] [data-part=viewerPrevious]>[data-ui=icon]{rotate:180deg}[data-ui=upload] [data-part=viewerPrevious]:enabled:hover,[data-ui=upload] [data-part=viewerNext]:enabled:hover{background-color:color-mix(in oklab,currentcolor var(--slotted-upload-state-layer-hover, 8%),var(--slotted-surface))}[data-ui=upload] [data-part=viewerPrevious]:enabled:active,[data-ui=upload] [data-part=viewerNext]:enabled:active{background-color:color-mix(in oklab,currentcolor var(--slotted-upload-state-layer-active, 14%),var(--slotted-surface));translate:0 var(--slotted-border-width-thin, 1px)}[data-ui=upload] [data-part=viewerPrevious]:disabled,[data-ui=upload] [data-part=viewerNext]:disabled{color:var(--slotted-disabled-foreground);cursor:default}[data-ui=upload] [data-part=viewerPrevious]:focus-visible,[data-ui=upload] [data-part=viewerNext]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}[data-ui=field] [data-ui=upload]>[data-part=label],[data-ui=field] [data-ui=upload]>[data-part=description],[data-ui=field] [data-ui=upload]>[data-part=message]{display:none}[data-ui=field] [data-ui=upload][data-part=root]{--_section-gap: var(--slotted-upload-field-section-gap, var(--slotted-space-4, .5rem))}[data-ui=upload][data-variant=button] [data-part=trigger]{align-self:start}[data-ui=upload][data-variant=field]:where([data-part=root]){--_zone-edge: var(--slotted-control-border-color);--_zone-ground: var(--slotted-control-surface, Field)}[data-ui=upload][data-variant=field] [data-part=dropzone]{align-items:center;border-style:solid;border-width:var(--slotted-control-border-width, 1px);flex-direction:row;gap:var(--_gap);padding-block:var(--slotted-space-2, .25rem);padding-inline:var(--slotted-space-2, .25rem);text-align:start}[data-ui=upload][data-layout=grid] [data-part=list]{display:grid;gap:var(--_gap);grid-template-columns:repeat(auto-fill,minmax(var(--slotted-upload-card-measure, 9rem),1fr))}[data-ui=upload][data-layout=grid] [data-part=item]{align-content:start;align-items:stretch;container-type:inline-size;grid-template-areas:\"preview\" \"body\" \"message\";grid-template-columns:minmax(0,1fr)}[data-ui=upload][data-layout=grid] [data-part=preview]{block-size:round(down,75cqi,1px);inline-size:100%}[data-ui=upload][data-layout=grid] [data-part=actions]{background-color:color-mix(in oklab,var(--slotted-surface) var(--slotted-upload-card-actions-opacity, 96%),transparent);border-radius:var(--_item-radius);box-shadow:var(--slotted-shadow-xs);inset-block-start:calc(var(--_item-inset-block) + var(--slotted-space-3, .375rem));inset-inline-end:calc(var(--_item-inset-inline) + var(--slotted-space-3, .375rem));margin-block-start:0;min-inline-size:0;padding:var(--slotted-space-1, .125rem);position:absolute}[data-ui=upload][data-layout=grid] [data-part=preview]:not(:has(img)):after{content:attr(data-extension);font-size:var(--slotted-font-size-sm, .8125rem);font-weight:var(--slotted-font-weight-semibold, 600);letter-spacing:.06em;margin-block-start:var(--slotted-space-3, .375rem);text-transform:uppercase}[data-ui=upload][data-layout=grid] [data-part=preview]>[data-ui=icon]{--slotted-icon-size: calc(2 * var(--_glyph-size))}@container slotted-upload (max-width: 30rem){[data-ui=upload] [data-part=summary]{align-items:start;flex-direction:column}}@container slotted-upload (max-width: 26rem){[data-ui=upload] [data-part=item]{grid-template-areas:\"preview body\" \"preview actions\" \"message message\";grid-template-columns:auto minmax(0,1fr)}[data-ui=upload] [data-part=preview]{align-self:start}[data-ui=upload] [data-part=actions]{justify-content:flex-start;margin-inline-start:calc(-1 * var(--slotted-space-2, .25rem))}[data-ui=upload] [data-part=dropzone]{padding-block:var(--slotted-space-6, 1rem)}}@media(forced-colors:active){[data-ui=upload] [data-part=item][data-status=rejected],[data-ui=upload] [data-part=item][data-status=error]{--_item-border: CanvasText}[data-ui=upload] [data-part=preview]{border:var(--_border-width) solid ButtonBorder}[data-ui=upload] [data-part=dropzone][data-drop-target],[data-ui=upload] [data-part=dropzone][data-drop-invalid]{--_zone-border-color: Highlight}[data-ui=upload] :is([data-part=clear],[data-part=viewerExternal],[data-part=viewerClose],[data-part=viewerPrevious],[data-part=viewerNext],[data-part=start],[data-part=pause],[data-part=retry],[data-part=cancel],[data-part=remove]):enabled:is(:hover,:active){background-color:Highlight;color:HighlightText}}@media(forced-colors:active){[data-ui=upload][data-invalid] [data-part=trigger]{outline:var(--_invalid-edge-width) solid CanvasText;outline-offset:calc(-1 * (var(--slotted-control-border-width, 1px) + var(--_invalid-edge-width)))}[data-ui=upload][data-invalid] [data-part=trigger]:has(:focus-visible){outline:calc(var(--slotted-focus-ring-width, 2px) + var(--_invalid-edge-width)) double var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}}}\n", "@property --slotted-progress-indicator-percent{syntax: \"<number>\"; inherits: true; initial-value: 0;}@property --slotted-progress-indicator-buffer-percent{syntax: \"<number>\"; inherits: true; initial-value: 0;}@property --slotted-progress-indicator-travel-start{syntax: \"<number>\"; inherits: true; initial-value: 0;}@property --slotted-progress-indicator-travel-size{syntax: \"<number>\"; inherits: true; initial-value: 100;}@property --slotted-progress-indicator-wave-phase{syntax: \"<number>\"; inherits: true; initial-value: 0;}@property --slotted-progress-indicator-wave-amplitude{syntax: \"<number>\"; inherits: true; initial-value: 1;}@layer slotted.components{[data-ui=progress-indicator][data-part=root]{--_ink: var(--slotted-progress-indicator-indicator-color, var(--slotted-tone-accent-text));--_track-color: var( --slotted-progress-indicator-track-color, color-mix(in oklab, var(--_ink) 24%, var(--slotted-surface)) );--_buffer-color: var(--slotted-progress-indicator-buffer-color, transparent);--_percent: var(--slotted-progress-indicator-percent, 0);--_buffer-percent: var(--slotted-progress-indicator-buffer-percent, 0);--_lead: max(var(--_percent), var(--_buffer-percent));--_font-size: var(--slotted-control-font-size-md, 13px);--_text-gap: var(--slotted-space-4, .5rem);--_row-gap: var(--slotted-space-3, .375rem);--_thickness: var(--slotted-progress-indicator-thickness, var(--slotted-space-2, .25rem));--_size: var(--slotted-progress-indicator-size, var(--slotted-control-height-md, 34px));--_radius: var(--slotted-progress-indicator-radius, var(--slotted-radius-full, 9999px));--_gap: var(--slotted-progress-indicator-gap, var(--_thickness));font-family:var(--slotted-control-font-family, sans-serif);font-size:var(--_font-size);line-height:var(--slotted-line-height-md, 1.5);min-inline-size:0;--_settle: calc(4 * var(--slotted-duration-long));--_spring: linear( 0, .078, .235, .401, .549, .669, .762, .831, .882, .918, .944, .962, .974, .982, .988, .992, .995, .996, .998, .998, 1 );transition:--slotted-progress-indicator-percent var(--_settle) var(--_spring),--slotted-progress-indicator-buffer-percent var(--_settle) var(--_spring)}[data-ui=progress-indicator][hidden]{display:none}[data-ui=progress-indicator][data-part=root][data-tone=secondary]{--_ink: var(--slotted-progress-indicator-indicator-color, var(--slotted-border-strong))}[data-ui=progress-indicator][data-part=root][data-tone=success]{--_ink: var(--slotted-progress-indicator-indicator-color, var(--slotted-tone-success-text))}[data-ui=progress-indicator][data-part=root][data-tone=warning]{--_ink: var(--slotted-progress-indicator-indicator-color, var(--slotted-tone-warning-text))}[data-ui=progress-indicator][data-part=root][data-tone=danger]{--_ink: var(--slotted-progress-indicator-indicator-color, var(--slotted-tone-danger-text))}[data-ui=progress-indicator][data-part=root][data-buffered]{--_buffer-color: var( --slotted-progress-indicator-buffer-color, color-mix(in oklab, var(--_ink) 52%, var(--slotted-surface)) )}[data-ui=progress-indicator][data-part=root][data-size=sm]{--_font-size: var(--slotted-control-font-size-sm, 12px);--_text-gap: var(--slotted-space-3, .375rem);--_thickness: var(--slotted-progress-indicator-thickness, var(--slotted-space-1, .125rem));--_size: var(--slotted-progress-indicator-size, var(--slotted-control-height-sm, 30px))}[data-ui=progress-indicator][data-part=root][data-size=lg]{--_font-size: var(--slotted-control-font-size-lg, 14px);--_row-gap: var(--slotted-space-4, .5rem);--_thickness: var(--slotted-progress-indicator-thickness, var(--slotted-space-4, .5rem));--_size: var(--slotted-progress-indicator-size, var(--slotted-control-height-lg, 38px))}[data-ui=progress-indicator] [data-part=label]{color:var(--slotted-text, CanvasText);min-inline-size:0;overflow-wrap:break-word}[data-ui=progress-indicator] [data-part=value]{color:var(--slotted-text-muted, GrayText);font-variant-numeric:tabular-nums;white-space:nowrap}[data-ui=progress-indicator][data-part=root][data-shape=linear]{align-items:baseline;column-gap:var(--_text-gap);display:grid;grid-template-columns:1fr auto;row-gap:var(--_row-gap)}[data-ui=progress-indicator][data-shape=linear]>[data-part=label]{grid-column:1}[data-ui=progress-indicator][data-shape=linear]>[data-part=value]{grid-column:2;justify-self:end}[data-ui=progress-indicator][data-shape=linear]>[data-part=track]{grid-column:1 / -1}[data-ui=progress-indicator][data-shape=linear] [data-part=track]{background-color:var(--_buffer-color);block-size:var(--_thickness);border-radius:var(--_radius);inline-size:100%;isolation:isolate;overflow-x:clip;overflow-y:visible;position:relative}[data-ui=progress-indicator][data-shape=linear] [data-part=track]:before{background-color:var(--_track-color);border-radius:inherit;content:\"\";inset-block:0;inset-inline-end:0;inset-inline-start:calc(1% * var(--_lead) + var(--_gap));position:absolute}[data-ui=progress-indicator][data-shape=linear] [data-part=track]:after{background-color:var(--_ink);border-radius:var(--slotted-radius-full, 9999px);content:\"\";inline-size:var(--_thickness);inset-block:0;inset-inline-end:0;position:absolute}[data-ui=progress-indicator][data-shape=linear] [data-part=indicator]{background-color:var(--_ink);block-size:100%;border-radius:inherit;inline-size:calc(1% * var(--_percent));position:relative}@container style(--slotted-progress-indicator-percent: 100){[data-ui=progress-indicator][data-shape=linear] [data-part=track]:before,[data-ui=progress-indicator][data-shape=linear] [data-part=track]:after{content:none}}[data-ui=progress-indicator][data-shape=linear][data-indeterminate] [data-part=track]:before{inset-inline-start:0}[data-ui=progress-indicator][data-shape=linear][data-indeterminate] [data-part=track]:after{content:none}[data-ui=progress-indicator][data-shape=linear][data-indeterminate] [data-part=indicator]{animation:slotted-progress-indicator-travel var(--slotted-duration-loop-slow) var(--slotted-easing-standard) infinite;inline-size:calc(1% * var(--slotted-progress-indicator-travel-size));inset-block:0;inset-inline-start:calc(1% * var(--slotted-progress-indicator-travel-start));position:absolute}@keyframes slotted-progress-indicator-travel{0%{--slotted-progress-indicator-travel-size: 14;--slotted-progress-indicator-travel-start: -14}45%{--slotted-progress-indicator-travel-size: 46}to{--slotted-progress-indicator-travel-size: 14;--slotted-progress-indicator-travel-start: 100}}[data-ui=progress-indicator][data-part=root][data-placement=page]{--_radius: var(--slotted-progress-indicator-radius, var(--slotted-radius-none, 0px));--_track-color: var(--slotted-progress-indicator-track-color, transparent);--_gap: var(--slotted-progress-indicator-gap, 0);inset-block-start:0;inset-inline:0;position:fixed;z-index:var(--slotted-z-index-sticky, 100)}[data-ui=progress-indicator][data-placement=page] [data-part=track]:after{content:none}[data-ui=progress-indicator][data-part=root]:is([data-placement=edge-start],[data-placement=edge-end]){--_radius: var(--slotted-progress-indicator-radius, var(--slotted-radius-none, 0px));--_track-color: var(--slotted-progress-indicator-track-color, transparent);--_gap: var(--slotted-progress-indicator-gap, 0);inset-inline:0;position:var(--slotted-progress-indicator-position, absolute)}[data-ui=progress-indicator][data-part=root][data-placement=edge-start]{inset-block-start:0}[data-ui=progress-indicator][data-part=root][data-placement=edge-end]{inset-block-end:0}[data-ui=progress-indicator]:is([data-placement=edge-start],[data-placement=edge-end]) [data-part=track]:after{content:none}[data-ui=progress-indicator][data-part=root]:is([data-placement=page],[data-placement=edge-start],[data-placement=edge-end]){--_withdrawn: inset(0 0 100% 0);clip-path:inset(0);transition:--slotted-progress-indicator-percent var(--_settle) var(--_spring),--slotted-progress-indicator-buffer-percent var(--_settle) var(--_spring),clip-path var(--slotted-duration-medium) var(--slotted-easing-enter),opacity var(--slotted-duration-medium) var(--slotted-easing-enter)}@starting-style{[data-ui=progress-indicator][data-part=root]:is([data-placement=page],[data-placement=edge-start],[data-placement=edge-end]){clip-path:var(--_withdrawn);opacity:0}}[data-ui=progress-indicator][data-part=root][data-placement=edge-end]{--_withdrawn: inset(100% 0 0 0)}[data-ui=progress-indicator][data-part=root]:is([data-placement=page],[data-placement=edge-start],[data-placement=edge-end])[hidden]{clip-path:var(--_withdrawn);opacity:0;transition:clip-path var(--slotted-duration-short) var(--slotted-easing-exit),opacity var(--slotted-duration-short) var(--slotted-easing-exit),display var(--slotted-duration-short) allow-discrete}[data-ui=progress-indicator][data-part=root][data-shape=circular],[data-ui=progress-indicator][data-part=root][data-shape=morph]{align-items:center;column-gap:var(--_text-gap);display:inline-flex}[data-ui=progress-indicator][data-shape=circular] svg{--_stroke: var(--slotted-progress-indicator-stroke, 6);block-size:var(--_size);flex:none;inline-size:var(--_size);rotate:-90deg}[data-ui=progress-indicator][data-shape=circular] [data-part=track],[data-ui=progress-indicator][data-shape=circular] [data-part=indicator]{fill:none;stroke-linecap:round;stroke-width:var(--_stroke)}[data-ui=progress-indicator][data-shape=circular] [data-part=indicator]{stroke:var(--_ink);stroke-dasharray:var(--_percent) 100;stroke-opacity:clamp(0,calc(var(--_percent) * 1000),1)}[data-ui=progress-indicator][data-shape=circular] [data-part=track]{--_arc-gap: calc(3.2*clamp(0, calc(var(--_percent) * 1000), 1)) ;stroke:var(--_track-color);stroke-dasharray:calc(100 - var(--_percent) - 2 * var(--_arc-gap)) 100;stroke-dashoffset:calc(-1 * (var(--_percent) + var(--_arc-gap)))}@container style(--slotted-progress-indicator-percent: 100){[data-ui=progress-indicator][data-shape=circular] [data-part=track]{stroke:transparent}}[data-ui=progress-indicator][data-shape=circular][data-indeterminate] [data-part=track]{stroke:transparent}[data-ui=progress-indicator][data-shape=circular][data-indeterminate] svg{animation:slotted-progress-indicator-turn var(--slotted-duration-loop) linear infinite}[data-ui=progress-indicator][data-shape=circular][data-indeterminate] [data-part=indicator]{animation:slotted-progress-indicator-sweep var(--slotted-duration-loop-slow) var(--slotted-easing-standard) infinite;stroke-opacity:1;transition:none}@keyframes slotted-progress-indicator-turn{0%{rotate:-90deg}to{rotate:270deg}}@keyframes slotted-progress-indicator-sweep{0%{stroke-dasharray:4 100;stroke-dashoffset:0}50%{stroke-dasharray:62 100;stroke-dashoffset:-18}to{stroke-dasharray:4 100;stroke-dashoffset:-100}}[data-ui=progress-indicator][data-part=root][data-wave]{--slotted-progress-indicator-wave-amplitude: min( clamp(0, calc((var(--_percent) - 6) / 10), 1), clamp(0, calc((96 - var(--_percent)) / 12), 1) );animation:slotted-progress-indicator-wave var(--slotted-duration-loop) linear infinite}[data-ui=progress-indicator][data-part=root][data-wave][data-indeterminate]{--slotted-progress-indicator-wave-amplitude: 1}@keyframes slotted-progress-indicator-wave{0%{--slotted-progress-indicator-wave-phase: 0}to{--slotted-progress-indicator-wave-phase: 1}}[data-ui=progress-indicator][data-shape=linear][data-wave] [data-part=track]{container-type:inline-size;margin-block:calc(.75 * var(--_thickness))}[data-ui=progress-indicator][data-shape=linear][data-wave] [data-part=indicator]{--_wave-length: 10;background-color:transparent;block-size:calc(2.5 * var(--_thickness));inline-size:calc(1200 * var(--_thickness));inset-block:calc(-.75 * var(--_thickness)) auto;inset-inline-start:0;overflow:visible;position:absolute}[data-ui=progress-indicator][data-shape=linear][data-wave] [data-part=indicator]:dir(rtl){transform:scaleX(-1)}[data-ui=progress-indicator][data-shape=linear][data-wave] [data-part=indicator] path{--_track-units: tan(atan2(100cqi, var(--_thickness)));--_window-start: 0;--_window-size: var(--_percent);--_hidden: calc(var(--slotted-progress-indicator-wave-phase) * var(--_wave-length));fill:none;stroke:var(--_ink);stroke-dasharray:max(0,calc(var(--_window-size) * var(--_track-units) / 100 - 1)) 100000;stroke-dashoffset:calc(-1 * (var(--_hidden) + var(--_window-start) * var(--_track-units) / 100 + .5));stroke-linecap:round;stroke-opacity:clamp(0,calc(var(--_window-size) * 1000),1);stroke-width:1;transform:translate(calc(-1 * var(--_hidden) * 1px))}[data-ui=progress-indicator][data-shape=linear][data-wave]:not([data-indeterminate]) [data-part=indicator] path{animation:slotted-progress-indicator-flatten-bar var(--_scrub) var(--_taper) both paused;animation-delay:calc(-1 * var(--_scrub) * (1 - var(--slotted-progress-indicator-wave-amplitude)))}[data-ui=progress-indicator][data-shape=linear][data-wave][data-indeterminate] [data-part=indicator]{--_wave-length: 5;animation:slotted-progress-indicator-travel var(--slotted-duration-loop-slow) var(--slotted-easing-standard) infinite}[data-ui=progress-indicator][data-shape=linear][data-wave][data-indeterminate] [data-part=indicator] path{--_window-start: var(--slotted-progress-indicator-travel-start);--_window-size: var(--slotted-progress-indicator-travel-size)}[data-ui=progress-indicator][data-shape=circular][data-wave] svg{--_stroke: var(--slotted-progress-indicator-stroke, 5);block-size:calc(1.2 * var(--_size));inline-size:calc(1.2 * var(--_size));overflow:visible}[data-ui=progress-indicator][data-shape=circular][data-wave] [data-part=indicator]{rotate:calc(-45deg * var(--slotted-progress-indicator-wave-phase));stroke-dasharray:var(--_percent) calc(100 - var(--_percent));stroke-dashoffset:calc(-12.5 * var(--slotted-progress-indicator-wave-phase));transform-box:view-box;transform-origin:50% 50%}[data-ui=progress-indicator][data-shape=circular][data-wave]:not([data-indeterminate]) [data-part=indicator]{animation:slotted-progress-indicator-flatten-ring var(--_scrub) var(--_taper) both paused;animation-delay:calc(-1 * var(--_scrub) * (1 - var(--slotted-progress-indicator-wave-amplitude)))}[data-ui=progress-indicator][data-part=root][data-wave]{--_scrub: var(--slotted-duration-long);--_taper: cubic-bezier(.45, 0, .55, 1)}@keyframes slotted-progress-indicator-flatten-bar{0%{d:path(\"M0-0.75c1.82 0 3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5\")}to{d:path(\"M0 0c1.82 0 3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0\")}}@keyframes slotted-progress-indicator-flatten-ring{0%{d:path(\"M45.6 24C45.6 26.83 41.92 28.82 41 31.04C40.08 33.27 41.27 37.27 39.27 39.27C37.27 41.27 33.27 40.08 31.04 41C28.82 41.92 26.83 45.6 24 45.6C21.17 45.6 19.18 41.92 16.96 41C14.73 40.08 10.73 41.27 8.73 39.27C6.73 37.27 7.92 33.27 7 31.04C6.08 28.82 2.4 26.83 2.4 24C2.4 21.17 6.08 19.18 7 16.96C7.92 14.73 6.73 10.73 8.73 8.73C10.73 6.73 14.73 7.92 16.96 7C19.18 6.08 21.17 2.4 24 2.4C26.83 2.4 28.82 6.08 31.04 7C33.27 7.92 37.27 6.73 39.27 8.73C41.27 10.73 40.08 14.73 41 16.96C41.92 19.18 45.6 21.17 45.6 24Z\")}to{d:path(\"M44 24C44 26.62 43.48 29.23 42.48 31.65C41.48 34.07 39.99 36.29 38.14 38.14C36.29 39.99 34.07 41.48 31.65 42.48C29.23 43.48 26.62 44 24 44C21.38 44 18.77 43.48 16.35 42.48C13.93 41.48 11.71 39.99 9.86 38.14C8.01 36.29 6.52 34.07 5.52 31.65C4.52 29.23 4 26.62 4 24C4 21.38 4.52 18.77 5.52 16.35C6.52 13.93 8.01 11.71 9.86 9.86C11.71 8.01 13.93 6.52 16.35 5.52C18.77 4.52 21.38 4 24 4C26.62 4 29.23 4.52 31.65 5.52C34.07 6.52 36.29 8.01 38.14 9.86C39.99 11.71 41.48 13.93 42.48 16.35C43.48 18.77 44 21.38 44 24Z\")}}[data-ui=progress-indicator][data-shape=morph] [data-part=track]{block-size:var(--_size);border-radius:var(--slotted-radius-full, 9999px);display:grid;flex:none;inline-size:var(--_size);place-items:center}[data-ui=progress-indicator][data-shape=morph][data-contained] [data-part=track]{background-color:var(--_track-color)}[data-ui=progress-indicator][data-shape=morph] [data-part=track]{animation:slotted-progress-indicator-drift calc(2 * var(--slotted-duration-loop-slow)) linear infinite}[data-ui=progress-indicator][data-shape=morph] [data-part=indicator]{animation:slotted-progress-indicator-morph calc(2 * var(--slotted-duration-loop-slow)) var(--slotted-easing-emphasized) infinite,slotted-progress-indicator-lurch calc(2 * var(--slotted-duration-loop-slow)) var(--slotted-easing-emphasized) infinite;background-color:var(--_ink);block-size:100%;inline-size:100%}[data-ui=progress-indicator][data-shape=morph][data-contained] [data-part=indicator]{--_shape: round(nearest, calc(.79 * var(--_size)), 2px);block-size:var(--_shape);inline-size:var(--_shape)}@keyframes slotted-progress-indicator-drift{to{rotate:250deg}}@keyframes slotted-progress-indicator-lurch{0%{rotate:0deg}20%{rotate:90deg}40%{rotate:180deg}60%{rotate:270deg}80%{rotate:360deg}to{rotate:450deg}}@keyframes slotted-progress-indicator-morph{0%{clip-path:polygon(50% 0%,59.8% 1%,69.1% 3.8%,77.8% 8.4%,85.4% 14.6%,91.6% 22.2%,96.2% 30.9%,99% 40.2%,100% 50%,99% 59.8%,96.2% 69.1%,91.6% 77.8%,85.4% 85.4%,77.8% 91.6%,69.1% 96.2%,59.8% 99%,50% 100%,40.2% 99%,30.9% 96.2%,22.2% 91.6%,14.6% 85.4%,8.4% 77.8%,3.8% 69.1%,1% 59.8%,0% 50%,1% 40.2%,3.8% 30.9%,8.4% 22.2%,14.6% 14.6%,22.2% 8.4%,30.9% 3.8%,40.2% 1%)}20%{clip-path:polygon(50% 0%,59.3% 3.4%,65.9% 11.5%,69.9% 20.3%,73.6% 26.4%,79.7% 30.1%,88.5% 34.1%,96.6% 40.7%,100% 50%,96.6% 59.3%,88.5% 65.9%,79.7% 69.9%,73.6% 73.6%,69.9% 79.7%,65.9% 88.5%,59.3% 96.6%,50% 100%,40.7% 96.6%,34.1% 88.5%,30.1% 79.7%,26.4% 73.6%,20.3% 69.9%,11.5% 65.9%,3.4% 59.3%,0% 50%,3.4% 40.7%,11.5% 34.1%,20.3% 30.1%,26.4% 26.4%,30.1% 20.3%,34.1% 11.5%,40.7% 3.4%)}40%{clip-path:polygon(50% 6.9%,59.5% 2.1%,68.9% 4.3%,74.7% 13%,77% 23%,80.2% 29.8%,87.4% 34.5%,96% 40.8%,100% 50%,96% 59.2%,87.4% 65.5%,80.2% 70.2%,77% 77%,74.7% 87%,68.9% 95.7%,59.5% 97.9%,50% 93.1%,42.7% 86.7%,35.9% 83.9%,26.8% 84.7%,16.1% 83.9%,8.5% 77.7%,7.7% 67.5%,11.5% 57.7%,13.8% 50%,11.5% 42.3%,7.7% 32.5%,8.5% 22.3%,16.1% 16.1%,26.8% 15.3%,35.9% 16.1%,42.7% 13.3%)}60%{clip-path:polygon(50% 9.7%,56.8% 15.7%,62% 21%,67.1% 24.4%,73.7% 26.3%,82% 28.6%,90.7% 33.2%,97.4% 40.6%,100% 50%,97.4% 59.4%,90.7% 66.8%,82% 71.4%,73.7% 73.7%,67.1% 75.6%,62% 79%,56.8% 84.3%,50% 90.3%,41.1% 94.8%,31.1% 95.5%,22.3% 91.4%,16.6% 83.4%,14.9% 73.5%,16.2% 64%,18.3% 56.3%,19.4% 50%,18.3% 43.7%,16.2% 36%,14.9% 26.5%,16.6% 16.6%,22.3% 8.6%,31.1% 4.5%,41.1% 5.2%)}80%{clip-path:polygon(50% 23.1%,55.4% 22.7%,61.6% 22%,68.9% 21.7%,77.2% 22.8%,85.7% 26.2%,93.1% 32.2%,98.2% 40.4%,100% 50%,98.2% 59.6%,93.1% 67.8%,85.7% 73.8%,77.2% 77.2%,68.9% 78.3%,61.6% 78%,55.4% 77.3%,50% 76.9%,44.6% 77.3%,38.4% 78%,31.1% 78.3%,22.8% 77.2%,14.3% 73.8%,6.9% 67.8%,1.8% 59.6%,0% 50%,1.8% 40.4%,6.9% 32.2%,14.3% 26.2%,22.8% 22.8%,31.1% 21.7%,38.4% 22%,44.6% 22.7%)}to{clip-path:polygon(50% 0%,59.8% 1%,69.1% 3.8%,77.8% 8.4%,85.4% 14.6%,91.6% 22.2%,96.2% 30.9%,99% 40.2%,100% 50%,99% 59.8%,96.2% 69.1%,91.6% 77.8%,85.4% 85.4%,77.8% 91.6%,69.1% 96.2%,59.8% 99%,50% 100%,40.2% 99%,30.9% 96.2%,22.2% 91.6%,14.6% 85.4%,8.4% 77.8%,3.8% 69.1%,1% 59.8%,0% 50%,1% 40.2%,3.8% 30.9%,8.4% 22.2%,14.6% 14.6%,22.2% 8.4%,30.9% 3.8%,40.2% 1%)}}@media(prefers-reduced-motion:reduce){[data-ui=progress-indicator][data-part=root],[data-ui=progress-indicator] [data-part=indicator]:not(path),[data-ui=progress-indicator] [data-part=track],[data-ui=progress-indicator] svg{animation:none!important}[data-ui=progress-indicator][data-shape=linear][data-indeterminate] [data-part=indicator]{--slotted-progress-indicator-travel-size: 46;--slotted-progress-indicator-travel-start: 27}[data-ui=progress-indicator][data-shape=circular][data-indeterminate] [data-part=indicator]{stroke-dasharray:34 100}[data-ui=progress-indicator][data-part=root][data-wave]{animation:none}}@media(forced-colors:active){[data-ui=progress-indicator][data-shape=linear] [data-part=track]{background-color:Canvas;outline:var(--slotted-border-width-thin, 1px) solid ButtonBorder;outline-offset:calc(-1 * var(--slotted-border-width-thin, 1px))}[data-ui=progress-indicator][data-shape=linear] [data-part=track]:before,[data-ui=progress-indicator][data-shape=linear] [data-part=track]:after{content:none}[data-ui=progress-indicator]:is([data-placement=edge-start],[data-placement=edge-end]) [data-part=track]{background-color:transparent;outline:none}[data-ui=progress-indicator] [data-part=indicator]{background-color:Highlight}[data-ui=progress-indicator][data-shape=linear][data-wave] [data-part=indicator]{background-color:transparent}[data-ui=progress-indicator][data-shape=linear][data-wave] [data-part=indicator] path{stroke:Highlight}[data-ui=progress-indicator][data-shape=circular] [data-part=indicator]{background-color:transparent;stroke:Highlight}[data-ui=progress-indicator][data-shape=circular] [data-part=track]{stroke:ButtonBorder}[data-ui=progress-indicator][data-shape=morph][data-contained] [data-part=track]{background-color:Canvas}}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SlGlyph, selector: "svg[slGlyph]", inputs: ["name", "solid"] }, { kind: "component", type: SlIcon, selector: "[slIcon]", inputs: ["directional", "label", "size", "tone"], exportAs: ["slIcon"] }, { kind: "component", type: SlProgressBar, selector: "[slProgressBar]", inputs: ["value", "min", "max", "buffer", "showValue", "valueText", "format", "locale", "wave", "placement"], exportAs: ["slProgressBar"] }, { kind: "component", type: SlUploadViewer, selector: "div[slUploadViewer]", inputs: ["files", "viewing", "urls", "messages", "locale", "size"], outputs: ["viewingChange"], exportAs: ["slUploadViewer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlUpload, decorators: [{
+            type: Component,
+            args: [{ selector: 'div[slUpload]', standalone: true, exportAs: 'slUpload', imports: [NgTemplateOutlet, SlGlyph, SlIcon, SlProgressBar, SlUploadViewer], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [
+                        { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SlUpload), multi: true },
+                        { provide: NG_VALIDATORS, useExisting: forwardRef(() => SlUpload), multi: true },
+                    ], host: {
+                        'data-ui': 'upload',
+                        'data-part': 'root',
+                        '[attr.data-variant]': 'resolvedVariant()',
+                        '[attr.data-layout]': 'resolvedLayout()',
+                        '[attr.data-size]': 'resolvedSize()',
+                        '[attr.data-disabled]': "resolvedDisabled() ? '' : null",
+                        '[attr.data-readonly]': "readOnly() ? '' : null",
+                        '[attr.data-invalid]': "invalid() ? '' : null",
+                        '[attr.data-required]': "required() ? '' : null",
+                        '[attr.data-loading]': "summary().pending ? '' : null",
+                        '[attr.data-complete]': "summary().complete ? '' : null",
+                        '[attr.data-dragging]': "dragging() || documentDrag() ? '' : null",
+                    }, template: `
+    @if (label() && !insideField()) {
+      <span data-part="label">{{ label() }}</span>
+    }
+    @if (description() && !insideField()) {
+      <p [id]="descriptionId" data-part="description">{{ description() }}</p>
+    }
+
+    @if (resolvedVariant() === 'button') {
+      <ng-container [ngTemplateOutlet]="triggerTemplate" />
+    } @else {
+      <div
+        (dragenter)="onDragEnter($event)"
+        (dragleave)="onDragLeave()"
+        (dragover)="onDragOver($event)"
+        (drop)="onDrop($event)"
+        (paste)="onPaste($event)"
+        (click)="onZoneClick($event)"
+        [attr.data-drop-target]="verdict() === 'target' ? '' : null"
+        [attr.data-drop-invalid]="verdict() === 'invalid' ? '' : null"
+        [attr.data-browsable]="browsable() ? '' : null"
+        data-part="dropzone"
+      >
+        <!-- The region carries the mark, so the trigger inside it does not. -->
+        @if (resolvedVariant() === 'dropzone') {
+          <span slIcon><svg slGlyph name="upload"></svg></span>
+          {{ t('dropzone') }}
+        }
+        <ng-container [ngTemplateOutlet]="triggerTemplate" />
+        @if (resolvedVariant() === 'field') {
+          <span data-part="meta">{{ fieldSummary() }}</span>
+        }
+      </div>
+    }
+
+    @if (files().length > 1) {
+      <div data-part="summary">
+        <span>{{ summaryText() }}</span>
+        @if (!readOnly()) {
+          <button (click)="clear($event)" data-part="clear" type="button">
+            {{ t('clear') }}
+          </button>
+        }
+      </div>
+    }
+
+    @if (showList()) {
+      <ul [style.--slotted-upload-visible-rows]="visibleRows()" data-part="list">
+        @for (file of files(); track file.key) {
+          <li [attr.data-status]="file.status" data-part="item">
+            @if (resolvedPreview() !== 'none' || resolvedLayout() === 'grid') {
+              <span
+                [attr.data-extension]="extensionLabel(file)"
+                [attr.data-kind]="file.kind"
+                data-part="preview"
+              >
+                @if (url(file) && file.type.startsWith('image/')) {
+                  <img [src]="url(file)" alt="" />
+                } @else {
+                  <span slIcon><svg slGlyph [name]="kindGlyph[file.kind]"></svg></span>
+                }
+              </span>
+            }
+
+            <div data-part="body">
+              @if (openable(file)) {
+                <button (click)="open(file, $event)" data-part="filename" dir="auto" type="button">
+                  <span data-part="name">{{ stem(file) }}</span>
+                  @if (extension(file)) {
+                    <span data-part="extension">{{ extension(file) }}</span>
+                  }
+                </button>
+              } @else {
+                <span data-part="filename" dir="auto">
+                  <span data-part="name">{{ stem(file) }}</span>
+                  @if (extension(file)) {
+                    <span data-part="extension">{{ extension(file) }}</span>
+                  }
+                </span>
+              }
+              <div data-part="detail">
+                <span data-part="meta">{{ formatters().bytes(file.size) }}</span>
+                <span data-part="status">{{ statusText(file) }}</span>
+              </div>
+            </div>
+
+            <span data-part="actions">
+              @for (action of actions(file); track action.part) {
+                <button
+                  (click)="act(file, action.action, $event)"
+                  [attr.aria-label]="action.label"
+                  [attr.data-part]="action.part"
+                  type="button"
+                >
+                  <span slIcon><svg slGlyph [name]="action.glyph"></svg></span>
+                </button>
+              }
+            </span>
+
+            @if (showBar(file)) {
+              <div data-part="progress">
+                <div
+                  [tone]="file.status === 'uploading' ? 'accent' : 'warning'"
+                  [value]="percent(file)"
+                  decorative
+                  size="sm"
+                  slProgressBar
+                ></div>
+              </div>
+            }
+
+            @if (file.status === 'rejected' || file.status === 'error') {
+              <p data-part="message">{{ messageText(file) }}</p>
+            }
+          </li>
+        }
+      </ul>
+    }
+
+    <ng-content />
+
+    <div
+      (viewingChange)="setViewing($event.key, $event.reason, $event.source)"
+      [files]="files()"
+      [locale]="resolvedLocale()"
+      [messages]="messages()"
+      [size]="resolvedSize()"
+      [urls]="urls()"
+      [viewing]="resolvedView() === 'none' ? null : viewing()"
+      slUploadViewer
+    ></div>
+
+    <ng-template #triggerTemplate>
+      <label #trigger data-part="trigger">
+        @if (resolvedVariant() !== 'dropzone') {
+          <span slIcon><svg slGlyph name="upload"></svg></span>
+        }
+        <input
+          #control
+          (change)="onPicked($event)"
+          [attr.accept]="accept() ?? null"
+          [attr.aria-describedby]="describedBy()"
+          [attr.capture]="capture() ?? null"
+          [attr.disabled]="resolvedDisabled() ? '' : null"
+          [attr.id]="controlId"
+          [attr.multiple]="multiple() ? '' : null"
+          [attr.name]="name() ?? null"
+          [attr.required]="required() ? '' : null"
+          [attr.webkitdirectory]="directory() ? '' : null"
+          data-part="input"
+          type="file"
+        />
+        {{ t('trigger') }}
+      </label>
+    </ng-template>
+  `, styles: ["@layer slotted.components{[data-ui=upload][data-part=root],[data-ui=upload][data-part=viewer]{--_font-size: var(--slotted-control-font-size-md, 13px);--_glyph-size: var(--slotted-control-icon-size-md, 16px);--_inner-size: var(--slotted-control-inner-size-md, 24px);--_control-height: var(--slotted-control-height-md, 34px);--_control-inset: var(--slotted-control-padding-inline-md, 13px);--_gap: var(--slotted-control-gap-md, 8px);--_preview-size: var(--slotted-upload-preview-size, calc(2 * var(--_glyph-size)));--_state-hover: color-mix( in oklab, currentcolor var(--slotted-upload-state-layer-hover, 8%), transparent );--_state-active: color-mix( in oklab, currentcolor var(--slotted-upload-state-layer-active, 14%), transparent );--_section-gap: var(--slotted-upload-section-gap, var(--slotted-space-5, .75rem));--_item-gap: var(--slotted-upload-item-gap, var(--slotted-space-4, .5rem));--_line-gap: var(--slotted-upload-line-gap, var(--slotted-space-1, .125rem));--_item-inset-block: var(--slotted-upload-item-padding-block, var(--slotted-space-4, .5rem));--_item-inset-inline: var( --slotted-upload-item-padding-inline, var(--slotted-space-5, .75rem) );--_radius: var(--slotted-upload-radius, var(--slotted-radius-md, 6px));--_item-radius: var(--slotted-upload-item-radius, var(--slotted-radius-md, 6px));--_border-width: var(--slotted-upload-border-width, var(--slotted-border-width-thin, 1px));--_zone-inset-block: var(--slotted-upload-zone-padding-block, var(--slotted-space-9, 2rem));--_zone-inset-inline: var(--slotted-upload-zone-padding-inline, var(--slotted-space-6, 1rem));--_zone-border-width: var( --slotted-upload-zone-border-width, var(--slotted-border-width-medium, 1.5px) );--_zone-edge: var(--slotted-upload-zone-border-color, var(--slotted-border-strong));--_zone-ground: var(--slotted-upload-zone-background, var(--slotted-surface-sunken));--_zone-glyph-size: var(--slotted-upload-zone-icon-size, calc(1.5 * var(--_glyph-size)));--_action-glyph-size: max(var(--slotted-upload-icon-size-min, 14px), var(--_glyph-size));--_action-size: var( --slotted-upload-action-size, max( var(--slotted-target-min, 24px), min( calc(var(--_action-glyph-size) + 2 * var(--slotted-space-2, .25rem)), var(--_inner-size) ) ) );--_status-text: var(--slotted-text-muted);--_item-surface: var(--slotted-upload-item-background, var(--slotted-surface));--_item-border: var(--slotted-upload-item-border-color, var(--slotted-border-subtle));--_kind-tile: var(--slotted-upload-kind-other);--_leading: round(up, calc(1em * var(--slotted-line-height-md, 1.5)), 1px);color:var(--slotted-text);font-family:var(--slotted-upload-font-family, var(--slotted-control-font-family));font-size:var(--_font-size);line-height:var(--_leading)}[data-ui=upload][data-part=root]{container-name:slotted-upload;container-type:inline-size;inline-size:100%;display:flex;flex-direction:column;gap:var(--_section-gap)}[data-ui=upload][data-size=sm]{--_font-size: var(--slotted-control-font-size-sm, 12px);--_glyph-size: var(--slotted-control-icon-size-sm, 14px);--_inner-size: var(--slotted-control-inner-size-sm, 22px);--_control-height: var(--slotted-control-height-sm, 30px);--_control-inset: var(--slotted-control-padding-inline-sm, 10px);--_gap: var(--slotted-control-gap-sm, 6px)}[data-ui=upload][data-size=lg]{--_font-size: var(--slotted-control-font-size-lg, 14px);--_glyph-size: var(--slotted-control-icon-size-lg, 18px);--_inner-size: var(--slotted-control-inner-size-lg, 28px);--_control-height: var(--slotted-control-height-lg, 38px);--_control-inset: var(--slotted-control-padding-inline-lg, 16px);--_gap: var(--slotted-control-gap-lg, 8px)}[data-ui=upload] [data-part=label]{color:var(--slotted-text);flex:none;font-weight:var(--slotted-upload-label-font-weight, var(--slotted-font-weight-medium, 500))}[data-ui=upload] [data-part=description]{color:var(--slotted-text-muted);flex:none;margin:0}[data-ui=upload] [data-part=dropzone]{--_zone-border-color: var(--_zone-edge);--_zone-surface: var(--_zone-ground);align-items:center;background-color:var(--_zone-surface);border:var(--_zone-border-width) dashed var(--_zone-border-color);border-radius:var(--_radius);display:flex;flex:none;flex-direction:column;gap:var(--_gap);padding-block:var(--_zone-inset-block);padding-inline:var(--_zone-inset-inline);text-align:center;transition:background-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),border-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing)}[data-ui=upload] [data-part=dropzone]>[data-ui=icon]{--slotted-icon-size: var(--_zone-glyph-size);color:var(--slotted-text-muted)}[data-ui=upload] [data-part=dropzone][data-drop-target]{--_zone-border-color: var(--slotted-tone-accent-border);--_zone-surface: var(--slotted-tone-accent-surface)}[data-ui=upload] [data-part=dropzone][data-drop-invalid]{--_zone-border-color: var(--slotted-tone-danger-border);--_zone-surface: var(--slotted-tone-danger-surface)}[data-ui=upload] [data-part=dropzone][data-browsable]{cursor:pointer}[data-ui=upload]:not([data-disabled]) [data-part=dropzone][data-browsable]:not([data-drop-target],[data-drop-invalid]):hover{--_zone-surface: color-mix( in oklab, var(--slotted-text) var(--slotted-upload-zone-state-layer-hover, 4%), var(--_zone-ground) )}[data-ui=upload]:not([data-disabled]) [data-part=dropzone][data-browsable]:not([data-drop-target],[data-drop-invalid]):active{--_zone-surface: color-mix( in oklab, var(--slotted-text) var(--slotted-upload-zone-state-layer-active, 8%), var(--_zone-ground) )}[data-ui=upload]:not([data-disabled],[data-invalid]) [data-part=dropzone][data-browsable]:not([data-drop-target],[data-drop-invalid]):is(:hover,:active){--_zone-border-color: var(--slotted-text-muted)}[data-ui=upload]:not([data-disabled]) [data-part=dropzone][data-browsable]:not([data-drop-target],[data-drop-invalid]):has([data-part=trigger]:hover){--_zone-border-color: var(--_zone-edge);--_zone-surface: var(--_zone-ground)}[data-ui=upload][data-disabled][data-part=root]{--_zone-edge: var(--slotted-disabled-border);--_zone-ground: var(--slotted-disabled-background)}[data-ui=upload][data-disabled] [data-part=dropzone]{color:var(--slotted-disabled-foreground)}[data-ui=upload][data-invalid][data-part=root]{--_zone-edge: var(--slotted-tone-danger-border)}[data-ui=upload] [data-part=trigger]{align-items:center;background-color:var(--slotted-upload-trigger-background, var(--slotted-surface));block-size:var(--_control-height);border:var(--slotted-control-border-width, 1px) solid var(--slotted-control-border-color);border-radius:var(--slotted-control-radius, 4px);box-shadow:var(--slotted-control-shadow);color:var(--slotted-text);cursor:pointer;display:inline-flex;flex:none;font:inherit;font-weight:var(--slotted-control-font-weight, 600);gap:var(--_gap);justify-content:center;padding-inline:var(--_control-inset);position:relative;transition:background-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),border-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),translate var(--slotted-duration-instant) var(--slotted-control-transition-easing);white-space:nowrap}[data-ui=upload] [data-part=trigger]>[data-ui=icon]{--slotted-icon-size: var(--_glyph-size)}[data-ui=upload]:not([data-disabled]) [data-part=trigger]:hover{background-color:var(--slotted-tone-secondary-subtle-hover)}[data-ui=upload]:not([data-disabled]) [data-part=trigger]:active{background-color:var(--slotted-tone-secondary-subtle-active);translate:0 var(--slotted-border-width-thin, 1px)}[data-ui=upload][data-disabled] [data-part=trigger]{background-color:var(--slotted-disabled-background);border-color:var(--slotted-disabled-border);box-shadow:none;color:var(--slotted-disabled-foreground);cursor:default}[data-ui=upload] [data-part=trigger]:has(:focus-visible){outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}[data-ui=upload][data-invalid] [data-part=trigger]{--slotted-focus-ring-color: var(--slotted-focus-ring-color-invalid);border-color:var(--slotted-tone-danger-border);--_invalid-edge-width: var(--slotted-control-invalid-edge-width, 1px);box-shadow:inset 0 0 0 var(--_invalid-edge-width) var(--slotted-tone-danger-border)}[data-ui=upload] [data-part=input]{block-size:1px;border:0;clip-path:inset(50%);inline-size:1px;inset-block-start:50%;inset-inline-start:50%;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap}[data-ui=upload] [data-part=input]:focus-visible{outline:none}[data-ui=upload] [data-part=summary]{align-items:center;color:var(--slotted-text-muted);display:flex;flex:none;gap:var(--_gap);justify-content:space-between}[data-ui=upload] [data-part=clear]{appearance:none;flex:none;white-space:nowrap;background-color:transparent;border:0;border-radius:var(--slotted-control-radius, 4px);color:inherit;cursor:pointer;font:inherit;padding-block:var(--slotted-space-1, .125rem);padding-inline:var(--slotted-space-3, .375rem);text-decoration-line:underline;text-underline-offset:.2em;transition:background-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing)}[data-ui=upload] [data-part=clear]:enabled:hover{background-color:var(--_state-hover)}[data-ui=upload] [data-part=clear]:enabled:active{background-color:var(--_state-active)}[data-ui=upload] [data-part=clear]:disabled{color:var(--slotted-disabled-foreground);cursor:default}[data-ui=upload] [data-part=clear]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}[data-ui=upload] [data-part=list]{--_row-block-size: calc( max(var(--_preview-size), 2lh) + 2 * var(--_item-inset-block) + 2 * var(--_border-width) + var(--_item-gap) );display:flex;flex-direction:column;gap:var(--_item-gap);list-style:none;margin:0;flex:1 1 auto;min-block-size:var(--_row-block-size);max-block-size:calc(var(--slotted-upload-visible-rows, 6) * var(--_row-block-size));overflow-y:auto;padding:0}[data-ui=upload] [data-part=item]{align-items:center;flex:none;background-color:var(--_item-surface);border:var(--_border-width) solid var(--_item-border);border-radius:var(--_item-radius);column-gap:var(--_gap);display:grid;grid-template-areas:\"preview body actions\" \"message message message\";grid-template-columns:auto minmax(0,1fr) auto;overflow:hidden;padding-block:var(--_item-inset-block);padding-inline:var(--_item-inset-inline);position:relative;row-gap:var(--_line-gap);transition:background-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),border-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),opacity var(--slotted-duration-medium) var(--slotted-easing-enter),translate var(--slotted-duration-medium) var(--slotted-easing-enter)}@starting-style{[data-ui=upload] [data-part=item]{opacity:0;translate:0 calc(-1 * var(--slotted-space-2, .25rem))}}[data-ui=upload] [data-part=item][data-status=success]{--_status-text: var(--slotted-tone-success-text)}[data-ui=upload] [data-part=item][data-status=ready]{border-style:dashed}[data-ui=upload] [data-part=item][data-status=paused],[data-ui=upload] [data-part=item][data-status=stalled]{--_status-text: var(--slotted-tone-warning-text)}[data-ui=upload] [data-part=item][data-status=rejected],[data-ui=upload] [data-part=item][data-status=error]{--_status-text: var(--slotted-tone-danger-text);--_item-surface: var(--slotted-tone-danger-surface);--_item-border: var(--slotted-tone-danger-border)}[data-ui=upload] [data-part=item][data-status=canceled]{--_status-text: var(--slotted-text-muted)}[data-ui=upload][data-disabled] [data-part=item]{color:var(--slotted-disabled-foreground)}[data-ui=upload] [data-part=preview]{align-items:center;background-color:var(--_kind-tile);block-size:var(--_preview-size);border-radius:var(--slotted-upload-preview-radius, var(--slotted-radius-sm, 4px));color:var(--slotted-upload-kind-foreground);display:inline-flex;flex-direction:column;grid-area:preview;inline-size:var(--_preview-size);justify-content:center;overflow:hidden}[data-ui=upload] [data-part=preview]>img{block-size:100%;inline-size:100%;object-fit:cover}[data-ui=upload] [data-part=preview]>[data-ui=icon]{--slotted-icon-size: var(--_glyph-size)}[data-ui=upload] [data-part=preview][data-kind=pdf]{--_kind-tile: var(--slotted-upload-kind-pdf)}[data-ui=upload] [data-part=preview][data-kind=document]{--_kind-tile: var(--slotted-upload-kind-document)}[data-ui=upload] [data-part=preview][data-kind=spreadsheet]{--_kind-tile: var(--slotted-upload-kind-spreadsheet)}[data-ui=upload] [data-part=preview][data-kind=presentation]{--_kind-tile: var(--slotted-upload-kind-presentation)}[data-ui=upload] [data-part=preview][data-kind=image]{--_kind-tile: var(--slotted-upload-kind-image)}[data-ui=upload] [data-part=preview][data-kind=video]{--_kind-tile: var(--slotted-upload-kind-video)}[data-ui=upload] [data-part=preview][data-kind=audio]{--_kind-tile: var(--slotted-upload-kind-audio)}[data-ui=upload] [data-part=preview][data-kind=archive]{--_kind-tile: var(--slotted-upload-kind-archive)}[data-ui=upload] [data-part=item]>[data-part=body]{display:flex;flex-direction:column;gap:var(--_line-gap);grid-area:body;min-inline-size:0}[data-ui=upload] [data-part=filename]{display:flex;font-weight:var(--slotted-upload-name-font-weight, var(--slotted-font-weight-medium, 500));min-inline-size:0;unicode-bidi:isolate}[data-ui=upload] button[data-part=filename]{appearance:none;background:none;border:0;color:inherit;cursor:pointer;font-family:inherit;font-size:inherit;line-height:inherit;padding:0;text-align:start;transition:translate var(--slotted-duration-instant) var(--slotted-control-transition-easing)}[data-ui=upload] button[data-part=filename]:enabled:hover{text-decoration-line:underline;text-underline-offset:.2em}[data-ui=upload] button[data-part=filename]:enabled:active{text-decoration-line:underline;text-underline-offset:.2em;translate:0 var(--slotted-border-width-thin, 1px)}[data-ui=upload] button[data-part=filename]:focus-visible{border-radius:var(--slotted-control-radius, 4px);outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}[data-ui=upload][data-layout=grid] button[data-part=preview]{appearance:none;border:0;cursor:pointer;padding:0}[data-ui=upload] [data-part=name]{flex:0 1 auto;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[data-ui=upload] [data-part=extension]{flex:none}[data-ui=upload] [data-part=detail]{align-items:baseline;color:var(--slotted-text-muted);display:flex;flex-wrap:wrap;font-size:var(--slotted-font-size-xs, .75rem);line-height:var(--_leading);min-inline-size:0}[data-ui=upload] [data-part=meta]{font-variant-numeric:tabular-nums;white-space:nowrap}[data-ui=upload] [data-part=status]{color:var(--_status-text);font-weight:var(--slotted-upload-status-font-weight, var(--slotted-font-weight-medium, 500));min-inline-size:0}[data-ui=upload] [data-part=meta]:has(+[data-part=status]):after{color:var(--slotted-text-muted);content:\" \\b7\";margin-inline-end:.4em}[data-ui=upload] [data-part=message]{color:var(--_status-text);font-size:var(--slotted-font-size-xs, .75rem);line-height:var(--_leading);grid-area:message;margin:0}[data-ui=upload] [data-part=progress]{display:block;inset-block-end:0;inset-inline:0;position:absolute}[data-ui=upload] [data-part=actions]{display:inline-flex;gap:var(--slotted-space-1, .125rem);grid-area:actions;justify-content:flex-end}[data-ui=upload] [data-part=viewerExternal],[data-ui=upload] [data-part=viewerClose],[data-ui=upload] [data-part=start],[data-ui=upload] [data-part=pause],[data-ui=upload] [data-part=retry],[data-ui=upload] [data-part=cancel],[data-ui=upload] [data-part=remove]{align-items:center;appearance:none;background-color:transparent;block-size:var(--_action-size);border:0;border-radius:var(--slotted-upload-action-radius, var(--slotted-control-radius, 4px));color:inherit;cursor:pointer;display:inline-flex;flex:none;font:inherit;inline-size:var(--_action-size);justify-content:center;padding:0;transition:background-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing)}[data-ui=upload] [data-part=viewerExternal]>[data-ui=icon],[data-ui=upload] [data-part=viewerClose]>[data-ui=icon],[data-ui=upload] [data-part=start]>[data-ui=icon],[data-ui=upload] [data-part=pause]>[data-ui=icon],[data-ui=upload] [data-part=retry]>[data-ui=icon],[data-ui=upload] [data-part=cancel]>[data-ui=icon],[data-ui=upload] [data-part=remove]>[data-ui=icon]{--slotted-icon-size: var(--_action-glyph-size)}@media(pointer:coarse){[data-ui=upload] :is([data-part=viewerExternal],[data-part=viewerClose],[data-part=start],[data-part=pause],[data-part=retry],[data-part=cancel],[data-part=remove]){position:relative}[data-ui=upload] :is([data-part=viewerExternal],[data-part=viewerClose],[data-part=start],[data-part=pause],[data-part=retry],[data-part=cancel],[data-part=remove]):after{content:\"\";inset:min(0px,calc((100% - var(--slotted-target-comfortable, 44px)) / 2));position:absolute}[data-ui=upload] :is([data-part=viewerExternal],[data-part=start],[data-part=pause],[data-part=retry],[data-part=cancel]):has(+:is([data-part=viewerClose],[data-part=pause],[data-part=retry],[data-part=cancel],[data-part=remove]):not([hidden])):after{inset-inline-end:0}[data-ui=upload] :is([data-part=viewerExternal],[data-part=start],[data-part=pause],[data-part=retry],[data-part=cancel]):not([hidden])+:is([data-part=viewerClose],[data-part=pause],[data-part=retry],[data-part=cancel],[data-part=remove]):after{inset-inline-start:0}}[data-ui=upload] [data-part=viewerExternal]:enabled:hover,[data-ui=upload] [data-part=viewerClose]:enabled:hover,[data-ui=upload] [data-part=start]:enabled:hover,[data-ui=upload] [data-part=pause]:enabled:hover,[data-ui=upload] [data-part=retry]:enabled:hover,[data-ui=upload] [data-part=cancel]:enabled:hover,[data-ui=upload] [data-part=remove]:enabled:hover{background-color:var(--_state-hover)}[data-ui=upload] [data-part=viewerExternal]:enabled:active,[data-ui=upload] [data-part=viewerClose]:enabled:active,[data-ui=upload] [data-part=start]:enabled:active,[data-ui=upload] [data-part=pause]:enabled:active,[data-ui=upload] [data-part=retry]:enabled:active,[data-ui=upload] [data-part=cancel]:enabled:active,[data-ui=upload] [data-part=remove]:enabled:active{background-color:var(--_state-active)}[data-ui=upload] [data-part=viewerExternal]:disabled,[data-ui=upload] [data-part=viewerClose]:disabled,[data-ui=upload] [data-part=start]:disabled,[data-ui=upload] [data-part=pause]:disabled,[data-ui=upload] [data-part=retry]:disabled,[data-ui=upload] [data-part=cancel]:disabled,[data-ui=upload] [data-part=remove]:disabled{color:var(--slotted-disabled-foreground);cursor:default}[data-ui=upload] [data-part=viewerExternal]:focus-visible,[data-ui=upload] [data-part=viewerClose]:focus-visible,[data-ui=upload] [data-part=start]:focus-visible,[data-ui=upload] [data-part=pause]:focus-visible,[data-ui=upload] [data-part=retry]:focus-visible,[data-ui=upload] [data-part=cancel]:focus-visible,[data-ui=upload] [data-part=remove]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:calc(-1 * var(--slotted-focus-ring-width, 2px))}[data-ui=upload][data-part=viewer]{background-color:var(--slotted-surface);block-size:100%;display:grid;grid-row:1 / -1;grid-template-rows:auto minmax(0,1fr);inline-size:100%}[data-ui=upload] [data-part=viewerHeader]{align-items:center;border-block-end:var(--_border-width) solid var(--slotted-border-subtle);column-gap:var(--_gap);display:grid;grid-template-columns:minmax(0,1fr) auto;padding-block:var(--slotted-space-4, .5rem);padding-inline:var(--slotted-space-6, 1rem)}[data-ui=upload] [data-part=viewerTitle]{font-size:var(--slotted-font-size-md, .875rem);line-height:var(--_leading);font-weight:var(--slotted-font-weight-semibold, 600);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[data-ui=upload] [data-part=viewerMeta]{color:var(--slotted-text-muted);font-size:var(--slotted-font-size-xs, .75rem);line-height:var(--_leading)}[data-ui=upload] [data-part=viewerActions]{align-items:center;display:inline-flex;gap:var(--slotted-space-1, .125rem)}[data-ui=upload] [data-part=viewerStage]{background-color:var(--slotted-surface-sunken);display:grid;min-block-size:0;overflow:hidden;padding:var(--slotted-space-6, 1rem);place-items:center;position:relative}[data-ui=upload] [data-part=viewerStage]>img,[data-ui=upload] [data-part=viewerStage]>iframe{align-self:stretch;block-size:auto;inline-size:auto;justify-self:stretch;min-block-size:0;min-inline-size:0}[data-ui=upload] [data-part=viewerStage]>img{object-fit:contain}[data-ui=upload] [data-part=viewerStage]>iframe{background-color:var(--slotted-surface);border:0}[data-ui=upload] [data-part=viewerStage]>video,[data-ui=upload] [data-part=viewerStage]>audio{max-block-size:100%;max-inline-size:100%;min-block-size:0;min-inline-size:0}[data-ui=upload] [data-part=viewerStage]>[data-part=preview]{block-size:var(--slotted-upload-viewer-tile-size, 6rem);inline-size:var(--slotted-upload-viewer-tile-size, 6rem)}[data-ui=upload] [data-part=viewerStage]>[data-part=preview]>[data-ui=icon]{--slotted-icon-size: calc(3 * var(--_glyph-size))}[data-ui=upload] [data-part=viewerStage]>p{color:var(--slotted-text-muted);margin:0;max-inline-size:28ch;text-align:center}[data-ui=upload] [data-part=viewerStage]:has(>[data-part=preview]){align-items:center;display:flex;flex-direction:column;gap:var(--slotted-space-5, .75rem);justify-content:center}[data-ui=upload] [data-part=viewerPrevious],[data-ui=upload] [data-part=viewerNext]{align-items:center;appearance:none;background-color:color-mix(in oklab,var(--slotted-surface) var(--slotted-upload-viewer-control-opacity, 92%),transparent);block-size:var(--slotted-upload-viewer-control-size, 2.5rem);border:0;border-radius:var(--slotted-radius-full, 9999px);box-shadow:var(--slotted-shadow-sm);color:var(--slotted-text);cursor:pointer;display:inline-flex;inline-size:var(--slotted-upload-viewer-control-size, 2.5rem);justify-content:center;padding:0;position:absolute;transition:background-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),translate var(--slotted-duration-instant) var(--slotted-control-transition-easing)}[data-ui=upload] [data-part=viewerPrevious]{inset-inline-start:var(--slotted-space-5, .75rem)}[data-ui=upload] [data-part=viewerNext]{inset-inline-end:var(--slotted-space-5, .75rem)}[data-ui=upload] [data-part=viewerPrevious]>[data-ui=icon],[data-ui=upload] [data-part=viewerNext]>[data-ui=icon]{--slotted-icon-size: var(--_glyph-size)}[data-ui=upload] [data-part=viewerPrevious]>[data-ui=icon]{rotate:180deg}[data-ui=upload] [data-part=viewerPrevious]:enabled:hover,[data-ui=upload] [data-part=viewerNext]:enabled:hover{background-color:color-mix(in oklab,currentcolor var(--slotted-upload-state-layer-hover, 8%),var(--slotted-surface))}[data-ui=upload] [data-part=viewerPrevious]:enabled:active,[data-ui=upload] [data-part=viewerNext]:enabled:active{background-color:color-mix(in oklab,currentcolor var(--slotted-upload-state-layer-active, 14%),var(--slotted-surface));translate:0 var(--slotted-border-width-thin, 1px)}[data-ui=upload] [data-part=viewerPrevious]:disabled,[data-ui=upload] [data-part=viewerNext]:disabled{color:var(--slotted-disabled-foreground);cursor:default}[data-ui=upload] [data-part=viewerPrevious]:focus-visible,[data-ui=upload] [data-part=viewerNext]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}[data-ui=field] [data-ui=upload]>[data-part=label],[data-ui=field] [data-ui=upload]>[data-part=description],[data-ui=field] [data-ui=upload]>[data-part=message]{display:none}[data-ui=field] [data-ui=upload][data-part=root]{--_section-gap: var(--slotted-upload-field-section-gap, var(--slotted-space-4, .5rem))}[data-ui=upload][data-variant=button] [data-part=trigger]{align-self:start}[data-ui=upload][data-variant=field]:where([data-part=root]){--_zone-edge: var(--slotted-control-border-color);--_zone-ground: var(--slotted-control-surface, Field)}[data-ui=upload][data-variant=field] [data-part=dropzone]{align-items:center;border-style:solid;border-width:var(--slotted-control-border-width, 1px);flex-direction:row;gap:var(--_gap);padding-block:var(--slotted-space-2, .25rem);padding-inline:var(--slotted-space-2, .25rem);text-align:start}[data-ui=upload][data-layout=grid] [data-part=list]{display:grid;gap:var(--_gap);grid-template-columns:repeat(auto-fill,minmax(var(--slotted-upload-card-measure, 9rem),1fr))}[data-ui=upload][data-layout=grid] [data-part=item]{align-content:start;align-items:stretch;container-type:inline-size;grid-template-areas:\"preview\" \"body\" \"message\";grid-template-columns:minmax(0,1fr)}[data-ui=upload][data-layout=grid] [data-part=preview]{block-size:round(down,75cqi,1px);inline-size:100%}[data-ui=upload][data-layout=grid] [data-part=actions]{background-color:color-mix(in oklab,var(--slotted-surface) var(--slotted-upload-card-actions-opacity, 96%),transparent);border-radius:var(--_item-radius);box-shadow:var(--slotted-shadow-xs);inset-block-start:calc(var(--_item-inset-block) + var(--slotted-space-3, .375rem));inset-inline-end:calc(var(--_item-inset-inline) + var(--slotted-space-3, .375rem));margin-block-start:0;min-inline-size:0;padding:var(--slotted-space-1, .125rem);position:absolute}[data-ui=upload][data-layout=grid] [data-part=preview]:not(:has(img)):after{content:attr(data-extension);font-size:var(--slotted-font-size-sm, .8125rem);font-weight:var(--slotted-font-weight-semibold, 600);letter-spacing:.06em;margin-block-start:var(--slotted-space-3, .375rem);text-transform:uppercase}[data-ui=upload][data-layout=grid] [data-part=preview]>[data-ui=icon]{--slotted-icon-size: calc(2 * var(--_glyph-size))}@container slotted-upload (max-width: 30rem){[data-ui=upload] [data-part=summary]{align-items:start;flex-direction:column}}@container slotted-upload (max-width: 26rem){[data-ui=upload] [data-part=item]{grid-template-areas:\"preview body\" \"preview actions\" \"message message\";grid-template-columns:auto minmax(0,1fr)}[data-ui=upload] [data-part=preview]{align-self:start}[data-ui=upload] [data-part=actions]{justify-content:flex-start;margin-inline-start:calc(-1 * var(--slotted-space-2, .25rem))}[data-ui=upload] [data-part=dropzone]{padding-block:var(--slotted-space-6, 1rem)}}@media(forced-colors:active){[data-ui=upload] [data-part=item][data-status=rejected],[data-ui=upload] [data-part=item][data-status=error]{--_item-border: CanvasText}[data-ui=upload] [data-part=preview]{border:var(--_border-width) solid ButtonBorder}[data-ui=upload] [data-part=dropzone][data-drop-target],[data-ui=upload] [data-part=dropzone][data-drop-invalid]{--_zone-border-color: Highlight}[data-ui=upload] :is([data-part=clear],[data-part=viewerExternal],[data-part=viewerClose],[data-part=viewerPrevious],[data-part=viewerNext],[data-part=start],[data-part=pause],[data-part=retry],[data-part=cancel],[data-part=remove]):enabled:is(:hover,:active){background-color:Highlight;color:HighlightText}}@media(forced-colors:active){[data-ui=upload][data-invalid] [data-part=trigger]{outline:var(--_invalid-edge-width) solid CanvasText;outline-offset:calc(-1 * (var(--slotted-control-border-width, 1px) + var(--_invalid-edge-width)))}[data-ui=upload][data-invalid] [data-part=trigger]:has(:focus-visible){outline:calc(var(--slotted-focus-ring-width, 2px) + var(--_invalid-edge-width)) double var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}}}\n", "@property --slotted-progress-indicator-percent{syntax: \"<number>\"; inherits: true; initial-value: 0;}@property --slotted-progress-indicator-buffer-percent{syntax: \"<number>\"; inherits: true; initial-value: 0;}@property --slotted-progress-indicator-travel-start{syntax: \"<number>\"; inherits: true; initial-value: 0;}@property --slotted-progress-indicator-travel-size{syntax: \"<number>\"; inherits: true; initial-value: 100;}@property --slotted-progress-indicator-wave-phase{syntax: \"<number>\"; inherits: true; initial-value: 0;}@property --slotted-progress-indicator-wave-amplitude{syntax: \"<number>\"; inherits: true; initial-value: 1;}@layer slotted.components{[data-ui=progress-indicator][data-part=root]{--_ink: var(--slotted-progress-indicator-indicator-color, var(--slotted-tone-accent-text));--_track-color: var( --slotted-progress-indicator-track-color, color-mix(in oklab, var(--_ink) 24%, var(--slotted-surface)) );--_buffer-color: var(--slotted-progress-indicator-buffer-color, transparent);--_percent: var(--slotted-progress-indicator-percent, 0);--_buffer-percent: var(--slotted-progress-indicator-buffer-percent, 0);--_lead: max(var(--_percent), var(--_buffer-percent));--_font-size: var(--slotted-control-font-size-md, 13px);--_text-gap: var(--slotted-space-4, .5rem);--_row-gap: var(--slotted-space-3, .375rem);--_thickness: var(--slotted-progress-indicator-thickness, var(--slotted-space-2, .25rem));--_size: var(--slotted-progress-indicator-size, var(--slotted-control-height-md, 34px));--_radius: var(--slotted-progress-indicator-radius, var(--slotted-radius-full, 9999px));--_gap: var(--slotted-progress-indicator-gap, var(--_thickness));font-family:var(--slotted-control-font-family, sans-serif);font-size:var(--_font-size);line-height:var(--slotted-line-height-md, 1.5);min-inline-size:0;--_settle: calc(4 * var(--slotted-duration-long));--_spring: linear( 0, .078, .235, .401, .549, .669, .762, .831, .882, .918, .944, .962, .974, .982, .988, .992, .995, .996, .998, .998, 1 );transition:--slotted-progress-indicator-percent var(--_settle) var(--_spring),--slotted-progress-indicator-buffer-percent var(--_settle) var(--_spring)}[data-ui=progress-indicator][hidden]{display:none}[data-ui=progress-indicator][data-part=root][data-tone=secondary]{--_ink: var(--slotted-progress-indicator-indicator-color, var(--slotted-border-strong))}[data-ui=progress-indicator][data-part=root][data-tone=success]{--_ink: var(--slotted-progress-indicator-indicator-color, var(--slotted-tone-success-text))}[data-ui=progress-indicator][data-part=root][data-tone=warning]{--_ink: var(--slotted-progress-indicator-indicator-color, var(--slotted-tone-warning-text))}[data-ui=progress-indicator][data-part=root][data-tone=danger]{--_ink: var(--slotted-progress-indicator-indicator-color, var(--slotted-tone-danger-text))}[data-ui=progress-indicator][data-part=root][data-buffered]{--_buffer-color: var( --slotted-progress-indicator-buffer-color, color-mix(in oklab, var(--_ink) 52%, var(--slotted-surface)) )}[data-ui=progress-indicator][data-part=root][data-size=sm]{--_font-size: var(--slotted-control-font-size-sm, 12px);--_text-gap: var(--slotted-space-3, .375rem);--_thickness: var(--slotted-progress-indicator-thickness, var(--slotted-space-1, .125rem));--_size: var(--slotted-progress-indicator-size, var(--slotted-control-height-sm, 30px))}[data-ui=progress-indicator][data-part=root][data-size=lg]{--_font-size: var(--slotted-control-font-size-lg, 14px);--_row-gap: var(--slotted-space-4, .5rem);--_thickness: var(--slotted-progress-indicator-thickness, var(--slotted-space-4, .5rem));--_size: var(--slotted-progress-indicator-size, var(--slotted-control-height-lg, 38px))}[data-ui=progress-indicator] [data-part=label]{color:var(--slotted-text, CanvasText);min-inline-size:0;overflow-wrap:break-word}[data-ui=progress-indicator] [data-part=value]{color:var(--slotted-text-muted, GrayText);font-variant-numeric:tabular-nums;white-space:nowrap}[data-ui=progress-indicator][data-part=root][data-shape=linear]{align-items:baseline;column-gap:var(--_text-gap);display:grid;grid-template-columns:1fr auto;row-gap:var(--_row-gap)}[data-ui=progress-indicator][data-shape=linear]>[data-part=label]{grid-column:1}[data-ui=progress-indicator][data-shape=linear]>[data-part=value]{grid-column:2;justify-self:end}[data-ui=progress-indicator][data-shape=linear]>[data-part=track]{grid-column:1 / -1}[data-ui=progress-indicator][data-shape=linear] [data-part=track]{background-color:var(--_buffer-color);block-size:var(--_thickness);border-radius:var(--_radius);inline-size:100%;isolation:isolate;overflow-x:clip;overflow-y:visible;position:relative}[data-ui=progress-indicator][data-shape=linear] [data-part=track]:before{background-color:var(--_track-color);border-radius:inherit;content:\"\";inset-block:0;inset-inline-end:0;inset-inline-start:calc(1% * var(--_lead) + var(--_gap));position:absolute}[data-ui=progress-indicator][data-shape=linear] [data-part=track]:after{background-color:var(--_ink);border-radius:var(--slotted-radius-full, 9999px);content:\"\";inline-size:var(--_thickness);inset-block:0;inset-inline-end:0;position:absolute}[data-ui=progress-indicator][data-shape=linear] [data-part=indicator]{background-color:var(--_ink);block-size:100%;border-radius:inherit;inline-size:calc(1% * var(--_percent));position:relative}@container style(--slotted-progress-indicator-percent: 100){[data-ui=progress-indicator][data-shape=linear] [data-part=track]:before,[data-ui=progress-indicator][data-shape=linear] [data-part=track]:after{content:none}}[data-ui=progress-indicator][data-shape=linear][data-indeterminate] [data-part=track]:before{inset-inline-start:0}[data-ui=progress-indicator][data-shape=linear][data-indeterminate] [data-part=track]:after{content:none}[data-ui=progress-indicator][data-shape=linear][data-indeterminate] [data-part=indicator]{animation:slotted-progress-indicator-travel var(--slotted-duration-loop-slow) var(--slotted-easing-standard) infinite;inline-size:calc(1% * var(--slotted-progress-indicator-travel-size));inset-block:0;inset-inline-start:calc(1% * var(--slotted-progress-indicator-travel-start));position:absolute}@keyframes slotted-progress-indicator-travel{0%{--slotted-progress-indicator-travel-size: 14;--slotted-progress-indicator-travel-start: -14}45%{--slotted-progress-indicator-travel-size: 46}to{--slotted-progress-indicator-travel-size: 14;--slotted-progress-indicator-travel-start: 100}}[data-ui=progress-indicator][data-part=root][data-placement=page]{--_radius: var(--slotted-progress-indicator-radius, var(--slotted-radius-none, 0px));--_track-color: var(--slotted-progress-indicator-track-color, transparent);--_gap: var(--slotted-progress-indicator-gap, 0);inset-block-start:0;inset-inline:0;position:fixed;z-index:var(--slotted-z-index-sticky, 100)}[data-ui=progress-indicator][data-placement=page] [data-part=track]:after{content:none}[data-ui=progress-indicator][data-part=root]:is([data-placement=edge-start],[data-placement=edge-end]){--_radius: var(--slotted-progress-indicator-radius, var(--slotted-radius-none, 0px));--_track-color: var(--slotted-progress-indicator-track-color, transparent);--_gap: var(--slotted-progress-indicator-gap, 0);inset-inline:0;position:var(--slotted-progress-indicator-position, absolute)}[data-ui=progress-indicator][data-part=root][data-placement=edge-start]{inset-block-start:0}[data-ui=progress-indicator][data-part=root][data-placement=edge-end]{inset-block-end:0}[data-ui=progress-indicator]:is([data-placement=edge-start],[data-placement=edge-end]) [data-part=track]:after{content:none}[data-ui=progress-indicator][data-part=root]:is([data-placement=page],[data-placement=edge-start],[data-placement=edge-end]){--_withdrawn: inset(0 0 100% 0);clip-path:inset(0);transition:--slotted-progress-indicator-percent var(--_settle) var(--_spring),--slotted-progress-indicator-buffer-percent var(--_settle) var(--_spring),clip-path var(--slotted-duration-medium) var(--slotted-easing-enter),opacity var(--slotted-duration-medium) var(--slotted-easing-enter)}@starting-style{[data-ui=progress-indicator][data-part=root]:is([data-placement=page],[data-placement=edge-start],[data-placement=edge-end]){clip-path:var(--_withdrawn);opacity:0}}[data-ui=progress-indicator][data-part=root][data-placement=edge-end]{--_withdrawn: inset(100% 0 0 0)}[data-ui=progress-indicator][data-part=root]:is([data-placement=page],[data-placement=edge-start],[data-placement=edge-end])[hidden]{clip-path:var(--_withdrawn);opacity:0;transition:clip-path var(--slotted-duration-short) var(--slotted-easing-exit),opacity var(--slotted-duration-short) var(--slotted-easing-exit),display var(--slotted-duration-short) allow-discrete}[data-ui=progress-indicator][data-part=root][data-shape=circular],[data-ui=progress-indicator][data-part=root][data-shape=morph]{align-items:center;column-gap:var(--_text-gap);display:inline-flex}[data-ui=progress-indicator][data-shape=circular] svg{--_stroke: var(--slotted-progress-indicator-stroke, 6);block-size:var(--_size);flex:none;inline-size:var(--_size);rotate:-90deg}[data-ui=progress-indicator][data-shape=circular] [data-part=track],[data-ui=progress-indicator][data-shape=circular] [data-part=indicator]{fill:none;stroke-linecap:round;stroke-width:var(--_stroke)}[data-ui=progress-indicator][data-shape=circular] [data-part=indicator]{stroke:var(--_ink);stroke-dasharray:var(--_percent) 100;stroke-opacity:clamp(0,calc(var(--_percent) * 1000),1)}[data-ui=progress-indicator][data-shape=circular] [data-part=track]{--_arc-gap: calc(3.2*clamp(0, calc(var(--_percent) * 1000), 1)) ;stroke:var(--_track-color);stroke-dasharray:calc(100 - var(--_percent) - 2 * var(--_arc-gap)) 100;stroke-dashoffset:calc(-1 * (var(--_percent) + var(--_arc-gap)))}@container style(--slotted-progress-indicator-percent: 100){[data-ui=progress-indicator][data-shape=circular] [data-part=track]{stroke:transparent}}[data-ui=progress-indicator][data-shape=circular][data-indeterminate] [data-part=track]{stroke:transparent}[data-ui=progress-indicator][data-shape=circular][data-indeterminate] svg{animation:slotted-progress-indicator-turn var(--slotted-duration-loop) linear infinite}[data-ui=progress-indicator][data-shape=circular][data-indeterminate] [data-part=indicator]{animation:slotted-progress-indicator-sweep var(--slotted-duration-loop-slow) var(--slotted-easing-standard) infinite;stroke-opacity:1;transition:none}@keyframes slotted-progress-indicator-turn{0%{rotate:-90deg}to{rotate:270deg}}@keyframes slotted-progress-indicator-sweep{0%{stroke-dasharray:4 100;stroke-dashoffset:0}50%{stroke-dasharray:62 100;stroke-dashoffset:-18}to{stroke-dasharray:4 100;stroke-dashoffset:-100}}[data-ui=progress-indicator][data-part=root][data-wave]{--slotted-progress-indicator-wave-amplitude: min( clamp(0, calc((var(--_percent) - 6) / 10), 1), clamp(0, calc((96 - var(--_percent)) / 12), 1) );animation:slotted-progress-indicator-wave var(--slotted-duration-loop) linear infinite}[data-ui=progress-indicator][data-part=root][data-wave][data-indeterminate]{--slotted-progress-indicator-wave-amplitude: 1}@keyframes slotted-progress-indicator-wave{0%{--slotted-progress-indicator-wave-phase: 0}to{--slotted-progress-indicator-wave-phase: 1}}[data-ui=progress-indicator][data-shape=linear][data-wave] [data-part=track]{container-type:inline-size;margin-block:calc(.75 * var(--_thickness))}[data-ui=progress-indicator][data-shape=linear][data-wave] [data-part=indicator]{--_wave-length: 10;background-color:transparent;block-size:calc(2.5 * var(--_thickness));inline-size:calc(1200 * var(--_thickness));inset-block:calc(-.75 * var(--_thickness)) auto;inset-inline-start:0;overflow:visible;position:absolute}[data-ui=progress-indicator][data-shape=linear][data-wave] [data-part=indicator]:dir(rtl){transform:scaleX(-1)}[data-ui=progress-indicator][data-shape=linear][data-wave] [data-part=indicator] path{--_track-units: tan(atan2(100cqi, var(--_thickness)));--_window-start: 0;--_window-size: var(--_percent);--_hidden: calc(var(--slotted-progress-indicator-wave-phase) * var(--_wave-length));fill:none;stroke:var(--_ink);stroke-dasharray:max(0,calc(var(--_window-size) * var(--_track-units) / 100 - 1)) 100000;stroke-dashoffset:calc(-1 * (var(--_hidden) + var(--_window-start) * var(--_track-units) / 100 + .5));stroke-linecap:round;stroke-opacity:clamp(0,calc(var(--_window-size) * 1000),1);stroke-width:1;transform:translate(calc(-1 * var(--_hidden) * 1px))}[data-ui=progress-indicator][data-shape=linear][data-wave]:not([data-indeterminate]) [data-part=indicator] path{animation:slotted-progress-indicator-flatten-bar var(--_scrub) var(--_taper) both paused;animation-delay:calc(-1 * var(--_scrub) * (1 - var(--slotted-progress-indicator-wave-amplitude)))}[data-ui=progress-indicator][data-shape=linear][data-wave][data-indeterminate] [data-part=indicator]{--_wave-length: 5;animation:slotted-progress-indicator-travel var(--slotted-duration-loop-slow) var(--slotted-easing-standard) infinite}[data-ui=progress-indicator][data-shape=linear][data-wave][data-indeterminate] [data-part=indicator] path{--_window-start: var(--slotted-progress-indicator-travel-start);--_window-size: var(--slotted-progress-indicator-travel-size)}[data-ui=progress-indicator][data-shape=circular][data-wave] svg{--_stroke: var(--slotted-progress-indicator-stroke, 5);block-size:calc(1.2 * var(--_size));inline-size:calc(1.2 * var(--_size));overflow:visible}[data-ui=progress-indicator][data-shape=circular][data-wave] [data-part=indicator]{rotate:calc(-45deg * var(--slotted-progress-indicator-wave-phase));stroke-dasharray:var(--_percent) calc(100 - var(--_percent));stroke-dashoffset:calc(-12.5 * var(--slotted-progress-indicator-wave-phase));transform-box:view-box;transform-origin:50% 50%}[data-ui=progress-indicator][data-shape=circular][data-wave]:not([data-indeterminate]) [data-part=indicator]{animation:slotted-progress-indicator-flatten-ring var(--_scrub) var(--_taper) both paused;animation-delay:calc(-1 * var(--_scrub) * (1 - var(--slotted-progress-indicator-wave-amplitude)))}[data-ui=progress-indicator][data-part=root][data-wave]{--_scrub: var(--slotted-duration-long);--_taper: cubic-bezier(.45, 0, .55, 1)}@keyframes slotted-progress-indicator-flatten-bar{0%{d:path(\"M0-0.75c1.82 0 3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5s3.18 1.5 5 1.5s3.18-1.5 5-1.5\")}to{d:path(\"M0 0c1.82 0 3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0s3.18 0 5 0\")}}@keyframes slotted-progress-indicator-flatten-ring{0%{d:path(\"M45.6 24C45.6 26.83 41.92 28.82 41 31.04C40.08 33.27 41.27 37.27 39.27 39.27C37.27 41.27 33.27 40.08 31.04 41C28.82 41.92 26.83 45.6 24 45.6C21.17 45.6 19.18 41.92 16.96 41C14.73 40.08 10.73 41.27 8.73 39.27C6.73 37.27 7.92 33.27 7 31.04C6.08 28.82 2.4 26.83 2.4 24C2.4 21.17 6.08 19.18 7 16.96C7.92 14.73 6.73 10.73 8.73 8.73C10.73 6.73 14.73 7.92 16.96 7C19.18 6.08 21.17 2.4 24 2.4C26.83 2.4 28.82 6.08 31.04 7C33.27 7.92 37.27 6.73 39.27 8.73C41.27 10.73 40.08 14.73 41 16.96C41.92 19.18 45.6 21.17 45.6 24Z\")}to{d:path(\"M44 24C44 26.62 43.48 29.23 42.48 31.65C41.48 34.07 39.99 36.29 38.14 38.14C36.29 39.99 34.07 41.48 31.65 42.48C29.23 43.48 26.62 44 24 44C21.38 44 18.77 43.48 16.35 42.48C13.93 41.48 11.71 39.99 9.86 38.14C8.01 36.29 6.52 34.07 5.52 31.65C4.52 29.23 4 26.62 4 24C4 21.38 4.52 18.77 5.52 16.35C6.52 13.93 8.01 11.71 9.86 9.86C11.71 8.01 13.93 6.52 16.35 5.52C18.77 4.52 21.38 4 24 4C26.62 4 29.23 4.52 31.65 5.52C34.07 6.52 36.29 8.01 38.14 9.86C39.99 11.71 41.48 13.93 42.48 16.35C43.48 18.77 44 21.38 44 24Z\")}}[data-ui=progress-indicator][data-shape=morph] [data-part=track]{block-size:var(--_size);border-radius:var(--slotted-radius-full, 9999px);display:grid;flex:none;inline-size:var(--_size);place-items:center}[data-ui=progress-indicator][data-shape=morph][data-contained] [data-part=track]{background-color:var(--_track-color)}[data-ui=progress-indicator][data-shape=morph] [data-part=track]{animation:slotted-progress-indicator-drift calc(2 * var(--slotted-duration-loop-slow)) linear infinite}[data-ui=progress-indicator][data-shape=morph] [data-part=indicator]{animation:slotted-progress-indicator-morph calc(2 * var(--slotted-duration-loop-slow)) var(--slotted-easing-emphasized) infinite,slotted-progress-indicator-lurch calc(2 * var(--slotted-duration-loop-slow)) var(--slotted-easing-emphasized) infinite;background-color:var(--_ink);block-size:100%;inline-size:100%}[data-ui=progress-indicator][data-shape=morph][data-contained] [data-part=indicator]{--_shape: round(nearest, calc(.79 * var(--_size)), 2px);block-size:var(--_shape);inline-size:var(--_shape)}@keyframes slotted-progress-indicator-drift{to{rotate:250deg}}@keyframes slotted-progress-indicator-lurch{0%{rotate:0deg}20%{rotate:90deg}40%{rotate:180deg}60%{rotate:270deg}80%{rotate:360deg}to{rotate:450deg}}@keyframes slotted-progress-indicator-morph{0%{clip-path:polygon(50% 0%,59.8% 1%,69.1% 3.8%,77.8% 8.4%,85.4% 14.6%,91.6% 22.2%,96.2% 30.9%,99% 40.2%,100% 50%,99% 59.8%,96.2% 69.1%,91.6% 77.8%,85.4% 85.4%,77.8% 91.6%,69.1% 96.2%,59.8% 99%,50% 100%,40.2% 99%,30.9% 96.2%,22.2% 91.6%,14.6% 85.4%,8.4% 77.8%,3.8% 69.1%,1% 59.8%,0% 50%,1% 40.2%,3.8% 30.9%,8.4% 22.2%,14.6% 14.6%,22.2% 8.4%,30.9% 3.8%,40.2% 1%)}20%{clip-path:polygon(50% 0%,59.3% 3.4%,65.9% 11.5%,69.9% 20.3%,73.6% 26.4%,79.7% 30.1%,88.5% 34.1%,96.6% 40.7%,100% 50%,96.6% 59.3%,88.5% 65.9%,79.7% 69.9%,73.6% 73.6%,69.9% 79.7%,65.9% 88.5%,59.3% 96.6%,50% 100%,40.7% 96.6%,34.1% 88.5%,30.1% 79.7%,26.4% 73.6%,20.3% 69.9%,11.5% 65.9%,3.4% 59.3%,0% 50%,3.4% 40.7%,11.5% 34.1%,20.3% 30.1%,26.4% 26.4%,30.1% 20.3%,34.1% 11.5%,40.7% 3.4%)}40%{clip-path:polygon(50% 6.9%,59.5% 2.1%,68.9% 4.3%,74.7% 13%,77% 23%,80.2% 29.8%,87.4% 34.5%,96% 40.8%,100% 50%,96% 59.2%,87.4% 65.5%,80.2% 70.2%,77% 77%,74.7% 87%,68.9% 95.7%,59.5% 97.9%,50% 93.1%,42.7% 86.7%,35.9% 83.9%,26.8% 84.7%,16.1% 83.9%,8.5% 77.7%,7.7% 67.5%,11.5% 57.7%,13.8% 50%,11.5% 42.3%,7.7% 32.5%,8.5% 22.3%,16.1% 16.1%,26.8% 15.3%,35.9% 16.1%,42.7% 13.3%)}60%{clip-path:polygon(50% 9.7%,56.8% 15.7%,62% 21%,67.1% 24.4%,73.7% 26.3%,82% 28.6%,90.7% 33.2%,97.4% 40.6%,100% 50%,97.4% 59.4%,90.7% 66.8%,82% 71.4%,73.7% 73.7%,67.1% 75.6%,62% 79%,56.8% 84.3%,50% 90.3%,41.1% 94.8%,31.1% 95.5%,22.3% 91.4%,16.6% 83.4%,14.9% 73.5%,16.2% 64%,18.3% 56.3%,19.4% 50%,18.3% 43.7%,16.2% 36%,14.9% 26.5%,16.6% 16.6%,22.3% 8.6%,31.1% 4.5%,41.1% 5.2%)}80%{clip-path:polygon(50% 23.1%,55.4% 22.7%,61.6% 22%,68.9% 21.7%,77.2% 22.8%,85.7% 26.2%,93.1% 32.2%,98.2% 40.4%,100% 50%,98.2% 59.6%,93.1% 67.8%,85.7% 73.8%,77.2% 77.2%,68.9% 78.3%,61.6% 78%,55.4% 77.3%,50% 76.9%,44.6% 77.3%,38.4% 78%,31.1% 78.3%,22.8% 77.2%,14.3% 73.8%,6.9% 67.8%,1.8% 59.6%,0% 50%,1.8% 40.4%,6.9% 32.2%,14.3% 26.2%,22.8% 22.8%,31.1% 21.7%,38.4% 22%,44.6% 22.7%)}to{clip-path:polygon(50% 0%,59.8% 1%,69.1% 3.8%,77.8% 8.4%,85.4% 14.6%,91.6% 22.2%,96.2% 30.9%,99% 40.2%,100% 50%,99% 59.8%,96.2% 69.1%,91.6% 77.8%,85.4% 85.4%,77.8% 91.6%,69.1% 96.2%,59.8% 99%,50% 100%,40.2% 99%,30.9% 96.2%,22.2% 91.6%,14.6% 85.4%,8.4% 77.8%,3.8% 69.1%,1% 59.8%,0% 50%,1% 40.2%,3.8% 30.9%,8.4% 22.2%,14.6% 14.6%,22.2% 8.4%,30.9% 3.8%,40.2% 1%)}}@media(prefers-reduced-motion:reduce){[data-ui=progress-indicator][data-part=root],[data-ui=progress-indicator] [data-part=indicator]:not(path),[data-ui=progress-indicator] [data-part=track],[data-ui=progress-indicator] svg{animation:none!important}[data-ui=progress-indicator][data-shape=linear][data-indeterminate] [data-part=indicator]{--slotted-progress-indicator-travel-size: 46;--slotted-progress-indicator-travel-start: 27}[data-ui=progress-indicator][data-shape=circular][data-indeterminate] [data-part=indicator]{stroke-dasharray:34 100}[data-ui=progress-indicator][data-part=root][data-wave]{animation:none}}@media(forced-colors:active){[data-ui=progress-indicator][data-shape=linear] [data-part=track]{background-color:Canvas;outline:var(--slotted-border-width-thin, 1px) solid ButtonBorder;outline-offset:calc(-1 * var(--slotted-border-width-thin, 1px))}[data-ui=progress-indicator][data-shape=linear] [data-part=track]:before,[data-ui=progress-indicator][data-shape=linear] [data-part=track]:after{content:none}[data-ui=progress-indicator]:is([data-placement=edge-start],[data-placement=edge-end]) [data-part=track]{background-color:transparent;outline:none}[data-ui=progress-indicator] [data-part=indicator]{background-color:Highlight}[data-ui=progress-indicator][data-shape=linear][data-wave] [data-part=indicator]{background-color:transparent}[data-ui=progress-indicator][data-shape=linear][data-wave] [data-part=indicator] path{stroke:Highlight}[data-ui=progress-indicator][data-shape=circular] [data-part=indicator]{background-color:transparent;stroke:Highlight}[data-ui=progress-indicator][data-shape=circular] [data-part=track]{stroke:ButtonBorder}[data-ui=progress-indicator][data-shape=morph][data-contained] [data-part=track]{background-color:Canvas}}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { files: [{ type: i0.Input, args: [{ isSignal: true, alias: "files", required: false }] }, { type: i0.Output, args: ["filesChange"] }], viewing: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewing", required: false }] }, { type: i0.Output, args: ["viewingChange"] }], filesChange2: [{ type: i0.Output, args: ["filesRequest"] }], viewingRequest: [{ type: i0.Output, args: ["viewingRequest"] }], reject: [{ type: i0.Output, args: ["reject"] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], directory: [{ type: i0.Input, args: [{ isSignal: true, alias: "directory", required: false }] }], capture: [{ type: i0.Input, args: [{ isSignal: true, alias: "capture", required: false }] }], maxFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFiles", required: false }] }], minFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "minFiles", required: false }] }], maxSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxSize", required: false }] }], minSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "minSize", required: false }] }], maxTotalSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxTotalSize", required: false }] }], fileValidator: [{ type: i0.Input, args: [{ isSignal: true, alias: "validate", required: false }] }], transform: [{ type: i0.Input, args: [{ isSignal: true, alias: "transform", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], layout: [{ type: i0.Input, args: [{ isSignal: true, alias: "layout", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], preview: [{ type: i0.Input, args: [{ isSignal: true, alias: "preview", required: false }] }], view: [{ type: i0.Input, args: [{ isSignal: true, alias: "view", required: false }] }], duplicates: [{ type: i0.Input, args: [{ isSignal: true, alias: "duplicates", required: false }] }], clickToBrowse: [{ type: i0.Input, args: [{ isSignal: true, alias: "clickToBrowse", required: false }] }], allowDrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowDrop", required: false }] }], allowPaste: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowPaste", required: false }] }], preventDocumentDrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "preventDocumentDrop", required: false }] }], autoUpload: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoUpload", required: false }] }], pendingBlocksSubmit: [{ type: i0.Input, args: [{ isSignal: true, alias: "pendingBlocksSubmit", required: false }] }], adapter: [{ type: i0.Input, args: [{ isSignal: true, alias: "adapter", required: false }] }], concurrency: [{ type: i0.Input, args: [{ isSignal: true, alias: "concurrency", required: false }] }], retries: [{ type: i0.Input, args: [{ isSignal: true, alias: "retries", required: false }] }], retryDelay: [{ type: i0.Input, args: [{ isSignal: true, alias: "retryDelay", required: false }] }], stallAfter: [{ type: i0.Input, args: [{ isSignal: true, alias: "stallAfter", required: false }] }], maxRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxRows", required: false }] }], locale: [{ type: i0.Input, args: [{ isSignal: true, alias: "locale", required: false }] }], fileKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "fileKey", required: false }] }], messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readOnly", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }] } });
+function optionalNumber(value) {
+    return value === undefined || value === null || value === '' ? undefined : numberAttribute(value);
+}
+function optionalBoolean(value) {
+    return value === undefined ? undefined : booleanAttribute(value);
+}
+/**
+ * The half of `accept` a drag can answer. A token that names an extension says
+ * nothing about an item whose name the platform has not given us yet.
+ */
+function matchesTypeOnly(type, accept) {
+    const tokens = accept
+        .split(',')
+        .map((token) => token.trim().toLowerCase())
+        .filter((token) => token.length > 0 && !token.startsWith('.'));
+    if (tokens.length === 0)
+        return true;
+    const [group, subtype] = type.toLowerCase().split('/');
+    return tokens.some((token) => {
+        const [tokenGroup, tokenSubtype] = token.split('/');
+        return ((tokenGroup === '*' || tokenGroup === group) &&
+            (tokenSubtype === '*' || tokenSubtype === subtype));
+    });
+}
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SlUpload, SlUploadViewer, UPLOAD_DEFAULTS, injectUploadDefaults, provideUploadDefaults, uploadFormatters };
+//# sourceMappingURL=slotted-angular-upload.mjs.map