@pipe0/react 0.0.2

package/dist/components/defaults/layout/group.mjs

@@ -0,0 +1,87 @@
+import { cn } from "../../../lib/utils.mjs";
+import { useFormConfig } from "../../../context/form-context.mjs";
+import { IconGlyph } from "../../../widgets/icon-glyph.mjs";
+import { IconChevronDown } from "../../internal/icons.mjs";
+import { HoverInfo } from "../../hover-info.mjs";
+import { Badge } from "../../ui/badge.mjs";
+import { useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { mergeProps } from "@base-ui/react/merge-props";
+import { useRender } from "@base-ui/react/use-render";
+
+//#region src/components/defaults/layout/group.tsx
+function DefaultGroup({ group, children, className, render, ...props }) {
+	const { classNames } = useFormConfig();
+	const [expanded, setExpanded] = useState(group.defaultExpand);
+	const hasErrors = group.errorCount > 0;
+	const defaultContent = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs("button", {
+		type: "button",
+		"data-p0": "group-header",
+		className: classNames?.groupHeader ?? cn("pz:flex pz:items-center pz:justify-between pz:gap-4 pz:px-4 pz:py-2 pz:bg-muted pz:cursor-default pz:hover:shadow-sm pz:hover:bg-muted/80 pz:transition-colors pz:text-sm pz:font-medium pz:text-left", hasErrors && "pz:text-destructive pz:bg-destructive/10"),
+		onClick: () => setExpanded(!expanded),
+		"aria-expanded": expanded,
+		children: [/* @__PURE__ */ jsxs("span", {
+			className: "pz:flex pz:items-center pz:gap-2",
+			children: [
+				group.iconKey && /* @__PURE__ */ jsx(IconGlyph, {
+					keyName: group.iconKey,
+					size: 14,
+					className: "pz:text-muted-foreground pz:shrink-0"
+				}),
+				group.label ?? group.key,
+				group.description && /* @__PURE__ */ jsx("span", {
+					onClick: (e) => e.stopPropagation(),
+					onKeyDown: (e) => e.stopPropagation(),
+					children: /* @__PURE__ */ jsx(HoverInfo, { children: group.description })
+				})
+			]
+		}), /* @__PURE__ */ jsxs("span", {
+			className: "pz:flex pz:items-center pz:gap-2",
+			children: [
+				group.setCount > 0 && /* @__PURE__ */ jsxs(Badge, {
+					variant: "default",
+					"data-p0": "group-badge",
+					children: [group.setCount, " set"]
+				}),
+				hasErrors && /* @__PURE__ */ jsxs(Badge, {
+					variant: "destructive",
+					"data-p0": "group-error-badge",
+					children: [
+						group.errorCount,
+						" ",
+						group.errorCount === 1 ? "error" : "errors"
+					]
+				}),
+				/* @__PURE__ */ jsx(IconChevronDown, {
+					width: 16,
+					height: 16,
+					className: cn("pz:text-muted-foreground pz:transition-transform", expanded && "pz:rotate-180")
+				})
+			]
+		})]
+	}), expanded && /* @__PURE__ */ jsx("div", {
+		"data-p0": "group-content",
+		className: classNames?.groupContent ?? "pz:flex pz:flex-col pz:gap-3 pz:px-3 pz:pb-3 pz:pt-1",
+		children
+	})] });
+	return useRender({
+		defaultTagName: "div",
+		render,
+		state: {
+			group,
+			fields: group.fields,
+			expanded
+		},
+		props: mergeProps({
+			className: cn(classNames?.group ?? cn("pz:flex pz:flex-col pz:gap-2 pz:border pz:border-input pz:rounded-md pz:overflow-hidden pz:mb-2", hasErrors && "pz:border-destructive"), className),
+			children: defaultContent,
+			"data-p0": "group",
+			"data-p0-group": group.key,
+			"data-p0-expanded": String(expanded)
+		}, props)
+	});
+}
+
+//#endregion
+export { DefaultGroup };
+//# sourceMappingURL=group.mjs.map

