@ramesesinc/platform-core 0.1.6 → 0.1.8

package/dist/components/input/StringDecision.tsx

@@ -1,64 +0,0 @@
-import { useEffect, useState } from "react";
-import { usePageContext } from "../../core/PageContext";
-import UIComponent from "../common/UIComponent";
-
-const operators = [
-  { label: "Matches", value: "matches" },
-  { label: "Equals", value: "equals" },
-  { label: "Not Equals", value: "neq" },
-];
-
-const StringDecision = (props: Record<string, any>) => {
-  const { name } = props ?? {};
-  const [inputOp, setInputOp] = useState("");
-  const [inputValue, setInputValue] = useState("");
-  const pageContext = usePageContext();
-  const binding = pageContext?.binding;
-
-  const inputClassName = "border rounded px-2 py-1 w-full";
-  const selectClassName =
-    "px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 disabled:bg-gray-100 disabled:cursor-not-allowed";
-
-  const handleChangeOperator = (e: React.ChangeEvent<HTMLSelectElement>) => {
-    setInputOp(e.target.value);
-  };
-
-  const handleChangeValue = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setInputValue(e.target.value);
-  };
-
-  useEffect(() => {
-    if (name && inputOp && inputValue) {
-      pageContext?.set(name, { [inputOp]: inputValue });
-    } else if (name && (!inputOp || !inputValue)) {
-      pageContext?.set(name, null);
-    }
-  }, [name, inputOp, inputValue, pageContext, binding]);
-
-  return (
-    <UIComponent {...(props ?? {})}>
-      <div className="flex gap-4 items-center justify-center">
-        <select value={inputOp} onChange={handleChangeOperator} className={selectClassName}>
-          <option value="">Select operator</option>
-          {operators.map((op) => (
-            <option key={op.value} value={op.value}>
-              {op.label}
-            </option>
-          ))}
-        </select>
-        {/* <Select
-          options={operators}
-          placeholder="Select operator"
-          onChange={(value: string) => setInputOp(value)}
-          name={""}
-          onRefresh={function (): void {
-            throw new Error("Function not implemented.");
-          }}
-        /> */}
-        <input type="text" value={inputValue} onChange={handleChangeValue} className={inputClassName} placeholder="Enter value" />
-      </div>
-    </UIComponent>
-  );
-};
-
-export default StringDecision;

package/dist/components/input/Text.tsx

@@ -1,57 +0,0 @@
-import { useRef, useState } from "react";
-import UIComponent from "../common/UIComponent";
-import useUIInput, { UIInputProps } from "../common/UIInput";
-
-type TextFieldProps = UIInputProps & {
-  required?: boolean;
-  immediate?: boolean;
-};
-
-const TextField = (props: TextFieldProps) => {
-  const { name, immediate = true } = props ?? {};
-  const [focused, setFocused] = useState(false);
-  const inputRef = useRef<HTMLInputElement | null>(null);
-  const valueRef = useRef<string>("");
-
-  const className = "border rounded px-2 py-1 w-full";
-
-  const handleFocus = () => {
-    setFocused(true);
-  };
-
-  const handleBlur = () => {
-    if (!immediate) {
-      setValue(inputValue);
-    }
-    setFocused(false);
-  };
-
-  const onRefresh = () => {
-    setInputValue(getValue());
-  };
-
-  const { initialValue, getValue, setValue, binding } = useUIInput({ ...props, onRefresh });
-  valueRef.current = initialValue ?? "";
-  const [inputValue, setInputValue] = useState(valueRef.current);
-
-  const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    const text = e.target.value ?? "";
-
-    if (text !== inputValue) {
-      valueRef.current = text;
-      setInputValue(valueRef.current);
-    }
-
-    if (immediate) {
-      setValue(text);
-    }
-  };
-
-  return (
-    <UIComponent {...(props ?? {})}>
-      <input type="text" ref={inputRef} onChange={onChange} value={inputValue} onFocus={handleFocus} onBlur={handleBlur} className={className} />
-    </UIComponent>
-  );
-};
-
-export default TextField;

package/dist/components/input/YearPicker.tsx

