@festo-ui/react 9.0.1-dev.757 → 9.0.1-dev.758

package/dist/components/button/Button.js

@@ -1,36 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import classnames from "classnames";
-import { forwardRef } from "react";
-import { IconWrapper } from "../icon-wrapper/IconWrapper.js";
-const Button = /*#__PURE__*/ forwardRef(({ icon, type = 'button', disabled = false, iconOnly = false, large = false, floating = false, onClick, primary = false, tertiary = false, className, children, ...props }, ref)=>{
-    const classes = classnames('fwe-btn', 'fr-button', {
-        'fwe-btn-icon': iconOnly
-    }, {
-        'fwe-disabled': disabled
-    }, {
-        'fwe-btn-hero': primary && !tertiary
-    }, {
-        'fwe-btn-link': tertiary && !primary
-    }, {
-        'fwe-btn-lg': large
-    }, {
-        'fwe-btn-floating': floating
-    }, className);
-    return /*#__PURE__*/ jsxs("button", {
-        type: type,
-        onClick: onClick,
-        className: classes,
-        disabled: disabled,
-        ref: ref,
-        ...props,
-        children: [
-            /*#__PURE__*/ jsx(IconWrapper, {
-                icon: icon
-            }),
-            !iconOnly && /*#__PURE__*/ jsx("div", {
-                children: children
-            })
-        ]
-    });
-});
-export { Button };

package/dist/components/card/Card.d.ts

@@ -1,4 +0,0 @@
-import type { ClassNamePropsWithChildren } from '../../utils/types';
-export interface CardProps extends ClassNamePropsWithChildren {
-}
-export declare function Card({ children, className }: CardProps): JSX.Element;

package/dist/components/card/Card.js

@@ -1,9 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import classnames from "classnames";
-function Card({ children, className }) {
-    return /*#__PURE__*/ jsx("div", {
-        className: classnames('fwe-card', className),
-        children: children
-    });
-}
-export { Card };

package/dist/components/card/CardBody.d.ts

