@ramesesinc/platform-core 0.1.5 → 0.1.8

package/dist/components/action/ViewPage.tsx

@@ -1,141 +0,0 @@
-"use client";
-
-import React, { forwardRef, memo, useImperativeHandle, useRef, useState } from "react";
-import { useDataContext } from "../../core/DataContext";
-import { usePageContext } from "../../core/PageContext";
-import { usePageViewContext } from "../../core/PageViewContext";
-import { substituteExpr } from "../../lib/utils/BeanUtils";
-import { getUrlPageParams, parseHashUrl } from "../../lib/utils/PageUtils";
-import { AbstractComponent } from "../../types/component";
-import PopupView from "../view/PopupView";
-
-/* ------------------------------------------------------------------ */
-/* Types */
-
-interface ViewPageProps extends AbstractComponent {
-  url: string;
-  mode?: "popup" | "window";
-  className?: string;
-  title?: string;
-  icon?: string | React.ReactNode;
-  opt?: Record<string, any>;
-  iconOnly?: boolean;
-  popupClassName?: string;
-}
-
-/* ------------------------------------------------------------------ */
-/* Component */
-
-const ViewPage = (props: ViewPageProps) => {
-  const { url, mode, className = "", title, icon, opt = {}, popupClassName = "", iconOnly = false } = props ?? {};
-  const { data = {} } = opt;
-
-  const dataContext = useDataContext();
-  const pageView = usePageViewContext();
-  const pageContext = usePageContext();
-  const slotRef = useRef<ChildrenSlotHandle>(null);
-
-  /* ---------------------- Events ---------------------- */
-
-  const onClose = () => {
-    slotRef.current?.update(null);
-  };
-
-  const handleClick = (e: React.MouseEvent) => {
-    e.preventDefault();
-
-    if (!url) return;
-
-    const getUrlParams = () => {
-      let result = null;
-      if (pageView.isStandalone()) {
-        const { params } = parseHashUrl(url);
-        result = params;
-      } else {
-        const { params } = getUrlPageParams();
-        result = params;
-      }
-      return result ?? {};
-    };
-
-    const getUrlData = () => {
-      let result = null;
-      if (dataContext == null) {
-        // use data received from props
-        const fullData = {
-          ...pageContext.getAllData(),
-          ...data,
-        };
-        result = fullData;
-      } else {
-        result = dataContext.getData();
-      }
-      return result ?? {};
-    };
-
-    const urlParams = getUrlParams();
-    const urlData = getUrlData();
-    const surl = substituteExpr(url, { ...urlParams, ...urlData });
-
-    if (mode === "popup") {
-      const handler = {
-        onSave: (itm: any) => {
-          onClose();
-          pageContext.notifyDepends();
-        },
-        refresh: () => {
-          pageContext.notifyDepends();
-        },
-      };
-
-      slotRef.current?.update(<PopupView url={surl} onClose={onClose} eventHandler={handler} />);
-    } else if (mode === "window") {
-      pageView.setPage(surl, { mode });
-    } else {
-      pageView.pushPage(surl);
-    }
-  };
-
-  /* ---------------------- Render ---------------------- */
-  return (
-    <>
-      {iconOnly ? (
-        <span onClick={handleClick} className={`cursor-pointer ${className}`}>
-          {icon}
-        </span>
-      ) : (
-        <button onClick={handleClick} className={`px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors ${className}`}>
-          {icon && <span className="dl-action-icon">{icon}</span>}
-          {title || "View Page"}
-        </button>
-      )}
-
-      <ChildrenSlot ref={slotRef} />
-    </>
-  );
-};
-
-export default ViewPage;
-
-type ChildrenSlotHandle = {
-  update: (content: React.ReactNode) => void;
-};
-
-const ChildrenSlot = memo(
-  forwardRef<ChildrenSlotHandle>((_, ref) => {
-    const [content, setContent] = useState<React.ReactNode>(null);
-
-    useImperativeHandle(
-      ref,
-      () => ({
-        update: (content: React.ReactNode) => {
-          // console.log("view page children slot", content);
-          setContent(content);
-        },
-      }),
-      [],
-    );
-
-    return <>{content == null ? null : content}</>;
-  }),
-);

