intelicoreact 1.5.32 → 1.5.34

package/dist/src/Atomic/FormElements/FileLoaderLocalGroup/FileLoaderLocalGroup.js

@@ -0,0 +1,233 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+const _reactfeather = require("react-feather");
+const _utils = require("../../../Functions/utils");
+const _Alert = /*#__PURE__*/ _interop_require_default(require("../../UI/Alert/Alert"));
+const _FileLoaderLocal = /*#__PURE__*/ _interop_require_default(require("../FileLoaderLocal/FileLoaderLocal"));
+require("./FileLoaderLocalGroup.scss");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const DEFAULT_LABEL_PREFIX = "Please attach";
+const MAX_FILE_SIZE = 10 * 1024 * 1024;
+const FileLoaderLocalGroup = ({ className, groupsArray = [], isSingleGroup, onChange, labelPrefix = DEFAULT_LABEL_PREFIX, testId = "file-loader-local-group", alertText })=>{
+    const [groups, setGroups] = (0, _react.useState)((0, _utils.clone)(groupsArray));
+    const getNewFile = (group)=>{
+        var _group_files, _group_files1, _group_files2, _group_files3;
+        var _group_maxItemSizeBytes;
+        return {
+            id: isNaN(((_group_files = group.files) === null || _group_files === void 0 ? void 0 : _group_files.at(-1).id) + 1) ? 1 : ((_group_files1 = group.files) === null || _group_files1 === void 0 ? void 0 : _group_files1.at(-1).id) + 1,
+            value: "",
+            base64: "",
+            error: "",
+            accept: group.accept || ".jpg, .jpeg, .png, .pdf",
+            maxItemSizeBytes: (_group_maxItemSizeBytes = group.maxItemSizeBytes) !== null && _group_maxItemSizeBytes !== void 0 ? _group_maxItemSizeBytes : MAX_FILE_SIZE,
+            isRequired: (group === null || group === void 0 ? void 0 : group.isRequired) || false,
+            fieldKey: isNaN(((_group_files2 = group.files) === null || _group_files2 === void 0 ? void 0 : _group_files2.at(-1).id) + 1) ? 1 : ((_group_files3 = group.files) === null || _group_files3 === void 0 ? void 0 : _group_files3.at(-1).id) + 1
+        };
+    };
+    const generateUniqueFileName = (files, name)=>{
+        let fileName = name;
+        const [nameWithoutExtension, extension] = name.split(/(?=\.[^.]+$)/);
+        let count = 1;
+        while(files.some((file)=>file.value === fileName)){
+            fileName = `${nameWithoutExtension}(${count})${extension}`;
+            count += 1;
+        }
+        return fileName;
+    };
+    (0, _react.useEffect)(()=>{
+        const mergedGroups = groupsArray === null || groupsArray === void 0 ? void 0 : groupsArray.map((group)=>{
+            return {
+                ...group,
+                files: [
+                    getNewFile(group)
+                ]
+            };
+        });
+        setGroups(mergedGroups);
+    }, []);
+    const handle = {
+        change: ({ e, groupId, name, id, error, valueExtension, file })=>{
+            const currentGroup = groups === null || groups === void 0 ? void 0 : groups.find((group)=>group.groupId === groupId.toString());
+            const files = currentGroup === null || currentGroup === void 0 ? void 0 : currentGroup.files;
+            const changedField = files.find((item)=>Number(item.id) === Number(id));
+            if (error) {
+                changedField.value = name;
+                changedField.error = error;
+                setGroups([
+                    ...groups
+                ]);
+                onChange(groups);
+            } else if (name && !error) {
+                const uniqueFileName = generateUniqueFileName(files, name);
+                (0, _utils.getBase64)(file).then((result)=>{
+                    changedField.value = uniqueFileName;
+                    changedField.base64 = result;
+                    changedField.error = "";
+                    const oldDataWithNewFile = groups === null || groups === void 0 ? void 0 : groups.map((group)=>{
+                        if ((group === null || group === void 0 ? void 0 : group.groupId) === groupId.toString() && isSingleGroup) {
+                            return {
+                                ...group,
+                                files: [
+                                    ...group.files
+                                ]
+                            };
+                        } else if ((group === null || group === void 0 ? void 0 : group.groupId) === groupId.toString() && group.files.length < 10 && !isSingleGroup) {
+                            return {
+                                ...group,
+                                files: [
+                                    ...group.files,
+                                    {
+                                        ...getNewFile(group),
+                                        isRequired: group.files.length > 1
+                                    }
+                                ]
+                            };
+                        }
+                        return group;
+                    });
+                    setGroups([
+                        ...oldDataWithNewFile
+                    ]);
+                    onChange(oldDataWithNewFile);
+                }).catch((e)=>console.error(e));
+            } else {
+                const oldDataWithRemovedFile = groups === null || groups === void 0 ? void 0 : groups.map((group)=>{
+                    if (isSingleGroup && (group === null || group === void 0 ? void 0 : group.groupId) === groupId.toString()) {
+                        return {
+                            ...group,
+                            files: [
+                                {
+                                    ...getNewFile(group),
+                                    value: "",
+                                    base64: ""
+                                }
+                            ]
+                        };
+                    } else if ((group === null || group === void 0 ? void 0 : group.groupId) === groupId.toString() && !isSingleGroup) {
+                        return {
+                            ...group,
+                            files: group.files.filter((item)=>item.id !== id)
+                        };
+                    }
+                    return group;
+                });
+                setGroups([
+                    ...oldDataWithRemovedFile
+                ]);
+                onChange(oldDataWithRemovedFile);
+            }
+        }
+    };
+    const getUniqueExts = (acceptExts)=>(0, _utils.getUniqueFileExtensions)(acceptExts === null || acceptExts === void 0 ? void 0 : acceptExts.replace(/\./g, ""));
+    return groups === null || groups === void 0 ? void 0 : groups.map((group)=>{
+        var _group_files;
+        return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+            "data-testid": testId,
+            className: (0, _classnames.default)("file-loader-local-groups", className),
+            children: [
+                /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+                    className: "file-loader-local-groups__label",
+                    children: /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+                        className: "file-loader-local-groups__label-text",
+                        children: [
+                            labelPrefix,
+                            " ",
+                            group === null || group === void 0 ? void 0 : group.groupTitleDescription,
+                            " ",
+                            /*#__PURE__*/ (0, _jsxruntime.jsxs)("span", {
+                                className: "file-loader-local-groups__label-extension",
+                                children: [
+                                    "(",
+                                    getUniqueExts(group === null || group === void 0 ? void 0 : group.accept),
+                                    "):"
+                                ]
+                            })
+                        ]
+                    })
+                }),
+                (group === null || group === void 0 ? void 0 : group.alertText) && /*#__PURE__*/ (0, _jsxruntime.jsx)(_Alert.default, {
+                    className: "file-loader-local-groups__alert",
+                    noDismiss: true,
+                    icon: /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.Info, {}),
+                    message: group === null || group === void 0 ? void 0 : group.alertText
+                }),
+                /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                    className: "file-loader-local-groups__item",
+                    children: group === null || group === void 0 ? void 0 : (_group_files = group.files) === null || _group_files === void 0 ? void 0 : _group_files.map((file, index)=>{
+                        var _group_files, _group_files1;
+                        return /*#__PURE__*/ (0, _jsxruntime.jsx)(_FileLoaderLocal.default, {
+                            groupId: group === null || group === void 0 ? void 0 : group.groupId,
+                            fieldKey: (file === null || file === void 0 ? void 0 : file.fieldKey) ? `${file.fieldKey}:${group === null || group === void 0 ? void 0 : group.groupId}:${Math.random().toString().slice(-4)}` : file === null || file === void 0 ? void 0 : file.id,
+                            id: (file === null || file === void 0 ? void 0 : file.id) || index,
+                            error: file === null || file === void 0 ? void 0 : file.error,
+                            label: "Upload document",
+                            accept: file === null || file === void 0 ? void 0 : file.accept,
+                            value: file === null || file === void 0 ? void 0 : file.value,
+                            maxItemSizeBytes: file === null || file === void 0 ? void 0 : file.maxItemSizeBytes,
+                            onChange: (value)=>handle.change(value, file === null || file === void 0 ? void 0 : file.id),
+                            isRequired: ((_group_files = group.files) === null || _group_files === void 0 ? void 0 : _group_files.length) <= 1 || false,
+                            isNoTrashIcon: ((_group_files1 = group.files) === null || _group_files1 === void 0 ? void 0 : _group_files1.length) <= 1 && !isSingleGroup
+                        }, (file === null || file === void 0 ? void 0 : file.id) || index);
+                    })
+                })
+            ]
+        }, group.groupId);
+    });
+};
+const _default = FileLoaderLocalGroup;

