@lattice-php/lattice 0.1.0 → 0.3.0

package/dist/action/components/action.js

@@ -1,55 +1,55 @@
-import { withRefHeader } from "../../core/component-ref.js";
-import { getStringProp } from "../../core/props.js";
+import { withHeaders } from "../../core/headers.js";
+import { prefixedTestId } from "../../core/test-id.js";
 import { Button } from "../../core/components/button.js";
+import { IconRenderer } from "../../icons/icon-renderer.js";
 import { Spinner } from "../../core/components/spinner.js";
 import { ConfirmDialog } from "../../core/components/confirm-dialog.js";
-import { IconRenderer } from "../../icons/icon-renderer.js";
-import { dispatchActionEffects, dispatchActionError, getActionEffects } from "../effects.js";
+import { dispatchActionError, getActionEffects } from "../../effects/dispatch.js";
+import { useEffectDispatcher } from "../../effects/use-effect-dispatcher.js";
+import { ActionForm, useLazyActionForm } from "./action-form.js";
+import { actionMenuItemClassName, useActionMenu } from "./action-menu-context.js";
 import { useState } from "react";
 import { router, useHttp } from "@inertiajs/react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 //#region resources/js/action/components/action.tsx
-var actionMethods = [
-	"delete",
-	"get",
-	"patch",
-	"post",
-	"put"
-];
-function getActionMethod(props) {
-	const method = getStringProp(props, "method", "post");
-	return actionMethods.includes(method) ? method : "post";
-}
-function getConfirmation(props) {
-	const confirmation = props?.confirmation;
-	if (typeof confirmation !== "object" || confirmation === null || Array.isArray(confirmation)) return null;
-	return confirmation;
-}
 var ActionComponent = ({ node }) => {
-	const endpoint = getStringProp(node.props, "endpoint");
-	const icon = getStringProp(node.props, "icon");
-	const label = getStringProp(node.props, "label", "Run action");
-	const componentRef = getStringProp(node.props, "ref");
-	const method = getActionMethod(node.props);
+	const endpoint = node.props.endpoint ?? "";
+	const icon = node.props.icon;
+	const label = node.props.label ?? "Run action";
+	const componentRef = node.props.ref ?? "";
+	const method = node.props.method ?? "post";
 	const http = useHttp({});
+	const dispatch = useEffectDispatcher();
 	const [isConfirming, setIsConfirming] = useState(false);
-	const confirmation = getConfirmation(node.props);
+	const [isFilling, setIsFilling] = useState(false);
+	const isMenuItem = useActionMenu();
+	const confirmation = node.props.confirmation;
+	const variant = node.props.variant ?? "default";
+	const inlineForm = node.props.form;
+	const lazyForm = node.props.lazyForm === true;
+	const hasForm = Boolean(inlineForm) || lazyForm;
+	const lazyNode = useLazyActionForm(endpoint, componentRef, isFilling && lazyForm);
+	const formNode = lazyForm ? lazyNode : inlineForm;
 	const submit = async () => {
 		if (!endpoint) return;
 		try {
 			if (method === "get") {
-				router.visit(endpoint, { headers: withRefHeader(componentRef) });
+				router.visit(endpoint, { headers: withHeaders(componentRef) });
 				setIsConfirming(false);
 				return;
 			}
-			const responseEffects = getActionEffects((await http[method](endpoint, { headers: withRefHeader(componentRef) })).effects);
-			dispatchActionEffects(responseEffects.length > 0 ? responseEffects : getActionEffects(node.props?.effects));
+			const responseEffects = getActionEffects((await http[method](endpoint, { headers: withHeaders(componentRef) })).effects);
+			dispatch(responseEffects.length > 0 ? responseEffects : getActionEffects(node.props.effects));
 			setIsConfirming(false);
 		} catch (error) {
 			dispatchActionError(error);
 		}
 	};
 	const requestSubmit = () => {
+		if (hasForm) {
+			setIsFilling(true);
+			return;
+		}
 		if (confirmation) {
 			setIsConfirming(true);
 			return;
@@ -59,27 +59,49 @@ var ActionComponent = ({ node }) => {
 	const confirmationTitle = confirmation?.title ?? label;
 	const confirmationConfirmLabel = confirmation?.confirmLabel ?? label;
 	const confirmationCancelLabel = confirmation?.cancelLabel ?? "Cancel";
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs(Button, {
-		"data-lattice-component": node.id,
-		disabled: http.processing || !endpoint,
-		onClick: requestSubmit,
-		type: "button",
-		variant: node.props?.variant ?? "default",
-		children: [http.processing ? /* @__PURE__ */ jsx(Spinner, {}) : icon && /* @__PURE__ */ jsx(IconRenderer, {
-			className: "size-4",
-			icon
-		}), label]
-	}), isConfirming && confirmation && /* @__PURE__ */ jsx(ConfirmDialog, {
-		title: confirmationTitle,
-		description: confirmation.description,
-		confirmLabel: confirmationConfirmLabel,
-		cancelLabel: confirmationCancelLabel,
-		confirmVariant: node.props?.variant ?? "default",
-		processing: http.processing,
-		confirmDisabled: !endpoint,
-		onConfirm: () => void submit(),
-		onCancel: () => setIsConfirming(false)
-	})] });
+	const testId = node.key ?? prefixedTestId("action", node.id);
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		/* @__PURE__ */ jsxs(Button, {
+			className: isMenuItem ? actionMenuItemClassName : void 0,
+			"data-lattice-component": node.id,
+			"data-test": testId,
+			disabled: http.processing || !endpoint,
+			onClick: requestSubmit,
+			type: "button",
+			variant: isMenuItem ? "ghost" : variant,
+			children: [http.processing ? /* @__PURE__ */ jsx(Spinner, { className: isMenuItem ? "size-lt-icon-sm" : void 0 }) : icon && /* @__PURE__ */ jsx(IconRenderer, {
+				className: isMenuItem ? "size-lt-icon-sm" : "size-lt-icon-md",
+				icon
+			}), label]
+		}),
+		isConfirming && confirmation && /* @__PURE__ */ jsx(ConfirmDialog, {
+			title: confirmationTitle,
+			description: confirmation.description ?? void 0,
+			confirmLabel: confirmationConfirmLabel,
+			cancelLabel: confirmationCancelLabel,
+			confirmVariant: variant,
+			processing: http.processing,
+			confirmDisabled: !endpoint,
+			onConfirm: () => void submit(),
+			onCancel: () => setIsConfirming(false)
+		}),
+		isFilling && hasForm && /* @__PURE__ */ jsx(ActionForm, {
+			cancelLabel: confirmationCancelLabel,
+			componentRef,
+			description: confirmation?.description ?? void 0,
+			endpoint,
+			formNode,
+			method,
+			onClose: () => setIsFilling(false),
+			onSuccess: (response) => {
+				const responseEffects = getActionEffects(response.effects);
+				dispatch(responseEffects.length > 0 ? responseEffects : getActionEffects(node.props.effects));
+				setIsFilling(false);
+			},
+			submitLabel: confirmationConfirmLabel,
+			title: confirmationTitle
+		})
+	] });
 };
 //#endregion
 export { ActionComponent as default };

package/dist/action/components/action.js.map

