@pipe0/react 0.0.5 → 0.0.7

package/dist/components/compound/pipe-catalog/column-filter.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"column-filter.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/column-filter.tsx"],"sourcesContent":["import type { ComponentProps, ReactNode } from \"react\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport { type RenderProp, renderSlot } from \"../../../utils/render-slot.js\";\nimport {\n  DefaultFilterSelect,\n  type FilterSelectOption,\n} from \"../../defaults/catalog/filter-select.js\";\n\nexport type PipeColumnFilterId = \"inputFields\" | \"outputFields\" | \"providers\" | \"tags\";\n\n/**\n * Render-prop state shared by every specific column filter component\n * (input/output/provider/tag) and the generic `<PipeCatalogColumnFilter>`.\n */\nexport interface ColumnFilterState {\n  value: string;\n  setValue: (v: string | null) => void;\n  options: ReadonlyArray<FilterSelectOption>;\n  isActive: boolean;\n}\n\nexport interface PipeCatalogColumnFilterProps {\n  id: PipeColumnFilterId;\n  placeholder?: ReactNode;\n  options?: ReadonlyArray<FilterSelectOption>;\n  className?: string;\n  render?: RenderProp<ComponentProps<\"div\">, ColumnFilterState>;\n}\n\nfunction getDefaultOptions(\n  id: PipeColumnFilterId,\n  ctx: ReturnType<typeof usePipeCatalogContext>,\n): FilterSelectOption[] {\n  let entries: ReadonlyArray<readonly [string, unknown]> = [];\n  switch (id) {\n    case \"inputFields\":\n      entries = ctx.sortedInputFieldEntries;\n      break;\n    case \"outputFields\":\n      entries = ctx.sortedOutputFieldEntries;\n      break;\n    case \"providers\":\n      entries = ctx.sortedProviderEntries;\n      break;\n    case \"tags\":\n      entries = ctx.sortedTagEntries;\n      break;\n  }\n  return entries.map(([name]) => ({ label: name, value: name }));\n}\n\n/**\n * Generic column-filter escape hatch. For built-in filters prefer the specific\n * components: `<PipeCatalogInputFieldFilter>`, `<PipeCatalogOutputFieldFilter>`,\n * `<PipeCatalogProviderFilter>`, `<PipeCatalogTagFilter>`.\n */\nexport function PipeCatalogColumnFilter({\n  id,\n  placeholder,\n  options,\n  className,\n  render,\n}: PipeCatalogColumnFilterProps) {\n  const ctx = usePipeCatalogContext();\n  const value = ctx.getColumnFilterValue(id) || \"\";\n  const resolvedOptions = options ?? getDefaultOptions(id, ctx);\n  const setValue = (v: string | null) => {\n    if (v == null) ctx.removeColumnFilter(id);\n    else ctx.addColumnFilter(id, v);\n  };\n\n  if (render) {\n    return renderSlot({\n      defaultTagName: \"div\",\n      render,\n      state: {\n        value,\n        setValue,\n        options: resolvedOptions,\n        isActive: !!value,\n      },\n      props: {\n        \"data-p0\": `catalog-column-filter-${id}`,\n        className,\n      } as ComponentProps<\"div\">,\n    });\n  }\n\n  return (\n    <DefaultFilterSelect\n      placeholder={placeholder}\n      value={value}\n      onChange={setValue}\n      options={resolvedOptions}\n      className={className}\n    />\n  );\n}\n"],"mappings":";;;;;;AA6BA,SAAS,kBACP,IACA,KACsB;CACtB,IAAI,UAAqD,EAAE;AAC3D,SAAQ,IAAR;EACE,KAAK;AACH,aAAU,IAAI;AACd;EACF,KAAK;AACH,aAAU,IAAI;AACd;EACF,KAAK;AACH,aAAU,IAAI;AACd;EACF,KAAK;AACH,aAAU,IAAI;AACd;;AAEJ,QAAO,QAAQ,KAAK,CAAC,WAAW;EAAE,OAAO;EAAM,OAAO;EAAM,EAAE;;;;;;;AAQhE,SAAgB,wBAAwB,EACtC,IACA,aACA,SACA,WACA,UAC+B;CAC/B,MAAM,MAAM,uBAAuB;CACnC,MAAM,QAAQ,IAAI,qBAAqB,GAAG,IAAI;CAC9C,MAAM,kBAAkB,WAAW,kBAAkB,IAAI,IAAI;CAC7D,MAAM,YAAY,MAAqB;AACrC,MAAI,KAAK,KAAM,KAAI,mBAAmB,GAAG;MACpC,KAAI,gBAAgB,IAAI,EAAE;;AAGjC,KAAI,OACF,QAAO,WAAW;EAChB,gBAAgB;EAChB;EACA,OAAO;GACL;GACA;GACA,SAAS;GACT,UAAU,CAAC,CAAC;GACb;EACD,OAAO;GACL,WAAW,yBAAyB;GACpC;GACD;EACF,CAAC;AAGJ,QACE,oBAAC,qBAAD;EACe;EACN;EACP,UAAU;EACV,SAAS;EACE;EACX"}
+{"version":3,"file":"column-filter.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/column-filter.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport type { ReactNode } from \"react\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport {\n  DefaultFilterSelect,\n  type FilterSelectOption,\n} from \"../../defaults/catalog/filter-select.js\";\n\nexport type PipeColumnFilterId = \"inputFields\" | \"outputFields\" | \"providers\" | \"tags\";\n\nexport interface ColumnFilterState {\n  value: string;\n  setValue: (value: string | null) => void;\n  options: ReadonlyArray<FilterSelectOption>;\n  isActive: boolean;\n}\n\nexport interface PipeCatalogColumnFilterProps\n  extends useRender.ComponentProps<\"div\", ColumnFilterState> {\n  id: PipeColumnFilterId;\n  placeholder?: ReactNode;\n  options?: ReadonlyArray<FilterSelectOption>;\n}\n\nfunction getDefaultOptions(\n  id: PipeColumnFilterId,\n  ctx: ReturnType<typeof usePipeCatalogContext>,\n): FilterSelectOption[] {\n  let entries: ReadonlyArray<readonly [string, unknown]> = [];\n  switch (id) {\n    case \"inputFields\":\n      entries = ctx.sortedInputFieldEntries;\n      break;\n    case \"outputFields\":\n      entries = ctx.sortedOutputFieldEntries;\n      break;\n    case \"providers\":\n      entries = ctx.sortedProviderEntries;\n      break;\n    case \"tags\":\n      entries = ctx.sortedTagEntries;\n      break;\n  }\n  return entries.map(([name]) => ({ label: name, value: name }));\n}\n\n/**\n * Generic column-filter escape hatch. For built-in filters prefer the specific\n * components: `<PipeCatalogInputFieldFilter>`, `<PipeCatalogOutputFieldFilter>`,\n * `<PipeCatalogProviderFilter>`, `<PipeCatalogTagFilter>`.\n */\nexport function PipeCatalogColumnFilter({\n  id,\n  placeholder,\n  options,\n  className,\n  render,\n  ...props\n}: PipeCatalogColumnFilterProps) {\n  const ctx = usePipeCatalogContext();\n  const value = ctx.getColumnFilterValue(id) || \"\";\n  const resolvedOptions = options ?? getDefaultOptions(id, ctx);\n  const setValue = (v: string | null) => {\n    if (v == null) ctx.removeColumnFilter(id);\n    else ctx.addColumnFilter(id, v);\n  };\n\n  const element = useRender({\n    defaultTagName: \"div\",\n    render,\n    state: { value, setValue, options: resolvedOptions, isActive: !!value },\n    stateAttributesMapping: {\n      setValue: () => null,\n      options: () => null,\n    },\n    props: mergeProps<\"div\">(\n      {\n        className,\n        ...({ \"data-p0\": `catalog-column-filter-${id}` } as Record<string, string>),\n      },\n      props,\n    ),\n  });\n\n  if (render) return element;\n\n  return (\n    <DefaultFilterSelect\n      placeholder={placeholder}\n      value={value}\n      onChange={setValue}\n      options={resolvedOptions}\n      className={className}\n    />\n  );\n}\n"],"mappings":";;;;;;;AAyBA,SAAS,kBACP,IACA,KACsB;CACtB,IAAI,UAAqD,EAAE;AAC3D,SAAQ,IAAR;EACE,KAAK;AACH,aAAU,IAAI;AACd;EACF,KAAK;AACH,aAAU,IAAI;AACd;EACF,KAAK;AACH,aAAU,IAAI;AACd;EACF,KAAK;AACH,aAAU,IAAI;AACd;;AAEJ,QAAO,QAAQ,KAAK,CAAC,WAAW;EAAE,OAAO;EAAM,OAAO;EAAM,EAAE;;;;;;;AAQhE,SAAgB,wBAAwB,EACtC,IACA,aACA,SACA,WACA,QACA,GAAG,SAC4B;CAC/B,MAAM,MAAM,uBAAuB;CACnC,MAAM,QAAQ,IAAI,qBAAqB,GAAG,IAAI;CAC9C,MAAM,kBAAkB,WAAW,kBAAkB,IAAI,IAAI;CAC7D,MAAM,YAAY,MAAqB;AACrC,MAAI,KAAK,KAAM,KAAI,mBAAmB,GAAG;MACpC,KAAI,gBAAgB,IAAI,EAAE;;CAGjC,MAAM,UAAU,UAAU;EACxB,gBAAgB;EAChB;EACA,OAAO;GAAE;GAAO;GAAU,SAAS;GAAiB,UAAU,CAAC,CAAC;GAAO;EACvE,wBAAwB;GACtB,gBAAgB;GAChB,eAAe;GAChB;EACD,OAAO,WACL;GACE;GACM,WAAW,yBAAyB;GAC3C,EACD,MACD;EACF,CAAC;AAEF,KAAI,OAAQ,QAAO;AAEnB,QACE,oBAAC,qBAAD;EACe;EACN;EACP,UAAU;EACV,SAAS;EACE;EACX"}

package/dist/components/compound/pipe-catalog/empty.d.mts

@@ -1,22 +1,17 @@
-import { RenderProp } from "../../../utils/render-slot.mjs";
+import { useRender } from "@base-ui/react/use-render";
 import * as _$react from "react";
-import { ComponentProps, ReactNode } from "react";
-import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/compound/pipe-catalog/empty.d.ts
 interface PipeCatalogEmptyState {
   visible: boolean;
 }
-interface PipeCatalogEmptyProps {
-  children?: ReactNode;
-  className?: string;
-  render?: RenderProp<ComponentProps<"div">, PipeCatalogEmptyState>;
-}
+interface PipeCatalogEmptyProps extends useRender.ComponentProps<"div", PipeCatalogEmptyState> {}
 declare function PipeCatalogEmpty({
   children,
   className,
-  render
-}: PipeCatalogEmptyProps): string | number | bigint | boolean | _$react_jsx_runtime0.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | _$react.ReactPortal | _$react.ReactElement<unknown, string | _$react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
+  render,
+  ...props
+}: PipeCatalogEmptyProps): _$react.ReactElement<unknown, string | _$react.JSXElementConstructor<any>> | null;
 //#endregion
 export { PipeCatalogEmpty, PipeCatalogEmptyProps, PipeCatalogEmptyState };
 //# sourceMappingURL=empty.d.mts.map

