@accelint/design-toolkit 9.2.0 → 9.4.0

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

@@ -14,32 +14,64 @@ import { ButtonProps, ToggleButtonProps } from "../button/types.js";
 import { ComponentPropsWithRef } from "react";
 
 //#region src/components/pagination/types.d.ts
+/**
+ * Context value for pagination state shared with sub-components.
+ */
 type PaginationContextValue = {
+  /** Current page number (1-indexed). */
   page: number;
+  /** Total number of pages. */
   total: number;
+  /** Whether the pagination is in a loading state. */
   isLoading?: boolean;
+  /** Function to update the current page. */
   setPage: (page: number) => void;
 };
+/**
+ * Props for the Pagination component.
+ */
 type PaginationProps = Omit<ComponentPropsWithRef<'nav'>, 'className' | 'onChange'> & {
+  /** CSS class names for pagination elements. */
   classNames?: {
+    /** Class name for the nav container. */
     container?: string;
+    /** Class name for the previous button. */
     prev?: ButtonProps['className'];
+    /** Class name for the page number buttons. */
     pages?: ToggleButtonProps['className'];
+    /** Class name for the next button. */
     next?: ButtonProps['className'];
   };
+  /** Total number of pages. */
   total: number;
+  /** Default page number for uncontrolled mode. */
   defaultValue?: number;
+  /** Current page number for controlled mode. */
   value?: number;
+  /** Whether the pagination is in a loading state. */
   isLoading?: boolean;
+  /** Handler called when the page changes. */
   onChange?: (page: number) => void;
 };
+/**
+ * Props for the PaginationPages component.
+ */
 type PaginationPagesProps = Pick<ToggleButtonProps, 'className'> & {
+  /** Handler called when a page button is pressed. */
   onPress?: (page: number) => void;
 };
+/**
+ * Props for the PaginationPrev component.
+ */
 type PaginationPrevProps = Pick<ButtonProps, 'className'> & {
+  /** Handler called when the previous button is pressed. */
   onPress?: (page: number) => void;
 };
+/**
+ * Props for the PaginationNext component.
+ */
 type PaginationNextProps = Pick<ButtonProps, 'className'> & {
+  /** Handler called when the next button is pressed. */
   onPress?: (page: number) => void;
 };
 //#endregion

package/dist/components/pagination/utils.d.ts

@@ -1,10 +1,45 @@
 //#region src/components/pagination/utils.d.ts
+/**
+ * Creates an array of numbers from start to end (inclusive).
+ *
+ * @example
+ * ```tsx
+ * range(1, 5) // [1, 2, 3, 4, 5]
+ * range(3, 7) // [3, 4, 5, 6, 7]
+ * ```
+ *
+ * @param start - The starting number of the range.
+ * @param end - The ending number of the range (inclusive).
+ * @returns An array of sequential numbers from start to end.
+ */
 declare function range(start: number, end: number): number[];
+/**
+ * Checks if navigation should be disabled based on page bounds.
+ *
+ * @example
+ * ```tsx
+ * isNavigationDisabled(10, 5) // false - valid navigation
+ * isNavigationDisabled(0, 1)  // true - no pages
+ * isNavigationDisabled(5, 10) // true - current page exceeds total
+ * ```
+ *
+ * @param pageCount - Total number of pages.
+ * @param currentPage - Current page number.
+ * @returns True if pageCount or currentPage are invalid or out of bounds.
+ */
 declare function isNavigationDisabled(pageCount: number, currentPage: number): boolean;
 /**
  * Return min max range for visible pages. As per our design, we limit
  * the range of numbers to a spread of 5 maximum, getting the lower and upper bounds.
  *
+ * @example
+ * ```tsx
+ * getPaginationRange(10, 1)  // { minRange: 1, maxRange: 5 }
+ * getPaginationRange(10, 5)  // { minRange: 3, maxRange: 7 }
+ * getPaginationRange(10, 10) // { minRange: 6, maxRange: 10 }
+ * getPaginationRange(3, 2)   // { minRange: 1, maxRange: 3 }
+ * ```
+ *
  * @param pageCount - total page count
  * @param currentPage - current page
  * @returns - Range of 1 to 5 numbers.

package/dist/components/pagination/utils.js

@@ -17,10 +17,37 @@ const DEFAULT_MIN_RANGE = 1;
 const DEFAULT_MAX_RANGE = 5;
 const DEFAULT_MID_RANGE = 2;
 const DEFAULT_UPPER_MID = 4;
+/**
+* Creates an array of numbers from start to end (inclusive).
+*
+* @example
+* ```tsx
+* range(1, 5) // [1, 2, 3, 4, 5]
+* range(3, 7) // [3, 4, 5, 6, 7]
+* ```
+*
+* @param start - The starting number of the range.
+* @param end - The ending number of the range (inclusive).
+* @returns An array of sequential numbers from start to end.
+*/
 function range(start, end) {
 	const length = end - start + 1;
 	return Array.from({ length }, (_, index) => index + start);
 }
