@rio-cloud/rio-uikit 1.13.1 → 2.0.0-beta.1

package/lib/es/components/clearableInput/ClearableInput.d.ts

@@ -1,211 +0,0 @@
-/** biome-ignore-all lint/complexity/noBannedTypes: <explanation> */
-import React from 'react';
-export declare const DEFAULT_TYPE = "text";
-export declare const SUPPORTED_TYPES: string[];
-export type MaskVisibility = 'always' | 'onFocus' | 'never';
-export type MaskDefinition = {
-    mask: string;
-    definitions?: Record<string, string | RegExp>;
-    startsWith?: string;
-    [key: string]: any;
-};
-export type ClearableInputProps = {
-    /**
-     * Gives the input element the id.
-     */
-    id?: string;
-    /**
-     * Gives the input element a name.
-     */
-    name?: string;
-    /**
-     * The translated text that shall be shown when the input is empty.
-     */
-    placeholder?: string | React.ReactNode;
-    /**
-     * Defines the type of the input itself.
-     *
-     * There are three types supported:
-     * `text`, `email`, `password`.
-     */
-    type?: 'text' | 'password' | 'email';
-    /**
-     * Initial value of the ClearableInput. Pass this prop if you want to use this
-     * component as an uncontrolled component.
-     */
-    defaultValue?: string;
-    /**
-     * Value of the ClearableInput. Pass this prop if you want to use this
-     * component as a controlled component.
-     */
-    value?: string;
-    /**
-     * Defines the maximum amount of characters that can be entered.
-     */
-    maxLength?: number;
-    /**
-     * Defines the tab index to be added to the input element.
-     */
-    tabIndex?: number;
-    /**
-     * Defined whether or not the input has the error styling.
-     */
-    hasError?: boolean;
-    /**
-     * The callback ref for the underlying input. Alternatively, use can use a forward ref.
-     */
-    inputRef?: React.RefObject<HTMLInputElement>;
-    /**
-     * Sets autocomplete value for autosuggest forms.
-     */
-    autoComplete?: string;
-    /**
-     * Callback function for when the value changes. Receives new value as an argument.
-     * @param newValue
-     * @param event
-     * @returns
-     */
-    onChange?: (newValue: string, event: React.ChangeEvent<HTMLInputElement> | React.MouseEvent<HTMLSpanElement>) => void;
-    /**
-     * Callback function which gets triggered when the input looses the focus.
-     * @param event
-     * @returns
-     */
-    onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
-    /**
-     * Callback function which gets triggered when the input gains the focus.
-     * @param event
-     * @returns
-     */
-    onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;
-    /**
-     * Callback function for when the value is cleared via the clear button.
-     * @param event
-     * @returns
-     */
-    onClear?: (event: React.MouseEvent<HTMLSpanElement>) => void;
-    /**
-     * Callback function for every key pressed including `Enter` key.
-     * @param event
-     * @returns
-     */
-    onKeyPress?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
-    /**
-     * Callback triggered when clicked into the input to react on it like when using an auto suggest dropdown
-     * @param event
-     * @returns
-     */
-    onClick?: (event: React.MouseEvent<HTMLInputElement>) => void;
-    /**
-     * The mask prop will allow to use the component with an input mask.
-     * It defines the pattern that should be followed.
-     *
-     * For more details on masking, checkout the third party documentation for the
-     * input mask here: {@link https://imask.js.org/guide.html}
-     *
-     * Simple masks can be defined as strings.
-     *
-     * The following characters will define mask format:
-     *
-     * "0" = allowed input: "0-9" (digit)
-     *
-     * "a" = allowed input: "a-z, A-Z" (letter)
-     *
-     * "*" = allowed input: any character
-     *
-     * "#" = allowed input: "0-9, a-z, A-Z" (digit or letter)
-     *
-     * Other chars which is not in custom definitions supposed to be fixed:
-     *
-     * [] - make input optional
-     *
-     * {} - include fixed part in unmasked value
-     *
-     * ` - prevent symbols shift back
-     *
-     * If definition character should be treated as fixed it should be escaped by \\ (E.g. \\0).
-     *
-     * Additionally you can provide custom definitions.
-     *
-     * @example
-     * '-- ### ### ###' or '+49 00 000 00'
-     */
-    mask?: string | (string | RegExp)[] | RegExp | DateConstructor | number | Function | MaskDefinition[];
-    /**
-     * Placeholder to cover unfilled parts of the mask.
-     *
-     * @default '_'
-     */
-    maskPlaceholder?: string | null;
-    /**
-     * Enable characters overwriting
-     *
-     * @default true
-     */
-    maskOverwrite?: boolean | 'shift' | undefined;
-    /**
-     * Chooses the mask for dynamic masking depending on input value.
-     * Note, this function may not be an empty function, otherwise the mask selection won't work
-     */
-    maskDispatch?: (appended: string, dynamicMasked: any) => any;
-    /**
-     * Controls when the mask pattern is visible.
-     * - 'always': Mask is always visible
-     * - 'onFocus': Mask is hidden but shown when input is focused (default)
-     * - 'never': Mask is never shown
-     *
-     * @default 'always'
-     */
-    maskVisibility?: MaskVisibility;
-    /**
-     * Custom definitions to have more control over your mask. The defined character will be replaced in your mask.
-     *
-     * @example
-     * mask='AAA AAA.AA'
-     * maskDefinitions={{ A: /[A-Z0-9]/ }}
-     */
-    maskDefinitions?: Record<string, string | RegExp>;
-    /**
-     * Minimum value to be entered. This prop is extended to accept a Date
-     * when used with an input mask.
-     */
-    min?: string | number | undefined | Date;
-    /**
-     * Maximum value to be entered. This prop is extended to accept a Date
-     * when used with an input mask.
-     */
-    max?: string | number | undefined | Date;
-    /**
-     * Whether mask prefix and placeholder should be displayed when input is empty and
-     * has no focus.
-     *
-     * @default false
-     * @deprecated please use maskVisibility='always' instead
-     */
-    alwaysShowMask?: boolean;
-    /**
-     * Disabled the input component.
-     *
-     * @default false
-     */
-    disabled?: boolean;
-    /**
-     * Additional classes to be set on the input element.
-     */
-    inputClassName?: string;
-    /**
-     * Additional classes to be set on the wrapper element.
-     */
-    className?: string;
-};
-type ChildrenProp = {
-    /**
-     * Providing a function enables the render props approach. The function gets the input props
-     * passed and is responsible for rendering the custom `input` component.
-     * @param props
-     * @returns
-     */
-    children?: (props: React.InputHTMLAttributes<HTMLInputElement>) => React.ReactNode;
-};
-declare const ClearableInput: React.ForwardRefExoticComponent<ClearableInputProps & ChildrenProp & React.RefAttributes<HTMLInputElement>>;
-export default ClearableInput;