package/dist/components/defaults/layout/group.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"group.mjs","names":[],"sources":["../../../../src/components/defaults/layout/group.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { useState } from \"react\";\nimport { useFormConfig } from \"../../../context/form-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport type { AnyFieldProps } from \"../../../types/field-props.js\";\nimport type { FormGroupHandle } from \"../../../types/form-handle.js\";\nimport { IconGlyph } from \"../../../widgets/icon-glyph.js\";\nimport { HoverInfo } from \"../../hover-info.js\";\nimport { IconChevronDown } from \"../../internal/icons.js\";\nimport { Badge } from \"../../ui/badge.js\";\n\nexport interface DefaultGroupState {\n  group: FormGroupHandle;\n  fields: AnyFieldProps[];\n  expanded: boolean;\n}\n\nexport interface DefaultGroupProps extends useRender.ComponentProps<\"div\", DefaultGroupState> {\n  group: FormGroupHandle;\n}\n\nexport function DefaultGroup({ group, children, className, render, ...props }: DefaultGroupProps) {\n  const { classNames } = useFormConfig();\n  const [expanded, setExpanded] = useState(group.defaultExpand);\n  const hasErrors = group.errorCount > 0;\n\n  const defaultContent = (\n    <>\n      <button\n        type=\"button\"\n        data-p0=\"group-header\"\n        className={\n          classNames?.groupHeader ??\n          cn(\n            \"pz:flex pz:items-center pz:justify-between pz:gap-4 pz:px-4 pz:py-2 pz:bg-muted pz:cursor-default pz:hover:shadow-sm pz:hover:bg-muted/80 pz:transition-colors pz:text-sm pz:font-medium pz:text-left\",\n            hasErrors && \"pz:text-destructive pz:bg-destructive/10\",\n          )\n        }\n        onClick={() => setExpanded(!expanded)}\n        aria-expanded={expanded}\n      >\n        <span className=\"pz:flex pz:items-center pz:gap-2\">\n          {group.iconKey && (\n            <IconGlyph\n              keyName={group.iconKey}\n              size={14}\n              className=\"pz:text-muted-foreground pz:shrink-0\"\n            />\n          )}\n          {group.label ?? group.key}\n          {group.description && (\n            <span onClick={(e) => e.stopPropagation()} onKeyDown={(e) => e.stopPropagation()}>\n              <HoverInfo>{group.description}</HoverInfo>\n            </span>\n          )}\n        </span>\n        <span className=\"pz:flex pz:items-center pz:gap-2\">\n          {group.setCount > 0 && (\n            <Badge variant=\"default\" data-p0=\"group-badge\">\n              {group.setCount} set\n            </Badge>\n          )}\n          {hasErrors && (\n            <Badge variant=\"destructive\" data-p0=\"group-error-badge\">\n              {group.errorCount} {group.errorCount === 1 ? \"error\" : \"errors\"}\n            </Badge>\n          )}\n          <IconChevronDown\n            width={16}\n            height={16}\n            className={cn(\n              \"pz:text-muted-foreground pz:transition-transform\",\n              expanded && \"pz:rotate-180\",\n            )}\n          />\n        </span>\n      </button>\n      {expanded && (\n        <div\n          data-p0=\"group-content\"\n          className={\n            classNames?.groupContent ?? \"pz:flex pz:flex-col pz:gap-3 pz:px-3 pz:pb-3 pz:pt-1\"\n          }\n        >\n          {children}\n        </div>\n      )}\n    </>\n  );\n\n  return useRender({\n    defaultTagName: \"div\",\n    render,\n    state: { group, fields: group.fields, expanded },\n    props: mergeProps<\"div\">(\n      {\n        className: cn(\n          classNames?.group ??\n            cn(\n              \"pz:flex pz:flex-col pz:gap-2 pz:border pz:border-input pz:rounded-md pz:overflow-hidden pz:mb-2\",\n              hasErrors && \"pz:border-destructive\",\n            ),\n          className,\n        ),\n        children: defaultContent,\n        ...({\n          \"data-p0\": \"group\",\n          \"data-p0-group\": group.key,\n          \"data-p0-expanded\": String(expanded),\n        } as Record<string, string>),\n      },\n      props,\n    ),\n  });\n}\n"],"mappings":";;;;;;;;;;;;AAsBA,SAAgB,aAAa,EAAE,OAAO,UAAU,WAAW,QAAQ,GAAG,SAA4B;CAChG,MAAM,EAAE,eAAe,eAAe;CACtC,MAAM,CAAC,UAAU,eAAe,SAAS,MAAM,cAAc;CAC7D,MAAM,YAAY,MAAM,aAAa;CAErC,MAAM,iBACJ,8CACE,qBAAC,UAAD;EACE,MAAK;EACL,WAAQ;EACR,WACE,YAAY,eACZ,GACE,yMACA,aAAa,2CACd;EAEH,eAAe,YAAY,CAAC,SAAS;EACrC,iBAAe;YAXjB,CAaE,qBAAC,QAAD;GAAM,WAAU;aAAhB;IACG,MAAM,WACL,oBAAC,WAAD;KACE,SAAS,MAAM;KACf,MAAM;KACN,WAAU;KACV;IAEH,MAAM,SAAS,MAAM;IACrB,MAAM,eACL,oBAAC,QAAD;KAAM,UAAU,MAAM,EAAE,iBAAiB;KAAE,YAAY,MAAM,EAAE,iBAAiB;eAC9E,oBAAC,WAAD,YAAY,MAAM,aAAwB;KACrC;IAEJ;MACP,qBAAC,QAAD;GAAM,WAAU;aAAhB;IACG,MAAM,WAAW,KAChB,qBAAC,OAAD;KAAO,SAAQ;KAAU,WAAQ;eAAjC,CACG,MAAM,UAAS,OACV;;IAET,aACC,qBAAC,OAAD;KAAO,SAAQ;KAAc,WAAQ;eAArC;MACG,MAAM;MAAW;MAAE,MAAM,eAAe,IAAI,UAAU;MACjD;;IAEV,oBAAC,iBAAD;KACE,OAAO;KACP,QAAQ;KACR,WAAW,GACT,oDACA,YAAY,gBACb;KACD;IACG;KACA;KACR,YACC,oBAAC,OAAD;EACE,WAAQ;EACR,WACE,YAAY,gBAAgB;EAG7B;EACG,EAEP;AAGL,QAAO,UAAU;EACf,gBAAgB;EAChB;EACA,OAAO;GAAE;GAAO,QAAQ,MAAM;GAAQ;GAAU;EAChD,OAAO,WACL;GACE,WAAW,GACT,YAAY,SACV,GACE,mGACA,aAAa,wBACd,EACH,UACD;GACD,UAAU;GAER,WAAW;GACX,iBAAiB,MAAM;GACvB,oBAAoB,OAAO,SAAS;GAEvC,EACD,MACD;EACF,CAAC"}

package/dist/components/defaults/layout/section.d.mts

@@ -0,0 +1,14 @@
+import { FormGroupHandle, FormSectionHandle } from "../../../types/form-handle.mjs";
+import { useRender } from "@base-ui/react/use-render";
+
+//#region src/components/defaults/layout/section.d.ts
+interface DefaultSectionState {
+  section: FormSectionHandle;
+  groups: FormGroupHandle[];
+}
+interface DefaultSectionProps extends useRender.ComponentProps<"div", DefaultSectionState> {
+  section: FormSectionHandle;
+}
+//#endregion
+export { DefaultSectionProps };
+//# sourceMappingURL=section.d.mts.map