+/**
+* Checks if navigation should be disabled based on page bounds.
+*
+* @example
+* ```tsx
+* isNavigationDisabled(10, 5) // false - valid navigation
+* isNavigationDisabled(0, 1)  // true - no pages
+* isNavigationDisabled(5, 10) // true - current page exceeds total
+* ```
+*
+* @param pageCount - Total number of pages.
+* @param currentPage - Current page number.
+* @returns True if pageCount or currentPage are invalid or out of bounds.
+*/
 function isNavigationDisabled(pageCount, currentPage) {
 	return !pageCount || pageCount < 1 || currentPage < 1 || pageCount < currentPage;
 }
@@ -28,6 +55,14 @@ function isNavigationDisabled(pageCount, currentPage) {
 * Return min max range for visible pages. As per our design, we limit
 * the range of numbers to a spread of 5 maximum, getting the lower and upper bounds.
 *
+* @example
+* ```tsx
+* getPaginationRange(10, 1)  // { minRange: 1, maxRange: 5 }
+* getPaginationRange(10, 5)  // { minRange: 3, maxRange: 7 }
+* getPaginationRange(10, 10) // { minRange: 6, maxRange: 10 }
+* getPaginationRange(3, 2)   // { minRange: 1, maxRange: 3 }
+* ```
+*
 * @param pageCount - total page count
 * @param currentPage - current page
 * @returns - Range of 1 to 5 numbers.

package/dist/components/pagination/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","names":[],"sources":["../../../src/components/pagination/utils.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\nconst DEFAULT_EMPTY_RANGE = 0;\nconst DEFAULT_MIN_RANGE = 1;\nconst DEFAULT_MAX_RANGE = 5;\nconst DEFAULT_MID_RANGE = 2;\nconst DEFAULT_UPPER_MID = 4;\n\nexport function range(start: number, end: number) {\n  const length = end - start + 1;\n  return Array.from({ length }, (_, index) => index + start);\n}\n\n// Handles edge cases around the relationship between pageCount and currentPage.`\nexport function isNavigationDisabled(\n  pageCount: number,\n  currentPage: number,\n): boolean {\n  return (\n    !pageCount || pageCount < 1 || currentPage < 1 || pageCount < currentPage\n  );\n}\n\n/**\n * Return min max range for visible pages. As per our design, we limit\n * the range of numbers to a spread of 5 maximum, getting the lower and upper bounds.\n *\n * @param pageCount - total page count\n * @param currentPage - current page\n * @returns - Range of 1 to 5 numbers.\n */\nexport function getPaginationRange(pageCount: number, currentPage: number) {\n  if (\n    !(pageCount && currentPage) ||\n    currentPage > pageCount ||\n    pageCount < 1 ||\n    currentPage < 1\n  ) {\n    return { minRange: DEFAULT_EMPTY_RANGE, maxRange: DEFAULT_EMPTY_RANGE };\n  }\n\n  // Below max display.\n  if (pageCount < DEFAULT_MAX_RANGE) {\n    return {\n      minRange: DEFAULT_MIN_RANGE,\n      maxRange: pageCount,\n    };\n  }\n\n  // Middle.\n  if (currentPage >= 3 && currentPage < pageCount - 2) {\n    return {\n      minRange: currentPage - DEFAULT_MID_RANGE,\n      maxRange: currentPage + DEFAULT_MID_RANGE,\n    };\n  }\n\n  // End of page count.\n  if (currentPage > pageCount - 3) {\n    return {\n      minRange: pageCount - DEFAULT_UPPER_MID,\n      maxRange: pageCount,\n    };\n  }\n\n  return { minRange: DEFAULT_MIN_RANGE, maxRange: DEFAULT_MAX_RANGE };\n}\n"],"mappings":";;;;;;;;;;;;;;AAaA,MAAM,sBAAsB;AAC5B,MAAM,oBAAoB;AAC1B,MAAM,oBAAoB;AAC1B,MAAM,oBAAoB;AAC1B,MAAM,oBAAoB;AAE1B,SAAgB,MAAM,OAAe,KAAa;CAChD,MAAM,SAAS,MAAM,QAAQ;AAC7B,QAAO,MAAM,KAAK,EAAE,QAAQ,GAAG,GAAG,UAAU,QAAQ,MAAM;;AAI5D,SAAgB,qBACd,WACA,aACS;AACT,QACE,CAAC,aAAa,YAAY,KAAK,cAAc,KAAK,YAAY;;;;;;;;;;AAYlE,SAAgB,mBAAmB,WAAmB,aAAqB;AACzE,KACE,EAAE,aAAa,gBACf,cAAc,aACd,YAAY,KACZ,cAAc,EAEd,QAAO;EAAE,UAAU;EAAqB,UAAU;EAAqB;AAIzE,KAAI,YAAY,kBACd,QAAO;EACL,UAAU;EACV,UAAU;EACX;AAIH,KAAI,eAAe,KAAK,cAAc,YAAY,EAChD,QAAO;EACL,UAAU,cAAc;EACxB,UAAU,cAAc;EACzB;AAIH,KAAI,cAAc,YAAY,EAC5B,QAAO;EACL,UAAU,YAAY;EACtB,UAAU;EACX;AAGH,QAAO;EAAE,UAAU;EAAmB,UAAU;EAAmB"}
+{"version":3,"file":"utils.js","names":[],"sources":["../../../src/components/pagination/utils.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\nconst DEFAULT_EMPTY_RANGE = 0;\nconst DEFAULT_MIN_RANGE = 1;\nconst DEFAULT_MAX_RANGE = 5;\nconst DEFAULT_MID_RANGE = 2;\nconst DEFAULT_UPPER_MID = 4;\n\n/**\n * Creates an array of numbers from start to end (inclusive).\n *\n * @example\n * ```tsx\n * range(1, 5) // [1, 2, 3, 4, 5]\n * range(3, 7) // [3, 4, 5, 6, 7]\n * ```\n *\n * @param start - The starting number of the range.\n * @param end - The ending number of the range (inclusive).\n * @returns An array of sequential numbers from start to end.\n */\nexport function range(start: number, end: number) {\n  const length = end - start + 1;\n  return Array.from({ length }, (_, index) => index + start);\n}\n\n/**\n * Checks if navigation should be disabled based on page bounds.\n *\n * @example\n * ```tsx\n * isNavigationDisabled(10, 5) // false - valid navigation\n * isNavigationDisabled(0, 1)  // true - no pages\n * isNavigationDisabled(5, 10) // true - current page exceeds total\n * ```\n *\n * @param pageCount - Total number of pages.\n * @param currentPage - Current page number.\n * @returns True if pageCount or currentPage are invalid or out of bounds.\n */\nexport function isNavigationDisabled(\n  pageCount: number,\n  currentPage: number,\n): boolean {\n  return (\n    !pageCount || pageCount < 1 || currentPage < 1 || pageCount < currentPage\n  );\n}\n\n/**\n * Return min max range for visible pages. As per our design, we limit\n * the range of numbers to a spread of 5 maximum, getting the lower and upper bounds.\n *\n * @example\n * ```tsx\n * getPaginationRange(10, 1)  // { minRange: 1, maxRange: 5 }\n * getPaginationRange(10, 5)  // { minRange: 3, maxRange: 7 }\n * getPaginationRange(10, 10) // { minRange: 6, maxRange: 10 }\n * getPaginationRange(3, 2)   // { minRange: 1, maxRange: 3 }\n * ```\n *\n * @param pageCount - total page count\n * @param currentPage - current page\n * @returns - Range of 1 to 5 numbers.\n */\nexport function getPaginationRange(pageCount: number, currentPage: number) {\n  if (\n    !(pageCount && currentPage) ||\n    currentPage > pageCount ||\n    pageCount < 1 ||\n    currentPage < 1\n  ) {\n    return { minRange: DEFAULT_EMPTY_RANGE, maxRange: DEFAULT_EMPTY_RANGE };\n  }\n\n  // Below max display.\n  if (pageCount < DEFAULT_MAX_RANGE) {\n    return {\n      minRange: DEFAULT_MIN_RANGE,\n      maxRange: pageCount,\n    };\n  }\n\n  // Middle.\n  if (currentPage >= 3 && currentPage < pageCount - 2) {\n    return {\n      minRange: currentPage - DEFAULT_MID_RANGE,\n      maxRange: currentPage + DEFAULT_MID_RANGE,\n    };\n  }\n\n  // End of page count.\n  if (currentPage > pageCount - 3) {\n    return {\n      minRange: pageCount - DEFAULT_UPPER_MID,\n      maxRange: pageCount,\n    };\n  }\n\n  return { minRange: DEFAULT_MIN_RANGE, maxRange: DEFAULT_MAX_RANGE };\n}\n"],"mappings":";;;;;;;;;;;;;;AAaA,MAAM,sBAAsB;AAC5B,MAAM,oBAAoB;AAC1B,MAAM,oBAAoB;AAC1B,MAAM,oBAAoB;AAC1B,MAAM,oBAAoB;;;;;;;;;;;;;;AAe1B,SAAgB,MAAM,OAAe,KAAa;CAChD,MAAM,SAAS,MAAM,QAAQ;AAC7B,QAAO,MAAM,KAAK,EAAE,QAAQ,GAAG,GAAG,UAAU,QAAQ,MAAM;;;;;;;;;;;;;;;;AAiB5D,SAAgB,qBACd,WACA,aACS;AACT,QACE,CAAC,aAAa,YAAY,KAAK,cAAc,KAAK,YAAY;;;;;;;;;;;;;;;;;;AAoBlE,SAAgB,mBAAmB,WAAmB,aAAqB;AACzE,KACE,EAAE,aAAa,gBACf,cAAc,aACd,YAAY,KACZ,cAAc,EAEd,QAAO;EAAE,UAAU;EAAqB,UAAU;EAAqB;AAIzE,KAAI,YAAY,kBACd,QAAO;EACL,UAAU;EACV,UAAU;EACX;AAIH,KAAI,eAAe,KAAK,cAAc,YAAY,EAChD,QAAO;EACL,UAAU,cAAc;EACxB,UAAU,cAAc;EACzB;AAIH,KAAI,cAAc,YAAY,EAC5B,QAAO;EACL,UAAU,YAAY;EACtB,UAAU;EACX;AAGH,QAAO;EAAE,UAAU;EAAmB,UAAU;EAAmB"}

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

@@ -12,13 +12,31 @@
 
 import "client-only";
 import { ComponentPropsWithRef } from "react";
-import * as react_jsx_runtime123 from "react/jsx-runtime";
+import * as react_jsx_runtime111 from "react/jsx-runtime";
 
 //#region src/components/popover/content.d.ts
+
+/**
+ * PopoverContent - Main content area for the popover body
+ *
+ * @example
+ * ```tsx
+ * <Popover>
+ *   <PopoverTitle>Settings</PopoverTitle>
+ *   <PopoverContent>
+ *     <p>Configure your preferences here.</p>
+ *   </PopoverContent>
+ * </Popover>
+ * ```
+ *
+ * @param props - ComponentPropsWithRef<'div'>
+ * @param props.className - Optional CSS class name.
+ * @returns The rendered PopoverContent component.
+ */
 declare function PopoverContent({
   className,
   ...rest
-}: ComponentPropsWithRef<'div'>): react_jsx_runtime123.JSX.Element;
+}: ComponentPropsWithRef<'div'>): react_jsx_runtime111.JSX.Element;
 //#endregion
 export { PopoverContent };
 //# sourceMappingURL=content.d.ts.map