package/lib/es/components/clearableInput/ClearableInput.js

@@ -1,152 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SUPPORTED_TYPES = exports.DEFAULT_TYPE = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-/** biome-ignore-all lint/complexity/noBannedTypes: <explanation> */
-const react_1 = require("react");
-const omit_1 = tslib_1.__importDefault(require("lodash/fp/omit"));
-const isNil_1 = tslib_1.__importDefault(require("lodash/fp/isNil"));
-const isEmpty_1 = tslib_1.__importDefault(require("lodash/fp/isEmpty"));
-const classnames_1 = tslib_1.__importDefault(require("classnames"));
-const isFunction_1 = tslib_1.__importDefault(require("lodash/fp/isFunction"));
-const noop_1 = tslib_1.__importDefault(require("lodash/fp/noop"));
-const react_imask_1 = require("react-imask");
-const usePrevious_1 = tslib_1.__importDefault(require("../../hooks/usePrevious"));
-const useMergeRefs_1 = tslib_1.__importDefault(require("../../hooks/useMergeRefs"));
-exports.DEFAULT_TYPE = 'text';
-exports.SUPPORTED_TYPES = ['text', 'password', 'email'];
-const hasValue = (value) => !(0, isEmpty_1.default)(`${value}`);
-const ClearableInput = (0, react_1.forwardRef)((props, ref) => {
-    const { type = exports.DEFAULT_TYPE, defaultValue, value, maxLength, tabIndex = 0, hasError = false, inputRef, autoComplete, onChange = noop_1.default, onBlur = noop_1.default, onFocus = noop_1.default, onClear = noop_1.default, onKeyPress = noop_1.default, onClick = noop_1.default, mask, maskPlaceholder = '_', maskVisibility = 'always', maskOverwrite = true, maskDefinitions, maskDispatch, alwaysShowMask = false, inputClassName = '', disabled = false, className = '', children, ...remainingProps } = props;
-    const initialValue = value || defaultValue || '';
-    const [inputValue, setInputValue] = (0, react_1.useState)(initialValue);
-    const [showClear, setShowClear] = (0, react_1.useState)(hasValue(initialValue));
-    const [isFocused, setIsFocused] = (0, react_1.useState)(false);
-    const isControlled = !(0, isNil_1.default)(value);
-    const internalMaskRef = (0, react_1.useRef)(null);
-    const mergedInternalMaskRef = (0, useMergeRefs_1.default)(internalMaskRef, inputRef, ref);
-    const hasMask = !!mask;
-    // Calculate if mask should be visible (lazy=false means visible, lazy=true means hidden)
-    const shouldShowMask = () => {
-        // For backward compatibility
-        if (alwaysShowMask) {
-            return true;
-        }
-        switch (maskVisibility) {
-            case 'always':
-                return true;
-            case 'onFocus':
-                return isFocused;
-            case 'never':
-                return false;
-            default:
-                return isFocused;
-        }
-    };
-    // Handles new input value and saves it in the local state.
-    // The value stored in the state is used for rendering.
-    const changeInternalValue = (newValue = '') => {
-        // this is there to prevent that onChange and UNSAFE_componentWillReceiveProps set state at the same time
-        if (inputValue === newValue) {
-            return;
-        }
-        setInputValue(newValue);
-        setShowClear(hasValue(newValue));
-    };
-    // important for when used as a controlled component and value changes from the outside.
-    const previousValue = (0, usePrevious_1.default)(value);
-    if (previousValue !== value) {
-        changeInternalValue(value);
-    }
-    // only gets triggered on user interaction.
-    const handleChange = (event) => {
-        const newValue = event.target.value;
-        if (isControlled) {
-            onChange(newValue, event);
-        }
-        else {
-            changeInternalValue(newValue);
-            onChange(newValue, event);
-        }
-    };
-    const handleAccept = (newValue, maskRef, event) => {
-        if (!internalMaskRef.current) {
-            return;
-        }
-        // Simulate a ChangeEvent for backwards compatibility since react-imask does not return a change event itself
-        const syntheticEvent = {
-            target: internalMaskRef.current,
-            currentTarget: internalMaskRef.current,
-            // Standard synthetic event props
-            bubbles: true,
-            cancelable: true,
-            defaultPrevented: false,
-            isTrusted: true,
-            preventDefault: () => { },
-            stopPropagation: () => { },
-            persist: () => { },
-            nativeEvent: {},
-            type: 'change',
-            timeStamp: Date.now(),
-        };
-        // Set unmasked value manually if needed
-        // (you can use data-attributes or attach it directly)
-        syntheticEvent.target.unmaskedValue = maskRef.unmaskedValue;
-        if (isControlled) {
-            onChange(newValue, syntheticEvent);
-        }
-        else {
-            changeInternalValue(newValue);
-            onChange(newValue, syntheticEvent);
-        }
-    };
-    const handleInputFocus = (event) => {
-        setIsFocused(true);
-        onFocus(event);
-    };
-    const handleInputBlur = (event) => {
-        setIsFocused(false);
-        onBlur(event);
-    };
-    // Will be triggered on every key press but also when pressing 'Enter' for example
-    const handleKeyPress = (event) => {
-        onKeyPress(event);
-    };
-    const clearInputValue = (event) => {
-        changeInternalValue('');
-        onChange('', event);
-        if (onClear) {
-            onClear(event);
-        }
-    };
-    const classes = (0, classnames_1.default)('ClearableInput', 'input-group', hasError && 'has-error', disabled && 'pointer-events-none', className && className);
-    const inputClassNames = (0, classnames_1.default)('form-control', inputClassName, showClear && 'withClearButton', hasMask && 'withInputMask', disabled && 'disabled');
-    const clearButtonClassNames = (0, classnames_1.default)('clearButton', !showClear && 'hide');
-    const convertedType = type?.toLowerCase();
-    const inputType = exports.SUPPORTED_TYPES.indexOf(convertedType) !== -1 ? convertedType : exports.DEFAULT_TYPE;
-    const inputProps = {
-        ...(0, omit_1.default)(['value', 'defaultValue', 'onClear'])(remainingProps),
-        className: inputClassNames,
-        autoComplete,
-        type: inputType,
-        value: inputValue,
-        onKeyPress: handleKeyPress,
-        onBlur: handleInputBlur,
-        onFocus: handleInputFocus,
-        onChange: hasMask ? undefined : handleChange, // In case of masked input, the onAccept callback is used
-        onClick,
-        disabled,
-        maxLength: hasMask ? undefined : maxLength,
-        tabIndex,
-    };
-    // The dispatch function may not be an empty function. Specify it when
-    // using dynamic masking and need more control over which mask gets selected
-    const maskDispatchObj = {};
-    if (maskDispatch) {
-        maskDispatchObj.dispatch = maskDispatch;
-    }
-    const input = hasMask ? ((0, jsx_runtime_1.jsx)(react_imask_1.IMaskInput, { ...inputProps, inputRef: mergedInternalMaskRef, mask: mask, definitions: maskDefinitions, ...maskDispatchObj, placeholderChar: maskPlaceholder, onAccept: handleAccept, lazy: !shouldShowMask(), overwrite: maskOverwrite })) : ((0, jsx_runtime_1.jsx)("input", { ...inputProps, ref: inputRef || ref }));
-    return ((0, jsx_runtime_1.jsxs)("div", { className: classes, children: [children && (0, isFunction_1.default)(children) ? children(inputProps) : input, (0, jsx_runtime_1.jsx)("span", { className: clearButtonClassNames, onClick: clearInputValue, children: (0, jsx_runtime_1.jsx)("span", { className: 'clearButtonIcon rioglyph rioglyph-remove-sign' }) })] }));
-});
-exports.default = ClearableInput;