package/dist/components/compound/pipe-catalog/empty.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"empty.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/empty.tsx"],"mappings":";;;;;;UAMiB,qBAAA;EACf,OAAA;AAAA;AAAA,UAGe,qBAAA;EACf,QAAA,GAAW,SAAA;EACX,SAAA;EACA,MAAA,GAAS,UAAA,CAAW,cAAA,SAAuB,qBAAA;AAAA;AAAA,iBAG7B,gBAAA,CAAA;EAAmB,QAAA;EAAU,SAAA;EAAW;AAAA,GAAU,qBAAA,wCAAqB,oBAAA,CAAA,GAAA,CAAA,OAAA,GAAA,QAAA,CAAA,SAAA,IAAA,OAAA,sCAAA,OAAA,CAAA,WAAA,GAAA,OAAA,CAAA,YAAA,mBAAA,OAAA,CAAA,qBAAA,SAAA,QAAA,CAAA,SAAA"}
+{"version":3,"file":"empty.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/empty.tsx"],"mappings":";;;;UAMiB,qBAAA;EACf,OAAA;AAAA;AAAA,UAGe,qBAAA,SACP,SAAA,CAAU,cAAA,QAAsB,qBAAA;AAAA,iBAE1B,gBAAA,CAAA;EAAmB,QAAA;EAAU,SAAA;EAAW,MAAA;EAAA,GAAW;AAAA,GAAS,qBAAA,GAAqB,OAAA,CAAA,YAAA,mBAAA,OAAA,CAAA,qBAAA"}

package/dist/components/compound/pipe-catalog/empty.mjs

@@ -1,29 +1,27 @@
 import { useCatalogConfig } from "../../../context/catalog-config-context.mjs";
 import { usePipeCatalogContext } from "../../../context/pipe-catalog-context.mjs";
-import { renderSlot } from "../../../utils/render-slot.mjs";
 import { DefaultEmptyState } from "../../defaults/catalog/empty-state.mjs";
+import { mergeProps } from "@base-ui/react/merge-props";
+import { useRender } from "@base-ui/react/use-render";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/compound/pipe-catalog/empty.tsx
-function PipeCatalogEmpty({ children, className, render }) {
+function PipeCatalogEmpty({ children, className, render, ...props }) {
 	const { components } = useCatalogConfig();
 	const visible = usePipeCatalogContext().table.getRowModel().rows.length === 0;
-	if (!visible) return null;
-	if (render) return renderSlot({
+	const EmptyState = components?.EmptyState;
+	const element = useRender({
 		defaultTagName: "div",
 		render,
 		state: { visible },
-		props: {
-			"data-p0": "catalog-empty",
-			className
-		}
-	});
-	const EmptyState = components?.EmptyState;
-	if (EmptyState) return /* @__PURE__ */ jsx(EmptyState, { children });
-	return /* @__PURE__ */ jsx(DefaultEmptyState, {
-		className,
-		children: children ?? "No pipes found. Try adjusting your filters."
+		props: mergeProps({
+			className,
+			children: EmptyState ? /* @__PURE__ */ jsx(EmptyState, { children }) : /* @__PURE__ */ jsx(DefaultEmptyState, { children: children ?? "No pipes found. Try adjusting your filters." }),
+			"data-p0": "catalog-empty"
+		}, props)
 	});
+	if (!visible) return null;
+	return element;
 }
 
 //#endregion

package/dist/components/compound/pipe-catalog/empty.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"empty.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/empty.tsx"],"sourcesContent":["import type { ComponentProps, ReactNode } from \"react\";\nimport { useCatalogConfig } from \"../../../context/catalog-config-context.js\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport { type RenderProp, renderSlot } from \"../../../utils/render-slot.js\";\nimport { DefaultEmptyState } from \"../../defaults/catalog/empty-state.js\";\n\nexport interface PipeCatalogEmptyState {\n  visible: boolean;\n}\n\nexport interface PipeCatalogEmptyProps {\n  children?: ReactNode;\n  className?: string;\n  render?: RenderProp<ComponentProps<\"div\">, PipeCatalogEmptyState>;\n}\n\nexport function PipeCatalogEmpty({ children, className, render }: PipeCatalogEmptyProps) {\n  const { components } = useCatalogConfig();\n  const ctx = usePipeCatalogContext();\n  const visible = ctx.table.getRowModel().rows.length === 0;\n  if (!visible) return null;\n\n  if (render) {\n    return renderSlot({\n      defaultTagName: \"div\",\n      render,\n      state: { visible },\n      props: {\n        \"data-p0\": \"catalog-empty\",\n        className,\n      } as ComponentProps<\"div\">,\n    });\n  }\n\n  const EmptyState = components?.EmptyState;\n  if (EmptyState) return <EmptyState>{children}</EmptyState>;\n\n  return (\n    <DefaultEmptyState className={className}>\n      {children ?? \"No pipes found. Try adjusting your filters.\"}\n    </DefaultEmptyState>\n  );\n}\n"],"mappings":";;;;;;;AAgBA,SAAgB,iBAAiB,EAAE,UAAU,WAAW,UAAiC;CACvF,MAAM,EAAE,eAAe,kBAAkB;CAEzC,MAAM,UADM,uBAAuB,CACf,MAAM,aAAa,CAAC,KAAK,WAAW;AACxD,KAAI,CAAC,QAAS,QAAO;AAErB,KAAI,OACF,QAAO,WAAW;EAChB,gBAAgB;EAChB;EACA,OAAO,EAAE,SAAS;EAClB,OAAO;GACL,WAAW;GACX;GACD;EACF,CAAC;CAGJ,MAAM,aAAa,YAAY;AAC/B,KAAI,WAAY,QAAO,oBAAC,YAAD,EAAa,UAAsB;AAE1D,QACE,oBAAC,mBAAD;EAA8B;YAC3B,YAAY;EACK"}
+{"version":3,"file":"empty.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/empty.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { useCatalogConfig } from \"../../../context/catalog-config-context.js\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport { DefaultEmptyState } from \"../../defaults/catalog/empty-state.js\";\n\nexport interface PipeCatalogEmptyState {\n  visible: boolean;\n}\n\nexport interface PipeCatalogEmptyProps\n  extends useRender.ComponentProps<\"div\", PipeCatalogEmptyState> {}\n\nexport function PipeCatalogEmpty({ children, className, render, ...props }: PipeCatalogEmptyProps) {\n  const { components } = useCatalogConfig();\n  const ctx = usePipeCatalogContext();\n  const visible = ctx.table.getRowModel().rows.length === 0;\n\n  const EmptyState = components?.EmptyState;\n  const defaultBody = EmptyState ? (\n    <EmptyState>{children}</EmptyState>\n  ) : (\n    <DefaultEmptyState>{children ?? \"No pipes found. Try adjusting your filters.\"}</DefaultEmptyState>\n  );\n\n  const element = useRender({\n    defaultTagName: \"div\",\n    render,\n    state: { visible },\n    props: mergeProps<\"div\">(\n      {\n        className,\n        children: defaultBody,\n        ...({ \"data-p0\": \"catalog-empty\" } as Record<string, string>),\n      },\n      props,\n    ),\n  });\n\n  if (!visible) return null;\n  return element;\n}\n"],"mappings":";;;;;;;;AAaA,SAAgB,iBAAiB,EAAE,UAAU,WAAW,QAAQ,GAAG,SAAgC;CACjG,MAAM,EAAE,eAAe,kBAAkB;CAEzC,MAAM,UADM,uBAAuB,CACf,MAAM,aAAa,CAAC,KAAK,WAAW;CAExD,MAAM,aAAa,YAAY;CAO/B,MAAM,UAAU,UAAU;EACxB,gBAAgB;EAChB;EACA,OAAO,EAAE,SAAS;EAClB,OAAO,WACL;GACE;GACA,UAbc,aAClB,oBAAC,YAAD,EAAa,UAAsB,IAEnC,oBAAC,mBAAD,YAAoB,YAAY,+CAAkE;GAWxF,WAAW;GAClB,EACD,MACD;EACF,CAAC;AAEF,KAAI,CAAC,QAAS,QAAO;AACrB,QAAO"}

package/dist/components/compound/pipe-catalog/index.d.mts

@@ -8,6 +8,6 @@ import { PipeCatalogInputFieldFilter, PipeCatalogInputFieldFilterProps } from ".
 import { PipeCatalogList, PipeCatalogListProps, PipeCatalogListState } from "./list.mjs";
 import { PipeCatalogOutputFieldFilter, PipeCatalogOutputFieldFilterProps } from "./output-field-filter.mjs";
 import { PipeCatalogProviderFilter, PipeCatalogProviderFilterProps } from "./provider-filter.mjs";
-import { PipeCatalog, PipeCatalogInstanceProps, PipeCatalogLegacyProps, PipeCatalogProps } from "./root.mjs";
+import { PipeCatalog, PipeCatalogInstanceProps, PipeCatalogProps, PipeCatalogZeroConfigProps } from "./root.mjs";
 import { PipeCatalogSearchFilter, PipeCatalogSearchFilterProps, PipeCatalogSearchFilterState } from "./search-filter.mjs";
 import { PipeCatalogTagFilter, PipeCatalogTagFilterProps } from "./tag-filter.mjs";

package/dist/components/compound/pipe-catalog/input-field-filter.d.mts

@@ -1,7 +1,7 @@
-import { RenderProp } from "../../../utils/render-slot.mjs";
 import { FilterSelectOption } from "../../defaults/catalog/filter-select.mjs";
 import { ColumnFilterState } from "./column-filter.mjs";
