@alpaca-editor/core 1.0.3939 → 1.0.3941

package/src/editor/FieldEditorPopup.tsx

@@ -1,65 +0,0 @@
-"use client";
-
-import { OverlayPanel } from "primereact/overlaypanel";
-import {
-  SyntheticEvent,
-  forwardRef,
-  useImperativeHandle,
-  useRef,
-  useState,
-} from "react";
-
-import { FieldList } from "./FieldList";
-import { Field } from "./pageModel";
-
-export interface FieldEditorPopupRef {
-  show: (fields: Field[], sections: string[], event: SyntheticEvent) => void;
-  close: () => void;
-}
-
-interface FieldEditorPopupProps {}
-
-export const FieldEditorPopup = forwardRef<
-  FieldEditorPopupRef,
-  FieldEditorPopupProps
->((_, ref) => {
-  const overlayRef = useRef<OverlayPanel>(null);
-
-  const [sections, setSections] = useState<string[]>([]);
-  const [fields, setFields] = useState<Field[]>([]);
-
-  useImperativeHandle(ref, () => ({
-    show: (fields: Field[], sections: string[], ev: SyntheticEvent) => {
-      setFields(fields);
-      setSections(sections);
-      overlayRef.current?.toggle(ev, ev.target);
-    },
-    close: () => {
-      overlayRef.current?.hide();
-    },
-  }));
-
-  return (
-    <OverlayPanel ref={overlayRef}>
-      <div
-        className="w-96 h-96 flex flex-col gap-2 overflow-auto"
-        onClick={(ev) => ev.stopPropagation()}
-      >
-        <div className="flex justify-end p-3">
-          <i
-            className="pi pi-times cursor-pointer"
-            onClick={() => overlayRef?.current?.hide()}
-          />
-        </div>
-
-        {fields && (
-          <FieldList
-            fields={[{ fields }]}
-            sections={sections}
-            validators={[]}
-          />
-        )}
-      </div>
-    </OverlayPanel>
-  );
-});

package/src/editor/FieldHistory.tsx

@@ -1,75 +0,0 @@
-import { Field } from "../editor/pageModel";
-import { FieldHistoryItem } from "../types";
-import { getFieldHistory } from "../editor/services/editService";
-import { useEffect } from "react";
-import { useState } from "react";
-
-import { useEditContext } from "./client/editContext";
-import { formatDate } from "./utils";
-import { SimpleTable } from "./ui/SimpleTable";
-import { SimpleIconButton } from "./ui/SimpleIconButton";
-
-export function FieldHistory({
-  field,
-  onHover,
-  onRevert,
-}: {
-  field: Field;
-  onHover: (historyEntry: FieldHistoryItem | undefined) => void;
-  onRevert?: () => void;
-}) {
-  const [fieldHistory, setFieldHistory] = useState<FieldHistoryItem[]>([]);
-  const editContext = useEditContext();
-
-  if (!editContext) {
-    return null;
-  }
-
-  useEffect(() => {
-    getFieldHistory(field.descriptor.item, field.id).then((result) => {
-      setFieldHistory(result.data ?? []);
-    });
-  }, [field]);
-
-  if (fieldHistory.length === 0)
-    return <div className="p-2 text-xs text-gray-500">No history</div>;
-
-  return (
-    <div>
-      <div className="bg-gray-100 p-2 text-xs text-gray-500">Field History</div>
-      <div className="max-h-96 overflow-auto">
-        <SimpleTable
-          items={fieldHistory}
-          onRowHover={onHover}
-          rowClassName={(x) =>
-            x.undone
-              ? "text-gray-300 cursor-pointer hover:bg-gray-50 "
-              : "cursor-pointer hover:bg-gray-50"
-          }
-          columns={[
-            { header: "Date", body: (x) => formatDate(new Date(x.date)) },
-            { header: "User", body: (x) => x.user },
-            { header: "Version", body: (x) => x.version },
-            {
-              header: "Revert",
-              body: (x) => (
-                <SimpleIconButton
-                  icon="pi pi-undo"
-                  onClick={async () => {
-                    await editContext.operations.editField({
-                      field: field.descriptor,
-                      rawValue: x.rawValue,
-                      refresh: "immediate",
-                    });
-                    onRevert?.();
-                  }}
-                  label="Revert"
-                />
-              ),
-            },
-          ]}
-        />
-      </div>
-    </div>
-  );
-}

package/src/editor/FieldList.tsx

