@festo-ui/react 3.1.0 → 3.2.0

package/lib/components/accordion/Accordion.d.ts

@@ -0,0 +1,9 @@
+import './Accordion.scss';
+import { ComponentPropsWithoutRef } from 'react';
+interface AccordionProps extends ComponentPropsWithoutRef<'div'> {
+    showMore?: string;
+    showLess?: string;
+    keepItemsOpen?: boolean;
+}
+declare const Accordion: import("react").ForwardRefExoticComponent<AccordionProps & import("react").RefAttributes<HTMLDivElement>>;
+export default Accordion;

package/lib/components/accordion/AccordionContext.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+interface ContextProps {
+    showMore: string;
+    showLess: string;
+    parentId: string;
+    keepItemsOpen: boolean;
+    expanded: boolean | string;
+    toggle: (id: string, expanded: boolean) => void;
+}
+declare const AccordionContext: import("react").Context<Partial<ContextProps>>;
+export default AccordionContext;

package/lib/components/accordion/accordion-header/AccordionHeader.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import './AccordionHeader.scss';
+declare const AccordionHeader: import("react").ForwardRefExoticComponent<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & import("react").RefAttributes<HTMLDivElement>>;
+export default AccordionHeader;

package/lib/components/accordion/accordion-item/AccordionItem.d.ts

@@ -0,0 +1,9 @@
+import './AccordionItem.scss';
+import { ComponentPropsWithoutRef } from 'react';
+interface AccordionItemProps extends Omit<ComponentPropsWithoutRef<'div'>, 'onChange'> {
+    expanded?: boolean;
+    defaultExpanded?: boolean;
+    onChange?: (event: React.SyntheticEvent, expanded: boolean) => void;
+}
+declare const AccordionItem: import("react").ForwardRefExoticComponent<AccordionItemProps & import("react").RefAttributes<HTMLDivElement>>;
+export default AccordionItem;

package/lib/components/accordion/accordion-item/AccordionItemContext.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+interface ContextProps {
+    expanded: boolean;
+    toggle: (event: React.SyntheticEvent) => void;
+    id: string;
+}
+declare const AccordionContext: import("react").Context<Partial<ContextProps>>;
+export default AccordionContext;

package/lib/components/accordion/accordion-item/accordion-item-body/AccordionItemBody.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import './AccordionItemBody.scss';
+declare const AccordionItemBody: import("react").ForwardRefExoticComponent<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & import("react").RefAttributes<HTMLDivElement>>;
+export default AccordionItemBody;

package/lib/components/accordion/accordion-item/accordion-item-header/AccordionItemHeader.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import './AccordionItemHeader.scss';
+declare const AccordionItemHeader: import("react").ForwardRefExoticComponent<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & import("react").RefAttributes<HTMLDivElement>>;
+export default AccordionItemHeader;

package/lib/components/buttons/button/Button.d.ts

