@oslokommune/punkt-elements

import { PropertyValues } from 'lit'; import { PktElement } from '../../base-elements/element'; import { FileItem, IPktFileUpload, TQueueItemOperation, TFileTransfer, TFileUploadItemRenderer, TFilesChangedReason, TTransferProgress, TUploadStrategy } from './fileupload-types'; export declare abstract class PktFileUploadBase extends PktElement<IPktFileUpload> implements IPktFileUpload { /** Unique id used for internal input + wrapper wiring. Defaults to a per-instance uuid. */ id: string; /** Field name used by native input (`form`) or hidden fileId inputs (`custom`). */ name: string; /** Optional label shown by `pkt-input-wrapper`. */ label: string; /** Optional help text shown under label. */ helptext: string; /** Mark input as required in form strategy. */ required: boolean; /** Allow selecting/dropping multiple files. */ multiple: boolean; /** Disable all interaction in drop zone + queue actions. */ disabled: boolean; /** Stretch component width to container. */ fullwidth: boolean; /** Upload mode: `form` uses native file submit, `custom` emits upload request events per file. */ uploadStrategy: TUploadStrategy; /** Queue visual mode (`filename` or `thumbnail`). */ itemRenderer: TFileUploadItemRenderer; /** Native file input accept hint (browser picker filtering). */ accept: string; /** Built-in format validation source (csv attribute or array property). */ allowedFormats: string[]; /** Optional custom format validation message. Supports `{formats}` placeholder. */ formatErrorMessage: string; /** Max allowed file size (bytes or string like `500KB`, `5MB`). */ maxFileSize?: string | number; /** Optional custom size validation message. Supports `{maxSize}` placeholder. */ sizeErrorMessage: string; /** Optional JS callback for custom validation. Property-only on purpose (not HTML-attribute friendly). */ onFileValidation?: (file: File) => string | null; /** Transfer state list keyed by `fileId` (used for custom upload progress/error/cancel UI). */ transfers: TFileTransfer[]; /** Enables built-in comment operation in queue items (disabled in thumbnail view for parity with React). */ addCommentsEnabled: boolean; /** Enables built-in rename operation in queue items (disabled in thumbnail view for parity with React). */ renameFilesEnabled: boolean; /** Custom queue operations (JS property only). Supports inline + expanded operation UIs. */ extraOperations: TQueueItemOperation[]; /** Toggle image thumbnail behavior in queue when renderer supports it. */ enableImagePreview: boolean; /** External error flag — combines with internal validation errors. */ hasError: boolean; /** External error message shown in the alert under the drop zone. */ errorMessage: string; /** Show "Valgfritt" tag in the input wrapper. */ optionalTag: boolean; /** Show "Må fylles ut" tag in the input wrapper. */ requiredTag: boolean; /** Trailing characters to keep when middle-truncating long filenames. Set to `0` to disable. */ truncateTail: number; /** Controlled mode source of truth. Parent owns file list and updates this prop from events. */ value?: FileItem[]; /** Uncontrolled initial file list. Used once during first initialization. */ defaultValue?: FileItem[]; protected files: FileItem[]; protected isDragActive: boolean; protected validationErrorMessage: string | null; protected addedAnnouncement: string; private thumbnailUrls; private hasInitializedValue; private hasWarnedInvalidValueCombo; private thumbnailFileById; private connectedForm; private addedAnnouncementTimer; private readonly requiredSelectionMessage; protected get isControlled(): boolean; /** True if the component itself wants to show an error (internal validation or external prop). */ protected get hasEffectiveError(): boolean; /** Message to show in the alert under the drop zone. Internal validation takes priority. */ protected get effectiveErrorMessage(): string; protected get hasValidationError(): boolean; protected firstUpdated(changedProperties: PropertyValues): void; protected willUpdate(changedProperties: PropertyValues): void; protected updated(changedProperties: PropertyValues): void; private syncNativeInputFiles; private warnInvalidValueCombo; disconnectedCallback(): void; private setAddedAnnouncement; connectedCallback(): void; protected onNativeFileChange: (event: Event) => void; protected openFileDialog: (event: Event) => void; protected onDropZoneClick: (event: MouseEvent) => void; protected onDragOver: (event: DragEvent) => void; protected onDragLeave: () => void; protected onDrop: (event: DragEvent) => void; protected addFiles(selectedFiles: File[]): void; protected getCurrentFiles(): FileItem[]; protected cancelTransfer(fileId: string): void; protected removeFileItem(fileId: string): void; updateFileItem(fileId: string, updates: Partial<FileItem>): void; protected commitFiles(nextFiles: FileItem[], reason: TFilesChangedReason, changedFileIds?: string[]): void; protected getThumbnailUrl(file: FileItem): string | undefined; protected getTransferProgress(fileId: string): TTransferProgress; protected getTransferForFile(fileId: string): TFileTransfer | undefined; protected isImageFile(file: FileItem): boolean; protected formatFileSize(bytes: number): string; protected getResolvedAcceptValue(): string; protected getSupportedFormatsText(): string; protected getSortedFilesAndTransfers(): import('../../../../../shared-utils/fileupload').IFileAndTransfer[]; private validateFile; private syncThumbnailUrls; private revokeAllThumbnailUrls; /** Polite summary: prefer the transient "file added" announcement, then fall back to upload completion. */ protected getSrUploadedMessage(): string; /** Assertive summary for transfer errors (parity with React `FileUpload`). */ protected getSrErrorsMessage(): string; private syncFormSubmitListener; private teardownFormSubmitListener; private onHostFormSubmit; }