@@ -1,190 +0,0 @@
-"use client";
-
-import { Section } from "./ui/Section";
-import { useEditContext } from "./client/editContext";
-import { FieldListFieldWithFallbacks } from "./FieldListFieldWithFallbacks";
-import { SingleValidatorResult } from "../types";
-import { Field } from "./pageModel";
-import { InputText } from "primereact/inputtext";
-import { Fragment, useState } from "react";
-import { Checkbox } from "primereact/checkbox";
-import uuid from "react-uuid";
-import { SimpleIconButton } from "./ui/SimpleIconButton";
-
-export type ItemFields = {
-  headline?: string;
-  fields: Field[];
-};
-
-export function FieldList({
-  fields,
-  compareToFields,
-  sections,
-  validators,
-  filter,
-  simplified,
-  showStandardFieldsEnabled,
-  readonly,
-}: {
-  fields: ItemFields[];
-  compareToFields?: Field[];
-  sections?: string[];
-  validators: SingleValidatorResult[];
-  filter?: (field: Field) => boolean;
-  simplified?: boolean;
-  showStandardFieldsEnabled?: boolean;
-  readonly?: boolean;
-}) {
-  const editContext = useEditContext();
-
-  const [searchFilter, setSearchFilter] = useState<string>("");
-  const [showStandardFields, setShowStandardFields] = useState<boolean>(false);
-  const uniqueId = uuid();
-
-  if (!editContext) return;
-  if (!fields) return;
-
-  return (
-    <div>
-      <div className="tour-field-list sticky top-0 z-10 ml-[1px] flex items-center gap-2 border-y border-gray-200 bg-gray-50 p-2">
-        <i className="pi pi-search" />
-        <div className="text-xs">Filter</div>
-        <InputText
-          className="flex-1 text-xs"
-          value={searchFilter}
-          onChange={(x) => setSearchFilter(x.target.value)}
-        />
-        {searchFilter && (
-          <SimpleIconButton
-            icon="pi pi-times"
-            onClick={() => setSearchFilter("")}
-            className="text-xs"
-            label="Clear"
-          />
-        )}
-        {showStandardFieldsEnabled && (
-          <>
-            <Checkbox
-              inputId={uniqueId}
-              checked={showStandardFields}
-              onChange={(e: any) => setShowStandardFields(e.checked)}
-            />{" "}
-            <label htmlFor={uniqueId} className="cursor-pointer text-xs">
-              Show standard fields
-            </label>
-          </>
-        )}
-      </div>
-
-      {fields.map((itemFields, index) => (
-        <Fragment key={index}>
-          {itemFields.headline && (
-            <div className="mt-2 flex items-center gap-1 border-b py-2 text-sm">
-              <i className="pi pi-angle-right" /> {itemFields.headline}
-            </div>
-          )}
-          <FieldListForSingleItem
-            key={index}
-            fields={itemFields.fields}
-            validators={validators}
-            filter={filter}
-            searchFilter={searchFilter}
-            showStandardFields={showStandardFields}
-            simplified={simplified}
-            sections={sections}
-            compareToFields={compareToFields}
-            readonly={readonly}
-          />
-        </Fragment>
-      ))}
-    </div>
-  );
-}
-
-function FieldListForSingleItem({
-  fields,
-  validators,
-  filter,
-  searchFilter,
-  simplified,
-  sections,
-  showStandardFields,
-  compareToFields,
-  readonly,
-}: {
-  fields: Field[];
-  validators: SingleValidatorResult[];
-  filter?: (field: Field) => boolean;
-  searchFilter?: string;
-  simplified?: boolean;
-  sections?: string[];
-  showStandardFields?: boolean;
-  compareToFields?: Field[];
-  readonly?: boolean;
-}) {
-  let fieldsArray = Array.isArray(fields)
-    ? (fields as Field[])
-    : (Object.values(fields) as Field[]);
-
-  if (filter) fieldsArray = fieldsArray.filter(filter);
-
-  if (searchFilter) {
-    const searchFilterLower = searchFilter.toLowerCase();
-    fieldsArray = fieldsArray.filter(
-      (x) =>
-        x.name?.toLowerCase().includes(searchFilterLower) ||
-        x.displayName?.toLowerCase().includes(searchFilterLower),
-    );
-  }
-
-  if (!showStandardFields) {
-    fieldsArray = fieldsArray.filter((x) => !x.name?.startsWith("__"));
-  }
-
-  const sectionsGrouping = fieldsArray.reduce((acc, value) => {
-    // Group initialization
-    const section = value.section || "";
-
-    if (value.descriptor.item.id)
-      if (!acc[section]) {
-        acc[section] = [];
-      }
-    // Grouping
-    acc[section].push(value);
-
-    return acc;
-  }, {} as any);
-
-  const sectionList: Field[][] = Object.values(sectionsGrouping);
-  sectionList.sort(
-    (a: Field[], b: Field[]) =>
-      (a[0]?.sectionSortOrder || 0) - (b[0]?.sectionSortOrder || 0),
-  );
-
-  function getSectionFields(fields: Field[]) {
-    fields.sort((a: any, b: any) => a?.sortOrder - b?.sortOrder);
-
-    return fields.map((field) => (
-      <FieldListFieldWithFallbacks
-        key={field.id}
-        fieldDescriptor={field.descriptor}
-        simplified={simplified}
-        validators={validators.filter((x) => x.fieldId === field.id)}
-        compareToField={compareToFields?.find((x) => x.id === field.id)}
-        readonly={readonly}
-      />
-    ));
-  }
-  return sectionList
-    .map((x) => x[0]?.section)
-    .filter((x) => !sections || sections.includes(x!))
-    .map((section) =>
-      simplified ? (
-        getSectionFields(sectionsGrouping[section!])
-      ) : (
-        <Section key={section} title={section!}>
-          {getSectionFields(sectionsGrouping[section!])}
-        </Section>
-      ),
-    );
-}