package/dist/src/Atomic/FormElements/FileLoaderLocalGroup/FileLoaderLocalGroup.stories.js

@@ -0,0 +1,84 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    FileLoaderLocalTemplate: function() {
+        return FileLoaderLocalTemplate;
+    },
+    default: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _FileLoaderLocalGroup = /*#__PURE__*/ _interop_require_default(require("./FileLoaderLocalGroup"));
+require("../../../../../scss/main.scss");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+global.lng = "en";
+const _default = {
+    title: "Form Elements/FileLoaderLocalGroup",
+    component: _FileLoaderLocalGroup.default,
+    argTypes: {
+        isSingleGroup: {
+            description: "boolean - if true, then each group can only have one file"
+        }
+    }
+};
+const Template = (args)=>{
+    const mockGroups = [
+        {
+            groupId: "1",
+            groupTitleDescription: "group 1",
+            accept: ".jpg, .jpeg, .png, .pdf, .JPG, .JPEG, .PNG, .PDF"
+        },
+        {
+            groupId: "2",
+            groupTitleDescription: "group 2",
+            accept: ".jpg, .pdf",
+            alertText: "lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam, voluptatum."
+        },
+        {
+            groupId: "3",
+            groupTitleDescription: "group 3",
+            accept: ".html, .pdf"
+        }
+    ];
+    const handleChange = (props)=>{
+        console.log(props, "props");
+    };
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+        className: "mb10",
+        children: [
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_FileLoaderLocalGroup.default, {
+                isSingleGroup: true,
+                onChange: handleChange,
+                className: "file-group",
+                groupsArray: mockGroups,
+                testId: "file-group",
+                ...args
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_FileLoaderLocalGroup.default, {
+                isSingleGroup: true,
+                onChange: handleChange,
+                className: "file-group",
+                groupsArray: mockGroups,
+                testId: "file-group",
+                ...args
+            })
+        ]
+    });
+};
+const FileLoaderLocalTemplate = Template.bind({});
+FileLoaderLocalTemplate.args = {
+};