package/lib/es/components/collapse/Collapse.d.ts

@@ -1,40 +0,0 @@
-import { type PropsWithChildren } from 'react';
-type CollapseProps = {
-    /**
-     * Show the component and triggers the expand or collapse animation.
-     * @default false
-     */
-    open: boolean | undefined;
-    /** Deprecated, please use `open` instead. @deprecated */
-    in?: boolean;
-    /**
-     * Unmount the component (remove it from the DOM) when it is collapsed.
-     */
-    unmountOnExit?: boolean;
-    /**
-     * Run the expand animation when the component mounts, if it is initially shown.
-     * @default false
-     */
-    appear?: boolean;
-    /**
-     * Duration of the collapse animation in milliseconds.
-     * @default 270
-     */
-    timeout?: number;
-    /**
-     * Callback fired after the component has expanded.
-     * @returns
-     */
-    onEntered?: () => void;
-    /**
-     * Callback fired after the component has collapsed.
-     * @returns
-     */
-    onExited?: () => void;
-    /**
-     * Callback fired when the animation starts for either expand or collapse.
-     */
-    onAnimationStart?: () => void;
-};
-declare const Collapse: (props: PropsWithChildren<CollapseProps>) => import("react/jsx-runtime").JSX.Element;
-export default Collapse;

