@pipe0/react 0.0.2

package/dist/components/defaults/catalog/category-section.d.mts

@@ -0,0 +1,39 @@
+import { ReactNode } from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/defaults/catalog/category-section.d.ts
+interface CatalogCategorySectionProps {
+  /** Display label (e.g. "People"). */
+  label: ReactNode;
+  /** Hex / CSS color used for the small leading dot. */
+  color?: string;
+  /** Count rendered next to the label. */
+  count?: number;
+  /** Default open state when uncontrolled. Defaults to `true`. */
+  defaultOpen?: boolean;
+  /** Controlled open state. */
+  open?: boolean;
+  onOpenChange?: (open: boolean) => void;
+  className?: string;
+  /** Class names applied to the body container that wraps `children`. */
+  bodyClassName?: string;
+  children?: ReactNode;
+}
+/**
+ * Collapsible category section header. Used to group catalog cards by
+ * category. Click the header (or chevron) to toggle the body.
+ */
+declare function CatalogCategorySection({
+  label,
+  color,
+  count,
+  defaultOpen,
+  open,
+  onOpenChange,
+  className,
+  bodyClassName,
+  children
+}: CatalogCategorySectionProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { CatalogCategorySection, CatalogCategorySectionProps };
+//# sourceMappingURL=category-section.d.mts.map

package/dist/components/defaults/catalog/category-section.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"category-section.d.mts","names":[],"sources":["../../../../src/components/defaults/catalog/category-section.tsx"],"mappings":";;;;UAIiB,2BAAA;;EAEf,KAAA,EAAO,SAAA;EAFQ;EAIf,KAAA;;EAEA,KAAA;EAJA;EAMA,WAAA;EAJA;EAMA,IAAA;EACA,YAAA,IAAgB,IAAA;EAChB,SAAA;EADA;EAGA,aAAA;EACA,QAAA,GAAW,SAAA;AAAA;;;;;iBAOG,sBAAA,CAAA;EACd,KAAA;EACA,KAAA;EACA,KAAA;EACA,WAAA;EACA,IAAA;EACA,YAAA;EACA,SAAA;EACA,aAAA;EACA;AAAA,GACC,2BAAA,GAA2B,oBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/defaults/catalog/category-section.mjs

@@ -0,0 +1,59 @@
+import { cn } from "../../../lib/utils.mjs";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ChevronDown } from "lucide-react";
+
+//#region src/components/defaults/catalog/category-section.tsx
+/**
+* Collapsible category section header. Used to group catalog cards by
+* category. Click the header (or chevron) to toggle the body.
+*/
+function CatalogCategorySection({ label, color, count, defaultOpen = true, open, onOpenChange, className, bodyClassName, children }) {
+	const [internalOpen, setInternalOpen] = useState(defaultOpen);
+	const isControlled = open !== void 0;
+	const isOpen = isControlled ? !!open : internalOpen;
+	const toggle = () => {
+		const next = !isOpen;
+		if (!isControlled) setInternalOpen(next);
+		onOpenChange?.(next);
+	};
+	return /* @__PURE__ */ jsxs("section", {
+		"data-p0": "catalog-category-section",
+		"data-open": isOpen ? "true" : "false",
+		className: cn("pz:flex pz:flex-col", className),
+		children: [/* @__PURE__ */ jsxs("button", {
+			type: "button",
+			"data-p0": "catalog-category-section-header",
+			onClick: toggle,
+			"aria-expanded": isOpen,
+			className: "pz:flex pz:items-center pz:gap-2 pz:py-2 pz:text-left pz:bg-transparent pz:border-0 pz:border-b pz:border-input pz:cursor-pointer pz:transition-colors pz:hover:bg-muted/30",
+			children: [
+				/* @__PURE__ */ jsx(ChevronDown, {
+					"aria-hidden": "true",
+					className: cn("pz:size-3.5 pz:text-muted-foreground pz:shrink-0 pz:transition-transform", isOpen ? void 0 : "pz:-rotate-90")
+				}),
+				color ? /* @__PURE__ */ jsx("span", {
+					"aria-hidden": "true",
+					className: "pz:size-1.5 pz:rounded-full pz:shrink-0",
+					style: { backgroundColor: color }
+				}) : null,
+				/* @__PURE__ */ jsx("span", {
+					className: "pz:text-[11px] pz:font-semibold pz:tracking-[0.08em] pz:uppercase pz:text-foreground",
+					children: label
+				}),
+				typeof count === "number" ? /* @__PURE__ */ jsx("span", {
+					className: "pz:text-[11px] pz:text-muted-foreground",
+					children: count
+				}) : null
+			]
+		}), isOpen ? /* @__PURE__ */ jsx("div", {
+			"data-p0": "catalog-category-section-body",
+			className: cn("pz:flex pz:flex-col", bodyClassName),
+			children
+		}) : null]
+	});
+}
+
+//#endregion
+export { CatalogCategorySection };
+//# sourceMappingURL=category-section.mjs.map

package/dist/components/defaults/catalog/category-section.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"category-section.mjs","names":[],"sources":["../../../../src/components/defaults/catalog/category-section.tsx"],"sourcesContent":["import { ChevronDown } from \"lucide-react\";\nimport { type ReactNode, useState } from \"react\";\nimport { cn } from \"../../../lib/utils.js\";\n\nexport interface CatalogCategorySectionProps {\n  /** Display label (e.g. \"People\"). */\n  label: ReactNode;\n  /** Hex / CSS color used for the small leading dot. */\n  color?: string;\n  /** Count rendered next to the label. */\n  count?: number;\n  /** Default open state when uncontrolled. Defaults to `true`. */\n  defaultOpen?: boolean;\n  /** Controlled open state. */\n  open?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  className?: string;\n  /** Class names applied to the body container that wraps `children`. */\n  bodyClassName?: string;\n  children?: ReactNode;\n}\n\n/**\n * Collapsible category section header. Used to group catalog cards by\n * category. Click the header (or chevron) to toggle the body.\n */\nexport function CatalogCategorySection({\n  label,\n  color,\n  count,\n  defaultOpen = true,\n  open,\n  onOpenChange,\n  className,\n  bodyClassName,\n  children,\n}: CatalogCategorySectionProps) {\n  const [internalOpen, setInternalOpen] = useState(defaultOpen);\n  const isControlled = open !== undefined;\n  const isOpen = isControlled ? !!open : internalOpen;\n\n  const toggle = () => {\n    const next = !isOpen;\n    if (!isControlled) setInternalOpen(next);\n    onOpenChange?.(next);\n  };\n\n  return (\n    <section\n      data-p0=\"catalog-category-section\"\n      data-open={isOpen ? \"true\" : \"false\"}\n      className={cn(\"pz:flex pz:flex-col\", className)}\n    >\n      <button\n        type=\"button\"\n        data-p0=\"catalog-category-section-header\"\n        onClick={toggle}\n        aria-expanded={isOpen}\n        className=\"pz:flex pz:items-center pz:gap-2 pz:py-2 pz:text-left pz:bg-transparent pz:border-0 pz:border-b pz:border-input pz:cursor-pointer pz:transition-colors pz:hover:bg-muted/30\"\n      >\n        <ChevronDown\n          aria-hidden=\"true\"\n          className={cn(\n            \"pz:size-3.5 pz:text-muted-foreground pz:shrink-0 pz:transition-transform\",\n            isOpen ? undefined : \"pz:-rotate-90\",\n          )}\n        />\n        {color ? (\n          <span\n            aria-hidden=\"true\"\n            className=\"pz:size-1.5 pz:rounded-full pz:shrink-0\"\n            style={{ backgroundColor: color }}\n          />\n        ) : null}\n        <span className=\"pz:text-[11px] pz:font-semibold pz:tracking-[0.08em] pz:uppercase pz:text-foreground\">\n          {label}\n        </span>\n        {typeof count === \"number\" ? (\n          <span className=\"pz:text-[11px] pz:text-muted-foreground\">{count}</span>\n        ) : null}\n      </button>\n      {isOpen ? (\n        <div\n          data-p0=\"catalog-category-section-body\"\n          className={cn(\"pz:flex pz:flex-col\", bodyClassName)}\n        >\n          {children}\n        </div>\n      ) : null}\n    </section>\n  );\n}\n"],"mappings":";;;;;;;;;;AA0BA,SAAgB,uBAAuB,EACrC,OACA,OACA,OACA,cAAc,MACd,MACA,cACA,WACA,eACA,YAC8B;CAC9B,MAAM,CAAC,cAAc,mBAAmB,SAAS,YAAY;CAC7D,MAAM,eAAe,SAAS;CAC9B,MAAM,SAAS,eAAe,CAAC,CAAC,OAAO;CAEvC,MAAM,eAAe;EACnB,MAAM,OAAO,CAAC;AACd,MAAI,CAAC,aAAc,iBAAgB,KAAK;AACxC,iBAAe,KAAK;;AAGtB,QACE,qBAAC,WAAD;EACE,WAAQ;EACR,aAAW,SAAS,SAAS;EAC7B,WAAW,GAAG,uBAAuB,UAAU;YAHjD,CAKE,qBAAC,UAAD;GACE,MAAK;GACL,WAAQ;GACR,SAAS;GACT,iBAAe;GACf,WAAU;aALZ;IAOE,oBAAC,aAAD;KACE,eAAY;KACZ,WAAW,GACT,4EACA,SAAS,SAAY,gBACtB;KACD;IACD,QACC,oBAAC,QAAD;KACE,eAAY;KACZ,WAAU;KACV,OAAO,EAAE,iBAAiB,OAAO;KACjC,IACA;IACJ,oBAAC,QAAD;KAAM,WAAU;eACb;KACI;IACN,OAAO,UAAU,WAChB,oBAAC,QAAD;KAAM,WAAU;eAA2C;KAAa,IACtE;IACG;MACR,SACC,oBAAC,OAAD;GACE,WAAQ;GACR,WAAW,GAAG,uBAAuB,cAAc;GAElD;GACG,IACJ,KACI"}

