@bettercms-ai/kit 0.1.1 → 2.0.0

package/dist/ui/tooltip-root.js

@@ -0,0 +1,77 @@
+import { KIT_SCOPE } from "./surfaces.js";
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import { Tooltip } from "@base-ui/react/tooltip";
+//#region src/ui/tooltip-root.tsx
+var MODAL_LAYER = "data-kit-modal-layer";
+var LAYER_SELECTOR = `[${MODAL_LAYER}]`;
+var listeners = /* @__PURE__ */ new Set();
+var observer = null;
+var layers = 0;
+var EXPANDED_SELECTOR = "[aria-expanded=\"true\"]";
+var count = () => (Number(document.body.getAttribute("data-scroll-locked")) || 0) + document.querySelectorAll(LAYER_SELECTOR).length + document.querySelectorAll(EXPANDED_SELECTOR).length;
+function onModalLayerOpen(fn) {
+	if (typeof document === "undefined" || typeof MutationObserver === "undefined") return () => {};
+	if (!observer) {
+		layers = count();
+		observer = new MutationObserver(() => {
+			const n = count();
+			if (n > layers) listeners.forEach((l) => l());
+			layers = n;
+		});
+		observer.observe(document.body, {
+			attributes: true,
+			attributeFilter: ["data-scroll-locked", "aria-expanded"],
+			childList: true,
+			subtree: true
+		});
+	}
+	listeners.add(fn);
+	return () => {
+		listeners.delete(fn);
+		if (!listeners.size) {
+			observer?.disconnect();
+			observer = null;
+		}
+	};
+}
+/** Drop-in for Tooltip.Root (controlled or not) that closes itself when a modal layer opens. */
+function TooltipRoot({ open: openProp, defaultOpen, onOpenChange, ...props }) {
+	const [inner, setInner] = React.useState(!!defaultOpen);
+	const open = openProp ?? inner;
+	const change = React.useRef(onOpenChange);
+	change.current = onOpenChange;
+	const set = React.useCallback((o, details) => {
+		setInner(o);
+		if (details) change.current?.(o, details);
+	}, []);
+	React.useEffect(() => open ? onModalLayerOpen(() => set(false)) : void 0, [open, set]);
+	return /* @__PURE__ */ jsx(Tooltip.Root, {
+		...props,
+		open,
+		onOpenChange: set
+	});
+}
+/** The ink tooltip surface (V2 overlay.tsx:42: .glass-ink, radius 6, 8×4 padding, 12/500, 1.45 leading, wraps, fades in
+*  160ms on a delayed open). The --kit-z-tooltip layer sits on the positioner, the element Base UI places. */
+var TOOLTIP_POPUP_CLASS = "flex max-w-[min(280px,calc(100vw-16px))] items-start gap-2 rounded-kit-md glass-ink px-2 py-1 text-kit-xs font-medium leading-[1.45] data-[open]:not-data-[instant]:animate-kit-fade-in";
+/** Portal → positioner (6px offset, 8px collision padding, --kit-z-tooltip, its own kit scope) → ink popup (role="tooltip", as V2's). */
+function TooltipLayer({ side = "top", children }) {
+	return /* @__PURE__ */ jsx(Tooltip.Portal, { children: /* @__PURE__ */ jsx(Tooltip.Positioner, {
+		side,
+		sideOffset: 6,
+		collisionPadding: 8,
+		className: "z-[var(--kit-z-tooltip,90)]",
+		...KIT_SCOPE,
+		children: /* @__PURE__ */ jsx(Tooltip.Popup, {
+			role: "tooltip",
+			"data-kit-tooltip": "",
+			className: TOOLTIP_POPUP_CLASS,
+			children
+		})
+	}) });
+}
+//#endregion
+export { MODAL_LAYER, TOOLTIP_POPUP_CLASS, TooltipLayer, TooltipRoot };
+
+//# sourceMappingURL=tooltip-root.js.map