@@ -1,3 +1,4 @@
+import './Button.scss';
 import React from 'react';
 import { ClassNamePropsWithChildren } from '../../../helper/types';
 interface ButtonProps extends ClassNamePropsWithChildren {

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

@@ -15,5 +15,5 @@ interface ChipProps extends ClassNamePropsWithChildren {
     large?: boolean;
     onClick?: (e: React.MouseEvent<HTMLElement, MouseEvent>) => void;
 }
-declare function Chip({ type, selected, disabled, large, icon, children, onClick, className, }: ChipProps): JSX.Element;
+declare function Chip({ type, selected, disabled, large, icon, children, onClick, className }: ChipProps): JSX.Element;
 export default Chip;

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

@@ -7,6 +7,7 @@ interface ConfirmModalProps extends Omit<ModalProps, 'head' | 'children'> {
     ok?: string;
     onCancel?: () => void;
     onOk?: () => void;
+    large?: boolean;
 }
-declare function ConfirmModal({ title, subtitle, body, className, cancel, ok, onCancel, onOk, isOpen, ...props }: ConfirmModalProps): JSX.Element;
+declare function ConfirmModal({ title, subtitle, body, className, cancel, ok, onCancel, onOk, isOpen, large, ...props }: ConfirmModalProps): JSX.Element;
 export default ConfirmModal;

package/lib/components/modals/ModalFooter.d.ts

@@ -1,7 +1,4 @@
 import React from 'react';
 import { ClassNamePropsWithChildren } from '../../helper/types';
-interface ModalFooterProps extends ClassNamePropsWithChildren {
-    fullWidth?: boolean;
-}
-declare const ModalFooter: React.ForwardRefExoticComponent<ModalFooterProps & React.RefAttributes<HTMLDivElement>>;
+declare const ModalFooter: React.ForwardRefExoticComponent<ClassNamePropsWithChildren & React.RefAttributes<HTMLDivElement>>;
 export default ModalFooter;

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

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

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

@@ -0,0 +1,7 @@
+import './StepHorizontal.scss';
+import { ComponentPropsWithoutRef } from 'react';
+interface StepHorizontalProps extends ComponentPropsWithoutRef<'div'> {
+    isActive?: boolean;
+}
+declare const StepHorizontal: import("react").ForwardRefExoticComponent<StepHorizontalProps & import("react").RefAttributes<HTMLDivElement>>;
+export default StepHorizontal;

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

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

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

@@ -0,0 +1,12 @@
+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: import("react").ForwardRefExoticComponent<StepVerticalProps & import("react").RefAttributes<HTMLDivElement>>;
+export default StepVertical;

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

@@ -1,7 +1,7 @@
-/// <reference types="react" />
-import { ClassNamePropsWithChildren } from '../../helper/types';
 import './Tabs.scss';
+import React, { ComponentPropsWithoutRef } from 'react';
 declare type TabItemAppearance = 'fill' | 'equal' | 'default';
+export declare type TabViewType = 'legacy' | 'responsive';
 export interface TabsConfiguration {
     tabBar?: {
         fullWidth?: boolean;
@@ -10,12 +10,14 @@ export interface TabsConfiguration {
         appearance: TabItemAppearance;
     };
 }
-interface TabsProps extends ClassNamePropsWithChildren {
-    config: TabsConfiguration;
+interface TabsProps extends Omit<ComponentPropsWithoutRef<'div'>, 'onChange'> {
+    config?: TabsConfiguration;
+    viewType?: TabViewType;
+    showDivider?: boolean;
     onChange?: (value: {
         previous: string;
         current: string;
     }) => void;
 }
-declare function Tabs({ config, children, className, onChange }: TabsProps): JSX.Element;
+export declare const Tabs: React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>>;
 export default Tabs;

package/lib/components/tab/tab-pane/TabPane.d.ts

@@ -2,11 +2,12 @@
 import { ClassNamePropsWithChildren } from '../../../helper/types';
 import './TabPane.scss';
 export interface TabPaneProps extends ClassNamePropsWithChildren {
-    id: string;
+    id?: string;
     name: string;
     icon?: string;
     active?: boolean;
     isVisible?: boolean;
+    tabId?: string;
 }
-declare function TabPane({ isVisible, children, className }: TabPaneProps): JSX.Element;
+declare function TabPane({ isVisible, children, className, tabId, id }: TabPaneProps): JSX.Element;
 export default TabPane;

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

@@ -0,0 +1,24 @@
+import React, { CSSProperties } from 'react';
+export interface TabDimensions {
+    rootLeft: number;
+    rootRight: number;
+    contentLeft: number;
+    contentRight: number;
+}
+export interface TabScrollAnimation {
+    finalScrollPosition: number;
+    scrollDelta: number;
+}
+export interface TabScrollHorizontalEdges {
+    left: number;
+    right: number;
+}
+declare type TypeHandleTabScroll = (e: React.MouseEvent<HTMLButtonElement>, index: number) => void;
+interface Refs {
+    elRef: React.MutableRefObject<HTMLDivElement>;
+    scrollContent: React.MutableRefObject<HTMLDivElement>;
+    scrollArea: React.MutableRefObject<HTMLDivElement>;
+}
+declare type TypeUseTabScroll = (tabLength: number, componentId: string, refs: Refs) => [TypeHandleTabScroll, string, CSSProperties];
+declare const useTabScroll: TypeUseTabScroll;
+export default useTabScroll;

package/lib/forms/color-picker/ColorPicker.d.ts

@@ -11,5 +11,5 @@ interface ColorPickerProps extends ClassNameProps {
     onChange?: (color?: string | null) => void;
     onAlphaChange?: (alpha?: number) => void;
 }
-declare function ColorPicker({ palette, useAlpha, alpha, paletteOnly, color, onChange, onAlphaChange, className, }: ColorPickerProps): JSX.Element;
+declare function ColorPicker({ palette, useAlpha, alpha, paletteOnly, color, onChange, onAlphaChange, className }: ColorPickerProps): JSX.Element;
 export default ColorPicker;

package/lib/forms/radio/RadioButton.d.ts

@@ -11,5 +11,5 @@ export interface RadioButtonProps extends ClassNamePropsWithChildren {
     disabled?: boolean;
     required?: boolean;
 }
-declare function RadioButton({ id, onChange, value, name, checked, labelPosition, large, disabled, required, children, className, }: RadioButtonProps): JSX.Element;
+declare function RadioButton({ id, onChange, value, name, checked, labelPosition, large, disabled, required, children, className }: RadioButtonProps): JSX.Element;
 export default RadioButton;

package/lib/forms/radio/RadioGroup.d.ts

@@ -9,5 +9,5 @@ interface RadioGroupProps extends ClassNamePropsWithChildren {
     disabled?: boolean;
     required?: boolean;
 }
-declare function RadioGroup({ value, name, checked, labelPosition, large, disabled, required, children, className, }: RadioGroupProps): JSX.Element;
+declare function RadioGroup({ value, name, checked, labelPosition, large, disabled, required, children, className }: RadioGroupProps): JSX.Element;
 export default RadioGroup;

package/lib/forms/slider/Slider.d.ts

@@ -13,5 +13,5 @@ interface SliderProps extends ClassNameProps {
     showValue?: boolean;
     onChange?: (event: React.ChangeEvent<HTMLInputElement>, value: number) => void;
 }
-declare function Slider({ disabled, label, large, max, min, onChange, onChangeCommitted, step, value, showValue, className, }: SliderProps): JSX.Element;
+declare function Slider({ disabled, label, large, max, min, onChange, onChangeCommitted, step, value, showValue, className }: SliderProps): JSX.Element;
 export default Slider;

package/lib/forms/text-editor/TextEditor.d.ts

@@ -25,5 +25,5 @@ export interface TextEditorProps {
     className?: string;
     config?: TextEditorConfiguration;
 }
-export declare function TextEditor({ disabled, label, maxLength, value, hint, error, readOnly, onChange, className, config: configProps, }: TextEditorProps): JSX.Element;
+export declare function TextEditor({ disabled, label, maxLength, value, hint, error, readOnly, onChange, className, config: configProps }: TextEditorProps): JSX.Element;
 export default TextEditor;

package/lib/forms/time-picker/TimePicker.d.ts

@@ -0,0 +1,18 @@
+import React, { ComponentPropsWithoutRef } from 'react';
+export interface TimePickerOptions {
+    timeFormat?: '12' | '24';
+    showSeconds?: boolean;
+}
+export interface TimePickerProps extends Omit<ComponentPropsWithoutRef<'label'>, 'value' | 'defaultValue' | 'onChange'> {
+    error?: string;
+    hint?: string;
+    required?: boolean;
+    disabled?: boolean;
+    value?: Date;
+    defaultValue?: Date;
+    options?: TimePickerOptions;
+    formatDate?: (date: Date) => string;
+    onChange?: (date: Date) => void;
+}
+declare const TimePicker: React.ForwardRefExoticComponent<TimePickerProps & React.RefAttributes<HTMLLabelElement>>;
+export default TimePicker;

package/lib/forms/time-picker/time-picker-dropdown/TimePickerDropdown.d.ts

@@ -0,0 +1,12 @@
+import './TimePickerDropdown.scss';
+import React from 'react';
+interface TimePickerDropdownProps {
+    timeFormat: '12' | '24';
+    date: Date;
+    onDateChange: (date: Date) => void;
+    showSeconds?: boolean;
+    onClose: (date?: Date) => void;
+    style?: React.CSSProperties;
+}
+declare const TimePickerDropdown: React.ForwardRefExoticComponent<TimePickerDropdownProps & React.RefAttributes<HTMLDivElement>>;
+export default TimePickerDropdown;

package/lib/helper/useControlled.d.ts

@@ -0,0 +1,6 @@
+import { Dispatch, SetStateAction } from 'react';
+export interface UseControlledProps<T> {
+    controlled: T | undefined;
+    default: T | undefined;
+}
+export default function useControlled<T>({ controlled, default: defaultValue }: UseControlledProps<T>): [T, Dispatch<SetStateAction<T>>];

package/lib/helper/useOnClickOutside.d.ts

@@ -0,0 +1,2 @@
+import { RefObject } from 'react';
+export default function useOnClickOutside<T extends HTMLElement = HTMLElement>(ref: RefObject<T>, callback: () => void, ref2?: RefObject<T>): void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@festo-ui/react",
-  "version": "3.1.0",
+  "version": "3.2.0",
   "author": "Festo UI (styleguide@festo.com)",
   "license": "apache-2.0",
   "peerDependencies": {
@@ -8,18 +8,18 @@
     "react-dom": "^17.0.2",
     "@festo-ui/web-essentials": "*"
   },
-  "main": "./react.umd.js",
-  "module": "./react.esm.js",
+  "main": "./index.umd.js",
+  "module": "./index.esm.js",
   "typings": "./index.d.ts",
   "dependencies": {
     "classnames": "^2.2.6",
     "react-transition-group": "^4.4.2",
     "react-outside-click-handler": "^1.3.0",
     "react-popper": "^2.2.5",
-    "@popperjs/core": "^2.10.2",
+    "@popperjs/core": "^2.11.0",
     "react-draggable": "^4.4.4",
-    "flatpickr": "^4.6.6",
-    "quill": "~1.3.7",
+    "flatpickr": "^4.6.9",
+    "quill": "1.3.7",
     "xss": "^1.0.10"
   }
 }