@@ -1 +1 @@
-{"version":3,"file":"action.js","names":[],"sources":["../../../resources/js/action/components/action.tsx"],"sourcesContent":["import { router, useHttp } from \"@inertiajs/react\";\nimport type { Method } from \"@inertiajs/core\";\nimport { useState } from \"react\";\nimport { withRefHeader } from \"@lattice/lattice/core/component-ref\";\nimport { Button } from \"@lattice/lattice/core/components/button\";\nimport { ConfirmDialog } from \"@lattice/lattice/core/components/confirm-dialog\";\nimport { Spinner } from \"@lattice/lattice/core/components/spinner\";\nimport { getStringProp } from \"@lattice/lattice/core/props\";\nimport type { NodeProps, RendererComponent } from \"@lattice/lattice/core/types\";\nimport { IconRenderer } from \"@lattice/lattice/icons\";\nimport { dispatchActionEffects, dispatchActionError, getActionEffects } from \"../effects\";\nimport type { ActionEffect } from \"../effects\";\n\ntype ActionVariant = \"default\" | \"destructive\" | \"ghost\" | \"link\" | \"outline\" | \"secondary\";\n\ntype ActionConfirmation = {\n  cancelLabel?: string;\n  confirmLabel?: string;\n  description?: string;\n  title?: string;\n};\n\ntype ActionResponse = {\n  data?: Record<string, unknown>;\n  effects?: ActionEffect[];\n  ok?: boolean;\n};\n\ntype ActionData = Record<string, never>;\n\ndeclare module \"@lattice/lattice/core/types\" {\n  interface ComponentProps {\n    action: {\n      confirmation?: ActionConfirmation;\n      effects?: ActionEffect[];\n      endpoint?: string;\n      icon?: string;\n      label?: string;\n      ref?: string;\n      method?: Method;\n      variant?: ActionVariant;\n    };\n  }\n}\n\nconst actionMethods = [\"delete\", \"get\", \"patch\", \"post\", \"put\"] satisfies Method[];\n\nfunction getActionMethod(props: NodeProps | undefined): Method {\n  const method = getStringProp(props, \"method\", \"post\");\n\n  return actionMethods.includes(method as Method) ? (method as Method) : \"post\";\n}\n\nfunction getConfirmation(props: NodeProps | undefined): ActionConfirmation | null {\n  const confirmation = props?.confirmation;\n\n  if (typeof confirmation !== \"object\" || confirmation === null || Array.isArray(confirmation)) {\n    return null;\n  }\n\n  return confirmation;\n}\n\nconst ActionComponent: RendererComponent<\"action\"> = ({ node }) => {\n  const endpoint = getStringProp(node.props, \"endpoint\");\n  const icon = getStringProp(node.props, \"icon\");\n  const label = getStringProp(node.props, \"label\", \"Run action\");\n  const componentRef = getStringProp(node.props, \"ref\");\n  const method = getActionMethod(node.props);\n  const http = useHttp<ActionData, ActionResponse>({});\n  const [isConfirming, setIsConfirming] = useState(false);\n  const confirmation = getConfirmation(node.props);\n\n  const submit = async (): Promise<void> => {\n    if (!endpoint) {\n      return;\n    }\n\n    try {\n      if (method === \"get\") {\n        router.visit(endpoint, { headers: withRefHeader(componentRef) });\n        setIsConfirming(false);\n\n        return;\n      }\n\n      const response = await http[method](endpoint, { headers: withRefHeader(componentRef) });\n      const responseEffects = getActionEffects(response.effects);\n\n      dispatchActionEffects(\n        responseEffects.length > 0 ? responseEffects : getActionEffects(node.props?.effects),\n      );\n      setIsConfirming(false);\n    } catch (error) {\n      dispatchActionError(error);\n    }\n  };\n\n  const requestSubmit = (): void => {\n    if (confirmation) {\n      setIsConfirming(true);\n\n      return;\n    }\n\n    void submit();\n  };\n\n  const confirmationTitle = confirmation?.title ?? label;\n  const confirmationConfirmLabel = confirmation?.confirmLabel ?? label;\n  const confirmationCancelLabel = confirmation?.cancelLabel ?? \"Cancel\";\n\n  return (\n    <>\n      <Button\n        data-lattice-component={node.id}\n        disabled={http.processing || !endpoint}\n        onClick={requestSubmit}\n        type=\"button\"\n        variant={node.props?.variant ?? \"default\"}\n      >\n        {http.processing ? <Spinner /> : icon && <IconRenderer className=\"size-4\" icon={icon} />}\n        {label}\n      </Button>\n\n      {isConfirming && confirmation && (\n        <ConfirmDialog\n          title={confirmationTitle}\n          description={confirmation.description}\n          confirmLabel={confirmationConfirmLabel}\n          cancelLabel={confirmationCancelLabel}\n          confirmVariant={node.props?.variant ?? \"default\"}\n          processing={http.processing}\n          confirmDisabled={!endpoint}\n          onConfirm={() => void submit()}\n          onCancel={() => setIsConfirming(false)}\n        />\n      )}\n    </>\n  );\n};\n\nexport default ActionComponent;\n"],"mappings":";;;;;;;;;;;AA6CA,IAAM,gBAAgB;CAAC;CAAU;CAAO;CAAS;CAAQ;AAAK;AAE9D,SAAS,gBAAgB,OAAsC;CAC7D,MAAM,SAAS,cAAc,OAAO,UAAU,MAAM;CAEpD,OAAO,cAAc,SAAS,MAAgB,IAAK,SAAoB;AACzE;AAEA,SAAS,gBAAgB,OAAyD;CAChF,MAAM,eAAe,OAAO;CAE5B,IAAI,OAAO,iBAAiB,YAAY,iBAAiB,QAAQ,MAAM,QAAQ,YAAY,GACzF,OAAO;CAGT,OAAO;AACT;AAEA,IAAM,mBAAgD,EAAE,WAAW;CACjE,MAAM,WAAW,cAAc,KAAK,OAAO,UAAU;CACrD,MAAM,OAAO,cAAc,KAAK,OAAO,MAAM;CAC7C,MAAM,QAAQ,cAAc,KAAK,OAAO,SAAS,YAAY;CAC7D,MAAM,eAAe,cAAc,KAAK,OAAO,KAAK;CACpD,MAAM,SAAS,gBAAgB,KAAK,KAAK;CACzC,MAAM,OAAO,QAAoC,CAAC,CAAC;CACnD,MAAM,CAAC,cAAc,mBAAmB,SAAS,KAAK;CACtD,MAAM,eAAe,gBAAgB,KAAK,KAAK;CAE/C,MAAM,SAAS,YAA2B;EACxC,IAAI,CAAC,UACH;EAGF,IAAI;GACF,IAAI,WAAW,OAAO;IACpB,OAAO,MAAM,UAAU,EAAE,SAAS,cAAc,YAAY,EAAE,CAAC;IAC/D,gBAAgB,KAAK;IAErB;GACF;GAGA,MAAM,kBAAkB,kBAAiB,MADlB,KAAK,QAAQ,UAAU,EAAE,SAAS,cAAc,YAAY,EAAE,CAAC,GACpC,OAAO;GAEzD,sBACE,gBAAgB,SAAS,IAAI,kBAAkB,iBAAiB,KAAK,OAAO,OAAO,CACrF;GACA,gBAAgB,KAAK;EACvB,SAAS,OAAO;GACd,oBAAoB,KAAK;EAC3B;CACF;CAEA,MAAM,sBAA4B;EAChC,IAAI,cAAc;GAChB,gBAAgB,IAAI;GAEpB;EACF;EAEA,OAAY;CACd;CAEA,MAAM,oBAAoB,cAAc,SAAS;CACjD,MAAM,2BAA2B,cAAc,gBAAgB;CAC/D,MAAM,0BAA0B,cAAc,eAAe;CAE7D,OACE,qBAAA,UAAA,EAAA,UAAA,CACE,qBAAC,QAAD;EACE,0BAAwB,KAAK;EAC7B,UAAU,KAAK,cAAc,CAAC;EAC9B,SAAS;EACT,MAAK;EACL,SAAS,KAAK,OAAO,WAAW;YALlC,CAOG,KAAK,aAAa,oBAAC,SAAD,CAAU,CAAA,IAAI,QAAQ,oBAAC,cAAD;GAAc,WAAU;GAAe;EAAO,CAAA,GACtF,KACK;KAEP,gBAAgB,gBACf,oBAAC,eAAD;EACE,OAAO;EACP,aAAa,aAAa;EAC1B,cAAc;EACd,aAAa;EACb,gBAAgB,KAAK,OAAO,WAAW;EACvC,YAAY,KAAK;EACjB,iBAAiB,CAAC;EAClB,iBAAiB,KAAK,OAAO;EAC7B,gBAAgB,gBAAgB,KAAK;CACtC,CAAA,CAEH,EAAA,CAAA;AAEN"}
+{"version":3,"file":"action.js","names":[],"sources":["../../../resources/js/action/components/action.tsx"],"sourcesContent":["import { router, useHttp } from \"@inertiajs/react\";\nimport type { Method } from \"@inertiajs/core\";\nimport { useState } from \"react\";\nimport { withHeaders } from \"@lattice-php/lattice/core/headers\";\nimport { Button } from \"@lattice-php/lattice/core/components/button\";\nimport { ConfirmDialog } from \"@lattice-php/lattice/core/components/confirm-dialog\";\nimport { Spinner } from \"@lattice-php/lattice/core/components/spinner\";\nimport { prefixedTestId } from \"@lattice-php/lattice/core/test-id\";\nimport type { RendererComponent } from \"@lattice-php/lattice/core/types\";\nimport { IconRenderer } from \"@lattice-php/lattice/icons\";\nimport { dispatchActionError, getActionEffects } from \"@lattice-php/lattice/effects/dispatch\";\nimport type { ActionResponse } from \"@lattice-php/lattice/effects/dispatch\";\nimport { useEffectDispatcher } from \"@lattice-php/lattice/effects/use-effect-dispatcher\";\nimport { ActionForm, useLazyActionForm } from \"./action-form\";\nimport { actionMenuItemClassName, useActionMenu } from \"./action-menu-context\";\n\nconst ActionComponent: RendererComponent<\"action\"> = ({ node }) => {\n  const endpoint = node.props.endpoint ?? \"\";\n  const icon = node.props.icon;\n  const label = node.props.label ?? \"Run action\";\n  const componentRef = node.props.ref ?? \"\";\n  const method: Method = node.props.method ?? \"post\";\n  const http = useHttp<Record<string, never>, ActionResponse>({});\n  const dispatch = useEffectDispatcher();\n  const [isConfirming, setIsConfirming] = useState(false);\n  const [isFilling, setIsFilling] = useState(false);\n  const isMenuItem = useActionMenu();\n  const confirmation = node.props.confirmation;\n  const variant = node.props.variant ?? \"default\";\n  const inlineForm = node.props.form;\n  const lazyForm = node.props.lazyForm === true;\n  const hasForm = Boolean(inlineForm) || lazyForm;\n  const lazyNode = useLazyActionForm(endpoint, componentRef, isFilling && lazyForm);\n  const formNode = lazyForm ? lazyNode : inlineForm;\n\n  const submit = async (): Promise<void> => {\n    if (!endpoint) {\n      return;\n    }\n\n    try {\n      if (method === \"get\") {\n        router.visit(endpoint, { headers: withHeaders(componentRef) });\n        setIsConfirming(false);\n\n        return;\n      }\n\n      const response = await http[method](endpoint, { headers: withHeaders(componentRef) });\n      const responseEffects = getActionEffects(response.effects);\n\n      dispatch(responseEffects.length > 0 ? responseEffects : getActionEffects(node.props.effects));\n      setIsConfirming(false);\n    } catch (error) {\n      dispatchActionError(error);\n    }\n  };\n\n  const requestSubmit = (): void => {\n    if (hasForm) {\n      setIsFilling(true);\n\n      return;\n    }\n\n    if (confirmation) {\n      setIsConfirming(true);\n\n      return;\n    }\n\n    void submit();\n  };\n\n  const confirmationTitle = confirmation?.title ?? label;\n  const confirmationConfirmLabel = confirmation?.confirmLabel ?? label;\n  const confirmationCancelLabel = confirmation?.cancelLabel ?? \"Cancel\";\n  const testId = node.key ?? prefixedTestId(\"action\", node.id);\n\n  return (\n    <>\n      <Button\n        className={isMenuItem ? actionMenuItemClassName : undefined}\n        data-lattice-component={node.id}\n        data-test={testId}\n        disabled={http.processing || !endpoint}\n        onClick={requestSubmit}\n        type=\"button\"\n        variant={isMenuItem ? \"ghost\" : variant}\n      >\n        {http.processing ? (\n          <Spinner className={isMenuItem ? \"size-lt-icon-sm\" : undefined} />\n        ) : (\n          icon && (\n            <IconRenderer\n              className={isMenuItem ? \"size-lt-icon-sm\" : \"size-lt-icon-md\"}\n              icon={icon}\n            />\n          )\n        )}\n        {label}\n      </Button>\n\n      {isConfirming && confirmation && (\n        <ConfirmDialog\n          title={confirmationTitle}\n          description={confirmation.description ?? undefined}\n          confirmLabel={confirmationConfirmLabel}\n          cancelLabel={confirmationCancelLabel}\n          confirmVariant={variant}\n          processing={http.processing}\n          confirmDisabled={!endpoint}\n          onConfirm={() => void submit()}\n          onCancel={() => setIsConfirming(false)}\n        />\n      )}\n\n      {isFilling && hasForm && (\n        <ActionForm\n          cancelLabel={confirmationCancelLabel}\n          componentRef={componentRef}\n          description={confirmation?.description ?? undefined}\n          endpoint={endpoint}\n          formNode={formNode}\n          method={method}\n          onClose={() => setIsFilling(false)}\n          onSuccess={(response) => {\n            const responseEffects = getActionEffects(response.effects);\n\n            dispatch(\n              responseEffects.length > 0 ? responseEffects : getActionEffects(node.props.effects),\n            );\n            setIsFilling(false);\n          }}\n          submitLabel={confirmationConfirmLabel}\n          title={confirmationTitle}\n        />\n      )}\n    </>\n  );\n};\n\nexport default ActionComponent;\n"],"mappings":";;;;;;;;;;;;;;AAgBA,IAAM,mBAAgD,EAAE,WAAW;CACjE,MAAM,WAAW,KAAK,MAAM,YAAY;CACxC,MAAM,OAAO,KAAK,MAAM;CACxB,MAAM,QAAQ,KAAK,MAAM,SAAS;CAClC,MAAM,eAAe,KAAK,MAAM,OAAO;CACvC,MAAM,SAAiB,KAAK,MAAM,UAAU;CAC5C,MAAM,OAAO,QAA+C,CAAC,CAAC;CAC9D,MAAM,WAAW,oBAAoB;CACrC,MAAM,CAAC,cAAc,mBAAmB,SAAS,KAAK;CACtD,MAAM,CAAC,WAAW,gBAAgB,SAAS,KAAK;CAChD,MAAM,aAAa,cAAc;CACjC,MAAM,eAAe,KAAK,MAAM;CAChC,MAAM,UAAU,KAAK,MAAM,WAAW;CACtC,MAAM,aAAa,KAAK,MAAM;CAC9B,MAAM,WAAW,KAAK,MAAM,aAAa;CACzC,MAAM,UAAU,QAAQ,UAAU,KAAK;CACvC,MAAM,WAAW,kBAAkB,UAAU,cAAc,aAAa,QAAQ;CAChF,MAAM,WAAW,WAAW,WAAW;CAEvC,MAAM,SAAS,YAA2B;EACxC,IAAI,CAAC,UACH;EAGF,IAAI;GACF,IAAI,WAAW,OAAO;IACpB,OAAO,MAAM,UAAU,EAAE,SAAS,YAAY,YAAY,EAAE,CAAC;IAC7D,gBAAgB,KAAK;IAErB;GACF;GAGA,MAAM,kBAAkB,kBAAiB,MADlB,KAAK,QAAQ,UAAU,EAAE,SAAS,YAAY,YAAY,EAAE,CAAC,GAClC,OAAO;GAEzD,SAAS,gBAAgB,SAAS,IAAI,kBAAkB,iBAAiB,KAAK,MAAM,OAAO,CAAC;GAC5F,gBAAgB,KAAK;EACvB,SAAS,OAAO;GACd,oBAAoB,KAAK;EAC3B;CACF;CAEA,MAAM,sBAA4B;EAChC,IAAI,SAAS;GACX,aAAa,IAAI;GAEjB;EACF;EAEA,IAAI,cAAc;GAChB,gBAAgB,IAAI;GAEpB;EACF;EAEA,OAAY;CACd;CAEA,MAAM,oBAAoB,cAAc,SAAS;CACjD,MAAM,2BAA2B,cAAc,gBAAgB;CAC/D,MAAM,0BAA0B,cAAc,eAAe;CAC7D,MAAM,SAAS,KAAK,OAAO,eAAe,UAAU,KAAK,EAAE;CAE3D,OACE,qBAAA,YAAA,EAAA,UAAA;EACE,qBAAC,QAAD;GACE,WAAW,aAAa,0BAA0B,KAAA;GAClD,0BAAwB,KAAK;GAC7B,aAAW;GACX,UAAU,KAAK,cAAc,CAAC;GAC9B,SAAS;GACT,MAAK;GACL,SAAS,aAAa,UAAU;aAPlC,CASG,KAAK,aACJ,oBAAC,SAAD,EAAS,WAAW,aAAa,oBAAoB,KAAA,EAAY,CAAA,IAEjE,QACE,oBAAC,cAAD;IACE,WAAW,aAAa,oBAAoB;IACtC;GACP,CAAA,GAGJ,KACK;;EAEP,gBAAgB,gBACf,oBAAC,eAAD;GACE,OAAO;GACP,aAAa,aAAa,eAAe,KAAA;GACzC,cAAc;GACd,aAAa;GACb,gBAAgB;GAChB,YAAY,KAAK;GACjB,iBAAiB,CAAC;GAClB,iBAAiB,KAAK,OAAO;GAC7B,gBAAgB,gBAAgB,KAAK;EACtC,CAAA;EAGF,aAAa,WACZ,oBAAC,YAAD;GACE,aAAa;GACC;GACd,aAAa,cAAc,eAAe,KAAA;GAChC;GACA;GACF;GACR,eAAe,aAAa,KAAK;GACjC,YAAY,aAAa;IACvB,MAAM,kBAAkB,iBAAiB,SAAS,OAAO;IAEzD,SACE,gBAAgB,SAAS,IAAI,kBAAkB,iBAAiB,KAAK,MAAM,OAAO,CACpF;IACA,aAAa,KAAK;GACpB;GACA,aAAa;GACb,OAAO;EACR,CAAA;CAEH,EAAA,CAAA;AAEN"}

