@festo-ui/react 9.0.1-dev.782 → 9.0.1-dev.784

package/dist/index.d.ts

@@ -0,0 +1,60 @@
+export type { Placement } from '@floating-ui/react';
+export { Accordion, type AccordionProps, } from './components/accordion/Accordion';
+export { AccordionHeader } from './components/accordion/accordion-header/AccordionHeader';
+export { AccordionItem, type AccordionItemProps, } from './components/accordion/accordion-item/AccordionItem';
+export { AccordionItemBody } from './components/accordion/accordion-item/accordion-item-body/AccordionItemBody';
+export { AccordionItemHeader } from './components/accordion/accordion-item/accordion-item-header/AccordionItemHeader';
+export { BottomSheet, type BottomSheetProps, } from './components/bottom-sheet/BottomSheet';
+export { Breadcrumb, type BreadcrumbProps, } from './components/breadcrumb/Breadcrumb';
+export { Button, type ButtonProps } from './components/button/Button';
+export { Card, type CardProps } from './components/card/Card';
+export { CardBody, type CardBodyProps } from './components/card/CardBody';
+export { CardHeader, type CardHeaderProps } from './components/card/CardHeader';
+export { CardNotification, type CardNotificationProps, } from './components/card/CardNotification';
+export { Chip, type ChipProps, ChipType } from './components/chips/chip/Chip';
+export { ChipContainer, type ChipContainerProps, } from './components/chips/chip-container/ChipContainer';
+export { LoadingIndicator, type LoadingIndicatorProps, } from './components/loading-indicator/LoadingIndicator';
+export { MobileFlyout, type MobileFlyoutProps, } from './components/mobile-flyout/MobileFlyout';
+export { MobileFlyoutItem, type MobileFlyoutItemBaseProps, type MobileFlyoutItemProps, } from './components/mobile-flyout/mobile-flyout-item/MobileFlyoutItem';
+export { MobileFlyoutPage, type MobileFlyoutPageProps, } from './components/mobile-flyout/mobile-flyout-page/MobileFlyoutPage';
+export { AlertModal, type AlertModalProps, } from './components/modals/AlertModal';
+export { ConfirmModal, type ConfirmModalProps, } from './components/modals/ConfirmModal';
+export { CustomModal, type CustomModalProps, } from './components/modals/CustomModal';
+export { ImageGallery, type ImageGalleryItemData, type ImageGalleryProps, } from './components/modals/image-gallery/ImageGallery';
+export { type ImageDescriptiveContent, ImageGalleryContent, type ImageGalleryContentProps, } from './components/modals/image-gallery/ImageGalleryContent';
+export { ImageGallerySwiper, type ImageGallerySwiperProps, } from './components/modals/image-gallery/ImageGallerySwiper';
+export { ImageGalleryThumbsSwiper, type ImageGalleryThumbsSwiperProps, } from './components/modals/image-gallery/ImageGalleryThumbsSwiper';
+export { Prompt, type PromptProps } from './components/modals/Prompt';
+export { Pagination, type PaginationProps, type PaginationType, } from './components/pagination/Pagination';
+export { Legend, type LegendItem, type LegendProps, } from './components/popovers/legend/Legend';
+export { Popover, type PopoverProps, } from './components/popovers/popover/Popover';
+export { PopoverMenu, type PopoverMenuProps, } from './components/popovers/popover-menu/PopoverMenu';
+export { PopoverMenuContext } from './components/popovers/popover-menu/PopoverMenuContext';
+export { PopoverMenuItem, type PopoverMenuItemProps, } from './components/popovers/popover-menu/popover-menu-item/PopoverMenuItem';
+export { Tooltip, type TooltipProps, } from './components/popovers/tooltip/Tooltip';
+export { Progress, type ProgressProps } from './components/progress/Progress';
+export { SearchInput, type SearchInputProps, } from './components/search-input/SearchInput';
+export { SearchSuggestion } from './components/search-input/SearchSuggestion';
+export { Snackbar, type SnackbarConfig, type SnackbarData, type SnackbarProps, } from './components/snackbar/Snackbar';
+export { addSnackbar, SnackbarProvider, type SnackbarProviderProps, } from './components/snackbar/SnackbarProvider';
+export { useSnackbar } from './components/snackbar/useSnackbar';
+export { StepperHorizontal, type StepperHorizontalProps, } from './components/stepper-horizontal/StepperHorizontal';
+export { StepHorizontal, type StepHorizontalProps, } from './components/stepper-horizontal/step-horizontal/StepHorizontal';
+export { StepperVertical, type StepperVerticalProps, } from './components/stepper-vertical/StepperVertical';
+export { StepVertical, type StepVerticalProps, } from './components/stepper-vertical/step-vertical/StepVertical';
+export { type TabItemAppearance, Tabs, type TabsConfiguration, type TabsProps, type TabViewType, } from './components/tab/Tabs';
+export { TabPane, type TabPaneProps } from './components/tab/tab-pane/TabPane';
+export { TableHeaderCell, type TableHeaderCellProps, } from './components/table-header-cell/TableHeaderCell';
+export { Checkbox, type CheckboxProps } from './forms/checkbox/Checkbox';
+export { ComboBox, type ComboBoxOption, type ComboBoxProps, } from './forms/combobox/ComboBox';
+export { MultiSelect, type MultiSelectProps, } from './forms/multi-select/MultiSelect';
+export { RadioButton, type RadioButtonProps, } from './forms/radio/RadioButton';
+export { RadioGroup, type RadioGroupProps } from './forms/radio/RadioGroup';
+export { Segment, type SegmentConfiguration, type SegmentProps, } from './forms/segment/Segment';
+export { SegmentControl, type SegmentControlProps, } from './forms/segment/segment-control/SegmentControl';
+export { Select, type SelectOption, type SelectProps, } from './forms/select/Select';
+export { Slider, type SliderProps } from './forms/slider/Slider';
+export { Switch, type SwitchProps } from './forms/switch/Switch';
+export { TextArea, type TextAreaProps } from './forms/text-area/TextArea';
+export { TextInput, type TextInputProps } from './forms/text-input/TextInput';
+export { TimePicker, type TimePickerOptions, type TimePickerProps, } from './forms/time-picker/TimePicker';