@@ -1,81 +0,0 @@
-import { useEffect, useRef, useState } from "react";
-import UIComponent from "../common/UIComponent";
-import useUIInput, { UIInputProps } from "../common/UIInput";
-
-type YearPickerProps = UIInputProps & {
-  min?: number;
-  max?: number;
-  immediate?: boolean;
-};
-
-const YearPicker = (props: YearPickerProps) => {
-  const { min = 1900, max, immediate = true } = props ?? {};
-  const valueRef = useRef<string>("");
-  const [focused, setFocused] = useState(false);
-
-  // Set default max to current year if not provided
-  const currentYear = new Date().getFullYear();
-  const maxYear = max || currentYear;
-
-  // Generate array of years (descending order)
-  const years = Array.from({ length: maxYear - min + 1 }, (_, i) => maxYear - i);
-
-  const onRefresh = () => {
-    setInputValue(getValue());
-  };
-
-  const { initialValue, getValue, setValue } = useUIInput({ ...props, onRefresh });
-  valueRef.current = initialValue ?? "";
-  const [inputValue, setInputValue] = useState(valueRef.current);
-
-  const handleChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
-    const year = e.target.value;
-
-    if (year !== inputValue) {
-      valueRef.current = year;
-      setInputValue(valueRef.current);
-    }
-
-    if (immediate) {
-      setValue(year);
-    }
-  };
-
-  const handleFocus = () => {
-    setFocused(true);
-  };
-
-  const handleBlur = () => {
-    if (!immediate) {
-      setValue(inputValue);
-    }
-    setFocused(false);
-  };
-
-  useEffect(() => {
-    // console.log("inputValue", inputValue);
-  }, [inputValue]);
-
-  return (
-    <UIComponent {...(props ?? {})}>
-      <div className="flex flex-col gap-1">
-        <select
-          value={inputValue}
-          onChange={handleChange}
-          onFocus={handleFocus}
-          onBlur={handleBlur}
-          className="px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 disabled:bg-gray-100 disabled:cursor-not-allowed"
-        >
-          <option value="">Select year</option>
-          {years.map((year) => (
-            <option key={year} value={year}>
-              {year}
-            </option>
-          ))}
-        </select>
-      </div>
-    </UIComponent>
-  );
-};
-
-export default YearPicker;

package/dist/components/list/IconMenu.tsx

@@ -1,115 +0,0 @@
-"use client";
-
-import clsx from "clsx";
-import { useState } from "react";
-import { twMerge } from "tailwind-merge";
-import DynamicIcon from "../../core/DynamicIcon";
-import { usePageContext } from "../../core/PageContext";
-import { usePageViewContext } from "../../core/PageViewContext";
-import { AbstractComponent } from "../../types/component";
-import useUIMenu, { MenuGroup, MenuItem } from "../common/UIMenu";
-
-/* ------------------------------------------------------------------ */
-/* Types */
-
-interface IconMenuProps extends AbstractComponent {
-  name?: string;
-  items?: MenuGroup[];
-  data?: Record<string, any>;
-  menugroup?: string;
-  depends?: string;
-  columns?: number;
-  size?: "sm" | "md" | "lg";
-  style?: string;
-}
-
-/* ------------------------------------------------------------------ */
-/* Size config */
-
-const sizeConfig = {
-  sm: { tile: "w-20 h-20", icon: 24, label: "text-xs", gap: "gap-2" },
-  md: { tile: "w-28 h-28", icon: 32, label: "text-sm", gap: "gap-3" },
-  lg: { tile: "w-36 h-36", icon: 40, label: "text-base", gap: "gap-4" },
-};
-
-/* ------------------------------------------------------------------ */
-/* Component */
-
-const IconMenu = (props: IconMenuProps) => {
-  const { name, menugroup, depends, items: itemsProp, data, columns = 5, size = "md", style = "" } = props ?? {};
-  const pageContext = usePageContext();
-  const pageView = usePageViewContext();
-  const contextKey = name ?? depends ?? "";
-  const [activeItem, setActiveItem] = useState<string | null>(null);
-
-  const defaultPopupClass = `bg-white rounded-lg shadow-xl w-[90%] h-[90%] flex flex-col`;
-  const finalPopupClass = twMerge(clsx(defaultPopupClass, style));
-
-  // useUIMenu always returns MenuGroup[]
-  const { items } = useUIMenu({ menugroup, items: itemsProp, data });
-
-  const cfg = sizeConfig[size];
-
-  /* ---------------------- Events ---------------------- */
-  const handleItemClick = (item: MenuItem) => {
-    if (!item.page || item.page === activeItem) return;
-    if (item.mode == "window") {
-      const oldHref = window.location.href;
-      const nidx = oldHref.lastIndexOf("/");
-      if (nidx > 0) {
-        const newUrl = oldHref.substring(0, nidx) + "/" + item.page;
-        window.location.href = newUrl;
-      }
-    } else {
-      setActiveItem(item.page);
-      if (contextKey && contextKey !== "selectedPage") {
-        pageContext?.set(contextKey, item.page);
-      } else {
-        pageView?.setPage(item.page);
-      }
-    }
-  };
-
-  /* ---------------------- Shared button ---------------------- */
-  const renderButton = (item: MenuItem, index: number) => (
-    <button
-      key={index}
-      onClick={() => handleItemClick(item)}
-      className={`
-        ${cfg.tile}
-        flex flex-col items-center justify-center gap-2
-        rounded-2xl select-none cursor-pointer
-        transition-all duration-200 ease-out
-        focus:outline-none
-        text-gray-600 hover:bg-gray-100 hover:text-gray-900
-      `}
-    >
-      <DynamicIcon icon={item.icon} size={cfg.icon} />
-      <span className={`${cfg.label} font-semibold leading-tight text-center px-1 truncate w-full`}>{item.title}</span>
-    </button>
-  );
-
-  /* ---------------------- Render ---------------------- */
-  return (
-    <div className="flex flex-col gap-6 p-4">
-      {(items as MenuGroup[]).map((group, groupIndex) => {
-        // Flat item — no group structure
-        if (!Array.isArray(group.items)) {
-          return renderButton(group as unknown as MenuItem, groupIndex);
-        }
-
-        // Grouped with category title
-        return (
-          <div key={groupIndex} className="flex flex-col gap-2">
-            {group.title && <span className="text-xs font-semibold text-gray-400 uppercase tracking-widest px-1">{group.title}</span>}
-            <div className={`grid ${cfg.gap} justify-items-center`} style={{ gridTemplateColumns: `repeat(${columns}, minmax(0, 1fr))` }}>
-              {group.items.map((item, index) => renderButton(item, index))}
-            </div>
-          </div>
-        );
-      })}
-    </div>
-  );
-};
-
-export default IconMenu;