package/dist/action/index.d.ts

@@ -1 +1 @@
-export declare const actionComponents: import('../../../core/registry').Plugin;
+export declare const actionComponents: import('../core/registry').Plugin;

package/dist/action/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../resources/js/action/index.ts"],"sourcesContent":["import { createPlugin, eagerComponent } from \"@lattice/lattice/core/registry\";\nimport ActionComponent from \"./components/action\";\nimport ActionGroupComponent from \"./components/action-group\";\n\nexport const actionComponents = createPlugin({\n  components: {\n    action: eagerComponent(ActionComponent),\n    \"action.group\": eagerComponent(ActionGroupComponent),\n  },\n  name: \"lattice/action\",\n});\n"],"mappings":";;;;AAIA,IAAa,mBAAmB,aAAa;CAC3C,YAAY;EACV,QAAQ,eAAe,eAAe;EACtC,gBAAgB,eAAe,oBAAoB;CACrD;CACA,MAAM;AACR,CAAC"}
+{"version":3,"file":"index.js","names":[],"sources":["../../resources/js/action/index.ts"],"sourcesContent":["import { createPlugin, eagerComponent } from \"@lattice-php/lattice/core/registry\";\nimport ActionComponent from \"./components/action\";\nimport ActionGroupComponent from \"./components/action-group\";\n\nexport const actionComponents = createPlugin({\n  components: {\n    action: eagerComponent(ActionComponent),\n    \"action.group\": eagerComponent(ActionGroupComponent),\n  },\n  name: \"lattice/action\",\n});\n"],"mappings":";;;;AAIA,IAAa,mBAAmB,aAAa;CAC3C,YAAY;EACV,QAAQ,eAAe,eAAe;EACtC,gBAAgB,eAAe,oBAAoB;CACrD;CACA,MAAM;AACR,CAAC"}

