@cube-dev/ui-kit 0.56.3 → 0.58.0

package/cjs/components/fields/TextInput/TextInputBase.js

@@ -1,229 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextInputBase = exports.DEFAULT_INPUT_STYLES = exports.INPUT_WRAPPER_STYLES = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const icons_1 = require("@ant-design/icons");
-const utils_1 = require("@react-spectrum/utils");
-const react_1 = require("react");
-const react_aria_1 = require("react-aria");
-const form_1 = require("../../form");
-const provider_1 = require("../../../provider");
-const tasty_1 = require("../../../tasty");
-const interactions_1 = require("../../../utils/react/interactions");
-const react_2 = require("../../../utils/react");
-const InvalidIcon_1 = require("../../shared/InvalidIcon");
-const ValidIcon_1 = require("../../shared/ValidIcon");
-const ADD_STYLES = {
-    display: 'grid',
-    placeContent: 'stretch',
-    placeItems: 'center',
-    flow: 'column',
-    gap: 0,
-    cursor: 'inherit',
-    opacity: {
-        '': 1,
-        disabled: '@disabled-opacity',
-    },
-};
-exports.INPUT_WRAPPER_STYLES = {
-    display: 'grid',
-    position: 'relative',
-    gridAreas: '"prefix input suffix"',
-    gridColumns: 'auto 1fr auto',
-    placeItems: 'stretch',
-    fill: {
-        '': '#white',
-        disabled: '#dark.04',
-    },
-    border: {
-        '': true,
-        focused: true,
-        valid: '#success-text.50',
-        invalid: '#danger-text.50',
-        disabled: true,
-    },
-    outline: {
-        '': '#purple-03.0',
-        focused: '#purple-03',
-        'invalid & focused': '#danger.50',
-        'valid & focused': '#success.50',
-    },
-    radius: true,
-    cursor: 'text',
-    color: {
-        '': '#dark-02',
-        focused: '#dark-02',
-        invalid: '#danger-text',
-        disabled: '#dark.30',
-    },
-    zIndex: {
-        '': 'initial',
-        focused: 1,
-    },
-    boxSizing: 'border-box',
-    transition: 'theme',
-    backgroundClip: 'content-box',
-    Prefix: {
-        ...ADD_STYLES,
-        gridArea: 'prefix',
-    },
-    Suffix: {
-        ...ADD_STYLES,
-        gridArea: 'suffix',
-    },
-    State: {
-        display: 'flex',
-    },
-    InputIcon: {
-        display: 'grid',
-        placeItems: 'center',
-        width: 'min 4x',
-        color: 'inherit',
-        fontSize: '@icon-size',
-    },
-    ValidationIcon: {
-        display: 'grid',
-        placeItems: 'center',
-        width: {
-            '': 'min 4x',
-            suffix: 'min 3x',
-        },
-        fontSize: '@icon-size',
-    },
-};
-const InputWrapperElement = (0, tasty_1.tasty)({ styles: exports.INPUT_WRAPPER_STYLES });
-const STYLE_LIST = [...tasty_1.POSITION_STYLES, ...tasty_1.DIMENSION_STYLES];
-const INPUT_STYLE_PROPS_LIST = [...tasty_1.BLOCK_STYLES, 'resize'];
-exports.DEFAULT_INPUT_STYLES = {
-    display: 'block',
-    gridArea: 'input',
-    width: 'initial 100% 100%',
-    height: 'initial initial initial',
-    color: 'inherit',
-    fill: '#clear',
-    border: 0,
-    transition: 'theme',
-    radius: true,
-    padding: '@vertical-padding @right-padding @vertical-padding @left-padding',
-    textAlign: 'left',
-    reset: 'input',
-    preset: 't3',
-    flexGrow: 1,
-    margin: 0,
-    resize: 'none',
-    boxSizing: 'border-box',
-    userSelect: 'auto',
-    '@vertical-padding': {
-        '': '(1.25x - 1bw)',
-        '[data-size="small"]': '(.75x - 1bw)',
-    },
-    '@left-padding': {
-        '': '(1.5x - 1bw)',
-        prefix: '0',
-    },
-    '@right-padding': {
-        '': '(1.5x - 1bw)',
-        suffix: '0',
-    },
-};
-const InputElement = (0, tasty_1.tasty)({ qa: 'Input', styles: exports.DEFAULT_INPUT_STYLES });
-function _TextInputBase(props, ref) {
-    props = (0, provider_1.useProviderProps)(props);
-    props = (0, form_1.useFormProps)(props);
-    props = (0, form_1.useFieldProps)(props, {
-        defaultValidationTrigger: 'onBlur',
-        valuePropsMapper: ({ value, onChange }) => ({
-            value: typeof value === 'string' || typeof value === 'number'
-                ? String(value)
-                : '',
-            onChange,
-        }),
-    });
-    let { qa, mods, validationState, prefix, isDisabled, multiLine, autoFocus, inputProps, wrapperProps, inputRef, isLoading, loadingIndicator, value, inputStyles = {}, wrapperStyles = {}, suffix, suffixPosition = 'before', wrapperRef, tooltip, rows = 1, size, icon, maxLength, minLength, ...otherProps } = props;
-    let styles = (0, tasty_1.extractStyles)(otherProps, STYLE_LIST);
-    let type = otherProps.type;
-    inputStyles = (0, tasty_1.extractStyles)(otherProps, INPUT_STYLE_PROPS_LIST, inputStyles);
-    let ElementType = multiLine ? 'textarea' : 'input';
-    let { isFocused, focusProps } = (0, interactions_1.useFocus)({ isDisabled });
-    let { hoverProps, isHovered } = (0, react_aria_1.useHover)({ isDisabled });
-    let domRef = (0, react_1.useRef)(null);
-    let defaultInputRef = (0, react_1.useRef)(null);
-    inputRef = inputRef || defaultInputRef;
-    // Expose imperative interface for ref
-    (0, react_1.useImperativeHandle)(ref, () => ({
-        ...(0, utils_1.createFocusableRef)(domRef, inputRef),
-        select() {
-            if (inputRef?.current) {
-                inputRef.current.select();
-            }
-        },
-        getInputElement() {
-            return inputRef?.current;
-        },
-    }));
-    let isInvalid = validationState === 'invalid';
-    let validationIcon = isInvalid ? InvalidIcon_1.InvalidIcon : ValidIcon_1.ValidIcon;
-    let validation = (0, react_1.cloneElement)(validationIcon);
-    // Fix safari bug: https://github.com/philipwalton/flexbugs/issues/270
-    if (!inputProps?.placeholder) {
-        if (!inputProps) {
-            inputProps = {};
-        }
-        inputProps.placeholder = ' ';
-    }
-    if (icon) {
-        icon = (0, jsx_runtime_1.jsx)("div", { "data-element": "InputIcon", children: icon });
-        if (prefix) {
-            prefix = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [icon, prefix] }));
-        }
-        else {
-            prefix = icon;
-        }
-    }
-    const modifiers = (0, react_1.useMemo)(() => ({
-        invalid: isInvalid,
-        valid: validationState === 'valid',
-        loadable: !!loadingIndicator,
-        focused: isFocused,
-        hovered: isHovered,
-        disabled: isDisabled,
-        multiline: multiLine,
-        prefix: !!prefix,
-        suffix: !!suffix,
-        ...mods,
-    }), [
-        mods,
-        isInvalid,
-        validationState,
-        loadingIndicator,
-        isFocused,
-        isDisabled,
-        isHovered,
-        multiLine,
-        prefix,
-        suffix,
-    ]);
-    const hasTextSecurity = multiLine && type === 'password';
-    const textSecurityStyles = hasTextSecurity
-        ? {
-            fontFamily: 'text-security-disc',
-            WebkitTextSecurity: 'disc',
-        }
-        : {};
-    const textField = ((0, jsx_runtime_1.jsxs)(InputWrapperElement, { ref: wrapperRef, qa: qa || 'TextInput', mods: modifiers, "data-size": size, styles: wrapperStyles, ...wrapperProps, children: [(0, jsx_runtime_1.jsx)(InputElement, { as: ElementType, ...(0, react_2.mergeProps)(inputProps, focusProps, hoverProps), ref: inputRef, rows: multiLine ? rows : undefined, mods: modifiers, style: textSecurityStyles, autoFocus: autoFocus, "data-size": size, styles: inputStyles, disabled: !!isDisabled, maxLength: maxLength, minLength: minLength }), prefix ? (0, jsx_runtime_1.jsx)("div", { "data-element": "Prefix", children: prefix }) : null, (validationState && !isLoading) || isLoading || suffix ? ((0, jsx_runtime_1.jsxs)("div", { "data-element": "Suffix", children: [suffixPosition === 'before' ? suffix : null, (validationState && !isLoading) || isLoading ? ((0, jsx_runtime_1.jsxs)("div", { "data-element": "State", children: [validationState && !isLoading ? validation : null, isLoading && (0, jsx_runtime_1.jsx)(icons_1.LoadingOutlined, { "data-element": "InputIcon" })] })) : null, suffixPosition === 'after' ? suffix : null] })) : null] }));
-    return (0, form_1.wrapWithField)(textField, domRef, {
-        ...props,
-        styles,
-    });
-}
-const TextInputBase = (0, react_1.forwardRef)(_TextInputBase);
-exports.TextInputBase = TextInputBase;
-
-        