package/dist/components/defaults/layout/section.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"section.d.mts","names":[],"sources":["../../../../src/components/defaults/layout/section.tsx"],"mappings":";;;;UAMiB,mBAAA;EACf,OAAA,EAAS,iBAAA;EACT,MAAA,EAAQ,eAAA;AAAA;AAAA,UAGO,mBAAA,SAA4B,SAAA,CAAU,cAAA,QAAsB,mBAAA;EAC3E,OAAA,EAAS,iBAAA;AAAA"}

package/dist/components/defaults/layout/section.mjs

@@ -0,0 +1,39 @@
+import { cn } from "../../../lib/utils.mjs";
+import { useFormConfig } from "../../../context/form-context.mjs";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { mergeProps } from "@base-ui/react/merge-props";
+import { useRender } from "@base-ui/react/use-render";
+
+//#region src/components/defaults/layout/section.tsx
+function DefaultSection({ section, children, className, render, ...props }) {
+	const { classNames } = useFormConfig();
+	const defaultContent = /* @__PURE__ */ jsxs(Fragment, { children: [section.label && /* @__PURE__ */ jsxs("div", {
+		"data-p0": "section-header",
+		className: classNames?.sectionLabel ?? "pz:mb-2 pz:flex pz:flex-col pz:gap-1",
+		children: [/* @__PURE__ */ jsx("h2", {
+			className: "pz:text-sm pz:font-semibold pz:tracking-tight pz:m-0",
+			children: section.label
+		}), section.description && /* @__PURE__ */ jsx("p", {
+			className: cn("pz:text-xs pz:text-muted-foreground pz:m-0", classNames?.sectionDescription),
+			children: section.description
+		})]
+	}), children] });
+	return useRender({
+		defaultTagName: "div",
+		render,
+		state: {
+			section,
+			groups: section.groups
+		},
+		props: mergeProps({
+			className: cn(classNames?.section ?? "pz:py-2", className),
+			children: defaultContent,
+			"data-p0": "section",
+			"data-p0-section": section.key
+		}, props)
+	});
+}
+
+//#endregion
+export { DefaultSection };
+//# sourceMappingURL=section.mjs.map

package/dist/components/defaults/layout/section.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"section.mjs","names":[],"sources":["../../../../src/components/defaults/layout/section.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { useFormConfig } from \"../../../context/form-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport type { FormGroupHandle, FormSectionHandle } from \"../../../types/form-handle.js\";\n\nexport interface DefaultSectionState {\n  section: FormSectionHandle;\n  groups: FormGroupHandle[];\n}\n\nexport interface DefaultSectionProps extends useRender.ComponentProps<\"div\", DefaultSectionState> {\n  section: FormSectionHandle;\n}\n\nexport function DefaultSection({\n  section,\n  children,\n  className,\n  render,\n  ...props\n}: DefaultSectionProps) {\n  const { classNames } = useFormConfig();\n\n  const defaultContent = (\n    <>\n      {section.label && (\n        <div\n          data-p0=\"section-header\"\n          className={classNames?.sectionLabel ?? \"pz:mb-2 pz:flex pz:flex-col pz:gap-1\"}\n        >\n          <h2 className=\"pz:text-sm pz:font-semibold pz:tracking-tight pz:m-0\">{section.label}</h2>\n          {section.description && (\n            <p\n              className={cn(\n                \"pz:text-xs pz:text-muted-foreground pz:m-0\",\n                classNames?.sectionDescription,\n              )}\n            >\n              {section.description}\n            </p>\n          )}\n        </div>\n      )}\n      {children}\n    </>\n  );\n\n  return useRender({\n    defaultTagName: \"div\",\n    render,\n    state: { section, groups: section.groups },\n    props: mergeProps<\"div\">(\n      {\n        className: cn(classNames?.section ?? \"pz:py-2\", className),\n        children: defaultContent,\n        ...({\n          \"data-p0\": \"section\",\n          \"data-p0-section\": section.key,\n        } as Record<string, string>),\n      },\n      props,\n    ),\n  });\n}\n"],"mappings":";;;;;;;AAeA,SAAgB,eAAe,EAC7B,SACA,UACA,WACA,QACA,GAAG,SACmB;CACtB,MAAM,EAAE,eAAe,eAAe;CAEtC,MAAM,iBACJ,4CACG,QAAQ,SACP,qBAAC,OAAD;EACE,WAAQ;EACR,WAAW,YAAY,gBAAgB;YAFzC,CAIE,oBAAC,MAAD;GAAI,WAAU;aAAwD,QAAQ;GAAW,GACxF,QAAQ,eACP,oBAAC,KAAD;GACE,WAAW,GACT,8CACA,YAAY,mBACb;aAEA,QAAQ;GACP,EAEF;KAEP,SACA;AAGL,QAAO,UAAU;EACf,gBAAgB;EAChB;EACA,OAAO;GAAE;GAAS,QAAQ,QAAQ;GAAQ;EAC1C,OAAO,WACL;GACE,WAAW,GAAG,YAAY,WAAW,WAAW,UAAU;GAC1D,UAAU;GAER,WAAW;GACX,mBAAmB,QAAQ;GAE9B,EACD,MACD;EACF,CAAC"}

package/dist/components/defaults/layout/submit-button.d.mts

@@ -0,0 +1,9 @@
+import { useRender } from "@base-ui/react/use-render";
+
+//#region src/components/defaults/layout/submit-button.d.ts
+interface DefaultSubmitButtonProps extends useRender.ComponentProps<"button"> {
+  isSubmitting: boolean;
+}
+//#endregion
+export { DefaultSubmitButtonProps };
+//# sourceMappingURL=submit-button.d.mts.map