-import { ComponentProps, ReactNode } from "react";
+import { useRender } from "@base-ui/react/use-render";
+import { ReactNode } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/compound/pipe-catalog/input-field-filter.d.ts
@@ -9,7 +9,7 @@ interface PipeCatalogInputFieldFilterProps {
   options?: ReadonlyArray<FilterSelectOption>;
   placeholder?: ReactNode;
   className?: string;
-  render?: RenderProp<ComponentProps<"div">, ColumnFilterState>;
+  render?: useRender.ComponentProps<"div", ColumnFilterState>["render"];
 }
 declare function PipeCatalogInputFieldFilter({
   options,

package/dist/components/compound/pipe-catalog/input-field-filter.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"input-field-filter.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/input-field-filter.tsx"],"mappings":";;;;;;;UAMiB,gCAAA;EACf,OAAA,GAAU,aAAA,CAAc,kBAAA;EACxB,WAAA,GAAc,SAAA;EACd,SAAA;EACA,MAAA,GAAS,UAAA,CAAW,cAAA,SAAuB,iBAAA;AAAA;AAAA,iBAS7B,2BAAA,CAAA;EACd,OAAA;EACA,WAAA;EACA,SAAA;EACA;AAAA,GACC,gCAAA,GAAgC,oBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"input-field-filter.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/input-field-filter.tsx"],"mappings":";;;;;;;UAMiB,gCAAA;EACf,OAAA,GAAU,aAAA,CAAc,kBAAA;EACxB,WAAA,GAAc,SAAA;EACd,SAAA;EACA,MAAA,GAAS,SAAA,CAAU,cAAA,QAAsB,iBAAA;AAAA;AAAA,iBAS3B,2BAAA,CAAA;EACd,OAAA;EACA,WAAA;EACA,SAAA;EACA;AAAA,GACC,gCAAA,GAAgC,oBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/compound/pipe-catalog/input-field-filter.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"input-field-filter.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/input-field-filter.tsx"],"sourcesContent":["import { ArrowUp } from \"lucide-react\";\nimport type { ComponentProps, ReactNode } from \"react\";\nimport type { RenderProp } from \"../../../utils/render-slot.js\";\nimport type { FilterSelectOption } from \"../../defaults/catalog/filter-select.js\";\nimport { type ColumnFilterState, PipeCatalogColumnFilter } from \"./column-filter.js\";\n\nexport interface PipeCatalogInputFieldFilterProps {\n  options?: ReadonlyArray<FilterSelectOption>;\n  placeholder?: ReactNode;\n  className?: string;\n  render?: RenderProp<ComponentProps<\"div\">, ColumnFilterState>;\n}\n\nconst DEFAULT_PLACEHOLDER = (\n  <span className=\"pz:inline-flex pz:items-center pz:gap-1.5\">\n    <ArrowUp className=\"pz:size-4\" /> Input fields\n  </span>\n);\n\nexport function PipeCatalogInputFieldFilter({\n  options,\n  placeholder = DEFAULT_PLACEHOLDER,\n  className,\n  render,\n}: PipeCatalogInputFieldFilterProps) {\n  return (\n    <PipeCatalogColumnFilter\n      id=\"inputFields\"\n      placeholder={placeholder}\n      options={options}\n      className={className}\n      render={render}\n    />\n  );\n}\n"],"mappings":";;;;;AAaA,MAAM,sBACJ,qBAAC,QAAD;CAAM,WAAU;WAAhB,CACE,oBAAC,SAAD,EAAS,WAAU,aAAc,mBAC5B;;AAGT,SAAgB,4BAA4B,EAC1C,SACA,cAAc,qBACd,WACA,UACmC;AACnC,QACE,oBAAC,yBAAD;EACE,IAAG;EACU;EACJ;EACE;EACH;EACR"}
+{"version":3,"file":"input-field-filter.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/input-field-filter.tsx"],"sourcesContent":["import { useRender } from \"@base-ui/react/use-render\";\nimport { ArrowUp } from \"lucide-react\";\nimport type { ReactNode } from \"react\";\nimport type { FilterSelectOption } from \"../../defaults/catalog/filter-select.js\";\nimport { type ColumnFilterState, PipeCatalogColumnFilter } from \"./column-filter.js\";\n\nexport interface PipeCatalogInputFieldFilterProps {\n  options?: ReadonlyArray<FilterSelectOption>;\n  placeholder?: ReactNode;\n  className?: string;\n  render?: useRender.ComponentProps<\"div\", ColumnFilterState>[\"render\"];\n}\n\nconst DEFAULT_PLACEHOLDER = (\n  <span className=\"pz:inline-flex pz:items-center pz:gap-1.5\">\n    <ArrowUp className=\"pz:size-4\" /> Input fields\n  </span>\n);\n\nexport function PipeCatalogInputFieldFilter({\n  options,\n  placeholder = DEFAULT_PLACEHOLDER,\n  className,\n  render,\n}: PipeCatalogInputFieldFilterProps) {\n  return (\n    <PipeCatalogColumnFilter\n      id=\"inputFields\"\n      placeholder={placeholder}\n      options={options}\n      className={className}\n      render={render}\n    />\n  );\n}\n"],"mappings":";;;;;AAaA,MAAM,sBACJ,qBAAC,QAAD;CAAM,WAAU;WAAhB,CACE,oBAAC,SAAD,EAAS,WAAU,aAAc,mBAC5B;;AAGT,SAAgB,4BAA4B,EAC1C,SACA,cAAc,qBACd,WACA,UACmC;AACnC,QACE,oBAAC,yBAAD;EACE,IAAG;EACU;EACJ;EACE;EACH;EACR"}

package/dist/components/compound/pipe-catalog/list.d.mts

@@ -1,34 +1,19 @@
-import { RenderProp } from "../../../utils/render-slot.mjs";
 import { PipeCardData } from "../../../types/catalog-adapters.mjs";
-import { ComponentProps, ReactNode } from "react";
+import { useRender } from "@base-ui/react/use-render";
+import * as _$react from "react";
 
 //#region src/components/compound/pipe-catalog/list.d.ts
 interface PipeCatalogListState {
-  cards: PipeCardData[];
-}
-interface PipeCatalogListProps {
-  /**
-   * Optional. Receives `{ cards, ...domProps }` merged into a single object.
-   * Destructure `cards` and spread the rest onto your container.
-   *
-   * When omitted, the default render iterates `cards` and renders a
-   * `<PipeCatalogCard>` per card inside a flex column.
-   *
-   * ```tsx
-   * <PipeCatalogList render={({ cards, ...props }) => (
-   *   <div {...props} className="grid grid-cols-1 gap-3">
-   *     {cards.map(card => <PipeCatalogCard key={card.pipeId} card={card} />)}
-   *   </div>
-   * )} />
-   * ```
-   */
-  render?: RenderProp<ComponentProps<"div">, PipeCatalogListState>;
-  className?: string;
+  cards: ReadonlyArray<PipeCardData>;
+  isEmpty: boolean;
 }
+interface PipeCatalogListProps extends useRender.ComponentProps<"div", PipeCatalogListState> {}
 declare function PipeCatalogList({
   render,
-  className
-}: PipeCatalogListProps): ReactNode;
+  className,
+  children,
+  ...props
+}: PipeCatalogListProps): _$react.ReactElement<unknown, string | _$react.JSXElementConstructor<any>> | null;
 //#endregion
 export { PipeCatalogList, PipeCatalogListProps, PipeCatalogListState };
 //# sourceMappingURL=list.d.mts.map

package/dist/components/compound/pipe-catalog/list.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"list.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/list.tsx"],"mappings":";;;;;UAOiB,oBAAA;EACf,KAAA,EAAO,YAAA;AAAA;AAAA,UAGQ,oBAAA;;;;AAAjB;;;;;;;;;;;;EAgBE,MAAA,GAAS,UAAA,CAAW,cAAA,SAAuB,oBAAA;EAC3C,SAAA;AAAA;AAAA,iBAGc,eAAA,CAAA;EAAkB,MAAA;EAAQ;AAAA,GAAa,oBAAA,GAAuB,SAAA"}
+{"version":3,"file":"list.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/list.tsx"],"mappings":";;;;;UAOiB,oBAAA;EACf,KAAA,EAAO,aAAA,CAAc,YAAA;EACrB,OAAA;AAAA;AAAA,UAGe,oBAAA,SACP,SAAA,CAAU,cAAA,QAAsB,oBAAA;AAAA,iBAE1B,eAAA,CAAA;EAAkB,MAAA;EAAQ,SAAA;EAAW,QAAA;EAAA,GAAa;AAAA,GAAS,oBAAA,GAAoB,OAAA,CAAA,YAAA,mBAAA,OAAA,CAAA,qBAAA"}

package/dist/components/compound/pipe-catalog/list.mjs

@@ -1,27 +1,31 @@
 import { cn } from "../../../lib/utils.mjs";
 import { usePipeCatalogContext } from "../../../context/pipe-catalog-context.mjs";
-import { renderSlot } from "../../../utils/render-slot.mjs";
 import { PipeCatalogCard } from "./card.mjs";
