@accelint/design-toolkit 9.3.0 → 9.4.0

package/dist/components/popover/types.d.ts

@@ -14,12 +14,22 @@ import { ComponentPropsWithRef } from "react";
 import { DialogProps, DialogTriggerProps, PopoverProps as PopoverProps$1 } from "react-aria-components";
 
 //#region src/components/popover/types.d.ts
+/**
+ * Props for the PopoverTrigger component.
+ */
 type PopoverTriggerProps = ComponentPropsWithRef<'div'> & DialogTriggerProps;
+/**
+ * Props for the Popover component.
+ */
 type PopoverProps = Omit<PopoverProps$1, 'children' | 'className'> & Pick<DialogProps, 'children'> & {
+  /** CSS class names for popover elements. */
   classNames?: {
+    /** Class name for the popover container. */
     popover?: PopoverProps$1['className'];
+    /** Class name for the dialog content. */
     dialog?: DialogProps['className'];
   };
+  /** Additional props passed to the Dialog component. */
   dialogProps?: Omit<DialogProps, 'children' | 'className'>;
 };
 //#endregion

package/dist/components/query-builder/action-element.d.ts

@@ -11,16 +11,34 @@
  */
 
 import "client-only";
-import * as react_jsx_runtime181 from "react/jsx-runtime";
+import * as react_jsx_runtime116 from "react/jsx-runtime";
 import { ActionProps } from "react-querybuilder";
 
 //#region src/components/query-builder/action-element.d.ts
+
+/**
+ * ActionElement - Base button component for rule and group actions
+ *
+ * Renders a text-labeled button with support for disabled state translations.
+ *
+ * @example
+ * ```tsx
+ * <ActionElement
+ *   title="Add Rule"
+ *   handleOnClick={() => console.log('clicked')}
+ *   disabled={false}
+ * />
+ * ```
+ *
+ * @param props - ActionProps from react-querybuilder.
+ * @returns The rendered ActionElement button.
+ */
 declare function ActionElement({
   disabled,
   disabledTranslation,
   title: titleProp,
   handleOnClick
-}: ActionProps): react_jsx_runtime181.JSX.Element;
+}: ActionProps): react_jsx_runtime116.JSX.Element;
 //#endregion
 export { ActionElement };
 //# sourceMappingURL=action-element.d.ts.map

package/dist/components/query-builder/action-element.js

@@ -19,6 +19,23 @@ import { useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/query-builder/action-element.tsx
+/**
+* ActionElement - Base button component for rule and group actions
+*
+* Renders a text-labeled button with support for disabled state translations.
+*
+* @example
+* ```tsx
+* <ActionElement
+*   title="Add Rule"
+*   handleOnClick={() => console.log('clicked')}
+*   disabled={false}
+* />
+* ```
+*
+* @param props - ActionProps from react-querybuilder.
+* @returns The rendered ActionElement button.
+*/
 function ActionElement({ disabled, disabledTranslation, title: titleProp, handleOnClick }) {
 	const title = useMemo(() => disabledTranslation?.title && disabled ? disabledTranslation.title : titleProp, [
 		disabledTranslation?.title,

package/dist/components/query-builder/action-element.js.map

@@ -1 +1 @@
-{"version":3,"file":"action-element.js","names":[],"sources":["../../../src/components/query-builder/action-element.tsx"],"sourcesContent":["// __private-exports\n/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { useMemo } from 'react';\nimport { Button } from '../button';\nimport type { ActionProps } from 'react-querybuilder';\n\nexport function ActionElement({\n  disabled,\n  disabledTranslation,\n  title: titleProp,\n  handleOnClick,\n}: ActionProps) {\n  const title = useMemo(\n    () =>\n      disabledTranslation?.title && disabled\n        ? disabledTranslation.title\n        : titleProp,\n    [disabledTranslation?.title, disabled, titleProp],\n  );\n\n  return (\n    <Button\n      isDisabled={disabled && !disabledTranslation}\n      onPress={() => handleOnClick()}\n      size='small'\n      variant='outline'\n    >\n      {title}\n    </Button>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAmBA,SAAgB,cAAc,EAC5B,UACA,qBACA,OAAO,WACP,iBACc;CACd,MAAM,QAAQ,cAEV,qBAAqB,SAAS,WAC1B,oBAAoB,QACpB,WACN;EAAC,qBAAqB;EAAO;EAAU;EAAU,CAClD;AAED,QACE,oBAAC;EACC,YAAY,YAAY,CAAC;EACzB,eAAe,eAAe;EAC9B,MAAK;EACL,SAAQ;YAEP;GACM"}
+{"version":3,"file":"action-element.js","names":[],"sources":["../../../src/components/query-builder/action-element.tsx"],"sourcesContent":["// __private-exports\n/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { useMemo } from 'react';\nimport { Button } from '../button';\nimport type { ActionProps } from 'react-querybuilder';\n\n/**\n * ActionElement - Base button component for rule and group actions\n *\n * Renders a text-labeled button with support for disabled state translations.\n *\n * @example\n * ```tsx\n * <ActionElement\n *   title=\"Add Rule\"\n *   handleOnClick={() => console.log('clicked')}\n *   disabled={false}\n * />\n * ```\n *\n * @param props - ActionProps from react-querybuilder.\n * @returns The rendered ActionElement button.\n */\nexport function ActionElement({\n  disabled,\n  disabledTranslation,\n  title: titleProp,\n  handleOnClick,\n}: ActionProps) {\n  const title = useMemo(\n    () =>\n      disabledTranslation?.title && disabled\n        ? disabledTranslation.title\n        : titleProp,\n    [disabledTranslation?.title, disabled, titleProp],\n  );\n\n  return (\n    <Button\n      isDisabled={disabled && !disabledTranslation}\n      onPress={() => handleOnClick()}\n      size='small'\n      variant='outline'\n    >\n      {title}\n    </Button>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,SAAgB,cAAc,EAC5B,UACA,qBACA,OAAO,WACP,iBACc;CACd,MAAM,QAAQ,cAEV,qBAAqB,SAAS,WAC1B,oBAAoB,QACpB,WACN;EAAC,qBAAqB;EAAO;EAAU;EAAU,CAClD;AAED,QACE,oBAAC;EACC,YAAY,YAAY,CAAC;EACzB,eAAe,eAAe;EAC9B,MAAK;EACL,SAAQ;YAEP;GACM"}

package/dist/components/query-builder/actions.d.ts

@@ -11,25 +11,58 @@
  */
 
 import "client-only";
-import * as react_jsx_runtime183 from "react/jsx-runtime";
+import * as react_jsx_runtime118 from "react/jsx-runtime";
 import { ActionProps } from "react-querybuilder";
 
 //#region src/components/query-builder/actions.d.ts
+/**
+ * Delete button for removing rules or groups
+ *
+ * @example
+ * ```tsx
+ * <RemoveRuleAction handleOnClick={() => console.log('remove')} />
+ * ```
+ *
+ * @param props - ActionProps from react-querybuilder.
+ * @returns The rendered RemoveRuleAction button.
+ */
 declare function RemoveRuleAction({
   handleOnClick,
   className,
   ...rest
-}: ActionProps): react_jsx_runtime183.JSX.Element;
+}: ActionProps): react_jsx_runtime118.JSX.Element;
+/**
+ * Lock/unlock toggle button for rules or groups
+ *
+ * @example
+ * ```tsx
+ * <LockAction handleOnClick={() => console.log('lock toggled')} />
+ * ```
+ *
+ * @param props - ActionProps from react-querybuilder.
+ * @returns The rendered LockAction button.
+ */
 declare function LockAction({
   handleOnClick,
   className,
   ...rest
-}: ActionProps): react_jsx_runtime183.JSX.Element;
+}: ActionProps): react_jsx_runtime118.JSX.Element;
+/**
+ * Duplicate button for cloning rules or groups
+ *
+ * @example
+ * ```tsx
+ * <CloneAction handleOnClick={() => console.log('clone')} />
+ * ```
+ *
+ * @param props - ActionProps from react-querybuilder.
+ * @returns The rendered CloneAction button.
+ */
 declare function CloneAction({
   handleOnClick,
   className,
   ...rest
-}: ActionProps): react_jsx_runtime183.JSX.Element;
+}: ActionProps): react_jsx_runtime118.JSX.Element;
 //#endregion
 export { CloneAction, LockAction, RemoveRuleAction };
 //# sourceMappingURL=actions.d.ts.map

