@seeqdev/qomponents 0.0.221 → 0.0.223

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  import { BadgeProps } from "./Badge.types.js";
2
- import * as react_jsx_runtime2 from "react/jsx-runtime";
2
+ import * as react_jsx_runtime0 from "react/jsx-runtime";
3
3
 
4
4
  //#region src/Badge/Badge.d.ts
5
5
  /**
@@ -10,6 +10,6 @@ declare const Badge: ({
10
10
  variant,
11
11
  testId,
12
12
  extraClassNames
13
- }: BadgeProps) => react_jsx_runtime2.JSX.Element;
13
+ }: BadgeProps) => react_jsx_runtime0.JSX.Element;
14
14
  //#endregion
15
15
  export { Badge, Badge as default };
@@ -0,0 +1,17 @@
1
+ import { ColorPickerControlProps } from "./ColorPickerControl.types.js";
2
+ import * as react_jsx_runtime3 from "react/jsx-runtime";
3
+
4
+ //#region src/ColorPickerControl/ColorPickerControl.d.ts
5
+ declare function ColorPickerControl({
6
+ color,
7
+ label,
8
+ children,
9
+ placement,
10
+ align,
11
+ extraClassNames,
12
+ id,
13
+ testId,
14
+ onOpen
15
+ }: ColorPickerControlProps): react_jsx_runtime3.JSX.Element;
16
+ //#endregion
17
+ export { ColorPickerControl as default };
@@ -0,0 +1,25 @@
1
+ import { ReactNode } from "react";
2
+
3
+ //#region src/ColorPickerControl/ColorPickerControl.types.d.ts
4
+ interface ColorPickerControlProps {
5
+ /** The currently selected color, displayed as a square swatch inside the trigger button. */
6
+ color: string;
7
+ /** Label text rendered alongside the swatch trigger button. */
8
+ label: string;
9
+ /** Content rendered inside the popover when the trigger is clicked, typically a color palette. */
10
+ children?: ReactNode;
11
+ /** Optional click callback on the color swatch, e.g. when embedded inside a parent popover trigger. */
12
+ onOpen?: () => void;
13
+ /** Preferred side of the trigger where the popover should appear. Defaults to "bottom". */
14
+ placement?: 'top' | 'bottom' | 'left' | 'right';
15
+ /** Alignment of the popover relative to the trigger. Defaults to "start". */
16
+ align?: 'start' | 'center' | 'end';
17
+ /** Additional CSS classes to apply to the outer wrapper element. */
18
+ extraClassNames?: string;
19
+ /** HTML id attribute for the trigger button element. */
20
+ id?: string;
21
+ /** Test ID attribute applied to the popover container, used in automated testing. */
22
+ testId?: string;
23
+ }
24
+ //#endregion
25
+ export { ColorPickerControlProps };
@@ -0,0 +1,3 @@
1
+ import { ColorPickerControlProps } from "./ColorPickerControl.types.js";
2
+ import ColorPickerControl from "./ColorPickerControl.js";
3
+ export { ColorPickerControl, type ColorPickerControlProps };
@@ -0,0 +1,7 @@
1
+ import { ColorSwatchProps } from "./ColorSwatch.types.js";
2
+ import * as react0 from "react";
3
+
4
+ //#region src/ColorSwatch/ColorSwatch.d.ts
5
+ declare const ColorSwatch: react0.ForwardRefExoticComponent<ColorSwatchProps & react0.RefAttributes<HTMLButtonElement>>;
6
+ //#endregion
7
+ export { ColorSwatch as default };
@@ -0,0 +1,19 @@
1
+ //#region src/ColorSwatch/ColorSwatch.types.d.ts
2
+ interface ColorSwatchProps {
3
+ /** The background color of the swatch button, as any valid CSS color string. */
4
+ 'color': string;
5
+ /** Called when the swatch button is clicked. */
6
+ 'onClick'?: () => void;
7
+ /** Accessible label for the swatch button, used by screen readers. */
8
+ 'aria-label'?: string;
9
+ /** Size of the swatch button. Defaults to 'lg'. */
10
+ 'size'?: 'sm' | 'md' | 'lg';
11
+ /** Additional CSS classes to apply to the swatch button. */
12
+ 'extraClassNames'?: string;
13
+ /** HTML id attribute for the swatch button element. */
14
+ 'id'?: string;
15
+ /** Test ID attribute for the swatch button, used in automated testing. */
16
+ 'testId'?: string;
17
+ }
18
+ //#endregion
19
+ export { ColorSwatchProps };
@@ -0,0 +1,3 @@
1
+ import { ColorSwatchProps } from "./ColorSwatch.types.js";
2
+ import ColorSwatch from "./ColorSwatch.js";
3
+ export { type ColorSwatchProps, ColorSwatch as default };
@@ -0,0 +1,7 @@
1
+ import { EditorPanelProps } from "./EditorPanel.types.js";
2
+ import { FunctionComponent } from "react";
3
+
4
+ //#region src/EditorPanel/EditorPanel.d.ts
5
+ declare const EditorPanel: FunctionComponent<EditorPanelProps>;
6
+ //#endregion
7
+ export { EditorPanel as default };
@@ -0,0 +1,29 @@
1
+ import { ReactNode } from "react";
2
+
3
+ //#region src/EditorPanel/EditorPanel.types.d.ts
4
+ interface EditorPanelProps {
5
+ /** The title displayed as a kicker above the panel content. */
6
+ title: string;
7
+ /** Content rendered inside the panel body between the title and action buttons. */
8
+ children?: ReactNode;
9
+ /** Called when the Apply button is clicked. When omitted, the Apply button is not rendered. */
10
+ onApply?: () => void;
11
+ /** Called when the Cancel button is clicked. When omitted, the Cancel button is not rendered. */
12
+ onCancel?: () => void;
13
+ /** When true, the Apply button is rendered in a disabled state. */
14
+ isApplyDisabled?: boolean;
15
+ /** Label for the Apply button. Defaults to "Apply". */
16
+ applyLabel?: string;
17
+ /** Label for the Cancel button. Defaults to "Cancel". */
18
+ cancelLabel?: string;
19
+ /** Controls the padding inside the panel body. Defaults to "normal". */
20
+ spacing?: 'normal' | 'spacious';
21
+ /** Additional CSS classes to apply to the panel container. */
22
+ extraClassNames?: string;
23
+ /** HTML id attribute for the panel container element. */
24
+ id?: string;
25
+ /** Test ID attribute for the panel container element, used in automated testing. */
26
+ testId?: string;
27
+ }
28
+ //#endregion
29
+ export { EditorPanelProps };
@@ -0,0 +1,3 @@
1
+ import { EditorPanelProps } from "./EditorPanel.types.js";
2
+ import EditorPanel from "./EditorPanel.js";
3
+ export { type EditorPanelProps, EditorPanel as default };
@@ -1,5 +1,5 @@
1
1
  import { LoadingIndicatorProps } from "./LoadingIndicator.types.js";