package/dist/components/defaults/catalog/empty-state.mjs

@@ -0,0 +1,20 @@
+import { cn } from "../../../lib/utils.mjs";
+import { useCatalogConfig } from "../../../context/catalog-config-context.mjs";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/defaults/catalog/empty-state.tsx
+function DefaultEmptyState({ children, className }) {
+	const { classNames } = useCatalogConfig();
+	return /* @__PURE__ */ jsx("div", {
+		"data-p0": "catalog-empty-state",
+		className: cn("pz:flex pz:h-[200px] pz:flex-col pz:items-center pz:justify-center pz:rounded-md pz:border pz:border-dashed pz:p-8 pz:text-center", classNames?.emptyState, className),
+		children: /* @__PURE__ */ jsx("p", {
+			className: "pz:text-sm pz:text-muted-foreground",
+			children: children ?? "No results found. Try adjusting your filters."
+		})
+	});
+}
+
+//#endregion
+export { DefaultEmptyState };
+//# sourceMappingURL=empty-state.mjs.map

package/dist/components/defaults/catalog/empty-state.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"empty-state.mjs","names":[],"sources":["../../../../src/components/defaults/catalog/empty-state.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { useCatalogConfig } from \"../../../context/catalog-config-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\n\nexport interface DefaultEmptyStateProps {\n  children?: ReactNode;\n  className?: string;\n}\n\nexport function DefaultEmptyState({ children, className }: DefaultEmptyStateProps) {\n  const { classNames } = useCatalogConfig();\n  return (\n    <div\n      data-p0=\"catalog-empty-state\"\n      className={cn(\n        \"pz:flex pz:h-[200px] pz:flex-col pz:items-center pz:justify-center pz:rounded-md pz:border pz:border-dashed pz:p-8 pz:text-center\",\n        classNames?.emptyState,\n        className,\n      )}\n    >\n      <p className=\"pz:text-sm pz:text-muted-foreground\">\n        {children ?? \"No results found. Try adjusting your filters.\"}\n      </p>\n    </div>\n  );\n}\n"],"mappings":";;;;;AASA,SAAgB,kBAAkB,EAAE,UAAU,aAAqC;CACjF,MAAM,EAAE,eAAe,kBAAkB;AACzC,QACE,oBAAC,OAAD;EACE,WAAQ;EACR,WAAW,GACT,qIACA,YAAY,YACZ,UACD;YAED,oBAAC,KAAD;GAAG,WAAU;aACV,YAAY;GACX;EACA"}

package/dist/components/defaults/catalog/filter-select.d.mts

@@ -0,0 +1,13 @@
+import { ComponentType, ReactNode } from "react";
+//#region src/components/defaults/catalog/filter-select.d.ts
+interface FilterSelectOption {
+  label: ReactNode;
+  value: string;
+  icon?: ComponentType<{
+    className?: string;
+  }>;
+  imageSrc?: string;
+}
+//#endregion
+export { FilterSelectOption };
+//# sourceMappingURL=filter-select.d.mts.map

package/dist/components/defaults/catalog/filter-select.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"filter-select.d.mts","names":[],"sources":["../../../../src/components/defaults/catalog/filter-select.tsx"],"mappings":";;UAYiB,kBAAA;EACf,KAAA,EAAO,SAAA;EACP,KAAA;EACA,IAAA,GAAO,aAAA;IAAgB,SAAA;EAAA;EACvB,QAAA;AAAA"}

package/dist/components/defaults/catalog/filter-select.mjs

@@ -0,0 +1,45 @@
+import { cn } from "../../../lib/utils.mjs";
+import { useCatalogConfig } from "../../../context/catalog-config-context.mjs";
+import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue } from "../../ui/select.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/defaults/catalog/filter-select.tsx
+function DefaultFilterSelect({ placeholder, value, onChange, options, clearValue = "__clear__", className }) {
+	const { classNames } = useCatalogConfig();
+	const isActive = !!value;
+	return /* @__PURE__ */ jsxs(Select, {
+		value: value || "",
+		onValueChange: (v) => {
+			if (!v || v === clearValue) onChange(null);
+			else onChange(v);
+		},
+		children: [/* @__PURE__ */ jsx(SelectTrigger, {
+			"data-active": isActive ? "" : void 0,
+			className: cn("pz:h-9 pz:gap-2 pz:px-3", classNames?.filterSelect, classNames?.filterSelectButton, isActive && "pz:bg-primary pz:text-primary-foreground pz:border-primary", isActive && classNames?.filterSelectButtonActive, className),
+			children: /* @__PURE__ */ jsx(SelectValue, { placeholder })
+		}), /* @__PURE__ */ jsx(SelectContent, {
+			className: classNames?.filterPopover,
+			children: /* @__PURE__ */ jsxs(SelectGroup, { children: [/* @__PURE__ */ jsx(SelectItem, {
+				value: clearValue,
+				children: /* @__PURE__ */ jsx("span", {
+					className: "pz:text-muted-foreground",
+					children: "Clear filter"
+				})
+			}), options.map((opt) => {
+				const Icon = opt.icon;
+				return /* @__PURE__ */ jsxs(SelectItem, {
+					value: opt.value,
+					children: [Icon ? /* @__PURE__ */ jsx(Icon, { className: "pz:size-4" }) : opt.imageSrc ? /* @__PURE__ */ jsx("img", {
+						src: opt.imageSrc,
+						alt: "",
+						className: "pz:size-4 pz:rounded-sm"
+					}) : null, opt.label]
+				}, opt.value);
+			})] })
+		})]
+	});
+}
+
+//#endregion
+export { DefaultFilterSelect };
+//# sourceMappingURL=filter-select.mjs.map

