pixel-react 1.11.22 → 1.11.23

package/lib/components/EditLabel/EditLabel.js

@@ -0,0 +1,147 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState, useRef } from 'react';
+import Icon from '../Icon';
+import Select from '../Select';
+import './EditLabel.scss';
+import { checkEmpty } from '../../utils/checkEmpty/checkEmpty';
+import classNames from 'classnames';
+import Tooltip from '../Tooltip';
+import Toaster from '../Toast';
+import HighlightText from '../HighlightText';
+const EditLabel = ({ id = '', onConfirm, onCancel, handleCustomError, value = '', label = 'Add Script', optionsList = [], selectedOption = { label: '', value: '' }, withDropdown, inputFieldWidth = 350, selectFieldWidth = 94, textColor = 'var(--nlp-color)', tooltip, required = false, isDisable = { confirm: false, cancel: false, textField: false }, onClick, highlightText = '', isEditable, setIsEditable, cursor = 'pointer', isOnBlurTrue = false, handleOnChange, }) => {
+    const [isEditing, setIsEditing] = useState(!value);
+    const [text, setText] = useState(value ?? '');
+    const [clickTimeout, setClickTimeout] = useState(null);
+    const [showError, setShowError] = useState('');
+    const [toasts, setToasts] = useState({ error: false });
+    const [currentSelectedOption, setCurrentSelectedOption] = useState(selectedOption);
+    const containerRef = useRef(null);
+    const cancelRef = useRef(null);
+    const confirmRef = useRef(null);
+    const isValueFilled = !checkEmpty(text);
+    const handleTextFieldChange = (e) => {
+        const newValue = e.target.value;
+        setText(newValue);
+        if (typeof handleOnChange === 'function') {
+            handleOnChange(e);
+        }
+    };
+    const onDropdownChangeHandler = (option) => {
+        setCurrentSelectedOption(option);
+    };
+    const handleDoubleClick = () => {
+        if (isDisable.textField)
+            return;
+        if (clickTimeout) {
+            clearTimeout(clickTimeout);
+            setClickTimeout(null);
+        }
+        setIsEditing(true);
+        setIsEditable && setIsEditable(id);
+    };
+    const handleSingleClick = () => {
+        if (onClick)
+            onClick();
+    };
+    const handleClick = () => {
+        if (clickTimeout) {
+            clearTimeout(clickTimeout);
+            setClickTimeout(null);
+        }
+        const timeout = window.setTimeout(() => {
+            handleSingleClick();
+            setClickTimeout(null);
+        }, 1000);
+        setClickTimeout(timeout);
+    };
+    const handleConfirm = () => {
+        if (isDisable.confirm)
+            return;
+        const errorMessage = handleCustomError ? handleCustomError(text) : '';
+        if (errorMessage) {
+            handleToastToggle('error');
+            setShowError(errorMessage);
+        }
+        else {
+            setIsEditing(false);
+            setShowError('');
+            if (onConfirm)
+                onConfirm(text, currentSelectedOption);
+            setIsEditable && setIsEditable(null);
+        }
+    };
+    const handleBlur = (event) => {
+        if (withDropdown ||
+            !isOnBlurTrue ||
+            containerRef.current?.contains(event.relatedTarget) ||
+            event.relatedTarget === confirmRef.current ||
+            event.relatedTarget === cancelRef.current) {
+            return;
+        }
+        setIsEditing(false);
+        setText(value);
+        setShowError('');
+        if (onCancel)
+            onCancel();
+        setIsEditable && setIsEditable(null);
+    };
+    const handleCancel = () => {
+        if (isDisable.cancel)
+            return;
+        if (required && !value) {
+            handleToastToggle('error');
+            setShowError('Text is required.');
+            return;
+        }
+        if (onCancel) {
+            onCancel();
+        }
+        setText(value);
+        setCurrentSelectedOption(selectedOption);
+        setIsEditing(false);
+        setShowError('');
+        setIsEditable && setIsEditable(null);
+    };
+    const handleKeyDown = (event) => {
+        if (event.key === 'Enter') {
+            handleConfirm();
+        }
+        else if (event.key === 'Escape') {
+            handleCancel();
+        }
+    };
+    const handleToastToggle = (key) => {
+        setToasts((prev) => ({ ...prev, [key]: !prev[key] }));
+    };
+    useEffect(() => {
+        if (value) {
+            setText(value);
+        }
+    }, [value]);
+    useEffect(() => {
+        if (setIsEditable) {
+            if (isEditable) {
+                setIsEditing(true);
+            }
+            else {
+                setIsEditing(false);
+            }
+        }
+    }, [isEditable]);
+    return (_jsxs("div", { className: 'ff-add-module-container', style: {
+            '--add-module-text-color': textColor,
+            cursor: (isDisable && cursor) || 'pointer',
+        }, ref: containerRef, children: [isEditing && (setIsEditable ? isEditable : true) ? (_jsxs("div", { className: "ff-add-module-edit-container", children: [_jsxs("fieldset", { className: "ff-add-module-input-with-dropdown", children: [_jsxs("div", { className: classNames('ff-add-module-input-container', {
+                                    'ff-add-module-input-container--float': isValueFilled,
+                                }), style: { width: inputFieldWidth }, children: [_jsxs("label", { className: "ff-add-module-label-container", htmlFor: "add-module-input", children: [required && _jsx("span", { className: "required-asterisk", children: "*" }), _jsx("span", { className: classNames('ff-add-module-label', {
+                                                    'ff-input-label--no-hover': !!text,
+                                                }), children: label })] }), _jsx("input", { name: "add-module-input", type: "text", className: classNames('ff-add-module-input', {
+                                            'ff-add-module-input--border-right': !!withDropdown,
+                                        }), onChange: handleTextFieldChange, value: text, required: required, onBlur: handleBlur, disabled: isDisable.textField, onKeyDown: handleKeyDown, autoFocus: true, autoComplete: "off" })] }), withDropdown && (_jsx(Select, { optionsList: optionsList, selectedOption: currentSelectedOption, showLabel: false, showBorder: false, onChange: onDropdownChangeHandler, optionZIndex: 999999, width: selectFieldWidth, height: 24, className: "ff-add-module-dropdown", selectedOptionColor: "var(--nlp-color)" }))] }), _jsxs("div", { className: "ff-module-icon-container", children: [_jsx(Tooltip, { title: "Confirm", placement: 'bottom', children: _jsx(Icon, { className: "icons", name: "update_icon", onClick: () => !isDisable.confirm && handleConfirm(), color: isDisable.confirm
+                                        ? 'var(--default-color)'
+                                        : 'var(--label-edit-confirm-icon)', height: 16, width: 16, ref: confirmRef, tabIndex: -1, disabled: isDisable?.confirm }) }), _jsx(Tooltip, { title: "Cancel", placement: 'bottom', children: _jsx(Icon, { className: "icons", name: "close", onClick: () => !isDisable.cancel && handleCancel(), color: isDisable.cancel
+                                        ? 'var(--default-color)'
+                                        : 'var(--label-edit-cancel-icon)', height: 16, width: 16, ref: cancelRef, tabIndex: -1, disabled: isDisable?.cancel }) })] })] })) : (_jsx(Tooltip, { title: tooltip?.tooltipTitle ?? '', placement: tooltip?.tooltipPlacement ?? 'bottom', children: _jsx("span", { className: 'ff-add-module-display-text', style: { cursor: (isDisable?.textField && cursor) || 'pointer' }, onDoubleClick: handleDoubleClick, role: "button", onClick: handleClick, children: checkEmpty(highlightText) ? (text) : (_jsx(HighlightText, { text: text, highlight: highlightText })) }) })), _jsx(Toaster, { isOpen: toasts.error, variant: "danger", toastTitle: "Error!", toastMessage: showError, onCancelClick: () => handleToastToggle('error') })] }));
+};
+export default EditLabel;
+//# sourceMappingURL=EditLabel.js.map