package/dist/appearance/index.js

@@ -18,6 +18,7 @@ var getStoredAppearance = () => {
 var isDarkMode = (appearance) => {
 	return appearance === "dark" || appearance === "system" && prefersDark();
 };
+var getSystemAppearance = () => prefersDark() ? "dark" : "light";
 var applyTheme = (appearance) => {
 	if (typeof document === "undefined") return;
 	const isDark = isDarkMode(appearance);
@@ -33,7 +34,10 @@ var mediaQuery = () => {
 	if (typeof window === "undefined") return null;
 	return window.matchMedia("(prefers-color-scheme: dark)");
 };
-var handleSystemThemeChange = () => applyTheme(currentAppearance);
+var handleSystemThemeChange = () => {
+	applyTheme(currentAppearance);
+	notify();
+};
 function initializeTheme() {
 	if (typeof window === "undefined") return;
 	if (!localStorage.getItem("appearance")) {
@@ -46,7 +50,8 @@ function initializeTheme() {
 }
 function useAppearance() {
 	const appearance = useSyncExternalStore(subscribe, () => currentAppearance, () => "system");
-	const resolvedAppearance = isDarkMode(appearance) ? "dark" : "light";
+	const systemAppearance = useSyncExternalStore(subscribe, getSystemAppearance, () => "light");
+	const resolvedAppearance = appearance === "system" ? systemAppearance : appearance;
 	const updateAppearance = (mode) => {
 		currentAppearance = mode;
 		localStorage.setItem("appearance", mode);

package/dist/appearance/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../resources/js/appearance/index.ts"],"sourcesContent":["import { useSyncExternalStore } from \"react\";\nimport type { Appearance } from \"../events/event-bridge\";\n\nexport type ResolvedAppearance = \"light\" | \"dark\";\n\nexport type UseAppearanceReturn = {\n  readonly appearance: Appearance;\n  readonly resolvedAppearance: ResolvedAppearance;\n  readonly updateAppearance: (mode: Appearance) => void;\n};\n\nconst listeners = new Set<() => void>();\nlet currentAppearance: Appearance = \"system\";\n\nconst prefersDark = (): boolean => {\n  if (typeof window === \"undefined\") {\n    return false;\n  }\n\n  return window.matchMedia(\"(prefers-color-scheme: dark)\").matches;\n};\n\nconst setCookie = (name: string, value: string, days = 365): void => {\n  if (typeof document === \"undefined\") {\n    return;\n  }\n\n  const maxAge = days * 24 * 60 * 60;\n  document.cookie = `${name}=${value};path=/;max-age=${maxAge};SameSite=Lax`;\n};\n\nconst getStoredAppearance = (): Appearance => {\n  if (typeof window === \"undefined\") {\n    return \"system\";\n  }\n\n  return (localStorage.getItem(\"appearance\") as Appearance) || \"system\";\n};\n\nconst isDarkMode = (appearance: Appearance): boolean => {\n  return appearance === \"dark\" || (appearance === \"system\" && prefersDark());\n};\n\nconst applyTheme = (appearance: Appearance): void => {\n  if (typeof document === \"undefined\") {\n    return;\n  }\n\n  const isDark = isDarkMode(appearance);\n\n  document.documentElement.classList.toggle(\"dark\", isDark);\n  document.documentElement.style.colorScheme = isDark ? \"dark\" : \"light\";\n};\n\nconst subscribe = (callback: () => void) => {\n  listeners.add(callback);\n\n  return () => listeners.delete(callback);\n};\n\nconst notify = (): void => listeners.forEach((listener) => listener());\n\nconst mediaQuery = (): MediaQueryList | null => {\n  if (typeof window === \"undefined\") {\n    return null;\n  }\n\n  return window.matchMedia(\"(prefers-color-scheme: dark)\");\n};\n\nconst handleSystemThemeChange = (): void => applyTheme(currentAppearance);\n\nexport function initializeTheme(): void {\n  if (typeof window === \"undefined\") {\n    return;\n  }\n\n  if (!localStorage.getItem(\"appearance\")) {\n    localStorage.setItem(\"appearance\", \"system\");\n    setCookie(\"appearance\", \"system\");\n  }\n\n  currentAppearance = getStoredAppearance();\n  applyTheme(currentAppearance);\n\n  mediaQuery()?.addEventListener(\"change\", handleSystemThemeChange);\n}\n\nexport function useAppearance(): UseAppearanceReturn {\n  const appearance: Appearance = useSyncExternalStore(\n    subscribe,\n    () => currentAppearance,\n    () => \"system\",\n  );\n\n  const resolvedAppearance: ResolvedAppearance = isDarkMode(appearance) ? \"dark\" : \"light\";\n\n  const updateAppearance = (mode: Appearance): void => {\n    currentAppearance = mode;\n\n    localStorage.setItem(\"appearance\", mode);\n\n    setCookie(\"appearance\", mode);\n\n    applyTheme(mode);\n    notify();\n  };\n\n  return { appearance, resolvedAppearance, updateAppearance } as const;\n}\n"],"mappings":";;AAWA,IAAM,4BAAY,IAAI,IAAgB;AACtC,IAAI,oBAAgC;AAEpC,IAAM,oBAA6B;CACjC,IAAI,OAAO,WAAW,aACpB,OAAO;CAGT,OAAO,OAAO,WAAW,8BAA8B,EAAE;AAC3D;AAEA,IAAM,aAAa,MAAc,OAAe,OAAO,QAAc;CACnE,IAAI,OAAO,aAAa,aACtB;CAGF,MAAM,SAAS,OAAO,KAAK,KAAK;CAChC,SAAS,SAAS,GAAG,KAAK,GAAG,MAAM,kBAAkB,OAAO;AAC9D;AAEA,IAAM,4BAAwC;CAC5C,IAAI,OAAO,WAAW,aACpB,OAAO;CAGT,OAAQ,aAAa,QAAQ,YAAY,KAAoB;AAC/D;AAEA,IAAM,cAAc,eAAoC;CACtD,OAAO,eAAe,UAAW,eAAe,YAAY,YAAY;AAC1E;AAEA,IAAM,cAAc,eAAiC;CACnD,IAAI,OAAO,aAAa,aACtB;CAGF,MAAM,SAAS,WAAW,UAAU;CAEpC,SAAS,gBAAgB,UAAU,OAAO,QAAQ,MAAM;CACxD,SAAS,gBAAgB,MAAM,cAAc,SAAS,SAAS;AACjE;AAEA,IAAM,aAAa,aAAyB;CAC1C,UAAU,IAAI,QAAQ;CAEtB,aAAa,UAAU,OAAO,QAAQ;AACxC;AAEA,IAAM,eAAqB,UAAU,SAAS,aAAa,SAAS,CAAC;AAErE,IAAM,mBAA0C;CAC9C,IAAI,OAAO,WAAW,aACpB,OAAO;CAGT,OAAO,OAAO,WAAW,8BAA8B;AACzD;AAEA,IAAM,gCAAsC,WAAW,iBAAiB;AAExE,SAAgB,kBAAwB;CACtC,IAAI,OAAO,WAAW,aACpB;CAGF,IAAI,CAAC,aAAa,QAAQ,YAAY,GAAG;EACvC,aAAa,QAAQ,cAAc,QAAQ;EAC3C,UAAU,cAAc,QAAQ;CAClC;CAEA,oBAAoB,oBAAoB;CACxC,WAAW,iBAAiB;CAE5B,WAAW,GAAG,iBAAiB,UAAU,uBAAuB;AAClE;AAEA,SAAgB,gBAAqC;CACnD,MAAM,aAAyB,qBAC7B,iBACM,yBACA,QACR;CAEA,MAAM,qBAAyC,WAAW,UAAU,IAAI,SAAS;CAEjF,MAAM,oBAAoB,SAA2B;EACnD,oBAAoB;EAEpB,aAAa,QAAQ,cAAc,IAAI;EAEvC,UAAU,cAAc,IAAI;EAE5B,WAAW,IAAI;EACf,OAAO;CACT;CAEA,OAAO;EAAE;EAAY;EAAoB;CAAiB;AAC5D"}
+{"version":3,"file":"index.js","names":[],"sources":["../../resources/js/appearance/index.ts"],"sourcesContent":["import { useSyncExternalStore } from \"react\";\nimport type { Appearance } from \"../events/event-bridge\";\n\nexport type ResolvedAppearance = \"light\" | \"dark\";\n\nexport type UseAppearanceReturn = {\n  readonly appearance: Appearance;\n  readonly resolvedAppearance: ResolvedAppearance;\n  readonly updateAppearance: (mode: Appearance) => void;\n};\n\nconst listeners = new Set<() => void>();\nlet currentAppearance: Appearance = \"system\";\n\nconst prefersDark = (): boolean => {\n  if (typeof window === \"undefined\") {\n    return false;\n  }\n\n  return window.matchMedia(\"(prefers-color-scheme: dark)\").matches;\n};\n\nconst setCookie = (name: string, value: string, days = 365): void => {\n  if (typeof document === \"undefined\") {\n    return;\n  }\n\n  const maxAge = days * 24 * 60 * 60;\n  document.cookie = `${name}=${value};path=/;max-age=${maxAge};SameSite=Lax`;\n};\n\nconst getStoredAppearance = (): Appearance => {\n  if (typeof window === \"undefined\") {\n    return \"system\";\n  }\n\n  return (localStorage.getItem(\"appearance\") as Appearance) || \"system\";\n};\n\nconst isDarkMode = (appearance: Appearance): boolean => {\n  return appearance === \"dark\" || (appearance === \"system\" && prefersDark());\n};\n\nconst getSystemAppearance = (): ResolvedAppearance => (prefersDark() ? \"dark\" : \"light\");\n\nconst applyTheme = (appearance: Appearance): void => {\n  if (typeof document === \"undefined\") {\n    return;\n  }\n\n  const isDark = isDarkMode(appearance);\n\n  document.documentElement.classList.toggle(\"dark\", isDark);\n  document.documentElement.style.colorScheme = isDark ? \"dark\" : \"light\";\n};\n\nconst subscribe = (callback: () => void) => {\n  listeners.add(callback);\n\n  return () => listeners.delete(callback);\n};\n\nconst notify = (): void => listeners.forEach((listener) => listener());\n\nconst mediaQuery = (): MediaQueryList | null => {\n  if (typeof window === \"undefined\") {\n    return null;\n  }\n\n  return window.matchMedia(\"(prefers-color-scheme: dark)\");\n};\n\nconst handleSystemThemeChange = (): void => {\n  applyTheme(currentAppearance);\n  notify();\n};\n\nexport function initializeTheme(): void {\n  if (typeof window === \"undefined\") {\n    return;\n  }\n\n  if (!localStorage.getItem(\"appearance\")) {\n    localStorage.setItem(\"appearance\", \"system\");\n    setCookie(\"appearance\", \"system\");\n  }\n\n  currentAppearance = getStoredAppearance();\n  applyTheme(currentAppearance);\n\n  mediaQuery()?.addEventListener(\"change\", handleSystemThemeChange);\n}\n\nexport function useAppearance(): UseAppearanceReturn {\n  const appearance: Appearance = useSyncExternalStore(\n    subscribe,\n    () => currentAppearance,\n    () => \"system\",\n  );\n  const systemAppearance: ResolvedAppearance = useSyncExternalStore(\n    subscribe,\n    getSystemAppearance,\n    () => \"light\",\n  );\n\n  const resolvedAppearance: ResolvedAppearance =\n    appearance === \"system\" ? systemAppearance : appearance;\n\n  const updateAppearance = (mode: Appearance): void => {\n    currentAppearance = mode;\n\n    localStorage.setItem(\"appearance\", mode);\n\n    setCookie(\"appearance\", mode);\n\n    applyTheme(mode);\n    notify();\n  };\n\n  return { appearance, resolvedAppearance, updateAppearance } as const;\n}\n"],"mappings":";;AAWA,IAAM,4BAAY,IAAI,IAAgB;AACtC,IAAI,oBAAgC;AAEpC,IAAM,oBAA6B;CACjC,IAAI,OAAO,WAAW,aACpB,OAAO;CAGT,OAAO,OAAO,WAAW,8BAA8B,EAAE;AAC3D;AAEA,IAAM,aAAa,MAAc,OAAe,OAAO,QAAc;CACnE,IAAI,OAAO,aAAa,aACtB;CAGF,MAAM,SAAS,OAAO,KAAK,KAAK;CAChC,SAAS,SAAS,GAAG,KAAK,GAAG,MAAM,kBAAkB,OAAO;AAC9D;AAEA,IAAM,4BAAwC;CAC5C,IAAI,OAAO,WAAW,aACpB,OAAO;CAGT,OAAQ,aAAa,QAAQ,YAAY,KAAoB;AAC/D;AAEA,IAAM,cAAc,eAAoC;CACtD,OAAO,eAAe,UAAW,eAAe,YAAY,YAAY;AAC1E;AAEA,IAAM,4BAAiD,YAAY,IAAI,SAAS;AAEhF,IAAM,cAAc,eAAiC;CACnD,IAAI,OAAO,aAAa,aACtB;CAGF,MAAM,SAAS,WAAW,UAAU;CAEpC,SAAS,gBAAgB,UAAU,OAAO,QAAQ,MAAM;CACxD,SAAS,gBAAgB,MAAM,cAAc,SAAS,SAAS;AACjE;AAEA,IAAM,aAAa,aAAyB;CAC1C,UAAU,IAAI,QAAQ;CAEtB,aAAa,UAAU,OAAO,QAAQ;AACxC;AAEA,IAAM,eAAqB,UAAU,SAAS,aAAa,SAAS,CAAC;AAErE,IAAM,mBAA0C;CAC9C,IAAI,OAAO,WAAW,aACpB,OAAO;CAGT,OAAO,OAAO,WAAW,8BAA8B;AACzD;AAEA,IAAM,gCAAsC;CAC1C,WAAW,iBAAiB;CAC5B,OAAO;AACT;AAEA,SAAgB,kBAAwB;CACtC,IAAI,OAAO,WAAW,aACpB;CAGF,IAAI,CAAC,aAAa,QAAQ,YAAY,GAAG;EACvC,aAAa,QAAQ,cAAc,QAAQ;EAC3C,UAAU,cAAc,QAAQ;CAClC;CAEA,oBAAoB,oBAAoB;CACxC,WAAW,iBAAiB;CAE5B,WAAW,GAAG,iBAAiB,UAAU,uBAAuB;AAClE;AAEA,SAAgB,gBAAqC;CACnD,MAAM,aAAyB,qBAC7B,iBACM,yBACA,QACR;CACA,MAAM,mBAAuC,qBAC3C,WACA,2BACM,OACR;CAEA,MAAM,qBACJ,eAAe,WAAW,mBAAmB;CAE/C,MAAM,oBAAoB,SAA2B;EACnD,oBAAoB;EAEpB,aAAa,QAAQ,cAAc,IAAI;EAEvC,UAAU,cAAc,IAAI;EAE5B,WAAW,IAAI;EACf,OAAO;CACT;CAEA,OAAO;EAAE;EAAY;EAAoB;CAAiB;AAC5D"}

package/dist/chat/components/chat-box.d.ts

@@ -0,0 +1,3 @@
+import { RendererComponent } from '../../core/types';
+export declare const ChatBox: RendererComponent<"chat.box">;
+export default ChatBox;

package/dist/chat/components/chat-box.js

@@ -0,0 +1,53 @@
+import { cn } from "../../lib/utils.js";
+import { testIdentity } from "../../core/test-id.js";
+import { useT } from "../../i18n/instance.js";
+import { apiFetch } from "../../core/api.js";
+import { useChat } from "../use-chat.js";
+import { MessageList } from "./message-list.js";
+import { PromptInput } from "./prompt-input.js";
+import { useCallback, useEffect, useRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region resources/js/chat/components/chat-box.tsx
+var ChatBox = ({ node }) => {
+	const { streamEndpoint, historyEndpoint, placeholder, title, fill } = node.props;
+	const { t } = useT("lattice");
+	const { messages, status, sendMessage, setMessages } = useChat({ endpoint: streamEndpoint ?? "" });
+	const seededRef = useRef(false);
+	const seedHistory = useCallback(async () => {
+		if (seededRef.current || !historyEndpoint) return;
+		seededRef.current = true;
+		const response = await apiFetch(historyEndpoint, { throwOnError: false });
+		if (!response.ok) return;
+		setMessages((await response.json()).messages);
+	}, [historyEndpoint, setMessages]);
+	useEffect(() => {
+		seedHistory();
+	}, [seedHistory]);
+	const busy = status === "submitted" || status === "streaming";
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("flex flex-col overflow-hidden border border-lt-border bg-lt-bg", fill ? "sticky top-0 h-svh w-full" : "h-[28rem] w-80 rounded-lt-md shadow-lg"),
+		"data-test": testIdentity("chat-box"),
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: "flex items-center border-b border-lt-border px-3 py-2",
+				children: /* @__PURE__ */ jsx("span", {
+					className: "text-sm font-medium text-lt-fg",
+					children: title ?? t("chat.title", "Chat")
+				})
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: "flex-1 overflow-y-auto",
+				children: /* @__PURE__ */ jsx(MessageList, { messages })
+			}),
+			/* @__PURE__ */ jsx(PromptInput, {
+				disabled: busy,
+				onSubmit: sendMessage,
+				placeholder: placeholder ?? void 0
+			})
+		]
+	});
+};
+//#endregion
+export { ChatBox, ChatBox as default };
+
+//# sourceMappingURL=chat-box.js.map

