@singlebase/elements 0.1.0

package/dist/elements/uploader.d.ts

@@ -0,0 +1,225 @@
+import { LitElement } from "lit";
+import type { FilesUploadApi } from "@singlebase/singlebase-sdk";
+/** What the uploader needs from a client: `files.upload`, and nothing else. */
+export type UploaderClient = {
+    files: Pick<FilesUploadApi, "upload">;
+};
+import { type SinglebaseUploadMessages } from "../upload-messages.js";
+export type UploadView = "full" | "compact" | "button";
+export type UploadItemStatus = "checking" | "ready" | "uploading" | "done" | "error";
+/**
+ * Per-format limits, keyed by extension: `{ pdf: { maxPages: 10 } }`.
+ *
+ * `maxPages` and `allowProtected` need the file's bytes read, which only
+ * works for `pdf`, `docx`, `pptx` and `xlsx`; the size bounds apply to any
+ * extension and override the element-wide ones for that kind.
+ */
+export interface FileRule {
+    maxPages?: number;
+    maxSize?: string | number;
+    minSize?: string | number;
+    /** Set false to refuse password-protected files. Default: allowed. */
+    allowProtected?: boolean;
+}
+export type FileRules = Record<string, FileRule>;
+export interface UploadItem {
+    /** Identity for de-duplication: name, size and mtime. */
+    key: string;
+    file: File;
+    /** The saved name, which the user may have edited. */
+    name: string;
+    status: UploadItemStatus;
+    percent: number;
+    error: string;
+    /** The stored file record, once the upload completes. */
+    record: unknown;
+    /** Pages (slides for pptx) when they could be read, else null. */
+    pages: number | null;
+    /** Whether the file is encrypted, when that could be determined. */
+    encrypted: boolean | null;
+    /** A local object URL for image thumbnails; "" for everything else. */
+    preview: string;
+}
+/**
+ * Every setting in one object, for configuring an element from script. Keys
+ * are the element's property names.
+ */
+export interface UploaderConfig {
+    view: UploadView;
+    dropzone: boolean;
+    allowRename: boolean;
+    autoUpload: boolean;
+    branding: boolean;
+    logoUrl: string;
+    logoText: string;
+    heading: string;
+    description: string;
+    maxFiles: number;
+    maxSize: string | number;
+    minSize: string | number;
+    accept: string;
+    rules: FileRules;
+    bucket: string;
+    publicRead: boolean;
+    redirectUrl: string;
+    metadata: Record<string, unknown>;
+    options: Record<string, unknown>;
+    messages: Partial<SinglebaseUploadMessages>;
+    theme: "light" | "dark";
+    density: "comfortable" | "compact";
+    onComplete: SinglebaseUploader["onComplete"];
+    onError: SinglebaseUploader["onError"];
+}
+/**
+ * A file picker that uploads straight to storage.
+ *
+ *   <singlebase-uploader></singlebase-uploader>
+ *   <singlebase-uploader view="compact" accept=".pdf,image/*"></singlebase-uploader>
+ *   <singlebase-uploader view="button" max-files="1"></singlebase-uploader>
+ *
+ * It owns the staging list — picking, renaming, removing, validating, and the
+ * progress of each file — and nothing else. When the batch finishes it emits
+ * the stored records and stops; what the application does with them (attach
+ * them to a record, show a gallery, save an avatar) is the application's
+ * decision, not the widget's.
+ *
+ * Failures are per file. One rejected upload leaves the rest completed and
+ * offers that row a retry, mirroring the SDK's own behaviour.
+ */
+export declare class SinglebaseUploader extends LitElement {
+    static styles: import("lit").CSSResult[];
+    /** An explicit client. Omit it and the page's SinglebaseClient() is used. */
+    accessor client: UploaderClient | null;
+    accessor messages: Partial<SinglebaseUploadMessages>;
+    accessor theme: "light" | "dark" | undefined;
+    accessor density: "comfortable" | "compact" | undefined;
+    /**
+     * `full` is the card with a dropzone and a reviewable list, `compact` the
+     * one-line attachments row, `button` a single control that uploads as soon
+     * as a file is chosen.
+     */
+    accessor view: UploadView;
+    /** Show the drop target. Off leaves the picker button on its own. */
+    accessor dropzone: boolean;
+    /** Let the user edit the saved filename before uploading. */
+    accessor allowRename: boolean;
+    /** Upload as soon as files are picked, with no review step. */
+    accessor autoUpload: boolean;
+    /** The "Files by Singlebase" credit. A plain link — it makes no request. */
+    accessor branding: boolean;
+    accessor logoUrl: string;
+    accessor logoText: string;
+    accessor heading: string;
+    accessor description: string;
+    accessor maxFiles: number;
+    /** Bytes, or a human size like "25MB". 0 or "" means no limit. */
+    accessor maxSize: string | number;
+    accessor minSize: string | number;
+    /** Same vocabulary as `<input type="file" accept>`. */
+    accessor accept: string;
+    /**
+     * Per-format limits, as JSON in markup or an object in JavaScript:
+     *
+     *     rules='{"pdf":{"maxPages":10,"allowProtected":false}}'
+     *
+     * Checking pages and encryption means reading the file in the browser, so
+     * it is a convenience for the person picking files — never a substitute
+     * for the server enforcing the same limits.
+     */
+    accessor rules: FileRules;
+    accessor bucket: string;
+    /** Metadata attached to every file this element uploads. */
+    accessor metadata: Record<string, unknown>;
+    /**
+     * `options` sent with every file's upload request — for instance
+     * `{ profile_photo: true }`, which makes the upload the account's photo.
+     */
+    accessor options: Record<string, unknown>;
+    accessor publicRead: boolean;
+    /** Where to go once every file has uploaded. Same-origin only. */
+    accessor redirectUrl: string;
+    /** Callback forms of the two events, for frameworks that prefer props. */
+    accessor onComplete: ((detail: {
+        completed: UploadItem[];
+        failed: UploadItem[];
+    }) => void) | null;
+    accessor onError: ((detail: {
+        message: string;
+    }) => void) | null;
+    private accessor items;
+    private accessor notice;
+    private accessor busy;
+    private accessor dragging;
+    private accessor editing;
+    get msg(): SinglebaseUploadMessages;
+    /** An explicit `.client`, else the page default. */
+    get resolvedClient(): UploaderClient | null;
+    /** The staging list, for host code that wants to inspect or persist it. */
+    get files(): readonly UploadItem[];
+    /** Overall progress across the current batch, 0–100. */
+    get percent(): number;
+    /** Opens the file picker. */
+    open(): void;
+    /**
+     * Applies several settings at once:
+     *
+     *     document.getElementById("docs").config = { maxFiles: 5, metadata: { folder: "q3" } };
+     *
+     * Unknown keys are ignored. Reading it returns the current settings.
+     */
+    set config(value: Partial<UploaderConfig>);
+    get config(): Partial<UploaderConfig>;
+    /** Drops every staged file and any notice. */
+    clear(): void;
+    disconnectedCallback(): void;
+    /** Uploads everything staged. Rows that already succeeded are left alone. */
+    upload(): Promise<void>;
+    /** The rule for this filename's extension, if the host set one. */
+    private ruleFor;
+    private add;
+    private needsInspection;
+    /**
+     * Reads the file and applies the rule. A fact the reader could not
+     * determine is not grounds for rejection — an unreadable page count means
+     * the page rule simply doesn't apply to that file.
+     */
+    private inspect;
+    /** Drops one staged file. Named for the row action, not Element.remove(). */
+    private removeItem;
+    private commitRename;
+    private fail;
+    private emit;
+    private redirect;
+    private onPick;
+    private onDrop;
+    private onDragOver;
+    private onDragLeave;
+    private get canAddMore();
+    /** True while any staged file is still being read. */
+    private get checking();
+    private get pendingCount();
+    private get hint();
+    private renderInput;
+    private renderLogo;
+    private renderBranding;
+    private renderNotice;
+    private renderCount;
+    private renderStatus;
+    private renderRow;
+    private renderRows;
+    private renderDropzone;
+    private renderUploadCta;
+    /**
+     * The whole card is the drop surface. Once files are staged the big zone is
+     * replaced by the "add more" control, and a drop should still land.
+     */
+    private renderFull;
+    private renderCompact;
+    private renderButton;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "singlebase-uploader": SinglebaseUploader;
+    }
+}