package/dist/components/defaults/layout/submit-button.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"submit-button.d.mts","names":[],"sources":["../../../../src/components/defaults/layout/submit-button.tsx"],"mappings":";;;UAKiB,wBAAA,SAAiC,SAAA,CAAU,cAAA;EAC1D,YAAA;AAAA"}

package/dist/components/defaults/layout/submit-button.mjs

@@ -0,0 +1,23 @@
+import { cn } from "../../../lib/utils.mjs";
+import { buttonVariants } from "../../ui/button.mjs";
+import { mergeProps } from "@base-ui/react/merge-props";
+import { useRender } from "@base-ui/react/use-render";
+
+//#region src/components/defaults/layout/submit-button.tsx
+function DefaultSubmitButton({ isSubmitting, className, children, render, ...props }) {
+	return useRender({
+		defaultTagName: "button",
+		render,
+		props: mergeProps({
+			type: "submit",
+			disabled: isSubmitting,
+			className: cn(buttonVariants({}), "pz:mt-4", className),
+			children: children ?? (isSubmitting ? "Submitting..." : "Submit"),
+			"data-p0": "submit"
+		}, props)
+	});
+}
+
+//#endregion
+export { DefaultSubmitButton };
+//# sourceMappingURL=submit-button.mjs.map

package/dist/components/defaults/layout/submit-button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"submit-button.mjs","names":[],"sources":["../../../../src/components/defaults/layout/submit-button.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { cn } from \"../../../lib/utils.js\";\nimport { buttonVariants } from \"../../ui/button.js\";\n\nexport interface DefaultSubmitButtonProps extends useRender.ComponentProps<\"button\"> {\n  isSubmitting: boolean;\n}\n\nexport function DefaultSubmitButton({\n  isSubmitting,\n  className,\n  children,\n  render,\n  ...props\n}: DefaultSubmitButtonProps) {\n  return useRender({\n    defaultTagName: \"button\",\n    render,\n    props: mergeProps<\"button\">(\n      {\n        type: \"submit\",\n        disabled: isSubmitting,\n        className: cn(buttonVariants({}), \"pz:mt-4\", className),\n        children: children ?? (isSubmitting ? \"Submitting...\" : \"Submit\"),\n        ...({ \"data-p0\": \"submit\" } as Record<string, string>),\n      },\n      props,\n    ),\n  });\n}\n"],"mappings":";;;;;;AASA,SAAgB,oBAAoB,EAClC,cACA,WACA,UACA,QACA,GAAG,SACwB;AAC3B,QAAO,UAAU;EACf,gBAAgB;EAChB;EACA,OAAO,WACL;GACE,MAAM;GACN,UAAU;GACV,WAAW,GAAG,eAAe,EAAE,CAAC,EAAE,WAAW,UAAU;GACvD,UAAU,aAAa,eAAe,kBAAkB;GAClD,WAAW;GAClB,EACD,MACD;EACF,CAAC"}

package/dist/components/defaults/toggle-advanced-button.mjs

@@ -0,0 +1,29 @@
+import { cn } from "../../lib/utils.mjs";
+import { Button } from "../ui/button.mjs";
+import { IconChevronDown } from "../internal/icons.mjs";
+import { useDisclosure } from "../../hooks/use-disclosure.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/defaults/toggle-advanced-button.tsx
+function ToggleAdvancedButton({ className, children, onClick, ...rest }) {
+	const { open, onOpenChange } = useDisclosure();
+	return /* @__PURE__ */ jsxs(Button, {
+		type: "button",
+		variant: "link",
+		size: "xs",
+		onClick: (e) => {
+			onClick?.(e);
+			onOpenChange(!open);
+		},
+		className: cn(className),
+		...rest,
+		children: [children, /* @__PURE__ */ jsx(IconChevronDown, { style: {
+			transform: open ? "rotate(180deg)" : "rotate(0deg)",
+			transition: "transform 0.2s ease"
+		} })]
+	});
+}
+
+//#endregion
+export { ToggleAdvancedButton };
+//# sourceMappingURL=toggle-advanced-button.mjs.map

package/dist/components/defaults/toggle-advanced-button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggle-advanced-button.mjs","names":[],"sources":["../../../src/components/defaults/toggle-advanced-button.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\nimport { useDisclosure } from \"../../hooks/use-disclosure\";\nimport { cn } from \"../../lib/utils\";\nimport { IconChevronDown } from \"../internal/icons\";\nimport { Button } from \"../ui/button\";\n\ninterface ToggleAdvancedButtonProps extends ComponentProps<typeof Button> {}\n\nexport function ToggleAdvancedButton({\n  className,\n  children,\n  onClick,\n  ...rest\n}: ToggleAdvancedButtonProps) {\n  const { open, onOpenChange } = useDisclosure();\n\n  return (\n    <Button\n      type=\"button\"\n      variant=\"link\"\n      size=\"xs\"\n      onClick={(e) => {\n        onClick?.(e);\n        onOpenChange(!open);\n      }}\n      className={cn(className)}\n      {...rest}\n    >\n      {children}\n      <IconChevronDown\n        style={{\n          transform: open ? \"rotate(180deg)\" : \"rotate(0deg)\",\n          transition: \"transform 0.2s ease\",\n        }}\n      />\n    </Button>\n  );\n}\n"],"mappings":";;;;;;;AAQA,SAAgB,qBAAqB,EACnC,WACA,UACA,SACA,GAAG,QACyB;CAC5B,MAAM,EAAE,MAAM,iBAAiB,eAAe;AAE9C,QACE,qBAAC,QAAD;EACE,MAAK;EACL,SAAQ;EACR,MAAK;EACL,UAAU,MAAM;AACd,aAAU,EAAE;AACZ,gBAAa,CAAC,KAAK;;EAErB,WAAW,GAAG,UAAU;EACxB,GAAI;YATN,CAWG,UACD,oBAAC,iBAAD,EACE,OAAO;GACL,WAAW,OAAO,mBAAmB;GACrC,YAAY;GACb,EACD,EACK"}

