@byline/admin 2.5.2 → 2.6.0

package/dist/fields/field-renderer.module.js

@@ -0,0 +1,8 @@
+import "./field-renderer_module.css";
+const field_renderer_module = {
+    "localized-wrap": "localized-wrap-bv51Y7",
+    localizedWrap: "localized-wrap-bv51Y7",
+    "localized-badge": "localized-badge-D5MrbH",
+    localizedBadge: "localized-badge-D5MrbH"
+};
+export default field_renderer_module;

package/dist/fields/field-renderer_module.css

@@ -0,0 +1,11 @@
+:is(.localized-wrap-bv51Y7, .byline-field-localized-wrap) {
+  position: relative;
+}
+
+:is(.localized-badge-D5MrbH, .byline-field-localized-badge) {
+  line-height: 1;
+  position: absolute;
+  top: 0;
+  right: 0;
+}
+

package/dist/fields/field-services-context.d.ts

@@ -0,0 +1,16 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+import { type ReactNode } from 'react';
+import type { BylineFieldServices } from './field-services-types';
+interface BylineFieldServicesProviderProps {
+    services: BylineFieldServices;
+    children: ReactNode;
+}
+export declare const BylineFieldServicesProvider: ({ services, children, }: BylineFieldServicesProviderProps) => import("react").JSX.Element;
+export declare const useBylineFieldServices: () => BylineFieldServices;
+export {};

package/dist/fields/field-services-context.js

@@ -0,0 +1,13 @@
+import { jsx } from "react/jsx-runtime";
+import { createContext, useContext } from "react";
+const FieldServicesContext = /*#__PURE__*/ createContext(null);
+const BylineFieldServicesProvider = ({ services, children })=>/*#__PURE__*/ jsx(FieldServicesContext.Provider, {
+        value: services,
+        children: children
+    });
+const useBylineFieldServices = ()=>{
+    const ctx = useContext(FieldServicesContext);
+    if (!ctx) throw new Error('@byline/ui: BylineFieldServicesProvider missing. Wrap your admin tree with <BylineFieldServicesProvider services={…} />.');
+    return ctx;
+};
+export { BylineFieldServicesProvider, useBylineFieldServices };

package/dist/fields/field-services-types.d.ts

@@ -0,0 +1,63 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+/**
+ * Framework-neutral function contracts that field/form components in
+ * `@byline/ui` need from the host application. The host wires concrete
+ * implementations via `BylineFieldServicesProvider` — typically thin
+ * adapters around TanStack Start server functions, Next.js server
+ * actions, or any other RPC-style transport.
+ */
+import type { StoredFileValue } from '@byline/core';
+export interface CollectionListParams {
+    page?: number;
+    page_size?: number;
+    order?: string;
+    desc?: boolean;
+    query?: string;
+    locale?: string;
+    status?: string;
+    fields?: string[];
+}
+export interface CollectionListDoc {
+    id: string;
+    path?: string;
+    [field: string]: unknown;
+}
+export interface CollectionListResponse {
+    docs: CollectionListDoc[];
+    meta: {
+        totalPages?: number;
+        [k: string]: unknown;
+    };
+    included: {
+        collection: {
+            id: string;
+            [k: string]: unknown;
+        };
+    };
+}
+export type GetCollectionDocumentsFn = (input: {
+    collection: string;
+    params: CollectionListParams;
+}) => Promise<CollectionListResponse>;
+export interface UploadedFileResult {
+    documentId?: string;
+    documentVersionId?: string;
+    /**
+     * The persisted file value, including the `variants` array with
+     * `storagePath`, `storageUrl`, `width`, `height`, and `format` for each
+     * generated derivative. Single source of truth — the legacy top-level
+     * `variants: { name, url }[]` is gone.
+     */
+    storedFile: StoredFileValue;
+}
+export type UploadFieldFn = (collection: string, formData: FormData, createDocument?: boolean) => Promise<UploadedFileResult>;
+export interface BylineFieldServices {
+    getCollectionDocuments: GetCollectionDocumentsFn;
+    uploadField: UploadFieldFn;
+}

package/dist/fields/field-services-types.js

@@ -0,0 +1 @@
+export { };

package/dist/fields/file/file-field.d.ts

