fix: export ui spec

.changeset/chilly-meals-search.md

@@ -0,0 +1,5 @@
+---
+"@fn-sphere/filter": patch
+---
+
+export UiSpec

.changeset/config.json

@@ -3,9 +3,13 @@
   "changelog": "@changesets/cli/changelog",
   "commit": false,
   "fixed": [],
-  "linked": [],
+  "linked": [
+    [
+      "@fn-sphere/*"
+    ]
+  ],
   "access": "restricted",
   "baseBranch": "main",
   "updateInternalDependencies": "patch",
   "ignore": []
-}
+}

packages/filter/src/filter-builder.tsx

@@ -1,6 +1,8 @@
 import type { LooseFilterGroup } from "@fn-sphere/core";
 import { FilterProvider } from "./hooks/filter-provider.js";
 import { useView } from "./specs/hooks.js";
+import { FilterUiProvider, presetUiSpec } from "./specs/index.js";
+import type { UiSpec } from "./specs/types.js";
 import type { BasicFilterProps } from "./types.js";
 
 export const FilterBuilder = <Data,>({
@@ -11,25 +13,39 @@ export const FilterBuilder = <Data,>({
   mapFieldName,
   mapFilterName,
   deepLimit,
+  uiSpec,
 }: {
   rule: LooseFilterGroup;
   onRuleChange?: (rule: LooseFilterGroup) => void;
+  uiSpec: UiSpec;
 } & BasicFilterProps<Data>) => {
   const FilterGroup = useView("FilterGroup");
+
+  const normalizedSchema = {
+    dataInputViews: [
+      ...(uiSpec.dataInputViews ?? []),
+      ...presetUiSpec.dataInputViews,
+    ],
+    views: { ...presetUiSpec.views, ...uiSpec.views },
+    primitives: { ...presetUiSpec.primitives, ...uiSpec.primitives },
+  };
+
   return (
-    <FilterProvider
-      value={{
-        schema,
-        filterList,
-        filterRule: rule,
-        onRuleChange,
+    <FilterUiProvider spec={normalizedSchema}>
+      <FilterProvider
+        value={{
+          schema,
+          filterList,
+          filterRule: rule,
+          onRuleChange,
 
-        mapFieldName,
-        mapFilterName,
-        deepLimit,
-      }}
-    >
-      <FilterGroup rule={rule} />
-    </FilterProvider>
+          mapFieldName,
+          mapFilterName,
+          deepLimit,
+        }}
+      >
+        <FilterGroup rule={rule} />
+      </FilterProvider>
+    </FilterUiProvider>
   );
 };

packages/filter/src/index.ts

@@ -12,3 +12,5 @@ export {
 } from "./utils.js";
 
 export type { BasicFilterProps } from "./types.js";
+
+export * from "./specs/index.js";

packages/filter/src/specs/context.tsx

@@ -1,15 +1,15 @@
 import { createContext, type ReactNode } from "react";
-import { presetSpec } from "./preset.js";
-import type { uiSpec } from "./types.js";
+import { presetUiSpec } from "./preset.js";
+import type { UiSpec } from "./types.js";
 
-export const ViewContext = createContext<uiSpec>(presetSpec);
+export const ViewContext = createContext<UiSpec>(presetUiSpec);
 
-export const FilterViewProvider = ({
-  specs,
+export const FilterUiProvider = ({
+  spec,
   children,
 }: {
-  specs: uiSpec;
+  spec: UiSpec;
   children: ReactNode;
 }) => {
-  return <ViewContext.Provider value={specs}>{children}</ViewContext.Provider>;
+  return <ViewContext.Provider value={spec}>{children}</ViewContext.Provider>;
 };

packages/filter/src/specs/hooks.tsx

@@ -2,16 +2,16 @@ import { isSameType } from "@fn-sphere/core";
 import { useContext, type ComponentType } from "react";
 import { z } from "zod";
 import { ViewContext } from "./context.js";
-import type { DataInputViewProps, uiSpec } from "./types.js";
+import type { DataInputViewProps, UiSpec } from "./types.js";
 
-export const usePrimitives = <T extends keyof uiSpec["primitives"]>(
+export const usePrimitives = <T extends keyof UiSpec["primitives"]>(
   view: T,
 ) => {
   const specs = useContext(ViewContext);
   return specs.primitives[view];
 };
 
-export const useView = <T extends keyof uiSpec["views"]>(view: T) => {
+export const useView = <T extends keyof UiSpec["views"]>(view: T) => {
   const specs = useContext(ViewContext);
   return specs.views[view];
 };

packages/filter/src/specs/index.ts

@@ -1,3 +1,3 @@
-export { FilterViewProvider } from "./context.js";
+export { FilterUiProvider } from "./context.js";
 export { useDataInputView, useView } from "./hooks.js";
-export { presetDataInputSpecs, presetSpec } from "./preset.js";
+export { presetDataInputSpecs, presetUiSpec } from "./preset.js";

packages/filter/src/specs/preset.tsx

@@ -12,7 +12,7 @@ import { FilterGroup } from "../filter-group.js";
 import { FilterRule } from "../filter-rule/index.js";
 import { usePrimitives, useView } from "./hooks.js";
 import { primitives } from "./primitives.js";
-import type { DataInputViewSpec, SelectProps, uiSpec } from "./types.js";
+import type { DataInputViewSpec, SelectProps, UiSpec } from "./types.js";
 
 export const presetDataInputSpecs: DataInputViewSpec[] = [
   {
@@ -220,7 +220,7 @@ const FilterGroupContainer = ({
   );
 };
 
-export const presetSpec: uiSpec = {
+export const presetUiSpec: UiSpec = {
   // primitive
   primitives,
   views: {
@@ -236,4 +236,4 @@ export const presetSpec: uiSpec = {
   },
 
   dataInputViews: presetDataInputSpecs,
-} satisfies uiSpec;
+} satisfies UiSpec;

packages/filter/src/specs/types.ts

@@ -31,7 +31,7 @@ export type SelectProps<T> = Omit<
   onChange?: (value: T) => void;
 };
 
-export type uiSpec = {
+export type UiSpec = {
   primitives: {
     button: ComponentType<
       ButtonHTMLAttributes<HTMLButtonElement> & RefAttributes<HTMLButtonElement>