package/dist/ui/tooltip-root.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip-root.js","names":[],"sources":["../../src/ui/tooltip-root.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Tooltip as TooltipPrimitive } from \"@base-ui/react/tooltip\";\nimport { KIT_SCOPE } from \"./surfaces\";\n\n/*\n * Tooltips close when a modal layer opens.\n *\n * Tooltips sit on --kit-z-tooltip, above dialogs (--kit-z-modal), the expanded editor and menus, so a tooltip that is open\n * when a modal opens would stay on top of it: hover \"Site settings\", open a dialog, and the hint floats over it.\n * Every modal layer in the kit marks its popup with data-kit-modal-layer (and Radix layers elsewhere in the app count\n * their scroll locks in body[data-scroll-locked]); a popover or menu marks its trigger aria-expanded. When any count\n * rises, a new layer opened, so every open tooltip closes. Tooltips inside the new layer still open normally afterwards.\n */\nexport const MODAL_LAYER = \"data-kit-modal-layer\";\nconst LAYER_SELECTOR = `[${MODAL_LAYER}]`;\nconst listeners = new Set<() => void>();\nlet observer: MutationObserver | null = null;\nlet layers = 0;\n/*\n * A POPOVER OR MENU counts too, by the trigger it opened from (`aria-expanded=\"true\"`, which Base UI and Radix both\n * set). Tooltips sit on --kit-z-tooltip, above the dashboard's popovers at --z-dropdown: a hint left open on a neighbouring\n * control when the publish popover opened stayed on screen UNDER it — ghost text behind the popover (closing QA\n * UI/UX #12). Non-modal popups mark nothing on the body, so they were never counted.\n */\nconst EXPANDED_SELECTOR = '[aria-expanded=\"true\"]';\nconst count = () =>\n  (Number(document.body.getAttribute(\"data-scroll-locked\")) || 0) +\n  document.querySelectorAll(LAYER_SELECTOR).length +\n  document.querySelectorAll(EXPANDED_SELECTOR).length;\n\nfunction onModalLayerOpen(fn: () => void) {\n  if (typeof document === \"undefined\" || typeof MutationObserver === \"undefined\") return () => {};\n  if (!observer) {\n    layers = count();\n    observer = new MutationObserver(() => {\n      const n = count();\n      if (n > layers) listeners.forEach((l) => l());\n      layers = n;\n    });\n    observer.observe(document.body, { attributes: true, attributeFilter: [\"data-scroll-locked\", \"aria-expanded\"], childList: true, subtree: true });\n  }\n  listeners.add(fn);\n  return () => {\n    listeners.delete(fn);\n    if (!listeners.size) {\n      observer?.disconnect();\n      observer = null;\n    }\n  };\n}\n\n/** Drop-in for Tooltip.Root (controlled or not) that closes itself when a modal layer opens. */\nexport function TooltipRoot({ open: openProp, defaultOpen, onOpenChange, ...props }: TooltipPrimitive.Root.Props) {\n  const [inner, setInner] = React.useState(!!defaultOpen);\n  const open = openProp ?? inner;\n  const change = React.useRef(onOpenChange);\n  change.current = onOpenChange;\n  const set = React.useCallback((o: boolean, details?: TooltipPrimitive.Root.ChangeEventDetails) => {\n    setInner(o);\n    if (details) change.current?.(o, details);\n  }, []);\n  React.useEffect(() => (open ? onModalLayerOpen(() => set(false)) : undefined), [open, set]);\n  return <TooltipPrimitive.Root {...props} open={open} onOpenChange={set} />;\n}\n\n/** The ink tooltip surface (V2 overlay.tsx:42: .glass-ink, radius 6, 8×4 padding, 12/500, 1.45 leading, wraps, fades in\n *  160ms on a delayed open). The --kit-z-tooltip layer sits on the positioner, the element Base UI places. */\nexport const TOOLTIP_POPUP_CLASS =\n  \"flex max-w-[min(280px,calc(100vw-16px))] items-start gap-2 rounded-kit-md glass-ink px-2 py-1 text-kit-xs font-medium leading-[1.45] data-[open]:not-data-[instant]:animate-kit-fade-in\";\n\n/** Portal → positioner (6px offset, 8px collision padding, --kit-z-tooltip, its own kit scope) → ink popup (role=\"tooltip\", as V2's). */\nexport function TooltipLayer({\n  side = \"top\",\n  children,\n}: {\n  side?: \"top\" | \"bottom\" | \"left\" | \"right\";\n  children: React.ReactNode;\n}) {\n  return (\n    <TooltipPrimitive.Portal>\n      <TooltipPrimitive.Positioner side={side} sideOffset={6} collisionPadding={8} className=\"z-[var(--kit-z-tooltip,90)]\" {...KIT_SCOPE}>\n        <TooltipPrimitive.Popup role=\"tooltip\" data-kit-tooltip=\"\" className={TOOLTIP_POPUP_CLASS}>{children}</TooltipPrimitive.Popup>\n      </TooltipPrimitive.Positioner>\n    </TooltipPrimitive.Portal>\n  );\n}\n"],"mappings":";;;;;AAaA,IAAa,cAAc;AAC3B,IAAM,iBAAiB,IAAI,YAAY;AACvC,IAAM,4BAAY,IAAI,IAAgB;AACtC,IAAI,WAAoC;AACxC,IAAI,SAAS;AAOb,IAAM,oBAAoB;AAC1B,IAAM,eACH,OAAO,SAAS,KAAK,aAAa,oBAAoB,CAAC,KAAK,KAC7D,SAAS,iBAAiB,cAAc,CAAC,CAAC,SAC1C,SAAS,iBAAiB,iBAAiB,CAAC,CAAC;AAE/C,SAAS,iBAAiB,IAAgB;CACxC,IAAI,OAAO,aAAa,eAAe,OAAO,qBAAqB,aAAa,aAAa,CAAC;CAC9F,IAAI,CAAC,UAAU;EACb,SAAS,MAAM;EACf,WAAW,IAAI,uBAAuB;GACpC,MAAM,IAAI,MAAM;GAChB,IAAI,IAAI,QAAQ,UAAU,SAAS,MAAM,EAAE,CAAC;GAC5C,SAAS;EACX,CAAC;EACD,SAAS,QAAQ,SAAS,MAAM;GAAE,YAAY;GAAM,iBAAiB,CAAC,sBAAsB,eAAe;GAAG,WAAW;GAAM,SAAS;EAAK,CAAC;CAChJ;CACA,UAAU,IAAI,EAAE;CAChB,aAAa;EACX,UAAU,OAAO,EAAE;EACnB,IAAI,CAAC,UAAU,MAAM;GACnB,UAAU,WAAW;GACrB,WAAW;EACb;CACF;AACF;;AAGA,SAAgB,YAAY,EAAE,MAAM,UAAU,aAAa,cAAc,GAAG,SAAsC;CAChH,MAAM,CAAC,OAAO,YAAY,MAAM,SAAS,CAAC,CAAC,WAAW;CACtD,MAAM,OAAO,YAAY;CACzB,MAAM,SAAS,MAAM,OAAO,YAAY;CACxC,OAAO,UAAU;CACjB,MAAM,MAAM,MAAM,aAAa,GAAY,YAAuD;EAChG,SAAS,CAAC;EACV,IAAI,SAAS,OAAO,UAAU,GAAG,OAAO;CAC1C,GAAG,CAAC,CAAC;CACL,MAAM,gBAAiB,OAAO,uBAAuB,IAAI,KAAK,CAAC,IAAI,KAAA,GAAY,CAAC,MAAM,GAAG,CAAC;CAC1F,OAAO,oBAAC,QAAiB,MAAlB;EAAuB,GAAI;EAAa;EAAM,cAAc;CAAM,CAAA;AAC3E;;;AAIA,IAAa,sBACX;;AAGF,SAAgB,aAAa,EAC3B,OAAO,OACP,YAIC;CACD,OACE,oBAAC,QAAiB,QAAlB,EAAA,UACE,oBAAC,QAAiB,YAAlB;EAAmC;EAAM,YAAY;EAAG,kBAAkB;EAAG,WAAU;EAA8B,GAAI;EACvH,UAAA,oBAAC,QAAiB,OAAlB;GAAwB,MAAK;GAAU,oBAAiB;GAAG,WAAW;GAAsB;EAAiC,CAAA;CAClG,CAAA,EACN,CAAA;AAE7B"}

