@festo-ui/react 9.0.0-dev.707 → 9.0.0-dev.709

package/lib/components/search-input/SearchSuggestion.js

@@ -1,32 +0,0 @@
-export default class SearchSuggestion {
-  /**
-   * a html-string. e.g.: '<b> hello </b>'
-   */
-
-  /**
-   * This Value will be used as new query when the user selects the suggestion.
-   */
-
-  /**
-   * Creates a basic Suggestion from a string. The first query match is highlighted by bold tags.
-   * @param suggestionString The suggested string (should contain the whole query)
-   * @param query The current query. This string will be highlighted.
-   * @returns a html-string.
-   */
-  static basicSuggestion(suggestionString, query) {
-    const i = suggestionString.toLocaleLowerCase().indexOf(query.toLocaleLowerCase());
-    let template = suggestionString;
-    if (i !== -1) {
-      const boldStart = i;
-      const boldEnd = i + query.length;
-      const part1 = suggestionString.substring(0, boldStart);
-      const part2 = suggestionString.substring(boldStart, boldEnd);
-      const part3 = suggestionString.substring(boldEnd, suggestionString.length);
-      template = `${part1}<strong>${part2}</strong>${part3}`;
-    }
-    return {
-      value: suggestionString,
-      template
-    };
-  }
-}

package/lib/components/search-input/useSearchInput.js

@@ -1,94 +0,0 @@
-import { useState } from "react";
-import useControlled from "../../helper/useControlled.js";
-export default function useSearchInput(inputRef, cappedSuggestions, value) {
-  let defaultValue = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : "";
-  let onChange = arguments.length > 4 ? arguments[4] : undefined;
-  let onSearch = arguments.length > 5 ? arguments[5] : undefined;
-  let onKeyboardNavigate = arguments.length > 6 ? arguments[6] : undefined;
-  const [innerValue, setValue] = useControlled({
-    controlled: value,
-    default: defaultValue
-  });
-  const [hideSuggestionList, setHideSuggestionList] = useState(false);
-  const [selectedSuggestionIndex, setSelectedSuggestionIndex] = useState(-1);
-  function blurInput() {
-    if (inputRef.current) {
-      inputRef.current.blur();
-    }
-  }
-  function reset() {
-    setSelectedSuggestionIndex(-1);
-    setHideSuggestionList(true);
-    blurInput();
-  }
-  function handleSearch() {
-    reset();
-    if (innerValue !== undefined) {
-      onSearch?.(innerValue);
-    }
-  }
-  function updateValue(newValue) {
-    setValue(newValue);
-    onChange?.(newValue);
-    onSearch?.(newValue);
-  }
-  function handleClearQuery() {
-    reset();
-    updateValue("");
-  }
-  function handleArrowKey(newSuggestionIndex) {
-    if (!cappedSuggestions || !cappedSuggestions.length) {
-      return;
-    }
-    const selectedSuggestion = cappedSuggestions[newSuggestionIndex];
-    setSelectedSuggestionIndex(newSuggestionIndex);
-    setValue(selectedSuggestion.value);
-    onKeyboardNavigate?.(selectedSuggestion.value);
-  }
-  function handleUpArrowKey() {
-    handleArrowKey(selectedSuggestionIndex > 0 ? selectedSuggestionIndex - 1 : cappedSuggestions.length - 1);
-  }
-  function handleDownArrowKey() {
-    handleArrowKey(selectedSuggestionIndex >= cappedSuggestions.length - 1 ? 0 : selectedSuggestionIndex + 1);
-  }
-  function handleKeyDown(event) {
-    switch (event.key) {
-      case "Enter":
-        handleSearch();
-        break;
-      case "Escape":
-        handleClearQuery();
-        break;
-      case "ArrowUp":
-        handleUpArrowKey();
-        break;
-      case "ArrowDown":
-        handleDownArrowKey();
-        break;
-      default:
-        break;
-    }
-  }
-  const handleFocus = () => setHideSuggestionList(false);
-  const handleOutsideClick = () => setHideSuggestionList(true);
-  function handleSuggestionClick(suggestion) {
-    reset();
-    updateValue(suggestion.value);
-  }
-  function handleInput(event) {
-    setSelectedSuggestionIndex(-1);
-    setValue(event.target.value);
-    onChange?.(event.target.value);
-  }
-  return {
-    innerValue,
-    hideSuggestionList,
-    selectedSuggestionIndex,
-    handleClearQuery,
-    handleFocus,
-    handleInput,
-    handleSuggestionClick,
-    handleOutsideClick,
-    handleKeyDown
-  };
-}