package/dist/components/defaults/catalog/filter-select.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"filter-select.mjs","names":[],"sources":["../../../../src/components/defaults/catalog/filter-select.tsx"],"sourcesContent":["import type { ComponentType, ReactNode } from \"react\";\nimport { useCatalogConfig } from \"../../../context/catalog-config-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport {\n  Select,\n  SelectContent,\n  SelectGroup,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from \"../../ui/select.js\";\n\nexport interface FilterSelectOption {\n  label: ReactNode;\n  value: string;\n  icon?: ComponentType<{ className?: string }>;\n  imageSrc?: string;\n}\n\nexport interface DefaultFilterSelectProps {\n  placeholder: ReactNode;\n  value: string;\n  onChange: (value: string | null) => void;\n  options: ReadonlyArray<FilterSelectOption>;\n  /** Sentinel option value used to clear the selection. Defaults to \"__clear__\". */\n  clearValue?: string;\n  className?: string;\n}\n\nexport function DefaultFilterSelect({\n  placeholder,\n  value,\n  onChange,\n  options,\n  clearValue = \"__clear__\",\n  className,\n}: DefaultFilterSelectProps) {\n  const { classNames } = useCatalogConfig();\n  const isActive = !!value;\n  return (\n    <Select\n      value={value || \"\"}\n      onValueChange={(v) => {\n        if (!v || v === clearValue) onChange(null);\n        else onChange(v);\n      }}\n    >\n      <SelectTrigger\n        data-active={isActive ? \"\" : undefined}\n        className={cn(\n          \"pz:h-9 pz:gap-2 pz:px-3\",\n          classNames?.filterSelect,\n          classNames?.filterSelectButton,\n          isActive && \"pz:bg-primary pz:text-primary-foreground pz:border-primary\",\n          isActive && classNames?.filterSelectButtonActive,\n          className,\n        )}\n      >\n        <SelectValue placeholder={placeholder} />\n      </SelectTrigger>\n      <SelectContent className={classNames?.filterPopover}>\n        <SelectGroup>\n          <SelectItem value={clearValue}>\n            <span className=\"pz:text-muted-foreground\">Clear filter</span>\n          </SelectItem>\n          {options.map((opt) => {\n            const Icon = opt.icon;\n            return (\n              <SelectItem key={opt.value} value={opt.value}>\n                {Icon ? (\n                  <Icon className=\"pz:size-4\" />\n                ) : opt.imageSrc ? (\n                  <img src={opt.imageSrc} alt=\"\" className=\"pz:size-4 pz:rounded-sm\" />\n                ) : null}\n                {opt.label}\n              </SelectItem>\n            );\n          })}\n        </SelectGroup>\n      </SelectContent>\n    </Select>\n  );\n}\n"],"mappings":";;;;;;AA6BA,SAAgB,oBAAoB,EAClC,aACA,OACA,UACA,SACA,aAAa,aACb,aAC2B;CAC3B,MAAM,EAAE,eAAe,kBAAkB;CACzC,MAAM,WAAW,CAAC,CAAC;AACnB,QACE,qBAAC,QAAD;EACE,OAAO,SAAS;EAChB,gBAAgB,MAAM;AACpB,OAAI,CAAC,KAAK,MAAM,WAAY,UAAS,KAAK;OACrC,UAAS,EAAE;;YAJpB,CAOE,oBAAC,eAAD;GACE,eAAa,WAAW,KAAK;GAC7B,WAAW,GACT,2BACA,YAAY,cACZ,YAAY,oBACZ,YAAY,8DACZ,YAAY,YAAY,0BACxB,UACD;aAED,oBAAC,aAAD,EAA0B,aAAe;GAC3B,GAChB,oBAAC,eAAD;GAAe,WAAW,YAAY;aACpC,qBAAC,aAAD,aACE,oBAAC,YAAD;IAAY,OAAO;cACjB,oBAAC,QAAD;KAAM,WAAU;eAA2B;KAAmB;IACnD,GACZ,QAAQ,KAAK,QAAQ;IACpB,MAAM,OAAO,IAAI;AACjB,WACE,qBAAC,YAAD;KAA4B,OAAO,IAAI;eAAvC,CACG,OACC,oBAAC,MAAD,EAAM,WAAU,aAAc,IAC5B,IAAI,WACN,oBAAC,OAAD;MAAK,KAAK,IAAI;MAAU,KAAI;MAAG,WAAU;MAA4B,IACnE,MACH,IAAI,MACM;OAPI,IAAI,MAOR;KAEf,CACU;GACA,EACT"}

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