package/dist/src/Atomic/FormElements/FormattedRawSSN/FormattedRawSSN.js

@@ -0,0 +1,165 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _reactfeather = require("react-feather");
+const _utils = require("../../../Functions/utils");
+const _InputMask3 = /*#__PURE__*/ _interop_require_default(require("../InputMask3/InputMask3"));
+require("./FormattedRawSSN.scss");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const DEFAULT_SSN_MASK = "DDD-DD-DDDD";
+const SIGNIFICANT_CHARACTERS = [
+    "D"
+];
+const FormattedRawSSN = ({ value = "", onChange: onChangeProp = ()=>{}, testId = "formatted-raw-ssn", // ! ВСЕ "пляшет" от fullSnnMask и significantChars
+// Маска для полного snn (технически ограничений нет, НО нужно передавать то, что понимает InputMask3)
+fullSnnMask = DEFAULT_SSN_MASK, // Значащие символы в fullSnnMask
+// Технически ограничений нет, НО нужно передавать
+//    - массив ОДИНОЧНЫХ символов
+//    - массив тех символов, которые правильно трактуются в InputMask3 (смотри InputMask3/config)
+significantChars = SIGNIFICANT_CHARACTERS, // Символ для маскировки
+maskChar = "*", // Инициализационное значение (сразу скрывать или нет)
+isHiddenDefault = true, // Максимальное значение ВВОДИМЫХ цифр
+maxLen = 9, // Сколько из ПЕРВЫХ вводимых нужно прятать при включении мода маскировки
+countOfFirstDigitsToHide = 5, // Статическая часть
+postfix = "", ...args })=>{
+    // ? Будем пользоваться своим (верхним относительно InputMask3) стейтом
+    // ? Это потребует отрисовки триггера "поверх" InputMask3.
+    const [isHidden, setIsHidden] = (0, _react.useState)(isHiddenDefault);
+    const wrapperRef = (0, _react.useRef)(null);
+    const onChange = (value)=>{
+        const newValue = !value && value !== "" ? "" : value === null || value === void 0 ? void 0 : value.toString();
+        onChangeProp(newValue);
+    };
+    // ? Пересчитываем маску с учетом переданного maxLen.
+    // ? Если maxLen меньше количества значащих символов в fullSnnMask, то маска корректно обрежется.
+    // ? Передаем опцию isOnlyMask: false, чтобы получить НЕ только новую маску, а еще и статистику.
+    // ? В этом случае приходит объект формата: { mask, countOfSignificantChars, countOfNotSignificantChars }
+    const infoAboutMask = (0, _utils.getLimitedMask)({
+        mask: fullSnnMask,
+        significantChars: significantChars,
+        limit: maxLen,
+        isOnlyMask: false
+    });
+    // ? Расчитываем ИНДЕКС крайнего символа части маски, которая подлежит скрытию,
+    // ? исходя из countOfFirstDigitsToHide
+    const maxHiddenIndex = (()=>{
+        // если не приводится к числу или ноль (передавать ноль лишено смысла)
+        if (isNaN(Number(countOfFirstDigitsToHide)) || !Number(countOfFirstDigitsToHide)) return -1;
+        // если больше чем значимых символов
+        if (countOfFirstDigitsToHide > infoAboutMask.countOfSignificantChars) return infoAboutMask.mask.length;
+        // ? Для расчетов получаем дополнительно корректно "обрезанную" маску (до уровня скрываемой части)
+        // ? на основе ранее полученной "обрезанной" по maxLen. Нам нужна НЕ сама маска, а статистика по ней.
+        // ? В частности - количество "незначащих" символов содержащихся в скрываемой части
+        const infoAboutMaskOfHidden = (0, _utils.getLimitedMask)({
+            mask: infoAboutMask.mask,
+            significantChars: significantChars,
+            limit: countOfFirstDigitsToHide,
+            isOnlyMask: false
+        });
+        // ? Для InputMask3 maxHiddenIndex должен быть передан относительно длины ВСЕЙ применяемой маски (наша "обрезанная" по maxLen).
+        // ? Поэтому к количеству "скрываемых" символов добавляем количество "незначащих", входящих в скрываемую часть маски.
+        // ? Т.к. расчитываем НЕ длинну, а индекс - отнимаем 1
+        return countOfFirstDigitsToHide + infoAboutMaskOfHidden.countOfNotSignificantChars - 1;
+    })();
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+        "data-testid": testId,
+        className: "formatted-raw-ssn",
+        ref: wrapperRef,
+        children: [
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_InputMask3.default, {
+                ...args,
+                value: value,
+                onChange: onChange,
+                testId: `formattedRawSNN--input--key-${testId}`,
+                maskPattern: infoAboutMask.mask,
+                maskPlaceholder: "X",
+                focusSelector: "input",
+                isNumericMobileKeyboard: true,
+                blinkErrors: true,
+                showErrors: false,
+                withHiddenMode: true,
+                isValueHiddenDefault: isHiddenDefault,
+                hiddenChar: maskChar,
+                maxHiddenIndex: maxHiddenIndex,
+                isHide: isHidden
+            }),
+            postfix && /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+                className: "formatted-raw-ssn-postfix",
+                onClick: ()=>{
+                    var _wrapperRef_current_querySelector, _wrapperRef_current;
+                    return wrapperRef === null || wrapperRef === void 0 ? void 0 : (_wrapperRef_current = wrapperRef.current) === null || _wrapperRef_current === void 0 ? void 0 : (_wrapperRef_current_querySelector = _wrapperRef_current.querySelector("input")) === null || _wrapperRef_current_querySelector === void 0 ? void 0 : _wrapperRef_current_querySelector.focus();
+                },
+                children: postfix
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsxs)("span", {
+                className: "formatted-raw-ssn-eye-holder",
+                onClick: ()=>setIsHidden(!isHidden),
+                children: [
+                    " ",
+                    isHidden ? /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.Eye, {
+                        strokeWidth: 1,
+                        className: "password-icon"
+                    }) : /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.EyeOff, {
+                        strokeWidth: 1,
+                        className: "password-icon"
+                    })
+                ]
+            })
+        ]
+    });
+};
+const _default = FormattedRawSSN;