package/dist/components/common/UIComponent.tsx

@@ -1,86 +0,0 @@
-import { compile } from "expression-eval";
-import { useEffect, useState } from "react";
-import { usePageContext } from "../../core/PageContext";
-
-export type UIComponentProps = {
-  name?: string;
-  title?: string;
-  depends?: string;
-  visibleWhen?: string;
-  children?: React.ReactNode;
-  labelPosition?: "top" | "left";
-  style?: string;
-};
-
-const UIComponent = (props: UIComponentProps) => {
-  const { name, title, depends, children, visibleWhen, labelPosition = "top", style } = props ?? {};
-  const pageContext = usePageContext();
-
-  const evaluateVisible = (): boolean => {
-    if (!visibleWhen) return true;
-    try {
-      const context = pageContext?.getAllData() ?? {};
-      const stripped = visibleWhen.replace(/^\s*\{([\s\S]*)\}\s*$/, "$1").trim();
-      const jsExpr = stripped.replace(/\{\{([\s\S]+?)\}\}/g, (_, path) => {
-        const val = path
-          .trim()
-          .split(".")
-          .reduce((obj: any, key: string) => obj?.[key], context);
-        return JSON.stringify(val ?? null);
-      });
-      // eslint-disable-next-line no-new-func
-      // return Boolean(new Function(`return (${jsExpr})`)());
-      return Boolean(compile(jsExpr)(context));
-    } catch (e) {
-      console.warn("visibleWhen eval error:", e);
-      return true;
-    }
-  };
-
-  const [visible, setVisible] = useState(() => evaluateVisible());
-
-  const dependHandler = (val: any) => {
-    // for visibleWhen
-    setVisible(evaluateVisible());
-  };
-
-  useEffect(() => {
-    const unsubscribe = pageContext?.dependsTo(depends || "", dependHandler);
-    return unsubscribe;
-  }, [depends]);
-
-  // Re-evaluate when binding changes (same pattern as Label)
-  useEffect(() => {
-    setVisible(evaluateVisible());
-  }, [pageContext?.binding?.raw, visibleWhen]);
-
-  if (!visible) return null;
-
-  // Top layout (default)
-  if (labelPosition === "top") {
-    return (
-      <div className="flex flex-col gap-1 mb-4">
-        {title && (
-          <label htmlFor={name} className="text-sm font-medium text-gray-700">
-            {title}
-          </label>
-        )}
-        {children}
-      </div>
-    );
-  }
-
-  // Left layout
-  return (
-    <div className="flex items-center gap-2 mb-4">
-      {title && (
-        <label htmlFor={name} className="text-sm font-medium text-gray-700 min-w-[50px]">
-          {title}
-        </label>
-      )}
-      <div className="flex-1">{children}</div>
-    </div>
-  );
-};
-
-export default UIComponent;

package/dist/components/common/UIInput.tsx

@@ -1,49 +0,0 @@
-import { useEffect } from "react";
-import { usePageContext } from "../../core/PageContext";
-
-export type UIInputProps = {
-  name: string;
-  depends?: string;
-  onRefresh: () => void;
-};
-
-const useUIInput = (props: UIInputProps) => {
-  const { name, depends, onRefresh } = props ?? {};
-  const pageContext = usePageContext();
-  // console.log("useIUInput re-render", name, depends, onRefresh);
-  const binding = pageContext?.binding;
-
-  const getValue = () => {
-    const val = pageContext?.get(name) ?? "";
-    // console.log("ui input, get value", name, val, pageContext.getData());
-    return val;
-  };
-
-  const setValue = (value: any) => {
-    pageContext?.set(name, value);
-    // console.log("after set value", name, pageContext?.get(name));
-  };
-
-  const initialValue = pageContext?.get(name) ?? "";
-  // console.log("ui input init", name, initialValue);
-  useEffect(() => {
-    if (onRefresh) {
-      onRefresh();
-    }
-  }, [binding?.raw, initialValue]);
-
-  const dependHandler = (val: any) => {
-    if (onRefresh) {
-      onRefresh();
-    }
-  };
-
-  useEffect(() => {
-    const unsubscribe = pageContext?.dependsTo(depends || "", dependHandler);
-    return unsubscribe;
-  }, [depends]);
-
-  return { initialValue, setValue, getValue, binding };
-};
-
-export default useUIInput;