package/lib/components/EditLabel/EditLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditLabel.js","sourceRoot":"","sources":["../../../src/components/EditLabel/EditLabel.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,kBAAkB,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAC/D,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,OAAO,MAAM,YAAY,CAAC;AACjC,OAAO,OAAO,MAAM,UAAU,CAAC;AAC/B,OAAO,aAAa,MAAM,kBAAkB,CAAC;AAE7C,MAAM,SAAS,GAAG,CAAC,EACjB,EAAE,GAAG,EAAE,EACP,SAAS,EACT,QAAQ,EACR,iBAAiB,EACjB,KAAK,GAAG,EAAE,EACV,KAAK,GAAG,YAAY,EACpB,WAAW,GAAG,EAAE,EAChB,cAAc,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EACzC,YAAY,EACZ,eAAe,GAAG,GAAG,EACrB,gBAAgB,GAAG,EAAE,EACrB,SAAS,GAAG,kBAAkB,EAC9B,OAAO,EACP,QAAQ,GAAG,KAAK,EAChB,SAAS,GAAG,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,EAC/D,OAAO,EACP,aAAa,GAAG,EAAE,EAClB,UAAU,EACV,aAAa,EACb,MAAM,GAAG,SAAS,EAClB,YAAY,GAAG,KAAK,EACpB,cAAc,GACC,EAAE,EAAE;IACnB,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,CAAC,KAAK,CAAC,CAAC;IACnD,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC;IAC9C,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IACtE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAC/C,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;IAEvD,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GACrD,QAAQ,CAAS,cAAc,CAAC,CAAC;IACnC,MAAM,YAAY,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IACzD,MAAM,SAAS,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IACtD,MAAM,UAAU,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAEvD,MAAM,aAAa,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IAExC,MAAM,qBAAqB,GAAG,CAAC,CAAsC,EAAE,EAAE;QACvE,MAAM,QAAQ,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QAChC,OAAO,CAAC,QAAQ,CAAC,CAAC;QAElB,IAAI,OAAO,cAAc,KAAK,UAAU,EAAE,CAAC;YACzC,cAAc,CAAC,CAAC,CAAC,CAAC;QACpB,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,uBAAuB,GAAG,CAAC,MAAc,EAAE,EAAE;QACjD,wBAAwB,CAAC,MAAM,CAAC,CAAC;IACnC,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,GAAG,EAAE;QAC7B,IAAI,SAAS,CAAC,SAAS;YAAE,OAAO;QAChC,IAAI,YAAY,EAAE,CAAC;YACjB,YAAY,CAAC,YAAY,CAAC,CAAC;YAC3B,eAAe,CAAC,IAAI,CAAC,CAAC;QACxB,CAAC;QACD,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,aAAa,IAAI,aAAa,CAAC,EAAE,CAAC,CAAC;IACrC,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,GAAG,EAAE;QAC7B,IAAI,OAAO;YAAE,OAAO,EAAE,CAAC;IACzB,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,IAAI,YAAY,EAAE,CAAC;YACjB,YAAY,CAAC,YAAY,CAAC,CAAC;YAC3B,eAAe,CAAC,IAAI,CAAC,CAAC;QACxB,CAAC;QACD,MAAM,OAAO,GAAG,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE;YACrC,iBAAiB,EAAE,CAAC;YACpB,eAAe,CAAC,IAAI,CAAC,CAAC;QACxB,CAAC,EAAE,IAAI,CAAC,CAAC;QACT,eAAe,CAAC,OAAO,CAAC,CAAC;IAC3B,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,IAAI,SAAS,CAAC,OAAO;YAAE,OAAO;QAC9B,MAAM,YAAY,GAAG,iBAAiB,CAAC,CAAC,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;QAEtE,IAAI,YAAY,EAAE,CAAC;YACjB,iBAAiB,CAAC,OAAO,CAAC,CAAC;YAC3B,YAAY,CAAC,YAAY,CAAC,CAAC;QAC7B,CAAC;aAAM,CAAC;YACN,YAAY,CAAC,KAAK,CAAC,CAAC;YACpB,YAAY,CAAC,EAAE,CAAC,CAAC;YACjB,IAAI,SAAS;gBAAE,SAAS,CAAC,IAAI,EAAE,qBAAqB,CAAC,CAAC;YACtD,aAAa,IAAI,aAAa,CAAC,IAAI,CAAC,CAAC;QACvC,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,CAAC,KAAyC,EAAE,EAAE;QAC/D,IACE,YAAY;YACZ,CAAC,YAAY;YACb,YAAY,CAAC,OAAO,EAAE,QAAQ,CAAC,KAAK,CAAC,aAAa,CAAC;YACnD,KAAK,CAAC,aAAa,KAAK,UAAU,CAAC,OAAO;YAC1C,KAAK,CAAC,aAAa,KAAK,SAAS,CAAC,OAAO,EACzC,CAAC;YACD,OAAO;QACT,CAAC;QACD,YAAY,CAAC,KAAK,CAAC,CAAC;QACpB,OAAO,CAAC,KAAK,CAAC,CAAC;QACf,YAAY,CAAC,EAAE,CAAC,CAAC;QACjB,IAAI,QAAQ;YAAE,QAAQ,EAAE,CAAC;QACzB,aAAa,IAAI,aAAa,CAAC,IAAI,CAAC,CAAC;IACvC,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,GAAG,EAAE;QACxB,IAAI,SAAS,CAAC,MAAM;YAAE,OAAO;QAC7B,IAAI,QAAQ,IAAI,CAAC,KAAK,EAAE,CAAC;YACvB,iBAAiB,CAAC,OAAO,CAAC,CAAC;YAC3B,YAAY,CAAC,mBAAmB,CAAC,CAAC;YAClC,OAAO;QACT,CAAC;QACD,IAAI,QAAQ,EAAE,CAAC;YACb,QAAQ,EAAE,CAAC;QACb,CAAC;QACD,OAAO,CAAC,KAAK,CAAC,CAAC;QACf,wBAAwB,CAAC,cAAc,CAAC,CAAC;QACzC,YAAY,CAAC,KAAK,CAAC,CAAC;QACpB,YAAY,CAAC,EAAE,CAAC,CAAC;QACjB,aAAa,IAAI,aAAa,CAAC,IAAI,CAAC,CAAC;IACvC,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,CAAC,KAA4C,EAAE,EAAE;QACrE,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,EAAE,CAAC;YAC1B,aAAa,EAAE,CAAC;QAClB,CAAC;aAAM,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;YAClC,YAAY,EAAE,CAAC;QACjB,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,GAAwB,EAAE,EAAE;QACrD,SAAS,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,IAAI,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC;IACxD,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,KAAK,EAAE,CAAC;YACV,OAAO,CAAC,KAAK,CAAC,CAAC;QACjB,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,aAAa,EAAE,CAAC;YAClB,IAAI,UAAU,EAAE,CAAC;gBACf,YAAY,CAAC,IAAI,CAAC,CAAC;YACrB,CAAC;iBAAM,CAAC;gBACN,YAAY,CAAC,KAAK,CAAC,CAAC;YACtB,CAAC;QACH,CAAC;IACH,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,OAAO,CACL,eACE,SAAS,EAAE,yBAAyB,EACpC,KAAK,EACH;YACE,yBAAyB,EAAE,SAAS;YACpC,MAAM,EAAE,CAAC,SAAS,IAAI,MAAM,CAAC,IAAI,SAAS;SACpB,EAE1B,GAAG,EAAE,YAAY,aAEhB,SAAS,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAClD,eAAK,SAAS,EAAC,8BAA8B,aAC3C,oBAAU,SAAS,EAAC,mCAAmC,aACrD,eACE,SAAS,EAAE,UAAU,CAAC,+BAA+B,EAAE;oCACrD,sCAAsC,EAAE,aAAa;iCACtD,CAAC,EACF,KAAK,EAAE,EAAE,KAAK,EAAE,eAAe,EAAE,aAEjC,iBACE,SAAS,EAAC,+BAA+B,EACzC,OAAO,EAAC,kBAAkB,aAEzB,QAAQ,IAAI,eAAM,SAAS,EAAC,mBAAmB,kBAAS,EACzD,eACE,SAAS,EAAE,UAAU,CAAC,qBAAqB,EAAE;oDAC3C,0BAA0B,EAAE,CAAC,CAAC,IAAI;iDACnC,CAAC,YAED,KAAK,GACD,IACD,EACR,gBACE,IAAI,EAAC,kBAAkB,EACvB,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,UAAU,CAAC,qBAAqB,EAAE;4CAC3C,mCAAmC,EAAE,CAAC,CAAC,YAAY;yCACpD,CAAC,EACF,QAAQ,EAAE,qBAAqB,EAC/B,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,UAAU,EAClB,QAAQ,EAAE,SAAS,CAAC,SAAS,EAC7B,SAAS,EAAE,aAAa,EACxB,SAAS,QACT,YAAY,EAAC,KAAK,GAClB,IACE,EACL,YAAY,IAAI,CACf,KAAC,MAAM,IACL,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,qBAAqB,EACrC,SAAS,EAAE,KAAK,EAChB,UAAU,EAAE,KAAK,EACjB,QAAQ,EAAE,uBAAuB,EACjC,YAAY,EAAE,MAAM,EACpB,KAAK,EAAE,gBAAgB,EACvB,MAAM,EAAE,EAAE,EACV,SAAS,EAAC,wBAAwB,EAClC,mBAAmB,EAAC,kBAAkB,GACtC,CACH,IACQ,EACX,eAAK,SAAS,EAAC,0BAA0B,aACvC,KAAC,OAAO,IAAC,KAAK,EAAC,SAAS,EAAC,SAAS,EAAE,QAAQ,YAC1C,KAAC,IAAI,IACH,SAAS,EAAC,OAAO,EACjB,IAAI,EAAC,aAAa,EAClB,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,SAAS,CAAC,OAAO,IAAI,aAAa,EAAE,EACpD,KAAK,EACH,SAAS,CAAC,OAAO;wCACf,CAAC,CAAC,sBAAsB;wCACxB,CAAC,CAAC,gCAAgC,EAEtC,MAAM,EAAE,EAAE,EACV,KAAK,EAAE,EAAE,EACT,GAAG,EAAE,UAAU,EACf,QAAQ,EAAE,CAAC,CAAC,EACZ,QAAQ,EAAE,SAAS,EAAE,OAAO,GAC5B,GACM,EACV,KAAC,OAAO,IAAC,KAAK,EAAC,QAAQ,EAAC,SAAS,EAAE,QAAQ,YACzC,KAAC,IAAI,IACH,SAAS,EAAC,OAAO,EACjB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,GAAE,EAAE,CAAA,CAAC,SAAS,CAAC,MAAM,IAAI,YAAY,EAAE,EAChD,KAAK,EACH,SAAS,CAAC,MAAM;wCACd,CAAC,CAAC,sBAAsB;wCACxB,CAAC,CAAC,+BAA+B,EAErC,MAAM,EAAE,EAAE,EACV,KAAK,EAAE,EAAE,EACT,GAAG,EAAE,SAAS,EACd,QAAQ,EAAE,CAAC,CAAC,EACZ,QAAQ,EAAE,SAAS,EAAE,MAAM,GAC3B,GACM,IACN,IACF,CACP,CAAC,CAAC,CAAC,CACF,KAAC,OAAO,IACN,KAAK,EAAE,OAAO,EAAE,YAAY,IAAI,EAAE,EAClC,SAAS,EAAE,OAAO,EAAE,gBAAgB,IAAI,QAAQ,YAEhD,eACE,SAAS,EAAE,4BAA4B,EACvC,KAAK,EAAE,EAAE,MAAM,EAAE,CAAC,SAAS,EAAE,SAAS,IAAI,MAAM,CAAC,IAAI,SAAS,EAAE,EAChE,aAAa,EAAE,iBAAiB,EAChC,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,WAAW,YAEnB,UAAU,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAC3B,IAAI,CACL,CAAC,CAAC,CAAC,CACF,KAAC,aAAa,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,aAAa,GAAI,CACxD,GACI,GACC,CACX,EACD,KAAC,OAAO,IACN,MAAM,EAAE,MAAM,CAAC,KAAK,EACpB,OAAO,EAAC,QAAQ,EAChB,UAAU,EAAC,QAAQ,EACnB,YAAY,EAAE,SAAS,EACvB,aAAa,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,OAAO,CAAC,GAC/C,IACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/lib/components/EditLabel/index.d.ts