package/lib/components/snackbar/Snackbar.js

@@ -1,78 +0,0 @@
-import { useEffect, useRef, useState } from "react";
-import classNames from "classnames";
-import { CSSTransition } from "react-transition-group";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-function Snackbar(props) {
-  const {
-    data,
-    onAction,
-    onClose,
-    first = false
-  } = props;
-  const [show, setShow] = useState(true);
-  const nodeRef = useRef(null);
-  useEffect(() => {
-    let disappearAfter = 5000;
-    if (data?.disappearAfter !== null) {
-      if (data?.disappearAfter && data?.disappearAfter > 0) {
-        disappearAfter = data?.disappearAfter;
-      }
-      const timer = setTimeout(() => setShow(false), disappearAfter);
-      return () => {
-        clearTimeout(timer);
-      };
-    }
-    return undefined;
-  }, [data]);
-  function handleClose() {
-    setShow(false);
-  }
-  const classes = first ? "fr-snackbar-wrapper--first" : "fr-snackbar-wrapper";
-  return /*#__PURE__*/_jsx(CSSTransition, {
-    nodeRef: nodeRef,
-    onExited: () => onClose ? onClose() : undefined,
-    unmountOnExit: true,
-    timeout: {
-      exit: 600
-    },
-    in: show,
-    classNames: classes,
-    appear: true,
-    children: /*#__PURE__*/_jsx("div", {
-      ref: nodeRef,
-      className: classes,
-      children: /*#__PURE__*/_jsxs("div", {
-        className: classNames({
-          "fwe-snackbar": true,
-          "fwe-snackbar-b": data?.variant === "b",
-          "fwe-snackbar-c": data?.variant === "c",
-          "fwe-snackbar-info": data?.type === "info",
-          "fwe-snackbar-warning": data?.type === "warning",
-          "fwe-snackbar-error": data?.type === "error",
-          "fwe-snackbar-shadow": data?.darkBackground
-        }, data?.className),
-        children: [/*#__PURE__*/_jsx("span", {
-          children: data?.text
-        }), data?.action && /*#__PURE__*/_jsx("button", {
-          "aria-label": "UserAction",
-          type: "button",
-          className: "fwe-snackbar-link-btn",
-          onClick: () => onAction ? onAction() : undefined,
-          children: data?.action
-        }), data?.action && data?.showClose && /*#__PURE__*/_jsx("div", {
-          className: "fwe-snackbar-separator"
-        }), data?.showClose && /*#__PURE__*/_jsx("button", {
-          "aria-label": "Close",
-          type: "button",
-          className: "fwe-snackbar-close-btn",
-          onClick: handleClose,
-          children: /*#__PURE__*/_jsx("span", {
-            className: "fwe-sr-only",
-            children: "Close"
-          })
-        })]
-      })
-    })
-  });
-}
-export default Snackbar;

package/lib/components/snackbar/SnackbarContext.js

@@ -1,2 +0,0 @@
-import React from "react";
-export default /*#__PURE__*/React.createContext(null);

package/lib/components/snackbar/SnackbarProvider.d.ts

@@ -1,8 +0,0 @@
-import { ClassNamePropsWithChildren } from "../../helper/types";
-import { SnackbarConfig, SnackbarData } from "./Snackbar";
-interface SnackbarProviderProps extends ClassNamePropsWithChildren {
-    config?: SnackbarConfig;
-}
-declare function SnackbarProvider(props: SnackbarProviderProps): import("react/jsx-runtime").JSX.Element;
-export default SnackbarProvider;
-export declare const addSnackbar: (snackData: SnackbarData, onAction?: () => void, onClose?: () => void) => string | number;