package/dist/components/list/TabMenu.tsx

@@ -1,127 +0,0 @@
-import { useEffect, useState } from "react";
-import { usePageContext } from "../../core/PageContext";
-import { usePageViewContext } from "../../core/PageViewContext";
-import useDependHandler from "../../core/UIDependHandler";
-import HPanel from "../../layouts/HPanel";
-import VPanel from "../../layouts/VPanel";
-
-type TabMenuProps = {
-  name?: string;
-  depends?: string;
-  items?: Record<string, any>[];
-  data?: Record<string, any>;
-  menugroup?: string;
-  orientation?: "horizontal" | "vertical";
-};
-
-type TabMenuItemProps = {
-  id: string;
-  title: string;
-  key: string;
-  component?: string;
-  attr?: Record<string, any>;
-  index: number;
-  selected?: boolean;
-  onClick: (item: Record<string, any>) => void;
-  [key: string]: any;
-};
-
-const TabMenu = (props: TabMenuProps) => {
-  const { name, depends, items = [], data, menugroup, orientation = "horizontal" } = props ?? {};
-  const [selectedIndex, setSelectedIndex] = useState(-1);
-  const [refreshKey, setRefreshKey] = useState(0);
-  const pageContext = usePageContext();
-  const pageView = usePageViewContext();
-  const contextKey = name ?? depends ?? "";
-
-  const resolvedItems = items.map((item: any, index: number) => ({
-    ...item,
-    key: item.id ?? Math.random().toString(36).substring(2, 15),
-    index,
-  }));
-
-  const onRefresh = () => setRefreshKey((k) => k + 1);
-  useDependHandler({ name: depends, onRefresh });
-
-  const handleClick = (item: Record<string, any>) => {
-    setSelectedIndex(item.index);
-
-    if (item.page != null && item.page.trim() !== "") {
-      pageView.setPage(item.page);
-    } else if (contextKey != null && contextKey.trim() !== "") {
-      const selItem = { ...item };
-      delete selItem.id;
-      delete selItem.title;
-      delete selItem.index;
-      delete selItem.key;
-      delete selItem.selected;
-      delete selItem.onClick;
-      pageContext.set(contextKey, selItem); // ← sets "selectedTask" = "new_application_list"
-    }
-  };
-
-  useEffect(() => {
-    if (resolvedItems != null && resolvedItems.length > 0 && selectedIndex === -1) {
-      handleClick(resolvedItems[0]);
-    }
-  }, [resolvedItems]);
-
-  const render = () => {
-    if (resolvedItems.length === 0) return null;
-
-    const elems = resolvedItems.map((it) => {
-      const item = it as unknown as TabMenuItemProps;
-      item.selected = item.index === selectedIndex;
-      return <TabMenuItem {...item} key={item.key} onClick={handleClick} />;
-    });
-
-    if (orientation === "vertical") {
-      return (
-        <div className="border-r border-gray-200">
-          <VPanel gap={25}>{elems}</VPanel>
-        </div>
-      );
-    }
-
-    return (
-      <div className="w-full">
-        <HPanel gap={25}>{elems}</HPanel>
-      </div>
-    );
-  };
-
-  return <div>{render()}</div>;
-};
-
-export default TabMenu;
-
-/* ------------------------------------------------------------------ */
-/* TabMenuItem */
-
-const TabMenuItem = (props: TabMenuItemProps) => {
-  const { title, onClick } = props ?? {};
-
-  const handleClick = () => onClick(props);
-
-  const render = () => {
-    if (props.selected) {
-      return (
-        <div onClick={handleClick} className="relative px-4 py-3 cursor-pointer text-sm transition-all duration-200 text-gray-900 font-semibold">
-          {title}
-          <span className="absolute bottom-0 left-0 w-full h-[2px] rounded-full bg-gray-900" />
-        </div>
-      );
-    }
-
-    return (
-      <div
-        onClick={handleClick}
-        className="relative px-4 py-3 cursor-pointer text-sm transition-all duration-200 text-gray-500 font-normal hover:text-gray-600"
-      >
-        {title}
-      </div>
-    );
-  };
-
-  return <div onClick={handleClick}>{render()}</div>;
-};