@@ -0,0 +1 @@
+export { default } from './EditLabel';

package/lib/components/EditLabel/index.js

@@ -0,0 +1,2 @@
+export { default } from './EditLabel';
+//# sourceMappingURL=index.js.map

package/lib/components/EditLabel/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/EditLabel/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,EAAC,MAAM,aAAa,CAAC"}

package/lib/components/EditLabel/types.d.ts

@@ -0,0 +1,37 @@
+export interface EditLabelProps {
+    onConfirm?: (_text: string, _selectedOption?: Option) => void;
+    onCancel?: () => void;
+    onClick?: () => void;
+    handleCustomError?: (inputText: string) => string;
+    value?: string;
+    label?: string;
+    optionsList?: Option[];
+    selectedOption?: Option;
+    withDropdown?: boolean;
+    inputFieldWidth?: number;
+    selectFieldWidth?: number;
+    textColor?: string;
+    required?: boolean;
+    isDisable?: DisabledOptions;
+    tooltip?: {
+        tooltipTitle?: string;
+        tooltipPlacement?: 'bottom' | 'top' | 'left' | 'right' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end';
+    };
+    highlightText?: string;
+    id?: string;
+    isEditable?: boolean;
+    setIsEditable?: (id: string | null) => void;
+    cursor?: string;
+    isOnBlurTrue?: boolean;
+    handleOnChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+}
+type OptionValue = any;
+type DisabledOptions = {
+    confirm?: boolean;
+    cancel?: boolean;
+    textField?: boolean;
+};
+export interface Option {
+    [key: string]: OptionValue;
+}
+export {};

