@lattice-php/lattice 0.1.0 → 0.2.0

package/dist/test-support.d.ts

@@ -0,0 +1,14 @@
+import { Node, PropsOf, Schema } from './core/types';
+/**
+ * Build a node fixture for tests with only the props a case cares about. The wire
+ * always carries the full prop object, but component reads default what's omitted,
+ * so partial props are safe here. Prop names stay checked against the node's
+ * generated type via `Partial<PropsOf<T>>`.
+ */
+export declare function fakeNode<TType extends string>(node: {
+    type: TType;
+    id?: string;
+    key?: string;
+    schema?: Schema;
+    props?: Partial<PropsOf<TType>>;
+}): Node<TType>;

package/dist/test-support.js

@@ -0,0 +1,14 @@
+//#region resources/js/test-support.ts
+/**
+* Build a node fixture for tests with only the props a case cares about. The wire
+* always carries the full prop object, but component reads default what's omitted,
+* so partial props are safe here. Prop names stay checked against the node's
+* generated type via `Partial<PropsOf<T>>`.
+*/
+function fakeNode(node) {
+	return node;
+}
+//#endregion
+export { fakeNode };
+
+//# sourceMappingURL=test-support.js.map

package/dist/test-support.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"test-support.js","names":[],"sources":["../resources/js/test-support.ts"],"sourcesContent":["import type { Node, PropsOf, Schema } from \"./core/types\";\n\n/**\n * Build a node fixture for tests with only the props a case cares about. The wire\n * always carries the full prop object, but component reads default what's omitted,\n * so partial props are safe here. Prop names stay checked against the node's\n * generated type via `Partial<PropsOf<T>>`.\n */\nexport function fakeNode<TType extends string>(node: {\n  type: TType;\n  id?: string;\n  key?: string;\n  schema?: Schema;\n  props?: Partial<PropsOf<TType>>;\n}): Node<TType> {\n  return node as unknown as Node<TType>;\n}\n"],"mappings":";;;;;;;AAQA,SAAgB,SAA+B,MAM/B;CACd,OAAO;AACT"}

package/dist/toast/index.d.ts

@@ -0,0 +1 @@
+export { Toaster } from './toaster';

package/dist/toast/index.js

@@ -0,0 +1,2 @@
+import { Toaster } from "./toaster.js";
+export { Toaster };

package/dist/toast/toaster.d.ts

@@ -0,0 +1,3 @@
+export declare function Toaster({ duration }: {
+    duration?: number;
+}): import("react").JSX.Element;

package/dist/toast/toaster.js