package/dist/components/common/UIMenu.tsx

@@ -1,91 +0,0 @@
-import { useEffect, useState } from "react";
-import { usePageContext } from "../../core/PageContext";
-
-export type MenuItem = {
-  title: string;
-  page?: string;
-  icon?: React.ReactNode | string;
-  mode?: string;
-};
-
-export type MenuGroup = {
-  title: string;
-  icon?: React.ReactNode | string;
-  items: MenuItem[];
-};
-
-export type UIMenuProps = {
-  items?: Record<string, any>[];
-  data?: Record<string, any>;
-  menugroup?: string;
-  opt?: Record<string, any>;
-};
-
-const useUIMenu = (props: UIMenuProps) => {
-  const { items: itemMenus, data, menugroup, opt = {} } = props ?? {};
-
-  const pageContext = usePageContext();
-
-  const [menus, setMenus] = useState<MenuGroup[]>([]);
-  const [loading, setLoading] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  useEffect(() => {
-    // 1️⃣ Static items
-    if (Array.isArray(itemMenus) && itemMenus.length > 0) {
-      // Check if already grouped (has items array) or flat
-      const isGrouped = itemMenus.every((item) => Array.isArray(item.items));
-      if (isGrouped) {
-        setMenus(itemMenus as MenuGroup[]);
-      } else {
-        setMenus([{ title: "", items: itemMenus as MenuItem[] }]); // ✅ wrap in single group
-      }
-      return;
-    }
-
-    const fetchMenus = async () => {
-      setLoading(true);
-      setError(null);
-
-      try {
-        // 2️⃣ Custom API
-        if (data?.api) {
-          const res = await pageContext?.execService(data.api, data.params ?? {});
-          setMenus(Array.isArray(res) ? (res as MenuGroup[]) : []);
-          return;
-        }
-
-        // 3️⃣ Menugroup — fetch categories + items, map to MenuGroup[]
-        if (menugroup != null) {
-          const menuGroup = await pageContext?.getMgmt("menugroups", menugroup);
-          const { categories = [] } = menuGroup || {};
-
-          const menusRes = await pageContext?.postMgmt("menus", "list", {
-            filter: { menugroup },
-            sort: { sortorder: 1 },
-          });
-
-          const sorted = Array.isArray(menusRes) ? [...menusRes].sort((a, b) => (a.sortorder ?? 0) - (b.sortorder ?? 0)) : [];
-
-          const mappedItems: MenuGroup[] = categories.map((cat: any) => ({
-            title: cat.title,
-            icon: cat.icon,
-            items: sorted.filter((m: any) => m.category === cat.id),
-          }));
-
-          setMenus(mappedItems);
-        }
-      } catch (err: any) {
-        setError(err?.message ?? "Failed to load menus");
-      } finally {
-        setLoading(false);
-      }
-    };
-
-    fetchMenus();
-  }, [itemMenus, data, menugroup]);
-
-  return { items: menus, loading, error };
-};
-
-export default useUIMenu;

package/dist/components/index.ts