2
- import * as react_jsx_runtime0 from "react/jsx-runtime";
2
+ import * as react_jsx_runtime4 from "react/jsx-runtime";
3
3
 
4
4
  //#region src/LoadingIndicator/LoadingIndicator.d.ts
5
5
  /**
@@ -19,6 +19,6 @@ declare const LoadingIndicator: ({
19
19
  role,
20
20
  onClick,
21
21
  title
22
- }: LoadingIndicatorProps) => react_jsx_runtime0.JSX.Element;
22
+ }: LoadingIndicatorProps) => react_jsx_runtime4.JSX.Element;
23
23
  //#endregion
24
24
  export { LoadingIndicator as default };
@@ -0,0 +1,15 @@
1
+ import { SegmentedControlProps } from "./SegmentedControl.types.js";
2
+ import * as react_jsx_runtime0 from "react/jsx-runtime";
3
+
4
+ //#region src/SegmentedControl/SegmentedControl.d.ts
5
+ declare function SegmentedControl<T extends string | number | boolean>({
6
+ options,
7
+ value,
8
+ onChange,
9
+ extraClassNames,
10
+ id,
11
+ testId,
12
+ ariaLabel
13
+ }: SegmentedControlProps<T>): react_jsx_runtime0.JSX.Element;
14
+ //#endregion
15
+ export { SegmentedControl as default };
@@ -0,0 +1,25 @@
1
+ //#region src/SegmentedControl/SegmentedControl.types.d.ts
2
+ interface SegmentedControlOption<T extends string | number | boolean> {
3
+ /** The text label displayed on the option button. */
4
+ label: string;
5
+ /** The value associated with this option, passed to `onChange` when selected. */
6
+ value: T;
7
+ }
8
+ interface SegmentedControlProps<T extends string | number | boolean> {
9
+ /** The list of options to render as selectable pill buttons. */
10
+ options: SegmentedControlOption<T>[];
11
+ /** The currently selected value. The matching option will be displayed as active. */
12
+ value: T;
13
+ /** Called with the selected option's value when a pill button is clicked. */
14
+ onChange?: (value: T) => void;
15
+ /** Additional CSS classes to apply to the container element. */
16
+ extraClassNames?: string;
17
+ /** HTML id attribute for the container element. */
18
+ id?: string;
19
+ /** Test ID attribute for the container element, used in automated testing. */
20
+ testId?: string;
21
+ /** Accessible label for the group of option buttons. */
22
+ ariaLabel?: string;
23
+ }
24
+ //#endregion
25
+ export { SegmentedControlOption, SegmentedControlProps };
@@ -0,0 +1,3 @@
1
+ import { SegmentedControlOption, SegmentedControlProps } from "./SegmentedControl.types.js";
2
+ import SegmentedControl from "./SegmentedControl.js";
3
+ export { type SegmentedControlOption, type SegmentedControlProps, SegmentedControl as default };
@@ -221,6 +221,11 @@ interface SelectProps {
221
221
  * Use this when you want to control the search input externally.
222
222
  */
223
223
  inputValue?: string;
224
+ /**
225
+ * Callback triggered when the user scrolls to the bottom of the dropdown menu.
226
+ * Use this to fetch the next page of options when implementing infinite-scroll loading.
227
+ */
228
+ onMenuScrollToBottom?: (event: WheelEvent | TouchEvent) => void;
224
229
  }