package/dist/components/field-renderer.d.mts

@@ -0,0 +1,14 @@
+import { AnyFieldProps } from "../types/field-props.mjs";
+import * as _$react from "react";
+import { ReactNode } from "react";
+
+//#region src/components/field-renderer.d.ts
+declare function FieldRendererInner({
+  field
+}: {
+  field: AnyFieldProps;
+}): ReactNode;
+declare const FieldRenderer: _$react.MemoExoticComponent<typeof FieldRendererInner>;
+//#endregion
+export { FieldRenderer };
+//# sourceMappingURL=field-renderer.d.mts.map

package/dist/components/field-renderer.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"field-renderer.d.mts","names":[],"sources":["../../src/components/field-renderer.tsx"],"mappings":";;;;;iBAKS,kBAAA,CAAA;EAAqB;AAAA;EAAW,KAAA,EAAO,aAAA;AAAA,IAAmB,SAAA;AAAA,cAwBtD,aAAA,EAAa,OAAA,CAAA,mBAAA,QAAA,kBAAA"}

package/dist/components/field-renderer.mjs

@@ -0,0 +1,21 @@
+import { useFormConfig } from "../context/form-context.mjs";
+import { defaultAdapters } from "./defaults/adapters/index.mjs";
+import { memo } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/field-renderer.tsx
+function FieldRendererInner({ field }) {
+	const { adapters } = useFormConfig();
+	const adapter = adapters?.[field.kind] ?? defaultAdapters[field.kind];
+	if (!adapter) return null;
+	return /* @__PURE__ */ jsx(adapter, { ...field });
+}
+const FieldRenderer = memo(FieldRendererInner, (prev, next) => {
+	const a = prev.field;
+	const b = next.field;
+	return a.kind === b.kind && a.path === b.path && a.value === b.value && a.error === b.error && a.disabled === b.disabled && a.disabledReason === b.disabledReason && a.touched === b.touched && a.dirty === b.dirty;
+});
+
+//#endregion
+export { FieldRenderer };
+//# sourceMappingURL=field-renderer.mjs.map

package/dist/components/field-renderer.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"field-renderer.mjs","names":[],"sources":["../../src/components/field-renderer.tsx"],"sourcesContent":["import { type ComponentType, memo, type ReactNode } from \"react\";\nimport { useFormConfig } from \"../context/form-context.js\";\nimport type { AnyFieldHandle } from \"../types/field-handle.js\";\nimport { defaultAdapters } from \"./defaults/adapters/index.js\";\n\nfunction FieldRendererInner({ field }: { field: AnyFieldHandle }): ReactNode {\n  const { adapters } = useFormConfig();\n\n  const adapter = adapters?.[field.kind] ?? defaultAdapters[field.kind];\n\n  if (!adapter) {\n    return null;\n  }\n\n  // Render as a component (not a direct call) so React Fast Refresh can track\n  // the adapter's type and hot-swap it on edits.\n  const Adapter = adapter as unknown as ComponentType<AnyFieldHandle>;\n  return <Adapter {...field} />;\n}\n\n// `buildSectionHandles` rebuilds every field handle on every form-state\n// change, so a single keystroke causes every sibling adapter to receive a new\n// `field` reference. A custom comparator lets us skip re-rendering when the\n// load-bearing slice of the handle is identity-equal — primitive values short\n// out via `Object.is`, while object-valued kinds (include/exclude, ranges)\n// will miss and re-render, which is the acceptable tradeoff.\n//\n// Adapter swaps via `<FormProvider adapters={...}>` still propagate: context\n// changes re-render every consumer regardless of the memo decision.\nexport const FieldRenderer = memo(FieldRendererInner, (prev, next) => {\n  const a = prev.field;\n  const b = next.field;\n  return (\n    a.kind === b.kind &&\n    a.path === b.path &&\n    a.value === b.value &&\n    a.error === b.error &&\n    a.disabled === b.disabled &&\n    a.disabledReason === b.disabledReason &&\n    a.touched === b.touched &&\n    a.dirty === b.dirty\n  );\n});\n"],"mappings":";;;;;;AAKA,SAAS,mBAAmB,EAAE,SAA+C;CAC3E,MAAM,EAAE,aAAa,eAAe;CAEpC,MAAM,UAAU,WAAW,MAAM,SAAS,gBAAgB,MAAM;AAEhE,KAAI,CAAC,QACH,QAAO;AAMT,QAAO,oBADS,SACT,EAAS,GAAI,OAAS;;AAY/B,MAAa,gBAAgB,KAAK,qBAAqB,MAAM,SAAS;CACpE,MAAM,IAAI,KAAK;CACf,MAAM,IAAI,KAAK;AACf,QACE,EAAE,SAAS,EAAE,QACb,EAAE,SAAS,EAAE,QACb,EAAE,UAAU,EAAE,SACd,EAAE,UAAU,EAAE,SACd,EAAE,aAAa,EAAE,YACjB,EAAE,mBAAmB,EAAE,kBACvB,EAAE,YAAY,EAAE,WAChB,EAAE,UAAU,EAAE;EAEhB"}

package/dist/components/hover-info.mjs