package/lib/components/snackbar/SnackbarProvider.js

@@ -1,65 +0,0 @@
-import { useCallback, useMemo, useState } from "react";
-import classNames from "classnames";
-import Snackbar from "./Snackbar.js";
-import SnackbarContext from "./SnackbarContext.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-let addSnackbarFunction;
-function SnackbarProvider(props) {
-  const {
-    config = {
-      darkBackground: true
-    },
-    children,
-    className
-  } = props;
-  const [snacks, setSnacks] = useState([]);
-  const addSnackbar = useCallback((snackData, onAction, onClose) => {
-    const key = snackData.key ?? new Date().getTime() + Math.random();
-    setSnacks(prevSnacks => [{
-      data: {
-        ...config,
-        ...snackData
-      },
-      onAction,
-      onClose,
-      key,
-      first: prevSnacks.length === 0
-    }, ...prevSnacks]);
-    return key;
-  }, [config]);
-  addSnackbarFunction = addSnackbar;
-  function closeSnackbar(key) {
-    if (key !== undefined) {
-      setSnacks(prevSnacks => prevSnacks.filter(snack => snack.key !== key));
-    }
-  }
-  function handleClose(snack) {
-    closeSnackbar(snack.key);
-    if (snack.onClose) {
-      snack.onClose();
-    }
-  }
-  const contextValue = useMemo(() => ({
-    addSnackbar,
-    closeSnackbar
-  }), [addSnackbar]);
-  return /*#__PURE__*/_jsxs(SnackbarContext.Provider, {
-    value: contextValue,
-    children: [children, /*#__PURE__*/_jsx("div", {
-      className: classNames("fwe-snackbar-container", className),
-      children: snacks.map(snack => /*#__PURE__*/_jsx(Snackbar, {
-        data: snack.data,
-        onAction: () => snack.onAction ? snack.onAction() : undefined,
-        onClose: () => handleClose(snack),
-        first: snack.first
-      }, snack.key))
-    })]
-  });
-}
-export default SnackbarProvider;
-export const addSnackbar = (snackData, onAction, onClose) => {
-  if (!addSnackbarFunction) {
-    throw new Error("SnackbarProvider is not mounted.");
-  }
-  return addSnackbarFunction(snackData, onAction, onClose);
-};

package/lib/components/snackbar/useSnackbar.d.ts

@@ -1,3 +0,0 @@
-import { ProviderContext } from "./SnackbarContext";
-declare const _default: () => ProviderContext;
-export default _default;

package/lib/components/snackbar/useSnackbar.js

@@ -1,3 +0,0 @@
-import { useContext } from "react";
-import SnackbarContext from "./SnackbarContext.js";
-export default () => useContext(SnackbarContext);

package/lib/components/stepper-horizontal/StepperHorizontal.d.ts