package/cjs/components/fields/TextInput/index.js

@@ -1,27 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./TextInput"), exports);
-__exportStar(require("./TextInputBase"), exports);
-
-        

package/cjs/components/fields/TextInputMapper/TextInputMapper.js

@@ -1,169 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextInputMapper = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const hooks_1 = require("../../../_internal/hooks");
-const index_1 = require("../../../utils/react/index");
-const form_1 = require("../../form");
-const icons_1 = require("../../../icons");
-const actions_1 = require("../../actions");
-const Block_1 = require("../../Block");
-const Flow_1 = require("../../layout/Flow");
-const Grid_1 = require("../../layout/Grid");
-const Space_1 = require("../../layout/Space");
-const TextInput_1 = require("../TextInput");
-// Rewrites upper level field component styles
-// @TODO: Remove this after the release of new Element API
-const PROPS_GRID_HACK = {
-    styles: {
-        InputArea: {
-            gridColumn: {
-                '': 'auto',
-                'has-sider': 'auto',
-            },
-        },
-    },
-};
-// remove duplicates in mappings
-function removeDuplicates(mappings) {
-    const keys = new Set();
-    return mappings.filter(({ key }) => {
-        if (keys.has(key)) {
-            return false;
-        }
-        keys.add(key);
-        return true;
-    });
-}
-function TextInputMapper(props, ref) {
-    ref = (0, index_1.useCombinedRefs)(ref);
-    props = (0, form_1.useFormProps)(props);
-    props = (0, form_1.useFieldProps)(props, {
-        defaultValidationTrigger: 'onChange',
-        valuePropsMapper: ({ value, onChange }) => ({
-            value: value != null ? value : {},
-            onChange: onChange,
-        }),
-    });
-    const counterRef = (0, react_1.useRef)(0);
-    let { isDisabled, actionLabel, value, onChange, keyProps, valueProps, ValueComponent, } = props;
-    function extractLocalValues(value, localValues) {
-        const valueKeys = Object.keys(value);
-        const localKeys = localValues.map(({ key }) => key);
-        localKeys.forEach((key) => {
-            if (!valueKeys.includes(key) && key !== '') {
-                localValues = localValues.filter(({ key: k }) => k !== key);
-            }
-        });
-        Object.entries(value ?? {}).forEach(([key, value]) => {
-            const exist = localValues.find(({ key: k }) => k === key);
-            if (exist) {
-                exist.value = value;
-            }
-            else {
-                localValues.push({ key, value, id: counterRef.current++ });
-            }
-        });
-        return removeDuplicates(localValues);
-    }
-    const [mappings, setMappings] = (0, react_1.useState)(() => {
-        return extractLocalValues(value ?? {}, []);
-    });
-    (0, react_1.useEffect)(() => {
-        setMappings(extractLocalValues(value ?? {}, mappings));
-    }, [JSON.stringify(value)]);
-    const onMappingsChange = (0, hooks_1.useEvent)((newMappings) => {
-        const newValue = newMappings.reduce((acc, { key, value }) => {
-            acc[key.trim()] = value.trim();
-            return acc;
-        }, {});
-        const keys = Object.keys(newValue);
-        if (!keys.length) {
-            onChange?.(undefined);
-        }
-        else {
-            onChange?.(newValue);
-        }
-        const updatedMappings = extractLocalValues(newValue ?? {}, newMappings);
-        if (JSON.stringify(updatedMappings) !== JSON.stringify(mappings)) {
-            setMappings(updatedMappings);
-        }
-    });
-    // useEffect(() => {
-    //   // focus on the last non-disabled input
-    //   setTimeout(() => {
-    //     (
-    //       ref?.current?.querySelector(
-    //         '[data-qa="Mapping"]:last-child input:not([disabled])',
-    //       ) as HTMLInputElement
-    //     )?.focus();
-    //   }, 100);
-    // }, [mappings.length]);
-    const addNewMapping = (0, hooks_1.useEvent)(() => {
-        setMappings((prev) => {
-            return [...prev, { key: '', value: '', id: counterRef.current++ }];
-        });
-    });
-    const showNewButton = (0, react_1.useMemo)(() => {
-        return (!mappings.length || !mappings.some(({ key, value }) => !key || !value));
-    }, [mappings]);
-    ValueComponent = ValueComponent ?? TextInputMapperInput;
-    const onKeyChange = (0, hooks_1.useEvent)((id, value) => {
-        mappings.find((mapping) => {
-            if (mapping.id === id) {
-                mapping.key = value;
-            }
-        });
-        setMappings([...mappings]);
-    });
-    const onValueChange = (0, hooks_1.useEvent)((id, value) => {
-        mappings.find((mapping) => {
-            if (mapping.id === id) {
-                mapping.value = value;
-            }
-        });
-        setMappings([...mappings]);
-    });
-    const onSubmit = (0, hooks_1.useEvent)(() => {
-        onMappingsChange(mappings);
-    });
-    const onKeyDown = (0, hooks_1.useEvent)((e) => {
-        // if Ctrl+Enter or Cmd+Enter is pressed then add new mapping if that's enabled
-        if ((e.ctrlKey || e.metaKey) && e.key === 'Enter' && showNewButton) {
-            addNewMapping();
-        }
-    });
-    const renderedMappings = (0, react_1.useMemo)(() => {
-        return mappings.map((mapping, index) => {
-            const { key, value, id } = mapping;
-            return ((0, jsx_runtime_1.jsxs)(Grid_1.Grid, { qa: "Mapping", columns: "minmax(0, 1fr) minmax(0, 1fr) min-content", gap: "1x", children: [(0, jsx_runtime_1.jsx)(TextInputMapperInput, { autoFocus: index === mappings.length - 1, id: id, isDisabled: isDisabled, type: "name", value: key, placeholder: "Key", onChange: onKeyChange, onSubmit: onSubmit, ...keyProps }), (0, jsx_runtime_1.jsx)(ValueComponent, { id: id, type: "value", isDisabled: !key || isDisabled, value: value, placeholder: "Value", onChange: onValueChange, onSubmit: onSubmit, ...valueProps }), (0, jsx_runtime_1.jsx)(actions_1.Button, { "aria-label": "Remove mapping", theme: "danger", type: "clear", icon: (0, jsx_runtime_1.jsx)(icons_1.CloseIcon, {}), onPress: () => {
-                            setMappings(mappings.filter((m) => m.id !== id));
-                            onMappingsChange(mappings.filter((m) => m.id !== id));
-                        } })] }, id));
-        });
-    }, [JSON.stringify(mappings)]);
-    const element = ((0, jsx_runtime_1.jsxs)(Flow_1.Flow, { ref: ref, gap: "1x", onKeyDown: onKeyDown, children: [[...renderedMappings], showNewButton ? ((0, jsx_runtime_1.jsxs)(Space_1.Space, { gap: 0, children: [(0, jsx_runtime_1.jsx)(Block_1.Block, { styles: { overflow: 'clip', width: 'max 0px' }, children: "\u00A0" }), (0, jsx_runtime_1.jsx)(actions_1.Button, { isDisabled: isDisabled, icon: (0, jsx_runtime_1.jsx)(icons_1.PlusIcon, {}), onPress: addNewMapping, children: actionLabel ? actionLabel : 'Mapping' })] })) : null] }));
-    return (0, form_1.wrapWithField)(element, ref, props);
-}
-function TextInputMapperInput(props) {
-    const { id, type, value, placeholder, ...rest } = props;
-    const onChange = (0, hooks_1.useEvent)((newValue) => {
-        props.onChange?.(id, newValue);
-    });
-    const onBlur = (0, hooks_1.useEvent)(() => {
-        props.onSubmit?.(id);
-    });
-    return ((0, jsx_runtime_1.jsx)(TextInput_1.TextInput, { qa: "AddMapping", width: "auto", ...(0, index_1.mergeProps)(rest, PROPS_GRID_HACK), id: undefined, value: value, labelPosition: "top", "aria-label": placeholder, placeholder: placeholder, onChange: onChange, onBlur: onBlur }));
-}
-const _TextInputMapper = (0, react_1.forwardRef)(TextInputMapper);
-exports.TextInputMapper = _TextInputMapper;
-
-        