225
230
  //#endregion
226
231
  export { GroupedOption, Option, SelectProps };
@@ -46,8 +46,12 @@ import Collapse from "./Collapse/Collapse.js";
46
46
  import { Slider } from "./Slider/Slider.js";
47
47
  import ProgressBar from "./ProgressBar/ProgressBar.js";
48
48
  import Carousel from "./Carousel/Carousel.js";
49
+ import SegmentedControl from "./SegmentedControl/SegmentedControl.js";
50
+ import EditorPanel from "./EditorPanel/EditorPanel.js";
51
+ import ColorSwatch from "./ColorSwatch/ColorSwatch.js";
52
+ import ColorPickerControl from "./ColorPickerControl/ColorPickerControl.js";
49
53
  import LoadingIndicator from "./LoadingIndicator/LoadingIndicator.js";
50
54
  import { QomponentsTheme } from "./constants.js";
51
55
  import { ButtonWithDropdownProps, DropdownItems, DropdownProps, DropdownSubItem } from "./ButtonWithDropdown/ButtonWithDropdown.types.js";
52
56
  import ButtonWithDropdown from "./ButtonWithDropdown/ButtonWithDropdown.js";
53
- export { Accordion, AccordionProps, Alert, AlertProps, AppendedProps, Badge, Button, ButtonGroup, ButtonGroupProps, ButtonProps, ButtonSize, ButtonType, ButtonVariant, ButtonWithDropdown, ButtonWithDropdownProps, ButtonWithPopover, ButtonWithPopoverProps, Carousel, CarouselProps, Checkbox, CheckboxProps, Collapse, CollapseProps, DEFAULT_TOOL_TIP_DELAY, DimensionStyle, DropdownItems, DropdownProps, DropdownSubItem, FormControlElement, GroupBase, GroupedOption, Icon, IconPosition, IconProps, IconSize, IconType, InputGroup, InputGroupPlacement, InputGroupProps, InputLengthStyleProps, LoadingIndicator, Modal, ModalProps, ModalSize, Option, OptionProps, ProgressBar, ProgressBarProps, ProgressIndicatorProps, QTip, QTipDataAttributes, QomponentsTheme, SeeqActionDropdown, SeeqActionDropdownItems, SeeqActionDropdownProps, Select, SelectComponents, SelectProps, Slider, SliderProps, SvgIconProps, SvgIconType, Tabs, TabsProps, TextArea, TextAreaProps, TextField, TextFieldProps, TitleIconPosition, ToolbarButton, ToolbarButtonProps, ToolbarButtonVariant, Tooltip, TooltipComponentProps, TooltipPosition, TooltipProps, TriggerWithDropdown, TriggerWithDropdownProps, buttonSizes, buttonTypes, buttonVariants, iconPositions, iconTypes, svgIconTypes, toolbarButtonVariants, tooltipPositions };
57
+ export { Accordion, AccordionProps, Alert, AlertProps, AppendedProps, Badge, Button, ButtonGroup, ButtonGroupProps, ButtonProps, ButtonSize, ButtonType, ButtonVariant, ButtonWithDropdown, ButtonWithDropdownProps, ButtonWithPopover, ButtonWithPopoverProps, Carousel, CarouselProps, Checkbox, CheckboxProps, Collapse, CollapseProps, ColorPickerControl, ColorSwatch, DEFAULT_TOOL_TIP_DELAY, DimensionStyle, DropdownItems, DropdownProps, DropdownSubItem, EditorPanel, FormControlElement, GroupBase, GroupedOption, Icon, IconPosition, IconProps, IconSize, IconType, InputGroup, InputGroupPlacement, InputGroupProps, InputLengthStyleProps, LoadingIndicator, Modal, ModalProps, ModalSize, Option, OptionProps, ProgressBar, ProgressBarProps, ProgressIndicatorProps, QTip, QTipDataAttributes, QomponentsTheme, SeeqActionDropdown, SeeqActionDropdownItems, SeeqActionDropdownProps, SegmentedControl, Select, SelectComponents, SelectProps, Slider, SliderProps, SvgIconProps, SvgIconType, Tabs, TabsProps, TextArea, TextAreaProps, TextField, TextFieldProps, TitleIconPosition, ToolbarButton, ToolbarButtonProps, ToolbarButtonVariant, Tooltip, TooltipComponentProps, TooltipPosition, TooltipProps, TriggerWithDropdown, TriggerWithDropdownProps, buttonSizes, buttonTypes, buttonVariants, iconPositions, iconTypes, svgIconTypes, toolbarButtonVariants, tooltipPositions };
@@ -46,8 +46,12 @@ import Collapse from "./Collapse/Collapse.js";
46
46
  import { Slider } from "./Slider/Slider.js";