@@ -1,7 +0,0 @@
-import React, { ComponentPropsWithoutRef } from "react";
-interface StepperHorizontalProps extends Omit<ComponentPropsWithoutRef<"div">, "onChange"> {
-    stepIndex?: number;
-    onChange?: (stepIndex: number) => void;
-}
-declare const StepperHorizontal: (props: StepperHorizontalProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
-export default StepperHorizontal;

package/lib/components/stepper-horizontal/StepperHorizontal.js

@@ -1,60 +0,0 @@
-import cn from "classnames";
-import React, { forwardRef } from "react";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-const StepperHorizontal = /*#__PURE__*/forwardRef((_ref, ref) => {
-  let {
-    children,
-    className,
-    stepIndex = 0,
-    onChange,
-    ...props
-  } = _ref;
-  const stepComponents = React.Children.map(children, (child, i) => /*#__PURE__*/React.isValidElement(child) ? /*#__PURE__*/React.cloneElement(child, {
-    ...child.props,
-    isActive: i === stepIndex
-  }) : null);
-  function handleStepClick(index) {
-    if (stepIndex > index && onChange) {
-      onChange(index);
-    }
-  }
-  const handleKeyDown = i => event => {
-    if (event.key === "Enter") {
-      handleStepClick(i);
-    }
-  };
-  const handleKeyUp = i => event => {
-    if (event.key === " ") {
-      handleStepClick(i);
-    }
-  };
-  return /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsx("div", {
-      className: "fwe-stepper-horizontal",
-      children: stepComponents && stepComponents.map((step, i) => /*#__PURE__*/_jsx("div", {
-        tabIndex: 0,
-        role: "button",
-        ref: ref,
-        onKeyDown: handleKeyDown(i),
-        onKeyUp: handleKeyUp(i),
-        className: cn("fwe-step-container", {
-          "fwe-step-done": stepIndex > i,
-          "fwe-step-active": i === stepIndex
-        }),
-        onClick: () => handleStepClick(i),
-        ...props,
-        children: /*#__PURE__*/_jsxs("div", {
-          className: "fwe-step",
-          children: [/*#__PURE__*/_jsx("div", {
-            className: "fwe-step-no",
-            children: i + 1
-          }), /*#__PURE__*/_jsx("div", {
-            className: "fwe-step-name",
-            children: step.props.title
-          })]
-        })
-      }, step.props.title))
-    }), stepComponents]
-  });
-});
-export default StepperHorizontal;

package/lib/components/stepper-horizontal/step-horizontal/StepHorizontal.d.ts