package/cjs/components/fields/TextInputMapper/index.js

@@ -1,26 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./TextInputMapper"), exports);
-
-        

package/cjs/components/fields/index.js

@@ -1,40 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./Input"), exports);
-__exportStar(require("./TextInput"), exports);
-__exportStar(require("./PasswordInput/PasswordInput"), exports);
-__exportStar(require("./NumberInput/NumberInput"), exports);
-__exportStar(require("./FileInput/FileInput"), exports);
-__exportStar(require("./TextArea"), exports);
-__exportStar(require("./Checkbox"), exports);
-__exportStar(require("./DatePicker"), exports);
-__exportStar(require("./RadioGroup"), exports);
-__exportStar(require("./SearchInput"), exports);
-__exportStar(require("./Slider"), exports);
-__exportStar(require("./Switch/Switch"), exports);
-__exportStar(require("./Select"), exports);
-__exportStar(require("./ComboBox"), exports);
-__exportStar(require("./TextInputMapper"), exports);
-
-        

package/cjs/components/form/FieldWrapper/FieldWrapper.js

@@ -1,91 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FieldWrapper = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const Paragraph_1 = require("../../content/Paragraph");
-const index_1 = require("../../../tasty/index");
-const TooltipProvider_1 = require("../../overlays/Tooltip/TooltipProvider");
-const Text_1 = require("../../content/Text");
-const index_2 = require("../../../utils/react/index");
-const Space_1 = require("../../layout/Space");
-const Flex_1 = require("../../layout/Flex");
-const Label_1 = require("../Label");
-const index_3 = require("../../../icons/index");
-const FieldElement = (0, index_1.tasty)({
-    qa: 'Field',
-    styles: {
-        display: 'grid',
-        width: 'auto',
-        gridColumns: {
-            '': 'minmax(0, 1fr)',
-            'has-sider': '@(full-label-width, auto) minmax(0, 1fr)',
-        },
-        gap: 0,
-        placeItems: 'baseline stretch',
-        '@full-label-width': '(@label-width + 1x)',
-        LabelArea: {
-            display: 'block',
-            width: {
-                '': 'initial',
-                'has-sider': '@label-width',
-            },
-            margin: {
-                '': '1x bottom',
-                'has-sider': '1x right',
-                ':empty': '0',
-            },
-        },
-        InputArea: {
-            display: 'block',
-            flow: 'column',
-            gap: '.5x',
-            gridColumn: {
-                '': 'initial',
-                'has-sider': 2,
-            },
-        },
-    },
-});
-if (process.env.NODE_ENV === 'development') {
-    FieldElement.displayName = 'FieldWrapperElement';
-}
-const MessageElement = (0, index_1.tasty)({
-    qa: 'Field_Message',
-    styles: {
-        preset: 't4',
-        color: {
-            '': '#dark-02',
-            invalid: '#danger-text',
-            valid: '#success-text',
-            disabled: '#dark.40',
-        },
-        textAlign: 'left',
-        userSelect: 'none',
-    },
-});
-/**
- * A wrapper for form fields to provide additional decoration for inputs.
- * @internal Do not use this component directly.
- */
-exports.FieldWrapper = (0, react_1.forwardRef)(function FieldWrapper(props, ref) {
-    const { as, labelPosition = 'top', label, extra, styles, isRequired, isDisabled, labelStyles, necessityIndicator, labelProps, fieldProps, message, messageStyles, description, Component, validationState, requiredMark = true, tooltip, isHidden, labelSuffix, children, } = props;
-    const labelComponent = label ? ((0, jsx_runtime_1.jsx)(Label_1.Label, { as: as === 'label' ? 'div' : 'label', styles: labelStyles, labelPosition: labelPosition, isRequired: requiredMark ? isRequired : false, isDisabled: isDisabled, necessityIndicator: necessityIndicator, validationState: validationState, "aria-label": typeof label === 'string' ? label : undefined, ...labelProps, children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { placeContent: "baseline space-between", width: "100%", children: [(0, jsx_runtime_1.jsxs)(Space_1.Space, { placeItems: "center", gap: "0.75x", children: [(0, jsx_runtime_1.jsx)("div", { children: label }), tooltip ? ((0, jsx_runtime_1.jsx)(TooltipProvider_1.TooltipProvider, { activeWrap: true, title: tooltip, width: "initial max-content 40x", children: (0, jsx_runtime_1.jsx)(index_3.InfoCircleIcon, { color: "#purple-text" }) })) : null, labelSuffix ? (0, jsx_runtime_1.jsx)("div", { children: labelSuffix }) : null] }), extra && (0, jsx_runtime_1.jsx)(Text_1.Text, { preset: "t3", children: extra })] }) })) : null;
-    let descriptionComponent = description ? ((0, jsx_runtime_1.jsx)("div", { "data-element": "Description", children: (0, index_2.wrapNodeIfPlain)(description, () => ((0, jsx_runtime_1.jsx)(Paragraph_1.Paragraph, { children: description }))) })) : null;
-    const mods = {
-        'has-sider': labelPosition === 'side',
-        'has-description': !!description,
-        invalid: validationState === 'invalid',
-        valid: validationState === 'valid',
-    };
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(FieldElement, { ref: ref, as: as ?? 'div', mods: mods, isHidden: isHidden, styles: styles, ...fieldProps, children: [labelComponent || descriptionComponent ? ((0, jsx_runtime_1.jsxs)("div", { "data-element": "LabelArea", children: [labelComponent, descriptionComponent] })) : null, (0, jsx_runtime_1.jsxs)("div", { "data-element": "InputArea", children: [Component, message && !isDisabled && ((0, jsx_runtime_1.jsx)(MessageElement, { mods: mods, styles: messageStyles, role: validationState === 'invalid' ? 'alert' : undefined, children: message }))] })] }), children] }));
-});
-
-        