+import { mergeProps } from "@base-ui/react/merge-props";
+import { useRender } from "@base-ui/react/use-render";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/compound/pipe-catalog/list.tsx
-function PipeCatalogList({ render, className }) {
+function PipeCatalogList({ render, className, children, ...props }) {
 	const { cards } = usePipeCatalogContext();
-	if (cards.length === 0) return null;
-	if (render) return renderSlot({
+	const isEmpty = cards.length === 0;
+	const defaultBody = cards.map((card) => /* @__PURE__ */ jsx(PipeCatalogCard, { card }, card.pipeId));
+	const element = useRender({
 		defaultTagName: "div",
 		render,
-		state: { cards },
-		props: {
-			"data-p0": "catalog-list",
-			className: cn("pz:flex pz:flex-col pz:gap-2", className)
-		}
-	});
-	return /* @__PURE__ */ jsx("div", {
-		"data-p0": "catalog-list",
-		className: cn("pz:flex pz:flex-col pz:gap-2", className),
-		children: cards.map((card) => /* @__PURE__ */ jsx(PipeCatalogCard, { card }, card.pipeId))
+		state: {
+			cards,
+			isEmpty
+		},
+		stateAttributesMapping: { cards: () => null },
+		props: mergeProps({
+			className: cn("pz:flex pz:flex-col pz:gap-2", className),
+			children: children ?? defaultBody,
+			"data-p0": "catalog-list"
+		}, props)
 	});
+	if (isEmpty) return null;
+	return element;
 }
 
 //#endregion

package/dist/components/compound/pipe-catalog/list.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"list.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/list.tsx"],"sourcesContent":["import type { ComponentProps, ReactNode } from \"react\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport type { PipeCardData } from \"../../../types/catalog-adapters.js\";\nimport { type RenderProp, renderSlot } from \"../../../utils/render-slot.js\";\nimport { PipeCatalogCard } from \"./card.js\";\n\nexport interface PipeCatalogListState {\n  cards: PipeCardData[];\n}\n\nexport interface PipeCatalogListProps {\n  /**\n   * Optional. Receives `{ cards, ...domProps }` merged into a single object.\n   * Destructure `cards` and spread the rest onto your container.\n   *\n   * When omitted, the default render iterates `cards` and renders a\n   * `<PipeCatalogCard>` per card inside a flex column.\n   *\n   * ```tsx\n   * <PipeCatalogList render={({ cards, ...props }) => (\n   *   <div {...props} className=\"grid grid-cols-1 gap-3\">\n   *     {cards.map(card => <PipeCatalogCard key={card.pipeId} card={card} />)}\n   *   </div>\n   * )} />\n   * ```\n   */\n  render?: RenderProp<ComponentProps<\"div\">, PipeCatalogListState>;\n  className?: string;\n}\n\nexport function PipeCatalogList({ render, className }: PipeCatalogListProps): ReactNode {\n  const ctx = usePipeCatalogContext();\n  const { cards } = ctx;\n  if (cards.length === 0) return null;\n\n  if (render) {\n    return renderSlot({\n      defaultTagName: \"div\",\n      render,\n      state: { cards },\n      props: {\n        \"data-p0\": \"catalog-list\",\n        className: cn(\"pz:flex pz:flex-col pz:gap-2\", className),\n      } as ComponentProps<\"div\">,\n    });\n  }\n\n  return (\n    <div data-p0=\"catalog-list\" className={cn(\"pz:flex pz:flex-col pz:gap-2\", className)}>\n      {cards.map((card) => (\n        <PipeCatalogCard key={card.pipeId} card={card} />\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AA+BA,SAAgB,gBAAgB,EAAE,QAAQ,aAA8C;CAEtF,MAAM,EAAE,UADI,uBAAuB;AAEnC,KAAI,MAAM,WAAW,EAAG,QAAO;AAE/B,KAAI,OACF,QAAO,WAAW;EAChB,gBAAgB;EAChB;EACA,OAAO,EAAE,OAAO;EAChB,OAAO;GACL,WAAW;GACX,WAAW,GAAG,gCAAgC,UAAU;GACzD;EACF,CAAC;AAGJ,QACE,oBAAC,OAAD;EAAK,WAAQ;EAAe,WAAW,GAAG,gCAAgC,UAAU;YACjF,MAAM,KAAK,SACV,oBAAC,iBAAD,EAAyC,MAAQ,EAA3B,KAAK,OAAsB,CACjD;EACE"}
+{"version":3,"file":"list.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/list.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport type { PipeCardData } from \"../../../types/catalog-adapters.js\";\nimport { PipeCatalogCard } from \"./card.js\";\n\nexport interface PipeCatalogListState {\n  cards: ReadonlyArray<PipeCardData>;\n  isEmpty: boolean;\n}\n\nexport interface PipeCatalogListProps\n  extends useRender.ComponentProps<\"div\", PipeCatalogListState> {}\n\nexport function PipeCatalogList({ render, className, children, ...props }: PipeCatalogListProps) {\n  const { cards } = usePipeCatalogContext();\n  const isEmpty = cards.length === 0;\n\n  const defaultBody = cards.map((card) => <PipeCatalogCard key={card.pipeId} card={card} />);\n\n  const element = useRender({\n    defaultTagName: \"div\",\n    render,\n    state: { cards, isEmpty },\n    stateAttributesMapping: {\n      cards: () => null,\n    },\n    props: mergeProps<\"div\">(\n      {\n        className: cn(\"pz:flex pz:flex-col pz:gap-2\", className),\n        children: children ?? defaultBody,\n        ...({ \"data-p0\": \"catalog-list\" } as Record<string, string>),\n      },\n      props,\n    ),\n  });\n\n  if (isEmpty) return null;\n  return element;\n}\n"],"mappings":";;;;;;;;AAeA,SAAgB,gBAAgB,EAAE,QAAQ,WAAW,UAAU,GAAG,SAA+B;CAC/F,MAAM,EAAE,UAAU,uBAAuB;CACzC,MAAM,UAAU,MAAM,WAAW;CAEjC,MAAM,cAAc,MAAM,KAAK,SAAS,oBAAC,iBAAD,EAAyC,MAAQ,EAA3B,KAAK,OAAsB,CAAC;CAE1F,MAAM,UAAU,UAAU;EACxB,gBAAgB;EAChB;EACA,OAAO;GAAE;GAAO;GAAS;EACzB,wBAAwB,EACtB,aAAa,MACd;EACD,OAAO,WACL;GACE,WAAW,GAAG,gCAAgC,UAAU;GACxD,UAAU,YAAY;GAChB,WAAW;GAClB,EACD,MACD;EACF,CAAC;AAEF,KAAI,QAAS,QAAO;AACpB,QAAO"}

package/dist/components/compound/pipe-catalog/output-field-filter.d.mts

@@ -1,7 +1,7 @@
-import { RenderProp } from "../../../utils/render-slot.mjs";
 import { FilterSelectOption } from "../../defaults/catalog/filter-select.mjs";
 import { ColumnFilterState } from "./column-filter.mjs";
-import { ComponentProps, ReactNode } from "react";
+import { useRender } from "@base-ui/react/use-render";
+import { ReactNode } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/compound/pipe-catalog/output-field-filter.d.ts
@@ -9,7 +9,7 @@ interface PipeCatalogOutputFieldFilterProps {
   options?: ReadonlyArray<FilterSelectOption>;
   placeholder?: ReactNode;
   className?: string;
-  render?: RenderProp<ComponentProps<"div">, ColumnFilterState>;
+  render?: useRender.ComponentProps<"div", ColumnFilterState>["render"];
 }
 declare function PipeCatalogOutputFieldFilter({
   options,

package/dist/components/compound/pipe-catalog/output-field-filter.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"output-field-filter.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/output-field-filter.tsx"],"mappings":";;;;;;;UAMiB,iCAAA;EACf,OAAA,GAAU,aAAA,CAAc,kBAAA;EACxB,WAAA,GAAc,SAAA;EACd,SAAA;EACA,MAAA,GAAS,UAAA,CAAW,cAAA,SAAuB,iBAAA;AAAA;AAAA,iBAS7B,4BAAA,CAAA;EACd,OAAA;EACA,WAAA;EACA,SAAA;EACA;AAAA,GACC,iCAAA,GAAiC,oBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"output-field-filter.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/output-field-filter.tsx"],"mappings":";;;;;;;UAMiB,iCAAA;EACf,OAAA,GAAU,aAAA,CAAc,kBAAA;EACxB,WAAA,GAAc,SAAA;EACd,SAAA;EACA,MAAA,GAAS,SAAA,CAAU,cAAA,QAAsB,iBAAA;AAAA;AAAA,iBAS3B,4BAAA,CAAA;EACd,OAAA;EACA,WAAA;EACA,SAAA;EACA;AAAA,GACC,iCAAA,GAAiC,oBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/compound/pipe-catalog/output-field-filter.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"output-field-filter.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/output-field-filter.tsx"],"sourcesContent":["import { ArrowDown } from \"lucide-react\";\nimport type { ComponentProps, ReactNode } from \"react\";\nimport type { RenderProp } from \"../../../utils/render-slot.js\";\nimport type { FilterSelectOption } from \"../../defaults/catalog/filter-select.js\";\nimport { type ColumnFilterState, PipeCatalogColumnFilter } from \"./column-filter.js\";\n\nexport interface PipeCatalogOutputFieldFilterProps {\n  options?: ReadonlyArray<FilterSelectOption>;\n  placeholder?: ReactNode;\n  className?: string;\n  render?: RenderProp<ComponentProps<\"div\">, ColumnFilterState>;\n}\n\nconst DEFAULT_PLACEHOLDER = (\n  <span className=\"pz:inline-flex pz:items-center pz:gap-1.5\">\n    <ArrowDown className=\"pz:size-4\" /> Output fields\n  </span>\n);\n\nexport function PipeCatalogOutputFieldFilter({\n  options,\n  placeholder = DEFAULT_PLACEHOLDER,\n  className,\n  render,\n}: PipeCatalogOutputFieldFilterProps) {\n  return (\n    <PipeCatalogColumnFilter\n      id=\"outputFields\"\n      placeholder={placeholder}\n      options={options}\n      className={className}\n      render={render}\n    />\n  );\n}\n"],"mappings":";;;;;AAaA,MAAM,sBACJ,qBAAC,QAAD;CAAM,WAAU;WAAhB,CACE,oBAAC,WAAD,EAAW,WAAU,aAAc,oBAC9B;;AAGT,SAAgB,6BAA6B,EAC3C,SACA,cAAc,qBACd,WACA,UACoC;AACpC,QACE,oBAAC,yBAAD;EACE,IAAG;EACU;EACJ;EACE;EACH;EACR"}
+{"version":3,"file":"output-field-filter.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/output-field-filter.tsx"],"sourcesContent":["import { useRender } from \"@base-ui/react/use-render\";\nimport { ArrowDown } from \"lucide-react\";\nimport type { ReactNode } from \"react\";\nimport type { FilterSelectOption } from \"../../defaults/catalog/filter-select.js\";\nimport { type ColumnFilterState, PipeCatalogColumnFilter } from \"./column-filter.js\";\n\nexport interface PipeCatalogOutputFieldFilterProps {\n  options?: ReadonlyArray<FilterSelectOption>;\n  placeholder?: ReactNode;\n  className?: string;\n  render?: useRender.ComponentProps<\"div\", ColumnFilterState>[\"render\"];\n}\n\nconst DEFAULT_PLACEHOLDER = (\n  <span className=\"pz:inline-flex pz:items-center pz:gap-1.5\">\n    <ArrowDown className=\"pz:size-4\" /> Output fields\n  </span>\n);\n\nexport function PipeCatalogOutputFieldFilter({\n  options,\n  placeholder = DEFAULT_PLACEHOLDER,\n  className,\n  render,\n}: PipeCatalogOutputFieldFilterProps) {\n  return (\n    <PipeCatalogColumnFilter\n      id=\"outputFields\"\n      placeholder={placeholder}\n      options={options}\n      className={className}\n      render={render}\n    />\n  );\n}\n"],"mappings":";;;;;AAaA,MAAM,sBACJ,qBAAC,QAAD;CAAM,WAAU;WAAhB,CACE,oBAAC,WAAD,EAAW,WAAU,aAAc,oBAC9B;;AAGT,SAAgB,6BAA6B,EAC3C,SACA,cAAc,qBACd,WACA,UACoC;AACpC,QACE,oBAAC,yBAAD;EACE,IAAG;EACU;EACJ;EACE;EACH;EACR"}

package/dist/components/compound/pipe-catalog/provider-filter.d.mts

@@ -1,7 +1,7 @@
-import { RenderProp } from "../../../utils/render-slot.mjs";
 import { FilterSelectOption } from "../../defaults/catalog/filter-select.mjs";
 import { ColumnFilterState } from "./column-filter.mjs";