package/dist/src/Atomic/FormElements/FormattedRawSSN/FormattedRawSSN.stories.js

@@ -0,0 +1,107 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    FormattedRawSSNTemplate: function() {
+        return FormattedRawSSNTemplate;
+    },
+    default: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _FormattedRawSSN = /*#__PURE__*/ _interop_require_default(require("./FormattedRawSSN"));
+require("../../../../../scss/main.scss");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+global.lng = 'en';
+const _default = {
+    title: 'Form Elements/FormattedRawSSN',
+    component: _FormattedRawSSN.default,
+    argTypes: {
+        onChange: {
+            action: 'onChange'
+        },
+        isHiddenDefault: {
+            control: 'boolean'
+        }
+    }
+};
+const Template = (args)=>{
+    const { value: initialValue, ...restArgs } = args;
+    const [value, setValue] = (0, _react.useState)(initialValue || '');
+    const onChange = (newValue)=>{
+        setValue(newValue);
+        console.log(newValue);
+    };
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_FormattedRawSSN.default, {
+        ...restArgs,
+        value: value,
+        onChange: onChange
+    });
+};
+const FormattedRawSSNTemplate = Template.bind({});
+FormattedRawSSNTemplate.args = {
+    value: '012345678',
+    fullSnnMask: 'DDD-DD-DDDD',
+    significantChars: [
+        'D'
+    ],
+    maskChar: '*',
+    isHiddenDefault: true,
+    maxLen: 5,
+    countOfFirstDigitsToHide: 5,
+    postfix: '-1111'
+};