package/cjs/components/form/FieldWrapper/extract-field-wrapper-props.js

@@ -1,49 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.extractFieldWrapperProps = extractFieldWrapperProps;
-const createFieldWrapperPropsKeys = (arr) => new Set(arr);
-const fieldWrapperPropsKeys = createFieldWrapperPropsKeys([
-    'as',
-    'validationState',
-    'styles',
-    'isRequired',
-    'isDisabled',
-    'fieldProps',
-    'isHidden',
-    'label',
-    'labelPosition',
-    'labelSuffix',
-    'labelStyles',
-    'labelProps',
-    'description',
-    'requiredMark',
-    'tooltip',
-    'extra',
-    'necessityLabel',
-    'necessityIndicator',
-    'message',
-    'messageStyles',
-    'Component',
-]);
-function extractFieldWrapperProps(props) {
-    const fieldWrapperProps = {};
-    const rest = {};
-    for (const [key, prop] of Object.entries(props)) {
-        if (fieldWrapperPropsKeys.has(key)) {
-            fieldWrapperProps[key] = prop;
-        }
-        else {
-            rest[key] = prop;
-        }
-    }
-    return { fieldWrapperProps, rest };
-}
-
-        

package/cjs/components/form/FieldWrapper/index.js

@@ -1,28 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./FieldWrapper"), exports);
-__exportStar(require("./extract-field-wrapper-props"), exports);
-__exportStar(require("./types"), exports);
-
-        

package/cjs/components/form/FieldWrapper/types.js

@@ -1,11 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-
-