@@ -0,0 +1,53 @@
+import { PortalContainerContext } from "../../../context/portal-container-context.mjs";
+import { cn } from "../../../lib/utils.mjs";
+import { useCatalogConfig } from "../../../context/catalog-config-context.mjs";
+import { renderSlot } from "../../../utils/render-slot.mjs";
+import { useCallback, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+import { mergeProps } from "@base-ui/react/merge-props";
+import { useRender } from "@base-ui/react/use-render";
+
+//#region src/components/defaults/catalog/layout.tsx
+/**
+* Outermost catalog wrapper. Owns the `PortalContainerContext.Provider` so
+* elements-react popovers/dropdowns mounted inside the catalog tree portal
+* back into this container — keeping them inside the catalog's CSS scope.
+*/
+function DefaultCatalogRoot({ className, render, children, ...props }) {
+	const { classNames } = useCatalogConfig();
+	const [portalContainer, setPortalContainer] = useState(null);
+	const portalRef = useCallback((node) => {
+		setPortalContainer(node);
+	}, []);
+	const wrappedChildren = /* @__PURE__ */ jsx(PortalContainerContext.Provider, {
+		value: portalContainer,
+		children
+	});
+	return renderSlot({
+		defaultTagName: "div",
+		render,
+		state: {},
+		props: {
+			"data-p0": "catalog",
+			className: cn("pz:flex pz:flex-col pz:gap-4", classNames?.root, className),
+			ref: portalRef,
+			children: wrappedChildren,
+			...props
+		}
+	});
+}
+function DefaultCatalogFilters({ className, render, ...props }) {
+	const { classNames } = useCatalogConfig();
+	return useRender({
+		defaultTagName: "div",
+		render,
+		props: mergeProps({
+			className: cn("pz:flex pz:flex-wrap pz:gap-2", classNames?.filters, className),
+			"data-p0": "catalog-filters"
+		}, props)
+	});
+}
+
+//#endregion
+export { DefaultCatalogFilters, DefaultCatalogRoot };
+//# sourceMappingURL=layout.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"layout.mjs","names":[],"sources":["../../../../src/components/defaults/catalog/layout.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { type ComponentProps, type ReactNode, useCallback, useState } from \"react\";\nimport { useCatalogConfig } from \"../../../context/catalog-config-context.js\";\nimport { PortalContainerContext } from \"../../../context/portal-container-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport { type RenderProp, renderSlot } from \"../../../utils/render-slot.js\";\n\n/**\n * Outermost catalog wrapper. Owns the `PortalContainerContext.Provider` so\n * elements-react popovers/dropdowns mounted inside the catalog tree portal\n * back into this container — keeping them inside the catalog's CSS scope.\n */\nexport function DefaultCatalogRoot({\n  className,\n  render,\n  children,\n  ...props\n}: ComponentProps<\"div\"> & {\n  render?: RenderProp<ComponentProps<\"div\">, Record<never, never>>;\n}) {\n  const { classNames } = useCatalogConfig();\n  const [portalContainer, setPortalContainer] = useState<HTMLElement | null>(null);\n  const portalRef = useCallback((node: HTMLElement | null) => {\n    setPortalContainer(node);\n  }, []);\n\n  const wrappedChildren: ReactNode = (\n    <PortalContainerContext.Provider value={portalContainer}>\n      {children}\n    </PortalContainerContext.Provider>\n  );\n\n  return renderSlot({\n    defaultTagName: \"div\",\n    render,\n    state: {},\n    props: {\n      \"data-p0\": \"catalog\",\n      className: cn(\"pz:flex pz:flex-col pz:gap-4\", classNames?.root, className),\n      ref: portalRef,\n      children: wrappedChildren,\n      ...props,\n    } as ComponentProps<\"div\">,\n  });\n}\n\nexport function DefaultCatalogList({\n  className,\n  render,\n  ...props\n}: useRender.ComponentProps<\"div\">) {\n  const { classNames } = useCatalogConfig();\n  return useRender({\n    defaultTagName: \"div\",\n    render,\n    props: mergeProps<\"div\">(\n      {\n        className: cn(\n          \"pz:grid pz:gap-3 pz:grid-cols-1 pz:sm:grid-cols-2 pz:lg:grid-cols-3\",\n          classNames?.list,\n          className,\n        ),\n        ...({ \"data-p0\": \"catalog-list\" } as Record<string, string>),\n      },\n      props,\n    ),\n  });\n}\n\nexport function DefaultCatalogFilters({\n  className,\n  render,\n  ...props\n}: useRender.ComponentProps<\"div\">) {\n  const { classNames } = useCatalogConfig();\n  return useRender({\n    defaultTagName: \"div\",\n    render,\n    props: mergeProps<\"div\">(\n      {\n        className: cn(\"pz:flex pz:flex-wrap pz:gap-2\", classNames?.filters, className),\n        ...({ \"data-p0\": \"catalog-filters\" } as Record<string, string>),\n      },\n      props,\n    ),\n  });\n}\n"],"mappings":";;;;;;;;;;;;;;;AAaA,SAAgB,mBAAmB,EACjC,WACA,QACA,UACA,GAAG,SAGF;CACD,MAAM,EAAE,eAAe,kBAAkB;CACzC,MAAM,CAAC,iBAAiB,sBAAsB,SAA6B,KAAK;CAChF,MAAM,YAAY,aAAa,SAA6B;AAC1D,qBAAmB,KAAK;IACvB,EAAE,CAAC;CAEN,MAAM,kBACJ,oBAAC,uBAAuB,UAAxB;EAAiC,OAAO;EACrC;EAC+B;AAGpC,QAAO,WAAW;EAChB,gBAAgB;EAChB;EACA,OAAO,EAAE;EACT,OAAO;GACL,WAAW;GACX,WAAW,GAAG,gCAAgC,YAAY,MAAM,UAAU;GAC1E,KAAK;GACL,UAAU;GACV,GAAG;GACJ;EACF,CAAC;;AA0BJ,SAAgB,sBAAsB,EACpC,WACA,QACA,GAAG,SAC+B;CAClC,MAAM,EAAE,eAAe,kBAAkB;AACzC,QAAO,UAAU;EACf,gBAAgB;EAChB;EACA,OAAO,WACL;GACE,WAAW,GAAG,iCAAiC,YAAY,SAAS,UAAU;GACxE,WAAW;GAClB,EACD,MACD;EACF,CAAC"}

package/dist/components/defaults/catalog/provider-avatars.d.mts

@@ -0,0 +1,37 @@
+import { AvatarGroupProps } from "../../../widgets/avatar-group.mjs";
+import { ReactNode } from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { ProviderName } from "@pipe0/base";
+
+//#region src/components/defaults/catalog/provider-avatars.d.ts
+interface CatalogProviderAvatarsProps extends Omit<AvatarGroupProps, "providers" | "render"> {
+  /** Override the providers list. Defaults to `card.providers` from card context. */
+  providers?: readonly ProviderName[];
+  /** Override the cost lookup. Defaults to `card.startingCostPerProvider` from card context. */
+  startingCostPerProvider?: Partial<Record<ProviderName, number>>;
+  /** When true, the hover popover does not appear — pure visual stack. */
+  disableHover?: boolean;
+  /** Fully replace the popover body. */
+  renderPopover?: (state: {
+    providers: readonly ProviderName[];
+    startingCostPerProvider?: Partial<Record<ProviderName, number>>;
+  }) => ReactNode;
+}
+/**
+ * `<AvatarGroup>` with a hover popover that lists each provider plus its
+ * starting cost. Self-binds to the surrounding catalog card context — pass
+ * explicit `providers` to override.
+ */
+declare function CatalogProviderAvatars({
+  providers,
+  startingCostPerProvider,
+  disableHover,
+  renderPopover,
+  size,
+  showCount,
+  className,
+  ...rest
+}: CatalogProviderAvatarsProps): _$react_jsx_runtime0.JSX.Element | null;
+//#endregion
+export { CatalogProviderAvatars, CatalogProviderAvatarsProps };
+//# sourceMappingURL=provider-avatars.d.mts.map

package/dist/components/defaults/catalog/provider-avatars.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"provider-avatars.d.mts","names":[],"sources":["../../../../src/components/defaults/catalog/provider-avatars.tsx"],"mappings":";;;;;;UASiB,2BAAA,SACP,IAAA,CAAK,gBAAA;;EAEb,SAAA,YAAqB,YAAA;EAHN;EAKf,uBAAA,GAA0B,OAAA,CAAQ,MAAA,CAAO,YAAA;;EAEzC,YAAA;EAJqB;EAMrB,aAAA,IAAiB,KAAA;IACf,SAAA,WAAoB,YAAA;IACpB,uBAAA,GAA0B,OAAA,CAAQ,MAAA,CAAO,YAAA;EAAA,MACrC,SAAA;AAAA;;;;;;iBAQQ,sBAAA,CAAA;EACd,SAAA;EACA,uBAAA;EACA,YAAA;EACA,aAAA;EACA,IAAA;EACA,SAAA;EACA,SAAA;EAAA,GACG;AAAA,GACF,2BAAA,GAA2B,oBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/defaults/catalog/provider-avatars.mjs

@@ -0,0 +1,98 @@
+import { usePortalContainer } from "../../../context/portal-container-context.mjs";
+import { cn } from "../../../lib/utils.mjs";
+import { useAnyCatalogCardOptional } from "../../../context/catalog-card-context.mjs";
+import { AvatarGroup } from "../../../widgets/avatar-group.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Coins } from "lucide-react";
+import { getProviderEntry } from "@pipe0/base";
+import { PreviewCard } from "@base-ui/react/preview-card";
+
+//#region src/components/defaults/catalog/provider-avatars.tsx
+/**
+* `<AvatarGroup>` with a hover popover that lists each provider plus its
+* starting cost. Self-binds to the surrounding catalog card context — pass
+* explicit `providers` to override.
+*/
+function CatalogProviderAvatars({ providers, startingCostPerProvider, disableHover, renderPopover, size, showCount, className, ...rest }) {
+	const card = useAnyCatalogCardOptional()?.card;
+	const portalContainer = usePortalContainer();
+	const resolvedProviders = providers ?? card?.providers ?? [];
+	const resolvedCosts = startingCostPerProvider ?? card?.startingCostPerProvider;
+	if (!resolvedProviders.length) return null;
+	if (disableHover) return /* @__PURE__ */ jsx(AvatarGroup, {
+		providers: resolvedProviders,
+		size,
+		showCount,
+		className,
+		onClick: (e) => e.stopPropagation(),
+		...rest
+	});
+	return /* @__PURE__ */ jsxs(PreviewCard.Root, { children: [/* @__PURE__ */ jsx(PreviewCard.Trigger, { render: (triggerProps) => /* @__PURE__ */ jsx(AvatarGroup, {
+		providers: resolvedProviders,
+		size,
+		showCount,
+		className: cn("pz:cursor-pointer", className),
+		...rest,
+		...triggerProps,
+		onClick: (e) => {
+			e.stopPropagation();
+			const triggerOnClick = triggerProps.onClick;
+			triggerOnClick?.(e);
+		}
+	}) }), /* @__PURE__ */ jsx(PreviewCard.Portal, {
+		container: portalContainer,
+		children: /* @__PURE__ */ jsx(PreviewCard.Positioner, {
+			side: "bottom",
+			sideOffset: 4,
+			className: "pz:isolate pz:z-50",
+			children: /* @__PURE__ */ jsx(PreviewCard.Popup, {
+				"data-p0": "catalog-provider-avatars-popup",
+				className: "pz:rounded-lg pz:bg-popover pz:text-popover-foreground pz:p-2.5 pz:shadow-md pz:ring-1 pz:ring-foreground/10 pz:outline-none pz:w-56",
+				children: renderPopover ? renderPopover({
+					providers: resolvedProviders,
+					startingCostPerProvider: resolvedCosts
+				}) : /* @__PURE__ */ jsx(DefaultPopoverBody, {
+					providers: resolvedProviders,
+					startingCostPerProvider: resolvedCosts
+				})
+			})
+		})
+	})] });
+}
+function DefaultPopoverBody({ providers, startingCostPerProvider }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "pz:flex pz:flex-col pz:gap-1.5",
+		children: [/* @__PURE__ */ jsx("h4", {
+			className: "pz:m-0 pz:text-sm pz:font-medium",
+			children: "Providers"
+		}), /* @__PURE__ */ jsx("ul", {
+			className: "pz:flex pz:flex-col pz:gap-1.5 pz:list-none pz:m-0 pz:p-0",
+			children: providers.map((provider) => {
+				const entry = getProviderEntry(provider);
+				const cost = startingCostPerProvider?.[provider];
+				return /* @__PURE__ */ jsxs("li", {
+					className: "pz:flex pz:items-center pz:gap-2",
+					children: [
+						/* @__PURE__ */ jsx("img", {
+							src: entry?.logoUrl ?? "/placeholder.svg?height=24&width=24",
+							alt: entry?.label ?? provider,
+							className: "pz:rounded-md pz:h-6 pz:w-6 pz:object-cover pz:bg-background pz:border pz:border-input"
+						}),
+						/* @__PURE__ */ jsx("span", {
+							className: "pz:text-sm pz:flex-1 pz:truncate",
+							children: entry?.label ?? provider
+						}),
+						startingCostPerProvider ? /* @__PURE__ */ jsxs("span", {
+							className: "pz:inline-flex pz:items-center pz:gap-1 pz:text-xs pz:text-muted-foreground",
+							children: [/* @__PURE__ */ jsx(Coins, { className: "pz:size-3" }), cost ?? "Free"]
+						}) : null
+					]
+				}, provider);
+			})
+		})]
+	});
+}
+
+//#endregion
+export { CatalogProviderAvatars };
+//# sourceMappingURL=provider-avatars.mjs.map