package/dist/chat/components/chat-box.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-box.js","names":[],"sources":["../../../resources/js/chat/components/chat-box.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef } from \"react\";\nimport { apiFetch } from \"@lattice-php/lattice/core/api\";\nimport { testIdentity } from \"@lattice-php/lattice/core/test-id\";\nimport type { RendererComponent } from \"@lattice-php/lattice/core/types\";\nimport { cn } from \"@lattice-php/lattice/lib/utils\";\nimport { useT } from \"@lattice-php/lattice/i18n\";\nimport { useChat } from \"../use-chat\";\nimport type { ChatMessage } from \"../types\";\nimport { MessageList } from \"./message-list\";\nimport { PromptInput } from \"./prompt-input\";\n\ntype ChatHistoryResponse = { messages: ChatMessage[] };\n\nexport const ChatBox: RendererComponent<\"chat.box\"> = ({ node }) => {\n  const { streamEndpoint, historyEndpoint, placeholder, title, fill } = node.props;\n  const { t } = useT(\"lattice\");\n  const { messages, status, sendMessage, setMessages } = useChat({\n    endpoint: streamEndpoint ?? \"\",\n  });\n\n  const seededRef = useRef(false);\n\n  const seedHistory = useCallback(async (): Promise<void> => {\n    if (seededRef.current || !historyEndpoint) {\n      return;\n    }\n\n    seededRef.current = true;\n\n    const response = await apiFetch(historyEndpoint, { throwOnError: false });\n\n    if (!response.ok) {\n      return;\n    }\n\n    const payload = (await response.json()) as ChatHistoryResponse;\n    setMessages(payload.messages);\n  }, [historyEndpoint, setMessages]);\n\n  useEffect(() => {\n    void seedHistory();\n  }, [seedHistory]);\n\n  const busy = status === \"submitted\" || status === \"streaming\";\n\n  return (\n    <div\n      className={cn(\n        \"flex flex-col overflow-hidden border border-lt-border bg-lt-bg\",\n        fill ? \"sticky top-0 h-svh w-full\" : \"h-[28rem] w-80 rounded-lt-md shadow-lg\",\n      )}\n      data-test={testIdentity(\"chat-box\")}\n    >\n      <div className=\"flex items-center border-b border-lt-border px-3 py-2\">\n        <span className=\"text-sm font-medium text-lt-fg\">{title ?? t(\"chat.title\", \"Chat\")}</span>\n      </div>\n      <div className=\"flex-1 overflow-y-auto\">\n        <MessageList messages={messages} />\n      </div>\n      <PromptInput disabled={busy} onSubmit={sendMessage} placeholder={placeholder ?? undefined} />\n    </div>\n  );\n};\n\nexport default ChatBox;\n"],"mappings":";;;;;;;;;;AAaA,IAAa,WAA0C,EAAE,WAAW;CAClE,MAAM,EAAE,gBAAgB,iBAAiB,aAAa,OAAO,SAAS,KAAK;CAC3E,MAAM,EAAE,MAAM,KAAK,SAAS;CAC5B,MAAM,EAAE,UAAU,QAAQ,aAAa,gBAAgB,QAAQ,EAC7D,UAAU,kBAAkB,GAC9B,CAAC;CAED,MAAM,YAAY,OAAO,KAAK;CAE9B,MAAM,cAAc,YAAY,YAA2B;EACzD,IAAI,UAAU,WAAW,CAAC,iBACxB;EAGF,UAAU,UAAU;EAEpB,MAAM,WAAW,MAAM,SAAS,iBAAiB,EAAE,cAAc,MAAM,CAAC;EAExE,IAAI,CAAC,SAAS,IACZ;EAIF,aAAY,MADW,SAAS,KAAK,GACjB,QAAQ;CAC9B,GAAG,CAAC,iBAAiB,WAAW,CAAC;CAEjC,gBAAgB;EACd,YAAiB;CACnB,GAAG,CAAC,WAAW,CAAC;CAEhB,MAAM,OAAO,WAAW,eAAe,WAAW;CAElD,OACE,qBAAC,OAAD;EACE,WAAW,GACT,kEACA,OAAO,8BAA8B,wCACvC;EACA,aAAW,aAAa,UAAU;YALpC;GAOE,oBAAC,OAAD;IAAK,WAAU;cACb,oBAAC,QAAD;KAAM,WAAU;eAAkC,SAAS,EAAE,cAAc,MAAM;IAAQ,CAAA;GACtF,CAAA;GACL,oBAAC,OAAD;IAAK,WAAU;cACb,oBAAC,aAAD,EAAuB,SAAW,CAAA;GAC/B,CAAA;GACL,oBAAC,aAAD;IAAa,UAAU;IAAM,UAAU;IAAa,aAAa,eAAe,KAAA;GAAY,CAAA;EACzF;;AAET"}