package/lib/es/components/collapse/Collapse.js

@@ -1,27 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const framer_motion_1 = require("framer-motion");
-const noop_1 = tslib_1.__importDefault(require("lodash/fp/noop"));
-const DEFAULT_ANIMATION_TIME_IN_MS = 200;
-const Collapse = (props) => {
-    const { open = false, unmountOnExit = false, appear = false, timeout = DEFAULT_ANIMATION_TIME_IN_MS, onEntered = noop_1.default, onExited = noop_1.default, onAnimationStart = noop_1.default, children, } = props;
-    const shouldKeepContentInDom = !unmountOnExit;
-    const handleAnimationStart = () => onAnimationStart();
-    const handleAnimationComplete = (definition) => {
-        if (definition === 'open') {
-            onEntered();
-        }
-        if (definition === 'collapsed') {
-            onExited();
-        }
-    };
-    const variants = {
-        open: { opacity: 1, height: 'auto' },
-        collapsed: { opacity: 0, height: 0 },
-    };
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { initial: appear, exitBeforeEnter: true, children: (open || shouldKeepContentInDom) && ((0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { initial: 'collapsed', animate: open ? 'open' : 'collapsed', exit: 'collapsed', className: 'collapse display-block width-100pct', variants: variants, transition: { duration: timeout / 1000, ease: 'easeIn' }, onAnimationComplete: handleAnimationComplete, onAnimationStart: handleAnimationStart, children: children }, 'content')) }) }));
-};
-//
-exports.default = Collapse;

package/lib/es/components/contentLoader/ContentLoader.d.ts