package/dist/ui/variants.d.ts

@@ -0,0 +1,15 @@
+/** The slice of class-variance-authority the kit uses (variants + defaults + compound variants), kept in-package. */
+type Config<V extends Record<string, Record<string, string>>> = {
+    variants: V;
+    defaultVariants: {
+        [K in keyof V]: keyof V[K];
+    };
+    compoundVariants?: ({
+        [K in keyof V]?: keyof V[K];
+    } & {
+        className: string;
+    })[];
+};
+export type VariantProps<F> = F extends (props?: infer P) => string ? NonNullable<P> : never;
+export declare function variants<V extends Record<string, Record<string, string>>>(base: string, config: Config<V>): (props?: { [K in keyof V]?: keyof V[K] | null; }) => string;
+export {};

package/dist/ui/variants.js

@@ -0,0 +1,14 @@
+import { cn } from "../lib/cn.js";
+//#region src/ui/variants.ts
+function variants(base, config) {
+	return (props) => {
+		const picked = {};
+		for (const key of Object.keys(config.variants)) picked[key] = props?.[key] ?? config.defaultVariants[key];
+		const compound = (config.compoundVariants ?? []).filter(({ className: _c, ...when }) => Object.entries(when).every(([k, v]) => picked[k] === v)).map((c) => c.className);
+		return cn(base, ...Object.keys(config.variants).map((k) => config.variants[k][picked[k]]), ...compound);
+	};
+}
+//#endregion
+export { variants };
+
+//# sourceMappingURL=variants.js.map