-import { ComponentProps, ReactNode } from "react";
+import { useRender } from "@base-ui/react/use-render";
+import { ReactNode } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/compound/pipe-catalog/provider-filter.d.ts
@@ -9,7 +9,7 @@ interface PipeCatalogProviderFilterProps {
   options?: ReadonlyArray<FilterSelectOption>;
   placeholder?: ReactNode;
   className?: string;
-  render?: RenderProp<ComponentProps<"div">, ColumnFilterState>;
+  render?: useRender.ComponentProps<"div", ColumnFilterState>["render"];
 }
 declare function PipeCatalogProviderFilter({
   options,

package/dist/components/compound/pipe-catalog/provider-filter.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"provider-filter.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/provider-filter.tsx"],"mappings":";;;;;;;UAQiB,8BAAA;EACf,OAAA,GAAU,aAAA,CAAc,kBAAA;EACxB,WAAA,GAAc,SAAA;EACd,SAAA;EACA,MAAA,GAAS,UAAA,CAAW,cAAA,SAAuB,iBAAA;AAAA;AAAA,iBAS7B,yBAAA,CAAA;EACd,OAAA;EACA,WAAA;EACA,SAAA;EACA;AAAA,GACC,8BAAA,GAA8B,oBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"provider-filter.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/provider-filter.tsx"],"mappings":";;;;;;;UAQiB,8BAAA;EACf,OAAA,GAAU,aAAA,CAAc,kBAAA;EACxB,WAAA,GAAc,SAAA;EACd,SAAA;EACA,MAAA,GAAS,SAAA,CAAU,cAAA,QAAsB,iBAAA;AAAA;AAAA,iBAS3B,yBAAA,CAAA;EACd,OAAA;EACA,WAAA;EACA,SAAA;EACA;AAAA,GACC,8BAAA,GAA8B,oBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/compound/pipe-catalog/provider-filter.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"provider-filter.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/provider-filter.tsx"],"sourcesContent":["import { getProviderEntry, type ProviderName } from \"@pipe0/base\";\nimport { Building2 } from \"lucide-react\";\nimport type { ComponentProps, ReactNode } from \"react\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport type { RenderProp } from \"../../../utils/render-slot.js\";\nimport type { FilterSelectOption } from \"../../defaults/catalog/filter-select.js\";\nimport { type ColumnFilterState, PipeCatalogColumnFilter } from \"./column-filter.js\";\n\nexport interface PipeCatalogProviderFilterProps {\n  options?: ReadonlyArray<FilterSelectOption>;\n  placeholder?: ReactNode;\n  className?: string;\n  render?: RenderProp<ComponentProps<\"div\">, ColumnFilterState>;\n}\n\nconst DEFAULT_PLACEHOLDER = (\n  <span className=\"pz:inline-flex pz:items-center pz:gap-1.5\">\n    <Building2 className=\"pz:size-4\" /> Provider\n  </span>\n);\n\nexport function PipeCatalogProviderFilter({\n  options,\n  placeholder = DEFAULT_PLACEHOLDER,\n  className,\n  render,\n}: PipeCatalogProviderFilterProps) {\n  const ctx = usePipeCatalogContext();\n  // Provider option labels carry the logo image so the default <Select> shows\n  // the brand mark — matches what dash users expect from this filter.\n  const resolvedOptions =\n    options ??\n    ctx.sortedProviderEntries.map(([name]) => ({\n      label: name,\n      value: name,\n      imageSrc: getProviderEntry(name as ProviderName)?.logoUrl,\n    }));\n\n  return (\n    <PipeCatalogColumnFilter\n      id=\"providers\"\n      placeholder={placeholder}\n      options={resolvedOptions}\n      className={className}\n      render={render}\n    />\n  );\n}\n"],"mappings":";;;;;;;AAeA,MAAM,sBACJ,qBAAC,QAAD;CAAM,WAAU;WAAhB,CACE,oBAAC,WAAD,EAAW,WAAU,aAAc,eAC9B;;AAGT,SAAgB,0BAA0B,EACxC,SACA,cAAc,qBACd,WACA,UACiC;CACjC,MAAM,MAAM,uBAAuB;AAWnC,QACE,oBAAC,yBAAD;EACE,IAAG;EACU;EACb,SAXF,WACA,IAAI,sBAAsB,KAAK,CAAC,WAAW;GACzC,OAAO;GACP,OAAO;GACP,UAAU,iBAAiB,KAAqB,EAAE;GACnD,EAAE;EAOU;EACH;EACR"}
+{"version":3,"file":"provider-filter.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/provider-filter.tsx"],"sourcesContent":["import { useRender } from \"@base-ui/react/use-render\";\nimport { getProviderEntry, type ProviderName } from \"@pipe0/base\";\nimport { Building2 } from \"lucide-react\";\nimport type { ReactNode } from \"react\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport type { FilterSelectOption } from \"../../defaults/catalog/filter-select.js\";\nimport { type ColumnFilterState, PipeCatalogColumnFilter } from \"./column-filter.js\";\n\nexport interface PipeCatalogProviderFilterProps {\n  options?: ReadonlyArray<FilterSelectOption>;\n  placeholder?: ReactNode;\n  className?: string;\n  render?: useRender.ComponentProps<\"div\", ColumnFilterState>[\"render\"];\n}\n\nconst DEFAULT_PLACEHOLDER = (\n  <span className=\"pz:inline-flex pz:items-center pz:gap-1.5\">\n    <Building2 className=\"pz:size-4\" /> Provider\n  </span>\n);\n\nexport function PipeCatalogProviderFilter({\n  options,\n  placeholder = DEFAULT_PLACEHOLDER,\n  className,\n  render,\n}: PipeCatalogProviderFilterProps) {\n  const ctx = usePipeCatalogContext();\n  // Provider option labels carry the logo image so the default <Select> shows\n  // the brand mark — matches what dash users expect from this filter.\n  const resolvedOptions =\n    options ??\n    ctx.sortedProviderEntries.map(([name]) => ({\n      label: name,\n      value: name,\n      imageSrc: getProviderEntry(name as ProviderName)?.logoUrl,\n    }));\n\n  return (\n    <PipeCatalogColumnFilter\n      id=\"providers\"\n      placeholder={placeholder}\n      options={resolvedOptions}\n      className={className}\n      render={render}\n    />\n  );\n}\n"],"mappings":";;;;;;;AAeA,MAAM,sBACJ,qBAAC,QAAD;CAAM,WAAU;WAAhB,CACE,oBAAC,WAAD,EAAW,WAAU,aAAc,eAC9B;;AAGT,SAAgB,0BAA0B,EACxC,SACA,cAAc,qBACd,WACA,UACiC;CACjC,MAAM,MAAM,uBAAuB;AAWnC,QACE,oBAAC,yBAAD;EACE,IAAG;EACU;EACb,SAXF,WACA,IAAI,sBAAsB,KAAK,CAAC,WAAW;GACzC,OAAO;GACP,OAAO;GACP,UAAU,iBAAiB,KAAqB,EAAE;GACnD,EAAE;EAOU;EACH;EACR"}

package/dist/components/compound/pipe-catalog/root.d.mts

@@ -1,7 +1,7 @@
-import { RenderProp } from "../../../utils/render-slot.mjs";
 import { CatalogClassNames, CatalogComponentOverrides, PipeCardData } from "../../../types/catalog-adapters.mjs";
 import { UsePipeCatalogTableReturn } from "../../../hooks/use-pipe-catalog-table.mjs";
-import { ComponentProps, ReactNode, SyntheticEvent } from "react";
+import { useRender } from "@base-ui/react/use-render";
+import { ReactNode, SyntheticEvent } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 import { CatalogFilter } from "@pipe0/base";
 import { ColumnFilter } from "@tanstack/react-table";
