feat: bases

Add the bases feature: formula engine package, grid/table UI, and the base-embed editor extension, with supporting client and server changes.
2026-08-30 18:36:26 +08:00 · 2026-06-13 01:26:37 +01:00
parent d86d51c27e
commit 572452c80b
237 changed files with 28203 additions and 146 deletions
@@ -0,0 +1,56 @@
+import { useState, useMemo } from "react";
+import { Group, TextInput, UnstyledButton, Text } from "@mantine/core";
+import { IconSearch } from "@tabler/icons-react";
+import type { IBaseProperty } from "@/ee/base/types/base.types";
+import classes from "@/ee/base/styles/formula.module.css";
+
+export function PropertyChipRow({
+  properties,
+  onInsert,
+}: {
+  properties: IBaseProperty[];
+  onInsert: (name: string) => void;
+}) {
+  const [query, setQuery] = useState("");
+
+  const visible = useMemo(() => {
+    const q = query.trim().toLowerCase();
+    if (!q) return properties;
+    return properties.filter((p) => p.name.toLowerCase().includes(q));
+  }, [properties, query]);
+
+  return (
+    <div>
+      <Group justify="space-between" mb={8}>
+        <Text size="xs" fw={600} c="gray.7">
+          Properties
+        </Text>
+        <TextInput
+          size="xs"
+          placeholder="Search"
+          leftSection={<IconSearch size={12} />}
+          value={query}
+          onChange={(e) => setQuery(e.currentTarget.value)}
+          w={140}
+        />
+      </Group>
+      {visible.length === 0 ? (
+        <Text size="xs" c="dimmed" py={6}>
+          No matches.
+        </Text>
+      ) : (
+        <Group gap={6}>
+          {visible.map((p) => (
+            <UnstyledButton
+              key={p.id}
+              onClick={() => onInsert(p.name)}
+              className={classes.propChip}
+            >
+              {p.name}
+            </UnstyledButton>
+          ))}
+        </Group>
+      )}
+    </div>
+  );
+}