@@ -0,0 +1,19 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+import { type FileField as FieldType, type StoredFileValue } from '@byline/core';
+interface FileFieldProps {
+    field: FieldType;
+    /** Collection path required to call the /upload endpoint. */
+    collectionPath?: string;
+    value?: StoredFileValue | null;
+    defaultValue?: StoredFileValue | null;
+    onChange?: (value: StoredFileValue | null) => void;
+    path?: string;
+}
+export declare const FileField: ({ field, collectionPath, value, defaultValue, onChange: _onChange, path, }: FileFieldProps) => import("react").JSX.Element;
+export {};

package/dist/fields/file/file-field.js

@@ -0,0 +1,225 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { isPendingStoredFileValue } from "@byline/core";
+import { useTranslation } from "@byline/i18n/react";
+import { CloseIcon, DocumentIcon, DownloadIcon, ErrorText, HelpText, IconButton, Label, LoaderRing, VideoIcon } from "@byline/ui/react";
+import classnames from "classnames";
+import { useFieldError, useFieldValue, useFormContext, useIsDirty, useIsFieldUploading } from "../../forms/form-context.js";
+import { useFieldChangeHandler } from "../use-field-change-handler.js";
+import file_field_module from "./file-field.module.js";
+import { FileUploadField } from "./file-upload-field.js";
+function triggerDownload(url, filename) {
+    if ("u" < typeof document) return;
+    const a = document.createElement('a');
+    a.href = url;
+    if (filename) a.download = filename;
+    a.target = '_blank';
+    a.rel = 'noreferrer';
+    document.body.appendChild(a);
+    a.click();
+    document.body.removeChild(a);
+}
+const FileField = ({ field, collectionPath, value, defaultValue, onChange: _onChange, path })=>{
+    const fieldPath = path ?? field.name;
+    const { t } = useTranslation('byline-admin');
+    const fieldError = useFieldError(fieldPath);
+    const isDirty = useIsDirty(fieldPath);
+    const fieldValue = useFieldValue(fieldPath);
+    const isUploading = useIsFieldUploading(fieldPath);
+    const { removePendingUpload } = useFormContext();
+    const handleChange = useFieldChangeHandler(field, fieldPath);
+    const incomingValue = isDirty ? fieldValue ?? null : value ?? fieldValue ?? defaultValue ?? null;
+    const isPending = isPendingStoredFileValue(incomingValue);
+    const isOldPlaceholder = (v)=>{
+        if (!v || 'object' != typeof v) return false;
+        const maybe = v;
+        return 'placeholder' === maybe.storageProvider && 'pending' === maybe.storagePath;
+    };
+    const showUploadWidget = null == incomingValue || isOldPlaceholder(incomingValue);
+    const handleRemove = ()=>{
+        if (isPending) removePendingUpload(fieldPath);
+        handleChange(null);
+    };
+    const isVideo = incomingValue?.mimeType?.startsWith('video/') === true;
+    const FileGlyph = isVideo ? VideoIcon : DocumentIcon;
+    const htmlId = fieldPath;
+    return /*#__PURE__*/ jsxs("div", {
+        className: `byline-field-file ${field.name}`,
+        children: [
+            /*#__PURE__*/ jsx("div", {
+                className: classnames('byline-field-file-header', file_field_module.header),
+                children: /*#__PURE__*/ jsx(Label, {
+                    id: htmlId,
+                    htmlFor: htmlId,
+                    label: field.label ?? field.name,
+                    required: !field.optional
+                })
+            }),
+            showUploadWidget ? collectionPath ? /*#__PURE__*/ jsx(FileUploadField, {
+                field: field,
+                collectionPath: collectionPath,
+                fieldPath: fieldPath,
+                onUploaded: (uploaded)=>{
+                    handleChange(uploaded);
+                }
+            }) : /*#__PURE__*/ jsx("div", {
+                className: classnames('byline-field-file-empty', file_field_module.empty),
+                children: t('fields.file.empty')
+            }) : /*#__PURE__*/ jsxs("div", {
+                className: classnames('byline-field-file-tile', file_field_module.tile),
+                children: [
+                    isUploading && /*#__PURE__*/ jsx("div", {
+                        className: classnames('byline-field-file-uploading', file_field_module.uploading),
+                        "aria-live": "polite",
+                        "aria-busy": "true",
+                        children: /*#__PURE__*/ jsx(LoaderRing, {})
+                    }),
+                    collectionPath && /*#__PURE__*/ jsxs("div", {
+                        className: classnames('byline-field-file-actions', file_field_module.actions),
+                        children: [
+                            !isPending && incomingValue?.storageUrl && /*#__PURE__*/ jsx(IconButton, {
+                                type: "button",
+                                intent: "noeffect",
+                                onClick: ()=>triggerDownload(incomingValue.storageUrl, incomingValue.originalFilename ?? incomingValue.filename),
+                                size: "xs",
+                                disabled: isUploading,
+                                "aria-label": t('fields.file.downloadAriaLabel'),
+                                children: /*#__PURE__*/ jsx(DownloadIcon, {
+                                    width: "15px",
+                                    height: "15px"
+                                })
+                            }),
+                            /*#__PURE__*/ jsx(IconButton, {
+                                type: "button",
+                                intent: "noeffect",
+                                onClick: handleRemove,
+                                size: "xs",
+                                disabled: isUploading,
+                                "aria-label": t('fields.file.removeAriaLabel'),
+                                children: /*#__PURE__*/ jsx(CloseIcon, {
+                                    width: "15px",
+                                    height: "15px"
+                                })
+                            })
+                        ]
+                    }),
+                    !isPending && incomingValue?.storageUrl ? /*#__PURE__*/ jsx("a", {
+                        href: incomingValue.storageUrl,
+                        target: "_blank",
+                        rel: "noreferrer",
+                        "aria-label": t('fields.file.openInNewTabAriaLabel', {
+                            filename: incomingValue.originalFilename ?? incomingValue.filename
+                        }),
+                        className: classnames('byline-field-file-icon-wrap', file_field_module["icon-wrap"]),
+                        children: /*#__PURE__*/ jsx(FileGlyph, {
+                            width: "48px",
+                            height: "48px",
+                            className: classnames('byline-field-file-icon', file_field_module.icon)
+                        })
+                    }) : /*#__PURE__*/ jsxs("div", {
+                        className: classnames('byline-field-file-icon-wrap', file_field_module["icon-wrap"]),
+                        children: [
+                            /*#__PURE__*/ jsx(FileGlyph, {
+                                width: "48px",
+                                height: "48px",
+                                className: classnames('byline-field-file-icon', file_field_module.icon)
+                            }),
+                            isPending && /*#__PURE__*/ jsx("div", {
+                                className: classnames('byline-field-file-pending', file_field_module.pending),
+                                children: t('fields.fileMeta.pendingUpload')
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ jsxs("div", {
+                        className: classnames('byline-field-file-meta', file_field_module.meta),
+                        children: [
+                            /*#__PURE__*/ jsxs("div", {
+                                children: [
+                                    /*#__PURE__*/ jsx("span", {
+                                        className: classnames('byline-field-file-meta-key', file_field_module["meta-key"]),
+                                        children: t('fields.fileMeta.filename')
+                                    }),
+                                    ' ',
+                                    incomingValue?.filename
+                                ]
+                            }),
+                            /*#__PURE__*/ jsxs("div", {
+                                children: [
+                                    /*#__PURE__*/ jsx("span", {
+                                        className: classnames('byline-field-file-meta-key', file_field_module["meta-key"]),
+                                        children: t('fields.fileMeta.original')
+                                    }),
+                                    ' ',
+                                    incomingValue?.originalFilename
+                                ]
+                            }),
+                            /*#__PURE__*/ jsxs("div", {
+                                children: [
+                                    /*#__PURE__*/ jsx("span", {
+                                        className: classnames('byline-field-file-meta-key', file_field_module["meta-key"]),
+                                        children: t('fields.fileMeta.type')
+                                    }),
+                                    ' ',
+                                    incomingValue?.mimeType
+                                ]
+                            }),
+                            /*#__PURE__*/ jsxs("div", {
+                                children: [
+                                    /*#__PURE__*/ jsx("span", {
+                                        className: classnames('byline-field-file-meta-key', file_field_module["meta-key"]),
+                                        children: t('fields.fileMeta.size')
+                                    }),
+                                    ' ',
+                                    incomingValue?.fileSize
+                                ]
+                            }),
+                            isPending ? /*#__PURE__*/ jsxs("div", {
+                                children: [
+                                    /*#__PURE__*/ jsx("span", {
+                                        className: classnames('byline-field-file-meta-key', file_field_module["meta-key"]),
+                                        children: t('fields.fileMeta.status')
+                                    }),
+                                    ' ',
+                                    /*#__PURE__*/ jsx("span", {
+                                        className: classnames('byline-field-file-meta-pending', file_field_module["meta-pending"]),
+                                        children: t('fields.fileMeta.willUploadOnSave')
+                                    })
+                                ]
+                            }) : /*#__PURE__*/ jsxs(Fragment, {
+                                children: [
+                                    /*#__PURE__*/ jsxs("div", {
+                                        children: [
+                                            /*#__PURE__*/ jsx("span", {
+                                                className: classnames('byline-field-file-meta-key', file_field_module["meta-key"]),
+                                                children: t('fields.fileMeta.storage')
+                                            }),
+                                            ' ',
+                                            incomingValue?.storageProvider
+                                        ]
+                                    }),
+                                    /*#__PURE__*/ jsxs("div", {
+                                        children: [
+                                            /*#__PURE__*/ jsx("span", {
+                                                className: classnames('byline-field-file-meta-key', file_field_module["meta-key"]),
+                                                children: t('fields.fileMeta.path')
+                                            }),
+                                            ' ',
+                                            incomingValue?.storagePath
+                                        ]
+                                    })
+                                ]
+                            })
+                        ]
+                    })
+                ]
+            }),
+            field.helpText && /*#__PURE__*/ jsx(HelpText, {
+                text: field.helpText
+            }),
+            fieldError && /*#__PURE__*/ jsx(ErrorText, {
+                id: `${field.name}-error`,
+                text: fieldError
+            })
+        ]
+    });
+};
+export { FileField };

package/dist/fields/file/file-field.module.js

@@ -0,0 +1,18 @@
+import "./file-field_module.css";
+const file_field_module = {
+    header: "header-4BiMwv",
+    actions: "actions-Yd3WIq",
+    empty: "empty-Afgknj",
+    tile: "tile-K1K1D_",
+    uploading: "uploading-KCIPa6",
+    "icon-wrap": "icon-wrap-TckWPs",
+    iconWrap: "icon-wrap-TckWPs",
+    icon: "icon-HnknJj",
+    pending: "pending-mh5ZKa",
+    meta: "meta-mm1UmQ",
+    "meta-key": "meta-key-q6cipk",
+    metaKey: "meta-key-q6cipk",
+    "meta-pending": "meta-pending-Q0ICzl",
+    metaPending: "meta-pending-Q0ICzl"
+};
+export default file_field_module;

package/dist/fields/file/file-field_module.css

@@ -0,0 +1,131 @@
+:is(.header-4BiMwv, .byline-field-file-header) {
+  align-items: baseline;
+  gap: var(--spacing-8);
+  margin-bottom: .25rem;
+  display: flex;
+}
+
+:is(.actions-Yd3WIq, .byline-field-file-actions) {
+  top: var(--spacing-6);
+  right: var(--spacing-6);
+  z-index: 1;
+  align-items: center;
+  gap: var(--spacing-4);
+  display: flex;
+  position: absolute;
+}
+
+.byline-field-file-actions .byline-button {
+  color: var(--gray-900);
+}
+
+:is(.dark .byline-field-file-actions .byline-button, [data-theme="dark"] .byline-field-file-actions .byline-button) {
+  color: var(--gray-200);
+}
+
+:is(.empty-Afgknj, .byline-field-file-empty) {
+  color: var(--gray-500);
+  font-size: var(--font-size-xs);
+  font-style: italic;
+}
+
+:is(.tile-K1K1D_, .byline-field-file-tile) {
+  gap: var(--spacing-16);
+  padding: var(--spacing-8);
+  border: var(--border-width-thin) var(--border-style-solid) var(--primary-500);
+  border-radius: var(--border-radius-md);
+  margin-top: .25rem;
+  display: flex;
+  position: relative;
+}
+
+:is(.uploading-KCIPa6, .byline-field-file-uploading) {
+  z-index: 2;
+  background-color: oklch(from var(--gray-950) l c h / .5);
+  border-radius: var(--border-radius-md);
+  justify-content: center;
+  align-items: center;
+  display: flex;
+  position: absolute;
+  inset: 0;
+}
+
+:is(.icon-wrap-TckWPs, .byline-field-file-icon-wrap) {
+  border: var(--border-width-thin) var(--border-style-solid) var(--gray-600);
+  border-radius: var(--border-radius-sm);
+  width: 4rem;
+  height: 4rem;
+  color: var(--gray-300);
+  flex-shrink: 0;
+  justify-content: center;
+  align-self: flex-start;
+  align-items: center;
+  display: flex;
+  position: relative;
+}
+
+a.icon-wrap-TckWPs {
+  cursor: pointer;
+  text-decoration: none;
+  transition: border-color .12s, color .12s;
+}
+
+a.byline-field-file-icon-wrap {
+  cursor: pointer;
+  text-decoration: none;
+  transition: border-color .12s, color .12s;
+}
+
+a.icon-wrap-TckWPs:hover {
+  border-color: var(--primary-500);
+  color: var(--primary-400);
+}
+
+a.byline-field-file-icon-wrap:hover {
+  border-color: var(--primary-500);
+  color: var(--primary-400);
+}
+
+a.icon-wrap-TckWPs:focus-visible {
+  outline: 2px solid var(--primary-500);
+  outline-offset: 2px;
+}
+
+a.byline-field-file-icon-wrap:focus-visible {
+  outline: 2px solid var(--primary-500);
+  outline-offset: 2px;
+}
+
+:is(.icon-HnknJj, .byline-field-file-icon) {
+  opacity: .85;
+}
+
+:is(.pending-mh5ZKa, .byline-field-file-pending) {
+  background-color: oklch(from var(--yellow-600) l c h / .9);
+  color: var(--yellow-100);
+  font-size: .6rem;
+  font-weight: var(--font-weight-medium);
+  border-radius: var(--border-radius-sm);
+  padding: .125rem .375rem;
+  position: absolute;
+  top: .25rem;
+  left: .25rem;
+}
+
+:is(.meta-mm1UmQ, .byline-field-file-meta) {
+  padding-right: var(--spacing-32);
+  color: var(--gray-200);
+  font-size: var(--font-size-xs);
+  flex-direction: column;
+  gap: .125rem;
+  display: flex;
+}
+
+:is(.meta-key-q6cipk, .byline-field-file-meta-key) {
+  font-weight: var(--font-weight-semibold);
+}
+
+:is(.meta-pending-Q0ICzl, .byline-field-file-meta-pending) {
+  color: var(--yellow-400);
+}
+

package/dist/fields/file/file-upload-field.d.ts

@@ -0,0 +1,21 @@
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+import { type FileField as FieldType, type PendingStoredFileValue, type StoredFileValue } from '@byline/core';
+interface FileUploadFieldProps {
+    field: FieldType;
+    /** Collection path used to build the upload URL (e.g. `'media'`). */
+    collectionPath: string;
+    /** Field path in the form (e.g. `'attachment'` or `'content.0.attachment'`). */
+    fieldPath: string;
+    /** Called with the PendingStoredFileValue for immediate UI update. */
+    onUploaded: (value: StoredFileValue | PendingStoredFileValue) => void;
+    /** Optional `accept` MIME-type / extension string for the native file input. */
+    accept?: string;
+}
+export declare const FileUploadField: ({ field: _field, collectionPath, fieldPath, onUploaded, accept, }: FileUploadFieldProps) => import("react").JSX.Element;
+export {};

package/dist/fields/file/file-upload-field.js

@@ -0,0 +1,130 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useCallback, useRef, useState } from "react";
+import { createPendingStoredFileValue } from "@byline/core";
+import { useTranslation } from "@byline/i18n/react";
+import classnames from "classnames";
+import { useFormContext } from "../../forms/form-context.js";
+import file_upload_field_module from "./file-upload-field.module.js";
+const FileUploadField = ({ field: _field, collectionPath, fieldPath, onUploaded, accept })=>{
+    const inputRef = useRef(null);
+    const { t } = useTranslation('byline-admin');
+    const [status, setStatus] = useState('idle');
+    const [errorMessage, setErrorMessage] = useState(null);
+    const [isDragOver, setIsDragOver] = useState(false);
+    const { addPendingUpload } = useFormContext();
+    const handleFileSelected = useCallback((file)=>{
+        setStatus('processing');
+        setErrorMessage(null);
+        const previewUrl = URL.createObjectURL(file);
+        const pendingValue = createPendingStoredFileValue(file, previewUrl);
+        addPendingUpload(fieldPath, {
+            file,
+            previewUrl,
+            collectionPath
+        });
+        setStatus('idle');
+        onUploaded(pendingValue);
+    }, [
+        collectionPath,
+        fieldPath,
+        addPendingUpload,
+        onUploaded
+    ]);
+    const handleFileChange = useCallback((e)=>{
+        const file = e.target.files?.[0];
+        if (file) handleFileSelected(file);
+        e.target.value = '';
+    }, [
+        handleFileSelected
+    ]);
+    const handleBrowseClick = useCallback(()=>{
+        inputRef.current?.click();
+    }, []);
+    const handleDragOver = useCallback((e)=>{
+        e.preventDefault();
+        setIsDragOver(true);
+    }, []);
+    const handleDragLeave = useCallback((e)=>{
+        e.preventDefault();
+        setIsDragOver(false);
+    }, []);
+    const handleDrop = useCallback((e)=>{
+        e.preventDefault();
+        setIsDragOver(false);
+        const file = e.dataTransfer.files?.[0];
+        if (file) handleFileSelected(file);
+    }, [
+        handleFileSelected
+    ]);
+    const isProcessing = 'processing' === status;
+    return /*#__PURE__*/ jsxs("div", {
+        className: classnames('byline-field-file-upload', file_upload_field_module.root),
+        children: [
+            /*#__PURE__*/ jsx("input", {
+                ref: inputRef,
+                type: "file",
+                accept: accept,
+                className: classnames('byline-field-file-upload-input', file_upload_field_module.input),
+                onChange: handleFileChange,
+                disabled: isProcessing,
+                "aria-hidden": "true",
+                tabIndex: -1
+            }),
+            /*#__PURE__*/ jsxs("div", {
+                role: "button",
+                tabIndex: 0,
+                "aria-label": t('fields.file.upload.zoneAriaLabel'),
+                onDragOver: handleDragOver,
+                onDragLeave: handleDragLeave,
+                onDrop: handleDrop,
+                onClick: handleBrowseClick,
+                onKeyDown: (e)=>{
+                    if ('Enter' === e.key || ' ' === e.key) {
+                        e.preventDefault();
+                        handleBrowseClick();
+                    }
+                },
+                className: classnames('byline-field-file-upload-zone', file_upload_field_module.zone, isDragOver && !isProcessing && [
+                    'byline-field-file-upload-zone-active',
+                    file_upload_field_module["zone-active"]
+                ], isProcessing && [
+                    'byline-field-file-upload-zone-busy',
+                    file_upload_field_module["zone-busy"]
+                ]),
+                children: [
+                    /*#__PURE__*/ jsx("svg", {
+                        xmlns: "http://www.w3.org/2000/svg",
+                        className: classnames('byline-field-file-upload-icon', file_upload_field_module.icon),
+                        fill: "none",
+                        viewBox: "0 0 24 24",
+                        stroke: "currentColor",
+                        strokeWidth: 1.5,
+                        "aria-hidden": "true",
+                        children: /*#__PURE__*/ jsx("path", {
+                            strokeLinecap: "round",
+                            strokeLinejoin: "round",
+                            d: "M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5"
+                        })
+                    }),
+                    /*#__PURE__*/ jsxs("span", {
+                        className: classnames('byline-field-file-upload-label', file_upload_field_module.label),
+                        children: [
+                            t('fields.file.upload.label'),
+                            ' ',
+                            /*#__PURE__*/ jsx("span", {
+                                className: classnames('byline-field-file-upload-action', file_upload_field_module.action),
+                                children: t('fields.file.upload.browse')
+                            })
+                        ]
+                    })
+                ]
+            }),
+            'error' === status && errorMessage && /*#__PURE__*/ jsx("p", {
+                className: classnames('byline-field-file-upload-error', file_upload_field_module.error),
+                role: "alert",
+                children: errorMessage
+            })
+        ]
+    });
+};
+export { FileUploadField };