package/dist/components/popover/content.js

@@ -19,6 +19,23 @@ import { jsx } from "react/jsx-runtime";
 import styles from "./styles.module.css";
 
 //#region src/components/popover/content.tsx
+/**
+* PopoverContent - Main content area for the popover body
+*
+* @example
+* ```tsx
+* <Popover>
+*   <PopoverTitle>Settings</PopoverTitle>
+*   <PopoverContent>
+*     <p>Configure your preferences here.</p>
+*   </PopoverContent>
+* </Popover>
+* ```
+*
+* @param props - ComponentPropsWithRef<'div'>
+* @param props.className - Optional CSS class name.
+* @returns The rendered PopoverContent component.
+*/
 function PopoverContent({ className, ...rest }) {
 	return /* @__PURE__ */ jsx("div", {
 		...rest,

package/dist/components/popover/content.js.map

@@ -1 +1 @@
-{"version":3,"file":"content.js","names":[],"sources":["../../../src/components/popover/content.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\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport styles from './styles.module.css';\nimport type { ComponentPropsWithRef } from 'react';\n\nexport function PopoverContent({\n  className,\n  ...rest\n}: ComponentPropsWithRef<'div'>) {\n  return <div {...rest} className={clsx(styles.content, className)} />;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAmBA,SAAgB,eAAe,EAC7B,WACA,GAAG,QAC4B;AAC/B,QAAO,oBAAC;EAAI,GAAI;EAAM,WAAW,KAAK,OAAO,SAAS,UAAU;GAAI"}
+{"version":3,"file":"content.js","names":[],"sources":["../../../src/components/popover/content.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\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport styles from './styles.module.css';\nimport type { ComponentPropsWithRef } from 'react';\n\n/**\n * PopoverContent - Main content area for the popover body\n *\n * @example\n * ```tsx\n * <Popover>\n *   <PopoverTitle>Settings</PopoverTitle>\n *   <PopoverContent>\n *     <p>Configure your preferences here.</p>\n *   </PopoverContent>\n * </Popover>\n * ```\n *\n * @param props - ComponentPropsWithRef<'div'>\n * @param props.className - Optional CSS class name.\n * @returns The rendered PopoverContent component.\n */\nexport function PopoverContent({\n  className,\n  ...rest\n}: ComponentPropsWithRef<'div'>) {\n  return <div {...rest} className={clsx(styles.content, className)} />;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,SAAgB,eAAe,EAC7B,WACA,GAAG,QAC4B;AAC/B,QAAO,oBAAC;EAAI,GAAI;EAAM,WAAW,KAAK,OAAO,SAAS,UAAU;GAAI"}

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

@@ -12,13 +12,33 @@
 
 import "client-only";
 import { ComponentPropsWithRef } from "react";
-import * as react_jsx_runtime124 from "react/jsx-runtime";
+import * as react_jsx_runtime112 from "react/jsx-runtime";
 
 //#region src/components/popover/footer.d.ts
+
+/**
+ * PopoverFooter - Footer area for actions or additional content
+ *
+ * @example
+ * ```tsx
+ * <Popover>
+ *   <PopoverContent>Content here</PopoverContent>
+ *   <PopoverFooter>
+ *     <Button>Cancel</Button>
+ *     <Button>Save</Button>
+ *   </PopoverFooter>
+ * </Popover>
+ * ```
+ *
+ * @param props - ComponentPropsWithRef<'footer'>
+ * @param props.children - Footer content to render.
+ * @param props.className - Optional CSS class name.
+ * @returns The rendered PopoverFooter component.
+ */
 declare function PopoverFooter({
   children,
   className
-}: ComponentPropsWithRef<'footer'>): react_jsx_runtime124.JSX.Element;
+}: ComponentPropsWithRef<'footer'>): react_jsx_runtime112.JSX.Element;
 //#endregion
 export { PopoverFooter };
 //# sourceMappingURL=footer.d.ts.map

package/dist/components/popover/footer.js

@@ -19,6 +19,25 @@ import { jsx } from "react/jsx-runtime";
 import styles from "./styles.module.css";
 
 //#region src/components/popover/footer.tsx
+/**
+* PopoverFooter - Footer area for actions or additional content
+*
+* @example
+* ```tsx
+* <Popover>
+*   <PopoverContent>Content here</PopoverContent>
+*   <PopoverFooter>
+*     <Button>Cancel</Button>
+*     <Button>Save</Button>
+*   </PopoverFooter>
+* </Popover>
+* ```
+*
+* @param props - ComponentPropsWithRef<'footer'>
+* @param props.children - Footer content to render.
+* @param props.className - Optional CSS class name.
+* @returns The rendered PopoverFooter component.
+*/
 function PopoverFooter({ children, className }) {
 	return /* @__PURE__ */ jsx("footer", {
 		className: clsx(styles.footer, className),

package/dist/components/popover/footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"footer.js","names":[],"sources":["../../../src/components/popover/footer.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\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport styles from './styles.module.css';\nimport type { ComponentPropsWithRef } from 'react';\n\nexport function PopoverFooter({\n  children,\n  className,\n}: ComponentPropsWithRef<'footer'>) {\n  return <footer className={clsx(styles.footer, className)}>{children}</footer>;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAmBA,SAAgB,cAAc,EAC5B,UACA,aACkC;AAClC,QAAO,oBAAC;EAAO,WAAW,KAAK,OAAO,QAAQ,UAAU;EAAG;GAAkB"}
+{"version":3,"file":"footer.js","names":[],"sources":["../../../src/components/popover/footer.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\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport styles from './styles.module.css';\nimport type { ComponentPropsWithRef } from 'react';\n\n/**\n * PopoverFooter - Footer area for actions or additional content\n *\n * @example\n * ```tsx\n * <Popover>\n *   <PopoverContent>Content here</PopoverContent>\n *   <PopoverFooter>\n *     <Button>Cancel</Button>\n *     <Button>Save</Button>\n *   </PopoverFooter>\n * </Popover>\n * ```\n *\n * @param props - ComponentPropsWithRef<'footer'>\n * @param props.children - Footer content to render.\n * @param props.className - Optional CSS class name.\n * @returns The rendered PopoverFooter component.\n */\nexport function PopoverFooter({\n  children,\n  className,\n}: ComponentPropsWithRef<'footer'>) {\n  return <footer className={clsx(styles.footer, className)}>{children}</footer>;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCA,SAAgB,cAAc,EAC5B,UACA,aACkC;AAClC,QAAO,oBAAC;EAAO,WAAW,KAAK,OAAO,QAAQ,UAAU;EAAG;GAAkB"}

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

@@ -12,7 +12,7 @@
 
 import { PopoverProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime127 from "react/jsx-runtime";
+import * as react_jsx_runtime113 from "react/jsx-runtime";
 
 //#region src/components/popover/index.d.ts
 
@@ -46,12 +46,19 @@ import * as react_jsx_runtime127 from "react/jsx-runtime";
  *     </PopoverContent>
  *   </Popover>
  * </PopoverTrigger>
+ *
+ * @param props - {@link PopoverProps}
+ * @param props.children - Content to render inside the popover dialog.
+ * @param props.classNames - CSS class names for popover elements.
+ * @param props.dialogProps - Additional props passed to the Dialog component.
+ * @returns The rendered Popover component.
  */
 declare function Popover({
   children,
   classNames,
+  dialogProps,
   ...rest
-}: PopoverProps): react_jsx_runtime127.JSX.Element;
+}: PopoverProps): react_jsx_runtime113.JSX.Element;
 //#endregion
 export { Popover };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/popover/index.js

@@ -50,12 +50,19 @@ import styles from "./styles.module.css";
 *     </PopoverContent>
 *   </Popover>
 * </PopoverTrigger>
+*
+* @param props - {@link PopoverProps}
+* @param props.children - Content to render inside the popover dialog.
+* @param props.classNames - CSS class names for popover elements.
+* @param props.dialogProps - Additional props passed to the Dialog component.
+* @returns The rendered Popover component.
 */
-function Popover({ children, classNames, ...rest }) {
+function Popover({ children, classNames, dialogProps, ...rest }) {
 	return /* @__PURE__ */ jsx(Popover$1, {
 		...rest,
 		className: clsx(styles.popover, classNames?.popover),
 		children: /* @__PURE__ */ jsx(Dialog, {
+			...dialogProps,
 			className: clsx(styles.dialog, classNames?.dialog),
 			children
 		})

package/dist/components/popover/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["AriaPopover"],"sources":["../../../src/components/popover/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\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { Popover as AriaPopover, Dialog } from 'react-aria-components';\nimport styles from './styles.module.css';\nimport type { PopoverProps } from './types';\n\n/**\n * Popover - A floating content container positioned relative to a trigger element\n *\n * Provides accessible popover functionality with flexible positioning and content\n * organization. Perfect for contextual information, menus, or supplementary content\n * that appears on demand without interrupting the user's workflow.\n *\n * @example\n * // Basic popover\n * <PopoverTrigger>\n *   <Button>Show Info</Button>\n *   <Popover>\n *     <PopoverContent>\n *       <p>Additional information appears here</p>\n *     </PopoverContent>\n *   </Popover>\n * </PopoverTrigger>\n *\n * @example\n * // Popover with title and actions\n * <PopoverTrigger>\n *   <Button>Options</Button>\n *   <Popover placement=\"top\">\n *     <PopoverTitle>Quick Actions</PopoverTitle>\n *     <PopoverContent>\n *       <Button>Edit</Button>\n *       <Button>Delete</Button>\n *     </PopoverContent>\n *   </Popover>\n * </PopoverTrigger>\n */\nexport function Popover({ children, classNames, ...rest }: PopoverProps) {\n  return (\n    <AriaPopover\n      {...rest}\n      className={clsx(styles.popover, classNames?.popover)}\n    >\n      <Dialog className={clsx(styles.dialog, classNames?.dialog)}>\n        {children}\n      </Dialog>\n    </AriaPopover>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDA,SAAgB,QAAQ,EAAE,UAAU,YAAY,GAAG,QAAsB;AACvE,QACE,oBAACA;EACC,GAAI;EACJ,WAAW,KAAK,OAAO,SAAS,YAAY,QAAQ;YAEpD,oBAAC;GAAO,WAAW,KAAK,OAAO,QAAQ,YAAY,OAAO;GACvD;IACM;GACG"}
+{"version":3,"file":"index.js","names":["AriaPopover"],"sources":["../../../src/components/popover/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\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { Popover as AriaPopover, Dialog } from 'react-aria-components';\nimport styles from './styles.module.css';\nimport type { PopoverProps } from './types';\n\n/**\n * Popover - A floating content container positioned relative to a trigger element\n *\n * Provides accessible popover functionality with flexible positioning and content\n * organization. Perfect for contextual information, menus, or supplementary content\n * that appears on demand without interrupting the user's workflow.\n *\n * @example\n * // Basic popover\n * <PopoverTrigger>\n *   <Button>Show Info</Button>\n *   <Popover>\n *     <PopoverContent>\n *       <p>Additional information appears here</p>\n *     </PopoverContent>\n *   </Popover>\n * </PopoverTrigger>\n *\n * @example\n * // Popover with title and actions\n * <PopoverTrigger>\n *   <Button>Options</Button>\n *   <Popover placement=\"top\">\n *     <PopoverTitle>Quick Actions</PopoverTitle>\n *     <PopoverContent>\n *       <Button>Edit</Button>\n *       <Button>Delete</Button>\n *     </PopoverContent>\n *   </Popover>\n * </PopoverTrigger>\n *\n * @param props - {@link PopoverProps}\n * @param props.children - Content to render inside the popover dialog.\n * @param props.classNames - CSS class names for popover elements.\n * @param props.dialogProps - Additional props passed to the Dialog component.\n * @returns The rendered Popover component.\n */\nexport function Popover({\n  children,\n  classNames,\n  dialogProps,\n  ...rest\n}: PopoverProps) {\n  return (\n    <AriaPopover\n      {...rest}\n      className={clsx(styles.popover, classNames?.popover)}\n    >\n      <Dialog\n        {...dialogProps}\n        className={clsx(styles.dialog, classNames?.dialog)}\n      >\n        {children}\n      </Dialog>\n    </AriaPopover>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyDA,SAAgB,QAAQ,EACtB,UACA,YACA,aACA,GAAG,QACY;AACf,QACE,oBAACA;EACC,GAAI;EACJ,WAAW,KAAK,OAAO,SAAS,YAAY,QAAQ;YAEpD,oBAAC;GACC,GAAI;GACJ,WAAW,KAAK,OAAO,QAAQ,YAAY,OAAO;GAEjD;IACM;GACG"}

package/dist/components/popover/styles.module.css

@@ -29,4 +29,10 @@
   .footer {
     @apply mt-s gap-s flex justify-end;
   }
+
+  .dialog {
+    @variant focus-visible {
+      @apply outline-none;
+    }
+  }
 }

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

@@ -12,13 +12,28 @@
 
 import "client-only";
 import { HeadingProps } from "react-aria-components";
-import * as react_jsx_runtime128 from "react/jsx-runtime";
+import * as react_jsx_runtime114 from "react/jsx-runtime";
 
 //#region src/components/popover/title.d.ts
+/**
+ * PopoverTitle - Semantic heading for the popover
+ *
+ * @example
+ * ```tsx
+ * <Popover>
+ *   <PopoverTitle>User Settings</PopoverTitle>
+ *   <PopoverContent>Settings content</PopoverContent>
+ * </Popover>
+ * ```
+ *
+ * @param props - HeadingProps from react-aria-components.
+ * @param props.className - Optional CSS class name.
+ * @returns The rendered PopoverTitle component.
+ */
 declare function PopoverTitle({
   className,
   ...rest
-}: HeadingProps): react_jsx_runtime128.JSX.Element;
+}: HeadingProps): react_jsx_runtime114.JSX.Element;
 //#endregion
 export { PopoverTitle };
 //# sourceMappingURL=title.d.ts.map

package/dist/components/popover/title.js

@@ -20,6 +20,21 @@ import { jsx } from "react/jsx-runtime";
 import styles from "./styles.module.css";
 
 //#region src/components/popover/title.tsx
+/**
+* PopoverTitle - Semantic heading for the popover
+*
+* @example
+* ```tsx
+* <Popover>
+*   <PopoverTitle>User Settings</PopoverTitle>
+*   <PopoverContent>Settings content</PopoverContent>
+* </Popover>
+* ```
+*
+* @param props - HeadingProps from react-aria-components.
+* @param props.className - Optional CSS class name.
+* @returns The rendered PopoverTitle component.
+*/
 function PopoverTitle({ className, ...rest }) {
 	return /* @__PURE__ */ jsx(Heading, {
 		...rest,

package/dist/components/popover/title.js.map

@@ -1 +1 @@
-{"version":3,"file":"title.js","names":["AriaHeading"],"sources":["../../../src/components/popover/title.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\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport {\n  Heading as AriaHeading,\n  type HeadingProps,\n} from 'react-aria-components';\nimport styles from './styles.module.css';\n\nexport function PopoverTitle({ className, ...rest }: HeadingProps) {\n  return (\n    <AriaHeading\n      {...rest}\n      slot='title'\n      className={clsx(styles.title, className)}\n    />\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAsBA,SAAgB,aAAa,EAAE,WAAW,GAAG,QAAsB;AACjE,QACE,oBAACA;EACC,GAAI;EACJ,MAAK;EACL,WAAW,KAAK,OAAO,OAAO,UAAU;GACxC"}
+{"version":3,"file":"title.js","names":["AriaHeading"],"sources":["../../../src/components/popover/title.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\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport {\n  Heading as AriaHeading,\n  type HeadingProps,\n} from 'react-aria-components';\nimport styles from './styles.module.css';\n\n/**\n * PopoverTitle - Semantic heading for the popover\n *\n * @example\n * ```tsx\n * <Popover>\n *   <PopoverTitle>User Settings</PopoverTitle>\n *   <PopoverContent>Settings content</PopoverContent>\n * </Popover>\n * ```\n *\n * @param props - HeadingProps from react-aria-components.\n * @param props.className - Optional CSS class name.\n * @returns The rendered PopoverTitle component.\n */\nexport function PopoverTitle({ className, ...rest }: HeadingProps) {\n  return (\n    <AriaHeading\n      {...rest}\n      slot='title'\n      className={clsx(styles.title, className)}\n    />\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCA,SAAgB,aAAa,EAAE,WAAW,GAAG,QAAsB;AACjE,QACE,oBAACA;EACC,GAAI;EACJ,MAAK;EACL,WAAW,KAAK,OAAO,OAAO,UAAU;GACxC"}

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

@@ -12,14 +12,36 @@
 
 import { PopoverTriggerProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime4 from "react/jsx-runtime";
+import * as react_jsx_runtime115 from "react/jsx-runtime";
 
 //#region src/components/popover/trigger.d.ts
+
+/**
+ * PopoverTrigger - Root component that manages popover state and positioning
+ *
+ * Wraps a trigger element and its associated Popover. The first child becomes
+ * the trigger, and the second child should be a Popover component.
+ *
+ * @example
+ * ```tsx
+ * <PopoverTrigger>
+ *   <Button>Open</Button>
+ *   <Popover>
+ *     <PopoverContent>Content here</PopoverContent>
+ *   </Popover>
+ * </PopoverTrigger>
+ * ```
+ *
+ * @param props - {@link PopoverTriggerProps}
+ * @param props.ref - Forwarded ref to the trigger element.
+ * @param props.children - Trigger element and Popover component.
+ * @returns The rendered PopoverTrigger component.
+ */
 declare function PopoverTrigger({
   ref,
   children,
   ...rest
-}: PopoverTriggerProps): react_jsx_runtime4.JSX.Element;
+}: PopoverTriggerProps): react_jsx_runtime115.JSX.Element;
 //#endregion
 export { PopoverTrigger };
 //# sourceMappingURL=trigger.d.ts.map

package/dist/components/popover/trigger.js

@@ -20,6 +20,27 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { Pressable as Pressable$1 } from "@react-aria/interactions";
 
 //#region src/components/popover/trigger.tsx
+/**
+* PopoverTrigger - Root component that manages popover state and positioning
+*
+* Wraps a trigger element and its associated Popover. The first child becomes
+* the trigger, and the second child should be a Popover component.
+*
+* @example
+* ```tsx
+* <PopoverTrigger>
+*   <Button>Open</Button>
+*   <Popover>
+*     <PopoverContent>Content here</PopoverContent>
+*   </Popover>
+* </PopoverTrigger>
+* ```
+*
+* @param props - {@link PopoverTriggerProps}
+* @param props.ref - Forwarded ref to the trigger element.
+* @param props.children - Trigger element and Popover component.
+* @returns The rendered PopoverTrigger component.
+*/
 function PopoverTrigger({ ref, children, ...rest }) {
 	const [trigger, popover] = Children.toArray(children);
 	return /* @__PURE__ */ jsxs(DialogTrigger, {

package/dist/components/popover/trigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"trigger.js","names":["Pressable"],"sources":["../../../src/components/popover/trigger.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\n'use client';\n\nimport 'client-only';\nimport { Pressable } from '@react-aria/interactions';\nimport {\n  Children,\n  type DOMAttributes,\n  type ReactElement,\n  type ReactNode,\n} from 'react';\nimport { DialogTrigger } from 'react-aria-components';\nimport type { FocusableElement } from '@react-types/shared';\nimport type { PopoverTriggerProps } from './types';\n\nexport function PopoverTrigger({\n  ref,\n  children,\n  ...rest\n}: PopoverTriggerProps) {\n  const [trigger, popover] = Children.toArray(children) as [\n    ReactElement<DOMAttributes<FocusableElement>, string>,\n    ReactNode,\n  ];\n\n  return (\n    <DialogTrigger {...rest}>\n      <Pressable ref={ref}>{trigger}</Pressable>\n      {popover}\n    </DialogTrigger>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA0BA,SAAgB,eAAe,EAC7B,KACA,UACA,GAAG,QACmB;CACtB,MAAM,CAAC,SAAS,WAAW,SAAS,QAAQ,SAAS;AAKrD,QACE,qBAAC;EAAc,GAAI;aACjB,oBAACA;GAAe;aAAM;IAAoB,EACzC;GACa"}
+{"version":3,"file":"trigger.js","names":["Pressable"],"sources":["../../../src/components/popover/trigger.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\n'use client';\n\nimport 'client-only';\nimport { Pressable } from '@react-aria/interactions';\nimport {\n  Children,\n  type DOMAttributes,\n  type ReactElement,\n  type ReactNode,\n} from 'react';\nimport { DialogTrigger } from 'react-aria-components';\nimport type { FocusableElement } from '@react-types/shared';\nimport type { PopoverTriggerProps } from './types';\n\n/**\n * PopoverTrigger - Root component that manages popover state and positioning\n *\n * Wraps a trigger element and its associated Popover. The first child becomes\n * the trigger, and the second child should be a Popover component.\n *\n * @example\n * ```tsx\n * <PopoverTrigger>\n *   <Button>Open</Button>\n *   <Popover>\n *     <PopoverContent>Content here</PopoverContent>\n *   </Popover>\n * </PopoverTrigger>\n * ```\n *\n * @param props - {@link PopoverTriggerProps}\n * @param props.ref - Forwarded ref to the trigger element.\n * @param props.children - Trigger element and Popover component.\n * @returns The rendered PopoverTrigger component.\n */\nexport function PopoverTrigger({\n  ref,\n  children,\n  ...rest\n}: PopoverTriggerProps) {\n  const [trigger, popover] = Children.toArray(children) as [\n    ReactElement<DOMAttributes<FocusableElement>, string>,\n    ReactNode,\n  ];\n\n  return (\n    <DialogTrigger {...rest}>\n      <Pressable ref={ref}>{trigger}</Pressable>\n      {popover}\n    </DialogTrigger>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+CA,SAAgB,eAAe,EAC7B,KACA,UACA,GAAG,QACmB;CACtB,MAAM,CAAC,SAAS,WAAW,SAAS,QAAQ,SAAS;AAKrD,QACE,qBAAC;EAAc,GAAI;aACjB,oBAACA;GAAe;aAAM;IAAoB,EACzC;GACa"}

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_runtime31 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_runtime31.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,