@@ -0,0 +1,126 @@
+import { cn } from "../lib/utils.js";
+import { Icon } from "../icons/sprite.js";
+import { useT } from "../i18n/instance.js";
+import { LATTICE_EVENT } from "../events/event-names.js";
+import { Renderer } from "../core/renderer.js";
+import { useRegistry } from "../provider.js";
+import { useEffect, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as Toast from "@radix-ui/react-toast";
+//#region resources/js/toast/toaster.tsx
+var variants = [
+	"success",
+	"info",
+	"warning",
+	"error"
+];
+var variantStyles = {
+	success: {
+		accent: "border-l-lt-success",
+		icon: /* @__PURE__ */ jsx(Icon, {
+			name: "circle-check",
+			className: "size-lt-icon-lg shrink-0 text-lt-success"
+		})
+	},
+	info: {
+		accent: "border-l-lt-info",
+		icon: /* @__PURE__ */ jsx(Icon, {
+			name: "info",
+			className: "size-lt-icon-lg shrink-0 text-lt-info"
+		})
+	},
+	warning: {
+		accent: "border-l-lt-warning",
+		icon: /* @__PURE__ */ jsx(Icon, {
+			name: "circle-alert",
+			className: "size-lt-icon-lg shrink-0 text-lt-warning"
+		})
+	},
+	error: {
+		accent: "border-l-lt-danger",
+		icon: /* @__PURE__ */ jsx(Icon, {
+			name: "circle-x",
+			className: "size-lt-icon-lg shrink-0 text-lt-danger"
+		})
+	}
+};
+function isVariant(value) {
+	return variants.some((variant) => variant === value);
+}
+var nextId = 0;
+function normalize(detail) {
+	if (typeof detail !== "object" || detail === null) return null;
+	const data = detail.toast;
+	if (typeof data !== "object" || data === null) return null;
+	const toast = data;
+	if (typeof toast.message !== "string" || toast.message === "") return null;
+	return {
+		action: toast.action ?? null,
+		dismissible: toast.dismissible !== false,
+		duration: typeof toast.duration === "number" ? toast.duration : null,
+		message: toast.message,
+		persistent: toast.persistent === true,
+		variant: isVariant(toast.variant) ? toast.variant : "success"
+	};
+}
+function Toaster({ duration = 4e3 }) {
+	const { t } = useT("lattice");
+	const registry = useRegistry();
+	const [toasts, setToasts] = useState([]);
+	function push(detail) {
+		const item = normalize(detail);
+		if (item) setToasts((current) => [...current, {
+			...item,
+			id: nextId++
+		}]);
+	}
+	function dismiss(id) {
+		setToasts((current) => current.filter((toast) => toast.id !== id));
+	}
+	useEffect(() => {
+		const listener = (event) => push(event.detail);
+		window.addEventListener(LATTICE_EVENT.toast, listener);
+		return () => window.removeEventListener(LATTICE_EVENT.toast, listener);
+	}, []);
+	return /* @__PURE__ */ jsxs(Toast.Provider, {
+		duration,
+		swipeDirection: "down",
+		children: [toasts.map((toast) => /* @__PURE__ */ jsxs(Toast.Root, {
+			className: cn("flex items-start gap-3 rounded-lt border border-l-4 border-lt-border bg-lt-popover p-4 text-lt-popover-fg shadow-lg", variantStyles[toast.variant].accent, "data-[state=open]:animate-lt-toast-in data-[state=closed]:animate-lt-toast-out", "data-[swipe=move]:translate-y-[var(--radix-toast-swipe-move-y)] data-[swipe=cancel]:translate-y-0 data-[swipe=cancel]:transition-transform"),
+			"data-test": `toast-${toast.variant}`,
+			duration: toast.persistent ? Infinity : toast.duration ?? duration,
+			onOpenChange: (open) => {
+				if (!open) dismiss(toast.id);
+			},
+			children: [
+				variantStyles[toast.variant].icon,
+				/* @__PURE__ */ jsxs("div", {
+					className: "flex min-w-0 flex-1 flex-col gap-2",
+					children: [/* @__PURE__ */ jsx(Toast.Title, {
+						className: "text-sm text-lt-fg",
+						children: toast.message
+					}), toast.action ? /* @__PURE__ */ jsx("div", {
+						className: "flex flex-wrap gap-2",
+						children: /* @__PURE__ */ jsx(Renderer, {
+							nodes: [toast.action],
+							registry
+						})
+					}) : null]
+				}),
+				toast.dismissible ? /* @__PURE__ */ jsx(Toast.Close, {
+					"aria-label": t("a11y.dismiss", "Dismiss"),
+					className: "shrink-0 rounded-md p-1 text-lt-muted-fg transition-colors hover:bg-lt-muted hover:text-lt-fg",
+					"data-test": "toast-dismiss",
+					children: /* @__PURE__ */ jsx(Icon, {
+						name: "x",
+						className: "size-lt-icon-md"
+					})
+				}) : null
+			]
+		}, toast.id)), /* @__PURE__ */ jsx(Toast.Viewport, { className: "fixed inset-x-0 bottom-0 z-[100] mx-auto flex w-full max-w-sm flex-col gap-2 p-4 outline-none" })]
+	});
+}
+//#endregion
+export { Toaster };
+
+//# sourceMappingURL=toaster.js.map

package/dist/toast/toaster.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toaster.js","names":[],"sources":["../../resources/js/toast/toaster.tsx"],"sourcesContent":["import { Icon } from \"@lattice/lattice/icons\";\nimport * as Toast from \"@radix-ui/react-toast\";\nimport { useEffect, useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { Renderer } from \"@lattice/lattice/core/renderer\";\nimport type { ToastMessage, ToastVariant } from \"@lattice/lattice/types/generated\";\nimport { LATTICE_EVENT } from \"@lattice/lattice/events/event-names\";\nimport { cn } from \"@lattice/lattice/lib/utils\";\nimport { useT } from \"@lattice/lattice/i18n\";\nimport { useRegistry } from \"@lattice/lattice/provider\";\n\nconst variants = [\"success\", \"info\", \"warning\", \"error\"] as const satisfies readonly ToastVariant[];\n\ntype ToastItem = ToastMessage & { id: number };\n\nconst variantStyles: Record<ToastVariant, { accent: string; icon: ReactNode }> = {\n  success: {\n    accent: \"border-l-lt-success\",\n    icon: <Icon name=\"circle-check\" className=\"size-lt-icon-lg shrink-0 text-lt-success\" />,\n  },\n  info: {\n    accent: \"border-l-lt-info\",\n    icon: <Icon name=\"info\" className=\"size-lt-icon-lg shrink-0 text-lt-info\" />,\n  },\n  warning: {\n    accent: \"border-l-lt-warning\",\n    icon: <Icon name=\"circle-alert\" className=\"size-lt-icon-lg shrink-0 text-lt-warning\" />,\n  },\n  error: {\n    accent: \"border-l-lt-danger\",\n    icon: <Icon name=\"circle-x\" className=\"size-lt-icon-lg shrink-0 text-lt-danger\" />,\n  },\n};\n\nfunction isVariant(value: unknown): value is ToastVariant {\n  return variants.some((variant) => variant === value);\n}\n\nlet nextId = 0;\n\nfunction normalize(detail: unknown): ToastMessage | null {\n  if (typeof detail !== \"object\" || detail === null) {\n    return null;\n  }\n\n  const data = (detail as { toast?: unknown }).toast;\n\n  if (typeof data !== \"object\" || data === null) {\n    return null;\n  }\n\n  const toast = data as Record<string, unknown>;\n\n  if (typeof toast.message !== \"string\" || toast.message === \"\") {\n    return null;\n  }\n\n  return {\n    action: (toast.action as ToastMessage[\"action\"]) ?? null,\n    dismissible: toast.dismissible !== false,\n    duration: typeof toast.duration === \"number\" ? toast.duration : null,\n    message: toast.message,\n    persistent: toast.persistent === true,\n    variant: isVariant(toast.variant) ? toast.variant : \"success\",\n  };\n}\n\nexport function Toaster({ duration = 4000 }: { duration?: number }) {\n  const { t } = useT(\"lattice\");\n  const registry = useRegistry();\n  const [toasts, setToasts] = useState<ToastItem[]>([]);\n\n  function push(detail: unknown): void {\n    const item = normalize(detail);\n\n    if (item) {\n      setToasts((current) => [...current, { ...item, id: nextId++ }]);\n    }\n  }\n\n  function dismiss(id: number): void {\n    setToasts((current) => current.filter((toast) => toast.id !== id));\n  }\n\n  useEffect(() => {\n    const listener = (event: Event): void => push((event as CustomEvent).detail);\n\n    window.addEventListener(LATTICE_EVENT.toast, listener);\n\n    return () => window.removeEventListener(LATTICE_EVENT.toast, listener);\n  }, []);\n\n  return (\n    <Toast.Provider duration={duration} swipeDirection=\"down\">\n      {toasts.map((toast) => (\n        <Toast.Root\n          key={toast.id}\n          className={cn(\n            \"flex items-start gap-3 rounded-lt border border-l-4 border-lt-border bg-lt-popover p-4 text-lt-popover-fg shadow-lg\",\n            variantStyles[toast.variant].accent,\n            \"data-[state=open]:animate-lt-toast-in data-[state=closed]:animate-lt-toast-out\",\n            \"data-[swipe=move]:translate-y-[var(--radix-toast-swipe-move-y)] data-[swipe=cancel]:translate-y-0 data-[swipe=cancel]:transition-transform\",\n          )}\n          data-test={`toast-${toast.variant}`}\n          duration={toast.persistent ? Infinity : (toast.duration ?? duration)}\n          onOpenChange={(open) => {\n            if (!open) {\n              dismiss(toast.id);\n            }\n          }}\n        >\n          {variantStyles[toast.variant].icon}\n          <div className=\"flex min-w-0 flex-1 flex-col gap-2\">\n            <Toast.Title className=\"text-sm text-lt-fg\">{toast.message}</Toast.Title>\n            {toast.action ? (\n              <div className=\"flex flex-wrap gap-2\">\n                <Renderer nodes={[toast.action]} registry={registry} />\n              </div>\n            ) : null}\n          </div>\n          {toast.dismissible ? (\n            <Toast.Close\n              aria-label={t(\"a11y.dismiss\", \"Dismiss\")}\n              className=\"shrink-0 rounded-md p-1 text-lt-muted-fg transition-colors hover:bg-lt-muted hover:text-lt-fg\"\n              data-test=\"toast-dismiss\"\n            >\n              <Icon name=\"x\" className=\"size-lt-icon-md\" />\n            </Toast.Close>\n          ) : null}\n        </Toast.Root>\n      ))}\n      <Toast.Viewport className=\"fixed inset-x-0 bottom-0 z-[100] mx-auto flex w-full max-w-sm flex-col gap-2 p-4 outline-none\" />\n    </Toast.Provider>\n  );\n}\n"],"mappings":"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"}