@@ -1,51 +0,0 @@
-export { default as Button } from "./action/Button";
-//inputs
-export { default as DateField } from "./input/DateField";
-export { default as DayPicker } from "./input/DayPicker";
-
-export { default as MonthPicker } from "./input/MonthPicker";
-export { default as Select } from "./input/Select";
-export { default as Text } from "./input/Text";
-export { default as YearPicker } from "./input/YearPicker";
-
-//codes
-export { default as HtmlCode } from "./input/HtmlCode";
-export { default as JsonCode } from "./input/JsonCode";
-export { default as ScriptCode } from "./input/ScriptCode";
-export { default as SqlCode } from "./input/SqlCode";
-
-//conditions
-export { default as StringDecision } from "./input/StringDecision";
-
-//export { default as YearPicker } from "./input/YearPicker";
-export { default as TabMenu } from "./list/TabMenu";
-export { default as TreeMenu } from "./list/TreeMenu";
-export { default as Label } from "./output/Label";
-export { default as DataList } from "./table/DataList";
-
-//views
-export { default as ComponentView } from "./view/ComponentView";
-export { default as FilterView } from "./view/FilterView";
-export { default as HtmlForm } from "./view/HtmlForm";
-export { default as HtmlView } from "./view/HtmlView";
-export { default as IFrameView } from "./view/IFrameView";
-export { default as RootView } from "./view/RootView";
-export { default as WizardView } from "./view/WizardView";
-//actions
-export { default as AlertMessage } from "./action/AlertMessage";
-export { default as DeleteData } from "./action/DeleteData";
-export { default as Edit } from "./action/Edit";
-export { default as ProcessRunner } from "./action/ProcessRunner";
-export { default as Refresh } from "./action/Refresh";
-export { default as SaveData } from "./action/SaveData";
-export { default as SelectData } from "./action/SelectData";
-
-export { default as LookupPage } from "./action/LookupPage";
-export { default as UpdateContext } from "./action/UpdateContext";
-export { default as ViewBackPage } from "./action/ViewBackPage";
-export { default as ViewPage } from "./action/ViewPage";
-export { default as PageView } from "./view/PageView";
-
-//lists
-export { default as IconMenu } from "./list/IconMenu";
-export { default as TxnTaskList } from "./list/TxnTaskList";

package/dist/components/input/CodeEditor.tsx