@@ -1,7 +0,0 @@
-import "./StepHorizontal.scss";
-import { ComponentPropsWithoutRef } from "react";
-export interface StepHorizontalProps extends ComponentPropsWithoutRef<"div"> {
-    isActive?: boolean;
-}
-declare const StepHorizontal: (props: StepHorizontalProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
-export default StepHorizontal;

package/lib/components/stepper-horizontal/step-horizontal/StepHorizontal.js

@@ -1,23 +0,0 @@
-import cn from "classnames";
-import { forwardRef } from "react";
-import { jsx as _jsx } from "react/jsx-runtime";
-const StepHorizontal = /*#__PURE__*/forwardRef((_ref, ref) => {
-  let {
-    children,
-    className,
-    isActive,
-    ...props
-  } = _ref;
-  return /*#__PURE__*/_jsx("div", {
-    ref: ref,
-    className: cn("overflow-hidden", {
-      hidden: !isActive
-    }),
-    ...props,
-    children: /*#__PURE__*/_jsx("div", {
-      className: "fr-moving-container",
-      children: children
-    })
-  });
-});
-export default StepHorizontal;

package/lib/components/stepper-vertical/StepperVertical.d.ts

@@ -1,7 +0,0 @@
-import React, { ComponentPropsWithoutRef } from "react";
-interface StepperVerticalProps extends Omit<ComponentPropsWithoutRef<"div">, "onChange"> {
-    stepIndex?: number;
-    onChange?: (stepIndex: number) => void;
-}
-declare const StepperVertical: (props: StepperVerticalProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
-export default StepperVertical;

package/lib/components/stepper-vertical/StepperVertical.js

@@ -1,37 +0,0 @@
-import cn from "classnames";
-import React, { forwardRef } from "react";
-import { jsx as _jsx } from "react/jsx-runtime";
-const StepperVertical = /*#__PURE__*/forwardRef((_ref, ref) => {
-  let {
-    children,
-    className,
-    stepIndex = 0,
-    onChange,
-    ...props
-  } = _ref;
-  function handleStepClick(index) {
-    if (stepIndex > index && onChange) {
-      onChange(index);
-    }
-  }
-  const stepComponents = React.Children.map(children, (child, i) => {
-    if (/*#__PURE__*/React.isValidElement(child)) {
-      return /*#__PURE__*/React.cloneElement(child, {
-        ...child.props,
-        isActive: i === stepIndex,
-        index: i,
-        isDone: i < stepIndex,
-        isLastElement: i === React.Children.count(children) - 1,
-        onStepClick: () => handleStepClick(i)
-      });
-    }
-    return null;
-  });
-  return /*#__PURE__*/_jsx("div", {
-    ref: ref,
-    className: cn("fwe-stepper-vertical", className),
-    ...props,
-    children: stepComponents
-  });
-});
-export default StepperVertical;

package/lib/components/stepper-vertical/step-vertical/StepVertical.d.ts

@@ -1,12 +0,0 @@
-import "./StepVertical.scss";
-import { ComponentPropsWithoutRef } from "react";
-interface StepVerticalProps extends ComponentPropsWithoutRef<"div"> {
-    isActive?: boolean;
-    isLastElement?: boolean;
-    isDone?: boolean;
-    index?: number;
-    title?: string;
-    onStepClick?: () => void;
-}
-declare const StepVertical: (props: StepVerticalProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
-export default StepVertical;

package/lib/components/stepper-vertical/step-vertical/StepVertical.js

@@ -1,76 +0,0 @@
-import cn from "classnames";
-import { forwardRef, useEffect, useRef } from "react";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const StepVertical = /*#__PURE__*/forwardRef((_ref, ref) => {
-  let {
-    children,
-    className,
-    isActive,
-    isLastElement,
-    isDone,
-    index,
-    title,
-    onStepClick,
-    ...props
-  } = _ref;
-  const containerRef = useRef(null);
-  const contentRef = useRef(null);
-  useEffect(() => {
-    if (containerRef.current) {
-      if (isActive) {
-        const itemHeight = contentRef.current?.offsetHeight;
-        containerRef.current.style.height = `${itemHeight}px`;
-      } else {
-        containerRef.current.style.height = "20px";
-      }
-    }
-  }, [isActive]);
-  function handleClick() {
-    if (onStepClick) {
-      onStepClick();
-    }
-  }
-  const handleKeyDown = event => {
-    if (event.key === "Enter") {
-      handleClick();
-    }
-  };
-  const handleKeyUp = event => {
-    if (event.key === " ") {
-      handleClick();
-    }
-  };
-  return /*#__PURE__*/_jsxs("div", {
-    ref: ref,
-    className: cn("fwe-step-container", {
-      "fwe-last-element": isLastElement,
-      "fwe-step-active": isActive,
-      "fwe-step-done": isDone
-    }),
-    ...props,
-    children: [/*#__PURE__*/_jsxs("div", {
-      tabIndex: 0,
-      role: "button",
-      className: "fwe-step",
-      onClick: handleClick,
-      onKeyDown: handleKeyDown,
-      onKeyUp: handleKeyUp,
-      children: [index !== undefined && /*#__PURE__*/_jsx("div", {
-        className: "fwe-step-no",
-        children: index + 1
-      }), /*#__PURE__*/_jsx("div", {
-        className: "fwe-step-name",
-        children: title
-      })]
-    }), /*#__PURE__*/_jsx("div", {
-      ref: containerRef,
-      className: "fwe-step-content-container",
-      children: /*#__PURE__*/_jsx("div", {
-        ref: contentRef,
-        className: "fwe-step-content",
-        children: children
-      })
-    })]
-  });
-});
-export default StepVertical;

package/lib/components/tab/Tabs.d.ts

@@ -1,23 +0,0 @@
-import "./Tabs.scss";
-import React, { ComponentPropsWithoutRef } from "react";
-type TabItemAppearance = "fill" | "equal" | "default";
-export type TabViewType = "legacy" | "responsive";
-export interface TabsConfiguration {
-    tabBar?: {
-        fullWidth?: boolean;
-    };
-    tabItems?: {
-        appearance: TabItemAppearance;
-    };
-}
-interface TabsProps extends Omit<ComponentPropsWithoutRef<"div">, "onChange"> {
-    config?: TabsConfiguration;
-    viewType?: TabViewType;
-    showDivider?: boolean;
-    onChange?: (value: {
-        previous: string;
-        current: string;
-    }) => void;
-}
-declare const Tabs: (props: TabsProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
-export default Tabs;