@@ -0,0 +1,30 @@
+import { cn } from "../lib/utils.mjs";
+import { Tooltip, TooltipContent, TooltipTrigger } from "./ui/tooltip.mjs";
+import { IconInfo } from "./internal/icons.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/hover-info.tsx
+/**
+* Small Notion-style "info on hover" affordance. Renders an info icon inline;
+* the provided content is revealed in a popover on hover or keyboard focus.
+*/
+function HoverInfo({ children, className, side = "top", align = "center" }) {
+	return /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, { render: /* @__PURE__ */ jsx("span", {
+		role: "button",
+		tabIndex: 0,
+		"aria-label": "More information",
+		className: cn("pz:inline-flex pz:items-center pz:justify-center pz:text-muted-foreground pz:hover:text-foreground pz:focus-visible:text-foreground pz:focus-visible:outline-none pz:cursor-help pz:align-middle", className),
+		children: /* @__PURE__ */ jsx(IconInfo, {
+			width: 14,
+			height: 14
+		})
+	}) }), /* @__PURE__ */ jsx(TooltipContent, {
+		side,
+		align,
+		children
+	})] });
+}
+
+//#endregion
+export { HoverInfo };
+//# sourceMappingURL=hover-info.mjs.map

package/dist/components/hover-info.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"hover-info.mjs","names":[],"sources":["../../src/components/hover-info.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"../lib/utils.js\";\nimport { IconInfo } from \"./internal/icons.js\";\nimport { Tooltip, TooltipContent, TooltipTrigger } from \"./ui/tooltip.js\";\n\n/**\n * Small Notion-style \"info on hover\" affordance. Renders an info icon inline;\n * the provided content is revealed in a popover on hover or keyboard focus.\n */\nexport function HoverInfo({\n  children,\n  className,\n  side = \"top\",\n  align = \"center\",\n}: {\n  children: ReactNode;\n  className?: string;\n  side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n  align?: \"start\" | \"center\" | \"end\";\n  openDelay?: number;\n  closeDelay?: number;\n}) {\n  return (\n    <Tooltip>\n      <TooltipTrigger\n        render={\n          <span\n            role=\"button\"\n            tabIndex={0}\n            aria-label=\"More information\"\n            className={cn(\n              \"pz:inline-flex pz:items-center pz:justify-center pz:text-muted-foreground pz:hover:text-foreground pz:focus-visible:text-foreground pz:focus-visible:outline-none pz:cursor-help pz:align-middle\",\n              className,\n            )}\n          >\n            <IconInfo width={14} height={14} />\n          </span>\n        }\n      />\n      <TooltipContent side={side} align={align}>\n        {children}\n      </TooltipContent>\n    </Tooltip>\n  );\n}\n"],"mappings":";;;;;;;;;;AASA,SAAgB,UAAU,EACxB,UACA,WACA,OAAO,OACP,QAAQ,YAQP;AACD,QACE,qBAAC,SAAD,aACE,oBAAC,gBAAD,EACE,QACE,oBAAC,QAAD;EACE,MAAK;EACL,UAAU;EACV,cAAW;EACX,WAAW,GACT,oMACA,UACD;YAED,oBAAC,UAAD;GAAU,OAAO;GAAI,QAAQ;GAAM;EAC9B,GAET,GACF,oBAAC,gBAAD;EAAsB;EAAa;EAChC;EACc,EACT"}

package/dist/components/internal/LiquidEditor/ChipEditPopover.mjs