@@ -1,5 +0,0 @@
-import type { ClassNamePropsWithChildren } from '../../utils/types';
-export interface CardBodyProps extends ClassNamePropsWithChildren {
-    text: string;
-}
-export declare function CardBody({ children, text, className }: CardBodyProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/card/CardBody.js

@@ -1,15 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import classnames from "classnames";
-function CardBody({ children, text, className }) {
-    return /*#__PURE__*/ jsxs("div", {
-        className: classnames('fwe-card-body', className),
-        children: [
-            /*#__PURE__*/ jsx("div", {
-                className: "fwe-card-text",
-                children: text
-            }),
-            children
-        ]
-    });
-}
-export { CardBody };

package/dist/components/card/CardHeader.d.ts

@@ -1,8 +0,0 @@
-import type { ClassNameProps, Image } from '../../utils/types';
-export interface CardHeaderProps extends ClassNameProps {
-    title: string;
-    subtitle?: string;
-    action?: React.ReactNode;
-    image?: Image;
-}
-export declare function CardHeader({ title, subtitle, action, image, className, }: CardHeaderProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/card/CardHeader.js

@@ -1,31 +0,0 @@
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import classnames from "classnames";
-function CardHeader({ title, subtitle, action, image, className }) {
-    return /*#__PURE__*/ jsxs(Fragment, {
-        children: [
-            image ? /*#__PURE__*/ jsx("img", {
-                alt: image.alt,
-                className: `fwe-card-img-${'3/2' === image.aspectRatio ? '32' : '169'}`,
-                src: image.src
-            }) : null,
-            /*#__PURE__*/ jsxs("div", {
-                className: classnames('fwe-card-header', className),
-                children: [
-                    /*#__PURE__*/ jsxs("div", {
-                        className: "fwe-card-title",
-                        children: [
-                            /*#__PURE__*/ jsx("h5", {
-                                children: title
-                            }),
-                            subtitle && /*#__PURE__*/ jsx("p", {
-                                children: subtitle
-                            })
-                        ]
-                    }),
-                    action
-                ]
-            })
-        ]
-    });
-}
-export { CardHeader };

package/dist/components/card/CardHeader.stories.helper.js

@@ -1,7 +0,0 @@
-import gallery_01 from "../../../../web-essentials/stories/assets/gallery-01.webp";
-const cardImage = {
-    src: gallery_01,
-    alt: 'Asset',
-    aspectRatio: '16/9'
-};
-export { cardImage };

package/dist/components/card/CardNotification.d.ts

@@ -1,6 +0,0 @@
-import type { ClassNameProps } from '../../utils/types';
-export interface CardNotificationProps extends ClassNameProps {
-    title: string;
-    message?: string;
-}
-export declare function CardNotification({ className, title, message, }: CardNotificationProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/card/CardNotification.js

@@ -1,26 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { IconWarning } from "@festo-ui/react-icons";
-import classnames from "classnames";
-function CardNotification({ className, title, message }) {
-    const classes = classnames('fwe-card-notification', className);
-    return /*#__PURE__*/ jsxs("div", {
-        className: classes,
-        children: [
-            /*#__PURE__*/ jsx(IconWarning, {
-                size: 24
-            }),
-            /*#__PURE__*/ jsxs("div", {
-                className: "fwe-card-title",
-                children: [
-                    /*#__PURE__*/ jsx("h6", {
-                        children: title
-                    }),
-                    message && /*#__PURE__*/ jsx("p", {
-                        children: message
-                    })
-                ]
-            })
-        ]
-    });
-}
-export { CardNotification };

package/dist/components/chips/chip/Chip.d.ts

@@ -1,17 +0,0 @@
-import type React from 'react';
-import type { ClassNamePropsWithChildren } from '../../../utils/types';
-export declare enum ChipType {
-    Choice = 0,
-    Category = 1,
-    Filter = 2,
-    Readonly = 3
-}
-export interface ChipProps extends ClassNamePropsWithChildren {
-    readonly type?: ChipType;
-    readonly icon?: React.ReactNode;
-    readonly selected?: boolean;
-    readonly disabled?: boolean;
-    readonly large?: boolean;
-    readonly onClick?: (e: React.MouseEvent<HTMLElement, MouseEvent>) => void;
-}
-export declare function Chip({ type, selected, disabled, large, icon, children, onClick, className, }: ChipProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/chips/chip/Chip.js

@@ -1,38 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import classnames from "classnames";
-import { IconWrapper } from "../../icon-wrapper/IconWrapper.js";
-var Chip_ChipType = /*#__PURE__*/ function(ChipType) {
-    ChipType[ChipType["Choice"] = 0] = "Choice";
-    ChipType[ChipType["Category"] = 1] = "Category";
-    ChipType[ChipType["Filter"] = 2] = "Filter";
-    ChipType[ChipType["Readonly"] = 3] = "Readonly";
-    return ChipType;
-}({});
-function Chip({ type = 0, selected = false, disabled = false, large = false, icon, children, onClick, className }) {
-    const classes = classnames('fr-chip', 'fwe-chip', {
-        'fwe-selected': selected
-    }, {
-        'fwe-disabled': disabled
-    }, {
-        'fwe-chip-lg': large
-    }, {
-        'fwe-category': 1 === type
-    }, {
-        'fwe-filter': 2 === type
-    }, {
-        'fwe-readonly': 3 === type
-    }, className);
-    return /*#__PURE__*/ jsxs("button", {
-        type: "button",
-        className: classes,
-        onClick: onClick,
-        disabled: disabled,
-        children: [
-            /*#__PURE__*/ jsx(IconWrapper, {
-                icon: icon
-            }),
-            children
-        ]
-    });
-}
-export { Chip, Chip_ChipType as ChipType };

package/dist/components/chips/chip-container/ChipContainer.d.ts

@@ -1,5 +0,0 @@
-import type { ClassNamePropsWithChildren } from '../../../utils/types';
-export interface ChipContainerProps extends ClassNamePropsWithChildren {
-    readonly large?: boolean;
-}
-export declare function ChipContainer({ large, children, className, }: ChipContainerProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/chips/chip-container/ChipContainer.js

@@ -1,12 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import classnames from "classnames";
-function ChipContainer({ large = false, children, className }) {
-    const classes = classnames('fwe-chip-container', {
-        'fwe-chip-container-lg': large
-    }, className);
-    return /*#__PURE__*/ jsx("div", {
-        className: classes,
-        children: children
-    });
-}
-export { ChipContainer };

package/dist/components/icon-wrapper/IconWrapper.d.ts

@@ -1,6 +0,0 @@
-/**
- * Internal wrapper for icons.
- */
-export declare function IconWrapper({ icon }: {
-    readonly icon: React.ReactNode;
-}): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/icon-wrapper/IconWrapper.js

@@ -1,13 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-function IconWrapper({ icon }) {
-    if (!icon) return null;
-    if ('string' == typeof icon) {
-        let iconName = icon;
-        if (!icon.startsWith('fwe-icon-')) iconName = `fwe-icon-${icon}`;
-        return /*#__PURE__*/ jsx("i", {
-            className: `fwe-icon ${iconName}`
-        });
-    }
-    return icon;
-}
-export { IconWrapper };

package/dist/components/loading-indicator/LoadingIndicator.d.ts

@@ -1,5 +0,0 @@
-import { type ComponentPropsWithRef } from 'react';
-export interface LoadingIndicatorProps extends ComponentPropsWithRef<'div'> {
-    readonly size: 'large' | 'medium' | 'small';
-}
-export declare const LoadingIndicator: (props: LoadingIndicatorProps & import("react").RefAttributes<HTMLDivElement>) => React.ReactElement | null;

package/dist/components/loading-indicator/LoadingIndicator.js

@@ -1,41 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import classnames from "classnames";
-import { forwardRef } from "react";
-const LoadingIndicator = /*#__PURE__*/ forwardRef(({ size = 'large', children, className, ...props }, ref)=>{
-    const classes = classnames('fwe-waiting-indicator', {
-        'fwe-waiting-indicator-md': 'medium' === size
-    }, {
-        'fwe-waiting-indicator-sm': 'small' === size
-    });
-    return /*#__PURE__*/ jsxs("div", {
-        className: classnames('fwe-waiting-container', {
-            'fwe-waiting-container-sm': 'small' === size
-        }, className),
-        ref: ref,
-        ...props,
-        children: [
-            /*#__PURE__*/ jsxs("div", {
-                className: classes,
-                children: [
-                    /*#__PURE__*/ jsx("div", {
-                        className: "fwe-waiting-circle-1"
-                    }),
-                    /*#__PURE__*/ jsx("div", {
-                        className: "fwe-waiting-circle-2"
-                    }),
-                    /*#__PURE__*/ jsx("div", {
-                        className: "fwe-waiting-circle-3"
-                    }),
-                    /*#__PURE__*/ jsx("div", {
-                        className: "fwe-waiting-circle-4"
-                    })
-                ]
-            }),
-            children && /*#__PURE__*/ jsx("div", {
-                className: "fwe-waiting-content-container",
-                children: children
-            })
-        ]
-    });
-});
-export { LoadingIndicator };

package/dist/components/mobile-flyout/MobileFlyout.d.ts

@@ -1,11 +0,0 @@
-import { type ComponentPropsWithoutRef } from 'react';
-export interface MobileFlyoutProps extends Omit<ComponentPropsWithoutRef<'div'>, 'onChange'> {
-    open?: boolean;
-    defaultOpen?: boolean;
-    visible?: string[];
-    defaultVisible?: string[];
-    onOpenChange?: (value: boolean) => void;
-    onVisibleChange?: (value: string) => void;
-    back?: string;
-}
-export declare const MobileFlyout: (props: MobileFlyoutProps & import("react").RefAttributes<HTMLDivElement>) => React.ReactElement | null;

package/dist/components/mobile-flyout/MobileFlyout.js

@@ -1,88 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import classnames from "classnames";
-import { forwardRef, useCallback, useMemo, useRef } from "react";
-import { useControlled } from "../../utils/useControlled.js";
-import { useForkRef } from "../../utils/useForkRef.js";
-import { useOnClickOutside } from "../../utils/useOnClickOutside.js";
-import { MobileFlyoutContext } from "./MobileFlyoutContext.js";
-const defaultVisibleValue = [
-    'root'
-];
-const MobileFlyout = /*#__PURE__*/ forwardRef(({ className, children, open, onOpenChange, onVisibleChange, defaultOpen, visible, defaultVisible = defaultVisibleValue, back, ...props }, ref)=>{
-    const [openState, setOpen] = useControlled({
-        controlled: open,
-        default: defaultOpen
-    });
-    const [visibleState, setVisible] = useControlled({
-        controlled: visible,
-        default: defaultVisible
-    });
-    const innerRef = useRef(null);
-    const combinedRef = useForkRef(ref, innerRef);
-    const handleVisibleChange = useCallback((v)=>{
-        if (void 0 !== visibleState) if (visibleState.includes(v)) {
-            const newArray = visibleState.filter((entry)=>entry !== v);
-            setVisible(newArray);
-        } else {
-            const newArray = [
-                ...visibleState,
-                v
-            ];
-            setVisible(newArray);
-        }
-        onVisibleChange?.(v);
-    }, [
-        onVisibleChange,
-        setVisible,
-        visibleState
-    ]);
-    const handleOpenChange = useCallback((v)=>{
-        setOpen(v);
-        onOpenChange?.(v);
-    }, [
-        onOpenChange,
-        setOpen
-    ]);
-    function handleClickOutside() {
-        handleOpenChange(false);
-    }
-    function toggle() {
-        const newOpen = !openState;
-        handleOpenChange(newOpen);
-    }
-    useOnClickOutside(innerRef, handleClickOutside);
-    const contextValue = useMemo(()=>({
-            visible: visibleState ?? defaultVisibleValue,
-            setVisible: handleVisibleChange,
-            setOpen: handleOpenChange,
-            back
-        }), [
-        handleVisibleChange,
-        visibleState,
-        back,
-        handleOpenChange
-    ]);
-    return /*#__PURE__*/ jsxs("div", {
-        className: classnames('fwe-mobile-flyout', className),
-        ...props,
-        ref: combinedRef,
-        children: [
-            /*#__PURE__*/ jsx("button", {
-                "aria-label": "menu",
-                type: "button",
-                className: openState ? 'fwe-close-button' : 'fwe-burger-button',
-                onClick: toggle
-            }),
-            /*#__PURE__*/ jsx("div", {
-                className: classnames('fwe-mobile-flyout-container', {
-                    'fwe-opened': openState
-                }),
-                children: /*#__PURE__*/ jsx(MobileFlyoutContext.Provider, {
-                    value: contextValue,
-                    children: children
-                })
-            })
-        ]
-    });
-});
-export { MobileFlyout };

package/dist/components/mobile-flyout/MobileFlyoutContext.d.ts

@@ -1,8 +0,0 @@
-interface MobileFlyoutContext {
-    visible: string[];
-    setVisible: (value: string) => void;
-    setOpen: (value: boolean) => void;
-    back?: string;
-}
-export declare const MobileFlyoutContext: import("react").Context<MobileFlyoutContext>;
-export {};

package/dist/components/mobile-flyout/MobileFlyoutContext.js

@@ -1,3 +0,0 @@
-import { createContext } from "react";
-const MobileFlyoutContext = /*#__PURE__*/ createContext(null);
-export { MobileFlyoutContext };

package/dist/components/mobile-flyout/mobile-flyout-item/MobileFlyoutItem.d.ts

@@ -1,17 +0,0 @@
-import type { PolymorphicComponentPropWithRef, PolymorphicRef } from '../../../utils/types';
-declare module 'react' {
-    function forwardRef<T, P = object>(render: (props: P, ref: React.Ref<T>) => React.ReactElement | null): (props: P & React.RefAttributes<T>) => React.ReactElement | null;
-}
-export interface MobileFlyoutItemBaseProps {
-    icon?: React.ReactNode;
-    pageLink?: string;
-    active?: boolean;
-}
-export type MobileFlyoutItemProps<C extends React.ElementType> = PolymorphicComponentPropWithRef<C, MobileFlyoutItemBaseProps>;
-export declare const MobileFlyoutItem: <C extends React.ElementType = "a">(props: MobileFlyoutItemBaseProps & {
-    component?: C | undefined;
-} & {
-    children?: import("react").ReactNode | undefined;
-} & Omit<import("react").PropsWithoutRef<import("react").ComponentProps<C>>, "component" | keyof MobileFlyoutItemBaseProps> & {
-    ref?: PolymorphicRef<C> | undefined;
-} & import("react").RefAttributes<unknown>) => React.ReactElement | null;

package/dist/components/mobile-flyout/mobile-flyout-item/MobileFlyoutItem.js

@@ -1,36 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { IconRight2 } from "@festo-ui/react-icons";
-import classnames from "classnames";
-import { forwardRef, useContext } from "react";
-import { IconWrapper } from "../../icon-wrapper/IconWrapper.js";
-import { MobileFlyoutContext } from "../MobileFlyoutContext.js";
-const MobileFlyoutItem = /*#__PURE__*/ forwardRef(({ component, children, pageLink, icon, onClick, active, ...props }, ref)=>{
-    const Component = component || 'a';
-    const { setVisible, setOpen } = useContext(MobileFlyoutContext);
-    function handleClick(e) {
-        if (pageLink) setVisible(pageLink);
-        else setOpen(false);
-        onClick?.(e);
-    }
-    return /*#__PURE__*/ jsxs(Component, {
-        className: "fwe-mobile-flyout-item fwe-bb",
-        ...props,
-        ref: ref,
-        onClick: handleClick,
-        children: [
-            /*#__PURE__*/ jsx(IconWrapper, {
-                icon: icon
-            }),
-            /*#__PURE__*/ jsx("div", {
-                className: classnames('fwe-flex-grow-1', {
-                    'fwe-color-hero': active
-                }, {
-                    'fwe-ml-xxs': !!icon
-                }),
-                children: children
-            }),
-            pageLink && /*#__PURE__*/ jsx(IconRight2, {})
-        ]
-    });
-});
-export { MobileFlyoutItem };

package/dist/components/mobile-flyout/mobile-flyout-page/MobileFlyoutPage.css

@@ -1,5 +0,0 @@
-.fr-mobile-flyout-page-back {
-  border: none;
-  width: 100%;
-}
-

package/dist/components/mobile-flyout/mobile-flyout-page/MobileFlyoutPage.d.ts

@@ -1,8 +0,0 @@
-import './MobileFlyoutPage.scss';
-import { type ComponentPropsWithoutRef } from 'react';
-export interface MobileFlyoutPageProps extends ComponentPropsWithoutRef<'div'> {
-    back?: string;
-    name?: string;
-    root?: boolean;
-}
-export declare const MobileFlyoutPage: (props: MobileFlyoutPageProps & import("react").RefAttributes<HTMLDivElement>) => React.ReactElement | null;

package/dist/components/mobile-flyout/mobile-flyout-page/MobileFlyoutPage.js

@@ -1,35 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import "./MobileFlyoutPage.css";
-import classnames from "classnames";
-import { forwardRef, useContext } from "react";
-import { MobileFlyoutContext } from "../MobileFlyoutContext.js";
-const MobileFlyoutPage = /*#__PURE__*/ forwardRef(({ back, children, name, root, ...props }, ref)=>{
-    const { visible, setVisible, back: backContext } = useContext(MobileFlyoutContext);
-    const innerVisible = root || name && visible.includes(name);
-    const innerBack = back ?? backContext ?? 'Back';
-    function handleChange() {
-        if (name) setVisible(name);
-    }
-    return /*#__PURE__*/ jsxs("div", {
-        className: classnames('fwe-mobile-flyout-page', {
-            'fwe-opened': innerVisible
-        }),
-        ref: ref,
-        ...props,
-        children: [
-            !root && /*#__PURE__*/ jsx("button", {
-                type: "button",
-                className: "fwe-page-back fr-mobile-flyout-page-back",
-                onClick: handleChange,
-                children: /*#__PURE__*/ jsx("div", {
-                    children: innerBack
-                })
-            }),
-            /*#__PURE__*/ jsx("div", {
-                className: "fwe-mobile-flyout-item-container",
-                children: children
-            })
-        ]
-    });
-});
-export { MobileFlyoutPage };

package/dist/components/modals/AlertModal.d.ts

@@ -1,12 +0,0 @@
-import { type ModalProps } from './Modal';
-export interface AlertModalProps extends Omit<ModalProps, 'head' | 'children'> {
-    readonly title: string;
-    readonly subtitle?: string;
-    readonly alertType: 'info' | 'warning' | 'error';
-    readonly strong?: boolean;
-    readonly cancel?: string;
-    readonly ok?: string;
-    readonly onCancel?: () => void;
-    readonly onOk?: () => void;
-}
-export declare function AlertModal({ title, subtitle, alertType, strong, cancel, ok, onCancel, onOk, className, body, ...props }: AlertModalProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/modals/AlertModal.js

@@ -1,53 +0,0 @@
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import classnames from "classnames";
-import { Modal } from "./Modal.js";
-import { ModalFooter } from "./ModalFooter.js";
-function AlertModal({ title, subtitle, alertType, strong, cancel, ok, onCancel, onOk, className, body, ...props }) {
-    return /*#__PURE__*/ jsx(Modal, {
-        className: classnames({
-            'fwe-modal--with-indicator-bar': strong,
-            'fwe-modal--warning': 'warning' === alertType,
-            'fwe-modal--error': 'error' === alertType,
-            'fwe-modal--info': 'info' === alertType
-        }, className),
-        head: /*#__PURE__*/ jsxs(Fragment, {
-            children: [
-                subtitle && /*#__PURE__*/ jsx("h2", {
-                    className: "fwe-modal-h2",
-                    children: subtitle
-                }),
-                /*#__PURE__*/ jsx("h1", {
-                    className: "fwe-modal-h1",
-                    children: title
-                })
-            ]
-        }),
-        body: 'string' == typeof body ? /*#__PURE__*/ jsx("p", {
-            children: body
-        }) : body,
-        ...props,
-        children: (cancel || ok) && /*#__PURE__*/ jsxs(ModalFooter, {
-            children: [
-                cancel && /*#__PURE__*/ jsx("button", {
-                    type: "button",
-                    "aria-label": "Cancel",
-                    className: classnames('fwe-btn fwe-btn-lg', {
-                        'fwe-btn-link': strong
-                    }),
-                    onClick: onCancel,
-                    children: cancel
-                }),
-                ok && /*#__PURE__*/ jsx("button", {
-                    type: "button",
-                    "aria-label": "Ok",
-                    className: classnames('fwe-btn fwe-btn-lg', {
-                        'fwe-btn-hero': !strong
-                    }),
-                    onClick: onOk,
-                    children: ok
-                })
-            ]
-        })
-    });
-}
-export { AlertModal };

package/dist/components/modals/ConfirmModal.d.ts

@@ -1,11 +0,0 @@
-import { type ModalProps } from './Modal';
-export interface ConfirmModalProps extends Omit<ModalProps, 'head' | 'children'> {
-    readonly title: string;
-    readonly subtitle?: string;
-    readonly cancel?: string;
-    readonly ok?: string;
-    readonly onCancel?: () => void;
-    readonly onOk?: () => void;
-    readonly large?: boolean;
-}
-export declare function ConfirmModal({ title, subtitle, cancel, ok, onCancel, onOk, large, body, className, ...props }: ConfirmModalProps): import("react/jsx-runtime").JSX.Element;