@orion-studios/payload-studio 0.6.0-beta.118 → 0.6.0-beta.119
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/admin/client.mjs
CHANGED
|
@@ -662,6 +662,23 @@ var parseJsonRecord = (value) => {
|
|
|
662
662
|
};
|
|
663
663
|
var serializeJsonRecord = (value) => JSON.stringify(value);
|
|
664
664
|
var normalizeCssColor = (value) => typeof value === "string" && value.trim() && value.trim() !== "none" ? value.trim() : "";
|
|
665
|
+
var withoutUndoTracking = (editor, callback) => {
|
|
666
|
+
const undoManager = editor?.UndoManager;
|
|
667
|
+
if (typeof undoManager?.skip === "function") {
|
|
668
|
+
undoManager.skip(callback);
|
|
669
|
+
return;
|
|
670
|
+
}
|
|
671
|
+
if (typeof undoManager?.stop === "function" && typeof undoManager?.start === "function") {
|
|
672
|
+
undoManager.stop();
|
|
673
|
+
try {
|
|
674
|
+
callback();
|
|
675
|
+
} finally {
|
|
676
|
+
undoManager.start();
|
|
677
|
+
}
|
|
678
|
+
return;
|
|
679
|
+
}
|
|
680
|
+
callback();
|
|
681
|
+
};
|
|
665
682
|
var defaultBackgroundForComponent = (type, props) => {
|
|
666
683
|
const block = parseJsonRecord(props.block);
|
|
667
684
|
const explicit = normalizeCssColor(block.backgroundColor) || normalizeCssColor(props.backgroundColor);
|
|
@@ -1071,14 +1088,16 @@ var registerProjectDynamicComponents = (editor, adapter) => {
|
|
|
1071
1088
|
renderPreview() {
|
|
1072
1089
|
const attributes = this.model.getAttributes?.() || {};
|
|
1073
1090
|
const props = propsFromAttributes(attributes);
|
|
1074
|
-
|
|
1075
|
-
|
|
1076
|
-
this.model.
|
|
1077
|
-
|
|
1078
|
-
|
|
1079
|
-
|
|
1080
|
-
|
|
1081
|
-
|
|
1091
|
+
withoutUndoTracking(editor, () => {
|
|
1092
|
+
const backgroundColor = defaultBackgroundForComponent(type, props);
|
|
1093
|
+
if (backgroundColor && !normalizeCssColor(this.model.getStyle?.()?.["background-color"])) {
|
|
1094
|
+
this.model.addStyle?.({ "background-color": backgroundColor });
|
|
1095
|
+
this.model.addAttributes?.({ "data-orion-background-color": backgroundColor });
|
|
1096
|
+
}
|
|
1097
|
+
this.model.components(previewForDefinition(definition, props));
|
|
1098
|
+
hoistPreviewSpacingToModel(this);
|
|
1099
|
+
lockPreviewChildren(this.model);
|
|
1100
|
+
});
|
|
1082
1101
|
queueMicrotask(() => bindEditablePreview(this, editor));
|
|
1083
1102
|
}
|
|
1084
1103
|
}
|
|
@@ -538,6 +538,23 @@ var parseJsonRecord = (value) => {
|
|
|
538
538
|
};
|
|
539
539
|
var serializeJsonRecord = (value) => JSON.stringify(value);
|
|
540
540
|
var normalizeCssColor = (value) => typeof value === "string" && value.trim() && value.trim() !== "none" ? value.trim() : "";
|
|
541
|
+
var withoutUndoTracking = (editor, callback) => {
|
|
542
|
+
const undoManager = editor?.UndoManager;
|
|
543
|
+
if (typeof undoManager?.skip === "function") {
|
|
544
|
+
undoManager.skip(callback);
|
|
545
|
+
return;
|
|
546
|
+
}
|
|
547
|
+
if (typeof undoManager?.stop === "function" && typeof undoManager?.start === "function") {
|
|
548
|
+
undoManager.stop();
|
|
549
|
+
try {
|
|
550
|
+
callback();
|
|
551
|
+
} finally {
|
|
552
|
+
undoManager.start();
|
|
553
|
+
}
|
|
554
|
+
return;
|
|
555
|
+
}
|
|
556
|
+
callback();
|
|
557
|
+
};
|
|
541
558
|
var defaultBackgroundForComponent = (type, props) => {
|
|
542
559
|
const block = parseJsonRecord(props.block);
|
|
543
560
|
const explicit = normalizeCssColor(block.backgroundColor) || normalizeCssColor(props.backgroundColor);
|
|
@@ -947,14 +964,16 @@ var registerProjectDynamicComponents = (editor, adapter) => {
|
|
|
947
964
|
renderPreview() {
|
|
948
965
|
const attributes = this.model.getAttributes?.() || {};
|
|
949
966
|
const props = propsFromAttributes(attributes);
|
|
950
|
-
|
|
951
|
-
|
|
952
|
-
this.model.
|
|
953
|
-
|
|
954
|
-
|
|
955
|
-
|
|
956
|
-
|
|
957
|
-
|
|
967
|
+
withoutUndoTracking(editor, () => {
|
|
968
|
+
const backgroundColor = defaultBackgroundForComponent(type, props);
|
|
969
|
+
if (backgroundColor && !normalizeCssColor(this.model.getStyle?.()?.["background-color"])) {
|
|
970
|
+
this.model.addStyle?.({ "background-color": backgroundColor });
|
|
971
|
+
this.model.addAttributes?.({ "data-orion-background-color": backgroundColor });
|
|
972
|
+
}
|
|
973
|
+
this.model.components(previewForDefinition(definition, props));
|
|
974
|
+
hoistPreviewSpacingToModel(this);
|
|
975
|
+
lockPreviewChildren(this.model);
|
|
976
|
+
});
|
|
958
977
|
queueMicrotask(() => bindEditablePreview(this, editor));
|
|
959
978
|
}
|
|
960
979
|
}
|
|
@@ -734,13 +734,124 @@ function HeaderNavEditorWithPreview({
|
|
|
734
734
|
] });
|
|
735
735
|
}
|
|
736
736
|
|
|
737
|
-
// src/admin-app/components/
|
|
737
|
+
// src/admin-app/components/MediaDetailPanel.tsx
|
|
738
|
+
import { useState as useState4 } from "react";
|
|
738
739
|
import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
739
740
|
function formatFileSize(bytes) {
|
|
740
741
|
if (bytes < 1024) return `${bytes} B`;
|
|
741
742
|
if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
|
|
742
743
|
return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
|
|
743
744
|
}
|
|
745
|
+
function MediaDetailPanel({
|
|
746
|
+
id,
|
|
747
|
+
filename,
|
|
748
|
+
alt,
|
|
749
|
+
url,
|
|
750
|
+
filesize,
|
|
751
|
+
width,
|
|
752
|
+
height,
|
|
753
|
+
mimeType,
|
|
754
|
+
createdAt,
|
|
755
|
+
updateAction,
|
|
756
|
+
deleteAction
|
|
757
|
+
}) {
|
|
758
|
+
const [copied, setCopied] = useState4(false);
|
|
759
|
+
const [confirmDelete, setConfirmDelete] = useState4(false);
|
|
760
|
+
const copyUrl = async () => {
|
|
761
|
+
if (!url) return;
|
|
762
|
+
try {
|
|
763
|
+
await navigator.clipboard.writeText(url);
|
|
764
|
+
setCopied(true);
|
|
765
|
+
setTimeout(() => setCopied(false), 2e3);
|
|
766
|
+
} catch {
|
|
767
|
+
const input = document.createElement("input");
|
|
768
|
+
input.value = url;
|
|
769
|
+
document.body.appendChild(input);
|
|
770
|
+
input.select();
|
|
771
|
+
document.execCommand("copy");
|
|
772
|
+
document.body.removeChild(input);
|
|
773
|
+
setCopied(true);
|
|
774
|
+
setTimeout(() => setCopied(false), 2e3);
|
|
775
|
+
}
|
|
776
|
+
};
|
|
777
|
+
const metaRows = [];
|
|
778
|
+
if (filename) metaRows.push({ label: "Filename", value: filename });
|
|
779
|
+
if (typeof filesize === "number") metaRows.push({ label: "File size", value: formatFileSize(filesize) });
|
|
780
|
+
if (typeof width === "number" && typeof height === "number") metaRows.push({ label: "Dimensions", value: `${width} \xD7 ${height} px` });
|
|
781
|
+
if (mimeType) metaRows.push({ label: "Type", value: mimeType });
|
|
782
|
+
if (createdAt) {
|
|
783
|
+
try {
|
|
784
|
+
metaRows.push({ label: "Uploaded", value: new Date(createdAt).toLocaleDateString() });
|
|
785
|
+
} catch {
|
|
786
|
+
metaRows.push({ label: "Uploaded", value: createdAt });
|
|
787
|
+
}
|
|
788
|
+
}
|
|
789
|
+
return /* @__PURE__ */ jsxs5("div", { className: "orion-admin-grid", style: { alignItems: "start" }, children: [
|
|
790
|
+
/* @__PURE__ */ jsxs5("div", { children: [
|
|
791
|
+
/* @__PURE__ */ jsx5("div", { className: "orion-admin-card", children: url ? /* @__PURE__ */ jsx5("img", { alt: alt || filename || "Media", src: url, style: { borderRadius: 12, width: "100%" } }) : /* @__PURE__ */ jsx5("span", { children: "No preview available." }) }),
|
|
792
|
+
url ? /* @__PURE__ */ jsx5(
|
|
793
|
+
"button",
|
|
794
|
+
{
|
|
795
|
+
className: "orion-admin-action-button",
|
|
796
|
+
onClick: copyUrl,
|
|
797
|
+
style: { marginTop: "0.6rem", width: "100%" },
|
|
798
|
+
type: "button",
|
|
799
|
+
children: copied ? "Copied!" : "Copy URL"
|
|
800
|
+
}
|
|
801
|
+
) : null
|
|
802
|
+
] }),
|
|
803
|
+
/* @__PURE__ */ jsxs5("div", { style: { display: "grid", gap: "0.8rem" }, children: [
|
|
804
|
+
metaRows.length > 0 ? /* @__PURE__ */ jsx5("div", { className: "orion-admin-card orion-admin-meta-table", children: metaRows.map((row) => /* @__PURE__ */ jsxs5("div", { className: "orion-admin-meta-row", children: [
|
|
805
|
+
/* @__PURE__ */ jsx5("span", { className: "orion-admin-meta-label", children: row.label }),
|
|
806
|
+
/* @__PURE__ */ jsx5("span", { className: "orion-admin-meta-value", children: row.value })
|
|
807
|
+
] }, row.label)) }) : null,
|
|
808
|
+
/* @__PURE__ */ jsxs5("form", { action: updateAction, className: "orion-admin-form", children: [
|
|
809
|
+
/* @__PURE__ */ jsx5("input", { name: "id", type: "hidden", value: id }),
|
|
810
|
+
/* @__PURE__ */ jsxs5("label", { children: [
|
|
811
|
+
"Alt text",
|
|
812
|
+
/* @__PURE__ */ jsx5("input", { defaultValue: alt || "", name: "alt", required: true, type: "text" })
|
|
813
|
+
] }),
|
|
814
|
+
/* @__PURE__ */ jsx5("button", { type: "submit", children: "Save" })
|
|
815
|
+
] }),
|
|
816
|
+
confirmDelete ? /* @__PURE__ */ jsxs5("div", { className: "orion-admin-form", style: { borderColor: "#b42318" }, children: [
|
|
817
|
+
/* @__PURE__ */ jsx5("p", { style: { fontWeight: 700, margin: 0 }, children: "Are you sure you want to delete this asset?" }),
|
|
818
|
+
/* @__PURE__ */ jsx5("p", { style: { color: "var(--orion-admin-muted)", fontSize: "0.9rem", margin: 0 }, children: "This action cannot be undone." }),
|
|
819
|
+
/* @__PURE__ */ jsxs5("div", { style: { display: "flex", gap: "0.5rem" }, children: [
|
|
820
|
+
/* @__PURE__ */ jsxs5("form", { action: deleteAction, style: { flex: 1 }, children: [
|
|
821
|
+
/* @__PURE__ */ jsx5("input", { name: "id", type: "hidden", value: id }),
|
|
822
|
+
/* @__PURE__ */ jsx5("button", { style: { background: "#b42318", border: 0, borderRadius: 10, color: "#fff", cursor: "pointer", fontWeight: 800, padding: "0.55rem 0.8rem", width: "100%" }, type: "submit", children: "Yes, Delete" })
|
|
823
|
+
] }),
|
|
824
|
+
/* @__PURE__ */ jsx5(
|
|
825
|
+
"button",
|
|
826
|
+
{
|
|
827
|
+
onClick: () => setConfirmDelete(false),
|
|
828
|
+
style: { background: "transparent", border: "1px solid var(--orion-admin-border)", borderRadius: 10, cursor: "pointer", flex: 1, fontWeight: 700, padding: "0.55rem 0.8rem" },
|
|
829
|
+
type: "button",
|
|
830
|
+
children: "Cancel"
|
|
831
|
+
}
|
|
832
|
+
)
|
|
833
|
+
] })
|
|
834
|
+
] }) : /* @__PURE__ */ jsx5(
|
|
835
|
+
"button",
|
|
836
|
+
{
|
|
837
|
+
className: "orion-admin-action-button",
|
|
838
|
+
onClick: () => setConfirmDelete(true),
|
|
839
|
+
style: { background: "#b42318" },
|
|
840
|
+
type: "button",
|
|
841
|
+
children: "Delete Asset"
|
|
842
|
+
}
|
|
843
|
+
)
|
|
844
|
+
] })
|
|
845
|
+
] });
|
|
846
|
+
}
|
|
847
|
+
|
|
848
|
+
// src/admin-app/components/MediaListItem.tsx
|
|
849
|
+
import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
850
|
+
function formatFileSize2(bytes) {
|
|
851
|
+
if (bytes < 1024) return `${bytes} B`;
|
|
852
|
+
if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
|
|
853
|
+
return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
|
|
854
|
+
}
|
|
744
855
|
function MediaListItem({
|
|
745
856
|
id,
|
|
746
857
|
filename,
|
|
@@ -755,26 +866,26 @@ function MediaListItem({
|
|
|
755
866
|
const label = filename || `Media ${id}`;
|
|
756
867
|
const altText = alt || "";
|
|
757
868
|
const metaParts = [];
|
|
758
|
-
if (typeof filesize === "number") metaParts.push(
|
|
869
|
+
if (typeof filesize === "number") metaParts.push(formatFileSize2(filesize));
|
|
759
870
|
if (typeof width === "number" && typeof height === "number") metaParts.push(`${width}\xD7${height}`);
|
|
760
871
|
if (typeof mimeType === "string") metaParts.push(mimeType);
|
|
761
|
-
return /* @__PURE__ */
|
|
762
|
-
/* @__PURE__ */
|
|
763
|
-
url ? /* @__PURE__ */
|
|
764
|
-
/* @__PURE__ */
|
|
765
|
-
/* @__PURE__ */
|
|
766
|
-
/* @__PURE__ */
|
|
767
|
-
metaParts.length > 0 ? /* @__PURE__ */
|
|
872
|
+
return /* @__PURE__ */ jsxs6("a", { className: "orion-admin-list-item", href, children: [
|
|
873
|
+
/* @__PURE__ */ jsxs6("div", { style: { alignItems: "center", display: "flex", gap: "0.8rem" }, children: [
|
|
874
|
+
url ? /* @__PURE__ */ jsx6("img", { alt: altText || label, className: "orion-admin-media-preview", src: url }) : null,
|
|
875
|
+
/* @__PURE__ */ jsxs6("div", { children: [
|
|
876
|
+
/* @__PURE__ */ jsx6("strong", { children: label }),
|
|
877
|
+
/* @__PURE__ */ jsx6("div", { className: "orion-admin-list-meta", children: altText || "No alt text" }),
|
|
878
|
+
metaParts.length > 0 ? /* @__PURE__ */ jsx6("div", { className: "orion-admin-list-meta", style: { marginTop: "0.15rem" }, children: metaParts.join(" \xB7 ") }) : null
|
|
768
879
|
] })
|
|
769
880
|
] }),
|
|
770
|
-
/* @__PURE__ */
|
|
881
|
+
/* @__PURE__ */ jsx6("span", { className: "orion-admin-list-meta", children: "Edit" })
|
|
771
882
|
] });
|
|
772
883
|
}
|
|
773
884
|
|
|
774
885
|
// src/admin-app/components/MediaUploadForm.tsx
|
|
775
|
-
import { useState as
|
|
886
|
+
import { useState as useState5, useRef, useCallback } from "react";
|
|
776
887
|
import { useRouter } from "next/navigation";
|
|
777
|
-
import { jsx as
|
|
888
|
+
import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
778
889
|
var MEDIA_LIBRARY_SYNC_EVENT = "orion-media-library-updated";
|
|
779
890
|
var notifyMediaLibraryUpdated = () => {
|
|
780
891
|
if (typeof window === "undefined") {
|
|
@@ -815,12 +926,12 @@ var parseUploadError = async (response) => {
|
|
|
815
926
|
function MediaUploadForm() {
|
|
816
927
|
const router = useRouter();
|
|
817
928
|
const fileInputRef = useRef(null);
|
|
818
|
-
const [alt, setAlt] =
|
|
819
|
-
const [file, setFile] =
|
|
820
|
-
const [preview, setPreview] =
|
|
821
|
-
const [dragging, setDragging] =
|
|
822
|
-
const [submitting, setSubmitting] =
|
|
823
|
-
const [error, setError] =
|
|
929
|
+
const [alt, setAlt] = useState5("");
|
|
930
|
+
const [file, setFile] = useState5(null);
|
|
931
|
+
const [preview, setPreview] = useState5(null);
|
|
932
|
+
const [dragging, setDragging] = useState5(false);
|
|
933
|
+
const [submitting, setSubmitting] = useState5(false);
|
|
934
|
+
const [error, setError] = useState5(null);
|
|
824
935
|
const handleFile = useCallback((selectedFile) => {
|
|
825
936
|
setFile(selectedFile);
|
|
826
937
|
if (preview) {
|
|
@@ -888,10 +999,10 @@ function MediaUploadForm() {
|
|
|
888
999
|
setSubmitting(false);
|
|
889
1000
|
}
|
|
890
1001
|
};
|
|
891
|
-
return /* @__PURE__ */
|
|
892
|
-
/* @__PURE__ */
|
|
1002
|
+
return /* @__PURE__ */ jsxs7("form", { className: "orion-admin-upload-form", onSubmit: upload, children: [
|
|
1003
|
+
/* @__PURE__ */ jsxs7("label", { children: [
|
|
893
1004
|
"Alt text",
|
|
894
|
-
/* @__PURE__ */
|
|
1005
|
+
/* @__PURE__ */ jsx7(
|
|
895
1006
|
"input",
|
|
896
1007
|
{
|
|
897
1008
|
onChange: (event) => setAlt(event.target.value),
|
|
@@ -901,7 +1012,7 @@ function MediaUploadForm() {
|
|
|
901
1012
|
}
|
|
902
1013
|
)
|
|
903
1014
|
] }),
|
|
904
|
-
/* @__PURE__ */
|
|
1015
|
+
/* @__PURE__ */ jsxs7(
|
|
905
1016
|
"div",
|
|
906
1017
|
{
|
|
907
1018
|
className: `orion-admin-dropzone${dragging ? " is-dragging" : ""}${file ? " has-file" : ""}`,
|
|
@@ -910,14 +1021,14 @@ function MediaUploadForm() {
|
|
|
910
1021
|
onDragOver,
|
|
911
1022
|
onDrop,
|
|
912
1023
|
children: [
|
|
913
|
-
preview ? /* @__PURE__ */
|
|
914
|
-
/* @__PURE__ */
|
|
915
|
-
/* @__PURE__ */
|
|
916
|
-
] }) : /* @__PURE__ */
|
|
917
|
-
/* @__PURE__ */
|
|
918
|
-
/* @__PURE__ */
|
|
1024
|
+
preview ? /* @__PURE__ */ jsxs7("div", { className: "orion-admin-dropzone-preview", children: [
|
|
1025
|
+
/* @__PURE__ */ jsx7("img", { alt: "Upload preview", src: preview }),
|
|
1026
|
+
/* @__PURE__ */ jsx7("span", { children: file?.name })
|
|
1027
|
+
] }) : /* @__PURE__ */ jsxs7("div", { className: "orion-admin-dropzone-label", children: [
|
|
1028
|
+
/* @__PURE__ */ jsx7("strong", { children: "Drop an image here" }),
|
|
1029
|
+
/* @__PURE__ */ jsx7("span", { children: "or click to browse" })
|
|
919
1030
|
] }),
|
|
920
|
-
/* @__PURE__ */
|
|
1031
|
+
/* @__PURE__ */ jsx7(
|
|
921
1032
|
"input",
|
|
922
1033
|
{
|
|
923
1034
|
accept: "image/*",
|
|
@@ -930,119 +1041,8 @@ function MediaUploadForm() {
|
|
|
930
1041
|
]
|
|
931
1042
|
}
|
|
932
1043
|
),
|
|
933
|
-
error ? /* @__PURE__ */
|
|
934
|
-
/* @__PURE__ */
|
|
935
|
-
] });
|
|
936
|
-
}
|
|
937
|
-
|
|
938
|
-
// src/admin-app/components/MediaDetailPanel.tsx
|
|
939
|
-
import { useState as useState5 } from "react";
|
|
940
|
-
import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
941
|
-
function formatFileSize2(bytes) {
|
|
942
|
-
if (bytes < 1024) return `${bytes} B`;
|
|
943
|
-
if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
|
|
944
|
-
return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
|
|
945
|
-
}
|
|
946
|
-
function MediaDetailPanel({
|
|
947
|
-
id,
|
|
948
|
-
filename,
|
|
949
|
-
alt,
|
|
950
|
-
url,
|
|
951
|
-
filesize,
|
|
952
|
-
width,
|
|
953
|
-
height,
|
|
954
|
-
mimeType,
|
|
955
|
-
createdAt,
|
|
956
|
-
updateAction,
|
|
957
|
-
deleteAction
|
|
958
|
-
}) {
|
|
959
|
-
const [copied, setCopied] = useState5(false);
|
|
960
|
-
const [confirmDelete, setConfirmDelete] = useState5(false);
|
|
961
|
-
const copyUrl = async () => {
|
|
962
|
-
if (!url) return;
|
|
963
|
-
try {
|
|
964
|
-
await navigator.clipboard.writeText(url);
|
|
965
|
-
setCopied(true);
|
|
966
|
-
setTimeout(() => setCopied(false), 2e3);
|
|
967
|
-
} catch {
|
|
968
|
-
const input = document.createElement("input");
|
|
969
|
-
input.value = url;
|
|
970
|
-
document.body.appendChild(input);
|
|
971
|
-
input.select();
|
|
972
|
-
document.execCommand("copy");
|
|
973
|
-
document.body.removeChild(input);
|
|
974
|
-
setCopied(true);
|
|
975
|
-
setTimeout(() => setCopied(false), 2e3);
|
|
976
|
-
}
|
|
977
|
-
};
|
|
978
|
-
const metaRows = [];
|
|
979
|
-
if (filename) metaRows.push({ label: "Filename", value: filename });
|
|
980
|
-
if (typeof filesize === "number") metaRows.push({ label: "File size", value: formatFileSize2(filesize) });
|
|
981
|
-
if (typeof width === "number" && typeof height === "number") metaRows.push({ label: "Dimensions", value: `${width} \xD7 ${height} px` });
|
|
982
|
-
if (mimeType) metaRows.push({ label: "Type", value: mimeType });
|
|
983
|
-
if (createdAt) {
|
|
984
|
-
try {
|
|
985
|
-
metaRows.push({ label: "Uploaded", value: new Date(createdAt).toLocaleDateString() });
|
|
986
|
-
} catch {
|
|
987
|
-
metaRows.push({ label: "Uploaded", value: createdAt });
|
|
988
|
-
}
|
|
989
|
-
}
|
|
990
|
-
return /* @__PURE__ */ jsxs7("div", { className: "orion-admin-grid", style: { alignItems: "start" }, children: [
|
|
991
|
-
/* @__PURE__ */ jsxs7("div", { children: [
|
|
992
|
-
/* @__PURE__ */ jsx7("div", { className: "orion-admin-card", children: url ? /* @__PURE__ */ jsx7("img", { alt: alt || filename || "Media", src: url, style: { borderRadius: 12, width: "100%" } }) : /* @__PURE__ */ jsx7("span", { children: "No preview available." }) }),
|
|
993
|
-
url ? /* @__PURE__ */ jsx7(
|
|
994
|
-
"button",
|
|
995
|
-
{
|
|
996
|
-
className: "orion-admin-action-button",
|
|
997
|
-
onClick: copyUrl,
|
|
998
|
-
style: { marginTop: "0.6rem", width: "100%" },
|
|
999
|
-
type: "button",
|
|
1000
|
-
children: copied ? "Copied!" : "Copy URL"
|
|
1001
|
-
}
|
|
1002
|
-
) : null
|
|
1003
|
-
] }),
|
|
1004
|
-
/* @__PURE__ */ jsxs7("div", { style: { display: "grid", gap: "0.8rem" }, children: [
|
|
1005
|
-
metaRows.length > 0 ? /* @__PURE__ */ jsx7("div", { className: "orion-admin-card orion-admin-meta-table", children: metaRows.map((row) => /* @__PURE__ */ jsxs7("div", { className: "orion-admin-meta-row", children: [
|
|
1006
|
-
/* @__PURE__ */ jsx7("span", { className: "orion-admin-meta-label", children: row.label }),
|
|
1007
|
-
/* @__PURE__ */ jsx7("span", { className: "orion-admin-meta-value", children: row.value })
|
|
1008
|
-
] }, row.label)) }) : null,
|
|
1009
|
-
/* @__PURE__ */ jsxs7("form", { action: updateAction, className: "orion-admin-form", children: [
|
|
1010
|
-
/* @__PURE__ */ jsx7("input", { name: "id", type: "hidden", value: id }),
|
|
1011
|
-
/* @__PURE__ */ jsxs7("label", { children: [
|
|
1012
|
-
"Alt text",
|
|
1013
|
-
/* @__PURE__ */ jsx7("input", { defaultValue: alt || "", name: "alt", required: true, type: "text" })
|
|
1014
|
-
] }),
|
|
1015
|
-
/* @__PURE__ */ jsx7("button", { type: "submit", children: "Save" })
|
|
1016
|
-
] }),
|
|
1017
|
-
confirmDelete ? /* @__PURE__ */ jsxs7("div", { className: "orion-admin-form", style: { borderColor: "#b42318" }, children: [
|
|
1018
|
-
/* @__PURE__ */ jsx7("p", { style: { fontWeight: 700, margin: 0 }, children: "Are you sure you want to delete this asset?" }),
|
|
1019
|
-
/* @__PURE__ */ jsx7("p", { style: { color: "var(--orion-admin-muted)", fontSize: "0.9rem", margin: 0 }, children: "This action cannot be undone." }),
|
|
1020
|
-
/* @__PURE__ */ jsxs7("div", { style: { display: "flex", gap: "0.5rem" }, children: [
|
|
1021
|
-
/* @__PURE__ */ jsxs7("form", { action: deleteAction, style: { flex: 1 }, children: [
|
|
1022
|
-
/* @__PURE__ */ jsx7("input", { name: "id", type: "hidden", value: id }),
|
|
1023
|
-
/* @__PURE__ */ jsx7("button", { style: { background: "#b42318", border: 0, borderRadius: 10, color: "#fff", cursor: "pointer", fontWeight: 800, padding: "0.55rem 0.8rem", width: "100%" }, type: "submit", children: "Yes, Delete" })
|
|
1024
|
-
] }),
|
|
1025
|
-
/* @__PURE__ */ jsx7(
|
|
1026
|
-
"button",
|
|
1027
|
-
{
|
|
1028
|
-
onClick: () => setConfirmDelete(false),
|
|
1029
|
-
style: { background: "transparent", border: "1px solid var(--orion-admin-border)", borderRadius: 10, cursor: "pointer", flex: 1, fontWeight: 700, padding: "0.55rem 0.8rem" },
|
|
1030
|
-
type: "button",
|
|
1031
|
-
children: "Cancel"
|
|
1032
|
-
}
|
|
1033
|
-
)
|
|
1034
|
-
] })
|
|
1035
|
-
] }) : /* @__PURE__ */ jsx7(
|
|
1036
|
-
"button",
|
|
1037
|
-
{
|
|
1038
|
-
className: "orion-admin-action-button",
|
|
1039
|
-
onClick: () => setConfirmDelete(true),
|
|
1040
|
-
style: { background: "#b42318" },
|
|
1041
|
-
type: "button",
|
|
1042
|
-
children: "Delete Asset"
|
|
1043
|
-
}
|
|
1044
|
-
)
|
|
1045
|
-
] })
|
|
1044
|
+
error ? /* @__PURE__ */ jsx7("div", { className: "orion-admin-upload-error", children: error }) : null,
|
|
1045
|
+
/* @__PURE__ */ jsx7("button", { disabled: submitting, type: "submit", children: submitting ? "Uploading..." : "Upload" })
|
|
1046
1046
|
] });
|
|
1047
1047
|
}
|
|
1048
1048
|
|
|
@@ -1054,7 +1054,7 @@ export {
|
|
|
1054
1054
|
SiteHeaderPreview,
|
|
1055
1055
|
SiteFooterPreview,
|
|
1056
1056
|
HeaderNavEditorWithPreview,
|
|
1057
|
+
MediaDetailPanel,
|
|
1057
1058
|
MediaListItem,
|
|
1058
|
-
MediaUploadForm
|
|
1059
|
-
MediaDetailPanel
|
|
1059
|
+
MediaUploadForm
|
|
1060
1060
|
};
|
package/package.json
CHANGED