@@ -1,55 +0,0 @@
-import { type PropsWithChildren } from 'react';
-declare const RECT = "rect";
-declare const CIRCLE = "circle";
-export type ContentLoaderProps = {
-    /**
-     * Sets the animation speed.
-     * @default 2
-     */
-    speed?: number;
-    /**
-     * Sets the height of the svg element.
-     * @default 14
-     */
-    height?: string | number;
-    /**
-     * Sets the width of the svg element.
-     * @default 100%
-     */
-    width?: string | number;
-    /**
-     * Sets the radius of the svg element. Only relevant for circle elements.
-     * @default 16
-     */
-    radius?: number;
-    /**
-     * Renders either a rectangle or circle.
-     *
-     * Possible values are:
-     * `ContentLoader.RECT`, `ContentLoader.CIRCLE` or `rect`, `circle`
-     */
-    type?: typeof RECT | typeof CIRCLE;
-    /**
-     * Additional class names to ab added to the wrapping svg element.
-     */
-    className?: string;
-    /** Rect object prop. Used internally. */
-    rx?: number;
-    /** Rect object prop. Used internally. */
-    ry?: number;
-};
-type ContentLoaderPropsWithChildren = PropsWithChildren<ContentLoaderProps>;
-/**
- * This UIKIT component is simple wrapper to make it easier to use with a predefined look and feel. It still
- * allows for more complex configurations as all additional props are passed down to the third-party
- * ContentLoader component. For individual customization, it allows passing svg components as rect or circle
- * directly as children.
- * @param props
- * @returns
- */
-declare const ContentLoader: {
-    (props: ContentLoaderPropsWithChildren): import("react/jsx-runtime").JSX.Element;
-    RECT: "rect";
-    CIRCLE: "circle";
-};
-export default ContentLoader;

package/lib/es/components/contentLoader/ContentLoader.js

@@ -1,52 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_content_loader_1 = tslib_1.__importDefault(require("react-content-loader"));
-const cond_1 = tslib_1.__importDefault(require("lodash/fp/cond"));
-const isNil_1 = tslib_1.__importDefault(require("lodash/fp/isNil"));
-const useDarkMode_1 = tslib_1.__importDefault(require("../../hooks/useDarkMode"));
-const RECT = 'rect';
-const CIRCLE = 'circle';
-const DEFAULT_SPEED = 2;
-const DEFAULT_HEIGHT = 14;
-const DEFAULT_WIDTH = '100%';
-const DEFAULT_RADIUS = 16;
-const DEFAULT_TYPE = RECT;
-const hasChildren = ({ children }) => !(0, isNil_1.default)(children);
-const renderChildren = ({ children }) => children;
-const isRect = ({ type }) => type === RECT;
-const isCircle = ({ type }) => type === CIRCLE;
-const renderRect = ({ rx = 3, ry = 3 }) => ((0, jsx_runtime_1.jsx)("rect", { width: '100%', height: '100%', rx: rx, ry: ry }));
-const renderCircle = ({ radius }) => (0, jsx_runtime_1.jsx)("circle", { cx: radius, cy: radius, r: radius });
-/**
- * This UIKIT component is simple wrapper to make it easier to use with a predefined look and feel. It still
- * allows for more complex configurations as all additional props are passed down to the third-party
- * ContentLoader component. For individual customization, it allows passing svg components as rect or circle
- * directly as children.
- * @param props
- * @returns
- */
-const ContentLoader = (props) => {
-    const { speed = DEFAULT_SPEED, width = DEFAULT_WIDTH, height = DEFAULT_HEIGHT, radius = DEFAULT_RADIUS, type = DEFAULT_TYPE, className = '', children, ...remainingProps } = props;
-    const isDarkMode = (0, useDarkMode_1.default)();
-    // Since we define the default values while destructuring the props, we have to build up a new object
-    // with that defaults to be used in the conditional rendering, otherwise it would use only the props as
-    // passed into the component without the defined defaults.
-    const propsWithDefaults = {
-        type,
-        radius,
-        children,
-    };
-    const content = (0, cond_1.default)([
-        [hasChildren, renderChildren],
-        [isRect, renderRect],
-        [isCircle, renderCircle],
-    ])(propsWithDefaults);
-    const wrapperHeight = isCircle(propsWithDefaults) ? radius * 2 : height;
-    const wrapperWidth = isCircle(propsWithDefaults) ? wrapperHeight : width;
-    return ((0, jsx_runtime_1.jsx)(react_content_loader_1.default, { backgroundColor: '#f5f6f7', foregroundColor: isDarkMode ? '#aaaaaa' : '#eeeeee', speed: speed, height: wrapperHeight, width: wrapperWidth, className: `ContentLoader ${className} ${isDarkMode ? 'use-mix-blend-mode' : ''}`, ...remainingProps, children: content }));
-};
-ContentLoader.RECT = RECT;
-ContentLoader.CIRCLE = CIRCLE;
-exports.default = ContentLoader;

