@seeqdev/qomponents 0.0.214 → 0.0.216

package/dist/src/ButtonWithPopover/ButtonWithPopover.types.d.ts

@@ -1,134 +1,139 @@
-import React from 'react';
-import { TooltipComponentProps } from '../Tooltip/Tooltip.types';
+import { TooltipComponentProps } from "../Tooltip/Tooltip.types.js";
+import React from "react";
+
+//#region src/ButtonWithPopover/ButtonWithPopover.types.d.ts
+
 /**
  * Props for the ButtonWithPopover component that creates a button with an attached popover.
  * Extends TooltipComponentProps to support tooltip functionality on the trigger button.
  */
-export interface ButtonWithPopoverProps extends TooltipComponentProps {
-    /**
-     * React element to use as the clickable trigger for the popover.
-     * Can be an icon, text, button, or any interactive element that users click to open the popover.
-     */
-    trigger?: React.ReactNode;
-    /**
-     * Content to display inside the popover when it's open.
-     * Can be any React elements including forms, lists, complex layouts, or interactive components.
-     */
-    children: React.ReactNode;
-    /**
-     * HTML ID attribute for the popover trigger element.
-     * Should be unique across the page for proper HTML semantics and accessibility.
-     */
-    id?: string;
-    /**
-     * Test ID attribute for the popover container element used in automated testing.
-     * Applied to the main container that wraps both trigger and popover content.
-     */
-    containerTestId?: string;
-    /**
-     * When true, disables the popover trigger preventing user interaction.
-     * Disabled triggers appear visually dimmed and don't open the popover when clicked.
-     */
-    disabled?: boolean;
-    /**
-     * Callback function triggered when the trigger is clicked.
-     * Receives the current open state as a parameter. Note: this doesn't control popover opening,
-     * it's mainly for tracking or analytics purposes.
-     */
-    onClick?: (isOpen: boolean) => void;
-    /**
-     * Horizontal alignment of the popover content relative to the trigger:
-     * - `start`: Aligns to the left edge of the trigger
-     * - `center`: Centers the popover on the trigger
-     * - `end`: Aligns to the right edge of the trigger
-     */
-    align?: 'start' | 'center' | 'end';
-    /**
-     * Numeric offset in pixels from the aligned position.
-     * Positive values move the popover further from the trigger in the align direction.
-     */
-    alignOffset?: number;
-    /**
-     * Position of the popover relative to the trigger element:
-     * - `top`: Popover appears above the trigger
-     * - `bottom`: Popover appears below the trigger
-     * - `left`: Popover appears to the left of the trigger
-     * - `right`: Popover appears to the right of the trigger
-     */
-    placement?: 'top' | 'bottom' | 'left' | 'right';
-    /**
-     * Numeric offset in pixels from the placement position.
-     * Positive values move the popover further away from the trigger.
-     */
-    placementOffset?: number;
-    /**
-     * Controls whether the popover is currently open and visible.
-     * Use this for controlled popover behavior where you manage open state externally.
-     */
-    isOpen?: boolean;
-    /**
-     * Callback function triggered when the popover open state changes.
-     * Receives the new open state as a boolean parameter. Use this to sync with external state.
-     */
-    onOpenChange?: (isOpen: boolean) => void;
-    /**
-     * When true, displays a visual arrow pointing from the popover to the trigger.
-     * Helps users understand the relationship between trigger and popover content.
-     */
-    hasArrow?: boolean;
-    /**
-     * When true, enables the popover to open when hovering over the trigger.
-     * Useful for preview or quick-info popovers that don't require clicking.
-     */
-    isHoverEnabled?: boolean;
-    /**
-     * Delay in milliseconds before the popover opens when hover is enabled.
-     * Prevents accidental popover opening from brief mouse movements.
-     * Only relevant when `isHoverEnabled` is true.
-     */
-    hoverOpenDelay?: number;
-    /**
-     * Additional CSS classes to apply to the trigger container element.
-     * Use this to customize the trigger's appearance beyond default styling.
-     */
-    extraTriggerClassNames?: string;
-    /**
-     * Additional CSS classes to apply to the popover content container.
-     * Use this to customize the popover's appearance, spacing, or styling.
-     */
-    extraPopoverClassNames?: string;
-    /**
-     * When true, automatically closes the popover when any content inside it is clicked.
-     * Useful for action popovers where selecting an option should close the popover.
-     */
-    isCloseOnContentClick?: boolean;
-    /**
-     * Callback function triggered when user interacts outside the popover content.
-     * This includes clicks, taps, and focus events outside the popover area.
-     * Use this to handle outside interactions or implement custom close behavior.
-     */
-    onInteractOutside?: () => void;
-    /**
-     * Callback function triggered when user clicks/taps outside the popover content.
-     * More specific than `onInteractOutside`, focusing only on pointer down events.
-     * Use this for custom outside-click handling.
-     */
-    onPointerDownOutside?: () => void;
-    /**
-     * When true, merges the trigger functionality with the provided trigger element.
-     * Instead of wrapping the trigger in a button, it adds trigger behavior to the element itself.
-     * Useful when the trigger element is already interactive.
-     */
-    isTriggerAsChild?: boolean;
-    /**
-     * When true, makes the trigger button expand to fill the full width of its container.
-     * Useful for layout consistency or when the trigger should span the available space.
-     */
-    shouldTriggerFullWidth?: boolean;
-    /**
-     * When true, renders the popover content in a React portal.
-     * This moves the popover to the end of the document body, which can help with
-     * z-index issues and ensure the popover appears above other content.
-     */
-    isPortal?: boolean;
+interface ButtonWithPopoverProps extends TooltipComponentProps {
+  /**
+   * React element to use as the clickable trigger for the popover.
+   * Can be an icon, text, button, or any interactive element that users click to open the popover.
+   */
+  trigger?: React.ReactNode;
+  /**
+   * Content to display inside the popover when it's open.
+   * Can be any React elements including forms, lists, complex layouts, or interactive components.
+   */
+  children: React.ReactNode;
+  /**
+   * HTML ID attribute for the popover trigger element.
+   * Should be unique across the page for proper HTML semantics and accessibility.
+   */
+  id?: string;
+  /**
+   * Test ID attribute for the popover container element used in automated testing.
+   * Applied to the main container that wraps both trigger and popover content.
+   */
+  containerTestId?: string;
+  /**
+   * When true, disables the popover trigger preventing user interaction.
+   * Disabled triggers appear visually dimmed and don't open the popover when clicked.
+   */
+  disabled?: boolean;
+  /**
+   * Callback function triggered when the trigger is clicked.
+   * Receives the current open state as a parameter. Note: this doesn't control popover opening,
+   * it's mainly for tracking or analytics purposes.
+   */
+  onClick?: (isOpen: boolean) => void;
+  /**
+   * Horizontal alignment of the popover content relative to the trigger:
+   * - `start`: Aligns to the left edge of the trigger
+   * - `center`: Centers the popover on the trigger
+   * - `end`: Aligns to the right edge of the trigger
+   */
+  align?: 'start' | 'center' | 'end';
+  /**
+   * Numeric offset in pixels from the aligned position.
+   * Positive values move the popover further from the trigger in the align direction.
+   */
+  alignOffset?: number;
+  /**
+   * Position of the popover relative to the trigger element:
+   * - `top`: Popover appears above the trigger
+   * - `bottom`: Popover appears below the trigger
+   * - `left`: Popover appears to the left of the trigger
+   * - `right`: Popover appears to the right of the trigger
+   */
+  placement?: 'top' | 'bottom' | 'left' | 'right';
+  /**
+   * Numeric offset in pixels from the placement position.
+   * Positive values move the popover further away from the trigger.
+   */
+  placementOffset?: number;
+  /**
+   * Controls whether the popover is currently open and visible.
+   * Use this for controlled popover behavior where you manage open state externally.
+   */
+  isOpen?: boolean;
+  /**
+   * Callback function triggered when the popover open state changes.
+   * Receives the new open state as a boolean parameter. Use this to sync with external state.
+   */
+  onOpenChange?: (isOpen: boolean) => void;
+  /**
+   * When true, displays a visual arrow pointing from the popover to the trigger.
+   * Helps users understand the relationship between trigger and popover content.
+   */
+  hasArrow?: boolean;
+  /**
+   * When true, enables the popover to open when hovering over the trigger.
+   * Useful for preview or quick-info popovers that don't require clicking.
+   */
+  isHoverEnabled?: boolean;
+  /**
+   * Delay in milliseconds before the popover opens when hover is enabled.
+   * Prevents accidental popover opening from brief mouse movements.
+   * Only relevant when `isHoverEnabled` is true.
+   */
+  hoverOpenDelay?: number;
+  /**
+   * Additional CSS classes to apply to the trigger container element.
+   * Use this to customize the trigger's appearance beyond default styling.
+   */
+  extraTriggerClassNames?: string;
+  /**
+   * Additional CSS classes to apply to the popover content container.
+   * Use this to customize the popover's appearance, spacing, or styling.
+   */
+  extraPopoverClassNames?: string;
+  /**
+   * When true, automatically closes the popover when any content inside it is clicked.
+   * Useful for action popovers where selecting an option should close the popover.
+   */
+  isCloseOnContentClick?: boolean;
+  /**
+   * Callback function triggered when user interacts outside the popover content.
+   * This includes clicks, taps, and focus events outside the popover area.
+   * Use this to handle outside interactions or implement custom close behavior.
+   */
+  onInteractOutside?: () => void;
+  /**
+   * Callback function triggered when user clicks/taps outside the popover content.
+   * More specific than `onInteractOutside`, focusing only on pointer down events.
+   * Use this for custom outside-click handling.
+   */
+  onPointerDownOutside?: () => void;
+  /**
+   * When true, merges the trigger functionality with the provided trigger element.
+   * Instead of wrapping the trigger in a button, it adds trigger behavior to the element itself.
+   * Useful when the trigger element is already interactive.
+   */
+  isTriggerAsChild?: boolean;
+  /**
+   * When true, makes the trigger button expand to fill the full width of its container.
+   * Useful for layout consistency or when the trigger should span the available space.
+   */
+  shouldTriggerFullWidth?: boolean;
+  /**
+   * When true, renders the popover content in a React portal.
+   * This moves the popover to the end of the document body, which can help with
+   * z-index issues and ensure the popover appears above other content.
+   */
+  isPortal?: boolean;
 }
+//#endregion
+export { ButtonWithPopoverProps };

package/dist/src/ButtonWithPopover/index.d.ts

@@ -1 +1,2 @@
-export { default } from './ButtonWithPopover';
+import ButtonWithPopover from "./ButtonWithPopover.js";
+export { ButtonWithPopover as default };

package/dist/src/Carousel/Carousel.d.ts

@@ -1,9 +1,13 @@
-import React from 'react';
-import { CarouselProps } from './Carousel.types';
+import { CarouselProps } from "./Carousel.types.js";
+import React from "react";
+
+//#region src/Carousel/Carousel.d.ts
+
 /**
  * Carousel:
  *  - Easily create a carousel with custom slides.
  *  - Supports automatic sliding, navigation arrows, and slide indicators.
  */
 declare const Carousel: React.FunctionComponent<CarouselProps>;
-export default Carousel;
+//#endregion
+export { Carousel as default };

package/dist/src/Carousel/Carousel.types.d.ts

@@ -1,85 +1,88 @@
+//#region src/Carousel/Carousel.types.d.ts
 /**
  * Properties for the Carousel component that creates a sliding content viewer.
  */
-export interface CarouselProps {
-    /**
-     * Test ID attribute for the carousel container used in automated testing.
-     * Applied to the main carousel element for test targeting and interaction.
-     */
-    testId?: string;
-    /**
-     * Additional CSS classes to apply to the carousel container.
-     * Use this to customize the carousel's appearance, spacing, or layout beyond default styling.
-     */
-    extraClassNames?: string;
-    /**
-     * Zero-based index of the currently visible/active slide.
-     * Use this for controlled carousel behavior where you manage the active slide externally.
-     * When not provided, the carousel manages its own internal state.
-     */
-    activeIndex?: number;
-    /**
-     * Callback function triggered when the slide changes due to user interaction or auto-sliding.
-     * Receives the new slide index and the direction of transition.
-     * Use this to sync with external state or implement custom slide change logic.
-     * @param nextSlide - The zero-based index of the slide that will become active
-     * @param direction - The direction of the slide transition ('left' or 'right')
-     */
-    onSlide?: (nextSlide: number, direction: 'left' | 'right') => void;
-    /**
-     * When true, enables automatic slide transitions at regular intervals.
-     * The carousel will continuously advance to the next slide without user interaction.
-     * Useful for image galleries, testimonials, or promotional content.
-     */
-    autoSlide?: boolean;
-    /**
-     * Time interval in milliseconds between automatic slide transitions.
-     * Only relevant when `autoSlide` is true. Controls how long each slide is displayed
-     * before automatically advancing to the next one.
-     * @default 3000
-     */
-    interval?: number;
-    /**
-     * Icon class name for the "next" navigation arrow.
-     * Typically uses FontAwesome classes (e.g., 'fc-chevron-right').
-     * Displayed on the right side to advance to the next slide.
-     */
-    nextIcon?: string;
-    /**
-     * Icon class name for the "previous" navigation arrow.
-     * Typically uses FontAwesome classes (e.g., 'fc-chevron-left').
-     * Displayed on the left side to go back to the previous slide.
-     */
-    prevIcon?: string;
-    /**
-     * Additional CSS classes to apply to both navigation arrow icons.
-     * Use this to customize the size, color, or styling of the arrow icons.
-     */
-    iconExtraClassNames?: string;
-    /**
-     * When true, displays clickable navigation arrows on the left and right sides.
-     * Allows users to manually navigate between slides by clicking the arrows.
-     * @default true
-     */
-    showArrows?: boolean;
-    /**
-     * When true, displays clickable dot indicators at the bottom of the carousel.
-     * Each dot represents a slide and allows direct navigation to any slide.
-     * The active slide's indicator is visually highlighted.
-     * @default true
-     */
-    showIndicators?: boolean;
-    /**
-     * When true, enables continuous looping through slides.
-     * After the last slide, clicking "next" will go to the first slide.
-     * Before the first slide, clicking "previous" will go to the last slide.
-     * @default true
-     */
-    continuous?: boolean;
-    /**
-     * Array of React elements to display as carousel slides.
-     * Each item represents one slide and can contain any content including
-     * images, text, cards, or complex components. The order determines slide sequence.
-     */
-    carouselItems: React.ReactNode[];
+interface CarouselProps {
+  /**
+   * Test ID attribute for the carousel container used in automated testing.
+   * Applied to the main carousel element for test targeting and interaction.
+   */
+  testId?: string;
+  /**
+   * Additional CSS classes to apply to the carousel container.
+   * Use this to customize the carousel's appearance, spacing, or layout beyond default styling.
+   */
+  extraClassNames?: string;
+  /**
+   * Zero-based index of the currently visible/active slide.
+   * Use this for controlled carousel behavior where you manage the active slide externally.
+   * When not provided, the carousel manages its own internal state.
+   */
+  activeIndex?: number;
+  /**
+   * Callback function triggered when the slide changes due to user interaction or auto-sliding.
+   * Receives the new slide index and the direction of transition.
+   * Use this to sync with external state or implement custom slide change logic.
+   * @param nextSlide - The zero-based index of the slide that will become active
+   * @param direction - The direction of the slide transition ('left' or 'right')
+   */
+  onSlide?: (nextSlide: number, direction: 'left' | 'right') => void;
+  /**
+   * When true, enables automatic slide transitions at regular intervals.
+   * The carousel will continuously advance to the next slide without user interaction.
+   * Useful for image galleries, testimonials, or promotional content.
+   */
+  autoSlide?: boolean;
+  /**
+   * Time interval in milliseconds between automatic slide transitions.
+   * Only relevant when `autoSlide` is true. Controls how long each slide is displayed
+   * before automatically advancing to the next one.
+   * @default 3000
+   */
+  interval?: number;
+  /**
+   * Icon class name for the "next" navigation arrow.
+   * Typically uses FontAwesome classes (e.g., 'fc-chevron-right').
+   * Displayed on the right side to advance to the next slide.
+   */
+  nextIcon?: string;
+  /**
+   * Icon class name for the "previous" navigation arrow.
+   * Typically uses FontAwesome classes (e.g., 'fc-chevron-left').
+   * Displayed on the left side to go back to the previous slide.
+   */
+  prevIcon?: string;
+  /**
+   * Additional CSS classes to apply to both navigation arrow icons.
+   * Use this to customize the size, color, or styling of the arrow icons.
+   */
+  iconExtraClassNames?: string;
+  /**
+   * When true, displays clickable navigation arrows on the left and right sides.
+   * Allows users to manually navigate between slides by clicking the arrows.
+   * @default true
+   */
+  showArrows?: boolean;
+  /**
+   * When true, displays clickable dot indicators at the bottom of the carousel.
+   * Each dot represents a slide and allows direct navigation to any slide.
+   * The active slide's indicator is visually highlighted.
+   * @default true
+   */
+  showIndicators?: boolean;
+  /**
+   * When true, enables continuous looping through slides.
+   * After the last slide, clicking "next" will go to the first slide.
+   * Before the first slide, clicking "previous" will go to the last slide.
+   * @default true
+   */
+  continuous?: boolean;
+  /**
+   * Array of React elements to display as carousel slides.
+   * Each item represents one slide and can contain any content including
+   * images, text, cards, or complex components. The order determines slide sequence.
+   */
+  carouselItems: React.ReactNode[];
 }
+//#endregion
+export { CarouselProps };

package/dist/src/Carousel/index.d.ts

@@ -1 +1,2 @@
-export { default } from './Carousel';
+import Carousel from "./Carousel.js";
+export { Carousel as default };

package/dist/src/Checkbox/Checkbox.d.ts

@@ -1,6 +1,11 @@
-import React from 'react';
-import { CheckboxProps } from './Checkbox.types';
+import { CheckboxProps } from "./Checkbox.types.js";
+import React from "react";
+
+//#region src/Checkbox/Checkbox.d.ts
+
 /**
  * Checkbox and Radio Box Component.
  */
-export declare const Checkbox: React.FunctionComponent<CheckboxProps>;
+declare const Checkbox: React.FunctionComponent<CheckboxProps>;
+//#endregion
+export { Checkbox };