package/dist/components/defaults/catalog/provider-avatars.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"provider-avatars.mjs","names":["PreviewCardPrimitive"],"sources":["../../../../src/components/defaults/catalog/provider-avatars.tsx"],"sourcesContent":["import { PreviewCard as PreviewCardPrimitive } from \"@base-ui/react/preview-card\";\nimport { getProviderEntry, type ProviderName } from \"@pipe0/base\";\nimport { Coins } from \"lucide-react\";\nimport type { MouseEvent, ReactNode } from \"react\";\nimport { useAnyCatalogCardOptional } from \"../../../context/catalog-card-context.js\";\nimport { usePortalContainer } from \"../../../context/portal-container-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport { AvatarGroup, type AvatarGroupProps } from \"../../../widgets/avatar-group.js\";\n\nexport interface CatalogProviderAvatarsProps\n  extends Omit<AvatarGroupProps, \"providers\" | \"render\"> {\n  /** Override the providers list. Defaults to `card.providers` from card context. */\n  providers?: readonly ProviderName[];\n  /** Override the cost lookup. Defaults to `card.startingCostPerProvider` from card context. */\n  startingCostPerProvider?: Partial<Record<ProviderName, number>>;\n  /** When true, the hover popover does not appear — pure visual stack. */\n  disableHover?: boolean;\n  /** Fully replace the popover body. */\n  renderPopover?: (state: {\n    providers: readonly ProviderName[];\n    startingCostPerProvider?: Partial<Record<ProviderName, number>>;\n  }) => ReactNode;\n}\n\n/**\n * `<AvatarGroup>` with a hover popover that lists each provider plus its\n * starting cost. Self-binds to the surrounding catalog card context — pass\n * explicit `providers` to override.\n */\nexport function CatalogProviderAvatars({\n  providers,\n  startingCostPerProvider,\n  disableHover,\n  renderPopover,\n  size,\n  showCount,\n  className,\n  ...rest\n}: CatalogProviderAvatarsProps) {\n  const card = useAnyCatalogCardOptional()?.card;\n  const portalContainer = usePortalContainer();\n  const resolvedProviders = providers ?? (card?.providers as ProviderName[] | undefined) ?? [];\n  const resolvedCosts = startingCostPerProvider ?? card?.startingCostPerProvider;\n\n  if (!resolvedProviders.length) return null;\n\n  if (disableHover) {\n    return (\n      <AvatarGroup\n        providers={resolvedProviders}\n        size={size}\n        showCount={showCount}\n        className={className}\n        onClick={(e) => e.stopPropagation()}\n        {...rest}\n      />\n    );\n  }\n\n  return (\n    <PreviewCardPrimitive.Root>\n      <PreviewCardPrimitive.Trigger\n        render={(triggerProps) => (\n          <AvatarGroup\n            providers={resolvedProviders}\n            size={size}\n            showCount={showCount}\n            className={cn(\"pz:cursor-pointer\", className)}\n            {...rest}\n            {...(triggerProps as Record<string, unknown>)}\n            onClick={(e: MouseEvent<HTMLDivElement>) => {\n              e.stopPropagation();\n              const triggerOnClick = (\n                triggerProps as {\n                  onClick?: (e: MouseEvent<HTMLDivElement>) => void;\n                }\n              ).onClick;\n              triggerOnClick?.(e);\n            }}\n          />\n        )}\n      />\n      <PreviewCardPrimitive.Portal container={portalContainer}>\n        <PreviewCardPrimitive.Positioner\n          side=\"bottom\"\n          sideOffset={4}\n          className=\"pz:isolate pz:z-50\"\n        >\n          <PreviewCardPrimitive.Popup\n            data-p0=\"catalog-provider-avatars-popup\"\n            className=\"pz:rounded-lg pz:bg-popover pz:text-popover-foreground pz:p-2.5 pz:shadow-md pz:ring-1 pz:ring-foreground/10 pz:outline-none pz:w-56\"\n          >\n            {renderPopover ? (\n              renderPopover({\n                providers: resolvedProviders,\n                startingCostPerProvider: resolvedCosts,\n              })\n            ) : (\n              <DefaultPopoverBody\n                providers={resolvedProviders}\n                startingCostPerProvider={resolvedCosts}\n              />\n            )}\n          </PreviewCardPrimitive.Popup>\n        </PreviewCardPrimitive.Positioner>\n      </PreviewCardPrimitive.Portal>\n    </PreviewCardPrimitive.Root>\n  );\n}\n\nfunction DefaultPopoverBody({\n  providers,\n  startingCostPerProvider,\n}: {\n  providers: readonly ProviderName[];\n  startingCostPerProvider?: Partial<Record<ProviderName, number>>;\n}) {\n  return (\n    <div className=\"pz:flex pz:flex-col pz:gap-1.5\">\n      <h4 className=\"pz:m-0 pz:text-sm pz:font-medium\">Providers</h4>\n      <ul className=\"pz:flex pz:flex-col pz:gap-1.5 pz:list-none pz:m-0 pz:p-0\">\n        {providers.map((provider) => {\n          const entry = getProviderEntry(provider);\n          const cost = startingCostPerProvider?.[provider];\n          return (\n            <li key={provider} className=\"pz:flex pz:items-center pz:gap-2\">\n              <img\n                src={entry?.logoUrl ?? \"/placeholder.svg?height=24&width=24\"}\n                alt={entry?.label ?? provider}\n                className=\"pz:rounded-md pz:h-6 pz:w-6 pz:object-cover pz:bg-background pz:border pz:border-input\"\n              />\n              <span className=\"pz:text-sm pz:flex-1 pz:truncate\">{entry?.label ?? provider}</span>\n              {startingCostPerProvider ? (\n                <span className=\"pz:inline-flex pz:items-center pz:gap-1 pz:text-xs pz:text-muted-foreground\">\n                  <Coins className=\"pz:size-3\" />\n                  {cost ?? \"Free\"}\n                </span>\n              ) : null}\n            </li>\n          );\n        })}\n      </ul>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;AA6BA,SAAgB,uBAAuB,EACrC,WACA,yBACA,cACA,eACA,MACA,WACA,WACA,GAAG,QAC2B;CAC9B,MAAM,OAAO,2BAA2B,EAAE;CAC1C,MAAM,kBAAkB,oBAAoB;CAC5C,MAAM,oBAAoB,aAAc,MAAM,aAA4C,EAAE;CAC5F,MAAM,gBAAgB,2BAA2B,MAAM;AAEvD,KAAI,CAAC,kBAAkB,OAAQ,QAAO;AAEtC,KAAI,aACF,QACE,oBAAC,aAAD;EACE,WAAW;EACL;EACK;EACA;EACX,UAAU,MAAM,EAAE,iBAAiB;EACnC,GAAI;EACJ;AAIN,QACE,qBAACA,YAAqB,MAAtB,aACE,oBAACA,YAAqB,SAAtB,EACE,SAAS,iBACP,oBAAC,aAAD;EACE,WAAW;EACL;EACK;EACX,WAAW,GAAG,qBAAqB,UAAU;EAC7C,GAAI;EACJ,GAAK;EACL,UAAU,MAAkC;AAC1C,KAAE,iBAAiB;GACnB,MAAM,iBACJ,aAGA;AACF,oBAAiB,EAAE;;EAErB,GAEJ,GACF,oBAACA,YAAqB,QAAtB;EAA6B,WAAW;YACtC,oBAACA,YAAqB,YAAtB;GACE,MAAK;GACL,YAAY;GACZ,WAAU;aAEV,oBAACA,YAAqB,OAAtB;IACE,WAAQ;IACR,WAAU;cAET,gBACC,cAAc;KACZ,WAAW;KACX,yBAAyB;KAC1B,CAAC,GAEF,oBAAC,oBAAD;KACE,WAAW;KACX,yBAAyB;KACzB;IAEuB;GACG;EACN,EACJ;;AAIhC,SAAS,mBAAmB,EAC1B,WACA,2BAIC;AACD,QACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,MAAD;GAAI,WAAU;aAAmC;GAAc,GAC/D,oBAAC,MAAD;GAAI,WAAU;aACX,UAAU,KAAK,aAAa;IAC3B,MAAM,QAAQ,iBAAiB,SAAS;IACxC,MAAM,OAAO,0BAA0B;AACvC,WACE,qBAAC,MAAD;KAAmB,WAAU;eAA7B;MACE,oBAAC,OAAD;OACE,KAAK,OAAO,WAAW;OACvB,KAAK,OAAO,SAAS;OACrB,WAAU;OACV;MACF,oBAAC,QAAD;OAAM,WAAU;iBAAoC,OAAO,SAAS;OAAgB;MACnF,0BACC,qBAAC,QAAD;OAAM,WAAU;iBAAhB,CACE,oBAAC,OAAD,EAAO,WAAU,aAAc,GAC9B,QAAQ,OACJ;WACL;MACD;OAbI,SAaJ;KAEP;GACC,EACD"}