package/dist/chat/components/message-list.d.ts

@@ -0,0 +1,5 @@
+import { ReactNode } from 'react';
+import { ChatMessage } from '../types';
+export declare function MessageList({ messages }: {
+    messages: ChatMessage[];
+}): ReactNode;

package/dist/chat/components/message-list.js

@@ -0,0 +1,22 @@
+import { testIdentity } from "../../core/test-id.js";
+import { Message } from "./message.js";
+import { useEffect, useRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region resources/js/chat/components/message-list.tsx
+function MessageList({ messages }) {
+	const bottomRef = useRef(null);
+	const lastMessage = messages.at(-1);
+	const lastPartLength = lastMessage?.parts.at(-1) !== void 0 ? JSON.stringify(lastMessage.parts.at(-1)).length : 0;
+	useEffect(() => {
+		if (bottomRef.current && typeof bottomRef.current.scrollIntoView === "function") bottomRef.current.scrollIntoView({ behavior: "smooth" });
+	}, [messages.length, lastPartLength]);
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex flex-col gap-2 overflow-y-auto p-3",
+		"data-test": testIdentity("chat-messages"),
+		children: [messages.map((message) => /* @__PURE__ */ jsx(Message, { message }, message.id)), /* @__PURE__ */ jsx("div", { ref: bottomRef })]
+	});
+}
+//#endregion
+export { MessageList };
+
+//# sourceMappingURL=message-list.js.map

package/dist/chat/components/message-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"message-list.js","names":[],"sources":["../../../resources/js/chat/components/message-list.tsx"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { testIdentity } from \"@lattice-php/lattice/core/test-id\";\nimport type { ChatMessage } from \"../types\";\nimport { Message } from \"./message\";\n\nexport function MessageList({ messages }: { messages: ChatMessage[] }): ReactNode {\n  const bottomRef = useRef<HTMLDivElement>(null);\n  const lastMessage = messages.at(-1);\n  const lastPartLength =\n    lastMessage?.parts.at(-1) !== undefined ? JSON.stringify(lastMessage.parts.at(-1)).length : 0;\n\n  useEffect(() => {\n    if (bottomRef.current && typeof bottomRef.current.scrollIntoView === \"function\") {\n      bottomRef.current.scrollIntoView({ behavior: \"smooth\" });\n    }\n  }, [messages.length, lastPartLength]);\n\n  return (\n    <div\n      className=\"flex flex-col gap-2 overflow-y-auto p-3\"\n      data-test={testIdentity(\"chat-messages\")}\n    >\n      {messages.map((message) => (\n        <Message key={message.id} message={message} />\n      ))}\n      <div ref={bottomRef} />\n    </div>\n  );\n}\n"],"mappings":";;;;;AAMA,SAAgB,YAAY,EAAE,YAAoD;CAChF,MAAM,YAAY,OAAuB,IAAI;CAC7C,MAAM,cAAc,SAAS,GAAG,EAAE;CAClC,MAAM,iBACJ,aAAa,MAAM,GAAG,EAAE,MAAM,KAAA,IAAY,KAAK,UAAU,YAAY,MAAM,GAAG,EAAE,CAAC,EAAE,SAAS;CAE9F,gBAAgB;EACd,IAAI,UAAU,WAAW,OAAO,UAAU,QAAQ,mBAAmB,YACnE,UAAU,QAAQ,eAAe,EAAE,UAAU,SAAS,CAAC;CAE3D,GAAG,CAAC,SAAS,QAAQ,cAAc,CAAC;CAEpC,OACE,qBAAC,OAAD;EACE,WAAU;EACV,aAAW,aAAa,eAAe;YAFzC,CAIG,SAAS,KAAK,YACb,oBAAC,SAAD,EAAmC,QAAU,GAA/B,QAAQ,EAAuB,CAC9C,GACD,oBAAC,OAAD,EAAK,KAAK,UAAY,CAAA,CACnB;;AAET"}

package/dist/chat/components/message.d.ts

@@ -0,0 +1,5 @@
+import { ReactNode } from 'react';
+import { ChatMessage } from '../types';
+export declare function Message({ message }: {
+    message: ChatMessage;
+}): ReactNode;

package/dist/chat/components/message.js

@@ -0,0 +1,20 @@
+import { cn } from "../../lib/utils.js";
+import { testIdentity } from "../../core/test-id.js";
+import { RenderNode } from "../../core/renderer.js";
+import { jsx } from "react/jsx-runtime";
+//#region resources/js/chat/components/message.tsx
+function Message({ message }) {
+	const isUser = message.role === "user";
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("flex flex-col gap-1", isUser ? "items-end" : "items-start"),
+		"data-test": testIdentity(`chat-message-${message.role}`),
+		children: /* @__PURE__ */ jsx("div", {
+			className: cn("max-w-[80%] rounded-lt-md px-3 py-2 text-sm", isUser ? "bg-lt-primary text-lt-primary-fg" : "bg-lt-muted text-lt-fg"),
+			children: message.parts.map((part, index) => /* @__PURE__ */ jsx(RenderNode, { node: part }, part.key ?? index))
+		})
+	});
+}
+//#endregion
+export { Message };
+
+//# sourceMappingURL=message.js.map