package/lib/components/EditLabel/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/lib/components/EditLabel/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/EditLabel/types.ts"],"names":[],"mappings":""}

package/lib/components/EditTextField/EditTextField.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import './EditTextField.scss';
+import { LabelEditTextFieldTypes } from './types';
+declare const EditTextField: FC<LabelEditTextFieldTypes>;
+export default EditTextField;

package/lib/components/EditTextField/EditTextField.js

@@ -0,0 +1,85 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useRef } from 'react';
+import './EditTextField.scss';
+import Typography from '../Typography';
+import HighlightText from '../HighlightText';
+import Icon from '../Icon';
+import Tooltip from '../Tooltip';
+import { capitalize } from '../../utils/capitalize/capitalize';
+import Input from '../Input/Input';
+import { useKeyboardActions } from '../../utils/keyBoardActionUtil/UseKeyboardActions';
+const getErrorMessage = (inputValue, text, customError, customErrorCondition) => {
+    if (inputValue === text) {
+        return 'No changes were made.';
+    }
+    if (!inputValue) {
+        return 'Text is required';
+    }
+    if (inputValue.length < 3) {
+        return 'Please enter at least 3 characters.';
+    }
+    if (customErrorCondition) {
+        return customError ?? '';
+    }
+    return '';
+};
+const EditTextField = ({ label, text, highlightText, customError, customErrorCondition = false, confirmIcon, cancelIcon, editIcon, dropdownData = [], 
+// width = '',
+// height = '',
+isOpen = false, confirmAction, onClick, nameTooltipTitle, }) => {
+    const [isEditing, setIsEditing] = useState(isOpen ?? false);
+    const [inputValue, setInputValue] = useState(text);
+    const [disabled, isDisabled] = useState(true);
+    const [dropdownValue, setDropdownValue] = useState(dropdownData[0]?.value ?? '');
+    const [showError, setShowError] = useState('');
+    const [isTextFieldModified, setIsTextFieldModified] = useState(false);
+    const isThrowingError = showError && isEditing ? true : false;
+    const containerRef = useRef(null);
+    const cancelRef = useRef(null);
+    const handleEditButtonClick = () => {
+        setIsEditing(true);
+        setShowError('');
+    };
+    const handleConfirm = () => {
+        const errorMessage = getErrorMessage(inputValue, text, customError, customErrorCondition);
+        if (errorMessage && isEditing) {
+            setShowError(errorMessage);
+        }
+        else {
+            setIsEditing(false);
+            setShowError('');
+            if (confirmAction)
+                confirmAction(inputValue, dropdownValue);
+        }
+    };
+    const handleCancel = () => {
+        setInputValue(text);
+        setDropdownValue(dropdownData[0]?.value ?? '');
+        setIsEditing(false);
+        setShowError('');
+        setIsTextFieldModified(false);
+    };
+    const handleTextFieldChange = (e) => {
+        setInputValue(e.target.value);
+        setIsTextFieldModified(true);
+        setShowError('');
+        isDisabled(false);
+    };
+    function handleKeyBoard(key) {
+        if (key === 'Enter') {
+            handleConfirm();
+        }
+        if (key === 'Escape') {
+            handleCancel();
+        }
+    }
+    useKeyboardActions([
+        { key: 'Enter', action: () => handleKeyBoard('Enter') },
+        { key: 'Escape', action: () => handleKeyBoard('Escape') },
+    ]);
+    return (_jsxs("div", { className: "ff-label-edit-text-field", ref: containerRef, children: [isEditing ? (_jsxs("div", { className: "ff-label-text-field", children: [_jsx("div", { className: "ff-label-text-field-without-dropdown", children: _jsx(Input, { name: "input", label: label ? label : '', disabled: false, error: isThrowingError, placeholder: "Enter your name", value: inputValue, onChange: handleTextFieldChange, className: `
+                
+               ${isTextFieldModified ? 'modified' : ''}`, type: "text" }) }), _jsxs("div", { className: "ff-icon-container", children: [confirmIcon && (_jsx(Tooltip, { title: "confirm", placement: 'bottom', children: _jsx(Icon, { color: confirmIcon?.color ?? 'var(--default-confirm-icon-color)', height: confirmIcon?.height ?? 20, disabled: disabled, width: confirmIcon?.width ?? 20, name: confirmIcon?.name ?? 'default-confirm-icon', className: `${confirmIcon?.className ?? 'default-confirm-class'} ${disabled ? 'disabled-confirm-icon' : 'confirm-icon'}`, onClick: handleConfirm }) })), cancelIcon && (_jsx(Tooltip, { title: "cancel", placement: 'bottom', children: _jsx(Icon, { color: cancelIcon?.color ?? 'var(--label-edit-cancel-icon)', height: cancelIcon?.height ?? 12, width: cancelIcon?.width ?? 20, name: cancelIcon?.name ?? 'default-cancel-icon', className: cancelIcon?.className ?? 'cancel-icon', onClick: handleCancel, ref: cancelRef }) }))] })] })) : (_jsxs("div", { className: "display-text-container", children: [nameTooltipTitle ? (_jsx(Tooltip, { title: nameTooltipTitle, children: _jsx("span", { className: "display-text", onClick: onClick, children: _jsx(HighlightText, { text: inputValue, highlight: highlightText }) }) })) : (_jsx("span", { className: "display-text", onClick: onClick, children: _jsx(HighlightText, { text: inputValue, highlight: highlightText }) })), _jsx(Tooltip, { title: capitalize(editIcon?.name ?? 'Edit'), children: _jsx(Icon, { color: editIcon?.color ?? 'var(--label-edit-cancel-icon)', height: editIcon?.height ?? 20, width: editIcon?.width ?? 20, name: editIcon?.name ?? 'edit', className: editIcon?.className ?? 'edit-icon', onClick: handleEditButtonClick }) })] })), showError && isEditing && (_jsx(Typography, { as: "p", fontSize: 8, className: "error-text", children: showError }))] }));
+};
+export default EditTextField;
+//# sourceMappingURL=EditTextField.js.map