package/dist/components/defaults/field-section-enumeration.mjs

@@ -0,0 +1,32 @@
+import { Button } from "../ui/button.mjs";
+import { IconTrash } from "../internal/icons.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/defaults/field-section-enumeration.tsx
+function FieldSectionEnumeration({ onRemove, index, label }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "pz:p-2 pz:gap-1 pz:border pz:border-input pz:rounded-md pz:flex pz:items-center",
+		children: [label ? /* @__PURE__ */ jsxs("div", {
+			className: "pz:py-0.5 pz:px-1 pz:select-none pz:text-xs pz:rounded-sm pz:bg-accent pz:border pz:border-input pz:text-muted-foreground pz:grid pz:place-content-center",
+			children: [
+				index + 1,
+				". ",
+				label
+			]
+		}) : /* @__PURE__ */ jsx("div", {
+			className: "pz:select-none pz:text-xs pz:rounded-sm pz:bg-accent pz:border pz:border-input pz:text-muted-foreground pz:size-5 pz:grid pz:place-content-center",
+			children: index + 1
+		}), /* @__PURE__ */ jsx(Button, {
+			variant: "destructive",
+			size: "icon",
+			className: "pz:[&_svg]:size-2 pz:size-5 pz:rounded-sm",
+			onClick: () => onRemove(index),
+			title: "Remove condition",
+			children: /* @__PURE__ */ jsx(IconTrash, {})
+		})]
+	});
+}
+
+//#endregion
+export { FieldSectionEnumeration };
+//# sourceMappingURL=field-section-enumeration.mjs.map