package/dist/index.js

@@ -0,0 +1,60 @@
+import { Accordion } from "./components/accordion/Accordion.js";
+import { AccordionHeader } from "./components/accordion/accordion-header/AccordionHeader.js";
+import { AccordionItem } from "./components/accordion/accordion-item/AccordionItem.js";
+import { AccordionItemBody } from "./components/accordion/accordion-item/accordion-item-body/AccordionItemBody.js";
+import { AccordionItemHeader } from "./components/accordion/accordion-item/accordion-item-header/AccordionItemHeader.js";
+import { BottomSheet } from "./components/bottom-sheet/BottomSheet.js";
+import { Breadcrumb } from "./components/breadcrumb/Breadcrumb.js";
+import { Button } from "./components/button/Button.js";
+import { Card } from "./components/card/Card.js";
+import { CardBody } from "./components/card/CardBody.js";
+import { CardHeader } from "./components/card/CardHeader.js";
+import { CardNotification } from "./components/card/CardNotification.js";
+import { Chip, ChipType } from "./components/chips/chip/Chip.js";
+import { ChipContainer } from "./components/chips/chip-container/ChipContainer.js";
+import { LoadingIndicator } from "./components/loading-indicator/LoadingIndicator.js";
+import { MobileFlyout } from "./components/mobile-flyout/MobileFlyout.js";
+import { MobileFlyoutItem } from "./components/mobile-flyout/mobile-flyout-item/MobileFlyoutItem.js";
+import { MobileFlyoutPage } from "./components/mobile-flyout/mobile-flyout-page/MobileFlyoutPage.js";
+import { AlertModal } from "./components/modals/AlertModal.js";
+import { ConfirmModal } from "./components/modals/ConfirmModal.js";
+import { CustomModal } from "./components/modals/CustomModal.js";
+import { ImageGallery } from "./components/modals/image-gallery/ImageGallery.js";
+import { ImageGalleryContent } from "./components/modals/image-gallery/ImageGalleryContent.js";
+import { ImageGallerySwiper } from "./components/modals/image-gallery/ImageGallerySwiper.js";
+import { ImageGalleryThumbsSwiper } from "./components/modals/image-gallery/ImageGalleryThumbsSwiper.js";
+import { Prompt } from "./components/modals/Prompt.js";
+import { Pagination } from "./components/pagination/Pagination.js";
+import { Legend } from "./components/popovers/legend/Legend.js";
+import { Popover } from "./components/popovers/popover/Popover.js";
+import { PopoverMenu } from "./components/popovers/popover-menu/PopoverMenu.js";
+import { PopoverMenuContext } from "./components/popovers/popover-menu/PopoverMenuContext.js";
+import { PopoverMenuItem } from "./components/popovers/popover-menu/popover-menu-item/PopoverMenuItem.js";
+import { Tooltip } from "./components/popovers/tooltip/Tooltip.js";
+import { Progress } from "./components/progress/Progress.js";
+import { SearchInput } from "./components/search-input/SearchInput.js";
+import { SearchSuggestion } from "./components/search-input/SearchSuggestion.js";
+import { Snackbar } from "./components/snackbar/Snackbar.js";
+import { SnackbarProvider, addSnackbar } from "./components/snackbar/SnackbarProvider.js";
+import { useSnackbar } from "./components/snackbar/useSnackbar.js";
+import { StepperHorizontal } from "./components/stepper-horizontal/StepperHorizontal.js";
+import { StepHorizontal } from "./components/stepper-horizontal/step-horizontal/StepHorizontal.js";
+import { StepperVertical } from "./components/stepper-vertical/StepperVertical.js";
+import { StepVertical } from "./components/stepper-vertical/step-vertical/StepVertical.js";
+import { Tabs } from "./components/tab/Tabs.js";
+import { TabPane } from "./components/tab/tab-pane/TabPane.js";
+import { TableHeaderCell } from "./components/table-header-cell/TableHeaderCell.js";
+import { Checkbox } from "./forms/checkbox/Checkbox.js";
+import { ComboBox } from "./forms/combobox/ComboBox.js";
+import { MultiSelect } from "./forms/multi-select/MultiSelect.js";
+import { RadioButton } from "./forms/radio/RadioButton.js";
+import { RadioGroup } from "./forms/radio/RadioGroup.js";
+import { Segment } from "./forms/segment/Segment.js";
+import { SegmentControl } from "./forms/segment/segment-control/SegmentControl.js";
+import { Select } from "./forms/select/Select.js";
+import { Slider } from "./forms/slider/Slider.js";
+import { Switch } from "./forms/switch/Switch.js";
+import { TextArea } from "./forms/text-area/TextArea.js";
+import { TextInput } from "./forms/text-input/TextInput.js";
+import { TimePicker } from "./forms/time-picker/TimePicker.js";
+export { Accordion, AccordionHeader, AccordionItem, AccordionItemBody, AccordionItemHeader, AlertModal, BottomSheet, Breadcrumb, Button, Card, CardBody, CardHeader, CardNotification, Checkbox, Chip, ChipContainer, ChipType, ComboBox, ConfirmModal, CustomModal, ImageGallery, ImageGalleryContent, ImageGallerySwiper, ImageGalleryThumbsSwiper, Legend, LoadingIndicator, MobileFlyout, MobileFlyoutItem, MobileFlyoutPage, MultiSelect, Pagination, Popover, PopoverMenu, PopoverMenuContext, PopoverMenuItem, Progress, Prompt, RadioButton, RadioGroup, SearchInput, SearchSuggestion, Segment, SegmentControl, Select, Slider, Snackbar, SnackbarProvider, StepHorizontal, StepVertical, StepperHorizontal, StepperVertical, Switch, TabPane, TableHeaderCell, Tabs, TextArea, TextInput, TimePicker, Tooltip, addSnackbar, useSnackbar };