package/lib/es/components/dataTabs/DataTab.d.ts

@@ -1,29 +0,0 @@
-import React, { type PropsWithChildren } from 'react';
-export type DataTabProps = {
-    /**
-     * Whether this tab is the one currently active.
-     *
-     * @default false
-     */
-    active?: boolean;
-    /**
-     * Used to identify the tab.
-     */
-    tabKey: string;
-    /**
-     * Whether the transition effect should be disabled.
-     *
-     * @default false
-     */
-    disableTransition?: boolean;
-    /**
-     * The content for the tab.
-     */
-    title: React.ReactNode;
-    /**
-     * Additional classes to be set on the element.
-     */
-    className?: string;
-};
-declare const DataTab: (props: PropsWithChildren<DataTabProps>) => import("react/jsx-runtime").JSX.Element | null;
-export default DataTab;

package/lib/es/components/dataTabs/DataTab.js

@@ -1,22 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = require("react");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const framer_motion_1 = require("framer-motion");
-const DataTab = (props) => {
-    const { active = false, title, // exclude from remainingProps to avoid being set to the div element
-    tabKey, disableTransition = false, className = '', children, ...remainingProps } = props;
-    if (disableTransition) {
-        return (0, jsx_runtime_1.jsx)("div", { children: active && children });
-    }
-    if (!active) {
-        return null;
-    }
-    return (
-    // @ts-ignore
-    (0, react_1.createElement)(framer_motion_1.motion.div, { ...remainingProps, key: tabKey, initial: { x: 0, y: 0, opacity: 0 }, animate: { x: 0, y: 0, opacity: 1 }, exit: { x: 0, y: 0, opacity: 0 }, transition: { duration: 0.1 }, 
-        // TODO: added "fade in" for backwards compatibility for service tests
-        // To be removed for next major version
-        className: 'fade in' }, children));
-};
-exports.default = DataTab;

package/lib/es/components/dataTabs/DataTabHeader.d.ts

@@ -1,18 +0,0 @@
-import React from 'react';
-export type DataTabHeaderProps = {
-    isActive?: boolean;
-    tabKey: string;
-    title: React.ReactNode;
-    onSelectTab?: (event: React.MouseEvent<HTMLLIElement>) => void;
-    isFirstTab?: boolean;
-    isLastTab?: boolean;
-    tabFirstChildClassName?: string;
-    tabLastChildClassName?: string;
-    tabClassName?: string;
-    tabHoverClassName?: string;
-    tabActiveClassName?: string;
-    arrowClassName?: string;
-    className?: string;
-};
-declare const DataTabHeader: (props: DataTabHeaderProps) => import("react/jsx-runtime").JSX.Element;
-export default DataTabHeader;

package/lib/es/components/dataTabs/DataTabHeader.js

@@ -1,13 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = tslib_1.__importDefault(require("classnames"));
-const DataTabHeader = (props) => {
-    const { tabKey, title, isActive, isFirstTab, isLastTab, onSelectTab, tabFirstChildClassName, tabLastChildClassName, tabClassName, tabHoverClassName, tabActiveClassName, arrowClassName, className, } = props;
-    const [isHovering, setIsHovering] = (0, react_1.useState)(false);
-    const tabClassNames = (0, classnames_1.default)('DataTab', 'tab', isFirstTab && tabFirstChildClassName, isLastTab && tabLastChildClassName, !isHovering && !isActive && tabClassName, isHovering && !isActive && tabHoverClassName, isActive && `active ${tabActiveClassName}`, !isActive && 'cursor-pointer', className && className);
-    return ((0, jsx_runtime_1.jsxs)("li", { className: tabClassNames, onClick: onSelectTab, "data-tabkey": tabKey, onMouseEnter: () => setIsHovering(true), onMouseLeave: () => setIsHovering(false), children: [title, (0, jsx_runtime_1.jsx)("div", { className: `arrow ${arrowClassName} ${isActive ? 'in' : ''}` })] }, tabKey));
-};
-exports.default = DataTabHeader;