package/dist/components/defaults/field-section-enumeration.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"field-section-enumeration.mjs","names":[],"sources":["../../../src/components/defaults/field-section-enumeration.tsx"],"sourcesContent":["import { IconTrash } from \"../internal/icons\";\nimport { Button } from \"../ui/button\";\n\ntype FieldSectionEnumerationProps = {\n  label?: string;\n  index: number;\n  onRemove: (i: number) => unknown;\n};\n\nexport function FieldSectionEnumeration({ onRemove, index, label }: FieldSectionEnumerationProps) {\n  return (\n    <div className=\"pz:p-2 pz:gap-1 pz:border pz:border-input pz:rounded-md pz:flex pz:items-center\">\n      {label ? (\n        <div className=\"pz:py-0.5 pz:px-1 pz:select-none pz:text-xs pz:rounded-sm pz:bg-accent pz:border pz:border-input pz:text-muted-foreground pz:grid pz:place-content-center\">\n          {index + 1}. {label}\n        </div>\n      ) : (\n        <div className=\"pz:select-none pz:text-xs pz:rounded-sm pz:bg-accent pz:border pz:border-input pz:text-muted-foreground pz:size-5 pz:grid pz:place-content-center\">\n          {index + 1}\n        </div>\n      )}\n      <Button\n        variant=\"destructive\"\n        size=\"icon\"\n        className=\"pz:[&_svg]:size-2 pz:size-5 pz:rounded-sm\"\n        onClick={() => onRemove(index)}\n        title=\"Remove condition\"\n      >\n        <IconTrash />\n      </Button>\n    </div>\n  );\n}\n"],"mappings":";;;;;AASA,SAAgB,wBAAwB,EAAE,UAAU,OAAO,SAAuC;AAChG,QACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACG,QACC,qBAAC,OAAD;GAAK,WAAU;aAAf;IACG,QAAQ;IAAE;IAAG;IACV;OAEN,oBAAC,OAAD;GAAK,WAAU;aACZ,QAAQ;GACL,GAER,oBAAC,QAAD;GACE,SAAQ;GACR,MAAK;GACL,WAAU;GACV,eAAe,SAAS,MAAM;GAC9B,OAAM;aAEN,oBAAC,WAAD,EAAa;GACN,EACL"}

package/dist/components/defaults/layout/field-wrapper.d.mts

@@ -0,0 +1,13 @@
+import { AnyFieldProps } from "../../../types/field-props.mjs";
+import { useRender } from "@base-ui/react/use-render";
+
+//#region src/components/defaults/layout/field-wrapper.d.ts
+interface DefaultFieldWrapperState {
+  field: AnyFieldProps;
+}
+interface DefaultFieldWrapperProps extends useRender.ComponentProps<"div", DefaultFieldWrapperState> {
+  field: AnyFieldProps;
+}
+//#endregion
+export { DefaultFieldWrapperProps };
+//# sourceMappingURL=field-wrapper.d.mts.map

package/dist/components/defaults/layout/field-wrapper.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"field-wrapper.d.mts","names":[],"sources":["../../../../src/components/defaults/layout/field-wrapper.tsx"],"mappings":";;;;UAQiB,wBAAA;EACf,KAAA,EAAO,aAAA;AAAA;AAAA,UAGQ,wBAAA,SACP,SAAA,CAAU,cAAA,QAAsB,wBAAA;EACxC,KAAA,EAAO,aAAA;AAAA"}

package/dist/components/defaults/layout/field-wrapper.mjs

@@ -0,0 +1,67 @@
+import { cn } from "../../../lib/utils.mjs";
+import { useFormConfig } from "../../../context/form-context.mjs";
+import { HoverInfo } from "../../hover-info.mjs";
+import { RichText } from "../../rich-text.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/field-wrapper.tsx
+function DefaultFieldWrapper({ field, children, className, render, ...props }) {
+	const { classNames } = useFormConfig();
+	const hasError = !!field.error;
+	const isDisabled = field.disabled;
+	const defaultContent = /* @__PURE__ */ jsxs(Fragment, { children: [
+		!(field.kind === "boolean_input") && (field.label || field.description || field.info) && /* @__PURE__ */ jsxs("div", {
+			className: "pz:flex pz:flex-col pz:gap-1",
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: "pz:flex pz:items-center pz:gap-1.5",
+				children: [field.label && /* @__PURE__ */ jsx("label", {
+					"data-p0": "label",
+					htmlFor: field.id,
+					className: classNames?.label ?? cn("pz:text-sm pz:leading-none pz:font-medium pz:select-none", hasError && "pz:text-destructive"),
+					children: /* @__PURE__ */ jsx(RichText, { children: field.label })
+				}), field.info && /* @__PURE__ */ jsx(HoverInfo, { children: /* @__PURE__ */ jsx(RichText, { children: field.info }) })]
+			}), field.description && /* @__PURE__ */ jsx("p", {
+				"data-p0": "description",
+				className: classNames?.description ?? "pz:text-xs pz:text-muted-foreground",
+				children: /* @__PURE__ */ jsx(RichText, { children: field.description })
+			})]
+		}),
+		isDisabled ? /* @__PURE__ */ jsx("div", {
+			className: "pz:opacity-60 pz:pointer-events-none",
+			children
+		}) : children,
+		isDisabled && field.disabledReason && /* @__PURE__ */ jsx("div", {
+			"data-p0": "disabled-reason",
+			className: classNames?.disabledReason ?? "pz:rounded-md pz:border pz:border-input pz:bg-muted/40 pz:px-3 pz:py-2 pz:text-xs pz:text-muted-foreground",
+			children: /* @__PURE__ */ jsx(RichText, { children: field.disabledReason })
+		}),
+		hasError && /* @__PURE__ */ jsx("span", {
+			"data-p0": "error",
+			className: classNames?.error ?? "pz:text-destructive pz:text-xs pz:font-medium",
+			role: "alert",
+			children: /* @__PURE__ */ jsx(RichText, { children: field.error })
+		})
+	] });
+	return useRender({
+		defaultTagName: "div",
+		render,
+		state: { field },
+		props: mergeProps({
+			className: cn(classNames?.field ?? "pz:grid pz:gap-2", isDisabled && classNames?.fieldDisabled, className),
+			children: defaultContent,
+			"data-p0": "field",
+			"data-p0-field": field.path,
+			"data-p0-kind": field.kind,
+			...isDisabled ? {
+				"data-p0-disabled": "true",
+				"aria-disabled": "true"
+			} : {}
+		}, props)
+	});
+}
+
+//#endregion
+export { DefaultFieldWrapper };
+//# sourceMappingURL=field-wrapper.mjs.map