package/dist/components/query-builder/actions.js

@@ -17,9 +17,22 @@ import { Icon } from "../icon/index.js";
 import { Button } from "../button/index.js";
 import "client-only";
 import { jsx } from "react/jsx-runtime";
-import { Delete, Duplicate, LockFill } from "@accelint/icons";
+import Delete from "@accelint/icons/delete";
+import Duplicate from "@accelint/icons/duplicate";
+import LockFill from "@accelint/icons/lock-fill";
 
 //#region src/components/query-builder/actions.tsx
+/**
+* Delete button for removing rules or groups
+*
+* @example
+* ```tsx
+* <RemoveRuleAction handleOnClick={() => console.log('remove')} />
+* ```
+*
+* @param props - ActionProps from react-querybuilder.
+* @returns The rendered RemoveRuleAction button.
+*/
 function RemoveRuleAction({ handleOnClick, className, ...rest }) {
 	return /* @__PURE__ */ jsx(Button, {
 		size: "small",
@@ -30,6 +43,17 @@ function RemoveRuleAction({ handleOnClick, className, ...rest }) {
 		children: /* @__PURE__ */ jsx(Icon, { children: /* @__PURE__ */ jsx(Delete, {}) })
 	});
 }
+/**
+* Lock/unlock toggle button for rules or groups
+*
+* @example
+* ```tsx
+* <LockAction handleOnClick={() => console.log('lock toggled')} />
+* ```
+*
+* @param props - ActionProps from react-querybuilder.
+* @returns The rendered LockAction button.
+*/
 function LockAction({ handleOnClick, className, ...rest }) {
 	return /* @__PURE__ */ jsx(Button, {
 		size: "small",
@@ -40,6 +64,17 @@ function LockAction({ handleOnClick, className, ...rest }) {
 		children: /* @__PURE__ */ jsx(Icon, { children: /* @__PURE__ */ jsx(LockFill, {}) })
 	});
 }
+/**
+* Duplicate button for cloning rules or groups
+*
+* @example
+* ```tsx
+* <CloneAction handleOnClick={() => console.log('clone')} />
+* ```
+*
+* @param props - ActionProps from react-querybuilder.
+* @returns The rendered CloneAction button.
+*/
 function CloneAction({ handleOnClick, className, ...rest }) {
 	return /* @__PURE__ */ jsx(Button, {
 		size: "small",

package/dist/components/query-builder/actions.js.map

@@ -1 +1 @@
-{"version":3,"file":"actions.js","names":[],"sources":["../../../src/components/query-builder/actions.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { Delete, Duplicate, LockFill } from '@accelint/icons';\nimport { Button } from '../button';\nimport { Icon } from '../icon';\nimport type { ActionProps } from 'react-querybuilder';\n\nexport function RemoveRuleAction({\n  handleOnClick,\n  className,\n  ...rest\n}: ActionProps) {\n  return (\n    <Button\n      size='small'\n      variant='icon'\n      onPress={() => handleOnClick()}\n      className={className}\n      {...rest}\n    >\n      <Icon>\n        <Delete />\n      </Icon>\n    </Button>\n  );\n}\n\nexport function LockAction({ handleOnClick, className, ...rest }: ActionProps) {\n  return (\n    <Button\n      size='small'\n      variant='icon'\n      onPress={() => handleOnClick()}\n      className={className}\n      {...rest}\n    >\n      <Icon>\n        <LockFill />\n      </Icon>\n    </Button>\n  );\n}\n\nexport function CloneAction({\n  handleOnClick,\n  className,\n  ...rest\n}: ActionProps) {\n  return (\n    <Button\n      size='small'\n      variant='icon'\n      onPress={() => handleOnClick()}\n      className={className}\n      {...rest}\n    >\n      <Icon>\n        <Duplicate />\n      </Icon>\n    </Button>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAmBA,SAAgB,iBAAiB,EAC/B,eACA,WACA,GAAG,QACW;AACd,QACE,oBAAC;EACC,MAAK;EACL,SAAQ;EACR,eAAe,eAAe;EACnB;EACX,GAAI;YAEJ,oBAAC,kBACC,oBAAC,WAAS,GACL;GACA;;AAIb,SAAgB,WAAW,EAAE,eAAe,WAAW,GAAG,QAAqB;AAC7E,QACE,oBAAC;EACC,MAAK;EACL,SAAQ;EACR,eAAe,eAAe;EACnB;EACX,GAAI;YAEJ,oBAAC,kBACC,oBAAC,aAAW,GACP;GACA;;AAIb,SAAgB,YAAY,EAC1B,eACA,WACA,GAAG,QACW;AACd,QACE,oBAAC;EACC,MAAK;EACL,SAAQ;EACR,eAAe,eAAe;EACnB;EACX,GAAI;YAEJ,oBAAC,kBACC,oBAAC,cAAY,GACR;GACA"}
+{"version":3,"file":"actions.js","names":[],"sources":["../../../src/components/query-builder/actions.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\n\nimport Delete from '@accelint/icons/delete';\nimport Duplicate from '@accelint/icons/duplicate';\nimport LockFill from '@accelint/icons/lock-fill';\nimport { Button } from '../button';\nimport { Icon } from '../icon';\nimport type { ActionProps } from 'react-querybuilder';\n\n/**\n * Delete button for removing rules or groups\n *\n * @example\n * ```tsx\n * <RemoveRuleAction handleOnClick={() => console.log('remove')} />\n * ```\n *\n * @param props - ActionProps from react-querybuilder.\n * @returns The rendered RemoveRuleAction button.\n */\nexport function RemoveRuleAction({\n  handleOnClick,\n  className,\n  ...rest\n}: ActionProps) {\n  return (\n    <Button\n      size='small'\n      variant='icon'\n      onPress={() => handleOnClick()}\n      className={className}\n      {...rest}\n    >\n      <Icon>\n        <Delete />\n      </Icon>\n    </Button>\n  );\n}\n\n/**\n * Lock/unlock toggle button for rules or groups\n *\n * @example\n * ```tsx\n * <LockAction handleOnClick={() => console.log('lock toggled')} />\n * ```\n *\n * @param props - ActionProps from react-querybuilder.\n * @returns The rendered LockAction button.\n */\nexport function LockAction({ handleOnClick, className, ...rest }: ActionProps) {\n  return (\n    <Button\n      size='small'\n      variant='icon'\n      onPress={() => handleOnClick()}\n      className={className}\n      {...rest}\n    >\n      <Icon>\n        <LockFill />\n      </Icon>\n    </Button>\n  );\n}\n\n/**\n * Duplicate button for cloning rules or groups\n *\n * @example\n * ```tsx\n * <CloneAction handleOnClick={() => console.log('clone')} />\n * ```\n *\n * @param props - ActionProps from react-querybuilder.\n * @returns The rendered CloneAction button.\n */\nexport function CloneAction({\n  handleOnClick,\n  className,\n  ...rest\n}: ActionProps) {\n  return (\n    <Button\n      size='small'\n      variant='icon'\n      onPress={() => handleOnClick()}\n      className={className}\n      {...rest}\n    >\n      <Icon>\n        <Duplicate />\n      </Icon>\n    </Button>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCA,SAAgB,iBAAiB,EAC/B,eACA,WACA,GAAG,QACW;AACd,QACE,oBAAC;EACC,MAAK;EACL,SAAQ;EACR,eAAe,eAAe;EACnB;EACX,GAAI;YAEJ,oBAAC,kBACC,oBAAC,WAAS,GACL;GACA;;;;;;;;;;;;;AAeb,SAAgB,WAAW,EAAE,eAAe,WAAW,GAAG,QAAqB;AAC7E,QACE,oBAAC;EACC,MAAK;EACL,SAAQ;EACR,eAAe,eAAe;EACnB;EACX,GAAI;YAEJ,oBAAC,kBACC,oBAAC,aAAW,GACP;GACA;;;;;;;;;;;;;AAeb,SAAgB,YAAY,EAC1B,eACA,WACA,GAAG,QACW;AACd,QACE,oBAAC;EACC,MAAK;EACL,SAAQ;EACR,eAAe,eAAe;EACnB;EACX,GAAI;YAEJ,oBAAC,kBACC,oBAAC,cAAY,GACR;GACA"}

package/dist/components/query-builder/combinator-selector.d.ts

@@ -11,15 +11,23 @@
  */
 
 import "client-only";
-import * as react_jsx_runtime188 from "react/jsx-runtime";
+import * as react_jsx_runtime117 from "react/jsx-runtime";
 import { CombinatorSelectorProps } from "react-querybuilder";
 
 //#region src/components/query-builder/combinator-selector.d.ts
+/**
+ * CombinatorSelector - AND/OR toggle for rule groups
+ *
+ * Renders a radio group with tooltips explaining each combinator's behavior.
+ *
+ * @param props - CombinatorSelectorProps from react-querybuilder.
+ * @returns The rendered CombinatorSelector component.
+ */
 declare function CombinatorSelector({
   options,
   value,
   handleOnChange
-}: CombinatorSelectorProps): react_jsx_runtime188.JSX.Element;
+}: CombinatorSelectorProps): react_jsx_runtime117.JSX.Element;
 //#endregion
 export { CombinatorSelector };
 //# sourceMappingURL=combinator-selector.d.ts.map

package/dist/components/query-builder/combinator-selector.js

@@ -26,6 +26,14 @@ const operatorDescriptions = {
 	AND: "All rules below must be true for a match",
 	OR: "One of the rules below must be true for a match"
 };
+/**
+* CombinatorSelector - AND/OR toggle for rule groups
+*
+* Renders a radio group with tooltips explaining each combinator's behavior.
+*
+* @param props - CombinatorSelectorProps from react-querybuilder.
+* @returns The rendered CombinatorSelector component.
+*/
 function CombinatorSelector({ options, value, handleOnChange }) {
 	return /* @__PURE__ */ jsxs(RadioGroup, {
 		value,

package/dist/components/query-builder/combinator-selector.js.map

@@ -1 +1 @@
-{"version":3,"file":"combinator-selector.js","names":["operatorDescriptions: Record<string, string>"],"sources":["../../../src/components/query-builder/combinator-selector.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { Label } from '../label';\nimport { Radio } from '../radio';\nimport { RadioGroup } from '../radio/group';\nimport { Tooltip } from '../tooltip';\nimport { TooltipTrigger } from '../tooltip/trigger';\nimport type { CombinatorSelectorProps } from 'react-querybuilder';\n\nconst operatorDescriptions: Record<string, string> = {\n  AND: 'All rules below must be true for a match',\n  OR: 'One of the rules below must be true for a match',\n};\n\nexport function CombinatorSelector({\n  options,\n  value,\n  handleOnChange,\n}: CombinatorSelectorProps) {\n  return (\n    <RadioGroup\n      value={value}\n      onChange={handleOnChange}\n      orientation='horizontal'\n      style={{ flexWrap: 'nowrap' }}\n    >\n      <Label>Combinator</Label>\n      {options.map((option) => (\n        <Radio key={option.label} value={option.label}>\n          <TooltipTrigger>\n            <button type='button'>{option.label}</button>\n            <Tooltip placement='top'>\n              {operatorDescriptions[option.label]}\n            </Tooltip>\n          </TooltipTrigger>\n        </Radio>\n      ))}\n    </RadioGroup>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAqBA,MAAMA,uBAA+C;CACnD,KAAK;CACL,IAAI;CACL;AAED,SAAgB,mBAAmB,EACjC,SACA,OACA,kBAC0B;AAC1B,QACE,qBAAC;EACQ;EACP,UAAU;EACV,aAAY;EACZ,OAAO,EAAE,UAAU,UAAU;aAE7B,oBAAC,mBAAM,eAAkB,EACxB,QAAQ,KAAK,WACZ,oBAAC;GAAyB,OAAO,OAAO;aACtC,qBAAC,6BACC,oBAAC;IAAO,MAAK;cAAU,OAAO;KAAe,EAC7C,oBAAC;IAAQ,WAAU;cAChB,qBAAqB,OAAO;KACrB,IACK;KANP,OAAO,MAOX,CACR;GACS"}
+{"version":3,"file":"combinator-selector.js","names":["operatorDescriptions: Record<string, string>"],"sources":["../../../src/components/query-builder/combinator-selector.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { Label } from '../label';\nimport { Radio } from '../radio';\nimport { RadioGroup } from '../radio/group';\nimport { Tooltip } from '../tooltip';\nimport { TooltipTrigger } from '../tooltip/trigger';\nimport type { CombinatorSelectorProps } from 'react-querybuilder';\n\nconst operatorDescriptions: Record<string, string> = {\n  AND: 'All rules below must be true for a match',\n  OR: 'One of the rules below must be true for a match',\n};\n\n/**\n * CombinatorSelector - AND/OR toggle for rule groups\n *\n * Renders a radio group with tooltips explaining each combinator's behavior.\n *\n * @param props - CombinatorSelectorProps from react-querybuilder.\n * @returns The rendered CombinatorSelector component.\n */\nexport function CombinatorSelector({\n  options,\n  value,\n  handleOnChange,\n}: CombinatorSelectorProps) {\n  return (\n    <RadioGroup\n      value={value}\n      onChange={handleOnChange}\n      orientation='horizontal'\n      style={{ flexWrap: 'nowrap' }}\n    >\n      <Label>Combinator</Label>\n      {options.map((option) => (\n        <Radio key={option.label} value={option.label}>\n          <TooltipTrigger>\n            <button type='button'>{option.label}</button>\n            <Tooltip placement='top'>\n              {operatorDescriptions[option.label]}\n            </Tooltip>\n          </TooltipTrigger>\n        </Radio>\n      ))}\n    </RadioGroup>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAqBA,MAAMA,uBAA+C;CACnD,KAAK;CACL,IAAI;CACL;;;;;;;;;AAUD,SAAgB,mBAAmB,EACjC,SACA,OACA,kBAC0B;AAC1B,QACE,qBAAC;EACQ;EACP,UAAU;EACV,aAAY;EACZ,OAAO,EAAE,UAAU,UAAU;aAE7B,oBAAC,mBAAM,eAAkB,EACxB,QAAQ,KAAK,WACZ,oBAAC;GAAyB,OAAO,OAAO;aACtC,qBAAC,6BACC,oBAAC;IAAO,MAAK;cAAU,OAAO;KAAe,EAC7C,oBAAC;IAAQ,WAAU;cAChB,qBAAqB,OAAO;KACrB,IACK;KANP,OAAO,MAOX,CACR;GACS"}

package/dist/components/query-builder/constants.d.ts

@@ -1,4 +1,5 @@
 //#region src/components/query-builder/constants.d.ts
+/** Operators that require multiple input values (e.g., between, during). */
 declare const multiValueOperators: string[];
 //#endregion
 export { multiValueOperators };

package/dist/components/query-builder/constants.js

@@ -12,6 +12,7 @@
 
 
 //#region src/components/query-builder/constants.ts
+/** Operators that require multiple input values (e.g., between, during). */
 const multiValueOperators = [
 	"between",
 	"notBetween",

package/dist/components/query-builder/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","names":[],"sources":["../../../src/components/query-builder/constants.ts"],"sourcesContent":["// __private-exports\n/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nexport const multiValueOperators = [\n  'between',\n  'notBetween',\n  'during',\n  'overlapped',\n  'overlaps',\n];\n"],"mappings":";;;;;;;;;;;;;;AAaA,MAAa,sBAAsB;CACjC;CACA;CACA;CACA;CACA;CACD"}
+{"version":3,"file":"constants.js","names":[],"sources":["../../../src/components/query-builder/constants.ts"],"sourcesContent":["// __private-exports\n/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/** Operators that require multiple input values (e.g., between, during). */\nexport const multiValueOperators = [\n  'between',\n  'notBetween',\n  'during',\n  'overlapped',\n  'overlaps',\n];\n"],"mappings":";;;;;;;;;;;;;;;AAcA,MAAa,sBAAsB;CACjC;CACA;CACA;CACA;CACA;CACD"}

package/dist/components/query-builder/index.d.ts

@@ -12,7 +12,7 @@
 
 import { QueryBuilderProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime126 from "react/jsx-runtime";
+import * as react_jsx_runtime121 from "react/jsx-runtime";
 
 //#region src/components/query-builder/index.d.ts
 
@@ -23,7 +23,15 @@ import * as react_jsx_runtime126 from "react/jsx-runtime";
  * with support for multiple conditions, operators, and logical grouping. Enables
  * users to build complex filters without writing SQL or code.
  *
+ * @param props - {@link QueryBuilderProps}
+ * @param props.controlClassnames - Custom CSS class names for control elements.
+ * @param props.controlElements - Custom component overrides for controls.
+ * @param props.orientation - Layout orientation ('horizontal' or 'vertical').
+ * @param props.showRuleLines - Whether to show connecting lines between rules.
+ * @returns The rendered QueryBuilder component.
+ *
  * @example
+ * ```tsx
  * // Basic query builder
  * <QueryBuilder
  *   fields={[
@@ -39,6 +47,7 @@ import * as react_jsx_runtime126 from "react/jsx-runtime";
  *   }}
  *   orientation="vertical"
  * />
+ * ```
  */
 declare function QueryBuilder({
   controlClassnames,
@@ -46,7 +55,7 @@ declare function QueryBuilder({
   orientation,
   showRuleLines,
   ...rest
-}: QueryBuilderProps): react_jsx_runtime126.JSX.Element;
+}: QueryBuilderProps): react_jsx_runtime121.JSX.Element;
 //#endregion
 export { QueryBuilder };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/query-builder/index.js

@@ -35,7 +35,15 @@ import styles from "./styles.module.css";
 * with support for multiple conditions, operators, and logical grouping. Enables
 * users to build complex filters without writing SQL or code.
 *
+* @param props - {@link QueryBuilderProps}
+* @param props.controlClassnames - Custom CSS class names for control elements.
+* @param props.controlElements - Custom component overrides for controls.
+* @param props.orientation - Layout orientation ('horizontal' or 'vertical').
+* @param props.showRuleLines - Whether to show connecting lines between rules.
+* @returns The rendered QueryBuilder component.
+*
 * @example
+* ```tsx
 * // Basic query builder
 * <QueryBuilder
 *   fields={[
@@ -51,6 +59,7 @@ import styles from "./styles.module.css";
 *   }}
 *   orientation="vertical"
 * />
+* ```
 */
 function QueryBuilder({ controlClassnames, controlElements, orientation = "horizontal", showRuleLines = true, ...rest }) {
 	/**

package/dist/components/query-builder/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["RQBBuilder"],"sources":["../../../src/components/query-builder/index.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { createContext, useMemo } from 'react';\nimport { QueryBuilder as RQBBuilder } from 'react-querybuilder';\nimport { ActionElement } from './action-element';\nimport { CloneAction, LockAction, RemoveRuleAction } from './actions';\nimport { CombinatorSelector } from './combinator-selector';\nimport { Rule } from './rule';\nimport { RuleGroup } from './rule-group';\nimport styles from './styles.module.css';\nimport { ValueEditor } from './value-editor';\nimport { ValueSelector } from './value-selector';\nimport type { QueryBuilderContextType, QueryBuilderProps } from './types';\n\n/**\n * QueryBuilder - A visual interface for building complex database queries\n *\n * Provides an intuitive drag-and-drop interface for constructing database queries\n * with support for multiple conditions, operators, and logical grouping. Enables\n * users to build complex filters without writing SQL or code.\n *\n * @example\n * // Basic query builder\n * <QueryBuilder\n *   fields={[\n *     // { name, label, type, inputType, operators },\n *   ]}\n *   query={\n *     // { combinator, rules }\n *   }\n *   onQueryChange={handleQueryChange}\n *   controlElements={{\n *     addRuleAction: CustomAddButton,\n *     removeRuleAction: CustomRemoveButton\n *   }}\n *   orientation=\"vertical\"\n * />\n */\nexport function QueryBuilder({\n  controlClassnames,\n  controlElements,\n  orientation = 'horizontal',\n  showRuleLines = true,\n  ...rest\n}: QueryBuilderProps) {\n  /**\n   * Represents the list of available controls that the component can use as a custom\n   * component override.Passed in as a map of our custom defaults, but can be\n   * overridden by using the controlElements prop\n   */\n  const mergedElements = useMemo(\n    () => ({\n      combinatorSelector: CombinatorSelector,\n      cloneGroupAction: CloneAction,\n      cloneRuleAction: CloneAction,\n      removeRuleAction: RemoveRuleAction,\n      lockGroupAction: LockAction,\n      lockRuleAction: LockAction,\n      ruleGroup: RuleGroup,\n      rule: Rule,\n      actionElement: ActionElement,\n      valueSelector: ValueSelector,\n      valueEditor: ValueEditor,\n      ...controlElements,\n    }),\n    [controlElements],\n  );\n\n  /**\n   * Represents the list of available classnames that the component will recognize.\n   * Passed in as a map as all the default styling, but can be overridden by using the\n   * controlClassnames prop\n   */\n  const mergedClassnames = useMemo(() => {\n    return {\n      queryBuilder: styles.queryBuilder,\n      ruleGroup: clsx('group', styles.ruleGroup),\n      header: styles.header,\n      combinators: styles.combinators,\n      fields: styles.fields,\n      operators: '',\n      value: styles.value,\n      valueListItem: '',\n      valueSource: '',\n      cloneGroup: styles.cloneGroup,\n      cloneRule: styles.cloneRule,\n      lockGroup: styles.lockGroup,\n      lockRule: styles.lockRule,\n      disabled: '',\n      valid: '',\n      invalid: '',\n      removeRule: '',\n      addRule: '',\n      addGroup: '',\n      removeGroup: '',\n      rule: clsx(styles.rule, styles[orientation]),\n      body: clsx(\n        'group',\n        styles.body,\n        showRuleLines && styles.showRuleLines,\n        !showRuleLines && styles.hideRuleLines,\n      ),\n      ...controlClassnames,\n    };\n  }, [controlClassnames, showRuleLines, orientation]);\n\n  const QueryBuilderContext = createContext<QueryBuilderContextType>({\n    orientation,\n    showRuleLines,\n  });\n\n  return (\n    <RQBBuilder\n      showNotToggle={false}\n      showShiftActions={false}\n      enableDragAndDrop={false}\n      controlClassnames={mergedClassnames}\n      controlElements={mergedElements}\n      context={QueryBuilderContext}\n      listsAsArrays\n      {...rest}\n    />\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDA,SAAgB,aAAa,EAC3B,mBACA,iBACA,cAAc,cACd,gBAAgB,MAChB,GAAG,QACiB;;;;;;CAMpB,MAAM,iBAAiB,eACd;EACL,oBAAoB;EACpB,kBAAkB;EAClB,iBAAiB;EACjB,kBAAkB;EAClB,iBAAiB;EACjB,gBAAgB;EAChB,WAAW;EACX,MAAM;EACN,eAAe;EACf,eAAe;EACf,aAAa;EACb,GAAG;EACJ,GACD,CAAC,gBAAgB,CAClB;AA6CD,QACE,oBAACA;EACC,eAAe;EACf,kBAAkB;EAClB,mBAAmB;EACnB,mBA3CqB,cAAc;AACrC,UAAO;IACL,cAAc,OAAO;IACrB,WAAW,KAAK,SAAS,OAAO,UAAU;IAC1C,QAAQ,OAAO;IACf,aAAa,OAAO;IACpB,QAAQ,OAAO;IACf,WAAW;IACX,OAAO,OAAO;IACd,eAAe;IACf,aAAa;IACb,YAAY,OAAO;IACnB,WAAW,OAAO;IAClB,WAAW,OAAO;IAClB,UAAU,OAAO;IACjB,UAAU;IACV,OAAO;IACP,SAAS;IACT,YAAY;IACZ,SAAS;IACT,UAAU;IACV,aAAa;IACb,MAAM,KAAK,OAAO,MAAM,OAAO,aAAa;IAC5C,MAAM,KACJ,SACA,OAAO,MACP,iBAAiB,OAAO,eACxB,CAAC,iBAAiB,OAAO,cAC1B;IACD,GAAG;IACJ;KACA;GAAC;GAAmB;GAAe;GAAY,CAAC;EAa/C,iBAAiB;EACjB,SAZwB,cAAuC;GACjE;GACA;GACD,CAAC;EAUE;EACA,GAAI;GACJ"}
+{"version":3,"file":"index.js","names":["RQBBuilder"],"sources":["../../../src/components/query-builder/index.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { createContext, useMemo } from 'react';\nimport { QueryBuilder as RQBBuilder } from 'react-querybuilder';\nimport { ActionElement } from './action-element';\nimport { CloneAction, LockAction, RemoveRuleAction } from './actions';\nimport { CombinatorSelector } from './combinator-selector';\nimport { Rule } from './rule';\nimport { RuleGroup } from './rule-group';\nimport styles from './styles.module.css';\nimport { ValueEditor } from './value-editor';\nimport { ValueSelector } from './value-selector';\nimport type { QueryBuilderContextType, QueryBuilderProps } from './types';\n\n/**\n * QueryBuilder - A visual interface for building complex database queries\n *\n * Provides an intuitive drag-and-drop interface for constructing database queries\n * with support for multiple conditions, operators, and logical grouping. Enables\n * users to build complex filters without writing SQL or code.\n *\n * @param props - {@link QueryBuilderProps}\n * @param props.controlClassnames - Custom CSS class names for control elements.\n * @param props.controlElements - Custom component overrides for controls.\n * @param props.orientation - Layout orientation ('horizontal' or 'vertical').\n * @param props.showRuleLines - Whether to show connecting lines between rules.\n * @returns The rendered QueryBuilder component.\n *\n * @example\n * ```tsx\n * // Basic query builder\n * <QueryBuilder\n *   fields={[\n *     // { name, label, type, inputType, operators },\n *   ]}\n *   query={\n *     // { combinator, rules }\n *   }\n *   onQueryChange={handleQueryChange}\n *   controlElements={{\n *     addRuleAction: CustomAddButton,\n *     removeRuleAction: CustomRemoveButton\n *   }}\n *   orientation=\"vertical\"\n * />\n * ```\n */\nexport function QueryBuilder({\n  controlClassnames,\n  controlElements,\n  orientation = 'horizontal',\n  showRuleLines = true,\n  ...rest\n}: QueryBuilderProps) {\n  /**\n   * Represents the list of available controls that the component can use as a custom\n   * component override.Passed in as a map of our custom defaults, but can be\n   * overridden by using the controlElements prop\n   */\n  const mergedElements = useMemo(\n    () => ({\n      combinatorSelector: CombinatorSelector,\n      cloneGroupAction: CloneAction,\n      cloneRuleAction: CloneAction,\n      removeRuleAction: RemoveRuleAction,\n      lockGroupAction: LockAction,\n      lockRuleAction: LockAction,\n      ruleGroup: RuleGroup,\n      rule: Rule,\n      actionElement: ActionElement,\n      valueSelector: ValueSelector,\n      valueEditor: ValueEditor,\n      ...controlElements,\n    }),\n    [controlElements],\n  );\n\n  /**\n   * Represents the list of available classnames that the component will recognize.\n   * Passed in as a map as all the default styling, but can be overridden by using the\n   * controlClassnames prop\n   */\n  const mergedClassnames = useMemo(() => {\n    return {\n      queryBuilder: styles.queryBuilder,\n      ruleGroup: clsx('group', styles.ruleGroup),\n      header: styles.header,\n      combinators: styles.combinators,\n      fields: styles.fields,\n      operators: '',\n      value: styles.value,\n      valueListItem: '',\n      valueSource: '',\n      cloneGroup: styles.cloneGroup,\n      cloneRule: styles.cloneRule,\n      lockGroup: styles.lockGroup,\n      lockRule: styles.lockRule,\n      disabled: '',\n      valid: '',\n      invalid: '',\n      removeRule: '',\n      addRule: '',\n      addGroup: '',\n      removeGroup: '',\n      rule: clsx(styles.rule, styles[orientation]),\n      body: clsx(\n        'group',\n        styles.body,\n        showRuleLines && styles.showRuleLines,\n        !showRuleLines && styles.hideRuleLines,\n      ),\n      ...controlClassnames,\n    };\n  }, [controlClassnames, showRuleLines, orientation]);\n\n  const QueryBuilderContext = createContext<QueryBuilderContextType>({\n    orientation,\n    showRuleLines,\n  });\n\n  return (\n    <RQBBuilder\n      showNotToggle={false}\n      showShiftActions={false}\n      enableDragAndDrop={false}\n      controlClassnames={mergedClassnames}\n      controlElements={mergedElements}\n      context={QueryBuilderContext}\n      listsAsArrays\n      {...rest}\n    />\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4DA,SAAgB,aAAa,EAC3B,mBACA,iBACA,cAAc,cACd,gBAAgB,MAChB,GAAG,QACiB;;;;;;CAMpB,MAAM,iBAAiB,eACd;EACL,oBAAoB;EACpB,kBAAkB;EAClB,iBAAiB;EACjB,kBAAkB;EAClB,iBAAiB;EACjB,gBAAgB;EAChB,WAAW;EACX,MAAM;EACN,eAAe;EACf,eAAe;EACf,aAAa;EACb,GAAG;EACJ,GACD,CAAC,gBAAgB,CAClB;AA6CD,QACE,oBAACA;EACC,eAAe;EACf,kBAAkB;EAClB,mBAAmB;EACnB,mBA3CqB,cAAc;AACrC,UAAO;IACL,cAAc,OAAO;IACrB,WAAW,KAAK,SAAS,OAAO,UAAU;IAC1C,QAAQ,OAAO;IACf,aAAa,OAAO;IACpB,QAAQ,OAAO;IACf,WAAW;IACX,OAAO,OAAO;IACd,eAAe;IACf,aAAa;IACb,YAAY,OAAO;IACnB,WAAW,OAAO;IAClB,WAAW,OAAO;IAClB,UAAU,OAAO;IACjB,UAAU;IACV,OAAO;IACP,SAAS;IACT,YAAY;IACZ,SAAS;IACT,UAAU;IACV,aAAa;IACb,MAAM,KAAK,OAAO,MAAM,OAAO,aAAa;IAC5C,MAAM,KACJ,SACA,OAAO,MACP,iBAAiB,OAAO,eACxB,CAAC,iBAAiB,OAAO,cAC1B;IACD,GAAG;IACJ;KACA;GAAC;GAAmB;GAAe;GAAY,CAAC;EAa/C,iBAAiB;EACjB,SAZwB,cAAuC;GACjE;GACA;GACD,CAAC;EAUE;EACA,GAAI;GACJ"}

package/dist/components/query-builder/rule-group.d.ts

@@ -11,13 +11,61 @@
  */
 
 import "client-only";
-import * as react_jsx_runtime127 from "react/jsx-runtime";
+import * as react_jsx_runtime122 from "react/jsx-runtime";
 import { RuleGroupProps, useRuleGroup } from "react-querybuilder";
 
 //#region src/components/query-builder/rule-group.d.ts
-declare function RuleGroup(props: RuleGroupProps): react_jsx_runtime127.JSX.Element;
-declare function RuleGroupHeaderComponent(ruleGroup: RuleGroupProps & ReturnType<typeof useRuleGroup>): react_jsx_runtime127.JSX.Element;
-declare function RuleGroupFooterComponent(ruleGroup: RuleGroupProps & ReturnType<typeof useRuleGroup>): react_jsx_runtime127.JSX.Element;
+
+/**
+ * RuleGroup - Container for organizing rules with a shared combinator
+ *
+ * Renders header with combinator selector and actions, body with rules, and footer with add actions.
+ *
+ * @example
+ * ```tsx
+ * <RuleGroup
+ *   ruleGroup={{ combinator: 'and', rules: [] }}
+ *   path={[]}
+ *   schema={queryBuilderSchema}
+ * />
+ * ```
+ *
+ * @param props - RuleGroupProps from react-querybuilder.
+ * @returns The rendered RuleGroup component.
+ */
+declare function RuleGroup(props: RuleGroupProps): react_jsx_runtime122.JSX.Element;
+/**
+ * Header section with combinator selector and group actions (clone, lock, remove)
+ *
+ * @example
+ * ```tsx
+ * <RuleGroupHeaderComponent
+ *   {...ruleGroupProps}
+ *   combinator="and"
+ *   schema={queryBuilderSchema}
+ * />
+ * ```
+ *
+ * @param ruleGroup - Combined RuleGroupProps and useRuleGroup return value.
+ * @returns The rendered header with combinator and action controls.
+ */
+declare function RuleGroupHeaderComponent(ruleGroup: RuleGroupProps & ReturnType<typeof useRuleGroup>): react_jsx_runtime122.JSX.Element;
+/**
+ * Footer section with add rule and add group actions
+ *
+ * @example
+ * ```tsx
+ * <RuleGroupFooterComponent
+ *   {...ruleGroupProps}
+ *   addRule={() => console.log('add rule')}
+ *   addGroup={() => console.log('add group')}
+ * />
+ * ```
+ *
+ * @param ruleGroup - Combined RuleGroupProps and useRuleGroup return value.
+ * @returns The rendered footer with add rule and add group buttons.
+ */
+declare function RuleGroupFooterComponent(ruleGroup: RuleGroupProps & ReturnType<typeof useRuleGroup>): react_jsx_runtime122.JSX.Element;
 //#endregion
 export { RuleGroup, RuleGroupFooterComponent, RuleGroupHeaderComponent };
 //# sourceMappingURL=rule-group.d.ts.map

package/dist/components/query-builder/rule-group.js

@@ -20,6 +20,23 @@ import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { TestID, useRuleGroup, useStopEventPropagation } from "react-querybuilder";
 
 //#region src/components/query-builder/rule-group.tsx
+/**
+* RuleGroup - Container for organizing rules with a shared combinator
+*
+* Renders header with combinator selector and actions, body with rules, and footer with add actions.
+*
+* @example
+* ```tsx
+* <RuleGroup
+*   ruleGroup={{ combinator: 'and', rules: [] }}
+*   path={[]}
+*   schema={queryBuilderSchema}
+* />
+* ```
+*
+* @param props - RuleGroupProps from react-querybuilder.
+* @returns The rendered RuleGroup component.
+*/
 function RuleGroup(props) {
 	const group = useRuleGroup(props);
 	const { schema: { controls: { ruleGroupBodyElements: RuleGroupBodyElements } } } = group;
@@ -62,6 +79,21 @@ function RuleGroup(props) {
 		]
 	});
 }
+/**
+* Header section with combinator selector and group actions (clone, lock, remove)
+*
+* @example
+* ```tsx
+* <RuleGroupHeaderComponent
+*   {...ruleGroupProps}
+*   combinator="and"
+*   schema={queryBuilderSchema}
+* />
+* ```
+*
+* @param ruleGroup - Combined RuleGroupProps and useRuleGroup return value.
+* @returns The rendered header with combinator and action controls.
+*/
 function RuleGroupHeaderComponent(ruleGroup) {
 	const shouldShowLock = ruleGroup.schema.showLockButtons;
 	const isNotRoot = ruleGroup.path.length > 0;
@@ -132,6 +164,21 @@ function RuleGroupHeaderComponent(ruleGroup) {
 		}, TestID.removeGroup) })
 	] });
 }
+/**
+* Footer section with add rule and add group actions
+*
+* @example
+* ```tsx
+* <RuleGroupFooterComponent
+*   {...ruleGroupProps}
+*   addRule={() => console.log('add rule')}
+*   addGroup={() => console.log('add group')}
+* />
+* ```
+*
+* @param ruleGroup - Combined RuleGroupProps and useRuleGroup return value.
+* @returns The rendered footer with add rule and add group buttons.
+*/
 function RuleGroupFooterComponent(ruleGroup) {
 	const { schema: { controls: { addGroupAction: AddGroupActionControlElement, addRuleAction: AddRuleActionControlElement } } } = ruleGroup;
 	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(AddRuleActionControlElement, {

package/dist/components/query-builder/rule-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"rule-group.js","names":[],"sources":["../../../src/components/query-builder/rule-group.tsx"],"sourcesContent":["// __private-exports\n/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { useMemo } from 'react';\nimport {\n  type RuleGroupProps,\n  TestID,\n  useRuleGroup,\n  useStopEventPropagation,\n} from 'react-querybuilder';\n\nexport function RuleGroup(props: RuleGroupProps) {\n  const group = useRuleGroup(props);\n\n  const {\n    schema: {\n      controls: { ruleGroupBodyElements: RuleGroupBodyElements },\n    },\n  } = group;\n\n  const {\n    schema: { classNames },\n  } = props;\n\n  const addRule = useStopEventPropagation(group.addRule);\n  const addGroup = useStopEventPropagation(group.addGroup);\n  const cloneGroup = useStopEventPropagation(group.cloneGroup);\n  const toggleLockGroup = useStopEventPropagation(group.toggleLockGroup);\n  const removeGroup = useStopEventPropagation(group.removeGroup);\n\n  const elementProps = useMemo(\n    () => ({\n      ...group,\n      addGroup,\n      addRule,\n      cloneGroup,\n      removeGroup,\n      toggleLockGroup,\n    }),\n    [addGroup, addRule, cloneGroup, group, removeGroup, toggleLockGroup],\n  );\n\n  return (\n    <div className={clsx(classNames.ruleGroup)}>\n      <div className={clsx(classNames.header)}>\n        <RuleGroupHeaderComponent {...elementProps} />\n      </div>\n      <div className={clsx(classNames.body)}>\n        <RuleGroupBodyElements {...elementProps} />\n      </div>\n      <div className={clsx(classNames.header)}>\n        <RuleGroupFooterComponent {...elementProps} />\n      </div>\n    </div>\n  );\n}\n\nexport function RuleGroupHeaderComponent(\n  ruleGroup: RuleGroupProps & ReturnType<typeof useRuleGroup>,\n) {\n  const shouldShowLock = ruleGroup.schema.showLockButtons;\n  const isNotRoot = ruleGroup.path.length > 0;\n  const shouldShowClone = ruleGroup.schema.showCloneButtons && isNotRoot;\n\n  const {\n    schema: {\n      controls: {\n        combinatorSelector: CombinatorSelectorControlElement,\n        cloneGroupAction: CloneGroupActionControlElement,\n        lockGroupAction: LockGroupActionControlElement,\n        removeGroupAction: RemoveGroupActionControlElement,\n      },\n    },\n  } = ruleGroup;\n\n  return (\n    <>\n      <CombinatorSelectorControlElement\n        key={TestID.combinators}\n        testID={TestID.combinators}\n        options={ruleGroup.schema.combinators}\n        ruleGroup={ruleGroup.ruleGroup}\n        value={ruleGroup.combinator}\n        title={ruleGroup.translations.combinators.title}\n        className={ruleGroup.classNames.combinators}\n        handleOnChange={ruleGroup.onCombinatorChange}\n        rules={ruleGroup.ruleGroup.rules}\n        level={ruleGroup.path.length}\n        path={ruleGroup.path}\n        disabled={ruleGroup.disabled}\n        context={ruleGroup.context}\n        validation={ruleGroup.validationResult}\n        schema={ruleGroup.schema}\n      />\n      {shouldShowClone && (\n        <div>\n          <CloneGroupActionControlElement\n            key={TestID.cloneGroup}\n            testID={TestID.cloneGroup}\n            label={ruleGroup.translations.cloneRuleGroup.label}\n            title={ruleGroup.translations.cloneRuleGroup.title}\n            className={ruleGroup.classNames.cloneGroup}\n            handleOnClick={ruleGroup.cloneGroup}\n            rules={ruleGroup.ruleGroup.rules}\n            level={ruleGroup.path.length}\n            path={ruleGroup.path}\n            disabled={ruleGroup.disabled}\n            context={ruleGroup.context}\n            validation={ruleGroup.validationResult}\n            ruleOrGroup={ruleGroup.ruleGroup}\n            schema={ruleGroup.schema}\n          />\n        </div>\n      )}\n      {shouldShowLock && (\n        <div>\n          <LockGroupActionControlElement\n            key={TestID.lockGroup}\n            testID={TestID.lockGroup}\n            label={ruleGroup.translations.lockGroup.label}\n            title={ruleGroup.translations.lockGroup.title}\n            className={ruleGroup.classNames.lockGroup}\n            handleOnClick={ruleGroup.toggleLockGroup}\n            rules={ruleGroup.ruleGroup.rules}\n            level={ruleGroup.path.length}\n            path={ruleGroup.path}\n            disabled={ruleGroup.disabled}\n            disabledTranslation={\n              ruleGroup.parentDisabled\n                ? undefined\n                : ruleGroup.translations.lockGroupDisabled\n            }\n            context={ruleGroup.context}\n            validation={ruleGroup.validationResult}\n            ruleOrGroup={ruleGroup.ruleGroup}\n            schema={ruleGroup.schema}\n          />\n        </div>\n      )}\n      {isNotRoot && (\n        <div>\n          <RemoveGroupActionControlElement\n            key={TestID.removeGroup}\n            testID={TestID.removeGroup}\n            label={ruleGroup.translations.removeGroup.label}\n            title={ruleGroup.translations.removeGroup.title}\n            className={ruleGroup.classNames.removeGroup}\n            handleOnClick={ruleGroup.removeGroup}\n            rules={ruleGroup.ruleGroup.rules}\n            level={ruleGroup.path.length}\n            path={ruleGroup.path}\n            disabled={ruleGroup.disabled}\n            context={ruleGroup.context}\n            validation={ruleGroup.validationResult}\n            ruleOrGroup={ruleGroup.ruleGroup}\n            schema={ruleGroup.schema}\n          />\n        </div>\n      )}\n    </>\n  );\n}\n\nexport function RuleGroupFooterComponent(\n  ruleGroup: RuleGroupProps & ReturnType<typeof useRuleGroup>,\n) {\n  const {\n    schema: {\n      controls: {\n        addGroupAction: AddGroupActionControlElement,\n        addRuleAction: AddRuleActionControlElement,\n      },\n    },\n  } = ruleGroup;\n\n  return (\n    <>\n      <AddRuleActionControlElement\n        key={TestID.addRule}\n        testID={TestID.addRule}\n        label={ruleGroup.translations.addRule.label}\n        title={ruleGroup.translations.addRule.title}\n        className={ruleGroup.classNames.addRule}\n        handleOnClick={ruleGroup.addRule}\n        rules={ruleGroup.ruleGroup.rules}\n        level={ruleGroup.path.length}\n        path={ruleGroup.path}\n        disabled={ruleGroup.disabled}\n        context={ruleGroup.context}\n        validation={ruleGroup.validationResult}\n        ruleOrGroup={ruleGroup.ruleGroup}\n        schema={ruleGroup.schema}\n      />\n      <AddGroupActionControlElement\n        key={TestID.addGroup}\n        testID={TestID.addGroup}\n        label={ruleGroup.translations.addGroup.label}\n        title={ruleGroup.translations.addGroup.title}\n        className={ruleGroup.classNames.addGroup}\n        handleOnClick={ruleGroup.addGroup}\n        rules={ruleGroup.ruleGroup.rules}\n        level={ruleGroup.path.length}\n        path={ruleGroup.path}\n        disabled={ruleGroup.disabled}\n        context={ruleGroup.context}\n        validation={ruleGroup.validationResult}\n        ruleOrGroup={ruleGroup.ruleGroup}\n        schema={ruleGroup.schema}\n      />\n    </>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"rule-group.js","names":[],"sources":["../../../src/components/query-builder/rule-group.tsx"],"sourcesContent":["// __private-exports\n/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { useMemo } from 'react';\nimport {\n  type RuleGroupProps,\n  TestID,\n  useRuleGroup,\n  useStopEventPropagation,\n} from 'react-querybuilder';\n\n/**\n * RuleGroup - Container for organizing rules with a shared combinator\n *\n * Renders header with combinator selector and actions, body with rules, and footer with add actions.\n *\n * @example\n * ```tsx\n * <RuleGroup\n *   ruleGroup={{ combinator: 'and', rules: [] }}\n *   path={[]}\n *   schema={queryBuilderSchema}\n * />\n * ```\n *\n * @param props - RuleGroupProps from react-querybuilder.\n * @returns The rendered RuleGroup component.\n */\nexport function RuleGroup(props: RuleGroupProps) {\n  const group = useRuleGroup(props);\n\n  const {\n    schema: {\n      controls: { ruleGroupBodyElements: RuleGroupBodyElements },\n    },\n  } = group;\n\n  const {\n    schema: { classNames },\n  } = props;\n\n  const addRule = useStopEventPropagation(group.addRule);\n  const addGroup = useStopEventPropagation(group.addGroup);\n  const cloneGroup = useStopEventPropagation(group.cloneGroup);\n  const toggleLockGroup = useStopEventPropagation(group.toggleLockGroup);\n  const removeGroup = useStopEventPropagation(group.removeGroup);\n\n  const elementProps = useMemo(\n    () => ({\n      ...group,\n      addGroup,\n      addRule,\n      cloneGroup,\n      removeGroup,\n      toggleLockGroup,\n    }),\n    [addGroup, addRule, cloneGroup, group, removeGroup, toggleLockGroup],\n  );\n\n  return (\n    <div className={clsx(classNames.ruleGroup)}>\n      <div className={clsx(classNames.header)}>\n        <RuleGroupHeaderComponent {...elementProps} />\n      </div>\n      <div className={clsx(classNames.body)}>\n        <RuleGroupBodyElements {...elementProps} />\n      </div>\n      <div className={clsx(classNames.header)}>\n        <RuleGroupFooterComponent {...elementProps} />\n      </div>\n    </div>\n  );\n}\n\n/**\n * Header section with combinator selector and group actions (clone, lock, remove)\n *\n * @example\n * ```tsx\n * <RuleGroupHeaderComponent\n *   {...ruleGroupProps}\n *   combinator=\"and\"\n *   schema={queryBuilderSchema}\n * />\n * ```\n *\n * @param ruleGroup - Combined RuleGroupProps and useRuleGroup return value.\n * @returns The rendered header with combinator and action controls.\n */\nexport function RuleGroupHeaderComponent(\n  ruleGroup: RuleGroupProps & ReturnType<typeof useRuleGroup>,\n) {\n  const shouldShowLock = ruleGroup.schema.showLockButtons;\n  const isNotRoot = ruleGroup.path.length > 0;\n  const shouldShowClone = ruleGroup.schema.showCloneButtons && isNotRoot;\n\n  const {\n    schema: {\n      controls: {\n        combinatorSelector: CombinatorSelectorControlElement,\n        cloneGroupAction: CloneGroupActionControlElement,\n        lockGroupAction: LockGroupActionControlElement,\n        removeGroupAction: RemoveGroupActionControlElement,\n      },\n    },\n  } = ruleGroup;\n\n  return (\n    <>\n      <CombinatorSelectorControlElement\n        key={TestID.combinators}\n        testID={TestID.combinators}\n        options={ruleGroup.schema.combinators}\n        ruleGroup={ruleGroup.ruleGroup}\n        value={ruleGroup.combinator}\n        title={ruleGroup.translations.combinators.title}\n        className={ruleGroup.classNames.combinators}\n        handleOnChange={ruleGroup.onCombinatorChange}\n        rules={ruleGroup.ruleGroup.rules}\n        level={ruleGroup.path.length}\n        path={ruleGroup.path}\n        disabled={ruleGroup.disabled}\n        context={ruleGroup.context}\n        validation={ruleGroup.validationResult}\n        schema={ruleGroup.schema}\n      />\n      {shouldShowClone && (\n        <div>\n          <CloneGroupActionControlElement\n            key={TestID.cloneGroup}\n            testID={TestID.cloneGroup}\n            label={ruleGroup.translations.cloneRuleGroup.label}\n            title={ruleGroup.translations.cloneRuleGroup.title}\n            className={ruleGroup.classNames.cloneGroup}\n            handleOnClick={ruleGroup.cloneGroup}\n            rules={ruleGroup.ruleGroup.rules}\n            level={ruleGroup.path.length}\n            path={ruleGroup.path}\n            disabled={ruleGroup.disabled}\n            context={ruleGroup.context}\n            validation={ruleGroup.validationResult}\n            ruleOrGroup={ruleGroup.ruleGroup}\n            schema={ruleGroup.schema}\n          />\n        </div>\n      )}\n      {shouldShowLock && (\n        <div>\n          <LockGroupActionControlElement\n            key={TestID.lockGroup}\n            testID={TestID.lockGroup}\n            label={ruleGroup.translations.lockGroup.label}\n            title={ruleGroup.translations.lockGroup.title}\n            className={ruleGroup.classNames.lockGroup}\n            handleOnClick={ruleGroup.toggleLockGroup}\n            rules={ruleGroup.ruleGroup.rules}\n            level={ruleGroup.path.length}\n            path={ruleGroup.path}\n            disabled={ruleGroup.disabled}\n            disabledTranslation={\n              ruleGroup.parentDisabled\n                ? undefined\n                : ruleGroup.translations.lockGroupDisabled\n            }\n            context={ruleGroup.context}\n            validation={ruleGroup.validationResult}\n            ruleOrGroup={ruleGroup.ruleGroup}\n            schema={ruleGroup.schema}\n          />\n        </div>\n      )}\n      {isNotRoot && (\n        <div>\n          <RemoveGroupActionControlElement\n            key={TestID.removeGroup}\n            testID={TestID.removeGroup}\n            label={ruleGroup.translations.removeGroup.label}\n            title={ruleGroup.translations.removeGroup.title}\n            className={ruleGroup.classNames.removeGroup}\n            handleOnClick={ruleGroup.removeGroup}\n            rules={ruleGroup.ruleGroup.rules}\n            level={ruleGroup.path.length}\n            path={ruleGroup.path}\n            disabled={ruleGroup.disabled}\n            context={ruleGroup.context}\n            validation={ruleGroup.validationResult}\n            ruleOrGroup={ruleGroup.ruleGroup}\n            schema={ruleGroup.schema}\n          />\n        </div>\n      )}\n    </>\n  );\n}\n\n/**\n * Footer section with add rule and add group actions\n *\n * @example\n * ```tsx\n * <RuleGroupFooterComponent\n *   {...ruleGroupProps}\n *   addRule={() => console.log('add rule')}\n *   addGroup={() => console.log('add group')}\n * />\n * ```\n *\n * @param ruleGroup - Combined RuleGroupProps and useRuleGroup return value.\n * @returns The rendered footer with add rule and add group buttons.\n */\nexport function RuleGroupFooterComponent(\n  ruleGroup: RuleGroupProps & ReturnType<typeof useRuleGroup>,\n) {\n  const {\n    schema: {\n      controls: {\n        addGroupAction: AddGroupActionControlElement,\n        addRuleAction: AddRuleActionControlElement,\n      },\n    },\n  } = ruleGroup;\n\n  return (\n    <>\n      <AddRuleActionControlElement\n        key={TestID.addRule}\n        testID={TestID.addRule}\n        label={ruleGroup.translations.addRule.label}\n        title={ruleGroup.translations.addRule.title}\n        className={ruleGroup.classNames.addRule}\n        handleOnClick={ruleGroup.addRule}\n        rules={ruleGroup.ruleGroup.rules}\n        level={ruleGroup.path.length}\n        path={ruleGroup.path}\n        disabled={ruleGroup.disabled}\n        context={ruleGroup.context}\n        validation={ruleGroup.validationResult}\n        ruleOrGroup={ruleGroup.ruleGroup}\n        schema={ruleGroup.schema}\n      />\n      <AddGroupActionControlElement\n        key={TestID.addGroup}\n        testID={TestID.addGroup}\n        label={ruleGroup.translations.addGroup.label}\n        title={ruleGroup.translations.addGroup.title}\n        className={ruleGroup.classNames.addGroup}\n        handleOnClick={ruleGroup.addGroup}\n        rules={ruleGroup.ruleGroup.rules}\n        level={ruleGroup.path.length}\n        path={ruleGroup.path}\n        disabled={ruleGroup.disabled}\n        context={ruleGroup.context}\n        validation={ruleGroup.validationResult}\n        ruleOrGroup={ruleGroup.ruleGroup}\n        schema={ruleGroup.schema}\n      />\n    </>\n  );\n}\n"],"mappings":"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"}

package/dist/components/query-builder/rule.d.ts

@@ -11,11 +11,29 @@
  */
 
 import "client-only";
-import * as react_jsx_runtime130 from "react/jsx-runtime";
+import * as react_jsx_runtime125 from "react/jsx-runtime";
 import { RuleProps } from "react-querybuilder";
 
 //#region src/components/query-builder/rule.d.ts
-declare function Rule(props: RuleProps): react_jsx_runtime130.JSX.Element;
+
+/**
+ * Rule - Individual rule component with field, operator, and value
+ *
+ * Renders the field selector, operator selector, value editor, and action buttons.
+ *
+ * @example
+ * ```tsx
+ * <Rule
+ *   rule={{ field: 'name', operator: 'equals', value: 'John' }}
+ *   path={[0]}
+ *   schema={queryBuilderSchema}
+ * />
+ * ```
+ *
+ * @param props - RuleProps from react-querybuilder.
+ * @returns The rendered Rule component with all selectors and actions.
+ */
+declare function Rule(props: RuleProps): react_jsx_runtime125.JSX.Element;
 //#endregion
 export { Rule };
 //# sourceMappingURL=rule.d.ts.map