@@ -1,188 +0,0 @@
-import { useRef, useState, useCallback, useEffect } from "react";
-import Editor from "@monaco-editor/react";
-import UIComponent from "../common/UIComponent";
-import useUIInput, { UIInputProps } from "../common/UIInput";
-//import CopyButton from "../ui/CopyButton";
-
-type CodeEditorType = "sql" | "json" | "java" | "javascript" | "html" | "css" | "typescript" | "xml" | "yaml" | "markdown" | "plaintext";
-
-const languageMap: Record<CodeEditorType, string> = {
-  sql: "sql",
-  json: "json",
-  java: "groovy",
-  javascript: "javascript",
-  html: "html",
-  css: "css",
-  typescript: "typescript",
-  xml: "xml",
-  yaml: "yaml",
-  markdown: "markdown",
-  plaintext: "plaintext",
-};
-
-type CodeEditorProps = UIInputProps & {
-  type?: CodeEditorType;
-  height?: number | string;
-  width?: number | string;
-  readOnly?: boolean;
-  immediate?: boolean;
-  showCopy?: boolean;
-};
-
-const CodeEditor = (props: CodeEditorProps) => {
-  const {
-    type = "plaintext",
-    height = 300,
-    width = "100%",
-    readOnly = false,
-    immediate = true,
-    showCopy = true,
-  } = props ?? {};
-
-  const editorRef = useRef<any>(null);
-  const valueRef = useRef<string>("");
-  const [fontSize, setFontSize] = useState(14);
-  const [error, setError] = useState("");
-
-  const language = languageMap[type] ?? type;
-
-  const onRefresh = () => {
-    setEditorValue(getValue());
-  };
-
-  const { initialValue, getValue, setValue } = useUIInput({ ...props, onRefresh });
-  valueRef.current = initialValue ?? "";
-  const [editorValue, setEditorValue] = useState(valueRef.current);
-
-  // Font size keyboard shortcuts
-  const handleKeyDown = useCallback((e: KeyboardEvent) => {
-    if (e.ctrlKey && e.key === "=") {
-      e.preventDefault();
-      setFontSize((prev) => Math.min(prev + 1, 40));
-    }
-    if (e.ctrlKey && e.key === "-") {
-      e.preventDefault();
-      setFontSize((prev) => Math.max(prev - 1, 8));
-    }
-    if (e.ctrlKey && e.key === "0") {
-      e.preventDefault();
-      setFontSize(14);
-    }
-  }, []);
-
-  useEffect(() => {
-    window.addEventListener("keydown", handleKeyDown);
-    return () => window.removeEventListener("keydown", handleKeyDown);
-  }, [handleKeyDown]);
-
-  // JSON-specific validation
-  const validateJson = (value: string) => {
-    if (!value.trim()) {
-      setError("");
-      return;
-    }
-    try {
-      JSON.parse(value);
-      setError("");
-    } catch (e: any) {
-      setError(e.message);
-    }
-  };
-
-  const handleEditorChange = (value?: string) => {
-    const safeValue = value ?? "";
-    setEditorValue(safeValue);
-
-    if (type === "json") {
-      validateJson(safeValue);
-    }
-
-    if (immediate) {
-      setValue(safeValue);
-    }
-  };
-
-  const handleEditorDidMount = (editor: any, monaco: any) => {
-    editorRef.current = editor;
-
-    if (type === "json") {
-      monaco.languages.json.jsonDefaults.setDiagnosticsOptions({
-        validate: true,
-        allowComments: false,
-        schemas: [],
-        enableSchemaRequest: true,
-      });
-    }
-
-    editor.updateOptions({
-      minimap: { enabled: false },
-      fontSize,
-      lineNumbers: "on",
-      renderWhitespace: "selection",
-      folding: true,
-      bracketPairColorization: { enabled: true },
-      formatOnPaste: true,
-      formatOnType: true,
-    });
-  };
-
-  // Sync font size if editor already mounted
-  useEffect(() => {
-    editorRef.current?.updateOptions({ fontSize });
-  }, [fontSize]);
-
-  /*
-    //<CopyButton
-    //  item={editorValue}
-    //  copySize={15}
-    //  copiedSize={10}
-    //  classNameCopied="!px-[15px] !py-[10px]"
-    ///>
-  */
-
-  return (
-    <UIComponent {...(props ?? {})}>
-      <div className="relative w-full bg-white">
-        {showCopy && (
-          <div className="absolute top-2 right-4 z-50">
-          </div>
-        )}
-        <Editor
-          height={height}
-          width={width}
-          language={language}
-          value={editorValue}
-          onChange={handleEditorChange}
-          onMount={handleEditorDidMount}
-          theme="vs-dark"
-          options={{
-            readOnly,
-            domReadOnly: readOnly,
-            padding: { top: 10 },
-            selectOnLineNumbers: true,
-            automaticLayout: true,
-            minimap: { enabled: false },
-            fontSize,
-            wordWrap: "off",
-            lineNumbers: "on",
-            renderWhitespace: "selection",
-            folding: true,
-            bracketPairColorization: { enabled: true },
-            formatOnPaste: true,
-            formatOnType: true,
-            scrollBeyondLastLine: false,
-            smoothScrolling: true,
-            cursorBlinking: "smooth",
-            renderLineHighlight: "all",
-            scrollbar: { vertical: "visible", horizontal: "visible" },
-          }}
-        />
-        {error && type === "json" && (
-          <p className="text-red-500 text-xs mt-1 px-1">{error}</p>
-        )}
-      </div>
-    </UIComponent>
-  );
-};
-
-export default CodeEditor;