package/dist/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./display-CLDNNZQy.cjs"),t=require("./uploader-eFYKpk8b.cjs"),r=require("@singlebase/core");exports.AuthController=e.AuthController;exports.SettingsController=e.SettingsController;Object.defineProperty(exports,"SinglebaseAccountScreen",{enumerable:!0,get:()=>e.SinglebaseAccountScreen});Object.defineProperty(exports,"SinglebaseAuthButtons",{enumerable:!0,get:()=>e.SinglebaseAuthButtons});Object.defineProperty(exports,"SinglebaseAuthDisplay",{enumerable:!0,get:()=>e.SinglebaseAuthDisplay});Object.defineProperty(exports,"SinglebaseAuthGuard",{enumerable:!0,get:()=>e.SinglebaseAuthGuard});Object.defineProperty(exports,"SinglebaseAuthScreen",{enumerable:!0,get:()=>e.SinglebaseAuthScreen});exports.defaultMessages=e.defaultMessages;exports.fullNameOf=e.fullNameOf;exports.initialsOf=e.initialsOf;exports.isGuestScreen=e.isGuestScreen;exports.isProtectedScreen=e.isProtectedScreen;exports.isScreen=e.isScreen;exports.resolveMessages=e.resolveMessages;Object.defineProperty(exports,"SinglebaseUploader",{enumerable:!0,get:()=>t.SinglebaseUploader});exports.TOKEN_DEFAULTS=t.TOKEN_DEFAULTS;exports.defaultUploadMessages=t.defaultUploadMessages;exports.inspectFile=t.inspectFile;exports.isInspectable=t.isInspectable;exports.resolveRedirectTarget=t.resolveRedirectTarget;exports.resolveUploadMessages=t.resolveUploadMessages;Object.defineProperty(exports,"OPERATORS",{enumerable:!0,get:()=>r.OPERATORS});Object.defineProperty(exports,"matchesPredicate",{enumerable:!0,get:()=>r.matchesPredicate});Object.defineProperty(exports,"validatePredicate",{enumerable:!0,get:()=>r.validatePredicate});
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/index.d.ts

