@ibanzajoe/uploader 0.1.0 → 0.2.0

package/dist/index.d.cts

@@ -42,10 +42,22 @@ type PickerOptions = {
     /** Maximum file size in bytes. Files above this are rejected at selection. */
     maxSize?: number;
     /**
-     * Upload sources. Currently only 'local_file_system' is supported (MVP).
-     * Extension point for webcam/URL/cloud pickers.
+     * Upload sources offered to the user.
+     *   'local_file_system' — drag-and-drop + Browse files (always available)
+     *   'camera'            — capture a photo from the device camera
+     *
+     * When omitted, all supported sources are offered (camera appears only when
+     * the browser supports getUserMedia and the picker accepts images). Pass an
+     * explicit list to restrict the sources — e.g. ['local_file_system'] hides
+     * the camera even where it is supported.
      */
-    fromSources?: Array<'local_file_system'>;
+    fromSources?: Array<'local_file_system' | 'camera'>;
+    /**
+     * Preferred camera when the 'camera' source is used.
+     *   'user'        — front / selfie camera (mirrored). Default.
+     *   'environment' — rear camera.
+     */
+    cameraFacingMode?: 'user' | 'environment';
 };
 /** Props shared by PickerOverlay and DropPane. */
 type SharedPickerProps = {
@@ -107,6 +119,11 @@ type UsePickerResult = {
  * Opens when `open={true}`. Calls `onClose` when the user dismisses via ESC,
  * the backdrop click, or the Cancel button. `onUploadDone` fires after all
  * selected files have been uploaded.
+ *
+ * Composes Dropzone, FileQueueRow, and ProgressBar primitives from the #194
+ * foundation — no hard-coded brand colors.
+ *
+ * @dsCard PickerOverlay
  */
 
 type PickerOverlayProps = SharedPickerProps & {
@@ -127,18 +144,83 @@ declare function PickerOverlay({ open, onClose, apikey, apiUrl, security, picker
  * A non-modal file drop target that renders in-place. Suitable for embedding
  * directly in a page (e.g. a form upload field) rather than as a modal overlay.
  *
- * Uses usePicker() internally; exposes the same filestack-parity callbacks as
- * PickerOverlay. Renders a file list with progress and remove/retry controls
- * below the drop zone.
+ * Composes the Dropzone, FileQueueRow, and ProgressBar primitives from the
+ * #194 foundation. All colors resolve from --uploader-* CSS variables —
+ * no hard-coded brand colors.
+ *
+ * States:
+ *   idle          — Dropzone shown, queue empty
+ *   dragging-over — Dropzone fills with accent-soft, label changes to
+ *                   "Drop to add files" (handled inside Dropzone via isDragOver)
+ *   queued        — Dropzone collapses; file list + Upload/Cancel shown
+ *   uploading     — File rows show per-file progress; aggregate ProgressBar shown
+ *   done          — Files show done state; onUploadDone fires
+ *
+ * The host supplies any surrounding form chrome (labels, Skip/Continue buttons)
+ * as normal JSX siblings — DropPane does not render those.
+ *
+ * @dsCard DropPane
  */
 
 type DropPaneProps = SharedPickerProps & {
+    /**
+     * Hint text shown below the Browse button in the dropzone.
+     * Default: "or click to browse · max 50 MB"
+     */
+    hint?: string;
     /** Additional CSS class(es) applied to the root element. */
     className?: string;
     /** Inline styles applied to the root element. */
     style?: React__default.CSSProperties;
 };
-declare function DropPane({ apikey, apiUrl, security, pickerOptions, onUploadDone, onFileUploadFinished, onFileUploadFailed, onCancel, className, style, }: DropPaneProps): React__default.JSX.Element;
+declare function DropPane({ apikey, apiUrl, security, pickerOptions, onUploadDone, onFileUploadFinished, onFileUploadFailed, onCancel, hint, className, style, }: DropPaneProps): React__default.JSX.Element;
+
+/**
+ * CameraCapture — in-picker webcam capture.
+ *
+ * Requests the device camera via getUserMedia, shows a live preview, and lets
+ * the user snap a still. The capture is reviewed (Retake / Use photo) before it
+ * leaves the component as a regular image `File`, so it flows into the picker
+ * queue identically to a dropped or browsed file — preview, edit, and upload.
+ *
+ * Front ('user') cameras are mirrored in both the preview and the captured
+ * still so the selfie matches what the user sees. The MediaStream is stopped on
+ * unmount, on capture (to release the camera indicator while reviewing), and on
+ * cancel.
+ *
+ * All colors resolve from --uploader-* CSS variables — no hard-coded brand
+ * colors. Used by PickerOverlay and DropPane.
+ *
+ * @dsCard CameraCapture
+ */
+
+/** True when the current environment can open a camera stream. */
+declare function isCameraSupported(): boolean;
+/**
+ * Decide whether the picker should offer the camera source, given the picker
+ * options and the current environment. The camera is offered when:
+ *   - the browser supports getUserMedia, AND
+ *   - the accept filter permits images, AND
+ *   - fromSources is unset or explicitly includes 'camera'.
+ */
+declare function shouldOfferCamera(options?: PickerOptions): boolean;
+type CameraCaptureProps = {
+    /** Called with the captured still when the user confirms "Use photo". */
+    onCapture: (file: File) => void;
+    /** Called when the user backs out without capturing. */
+    onCancel: () => void;
+    /** Which camera to prefer. 'user' = front (mirrored), 'environment' = rear. */
+    facingMode?: 'user' | 'environment';
+    /** Output MIME type for the still. Default 'image/jpeg'. */
+    outputType?: string;
+    /** Quality 0–1 for lossy output. Default 0.92. */
+    quality?: number;
+    /** Base name for the produced file (extension is derived). Default 'camera-photo'. */
+    fileNamePrefix?: string;
+    className?: string;
+    style?: React__default.CSSProperties;
+};
+declare function CameraCapture({ onCapture, onCancel, facingMode, outputType, quality, fileNamePrefix, className, style, }: CameraCaptureProps): React__default.JSX.Element;
 
 type UsePickerOptions = UploaderClientOptions & {
     pickerOptions?: PickerOptions;
@@ -205,4 +287,4 @@ type EditImageOptions = {
 };
 declare function editImage(file: File, opts?: EditImageOptions): Promise<File>;
 
-export { type CropArea, DropPane, type DropPaneProps, type EditImageOptions, FileResult, type Flip, ImageEditor, type ImageEditorProps, type PickerFile, type PickerFileState, type PickerOptions, PickerOverlay, type PickerOverlayProps, PickerResponse, type SharedPickerProps, UploaderClientOptions, type UsePickerOptions, type UsePickerResult, editImage, usePicker };
+export { CameraCapture, type CameraCaptureProps, type CropArea, DropPane, type DropPaneProps, type EditImageOptions, FileResult, type Flip, ImageEditor, type ImageEditorProps, type PickerFile, type PickerFileState, type PickerOptions, PickerOverlay, type PickerOverlayProps, PickerResponse, type SharedPickerProps, UploaderClientOptions, type UsePickerOptions, type UsePickerResult, editImage, isCameraSupported, shouldOfferCamera, usePicker };

package/dist/index.d.ts

@@ -42,10 +42,22 @@ type PickerOptions = {
     /** Maximum file size in bytes. Files above this are rejected at selection. */
     maxSize?: number;
     /**
-     * Upload sources. Currently only 'local_file_system' is supported (MVP).
-     * Extension point for webcam/URL/cloud pickers.
+     * Upload sources offered to the user.
+     *   'local_file_system' — drag-and-drop + Browse files (always available)
+     *   'camera'            — capture a photo from the device camera
+     *
+     * When omitted, all supported sources are offered (camera appears only when
+     * the browser supports getUserMedia and the picker accepts images). Pass an
+     * explicit list to restrict the sources — e.g. ['local_file_system'] hides
+     * the camera even where it is supported.
      */
-    fromSources?: Array<'local_file_system'>;
+    fromSources?: Array<'local_file_system' | 'camera'>;
+    /**
+     * Preferred camera when the 'camera' source is used.
+     *   'user'        — front / selfie camera (mirrored). Default.
+     *   'environment' — rear camera.
+     */
+    cameraFacingMode?: 'user' | 'environment';
 };
 /** Props shared by PickerOverlay and DropPane. */
 type SharedPickerProps = {
@@ -107,6 +119,11 @@ type UsePickerResult = {
  * Opens when `open={true}`. Calls `onClose` when the user dismisses via ESC,
  * the backdrop click, or the Cancel button. `onUploadDone` fires after all
  * selected files have been uploaded.
+ *
+ * Composes Dropzone, FileQueueRow, and ProgressBar primitives from the #194
+ * foundation — no hard-coded brand colors.
+ *
+ * @dsCard PickerOverlay
  */
 
 type PickerOverlayProps = SharedPickerProps & {
@@ -127,18 +144,83 @@ declare function PickerOverlay({ open, onClose, apikey, apiUrl, security, picker
  * A non-modal file drop target that renders in-place. Suitable for embedding
  * directly in a page (e.g. a form upload field) rather than as a modal overlay.
  *
- * Uses usePicker() internally; exposes the same filestack-parity callbacks as
- * PickerOverlay. Renders a file list with progress and remove/retry controls
- * below the drop zone.
+ * Composes the Dropzone, FileQueueRow, and ProgressBar primitives from the
+ * #194 foundation. All colors resolve from --uploader-* CSS variables —
+ * no hard-coded brand colors.
+ *
+ * States:
+ *   idle          — Dropzone shown, queue empty
+ *   dragging-over — Dropzone fills with accent-soft, label changes to
+ *                   "Drop to add files" (handled inside Dropzone via isDragOver)
+ *   queued        — Dropzone collapses; file list + Upload/Cancel shown
+ *   uploading     — File rows show per-file progress; aggregate ProgressBar shown
+ *   done          — Files show done state; onUploadDone fires
+ *
+ * The host supplies any surrounding form chrome (labels, Skip/Continue buttons)
+ * as normal JSX siblings — DropPane does not render those.
+ *
+ * @dsCard DropPane
  */
 
 type DropPaneProps = SharedPickerProps & {
+    /**
+     * Hint text shown below the Browse button in the dropzone.
+     * Default: "or click to browse · max 50 MB"
+     */
+    hint?: string;
     /** Additional CSS class(es) applied to the root element. */
     className?: string;
     /** Inline styles applied to the root element. */
     style?: React__default.CSSProperties;
 };
-declare function DropPane({ apikey, apiUrl, security, pickerOptions, onUploadDone, onFileUploadFinished, onFileUploadFailed, onCancel, className, style, }: DropPaneProps): React__default.JSX.Element;
+declare function DropPane({ apikey, apiUrl, security, pickerOptions, onUploadDone, onFileUploadFinished, onFileUploadFailed, onCancel, hint, className, style, }: DropPaneProps): React__default.JSX.Element;
+
+/**
+ * CameraCapture — in-picker webcam capture.
+ *
+ * Requests the device camera via getUserMedia, shows a live preview, and lets
+ * the user snap a still. The capture is reviewed (Retake / Use photo) before it
+ * leaves the component as a regular image `File`, so it flows into the picker
+ * queue identically to a dropped or browsed file — preview, edit, and upload.
+ *
+ * Front ('user') cameras are mirrored in both the preview and the captured
+ * still so the selfie matches what the user sees. The MediaStream is stopped on
+ * unmount, on capture (to release the camera indicator while reviewing), and on
+ * cancel.
+ *
+ * All colors resolve from --uploader-* CSS variables — no hard-coded brand
+ * colors. Used by PickerOverlay and DropPane.
+ *
+ * @dsCard CameraCapture
+ */
+
+/** True when the current environment can open a camera stream. */
+declare function isCameraSupported(): boolean;
+/**
+ * Decide whether the picker should offer the camera source, given the picker
+ * options and the current environment. The camera is offered when:
+ *   - the browser supports getUserMedia, AND
+ *   - the accept filter permits images, AND
+ *   - fromSources is unset or explicitly includes 'camera'.
+ */
+declare function shouldOfferCamera(options?: PickerOptions): boolean;
+type CameraCaptureProps = {
+    /** Called with the captured still when the user confirms "Use photo". */
+    onCapture: (file: File) => void;
+    /** Called when the user backs out without capturing. */
+    onCancel: () => void;
+    /** Which camera to prefer. 'user' = front (mirrored), 'environment' = rear. */
+    facingMode?: 'user' | 'environment';
+    /** Output MIME type for the still. Default 'image/jpeg'. */
+    outputType?: string;
+    /** Quality 0–1 for lossy output. Default 0.92. */
+    quality?: number;
+    /** Base name for the produced file (extension is derived). Default 'camera-photo'. */
+    fileNamePrefix?: string;
+    className?: string;
+    style?: React__default.CSSProperties;
+};
+declare function CameraCapture({ onCapture, onCancel, facingMode, outputType, quality, fileNamePrefix, className, style, }: CameraCaptureProps): React__default.JSX.Element;
 
 type UsePickerOptions = UploaderClientOptions & {
     pickerOptions?: PickerOptions;
@@ -205,4 +287,4 @@ type EditImageOptions = {
 };
 declare function editImage(file: File, opts?: EditImageOptions): Promise<File>;
 
-export { type CropArea, DropPane, type DropPaneProps, type EditImageOptions, FileResult, type Flip, ImageEditor, type ImageEditorProps, type PickerFile, type PickerFileState, type PickerOptions, PickerOverlay, type PickerOverlayProps, PickerResponse, type SharedPickerProps, UploaderClientOptions, type UsePickerOptions, type UsePickerResult, editImage, usePicker };
+export { CameraCapture, type CameraCaptureProps, type CropArea, DropPane, type DropPaneProps, type EditImageOptions, FileResult, type Flip, ImageEditor, type ImageEditorProps, type PickerFile, type PickerFileState, type PickerOptions, PickerOverlay, type PickerOverlayProps, PickerResponse, type SharedPickerProps, UploaderClientOptions, type UsePickerOptions, type UsePickerResult, editImage, isCameraSupported, shouldOfferCamera, usePicker };