package/dist/utils/index.d.ts

@@ -0,0 +1 @@
+export declare const provideDiv: () => HTMLDivElement;

package/dist/utils/index.js

@@ -0,0 +1,7 @@
+const provideDiv = ()=>{
+    const div = document.createElement('div');
+    const id = Math.floor(1000 * Math.random());
+    div.setAttribute('id', `${id}`);
+    return div;
+};
+export { provideDiv };

package/dist/utils/setRef.d.ts

@@ -0,0 +1 @@
+export declare function setRef<T>(ref: React.ForwardedRef<T> | undefined, value: any): void;

package/dist/utils/setRef.js

@@ -0,0 +1,5 @@
+function setRef(ref, value) {
+    if ('function' == typeof ref) ref(value);
+    else if (ref) ref.current = value;
+}
+export { setRef };

package/dist/utils/types.d.ts

@@ -0,0 +1,36 @@
+import type { CSSProperties } from 'react';
+export interface ComponentBase {
+    readonly className?: string;
+    readonly style?: CSSProperties;
+    readonly 'data-testid'?: string;
+    readonly id?: string;
+}
+export interface ClassNameProps {
+    className?: string;
+}
+export interface ClassNamePropsWithChildren extends ClassNameProps {
+    children?: React.ReactNode;
+}
+export interface Image {
+    src: string;
+    alt: string;
+    aspectRatio: '3/2' | '16/9';
+}
+export interface SelectConfiguration {
+    hideLabel?: boolean;
+    contentWidth?: string;
+    scroll?: {
+        enabled?: boolean;
+        viewportSize?: number;
+    };
+}
+export type PolymorphicRef<C extends React.ElementType> = React.ComponentPropsWithRef<C>['ref'];
+type AsProp<C extends React.ElementType> = {
+    component?: C;
+};
+type PropsToOmit<C extends React.ElementType, P> = keyof (AsProp<C> & P);
+type PolymorphicComponentProp<C extends React.ElementType, Props = object> = React.PropsWithChildren<Props & AsProp<C>> & Omit<React.ComponentPropsWithoutRef<C>, PropsToOmit<C, Props>>;
+export type PolymorphicComponentPropWithRef<C extends React.ElementType, Props = object> = PolymorphicComponentProp<C, Props> & {
+    ref?: PolymorphicRef<C>;
+};
+export {};