package/dist/ui/variants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"variants.js","names":[],"sources":["../../src/ui/variants.ts"],"sourcesContent":["import { cn } from \"../lib/cn\";\n\n/** The slice of class-variance-authority the kit uses (variants + defaults + compound variants), kept in-package. */\ntype Config<V extends Record<string, Record<string, string>>> = {\n  variants: V;\n  defaultVariants: { [K in keyof V]: keyof V[K] };\n  compoundVariants?: ({ [K in keyof V]?: keyof V[K] } & { className: string })[];\n};\n\nexport type VariantProps<F> = F extends (props?: infer P) => string ? NonNullable<P> : never;\n\nexport function variants<V extends Record<string, Record<string, string>>>(base: string, config: Config<V>) {\n  return (props?: { [K in keyof V]?: keyof V[K] | null }) => {\n    const picked = {} as { [K in keyof V]: keyof V[K] };\n    for (const key of Object.keys(config.variants) as (keyof V)[]) picked[key] = props?.[key] ?? config.defaultVariants[key];\n    const compound = (config.compoundVariants ?? [])\n      .filter(({ className: _c, ...when }) => Object.entries(when).every(([k, v]) => picked[k as keyof V] === v))\n      .map((c) => c.className);\n    return cn(base, ...(Object.keys(config.variants) as (keyof V)[]).map((k) => config.variants[k][picked[k] as string]), ...compound);\n  };\n}\n"],"mappings":";;AAWA,SAAgB,SAA2D,MAAc,QAAmB;CAC1G,QAAQ,UAAmD;EACzD,MAAM,SAAS,CAAC;EAChB,KAAK,MAAM,OAAO,OAAO,KAAK,OAAO,QAAQ,GAAkB,OAAO,OAAO,QAAQ,QAAQ,OAAO,gBAAgB;EACpH,MAAM,YAAY,OAAO,oBAAoB,CAAC,EAAA,CAC3C,QAAQ,EAAE,WAAW,IAAI,GAAG,WAAW,OAAO,QAAQ,IAAI,CAAC,CAAC,OAAO,CAAC,GAAG,OAAO,OAAO,OAAkB,CAAC,CAAC,CAAC,CAC1G,KAAK,MAAM,EAAE,SAAS;EACzB,OAAO,GAAG,MAAM,GAAI,OAAO,KAAK,OAAO,QAAQ,CAAC,CAAiB,KAAK,MAAM,OAAO,SAAS,EAAE,CAAC,OAAO,GAAa,GAAG,GAAG,QAAQ;CACnI;AACF"}

package/package.json

