fix: update filter group container to use 'rule' instead of 'filterGr…

…oup'

.changeset/purple-impalas-move.md

@@ -0,0 +1,9 @@
+---
+"@fn-sphere/filter": minor
+"@fn-sphere/theme-mui-material": patch
+---
+
+Breaking Changes
+
+- Renamed `filterGroup` prop to `rule` in FilterGroupContainer.
+- Modified `filterTheme` in theme-mui-material to use `rule` instead of `filterGroup`.

packages/filter/src/views/filter-group-container.tsx

@@ -5,12 +5,12 @@ import { useRootRule } from "../hooks/use-root-rule.js";
 import { useView } from "../theme/hooks.js";
 
 export type FilterGroupContainerProps = {
-  filterGroup: FilterGroup;
+  rule: FilterGroup;
   children?: ReactNode;
 };
 
 export const FilterGroupContainer = ({
-  filterGroup,
+  rule,
   children,
 }: FilterGroupContainerProps) => {
   const { getLocaleText } = useRootRule();
@@ -20,11 +20,11 @@ export const FilterGroupContainer = ({
     appendChildRule,
     appendChildGroup,
     removeGroup,
-  } = useFilterGroup(filterGroup);
+  } = useFilterGroup(rule);
   const { Button } = useView("components");
 
   const text =
-    filterGroup.op === "or"
+    rule.op === "or"
       ? getLocaleText("operatorOr")
       : getLocaleText("operatorAnd");
 

packages/filter/src/views/filter-group.tsx

@@ -14,7 +14,7 @@ export const FilterGroupView = ({ rule: filterGroup }: FilterGroupProps) => {
   } = useView("templates");
 
   return (
-    <FilterGroupContainer filterGroup={filterGroup}>
+    <FilterGroupContainer rule={filterGroup}>
       {filterGroup.conditions.map((childRule, groupIdx) => {
         return (
           <Fragment key={childRule.id}>

packages/theme-mui-material/src/theme.tsx

@@ -114,17 +114,17 @@ export const filterTheme = createFilterTheme({
     },
   },
   templates: {
-    FilterGroupContainer: ({ filterGroup, children }) => {
+    FilterGroupContainer: ({ rule, children }) => {
       const { getLocaleText } = useRootRule();
       const {
         ruleState: { isRoot, depth },
         toggleGroupOp,
         appendChildRule,
         appendChildGroup,
-      } = useFilterGroup(filterGroup);
+      } = useFilterGroup(rule);
 
       const text =
-        filterGroup.op === "or"
+        rule.op === "or"
           ? getLocaleText("operatorOr")
           : getLocaleText("operatorAnd");