@@ -0,0 +1,7 @@
+/**
+ * `@singlebase/elements` — every element. Import `./authui` or `./uploader`
+ * instead to take only one family.
+ */
+export * from "./authui.js";
+export * from "./uploader.js";
+export { TOKEN_DEFAULTS } from "./styles/tokens.js";

package/dist/index.js

@@ -0,0 +1,30 @@
+import { A as a, S as t, a as r, b as l, c as i, d as n, e as o, f as S, g as c, i as d, h as g, j as u, k as b, r as f } from "./display-8HEcKYR4.js";
+import { S as A, T as h, d as m, i as O, a as T, r as v, b as M } from "./uploader-D-Da1trc.js";
+import { OPERATORS as U, matchesPredicate as x, validatePredicate as E } from "@singlebase/core";
+export {
+  a as AuthController,
+  U as OPERATORS,
+  t as SettingsController,
+  r as SinglebaseAccountScreen,
+  l as SinglebaseAuthButtons,
+  i as SinglebaseAuthDisplay,
+  n as SinglebaseAuthGuard,
+  o as SinglebaseAuthScreen,
+  A as SinglebaseUploader,
+  h as TOKEN_DEFAULTS,
+  S as defaultMessages,
+  m as defaultUploadMessages,
+  c as fullNameOf,
+  d as initialsOf,
+  O as inspectFile,
+  g as isGuestScreen,
+  T as isInspectable,
+  u as isProtectedScreen,
+  b as isScreen,
+  x as matchesPredicate,
+  f as resolveMessages,
+  v as resolveRedirectTarget,
+  M as resolveUploadMessages,
+  E as validatePredicate
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/messages.d.ts

@@ -0,0 +1,147 @@
+/**
+ * Default UI copy, taken verbatim from the design mock's renderVals()
+ * (titles/subs/ctas maps and inline strings in project/AuthWidget.dc.html).
+ * Every element accepts a .messages property with a partial override of
+ * this shape — spec: "configurable labels and messages without changing flow
+ * logic". This is deliberately a flat string bag rather than a locale-file
+ * system; hosts needing full i18n supply one populated object per language.
+ */
+export interface SinglebaseAuthMessages {
+    signInTitle: string;
+    signUpTitle: string;
+    forgotTitle: string;
+    verifyTitle: string;
+    otpTitle: string;
+    newPassTitle: string;
+    inviteTitle: string;
+    signInSubEmailAndOauth: string;
+    signInSubEmailOnly: string;
+    signInSubOauthOnly: string;
+    signUpSub: string;
+    forgotSub: string;
+    otpSub: string;
+    inviteSub: string;
+    signInCta: string;
+    signUpCta: string;
+    forgotCta: string;
+    verifyCta: string;
+    otpCta: string;
+    newPassCta: string;
+    inviteCta: string;
+    continueCta: string;
+    backCta: string;
+    emailMethodTitle: string;
+    emailMethodTitleSignUp: string;
+    emailMethodMeta: string;
+    emailMethodMetaSignUp: string;
+    emailMethodMetaOtp: string;
+    oauthMethodTitle: string;
+    oauthMethodMeta: string;
+    fullNameLabel: string;
+    fullNamePlaceholder: string;
+    emailLabel: string;
+    emailPlaceholder: string;
+    passwordLabel: string;
+    passwordPlaceholder: string;
+    newPasswordLabel: string;
+    newPasswordPlaceholder: string;
+    confirmPasswordLabel: string;
+    confirmPasswordPlaceholder: string;
+    currentPasswordLabel: string;
+    firstNameLabel: string;
+    firstNamePlaceholder: string;
+    lastNameLabel: string;
+    lastNamePlaceholder: string;
+    phoneLabel: string;
+    phonePlaceholder: string;
+    invitedEmailLabel: string;
+    forgotLink: string;
+    otpInsteadLink: string;
+    footTextSignIn: string;
+    footActionSignIn: string;
+    footTextSignUp: string;
+    footActionSignUp: string;
+    resendQuestion: string;
+    resendCta: string;
+    oauthPrimaryLabel: string;
+    oauthContinueWith: string;
+    blockedTitleDisabled: string;
+    blockedTitleUnavailable: string;
+    blockedBodyDisabled: string;
+    blockedBodyUnavailable: string;
+    blockedHint: string;
+    signOutCta: string;
+    addPhotoLink: string;
+    changePhotoLink: string;
+    photoUploading: string;
+    photoUpdated: string;
+    editingLabel: string;
+    uploadPhotoCta: string;
+    replacePhotoCta: string;
+    photoHint: string;
+    doneCta: string;
+    cancelCta: string;
+    editAccountCta: string;
+    saveChangesCta: string;
+    emailChangeHint: string;
+    passwordSectionTitle: string;
+    passwordChangedHint: string;
+    changePasswordCta: string;
+    updatePasswordCta: string;
+    twoFaTitle: string;
+    twoFaHintOff: string;
+    twoFaHintOn: string;
+    twoFaScanHint: string;
+    connectedTitle: string;
+    connectedHint: string;
+    addAnotherLabel: string;
+    disconnectCta: string;
+    notConnectedLabel: string;
+    deleteAccountCta: string;
+    deleteAccountConfirmCta: string;
+    deletePanelBody: string;
+    deleteConfirmLabel: string;
+    deleteConfirmPlaceholder: string;
+    savedNote: string;
+    passwordUpdatedNote: string;
+    changeEmailTitle: string;
+    newEmailLabel: string;
+    changeEmailCta: string;
+    changeUsernameTitle: string;
+    newUsernameLabel: string;
+    changeUsernameCta: string;
+    genericErrorMessage: string;
+    rateLimitedMessage: string;
+    codeSentNeutral: string;
+    invalidEmailError: string;
+    requiredError: string;
+    passwordMinError: string;
+    passwordMatchError: string;
+    codeIncompleteError: string;
+    invalidPhoneError: string;
+    notYetSupported: string;
+    alreadySignedInTitle: string;
+    alreadySignedInSub: string;
+    alreadySignedInSubPrefix: string;
+    continueHint: string;
+    consentPrefix: string;
+    consentJoin: string;
+    termsLabel: string;
+    privacyLabel: string;
+    emailUnchangedError: string;
+    emailUpdatedNote: string;
+    changeEmailCtaShort: string;
+    changeEmailHint: string;
+    changeEmailConfirmHint: string;
+    changeEmailElsewhereHint: string;
+    confirmChangeCta: string;
+    codeLabel: string;
+    /** The credit under the card. A brand name — translate only the "Auth by". */
+    brandingLabel: string;
+    linkRequiresSignIn: string;
+    oauthCallbackTitle: string;
+    oauthCallbackSub: string;
+    oauthDenied: string;
+}
+export declare const defaultMessages: SinglebaseAuthMessages;
+export declare function resolveMessages(overrides?: Partial<SinglebaseAuthMessages>): SinglebaseAuthMessages;