@@ -1,75 +1,101 @@
 {
   "name": "@bettercms-ai/kit",
-  "version": "0.1.1",
-  "description": "BetterCMS component kit for React: primitives, components, theme builder and workshop stories.",
+  "version": "2.0.0",
+  "description": "The BetterCMS V2 Block Kit: schema language, form engine, controls and design tokens.",
   "license": "MIT",
-  "sideEffects": false,
-  "type": "commonjs",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
-      "source": "./exports/index.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.js",
-      "default": "./dist/index.js"
-    },
-    "./_visual-editing": {
-      "source": "./exports/_visual-editing.ts",
-      "import": "./dist/_visual-editing.mjs",
-      "require": "./dist/_visual-editing.js",
-      "default": "./dist/_visual-editing.js"
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
     },
     "./theme": {
-      "source": "./exports/theme.ts",
-      "import": "./dist/theme.mjs",
-      "require": "./dist/theme.js",
-      "default": "./dist/theme.js"
+      "types": "./dist/theme.d.ts",
+      "import": "./dist/theme.js"
+    },
+    "./tokens.css": "./dist/tokens.css",
+    "./theme.css": "./dist/theme.css",
+    "./styles.css": "./dist/styles.css",
+    "./kit.css": "./dist/kit.css",
+    "./ui": {
+      "types": "./dist/ui/index.d.ts",
+      "import": "./dist/ui/index.js"
+    },
+    "./controls": {
+      "types": "./dist/controls/index.d.ts",
+      "import": "./dist/controls/index.js"
+    },
+    "./core": {
+      "types": "./dist/core/index.d.ts",
+      "import": "./dist/core/index.js"
+    },
+    "./library": {
+      "types": "./dist/library/index.d.ts",
+      "import": "./dist/library/index.js"
+    },
+    "./library/kit-catalog.json": "./dist/library/kit-catalog.json",
+    "./*": {
+      "types": "./dist/*.d.ts",
+      "import": "./dist/*.js"
     },
     "./package.json": "./package.json"
   },
-  "main": "./dist/index.js",
-  "module": "./dist/index.mjs",
-  "types": "./dist/index.d.ts",
-  "typesVersions": {
-    "*": {
-      "_visual-editing": [
-        "./dist/_visual-editing.d.ts"
-      ],
-      "theme": [
-        "./dist/theme.d.ts"
-      ]
-    }
-  },
+  "sideEffects": [
+    "./dist/kit.css",
+    "./dist/tokens.css",
+    "./dist/theme.css",
+    "./dist/styles.css",
+    "./dist/table/table.css",
+    "./dist/index.js",
+    "./dist/controls/*-register.js",
+    "./dist/controls/rich-text/index.js",
+    "./dist/controls/table/index.js"
+  ],
   "files": [
     "dist",
-    "exports",
-    "src"
+    "README.md"
   ],
   "scripts": {
     "build": "node scripts/build.mjs",
     "prepack": "node scripts/build.mjs",
-    "test": "bun test test/"
+    "test": "vitest run",
+    "kit:export": "bun scripts/kit-export.ts"
   },
   "dependencies": {
-    "@bettercms-ai/icons": "^0.3.0",
-    "@floating-ui/react-dom": "^2.1.6",
-    "@juggle/resize-observer": "^3.4.0",
-    "csstype": "^3.1.3",
-    "motion": "^12.23.24",
-    "react-compiler-runtime": "1.0.0",
-    "react-refractor": "^4.0.0",
-    "use-effect-event": "^2.0.3"
+    "clsx": "^2.1.1",
+    "tailwind-merge": "^3.5.0"
   },
   "peerDependencies": {
-    "react": "^18 || >=19.0.0-0",
-    "react-dom": "^18 || >=19.0.0-0",
-    "react-is": "^18 || >=19.0.0-0",
-    "styled-components": "^5.2 || ^6"
+    "@base-ui/react": "^1.4.1",
+    "@tabler/icons-react": "^3.48.0",
+    "framer-motion": "^12.40.0",
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0"
   },
   "devDependencies": {
-    "react": "^19.2.0",
-    "react-dom": "^19.2.0",
-    "react-is": "^19.2.0",
-    "styled-components": "^6.1.19"
+    "@base-ui/react": "^1.4.1",
+    "@tabler/icons-react": "3.48.0",
+    "@tailwindcss/node": "^4.2.2",
+    "@tailwindcss/postcss": "^4.2.2",
+    "@testing-library/dom": "^10.4.1",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.2",
+    "@types/node": "^20",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^6.0.1",
+    "fast-check": "^4.10.2",
+    "framer-motion": "^12.40.0",
+    "jsdom": "^29.1.1",
+    "postcss": "^8.5.6",
+    "react": "19.2.5",
+    "react-dom": "19.2.5",
+    "tailwindcss": "^4.2.2",
+    "typescript": "^6.0.3",
+    "vite": "^8.0.9",
+    "vitest": "^4.1.7"
   },
   "publishConfig": {
     "access": "public",

package/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2026 Sanity.io
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.