package/lib/components/EditTextField/EditTextField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditTextField.js","sourceRoot":"","sources":["../../../src/components/EditTextField/EditTextField.tsx"],"names":[],"mappings":"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"}

package/lib/components/EditTextField/index.d.ts

@@ -0,0 +1 @@
+export { default } from './EditTextField';

package/lib/components/EditTextField/index.js

@@ -0,0 +1,2 @@
+export { default } from './EditTextField';
+//# sourceMappingURL=index.js.map

package/lib/components/EditTextField/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/EditTextField/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC"}

package/lib/components/EditTextField/types.d.ts

@@ -0,0 +1,52 @@
+export interface IconProps {
+    /** Name of the icon to be displayed. */
+    name: string;
+    /** Optional click handler function for the icon. */
+    onClick?: () => void;
+    /** Optional color for the icon. */
+    color?: string;
+    /** Optional height for the icon. */
+    height?: number;
+    /** Optional width for the icon. */
+    width?: number;
+    /** Optional className for the icon. */
+    className?: string;
+}
+export interface DropdownOption {
+    /** Unique identifier for the dropdown option. */
+    id: number;
+    /** Value associated with the dropdown option. */
+    value: string;
+    /** Label displayed for the dropdown option. */
+    label: string;
+}
+export interface LabelEditTextFieldTypes {
+    /** Label text displayed above the input field. */
+    label?: string;
+    /** Initial text displayed in the input field. */
+    text: string;
+    /** Text to be highlighted within the displayed text, if provided. */
+    highlightText?: string;
+    /** Custom error message to be displayed, if applicable. */
+    customError?: string;
+    /** Confirm icon properties including icon name and click handler. */
+    confirmIcon?: IconProps;
+    /** Cancel icon properties including icon name and click handler. */
+    cancelIcon?: IconProps;
+    editIcon?: IconProps;
+    /** Type of input field - standard text field or text field with a dropdown. */
+    variant?: 'textFieldWithDropdown' | 'textField';
+    /** Array of dropdown options used if the dropdown variant is selected. */
+    dropdownData?: DropdownOption[];
+    /** Width of the input field component. */
+    width?: string;
+    /** Height of the input field component. */
+    height?: string;
+    /** Function called when confirming input changes, with input and dropdown values as arguments. */
+    confirmAction?: (inputValue: string, dropdownValue: string) => void;
+    isOpen?: boolean;
+    /**for conditionally handle custom error */
+    customErrorCondition?: boolean;
+    onClick?: () => void;
+    nameTooltipTitle?: string;
+}

package/lib/components/EditTextField/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/lib/components/EditTextField/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/EditTextField/types.ts"],"names":[],"mappings":""}

package/lib/components/Editor/Editor.d.ts

@@ -0,0 +1,4 @@
+import { EditorProps } from './types';
+import './Editor.scss';
+declare const Editor: import("react").ForwardRefExoticComponent<EditorProps & import("react").RefAttributes<any>>;
+export default Editor;