package/dist/chat/components/message.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"message.js","names":[],"sources":["../../../resources/js/chat/components/message.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"@lattice-php/lattice/lib/utils\";\nimport { testIdentity } from \"@lattice-php/lattice/core/test-id\";\nimport { RenderNode } from \"@lattice-php/lattice/core/renderer\";\nimport type { ChatMessage } from \"../types\";\n\nexport function Message({ message }: { message: ChatMessage }): ReactNode {\n  const isUser = message.role === \"user\";\n\n  return (\n    <div\n      className={cn(\"flex flex-col gap-1\", isUser ? \"items-end\" : \"items-start\")}\n      data-test={testIdentity(`chat-message-${message.role}`)}\n    >\n      <div\n        className={cn(\n          \"max-w-[80%] rounded-lt-md px-3 py-2 text-sm\",\n          isUser ? \"bg-lt-primary text-lt-primary-fg\" : \"bg-lt-muted text-lt-fg\",\n        )}\n      >\n        {message.parts.map((part, index) => (\n          <RenderNode key={part.key ?? index} node={part} />\n        ))}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;AAMA,SAAgB,QAAQ,EAAE,WAAgD;CACxE,MAAM,SAAS,QAAQ,SAAS;CAEhC,OACE,oBAAC,OAAD;EACE,WAAW,GAAG,uBAAuB,SAAS,cAAc,aAAa;EACzE,aAAW,aAAa,gBAAgB,QAAQ,MAAM;YAEtD,oBAAC,OAAD;GACE,WAAW,GACT,+CACA,SAAS,qCAAqC,wBAChD;aAEC,QAAQ,MAAM,KAAK,MAAM,UACxB,oBAAC,YAAD,EAAoC,MAAM,KAAO,GAAhC,KAAK,OAAO,KAAoB,CAClD;EACE,CAAA;CACF,CAAA;AAET"}

package/dist/chat/components/prompt-input.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from 'react';
+type PromptInputProps = {
+    onSubmit: (text: string) => void;
+    disabled?: boolean;
+    placeholder?: string;
+};
+export declare function PromptInput({ onSubmit, disabled, placeholder, }: PromptInputProps): ReactNode;
+export {};

package/dist/chat/components/prompt-input.js

@@ -0,0 +1,49 @@
+import { cn } from "../../lib/utils.js";
+import { testIdentity } from "../../core/test-id.js";
+import { Button } from "../../core/components/button.js";
+import { useT } from "../../i18n/instance.js";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region resources/js/chat/components/prompt-input.tsx
+function PromptInput({ onSubmit, disabled = false, placeholder }) {
+	const { t } = useT("lattice");
+	const [value, setValue] = useState("");
+	function submit() {
+		const trimmed = value.trim();
+		if (trimmed === "" || disabled) return;
+		onSubmit(trimmed);
+		setValue("");
+	}
+	function handleKeyDown(event) {
+		if (event.key === "Enter" && !event.shiftKey) {
+			event.preventDefault();
+			submit();
+		}
+	}
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex items-end gap-2 border-t border-lt-border p-3",
+		children: [/* @__PURE__ */ jsx("textarea", {
+			"aria-label": t("chat.input-label", "Message input"),
+			className: cn("min-h-[2.5rem] flex-1 resize-none rounded-lt-sm border border-lt-input bg-lt-bg px-3 py-2 text-sm text-lt-fg placeholder:text-lt-muted-fg focus:outline-none focus:ring-1 focus:ring-lt-ring disabled:opacity-50"),
+			"data-test": testIdentity("chat-input"),
+			disabled,
+			onChange: (e) => setValue(e.target.value),
+			onKeyDown: handleKeyDown,
+			placeholder,
+			rows: 1,
+			value
+		}), /* @__PURE__ */ jsx(Button, {
+			"data-test": testIdentity("chat-send"),
+			disabled,
+			onClick: submit,
+			size: "sm",
+			type: "button",
+			variant: "default",
+			children: t("chat.send", "Send")
+		})]
+	});
+}
+//#endregion
+export { PromptInput };
+
+//# sourceMappingURL=prompt-input.js.map

package/dist/chat/components/prompt-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"prompt-input.js","names":[],"sources":["../../../resources/js/chat/components/prompt-input.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport type { KeyboardEvent, ReactNode } from \"react\";\nimport { cn } from \"@lattice-php/lattice/lib/utils\";\nimport { testIdentity } from \"@lattice-php/lattice/core/test-id\";\nimport { Button } from \"@lattice-php/lattice/core/components/button\";\nimport { useT } from \"@lattice-php/lattice/i18n\";\n\ntype PromptInputProps = {\n  onSubmit: (text: string) => void;\n  disabled?: boolean;\n  placeholder?: string;\n};\n\nexport function PromptInput({\n  onSubmit,\n  disabled = false,\n  placeholder,\n}: PromptInputProps): ReactNode {\n  const { t } = useT(\"lattice\");\n  const [value, setValue] = useState(\"\");\n\n  function submit(): void {\n    const trimmed = value.trim();\n    if (trimmed === \"\" || disabled) {\n      return;\n    }\n\n    onSubmit(trimmed);\n    setValue(\"\");\n  }\n\n  function handleKeyDown(event: KeyboardEvent<HTMLTextAreaElement>): void {\n    if (event.key === \"Enter\" && !event.shiftKey) {\n      event.preventDefault();\n      submit();\n    }\n  }\n\n  return (\n    <div className=\"flex items-end gap-2 border-t border-lt-border p-3\">\n      <textarea\n        aria-label={t(\"chat.input-label\", \"Message input\")}\n        className={cn(\n          \"min-h-[2.5rem] flex-1 resize-none rounded-lt-sm border border-lt-input bg-lt-bg px-3 py-2 text-sm text-lt-fg placeholder:text-lt-muted-fg focus:outline-none focus:ring-1 focus:ring-lt-ring disabled:opacity-50\",\n        )}\n        data-test={testIdentity(\"chat-input\")}\n        disabled={disabled}\n        onChange={(e) => setValue(e.target.value)}\n        onKeyDown={handleKeyDown}\n        placeholder={placeholder}\n        rows={1}\n        value={value}\n      />\n      <Button\n        data-test={testIdentity(\"chat-send\")}\n        disabled={disabled}\n        onClick={submit}\n        size=\"sm\"\n        type=\"button\"\n        variant=\"default\"\n      >\n        {t(\"chat.send\", \"Send\")}\n      </Button>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAaA,SAAgB,YAAY,EAC1B,UACA,WAAW,OACX,eAC8B;CAC9B,MAAM,EAAE,MAAM,KAAK,SAAS;CAC5B,MAAM,CAAC,OAAO,YAAY,SAAS,EAAE;CAErC,SAAS,SAAe;EACtB,MAAM,UAAU,MAAM,KAAK;EAC3B,IAAI,YAAY,MAAM,UACpB;EAGF,SAAS,OAAO;EAChB,SAAS,EAAE;CACb;CAEA,SAAS,cAAc,OAAiD;EACtE,IAAI,MAAM,QAAQ,WAAW,CAAC,MAAM,UAAU;GAC5C,MAAM,eAAe;GACrB,OAAO;EACT;CACF;CAEA,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,YAAD;GACE,cAAY,EAAE,oBAAoB,eAAe;GACjD,WAAW,GACT,kNACF;GACA,aAAW,aAAa,YAAY;GAC1B;GACV,WAAW,MAAM,SAAS,EAAE,OAAO,KAAK;GACxC,WAAW;GACE;GACb,MAAM;GACC;EACR,CAAA,GACD,oBAAC,QAAD;GACE,aAAW,aAAa,WAAW;GACzB;GACV,SAAS;GACT,MAAK;GACL,MAAK;GACL,SAAQ;aAEP,EAAE,aAAa,MAAM;EAChB,CAAA,CACL;;AAET"}

package/dist/chat/index.d.ts

@@ -0,0 +1 @@
+export declare const chatPlugin: import('../core/registry').Plugin;

package/dist/chat/index.js

@@ -0,0 +1,15 @@
+import { createPlugin, eagerComponent } from "../core/registry.js";
+import { TextPart } from "./parts/text.js";
+import { ToolCallPart } from "./parts/tool-call.js";
+//#region resources/js/chat/index.ts
+var chatPlugin = createPlugin({
+	name: "chat",
+	components: {
+		"chat.part.text": eagerComponent(TextPart),
+		"chat.part.tool-call": eagerComponent(ToolCallPart)
+	}
+});
+//#endregion
+export { chatPlugin };
+
+//# sourceMappingURL=index.js.map

package/dist/chat/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../resources/js/chat/index.ts"],"sourcesContent":["import { createPlugin, eagerComponent } from \"@lattice-php/lattice/core/registry\";\nimport { TextPart } from \"./parts/text\";\nimport { ToolCallPart } from \"./parts/tool-call\";\n\nexport const chatPlugin = createPlugin({\n  name: \"chat\",\n  components: {\n    \"chat.part.text\": eagerComponent(TextPart),\n    \"chat.part.tool-call\": eagerComponent(ToolCallPart),\n  },\n});\n"],"mappings":";;;;AAIA,IAAa,aAAa,aAAa;CACrC,MAAM;CACN,YAAY;EACV,kBAAkB,eAAe,QAAQ;EACzC,uBAAuB,eAAe,YAAY;CACpD;AACF,CAAC"}

package/dist/chat/parts/text.d.ts