package/dist/components/defaults/layout/field-wrapper.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"field-wrapper.mjs","names":[],"sources":["../../../../src/components/defaults/layout/field-wrapper.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 { AnyFieldProps } from \"../../../types/field-props.js\";\nimport { HoverInfo } from \"../../hover-info.js\";\nimport { RichText } from \"../../rich-text.js\";\n\nexport interface DefaultFieldWrapperState {\n  field: AnyFieldProps;\n}\n\nexport interface DefaultFieldWrapperProps\n  extends useRender.ComponentProps<\"div\", DefaultFieldWrapperState> {\n  field: AnyFieldProps;\n}\n\nexport function DefaultFieldWrapper({\n  field,\n  children,\n  className,\n  render,\n  ...props\n}: DefaultFieldWrapperProps) {\n  const { classNames } = useFormConfig();\n  const hasError = !!field.error;\n  const isDisabled = field.disabled;\n\n  // Boolean toggles render their label inline with the switch (settings-row\n  // pattern), so the wrapper's label/description block is suppressed for them.\n  const inlineLabel = field.kind === \"boolean_input\";\n\n  const defaultContent = (\n    <>\n      {!inlineLabel && (field.label || field.description || field.info) && (\n        <div className=\"pz:flex pz:flex-col pz:gap-1\">\n          <div className=\"pz:flex pz:items-center pz:gap-1.5\">\n            {field.label && (\n              <label\n                data-p0=\"label\"\n                htmlFor={field.id}\n                className={\n                  classNames?.label ??\n                  cn(\n                    \"pz:text-sm pz:leading-none pz:font-medium pz:select-none\",\n                    hasError && \"pz:text-destructive\",\n                  )\n                }\n              >\n                <RichText>{field.label}</RichText>\n              </label>\n            )}\n            {field.info && (\n              <HoverInfo>\n                <RichText>{field.info}</RichText>\n              </HoverInfo>\n            )}\n          </div>\n          {field.description && (\n            <p\n              data-p0=\"description\"\n              className={classNames?.description ?? \"pz:text-xs pz:text-muted-foreground\"}\n            >\n              <RichText>{field.description}</RichText>\n            </p>\n          )}\n        </div>\n      )}\n      {isDisabled ? (\n        <div className=\"pz:opacity-60 pz:pointer-events-none\">{children}</div>\n      ) : (\n        children\n      )}\n      {isDisabled && field.disabledReason && (\n        <div\n          data-p0=\"disabled-reason\"\n          className={\n            classNames?.disabledReason ??\n            \"pz:rounded-md pz:border pz:border-input pz:bg-muted/40 pz:px-3 pz:py-2 pz:text-xs pz:text-muted-foreground\"\n          }\n        >\n          <RichText>{field.disabledReason}</RichText>\n        </div>\n      )}\n      {hasError && (\n        <span\n          data-p0=\"error\"\n          className={classNames?.error ?? \"pz:text-destructive pz:text-xs pz:font-medium\"}\n          role=\"alert\"\n        >\n          <RichText>{field.error}</RichText>\n        </span>\n      )}\n    </>\n  );\n\n  return useRender({\n    defaultTagName: \"div\",\n    render,\n    state: { field },\n    props: mergeProps<\"div\">(\n      {\n        className: cn(\n          classNames?.field ?? \"pz:grid pz:gap-2\",\n          isDisabled && classNames?.fieldDisabled,\n          className,\n        ),\n        children: defaultContent,\n        ...({\n          \"data-p0\": \"field\",\n          \"data-p0-field\": field.path,\n          \"data-p0-kind\": field.kind,\n          ...(isDisabled ? { \"data-p0-disabled\": \"true\", \"aria-disabled\": \"true\" } : {}),\n        } as Record<string, string>),\n      },\n      props,\n    ),\n  });\n}\n"],"mappings":";;;;;;;;;AAiBA,SAAgB,oBAAoB,EAClC,OACA,UACA,WACA,QACA,GAAG,SACwB;CAC3B,MAAM,EAAE,eAAe,eAAe;CACtC,MAAM,WAAW,CAAC,CAAC,MAAM;CACzB,MAAM,aAAa,MAAM;CAMzB,MAAM,iBACJ;EACG,EAJe,MAAM,SAAS,qBAIb,MAAM,SAAS,MAAM,eAAe,MAAM,SAC1D,qBAAC,OAAD;GAAK,WAAU;aAAf,CACE,qBAAC,OAAD;IAAK,WAAU;cAAf,CACG,MAAM,SACL,oBAAC,SAAD;KACE,WAAQ;KACR,SAAS,MAAM;KACf,WACE,YAAY,SACZ,GACE,4DACA,YAAY,sBACb;eAGH,oBAAC,UAAD,YAAW,MAAM,OAAiB;KAC5B,GAET,MAAM,QACL,oBAAC,WAAD,YACE,oBAAC,UAAD,YAAW,MAAM,MAAgB,GACvB,EAEV;OACL,MAAM,eACL,oBAAC,KAAD;IACE,WAAQ;IACR,WAAW,YAAY,eAAe;cAEtC,oBAAC,UAAD,YAAW,MAAM,aAAuB;IACtC,EAEF;;EAEP,aACC,oBAAC,OAAD;GAAK,WAAU;GAAwC;GAAe,IAEtE;EAED,cAAc,MAAM,kBACnB,oBAAC,OAAD;GACE,WAAQ;GACR,WACE,YAAY,kBACZ;aAGF,oBAAC,UAAD,YAAW,MAAM,gBAA0B;GACvC;EAEP,YACC,oBAAC,QAAD;GACE,WAAQ;GACR,WAAW,YAAY,SAAS;GAChC,MAAK;aAEL,oBAAC,UAAD,YAAW,MAAM,OAAiB;GAC7B;EAER;AAGL,QAAO,UAAU;EACf,gBAAgB;EAChB;EACA,OAAO,EAAE,OAAO;EAChB,OAAO,WACL;GACE,WAAW,GACT,YAAY,SAAS,oBACrB,cAAc,YAAY,eAC1B,UACD;GACD,UAAU;GAER,WAAW;GACX,iBAAiB,MAAM;GACvB,gBAAgB,MAAM;GACtB,GAAI,aAAa;IAAE,oBAAoB;IAAQ,iBAAiB;IAAQ,GAAG,EAAE;GAEhF,EACD,MACD;EACF,CAAC"}

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

@@ -0,0 +1,21 @@
+import { cn } from "../../../lib/utils.mjs";
+import { useFormConfig } from "../../../context/form-context.mjs";
+import { mergeProps } from "@base-ui/react/merge-props";
+import { useRender } from "@base-ui/react/use-render";
+
+//#region src/components/defaults/layout/form.tsx
+function DefaultForm({ onSubmit, className, render, ...props }) {
+	const { classNames } = useFormConfig();
+	return useRender({
+		defaultTagName: "form",
+		render,
+		props: mergeProps({
+			onSubmit,
+			className: cn("p0-form", classNames?.form, className)
+		}, props)
+	});
+}
+
+//#endregion
+export { DefaultForm };
+//# sourceMappingURL=form.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"form.mjs","names":[],"sources":["../../../../src/components/defaults/layout/form.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport type { BaseSyntheticEvent } from \"react\";\nimport { useFormConfig } from \"../../../context/form-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\n\nexport interface DefaultFormProps extends Omit<useRender.ComponentProps<\"form\">, \"onSubmit\"> {\n  onSubmit: (e?: BaseSyntheticEvent) => void | Promise<void>;\n}\n\nexport function DefaultForm({ onSubmit, className, render, ...props }: DefaultFormProps) {\n  const { classNames } = useFormConfig();\n\n  return useRender({\n    defaultTagName: \"form\",\n    render,\n    props: mergeProps<\"form\">(\n      {\n        onSubmit,\n        className: cn(\"p0-form\", classNames?.form, className),\n      },\n      props,\n    ),\n  });\n}\n"],"mappings":";;;;;;AAUA,SAAgB,YAAY,EAAE,UAAU,WAAW,QAAQ,GAAG,SAA2B;CACvF,MAAM,EAAE,eAAe,eAAe;AAEtC,QAAO,UAAU;EACf,gBAAgB;EAChB;EACA,OAAO,WACL;GACE;GACA,WAAW,GAAG,WAAW,YAAY,MAAM,UAAU;GACtD,EACD,MACD;EACF,CAAC"}

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

@@ -0,0 +1,16 @@
+import { AnyFieldProps } from "../../../types/field-props.mjs";
+import { FormGroupHandle } from "../../../types/form-handle.mjs";
+import { useRender } from "@base-ui/react/use-render";
+
+//#region src/components/defaults/layout/group.d.ts
+interface DefaultGroupState {
+  group: FormGroupHandle;
+  fields: AnyFieldProps[];
+  expanded: boolean;
+}
+interface DefaultGroupProps extends useRender.ComponentProps<"div", DefaultGroupState> {
+  group: FormGroupHandle;
+}
+//#endregion
+export { DefaultGroupProps };
+//# sourceMappingURL=group.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"group.d.mts","names":[],"sources":["../../../../src/components/defaults/layout/group.tsx"],"mappings":";;;;;UAYiB,iBAAA;EACf,KAAA,EAAO,eAAA;EACP,MAAA,EAAQ,aAAA;EACR,QAAA;AAAA;AAAA,UAGe,iBAAA,SAA0B,SAAA,CAAU,cAAA,QAAsB,iBAAA;EACzE,KAAA,EAAO,eAAA;AAAA"}