package/dist/utils/useControlled.d.ts

@@ -0,0 +1,7 @@
+import { type Dispatch, type SetStateAction } from 'react';
+export interface UseControlledProps<T> {
+    controlled: T | undefined;
+    default: T;
+    onChange?: (value: T) => void;
+}
+export declare function useControlled<T>({ controlled, default: defaultValue, onChange, }: UseControlledProps<T>): [T | undefined, Dispatch<SetStateAction<T>>];

package/dist/utils/useControlled.js

@@ -0,0 +1,20 @@
+import { useCallback, useRef, useState } from "react";
+function useControlled({ controlled, default: defaultValue, onChange }) {
+    const { current: isControlled } = useRef(void 0 !== controlled);
+    const [valueState, setValueState] = useState(defaultValue);
+    const value = isControlled ? controlled : valueState;
+    const setValueIfUncontrolled = useCallback((newValue)=>{
+        if (!isControlled) setValueState(newValue);
+        const setter = newValue;
+        const onChangeValue = 'function' == typeof newValue ? setter(controlled) : newValue;
+        onChange?.(onChangeValue);
+    }, [
+        onChange,
+        controlled
+    ]);
+    return [
+        value,
+        setValueIfUncontrolled
+    ];
+}
+export { useControlled };

package/dist/utils/useForkRef.d.ts

@@ -0,0 +1,2 @@
+import { type Ref, type RefCallback } from 'react';
+export declare function useForkRef<T>(refA: Ref<T> | null | undefined, refB: Ref<T> | null | undefined): RefCallback<T> | null;

package/dist/utils/useForkRef.js

@@ -0,0 +1,15 @@
+import { useMemo } from "react";
+import { setRef } from "./setRef.js";
+function useForkRef(refA, refB) {
+    return useMemo(()=>{
+        if (null == refA && (null == refB || void 0 === refB)) return null;
+        return (instance)=>{
+            setRef(refA, instance);
+            setRef(refB, instance);
+        };
+    }, [
+        refA,
+        refB
+    ]);
+}
+export { useForkRef };

package/dist/utils/useId.d.ts

@@ -0,0 +1 @@
+export declare function useId(idInput?: string): string | undefined;

package/dist/utils/useId.js

@@ -0,0 +1,20 @@
+import react from "react";
+const maybeReactUseId = react["useId"];
+let nextId = 0;
+function useLegacyId() {
+    const [id, setId] = react.useState(void 0);
+    react.useEffect(()=>{
+        if (null == id) {
+            nextId += 1;
+            setId(`fr-${nextId}`);
+        }
+    }, [
+        id
+    ]);
+    return id;
+}
+function useId(idInput) {
+    if (null != idInput) return idInput;
+    return maybeReactUseId ? maybeReactUseId() : useLegacyId();
+}
+export { useId };

package/dist/utils/useOnClickOutside.d.ts

@@ -0,0 +1,2 @@
+import { type RefObject } from 'react';
+export declare function useOnClickOutside(ref: RefObject<HTMLElement | null>, callback: (event: MouseEvent | TouchEvent) => void, ref2?: RefObject<HTMLElement | null>): void;

package/dist/utils/useOnClickOutside.js

@@ -0,0 +1,20 @@
+import { useEffect } from "react";
+function useOnClickOutside(ref, callback, ref2) {
+    useEffect(()=>{
+        const listener = (event)=>{
+            if (!ref.current || ref.current.contains(event.target) || ref2 && (!ref2.current || ref2.current.contains(event.target))) return;
+            callback(event);
+        };
+        document.addEventListener('mousedown', listener, true);
+        document.addEventListener('touchstart', listener, true);
+        return ()=>{
+            document.removeEventListener('mousedown', listener, true);
+            document.removeEventListener('touchstart', listener, true);
+        };
+    }, [
+        ref,
+        ref2,
+        callback
+    ]);
+}
+export { useOnClickOutside };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@festo-ui/react",
-  "version": "9.0.1-dev.782",
+  "version": "9.0.1-dev.784",
   "author": "Festo UI (styleguide@festo.com)",
   "copyright": "Copyright (c) 2025 Festo SE & Co. KG. All rights reserved.",
   "license": "apache-2.0",