feat(ee): bases

Table and kanban UI, formula engine package, and the base-embed editor extension
2026-08-28 17:27:06 +08:00 · 2026-06-14 01:29:06 +01:00
parent d86d51c27e
commit 4e5bff6d55
233 changed files with 22278 additions and 141 deletions
@@ -0,0 +1,83 @@
+import { useState } from "react";
+import {
+  Accordion,
+  Group,
+  Text,
+  Tooltip,
+  UnstyledButton,
+} from "@mantine/core";
+import type { FormulaFn } from "@docmost/base-formula/client";
+import classes from "@/ee/base/styles/formula.module.css";
+
+const CATEGORIES = ["logic", "math", "string", "date", "coercion"] as const;
+
+export function FunctionPalette({
+  registry,
+  onInsert,
+}: {
+  registry: ReadonlyMap<string, FormulaFn>;
+  onInsert: (name: string) => void;
+}) {
+  const [open, setOpen] = useState<string | null>("logic");
+
+  const byCat = new Map<string, FormulaFn[]>();
+  for (const fn of registry.values()) {
+    if (!byCat.has(fn.category)) byCat.set(fn.category, []);
+    byCat.get(fn.category)!.push(fn);
+  }
+
+  return (
+    <Accordion
+      value={open}
+      onChange={setOpen}
+      variant="contained"
+      radius="md"
+      chevronSize={14}
+      styles={{
+        item: { borderColor: "var(--mantine-color-gray-2)" },
+        control: { padding: "7px 12px", minHeight: 0 },
+        label: {
+          padding: 0,
+          fontSize: 13,
+          fontWeight: 600,
+          textTransform: "capitalize",
+        },
+        content: { padding: "6px 10px 10px" },
+        panel: { background: "var(--mantine-color-gray-0)" },
+      }}
+    >
+      {CATEGORIES.map((cat) => {
+        const fns = byCat.get(cat) ?? [];
+        return (
+          <Accordion.Item key={cat} value={cat}>
+            <Accordion.Control>
+              <Group gap={8}>
+                <span>{cat}</span>
+                <Text size="xs" c="dimmed" ff="monospace">
+                  {fns.length}
+                </Text>
+              </Group>
+            </Accordion.Control>
+            <Accordion.Panel>
+              <Group gap={6}>
+                {fns.map((fn) => (
+                  <Tooltip key={fn.name} label={fn.doc} withArrow>
+                    <UnstyledButton
+                      onClick={() => onInsert(fn.name)}
+                      className={classes.fnChip}
+                    >
+                      {fn.name}
+                      <span className={classes.fnChipParens}>
+                        ()
+                      </span>
+                    </UnstyledButton>
+                  </Tooltip>
+                ))}
+              </Group>
+            </Accordion.Panel>
+          </Accordion.Item>
+        );
+      })}
+    </Accordion>
+  );
+}