@@ -0,0 +1,319 @@
+import { Button } from "../../ui/button.mjs";
+import { Input } from "../../ui/input.mjs";
+import { Switch } from "../../ui/switch.mjs";
+import { useFloatingElement } from "../../../hooks/use-floating-element.mjs";
+import { useEffect, useId, useMemo, useRef, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { ExternalLink, Trash2 } from "lucide-react";
+import { offset, shift } from "@floating-ui/react";
+
+//#region src/components/internal/LiquidEditor/ChipEditPopover.tsx
+const SIMPLE_FIELD_RE = /^\{\{\s*([a-zA-Z_][a-zA-Z0-9_.]*)\s*(\|\s*default:\s*"")?\s*\}\}$/;
+const SECRET_RE = /^\{\{\s*SECRETS\.([A-Z][A-Z0-9_]*)\s*\}\}$/;
+const OUTPUT_BLOCK_RE = /^\{%\s*output\s+([A-Za-z_][A-Za-z0-9_]*)\s*,\s*type:\s*"(string|number|boolean|json|unknown)"\s*(?:,\s*schema:\s*"([^"]*)")?\s*(?:,\s*description:\s*"((?:[^"\\]|\\.)*)")?\s*%\}$/;
+/**
+* Contextual popover anchored to a chip's DOM rect. Different content per
+* chip kind:
+*   - field: switch for `| default: ""` (simple cases only), remove.
+*   - secret: publicId header, manage/remove buttons. Power users still
+*     edit by hand.
+*   - block (output declaration): name / type / description editors.
+*
+* On any mutation, the popover dispatches a single replaceWith transaction
+* over the chip's range, then closes itself. The Liquid serialization
+* stays identical to what would have been authored by hand.
+*/
+function ChipEditPopover({ editor, target, onClose }) {
+	const { ref, style, isMounted, getFloatingProps } = useFloatingElement(true, target.rect, 1100, {
+		placement: "bottom-start",
+		middleware: [offset(6), shift()],
+		onOpenChange(open) {
+			if (!open) onClose();
+		},
+		dismissOptions: {
+			outsidePress: true,
+			outsidePressEvent: "mousedown"
+		}
+	});
+	const popupRef = useRef(null);
+	useEffect(() => {
+		function onKey(e) {
+			if (e.key === "Escape") onClose();
+		}
+		window.addEventListener("keydown", onKey);
+		return () => window.removeEventListener("keydown", onKey);
+	}, [onClose]);
+	function replaceWith(next) {
+		editor.chain().focus().insertContentAt({
+			from: target.from,
+			to: target.to
+		}, next).run();
+		onClose();
+	}
+	function remove() {
+		editor.chain().focus().deleteRange({
+			from: target.from,
+			to: target.to
+		}).run();
+		onClose();
+	}
+	if (!isMounted) return null;
+	return /* @__PURE__ */ jsxs("div", {
+		ref: (el) => {
+			popupRef.current = el;
+			ref(el);
+		},
+		style,
+		...getFloatingProps(),
+		onMouseDown: (e) => e.stopPropagation(),
+		className: "pz:flex pz:flex-col pz:gap-2 pz:rounded-md pz:border pz:border-input pz:bg-popover pz:p-3 pz:text-popover-foreground pz:shadow-md pz:min-w-72",
+		role: "dialog",
+		"aria-label": `Edit ${target.kind} chip`,
+		children: [
+			target.kind === "field" && /* @__PURE__ */ jsx(FieldChipBody, {
+				raw: target.raw,
+				replaceWith,
+				remove
+			}),
+			target.kind === "secret" && /* @__PURE__ */ jsx(SecretChipBody, {
+				raw: target.raw,
+				remove
+			}),
+			target.kind === "block" && /* @__PURE__ */ jsx(BlockChipBody, {
+				raw: target.raw,
+				replaceWith,
+				remove
+			})
+		]
+	});
+}
+function FieldChipBody({ raw, replaceWith, remove }) {
+	const match = raw.match(SIMPLE_FIELD_RE);
+	const name = match?.[1];
+	const allowEmpty = !!match?.[2];
+	if (!!!match || !name) return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		/* @__PURE__ */ jsx("header", {
+			className: "pz:text-xs pz:font-medium pz:text-muted-foreground",
+			children: "Field reference (advanced)"
+		}),
+		/* @__PURE__ */ jsx("p", {
+			className: "pz:text-xs pz:text-muted-foreground",
+			children: "This chip uses a custom Liquid filter chain. Edit the raw text in the editor to change it."
+		}),
+		/* @__PURE__ */ jsx("pre", {
+			className: "pz:overflow-x-auto pz:rounded-sm pz:bg-muted pz:px-2 pz:py-1 pz:text-xs",
+			children: raw
+		}),
+		/* @__PURE__ */ jsxs(Button, {
+			type: "button",
+			variant: "outline",
+			size: "sm",
+			onClick: remove,
+			children: [/* @__PURE__ */ jsx(Trash2, { className: "pz:size-3.5 pz:mr-1" }), "Remove"]
+		})
+	] });
+	function toggleAllowEmpty() {
+		replaceWith(allowEmpty ? `{{ ${name} }}` : `{{ ${name} | default: "" }}`);
+	}
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		/* @__PURE__ */ jsxs("header", {
+			className: "pz:flex pz:items-center pz:justify-between pz:gap-2",
+			children: [/* @__PURE__ */ jsx("span", {
+				className: "pz:text-xs pz:font-medium pz:text-muted-foreground",
+				children: "Field reference"
+			}), /* @__PURE__ */ jsx("code", {
+				className: "pz:text-xs pz:text-sky-700",
+				children: name
+			})]
+		}),
+		/* @__PURE__ */ jsxs("div", {
+			className: "pz:flex pz:items-center pz:justify-between pz:gap-3 pz:text-sm",
+			children: [/* @__PURE__ */ jsxs("span", {
+				className: "pz:flex pz:flex-col",
+				children: [/* @__PURE__ */ jsx("span", { children: "Allow empty" }), /* @__PURE__ */ jsxs("span", {
+					className: "pz:text-xs pz:text-muted-foreground",
+					children: [
+						"Inserts ",
+						/* @__PURE__ */ jsx("code", { children: "| default: \"\"" }),
+						" so missing values render as empty."
+					]
+				})]
+			}), /* @__PURE__ */ jsx(Switch, {
+				checked: allowEmpty,
+				onCheckedChange: toggleAllowEmpty
+			})]
+		}),
+		/* @__PURE__ */ jsxs(Button, {
+			type: "button",
+			variant: "outline",
+			size: "sm",
+			onClick: remove,
+			children: [/* @__PURE__ */ jsx(Trash2, { className: "pz:size-3.5 pz:mr-1" }), "Remove"]
+		})
+	] });
+}
+function SecretChipBody({ raw, remove }) {
+	const publicId = raw.match(SECRET_RE)?.[1];
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs("header", {
+		className: "pz:flex pz:items-center pz:justify-between pz:gap-2",
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "pz:text-xs pz:font-medium pz:text-muted-foreground",
+			children: "Secret reference"
+		}), /* @__PURE__ */ jsx("code", {
+			className: "pz:text-xs pz:text-amber-700",
+			children: publicId ?? "(unknown)"
+		})]
+	}), /* @__PURE__ */ jsxs("div", {
+		className: "pz:flex pz:items-center pz:gap-2",
+		children: [/* @__PURE__ */ jsxs(Button, {
+			type: "button",
+			variant: "outline",
+			size: "sm",
+			onClick: () => window.open("/secrets", "_blank", "noopener"),
+			children: [/* @__PURE__ */ jsx(ExternalLink, { className: "pz:size-3.5 pz:mr-1" }), "Manage secrets"]
+		}), /* @__PURE__ */ jsxs(Button, {
+			type: "button",
+			variant: "outline",
+			size: "sm",
+			onClick: remove,
+			children: [/* @__PURE__ */ jsx(Trash2, { className: "pz:size-3.5 pz:mr-1" }), "Remove"]
+		})]
+	})] });
+}
+function BlockChipBody({ raw, replaceWith, remove }) {
+	const initial = useMemo(() => {
+		const m = raw.match(OUTPUT_BLOCK_RE);
+		if (!m) return null;
+		const [, name, type, schema, description] = m;
+		return {
+			name,
+			type,
+			schema: schema ?? "",
+			description: description ? description.replace(/\\"/g, "\"").replace(/\\\\/g, "\\") : ""
+		};
+	}, [raw]);
+	const [name, setName] = useState(initial?.name ?? "");
+	const [type, setType] = useState(initial?.type ?? "string");
+	const [schema, setSchema] = useState(initial?.schema ?? "");
+	const [description, setDescription] = useState(initial?.description ?? "");
+	const idPrefix = useId();
+	const nameId = `${idPrefix}-name`;
+	const typeId = `${idPrefix}-type`;
+	const schemaId = `${idPrefix}-schema`;
+	const descId = `${idPrefix}-desc`;
+	if (!initial) return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		/* @__PURE__ */ jsx("header", {
+			className: "pz:text-xs pz:font-medium pz:text-muted-foreground",
+			children: "Block (advanced)"
+		}),
+		/* @__PURE__ */ jsx("p", {
+			className: "pz:text-xs pz:text-muted-foreground",
+			children: "This block uses a non-standard form. Edit the raw text in the editor."
+		}),
+		/* @__PURE__ */ jsx("pre", {
+			className: "pz:overflow-x-auto pz:rounded-sm pz:bg-muted pz:px-2 pz:py-1 pz:text-xs",
+			children: raw
+		}),
+		/* @__PURE__ */ jsxs(Button, {
+			type: "button",
+			variant: "outline",
+			size: "sm",
+			onClick: remove,
+			children: [/* @__PURE__ */ jsx(Trash2, { className: "pz:size-3.5 pz:mr-1" }), "Remove"]
+		})
+	] });
+	function save() {
+		if (!name.trim()) return;
+		const escaped = description.replace(/\\/g, "\\\\").replace(/"/g, "\\\"");
+		const parts = [`{% output ${name.trim()}`, `type: "${type}"`];
+		if (type === "json" && schema.trim()) parts.push(`schema: "${schema.trim()}"`);
+		parts.push(`description: "${escaped}"`);
+		replaceWith(`${parts.join(", ")} %}`);
+	}
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		/* @__PURE__ */ jsx("header", {
+			className: "pz:text-xs pz:font-medium pz:text-muted-foreground",
+			children: "Output declaration"
+		}),
+		/* @__PURE__ */ jsxs("label", {
+			htmlFor: nameId,
+			className: "pz:flex pz:flex-col pz:gap-1 pz:text-xs",
+			children: [/* @__PURE__ */ jsx("span", { children: "Name" }), /* @__PURE__ */ jsx(Input, {
+				id: nameId,
+				value: name,
+				onChange: (e) => setName(e.target.value),
+				placeholder: "FIELD_NAME"
+			})]
+		}),
+		/* @__PURE__ */ jsxs("label", {
+			htmlFor: typeId,
+			className: "pz:flex pz:flex-col pz:gap-1 pz:text-xs",
+			children: [/* @__PURE__ */ jsx("span", { children: "Type" }), /* @__PURE__ */ jsxs("select", {
+				id: typeId,
+				value: type,
+				onChange: (e) => setType(e.target.value),
+				className: "pz:rounded-sm pz:border pz:border-input pz:bg-transparent pz:px-2 pz:py-1 pz:text-sm",
+				children: [
+					/* @__PURE__ */ jsx("option", {
+						value: "string",
+						children: "string"
+					}),
+					/* @__PURE__ */ jsx("option", {
+						value: "number",
+						children: "number"
+					}),
+					/* @__PURE__ */ jsx("option", {
+						value: "boolean",
+						children: "boolean"
+					}),
+					/* @__PURE__ */ jsx("option", {
+						value: "json",
+						children: "json"
+					}),
+					/* @__PURE__ */ jsx("option", {
+						value: "unknown",
+						children: "unknown"
+					})
+				]
+			})]
+		}),
+		type === "json" && /* @__PURE__ */ jsxs("label", {
+			htmlFor: schemaId,
+			className: "pz:flex pz:flex-col pz:gap-1 pz:text-xs",
+			children: [/* @__PURE__ */ jsx("span", { children: "Schema" }), /* @__PURE__ */ jsx(Input, {
+				id: schemaId,
+				value: schema,
+				onChange: (e) => setSchema(e.target.value),
+				placeholder: "SCHEMA_NAME"
+			})]
+		}),
+		/* @__PURE__ */ jsxs("label", {
+			htmlFor: descId,
+			className: "pz:flex pz:flex-col pz:gap-1 pz:text-xs",
+			children: [/* @__PURE__ */ jsx("span", { children: "Description" }), /* @__PURE__ */ jsx(Input, {
+				id: descId,
+				value: description,
+				onChange: (e) => setDescription(e.target.value)
+			})]
+		}),
+		/* @__PURE__ */ jsxs("div", {
+			className: "pz:flex pz:items-center pz:justify-between pz:gap-2 pz:pt-1",
+			children: [/* @__PURE__ */ jsxs(Button, {
+				type: "button",
+				variant: "ghost",
+				size: "sm",
+				onClick: remove,
+				children: [/* @__PURE__ */ jsx(Trash2, { className: "pz:size-3.5 pz:mr-1" }), "Remove"]
+			}), /* @__PURE__ */ jsx(Button, {
+				type: "button",
+				size: "sm",
+				onClick: save,
+				children: "Save"
+			})]
+		})
+	] });
+}
+
+//#endregion
+export { ChipEditPopover };
+//# sourceMappingURL=ChipEditPopover.mjs.map