@@ -0,0 +1,3 @@
+import { RendererComponent } from '../../core/types';
+export declare const TextPart: RendererComponent<"chat.part.text">;
+export default TextPart;

package/dist/chat/parts/text.js

@@ -0,0 +1,12 @@
+import { jsx } from "react/jsx-runtime";
+//#region resources/js/chat/parts/text.tsx
+var TextPart = ({ node }) => {
+	return /* @__PURE__ */ jsx("div", {
+		className: "whitespace-pre-wrap text-sm",
+		children: node.props.text
+	});
+};
+//#endregion
+export { TextPart, TextPart as default };
+
+//# sourceMappingURL=text.js.map

package/dist/chat/parts/text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text.js","names":[],"sources":["../../../resources/js/chat/parts/text.tsx"],"sourcesContent":["import type { RendererComponent } from \"@lattice-php/lattice/core/types\";\n\nexport const TextPart: RendererComponent<\"chat.part.text\"> = ({ node }) => {\n  return <div className=\"whitespace-pre-wrap text-sm\">{node.props.text}</div>;\n};\n\nexport default TextPart;\n"],"mappings":";;AAEA,IAAa,YAAiD,EAAE,WAAW;CACzE,OAAO,oBAAC,OAAD;EAAK,WAAU;YAA+B,KAAK,MAAM;CAAU,CAAA;AAC5E"}

package/dist/chat/parts/tool-call.d.ts

@@ -0,0 +1,3 @@
+import { RendererComponent } from '../../core/types';
+export declare const ToolCallPart: RendererComponent<"chat.part.tool-call">;
+export default ToolCallPart;

package/dist/chat/parts/tool-call.js

@@ -0,0 +1,20 @@
+import { testIdentity } from "../../core/test-id.js";
+import { jsxs } from "react/jsx-runtime";
+//#region resources/js/chat/parts/tool-call.tsx
+var ToolCallPart = ({ node }) => {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "mt-1 inline-flex items-center gap-1 rounded-lt-sm bg-lt-muted px-2 py-0.5 font-mono text-xs text-lt-muted-fg",
+		"data-test": testIdentity("chat-tool-call"),
+		children: [
+			"🔧 ",
+			node.props.name,
+			"(",
+			JSON.stringify(node.props.args),
+			")"
+		]
+	});
+};
+//#endregion
+export { ToolCallPart, ToolCallPart as default };
+
+//# sourceMappingURL=tool-call.js.map

package/dist/chat/parts/tool-call.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tool-call.js","names":[],"sources":["../../../resources/js/chat/parts/tool-call.tsx"],"sourcesContent":["import { testIdentity } from \"@lattice-php/lattice/core/test-id\";\nimport type { RendererComponent } from \"@lattice-php/lattice/core/types\";\n\nexport const ToolCallPart: RendererComponent<\"chat.part.tool-call\"> = ({ node }) => {\n  return (\n    <div\n      className=\"mt-1 inline-flex items-center gap-1 rounded-lt-sm bg-lt-muted px-2 py-0.5 font-mono text-xs text-lt-muted-fg\"\n      data-test={testIdentity(\"chat-tool-call\")}\n    >\n      🔧 {node.props.name}({JSON.stringify(node.props.args)})\n    </div>\n  );\n};\n\nexport default ToolCallPart;\n"],"mappings":";;;AAGA,IAAa,gBAA0D,EAAE,WAAW;CAClF,OACE,qBAAC,OAAD;EACE,WAAU;EACV,aAAW,aAAa,gBAAgB;YAF1C;GAGC;GACK,KAAK,MAAM;GAAK;GAAE,KAAK,UAAU,KAAK,MAAM,IAAI;GAAE;EACnD;;AAET"}

package/dist/chat/transport.d.ts

@@ -0,0 +1,2 @@
+import { ChatFrame, ChatTransportRequest } from './types';
+export declare function ndjsonChatTransport({ url, body, signal, }: ChatTransportRequest): AsyncGenerator<ChatFrame>;

package/dist/chat/transport.js

@@ -0,0 +1,47 @@
+import { apiFetch } from "../core/api.js";
+//#region resources/js/chat/transport.ts
+function parseFrame(line) {
+	try {
+		return JSON.parse(line);
+	} catch {
+		return null;
+	}
+}
+async function* ndjsonChatTransport({ url, body, signal }) {
+	const res = await apiFetch(url, {
+		method: "POST",
+		signal,
+		headers: { Accept: "application/x-ndjson" },
+		body: JSON.stringify(body),
+		throwOnError: false
+	});
+	if (!res.ok || !res.body) throw new Error(`Chat stream failed (${res.status})`);
+	const reader = res.body.getReader();
+	const decoder = new TextDecoder();
+	let buffer = "";
+	try {
+		for (;;) {
+			const { done, value } = await reader.read();
+			if (done) break;
+			buffer += decoder.decode(value, { stream: true });
+			const lines = buffer.split("\n");
+			buffer = lines.pop() ?? "";
+			for (const line of lines) {
+				if (line.trim() === "") continue;
+				const frame = parseFrame(line);
+				if (frame) yield frame;
+			}
+		}
+		buffer += decoder.decode();
+		if (buffer.trim() !== "") {
+			const frame = parseFrame(buffer);
+			if (frame) yield frame;
+		}
+	} finally {
+		await reader.cancel().catch(() => {});
+	}
+}
+//#endregion
+export { ndjsonChatTransport };
+
+//# sourceMappingURL=transport.js.map

package/dist/chat/transport.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"transport.js","names":[],"sources":["../../resources/js/chat/transport.ts"],"sourcesContent":["import { apiFetch } from \"../core/api\";\nimport type { ChatFrame, ChatTransportRequest } from \"./types\";\n\nfunction parseFrame(line: string): ChatFrame | null {\n  try {\n    return JSON.parse(line) as ChatFrame;\n  } catch {\n    return null;\n  }\n}\n\nexport async function* ndjsonChatTransport({\n  url,\n  body,\n  signal,\n}: ChatTransportRequest): AsyncGenerator<ChatFrame> {\n  const res = await apiFetch(url, {\n    method: \"POST\",\n    signal,\n    headers: { Accept: \"application/x-ndjson\" },\n    body: JSON.stringify(body),\n    throwOnError: false,\n  });\n\n  if (!res.ok || !res.body) {\n    throw new Error(`Chat stream failed (${res.status})`);\n  }\n\n  const reader = res.body.getReader();\n  const decoder = new TextDecoder();\n  let buffer = \"\";\n\n  try {\n    for (;;) {\n      const { done, value } = await reader.read();\n      if (done) {\n        break;\n      }\n\n      buffer += decoder.decode(value, { stream: true });\n      const lines = buffer.split(\"\\n\");\n      buffer = lines.pop() ?? \"\";\n\n      for (const line of lines) {\n        if (line.trim() === \"\") {\n          continue;\n        }\n\n        const frame = parseFrame(line);\n        if (frame) {\n          yield frame;\n        }\n      }\n    }\n\n    buffer += decoder.decode();\n    if (buffer.trim() !== \"\") {\n      const frame = parseFrame(buffer);\n      if (frame) {\n        yield frame;\n      }\n    }\n  } finally {\n    await reader.cancel().catch(() => {});\n  }\n}\n"],"mappings":";;AAGA,SAAS,WAAW,MAAgC;CAClD,IAAI;EACF,OAAO,KAAK,MAAM,IAAI;CACxB,QAAQ;EACN,OAAO;CACT;AACF;AAEA,gBAAuB,oBAAoB,EACzC,KACA,MACA,UACkD;CAClD,MAAM,MAAM,MAAM,SAAS,KAAK;EAC9B,QAAQ;EACR;EACA,SAAS,EAAE,QAAQ,uBAAuB;EAC1C,MAAM,KAAK,UAAU,IAAI;EACzB,cAAc;CAChB,CAAC;CAED,IAAI,CAAC,IAAI,MAAM,CAAC,IAAI,MAClB,MAAM,IAAI,MAAM,uBAAuB,IAAI,OAAO,EAAE;CAGtD,MAAM,SAAS,IAAI,KAAK,UAAU;CAClC,MAAM,UAAU,IAAI,YAAY;CAChC,IAAI,SAAS;CAEb,IAAI;EACF,SAAS;GACP,MAAM,EAAE,MAAM,UAAU,MAAM,OAAO,KAAK;GAC1C,IAAI,MACF;GAGF,UAAU,QAAQ,OAAO,OAAO,EAAE,QAAQ,KAAK,CAAC;GAChD,MAAM,QAAQ,OAAO,MAAM,IAAI;GAC/B,SAAS,MAAM,IAAI,KAAK;GAExB,KAAK,MAAM,QAAQ,OAAO;IACxB,IAAI,KAAK,KAAK,MAAM,IAClB;IAGF,MAAM,QAAQ,WAAW,IAAI;IAC7B,IAAI,OACF,MAAM;GAEV;EACF;EAEA,UAAU,QAAQ,OAAO;EACzB,IAAI,OAAO,KAAK,MAAM,IAAI;GACxB,MAAM,QAAQ,WAAW,MAAM;GAC/B,IAAI,OACF,MAAM;EAEV;CACF,UAAU;EACR,MAAM,OAAO,OAAO,EAAE,YAAY,CAAC,CAAC;CACtC;AACF"}