47
47
  import ProgressBar from "./ProgressBar/ProgressBar.js";
48
48
  import Carousel from "./Carousel/Carousel.js";
49
+ import SegmentedControl from "./SegmentedControl/SegmentedControl.js";
50
+ import EditorPanel from "./EditorPanel/EditorPanel.js";
51
+ import ColorSwatch from "./ColorSwatch/ColorSwatch.js";
52
+ import ColorPickerControl from "./ColorPickerControl/ColorPickerControl.js";
49
53
  import LoadingIndicator from "./LoadingIndicator/LoadingIndicator.js";
50
54
  import { QomponentsTheme } from "./constants.js";
51
55
  import { ButtonWithDropdownProps, DropdownItems, DropdownProps, DropdownSubItem } from "./ButtonWithDropdown/ButtonWithDropdown.types.js";
52
56
  import ButtonWithDropdown from "./ButtonWithDropdown/ButtonWithDropdown.js";
53
- export { Accordion, AccordionProps, Alert, AlertProps, AppendedProps, Badge, Button, ButtonGroup, ButtonGroupProps, ButtonProps, ButtonSize, ButtonType, ButtonVariant, ButtonWithDropdown, ButtonWithDropdownProps, ButtonWithPopover, ButtonWithPopoverProps, Carousel, CarouselProps, Checkbox, CheckboxProps, Collapse, CollapseProps, DEFAULT_TOOL_TIP_DELAY, DimensionStyle, DropdownItems, DropdownProps, DropdownSubItem, FormControlElement, type GroupBase, GroupedOption, Icon, IconPosition, IconProps, IconSize, IconType, InputGroup, InputGroupPlacement, InputGroupProps, InputLengthStyleProps, LoadingIndicator, Modal, ModalProps, ModalSize, Option, type OptionProps, ProgressBar, ProgressBarProps, ProgressIndicatorProps, QTip, QTipDataAttributes, type QomponentsTheme, SeeqActionDropdown, SeeqActionDropdownItems, SeeqActionDropdownProps, Select, SelectComponents, SelectProps, Slider, SliderProps, SvgIconProps, SvgIconType, Tabs, TabsProps, TextArea, TextAreaProps, TextField, TextFieldProps, TitleIconPosition, ToolbarButton, ToolbarButtonProps, ToolbarButtonVariant, Tooltip, TooltipComponentProps, TooltipPosition, TooltipProps, TriggerWithDropdown, TriggerWithDropdownProps, buttonSizes, buttonTypes, buttonVariants, iconPositions, iconTypes, svgIconTypes, toolbarButtonVariants, tooltipPositions };
57
+ export { Accordion, AccordionProps, Alert, AlertProps, AppendedProps, Badge, Button, ButtonGroup, ButtonGroupProps, ButtonProps, ButtonSize, ButtonType, ButtonVariant, ButtonWithDropdown, ButtonWithDropdownProps, ButtonWithPopover, ButtonWithPopoverProps, Carousel, CarouselProps, Checkbox, CheckboxProps, Collapse, CollapseProps, ColorPickerControl, ColorSwatch, DEFAULT_TOOL_TIP_DELAY, DimensionStyle, DropdownItems, DropdownProps, DropdownSubItem, EditorPanel, FormControlElement, type GroupBase, GroupedOption, Icon, IconPosition, IconProps, IconSize, IconType, InputGroup, InputGroupPlacement, InputGroupProps, InputLengthStyleProps, LoadingIndicator, Modal, ModalProps, ModalSize, Option, type OptionProps, ProgressBar, ProgressBarProps, ProgressIndicatorProps, QTip, QTipDataAttributes, type QomponentsTheme, SeeqActionDropdown, SeeqActionDropdownItems, SeeqActionDropdownProps, SegmentedControl, Select, SelectComponents, SelectProps, Slider, SliderProps, SvgIconProps, SvgIconType, Tabs, TabsProps, TextArea, TextAreaProps, TextField, TextFieldProps, TitleIconPosition, ToolbarButton, ToolbarButtonProps, ToolbarButtonVariant, Tooltip, TooltipComponentProps, TooltipPosition, TooltipProps, TriggerWithDropdown, TriggerWithDropdownProps, buttonSizes, buttonTypes, buttonVariants, iconPositions, iconTypes, svgIconTypes, toolbarButtonVariants, tooltipPositions };