@@ -12,7 +12,7 @@ interface CustomizationProps {
   components?: CatalogComponentOverrides;
   className?: string;
   /** Render slot for the outer wrapper. */
-  render?: RenderProp<ComponentProps<"div">, Record<never, never>>;
+  render?: useRender.ComponentProps<"div">["render"];
 }
 interface SelectionProps {
   /** Fires on click / keyboard activation of any `<PipeCatalogCard>`. */
@@ -23,13 +23,13 @@ interface PipeCatalogInstanceProps extends CustomizationProps, SelectionProps {
   context: UsePipeCatalogTableReturn;
   children?: ReactNode;
 }
-interface PipeCatalogLegacyProps extends CustomizationProps, SelectionProps {
+interface PipeCatalogZeroConfigProps extends CustomizationProps, SelectionProps {
   /** Optional whitelist/blacklist applied before the user-facing filters. */
   filter?: CatalogFilter;
   initialColumnFilters?: ColumnFilter[];
   children?: ReactNode;
 }
-type PipeCatalogProps = PipeCatalogInstanceProps | PipeCatalogLegacyProps;
+type PipeCatalogProps = PipeCatalogInstanceProps | PipeCatalogZeroConfigProps;
 /**
  * Compound root for the pipe catalog.
  *
@@ -43,5 +43,5 @@ type PipeCatalogProps = PipeCatalogInstanceProps | PipeCatalogLegacyProps;
  */
 declare function PipeCatalog(props: PipeCatalogProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { PipeCatalog, PipeCatalogInstanceProps, PipeCatalogLegacyProps, PipeCatalogProps };
+export { PipeCatalog, PipeCatalogInstanceProps, PipeCatalogProps, PipeCatalogZeroConfigProps };
 //# sourceMappingURL=root.d.mts.map

package/dist/components/compound/pipe-catalog/root.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"root.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/root.tsx"],"mappings":";;;;;;;;;UA+BU,kBAAA;EACR,UAAA,GAAa,iBAAA;EACb,UAAA,GAAa,yBAAA;EACb,SAAA;EAH0B;EAK1B,MAAA,GAAS,UAAA,CAAW,cAAA,SAAuB,MAAA;AAAA;AAAA,UAGnC,cAAA;EAHY;EAKpB,YAAA,IAAgB,IAAA,EAAM,YAAA,EAAc,CAAA,EAAG,cAAA;AAAA;AAAA,UAGxB,wBAAA,SAAiC,kBAAA,EAAoB,cAAA;EARjD;EAUnB,OAAA,EAAS,yBAAA;EACT,QAAA,GAAW,SAAA;AAAA;AAAA,UAGI,sBAAA,SAA+B,kBAAA,EAAoB,cAAA;EAhBlE;EAkBA,MAAA,GAAS,aAAA;EACT,oBAAA,GAAuB,YAAA;EACvB,QAAA,GAAW,SAAA;AAAA;AAAA,KAGD,gBAAA,GAAmB,wBAAA,GAA2B,sBAAA;;AArBP;;;;;;;;;;iBAkCnC,WAAA,CAAY,KAAA,EAAO,gBAAA,GAAgB,oBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"root.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/root.tsx"],"mappings":";;;;;;;;;UA+BU,kBAAA;EACR,UAAA,GAAa,iBAAA;EACb,UAAA,GAAa,yBAAA;EACb,SAAA;EAH0B;EAK1B,MAAA,GAAS,SAAA,CAAU,cAAA;AAAA;AAAA,UAGX,cAAA;EAHC;EAKT,YAAA,IAAgB,IAAA,EAAM,YAAA,EAAc,CAAA,EAAG,cAAA;AAAA;AAAA,UAGxB,wBAAA,SAAiC,kBAAA,EAAoB,cAAA;EAZvD;EAcb,OAAA,EAAS,yBAAA;EACT,QAAA,GAAW,SAAA;AAAA;AAAA,UAGI,0BAAA,SAAmC,kBAAA,EAAoB,cAAA;EAd7D;EAgBT,MAAA,GAAS,aAAA;EACT,oBAAA,GAAuB,YAAA;EACvB,QAAA,GAAW,SAAA;AAAA;AAAA,KAGD,gBAAA,GAAmB,wBAAA,GAA2B,0BAAA;;;;;;;;;;AAb1D;;iBA0BgB,WAAA,CAAY,KAAA,EAAO,gBAAA,GAAgB,oBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/compound/pipe-catalog/root.mjs

@@ -25,9 +25,9 @@ import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 */
 function PipeCatalog(props) {
 	if ("context" in props) return /* @__PURE__ */ jsx(PipeCatalogWithContext, { ...props });
-	return /* @__PURE__ */ jsx(PipeCatalogLegacy, { ...props });
+	return /* @__PURE__ */ jsx(PipeCatalogZeroConfig, { ...props });
 }
-function PipeCatalogLegacy({ filter, initialColumnFilters, ...rest }) {
+function PipeCatalogZeroConfig({ filter, initialColumnFilters, ...rest }) {
 	return /* @__PURE__ */ jsx(PipeCatalogWithContext, {
 		context: usePipeCatalogTable({
 			filter,

package/dist/components/compound/pipe-catalog/root.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"root.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/root.tsx"],"sourcesContent":["import type { CatalogFilter } from \"@pipe0/base\";\nimport type { ColumnFilter } from \"@tanstack/react-table\";\nimport type { ComponentProps, ReactNode, SyntheticEvent } from \"react\";\nimport { useMemo, useState } from \"react\";\nimport {\n  CatalogProvider,\n  CatalogRoot,\n  useCatalogConfig,\n} from \"../../../context/catalog-config-context.js\";\nimport {\n  PipeCatalogContext,\n  type PipeCatalogContextValue,\n} from \"../../../context/pipe-catalog-context.js\";\nimport {\n  type UsePipeCatalogTableReturn,\n  usePipeCatalogTable,\n} from \"../../../hooks/use-pipe-catalog-table.js\";\nimport type {\n  CatalogClassNames,\n  CatalogComponentOverrides,\n  PipeCardData,\n} from \"../../../types/catalog-adapters.js\";\nimport { type RenderProp, renderSlot } from \"../../../utils/render-slot.js\";\nimport { DefaultCatalogRoot } from \"../../defaults/catalog/layout.js\";\nimport { PipeCatalogActiveFilters } from \"./active-filters.js\";\nimport { PipeCatalogCategoryFilter } from \"./category-filter.js\";\nimport { PipeCatalogColumnFilters } from \"./column-filters.js\";\nimport { PipeCatalogEmpty } from \"./empty.js\";\nimport { PipeCatalogList } from \"./list.js\";\nimport { PipeCatalogSearchFilter } from \"./search-filter.js\";\n\ninterface CustomizationProps {\n  classNames?: CatalogClassNames;\n  components?: CatalogComponentOverrides;\n  className?: string;\n  /** Render slot for the outer wrapper. */\n  render?: RenderProp<ComponentProps<\"div\">, Record<never, never>>;\n}\n\ninterface SelectionProps {\n  /** Fires on click / keyboard activation of any `<PipeCatalogCard>`. */\n  onSelectPipe?: (pipe: PipeCardData, e: SyntheticEvent) => void;\n}\n\nexport interface PipeCatalogInstanceProps extends CustomizationProps, SelectionProps {\n  /** Caller-owned hook return — pass when you need to read state outside the tree. */\n  context: UsePipeCatalogTableReturn;\n  children?: ReactNode;\n}\n\nexport interface PipeCatalogLegacyProps extends CustomizationProps, SelectionProps {\n  /** Optional whitelist/blacklist applied before the user-facing filters. */\n  filter?: CatalogFilter;\n  initialColumnFilters?: ColumnFilter[];\n  children?: ReactNode;\n}\n\nexport type PipeCatalogProps = PipeCatalogInstanceProps | PipeCatalogLegacyProps;\n\n/**\n * Compound root for the pipe catalog.\n *\n * Two modes:\n * - Caller-owned: `<PipeCatalog context={usePipeCatalogTable()}>...</PipeCatalog>`\n * - Zero-config: `<PipeCatalog filter={...} />` — a fresh hook is created internally.\n *\n * Children are optional. With no children, the default tree renders a\n * functional, neutrally-styled catalog: search filter, category filter,\n * column filters, active-filter pills, list, empty state.\n */\nexport function PipeCatalog(props: PipeCatalogProps) {\n  if (\"context\" in props) {\n    return <PipeCatalogWithContext {...props} />;\n  }\n  return <PipeCatalogLegacy {...props} />;\n}\n\nfunction PipeCatalogLegacy({ filter, initialColumnFilters, ...rest }: PipeCatalogLegacyProps) {\n  const context = usePipeCatalogTable({ filter, initialColumnFilters });\n  return <PipeCatalogWithContext context={context} {...rest} />;\n}\n\nfunction PipeCatalogWithContext({\n  context,\n  children,\n  className,\n  classNames,\n  components,\n  onSelectPipe,\n  render,\n}: PipeCatalogInstanceProps) {\n  const hasLocalOverrides = classNames || components;\n  const [expandedCardId, setExpandedCardId] = useState<string | null>(null);\n\n  const value = useMemo<PipeCatalogContextValue>(\n    () => ({\n      ...context,\n      onSelectCard: onSelectPipe,\n      expandedCardId,\n      setExpandedCardId,\n    }),\n    [context, onSelectPipe, expandedCardId],\n  );\n\n  const inner = (\n    <PipeCatalogContext.Provider value={value}>\n      <PipeCatalogShell className={className} render={render}>\n        {children}\n      </PipeCatalogShell>\n    </PipeCatalogContext.Provider>\n  );\n\n  if (hasLocalOverrides) {\n    return (\n      <CatalogRoot>\n        <CatalogProvider classNames={classNames} components={components}>\n          {inner}\n        </CatalogProvider>\n      </CatalogRoot>\n    );\n  }\n  return <CatalogRoot>{inner}</CatalogRoot>;\n}\n\nfunction PipeCatalogShell({\n  children,\n  className,\n  render,\n}: {\n  children?: ReactNode;\n  className?: string;\n  render?: RenderProp<ComponentProps<\"div\">, Record<never, never>>;\n}) {\n  useCatalogConfig();\n  const body =\n    children !== undefined ? (\n      children\n    ) : (\n      <>\n        <PipeCatalogSearchFilter />\n        <PipeCatalogCategoryFilter />\n        <PipeCatalogColumnFilters />\n        <PipeCatalogActiveFilters />\n        <PipeCatalogList />\n        <PipeCatalogEmpty />\n      </>\n    );\n  return (\n    <DefaultCatalogRoot className={className} render={render}>\n      {body}\n    </DefaultCatalogRoot>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAsEA,SAAgB,YAAY,OAAyB;AACnD,KAAI,aAAa,MACf,QAAO,oBAAC,wBAAD,EAAwB,GAAI,OAAS;AAE9C,QAAO,oBAAC,mBAAD,EAAmB,GAAI,OAAS;;AAGzC,SAAS,kBAAkB,EAAE,QAAQ,sBAAsB,GAAG,QAAgC;AAE5F,QAAO,oBAAC,wBAAD;EAAwB,SADf,oBAAoB;GAAE;GAAQ;GAAsB,CAAC;EACpB,GAAI;EAAQ;;AAG/D,SAAS,uBAAuB,EAC9B,SACA,UACA,WACA,YACA,YACA,cACA,UAC2B;CAC3B,MAAM,oBAAoB,cAAc;CACxC,MAAM,CAAC,gBAAgB,qBAAqB,SAAwB,KAAK;CAEzE,MAAM,QAAQ,eACL;EACL,GAAG;EACH,cAAc;EACd;EACA;EACD,GACD;EAAC;EAAS;EAAc;EAAe,CACxC;CAED,MAAM,QACJ,oBAAC,mBAAmB,UAApB;EAAoC;YAClC,oBAAC,kBAAD;GAA6B;GAAmB;GAC7C;GACgB;EACS;AAGhC,KAAI,kBACF,QACE,oBAAC,aAAD,YACE,oBAAC,iBAAD;EAA6B;EAAwB;YAClD;EACe,GACN;AAGlB,QAAO,oBAAC,aAAD,YAAc,OAAoB;;AAG3C,SAAS,iBAAiB,EACxB,UACA,WACA,UAKC;AACD,mBAAkB;AAclB,QACE,oBAAC,oBAAD;EAA+B;EAAmB;YAblD,aAAa,SACX,WAEA;GACE,oBAAC,yBAAD,EAA2B;GAC3B,oBAAC,2BAAD,EAA6B;GAC7B,oBAAC,0BAAD,EAA4B;GAC5B,oBAAC,0BAAD,EAA4B;GAC5B,oBAAC,iBAAD,EAAmB;GACnB,oBAAC,kBAAD,EAAoB;GACnB;EAKgB"}
+{"version":3,"file":"root.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/root.tsx"],"sourcesContent":["import { useRender } from \"@base-ui/react/use-render\";\nimport type { CatalogFilter } from \"@pipe0/base\";\nimport type { ColumnFilter } from \"@tanstack/react-table\";\nimport type { ReactNode, SyntheticEvent } from \"react\";\nimport { useMemo, useState } from \"react\";\nimport {\n  CatalogProvider,\n  CatalogRoot,\n  useCatalogConfig,\n} from \"../../../context/catalog-config-context.js\";\nimport {\n  PipeCatalogContext,\n  type PipeCatalogContextValue,\n} from \"../../../context/pipe-catalog-context.js\";\nimport {\n  type UsePipeCatalogTableReturn,\n  usePipeCatalogTable,\n} from \"../../../hooks/use-pipe-catalog-table.js\";\nimport type {\n  CatalogClassNames,\n  CatalogComponentOverrides,\n  PipeCardData,\n} from \"../../../types/catalog-adapters.js\";\nimport { DefaultCatalogRoot } from \"../../defaults/catalog/layout.js\";\nimport { PipeCatalogActiveFilters } from \"./active-filters.js\";\nimport { PipeCatalogCategoryFilter } from \"./category-filter.js\";\nimport { PipeCatalogColumnFilters } from \"./column-filters.js\";\nimport { PipeCatalogEmpty } from \"./empty.js\";\nimport { PipeCatalogList } from \"./list.js\";\nimport { PipeCatalogSearchFilter } from \"./search-filter.js\";\n\ninterface CustomizationProps {\n  classNames?: CatalogClassNames;\n  components?: CatalogComponentOverrides;\n  className?: string;\n  /** Render slot for the outer wrapper. */\n  render?: useRender.ComponentProps<\"div\">[\"render\"];\n}\n\ninterface SelectionProps {\n  /** Fires on click / keyboard activation of any `<PipeCatalogCard>`. */\n  onSelectPipe?: (pipe: PipeCardData, e: SyntheticEvent) => void;\n}\n\nexport interface PipeCatalogInstanceProps extends CustomizationProps, SelectionProps {\n  /** Caller-owned hook return — pass when you need to read state outside the tree. */\n  context: UsePipeCatalogTableReturn;\n  children?: ReactNode;\n}\n\nexport interface PipeCatalogZeroConfigProps extends CustomizationProps, SelectionProps {\n  /** Optional whitelist/blacklist applied before the user-facing filters. */\n  filter?: CatalogFilter;\n  initialColumnFilters?: ColumnFilter[];\n  children?: ReactNode;\n}\n\nexport type PipeCatalogProps = PipeCatalogInstanceProps | PipeCatalogZeroConfigProps;\n\n/**\n * Compound root for the pipe catalog.\n *\n * Two modes:\n * - Caller-owned: `<PipeCatalog context={usePipeCatalogTable()}>...</PipeCatalog>`\n * - Zero-config: `<PipeCatalog filter={...} />` — a fresh hook is created internally.\n *\n * Children are optional. With no children, the default tree renders a\n * functional, neutrally-styled catalog: search filter, category filter,\n * column filters, active-filter pills, list, empty state.\n */\nexport function PipeCatalog(props: PipeCatalogProps) {\n  if (\"context\" in props) {\n    return <PipeCatalogWithContext {...props} />;\n  }\n  return <PipeCatalogZeroConfig {...props} />;\n}\n\nfunction PipeCatalogZeroConfig({ filter, initialColumnFilters, ...rest }: PipeCatalogZeroConfigProps) {\n  const context = usePipeCatalogTable({ filter, initialColumnFilters });\n  return <PipeCatalogWithContext context={context} {...rest} />;\n}\n\nfunction PipeCatalogWithContext({\n  context,\n  children,\n  className,\n  classNames,\n  components,\n  onSelectPipe,\n  render,\n}: PipeCatalogInstanceProps) {\n  const hasLocalOverrides = classNames || components;\n  const [expandedCardId, setExpandedCardId] = useState<string | null>(null);\n\n  const value = useMemo<PipeCatalogContextValue>(\n    () => ({\n      ...context,\n      onSelectCard: onSelectPipe,\n      expandedCardId,\n      setExpandedCardId,\n    }),\n    [context, onSelectPipe, expandedCardId],\n  );\n\n  const inner = (\n    <PipeCatalogContext.Provider value={value}>\n      <PipeCatalogShell className={className} render={render}>\n        {children}\n      </PipeCatalogShell>\n    </PipeCatalogContext.Provider>\n  );\n\n  if (hasLocalOverrides) {\n    return (\n      <CatalogRoot>\n        <CatalogProvider classNames={classNames} components={components}>\n          {inner}\n        </CatalogProvider>\n      </CatalogRoot>\n    );\n  }\n  return <CatalogRoot>{inner}</CatalogRoot>;\n}\n\nfunction PipeCatalogShell({\n  children,\n  className,\n  render,\n}: {\n  children?: ReactNode;\n  className?: string;\n  render?: useRender.ComponentProps<\"div\">[\"render\"];\n}) {\n  useCatalogConfig();\n  const body =\n    children !== undefined ? (\n      children\n    ) : (\n      <>\n        <PipeCatalogSearchFilter />\n        <PipeCatalogCategoryFilter />\n        <PipeCatalogColumnFilters />\n        <PipeCatalogActiveFilters />\n        <PipeCatalogList />\n        <PipeCatalogEmpty />\n      </>\n    );\n  return (\n    <DefaultCatalogRoot className={className} render={render}>\n      {body}\n    </DefaultCatalogRoot>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAsEA,SAAgB,YAAY,OAAyB;AACnD,KAAI,aAAa,MACf,QAAO,oBAAC,wBAAD,EAAwB,GAAI,OAAS;AAE9C,QAAO,oBAAC,uBAAD,EAAuB,GAAI,OAAS;;AAG7C,SAAS,sBAAsB,EAAE,QAAQ,sBAAsB,GAAG,QAAoC;AAEpG,QAAO,oBAAC,wBAAD;EAAwB,SADf,oBAAoB;GAAE;GAAQ;GAAsB,CAAC;EACpB,GAAI;EAAQ;;AAG/D,SAAS,uBAAuB,EAC9B,SACA,UACA,WACA,YACA,YACA,cACA,UAC2B;CAC3B,MAAM,oBAAoB,cAAc;CACxC,MAAM,CAAC,gBAAgB,qBAAqB,SAAwB,KAAK;CAEzE,MAAM,QAAQ,eACL;EACL,GAAG;EACH,cAAc;EACd;EACA;EACD,GACD;EAAC;EAAS;EAAc;EAAe,CACxC;CAED,MAAM,QACJ,oBAAC,mBAAmB,UAApB;EAAoC;YAClC,oBAAC,kBAAD;GAA6B;GAAmB;GAC7C;GACgB;EACS;AAGhC,KAAI,kBACF,QACE,oBAAC,aAAD,YACE,oBAAC,iBAAD;EAA6B;EAAwB;YAClD;EACe,GACN;AAGlB,QAAO,oBAAC,aAAD,YAAc,OAAoB;;AAG3C,SAAS,iBAAiB,EACxB,UACA,WACA,UAKC;AACD,mBAAkB;AAclB,QACE,oBAAC,oBAAD;EAA+B;EAAmB;YAblD,aAAa,SACX,WAEA;GACE,oBAAC,yBAAD,EAA2B;GAC3B,oBAAC,2BAAD,EAA6B;GAC7B,oBAAC,0BAAD,EAA4B;GAC5B,oBAAC,0BAAD,EAA4B;GAC5B,oBAAC,iBAAD,EAAmB;GACnB,oBAAC,kBAAD,EAAoB;GACnB;EAKgB"}

package/dist/components/compound/pipe-catalog/search-filter.d.mts

@@ -1,24 +1,21 @@
-import { RenderProp } from "../../../utils/render-slot.mjs";
-import * as _$react from "react";
-import { ComponentProps } from "react";
+import { useRender } from "@base-ui/react/use-render";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/compound/pipe-catalog/search-filter.d.ts
 interface PipeCatalogSearchFilterState {
   value: string;
-  setValue: (v: string) => void;
+  setValue: (value: string) => void;
   isActive: boolean;
 }
-interface PipeCatalogSearchFilterProps {
+interface PipeCatalogSearchFilterProps extends useRender.ComponentProps<"input", PipeCatalogSearchFilterState> {
   placeholder?: string;
-  className?: string;
-  render?: RenderProp<ComponentProps<"input">, PipeCatalogSearchFilterState>;
 }
 declare function PipeCatalogSearchFilter({
   placeholder,
   className,
-  render
-}: PipeCatalogSearchFilterProps): string | number | bigint | boolean | _$react_jsx_runtime0.JSX.Element | Iterable<_$react.ReactNode> | Promise<string | number | bigint | boolean | _$react.ReactPortal | _$react.ReactElement<unknown, string | _$react.JSXElementConstructor<any>> | Iterable<_$react.ReactNode> | null | undefined> | null | undefined;
+  render,
+  ...props
+}: PipeCatalogSearchFilterProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { PipeCatalogSearchFilter, PipeCatalogSearchFilterProps, PipeCatalogSearchFilterState };
 //# sourceMappingURL=search-filter.d.mts.map

package/dist/components/compound/pipe-catalog/search-filter.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"search-filter.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/search-filter.tsx"],"mappings":";;;;;;UAQiB,4BAAA;EACf,KAAA;EACA,QAAA,GAAW,CAAA;EACX,QAAA;AAAA;AAAA,UAGe,4BAAA;EACf,WAAA;EACA,SAAA;EACA,MAAA,GAAS,UAAA,CAAW,cAAA,WAAyB,4BAAA;AAAA;AAAA,iBAG/B,uBAAA,CAAA;EACd,WAAA;EACA,SAAA;EACA;AAAA,GACC,4BAAA,wCAA4B,oBAAA,CAAA,GAAA,CAAA,OAAA,GAAA,QAAA,CAAA,OAAA,CAAA,SAAA,IAAA,OAAA,sCAAA,OAAA,CAAA,WAAA,GAAA,OAAA,CAAA,YAAA,mBAAA,OAAA,CAAA,qBAAA,SAAA,QAAA,CAAA,OAAA,CAAA,SAAA"}
+{"version":3,"file":"search-filter.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/search-filter.tsx"],"mappings":";;;;UASiB,4BAAA;EACf,KAAA;EACA,QAAA,GAAW,KAAA;EACX,QAAA;AAAA;AAAA,UAGe,4BAAA,SACP,SAAA,CAAU,cAAA,UAAwB,4BAAA;EAC1C,WAAA;AAAA;AAAA,iBAGc,uBAAA,CAAA;EACd,WAAA;EACA,SAAA;EACA,MAAA;EAAA,GACG;AAAA,GACF,4BAAA,GAA4B,oBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/compound/pipe-catalog/search-filter.mjs

@@ -1,33 +1,34 @@
 import { cn } from "../../../lib/utils.mjs";
 import { useCatalogConfig } from "../../../context/catalog-config-context.mjs";
 import { usePipeCatalogContext } from "../../../context/pipe-catalog-context.mjs";
-import { renderSlot } from "../../../utils/render-slot.mjs";
 import { Input } from "../../ui/input.mjs";
+import { mergeProps } from "@base-ui/react/merge-props";
+import { useRender } from "@base-ui/react/use-render";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Search } from "lucide-react";
 
 //#region src/components/compound/pipe-catalog/search-filter.tsx
-function PipeCatalogSearchFilter({ placeholder = "Search pipes...", className, render }) {
+function PipeCatalogSearchFilter({ placeholder = "Search pipes...", className, render, ...props }) {
 	const { globalFilterInput, setGlobalFilterInput } = usePipeCatalogContext();
 	const { classNames } = useCatalogConfig();
-	const isActive = !!globalFilterInput;
-	if (render) return renderSlot({
+	const inputElement = useRender({
 		defaultTagName: "input",
 		render,
 		state: {
 			value: globalFilterInput,
 			setValue: setGlobalFilterInput,
-			isActive
+			isActive: !!globalFilterInput
 		},
-		props: {
+		stateAttributesMapping: { setValue: () => null },
+		props: mergeProps({
 			type: "search",
 			placeholder,
 			value: globalFilterInput,
 			onChange: (e) => setGlobalFilterInput(e.target.value),
-			"data-active": isActive ? "" : void 0,
-			className: cn(classNames?.searchInput, className)
-		}
+			className: render ? cn(classNames?.searchInput, className) : void 0
+		}, props)
 	});
+	if (render) return inputElement;
 	return /* @__PURE__ */ jsxs("div", {
 		"data-p0": "catalog-search",
 		className: cn("pz:relative", classNames?.searchInputContainer),

package/dist/components/compound/pipe-catalog/search-filter.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"search-filter.mjs","names":["SearchIcon"],"sources":["../../../../src/components/compound/pipe-catalog/search-filter.tsx"],"sourcesContent":["import { Search as SearchIcon } from \"lucide-react\";\nimport type { ChangeEvent, ComponentProps } from \"react\";\nimport { useCatalogConfig } from \"../../../context/catalog-config-context.js\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport { type RenderProp, renderSlot } from \"../../../utils/render-slot.js\";\nimport { Input } from \"../../ui/input.js\";\n\nexport interface PipeCatalogSearchFilterState {\n  value: string;\n  setValue: (v: string) => void;\n  isActive: boolean;\n}\n\nexport interface PipeCatalogSearchFilterProps {\n  placeholder?: string;\n  className?: string;\n  render?: RenderProp<ComponentProps<\"input\">, PipeCatalogSearchFilterState>;\n}\n\nexport function PipeCatalogSearchFilter({\n  placeholder = \"Search pipes...\",\n  className,\n  render,\n}: PipeCatalogSearchFilterProps) {\n  const { globalFilterInput, setGlobalFilterInput } = usePipeCatalogContext();\n  const { classNames } = useCatalogConfig();\n  const isActive = !!globalFilterInput;\n\n  if (render) {\n    return renderSlot({\n      defaultTagName: \"input\",\n      render,\n      state: {\n        value: globalFilterInput,\n        setValue: setGlobalFilterInput,\n        isActive,\n      },\n      props: {\n        type: \"search\",\n        placeholder,\n        value: globalFilterInput,\n        onChange: (e: ChangeEvent<HTMLInputElement>) => setGlobalFilterInput(e.target.value),\n        \"data-active\": isActive ? \"\" : undefined,\n        className: cn(classNames?.searchInput, className),\n      } as ComponentProps<\"input\">,\n    });\n  }\n\n  return (\n    <div data-p0=\"catalog-search\" className={cn(\"pz:relative\", classNames?.searchInputContainer)}>\n      <SearchIcon className=\"pz:absolute pz:left-2.5 pz:top-1/2 pz:-translate-y-1/2 pz:size-4 pz:text-muted-foreground pz:pointer-events-none\" />\n      <Input\n        type=\"search\"\n        placeholder={placeholder}\n        value={globalFilterInput}\n        onChange={(e) => setGlobalFilterInput(e.target.value)}\n        className={cn(\"pz:pl-8\", classNames?.searchInput, className)}\n      />\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;AAoBA,SAAgB,wBAAwB,EACtC,cAAc,mBACd,WACA,UAC+B;CAC/B,MAAM,EAAE,mBAAmB,yBAAyB,uBAAuB;CAC3E,MAAM,EAAE,eAAe,kBAAkB;CACzC,MAAM,WAAW,CAAC,CAAC;AAEnB,KAAI,OACF,QAAO,WAAW;EAChB,gBAAgB;EAChB;EACA,OAAO;GACL,OAAO;GACP,UAAU;GACV;GACD;EACD,OAAO;GACL,MAAM;GACN;GACA,OAAO;GACP,WAAW,MAAqC,qBAAqB,EAAE,OAAO,MAAM;GACpF,eAAe,WAAW,KAAK;GAC/B,WAAW,GAAG,YAAY,aAAa,UAAU;GAClD;EACF,CAAC;AAGJ,QACE,qBAAC,OAAD;EAAK,WAAQ;EAAiB,WAAW,GAAG,eAAe,YAAY,qBAAqB;YAA5F,CACE,oBAACA,QAAD,EAAY,WAAU,oHAAqH,GAC3I,oBAAC,OAAD;GACE,MAAK;GACQ;GACb,OAAO;GACP,WAAW,MAAM,qBAAqB,EAAE,OAAO,MAAM;GACrD,WAAW,GAAG,WAAW,YAAY,aAAa,UAAU;GAC5D,EACE"}
+{"version":3,"file":"search-filter.mjs","names":["SearchIcon"],"sources":["../../../../src/components/compound/pipe-catalog/search-filter.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { Search as SearchIcon } from \"lucide-react\";\nimport type { ChangeEvent } from \"react\";\nimport { useCatalogConfig } from \"../../../context/catalog-config-context.js\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport { Input } from \"../../ui/input.js\";\n\nexport interface PipeCatalogSearchFilterState {\n  value: string;\n  setValue: (value: string) => void;\n  isActive: boolean;\n}\n\nexport interface PipeCatalogSearchFilterProps\n  extends useRender.ComponentProps<\"input\", PipeCatalogSearchFilterState> {\n  placeholder?: string;\n}\n\nexport function PipeCatalogSearchFilter({\n  placeholder = \"Search pipes...\",\n  className,\n  render,\n  ...props\n}: PipeCatalogSearchFilterProps) {\n  const { globalFilterInput, setGlobalFilterInput } = usePipeCatalogContext();\n  const { classNames } = useCatalogConfig();\n  const isActive = !!globalFilterInput;\n\n  const inputElement = useRender({\n    defaultTagName: \"input\",\n    render,\n    state: { value: globalFilterInput, setValue: setGlobalFilterInput, isActive },\n    stateAttributesMapping: {\n      setValue: () => null,\n    },\n    props: mergeProps<\"input\">(\n      {\n        type: \"search\",\n        placeholder,\n        value: globalFilterInput,\n        onChange: (e: ChangeEvent<HTMLInputElement>) => setGlobalFilterInput(e.target.value),\n        className: render ? cn(classNames?.searchInput, className) : undefined,\n      },\n      props,\n    ),\n  });\n\n  if (render) return inputElement;\n\n  return (\n    <div data-p0=\"catalog-search\" className={cn(\"pz:relative\", classNames?.searchInputContainer)}>\n      <SearchIcon className=\"pz:absolute pz:left-2.5 pz:top-1/2 pz:-translate-y-1/2 pz:size-4 pz:text-muted-foreground pz:pointer-events-none\" />\n      <Input\n        type=\"search\"\n        placeholder={placeholder}\n        value={globalFilterInput}\n        onChange={(e) => setGlobalFilterInput(e.target.value)}\n        className={cn(\"pz:pl-8\", classNames?.searchInput, className)}\n      />\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;AAoBA,SAAgB,wBAAwB,EACtC,cAAc,mBACd,WACA,QACA,GAAG,SAC4B;CAC/B,MAAM,EAAE,mBAAmB,yBAAyB,uBAAuB;CAC3E,MAAM,EAAE,eAAe,kBAAkB;CAGzC,MAAM,eAAe,UAAU;EAC7B,gBAAgB;EAChB;EACA,OAAO;GAAE,OAAO;GAAmB,UAAU;GAAsB,UALpD,CAAC,CAAC;GAK4D;EAC7E,wBAAwB,EACtB,gBAAgB,MACjB;EACD,OAAO,WACL;GACE,MAAM;GACN;GACA,OAAO;GACP,WAAW,MAAqC,qBAAqB,EAAE,OAAO,MAAM;GACpF,WAAW,SAAS,GAAG,YAAY,aAAa,UAAU,GAAG;GAC9D,EACD,MACD;EACF,CAAC;AAEF,KAAI,OAAQ,QAAO;AAEnB,QACE,qBAAC,OAAD;EAAK,WAAQ;EAAiB,WAAW,GAAG,eAAe,YAAY,qBAAqB;YAA5F,CACE,oBAACA,QAAD,EAAY,WAAU,oHAAqH,GAC3I,oBAAC,OAAD;GACE,MAAK;GACQ;GACb,OAAO;GACP,WAAW,MAAM,qBAAqB,EAAE,OAAO,MAAM;GACrD,WAAW,GAAG,WAAW,YAAY,aAAa,UAAU;GAC5D,EACE"}

package/dist/components/compound/pipe-catalog/tag-filter.d.mts

@@ -1,7 +1,7 @@
-import { RenderProp } from "../../../utils/render-slot.mjs";
 import { FilterSelectOption } from "../../defaults/catalog/filter-select.mjs";
 import { ColumnFilterState } from "./column-filter.mjs";
-import { ComponentProps, ReactNode } from "react";
+import { useRender } from "@base-ui/react/use-render";
+import { ReactNode } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/compound/pipe-catalog/tag-filter.d.ts
@@ -9,7 +9,7 @@ interface PipeCatalogTagFilterProps {
   options?: ReadonlyArray<FilterSelectOption>;
   placeholder?: ReactNode;
   className?: string;
-  render?: RenderProp<ComponentProps<"div">, ColumnFilterState>;
+  render?: useRender.ComponentProps<"div", ColumnFilterState>["render"];
 }
 declare function PipeCatalogTagFilter({
   options,

package/dist/components/compound/pipe-catalog/tag-filter.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"tag-filter.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/tag-filter.tsx"],"mappings":";;;;;;;UAMiB,yBAAA;EACf,OAAA,GAAU,aAAA,CAAc,kBAAA;EACxB,WAAA,GAAc,SAAA;EACd,SAAA;EACA,MAAA,GAAS,UAAA,CAAW,cAAA,SAAuB,iBAAA;AAAA;AAAA,iBAS7B,oBAAA,CAAA;EACd,OAAA;EACA,WAAA;EACA,SAAA;EACA;AAAA,GACC,yBAAA,GAAyB,oBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"tag-filter.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/tag-filter.tsx"],"mappings":";;;;;;;UAMiB,yBAAA;EACf,OAAA,GAAU,aAAA,CAAc,kBAAA;EACxB,WAAA,GAAc,SAAA;EACd,SAAA;EACA,MAAA,GAAS,SAAA,CAAU,cAAA,QAAsB,iBAAA;AAAA;AAAA,iBAS3B,oBAAA,CAAA;EACd,OAAA;EACA,WAAA;EACA,SAAA;EACA;AAAA,GACC,yBAAA,GAAyB,oBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/compound/pipe-catalog/tag-filter.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tag-filter.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/tag-filter.tsx"],"sourcesContent":["import { Tag } from \"lucide-react\";\nimport type { ComponentProps, ReactNode } from \"react\";\nimport type { RenderProp } from \"../../../utils/render-slot.js\";\nimport type { FilterSelectOption } from \"../../defaults/catalog/filter-select.js\";\nimport { type ColumnFilterState, PipeCatalogColumnFilter } from \"./column-filter.js\";\n\nexport interface PipeCatalogTagFilterProps {\n  options?: ReadonlyArray<FilterSelectOption>;\n  placeholder?: ReactNode;\n  className?: string;\n  render?: RenderProp<ComponentProps<\"div\">, ColumnFilterState>;\n}\n\nconst DEFAULT_PLACEHOLDER = (\n  <span className=\"pz:inline-flex pz:items-center pz:gap-1.5\">\n    <Tag className=\"pz:size-4\" /> Tag\n  </span>\n);\n\nexport function PipeCatalogTagFilter({\n  options,\n  placeholder = DEFAULT_PLACEHOLDER,\n  className,\n  render,\n}: PipeCatalogTagFilterProps) {\n  return (\n    <PipeCatalogColumnFilter\n      id=\"tags\"\n      placeholder={placeholder}\n      options={options}\n      className={className}\n      render={render}\n    />\n  );\n}\n"],"mappings":";;;;;AAaA,MAAM,sBACJ,qBAAC,QAAD;CAAM,WAAU;WAAhB,CACE,oBAAC,KAAD,EAAK,WAAU,aAAc,UACxB;;AAGT,SAAgB,qBAAqB,EACnC,SACA,cAAc,qBACd,WACA,UAC4B;AAC5B,QACE,oBAAC,yBAAD;EACE,IAAG;EACU;EACJ;EACE;EACH;EACR"}
+{"version":3,"file":"tag-filter.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/tag-filter.tsx"],"sourcesContent":["import { useRender } from \"@base-ui/react/use-render\";\nimport { Tag } from \"lucide-react\";\nimport type { ReactNode } from \"react\";\nimport type { FilterSelectOption } from \"../../defaults/catalog/filter-select.js\";\nimport { type ColumnFilterState, PipeCatalogColumnFilter } from \"./column-filter.js\";\n\nexport interface PipeCatalogTagFilterProps {\n  options?: ReadonlyArray<FilterSelectOption>;\n  placeholder?: ReactNode;\n  className?: string;\n  render?: useRender.ComponentProps<\"div\", ColumnFilterState>[\"render\"];\n}\n\nconst DEFAULT_PLACEHOLDER = (\n  <span className=\"pz:inline-flex pz:items-center pz:gap-1.5\">\n    <Tag className=\"pz:size-4\" /> Tag\n  </span>\n);\n\nexport function PipeCatalogTagFilter({\n  options,\n  placeholder = DEFAULT_PLACEHOLDER,\n  className,\n  render,\n}: PipeCatalogTagFilterProps) {\n  return (\n    <PipeCatalogColumnFilter\n      id=\"tags\"\n      placeholder={placeholder}\n      options={options}\n      className={className}\n      render={render}\n    />\n  );\n}\n"],"mappings":";;;;;AAaA,MAAM,sBACJ,qBAAC,QAAD;CAAM,WAAU;WAAhB,CACE,oBAAC,KAAD,EAAK,WAAU,aAAc,UACxB;;AAGT,SAAgB,qBAAqB,EACnC,SACA,cAAc,qBACd,WACA,UAC4B;AAC5B,QACE,oBAAC,yBAAD;EACE,IAAG;EACU;EACJ;EACE;EACH;EACR"}