krl-alfred 1.79.2 → 1.79.4

package/dist/components/DescriptionCard/DescriptionCard.js

@@ -23,8 +23,8 @@ var AccordionItem_1 = __importDefault(require("./AccordionItem"));
 var Button_1 = __importDefault(require("./../Button"));
 var DescriptionCard = function (_a) {
     var _b = _a.title, title = _b === void 0 ? props_1.DescriptionCardDefault.title : _b, _c = _a.headerButtonText, headerButtonText = _c === void 0 ? props_1.DescriptionCardDefault.headerButtonText : _c, _d = _a.hasHeaderDropdown, hasHeaderDropdown = _d === void 0 ? props_1.DescriptionCardDefault.hasHeaderDropdown : _d, _e = _a.list, list = _e === void 0 ? props_1.DescriptionCardDefault.list : _e, _f = _a.hasBadge, hasBadge = _f === void 0 ? props_1.DescriptionCardDefault.hasBadge : _f, _g = _a.badgeText, badgeText = _g === void 0 ? props_1.DescriptionCardDefault.badgeText : _g, _h = _a.hasHeader, hasHeader = _h === void 0 ? props_1.DescriptionCardDefault.hasHeader : _h, _j = _a.hasRounded, hasRounded = _j === void 0 ? props_1.DescriptionCardDefault.hasRounded : _j, _k = _a.hasBorder, hasBorder = _k === void 0 ? props_1.DescriptionCardDefault.hasBorder : _k, _l = _a.headerImage, headerImage = _l === void 0 ? props_1.DescriptionCardDefault.headerImage : _l, _m = _a.dropdownList, dropdownList = _m === void 0 ? props_1.DescriptionCardDefault.dropdownList : _m, _o = _a.dropdownWidth, dropdownWidth = _o === void 0 ? props_1.DescriptionCardDefault.dropdownWidth : _o, _p = _a.accordionList, accordionList = _p === void 0 ? props_1.DescriptionCardDefault.accordionList : _p, _q = _a.boxSize, boxSize = _q === void 0 ? props_1.DescriptionCardDefault.boxSize : _q, _r = _a.hasHeaderButton, hasHeaderButton = _r === void 0 ? props_1.DescriptionCardDefault.hasHeaderButton : _r, _s = _a.hasHeaderButtonWidth, hasHeaderButtonWidth = _s === void 0 ? props_1.DescriptionCardDefault.hasHeaderButtonWidth : _s, headerButtonAction = _a.headerButtonAction;
-    return ((0, jsx_runtime_1.jsxs)(DescriptionCard_styled_1.DescriptionCardStyled, __assign({ "$hasRounded": hasRounded, "$hasBorder": hasBorder }, { children: [hasHeader && ((0, jsx_runtime_1.jsxs)(DescriptionCard_styled_1.DescriptionCardHeaderStyled, __assign({ "$headerImage": headerImage }, { children: [(0, jsx_runtime_1.jsxs)("div", { children: [headerImage && ((0, jsx_runtime_1.jsx)(DescriptionCard_styled_1.HeaderImageWrapperStyled, { children: headerImage })), (0, jsx_runtime_1.jsx)(DescriptionCard_styled_1.HeaderTitleStyled, { children: title }), hasBadge && ((0, jsx_runtime_1.jsx)(DescriptionCard_styled_1.BadgeWrapper, { children: (0, jsx_runtime_1.jsx)(Badges_1.default, { layout: "text", variant: "secondary", title: badgeText }) }))] }), hasHeaderButton && ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)(DescriptionCard_styled_1.DropdownWrapper, { children: [(0, jsx_runtime_1.jsx)(Button_1.default, __assign({ iconStrokeWidth: "2.5px", width: hasHeaderButtonWidth, onClick: headerButtonAction, size: "xsmall", variant: "inverted", icon: hasHeaderDropdown ? "ArrowSmallDown" : null }, { children: headerButtonText })), hasHeaderDropdown && ((0, jsx_runtime_1.jsx)(DescriptionCard_styled_1.SubMenu, { children: (0, jsx_runtime_1.jsx)(OptionMenu_1.default, { hasActiveItem: false, data: dropdownList, rowLength: 20, gridItemWidth: dropdownWidth }) }))] }) }))] }))), (0, jsx_runtime_1.jsx)(DescriptionCard_styled_1.ListStyled, __assign({ "$boxSize": boxSize }, { children: list.map(function (listItem) { return ((0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("strong", __assign({ className: "displayTitle" }, { children: listItem.title })), (0, jsx_runtime_1.jsx)("span", __assign({ className: "displayValue" }, { children: listItem.display || "-" }))] })); }) })), (accordionList === null || accordionList === void 0 ? void 0 : accordionList.length) > 0 && ((0, jsx_runtime_1.jsx)(DescriptionCard_styled_1.AccordionListWrapper, { children: accordionList === null || accordionList === void 0 ? void 0 : accordionList.map(function (item) {
-                    return (0, jsx_runtime_1.jsx)(AccordionItem_1.default, { data: item });
+    return ((0, jsx_runtime_1.jsxs)(DescriptionCard_styled_1.DescriptionCardStyled, __assign({ "$hasRounded": hasRounded, "$hasBorder": hasBorder }, { children: [hasHeader && ((0, jsx_runtime_1.jsxs)(DescriptionCard_styled_1.DescriptionCardHeaderStyled, __assign({ "$headerImage": headerImage }, { children: [(0, jsx_runtime_1.jsxs)("div", { children: [headerImage && ((0, jsx_runtime_1.jsx)(DescriptionCard_styled_1.HeaderImageWrapperStyled, { children: headerImage })), (0, jsx_runtime_1.jsx)(DescriptionCard_styled_1.HeaderTitleStyled, { children: title }), hasBadge && ((0, jsx_runtime_1.jsx)(DescriptionCard_styled_1.BadgeWrapper, { children: (0, jsx_runtime_1.jsx)(Badges_1.default, { layout: "text", variant: "secondary", title: badgeText }) }))] }), hasHeaderButton && ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)(DescriptionCard_styled_1.DropdownWrapper, { children: [(0, jsx_runtime_1.jsx)(Button_1.default, __assign({ iconStrokeWidth: "2.5px", width: hasHeaderButtonWidth, onClick: headerButtonAction, size: "xsmall", variant: "inverted", icon: hasHeaderDropdown ? "ArrowSmallDown" : null }, { children: headerButtonText })), hasHeaderDropdown && ((0, jsx_runtime_1.jsx)(DescriptionCard_styled_1.SubMenu, { children: (0, jsx_runtime_1.jsx)(OptionMenu_1.default, { hasActiveItem: false, data: dropdownList, rowLength: 20, gridItemWidth: dropdownWidth }) }))] }) }))] }))), (0, jsx_runtime_1.jsx)(DescriptionCard_styled_1.ListStyled, __assign({ "$boxSize": boxSize }, { children: list.map(function (listItem, key) { return ((0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("strong", __assign({ className: "displayTitle" }, { children: listItem.title })), (0, jsx_runtime_1.jsx)("span", __assign({ className: "displayValue" }, { children: listItem.display || "-" }))] }, key)); }) })), (accordionList === null || accordionList === void 0 ? void 0 : accordionList.length) > 0 && ((0, jsx_runtime_1.jsx)(DescriptionCard_styled_1.AccordionListWrapper, { children: accordionList === null || accordionList === void 0 ? void 0 : accordionList.map(function (item, key) {
+                    return (0, jsx_runtime_1.jsx)(AccordionItem_1.default, { data: item }, key);
                 }) }))] })));
 };
 exports.default = DescriptionCard;

package/dist/components/DescriptionCard/DescriptionCard.styled.js

@@ -15,7 +15,7 @@ exports.HeaderTitleStyled = styled_components_1.default.strong(templateObject_3
 exports.HeaderImageWrapperStyled = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    display: block;\n    border: 1px solid var(--dark-opacity-5);\n    width: 64px;\n    height: 64px;\n    border-radius: 0.5rem;\n    position: relative;\n    overflow: hidden;\n    margin-right: 1.5rem;\n    *{\n        width: 100%;\n        height: 100%;\n        object-fit: contain;\n        display: block;\n        padding: 0.5rem;\n        box-sizing: border-box;\n    }\n"], ["\n    display: block;\n    border: 1px solid var(--dark-opacity-5);\n    width: 64px;\n    height: 64px;\n    border-radius: 0.5rem;\n    position: relative;\n    overflow: hidden;\n    margin-right: 1.5rem;\n    *{\n        width: 100%;\n        height: 100%;\n        object-fit: contain;\n        display: block;\n        padding: 0.5rem;\n        box-sizing: border-box;\n    }\n"])));
 exports.BadgeWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n    display: block;\n    margin-left: 1.5rem;\n"], ["\n    display: block;\n    margin-left: 1.5rem;\n"])));
 exports.ListStyled = styled_components_1.default.ul(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n    display: grid;\n    grid-template-columns: repeat(", ",1fr);\n    padding: 0;\n    margin: 0;\n    position: relative;\n    &:before{\n        content: \"\";\n        position: absolute;\n        inset: 0;\n        border: 1px solid white;\n        border-radius: inherit;\n        user-select: none;\n        pointer-events: none;\n    }\n    li{\n        display: block;\n        padding: 1.5rem;\n        border-right: 1px solid var(--dark-opacity-10);\n        border-bottom: 1px solid var(--dark-opacity-10);\n        word-break: break-word;\n        &:is(:last-child){\n            border-right: 0;\n        }\n        .displayTitle{\n            display: block;\n            color: var(--dark-opacity-50);\n            font: var(--body-semi-bold-14-17);\n        }\n        .displayValue{\n            display: block;\n            margin-top: 0.5rem;\n            color: var(--dark);\n            font: var(--body-semi-bold-14-17);\n        }\n    }\n"], ["\n    display: grid;\n    grid-template-columns: repeat(", ",1fr);\n    padding: 0;\n    margin: 0;\n    position: relative;\n    &:before{\n        content: \"\";\n        position: absolute;\n        inset: 0;\n        border: 1px solid white;\n        border-radius: inherit;\n        user-select: none;\n        pointer-events: none;\n    }\n    li{\n        display: block;\n        padding: 1.5rem;\n        border-right: 1px solid var(--dark-opacity-10);\n        border-bottom: 1px solid var(--dark-opacity-10);\n        word-break: break-word;\n        &:is(:last-child){\n            border-right: 0;\n        }\n        .displayTitle{\n            display: block;\n            color: var(--dark-opacity-50);\n            font: var(--body-semi-bold-14-17);\n        }\n        .displayValue{\n            display: block;\n            margin-top: 0.5rem;\n            color: var(--dark);\n            font: var(--body-semi-bold-14-17);\n        }\n    }\n"])), function (props) { return props.$boxSize; });
-exports.DropdownWrapper = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n    display: block;\n    position: relative;\n\n    &:hover{\n        div{\n            opacity: 1;\n            visibility: visible;\n            transform: translateY(0);\n            transition-delay: 0.2s;\n        }\n        button{\n            svg{\n                transform: rotate(180deg);\n            }\n        }\n    }\n"], ["\n    display: block;\n    position: relative;\n\n    &:hover{\n        div{\n            opacity: 1;\n            visibility: visible;\n            transform: translateY(0);\n            transition-delay: 0.2s;\n        }\n        button{\n            svg{\n                transform: rotate(180deg);\n            }\n        }\n    }\n"])));
+exports.DropdownWrapper = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n    display: block;\n    position: relative;\n\n    &:hover{\n        > div{\n            opacity: 1;\n            visibility: visible;\n            transform: translateY(0);\n            transition-delay: 0.2s;\n        }\n        button{\n            svg{\n                transform: rotate(180deg);\n            }\n        }\n    }\n"], ["\n    display: block;\n    position: relative;\n\n    &:hover{\n        > div{\n            opacity: 1;\n            visibility: visible;\n            transform: translateY(0);\n            transition-delay: 0.2s;\n        }\n        button{\n            svg{\n                transform: rotate(180deg);\n            }\n        }\n    }\n"])));
 exports.SubMenu = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n    position: absolute;\n    right: 0;\n    top: 100%;\n    transition: all 0.2s ease-in-out;\n    opacity: 0;\n    visibility: hidden;\n    transform: translateY(10px);\n    transition-delay: 0s;\n    padding: 0;\n    margin: 0;\n    z-index: 5;\n    > ul{\n        margin: 0.5rem 0 0 0;\n    }\n"], ["\n    position: absolute;\n    right: 0;\n    top: 100%;\n    transition: all 0.2s ease-in-out;\n    opacity: 0;\n    visibility: hidden;\n    transform: translateY(10px);\n    transition-delay: 0s;\n    padding: 0;\n    margin: 0;\n    z-index: 5;\n    > ul{\n        margin: 0.5rem 0 0 0;\n    }\n"])));
 exports.AccordionListWrapper = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n\n"], ["\n\n"])));
 exports.AccordionItemWrapper = styled_components_1.default.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n    border-top: 1px solid var(--dark-opacity-10);\n"], ["\n    border-top: 1px solid var(--dark-opacity-10);\n"])));

package/dist/components/DescriptionCard/stories/DescriptionCard.stories.js

@@ -19,10 +19,9 @@ exports.Default = {
         hasBadge: false,
         badgeText: "Badge text",
         hasHeaderDropdown: false,
-        headerDropdownText: "Header dropdown text",
+        headerButtonText: "Header dropdown text",
         list: descriptionList_json_1.default,
         listHeader: null,
-        //footer: <div>test</div>,
         hasHeader: true,
         hasRounded: true,
         hasBorder: true,

package/dist/components/Input/Input.js

@@ -54,6 +54,7 @@ var Input = function (_a) {
     }, [type]);
     (0, react_1.useEffect)(function () {
         setInputValue(value);
+        setStartDate(value ? new Date(value) : null);
     }, [value]);
     (0, react_1.useEffect)(function () {
         if (alert) {
@@ -80,7 +81,8 @@ var Input = function (_a) {
         inputRef.current.value = null;
         setStartDate(null);
         onChange(null);
-        onClear();
+        if (onClear)
+            onClear();
     };
     return (0, jsx_runtime_1.jsxs)(Input_styled_1.Container, __assign({ "$width": width }, { children: [label && ((0, jsx_runtime_1.jsxs)("div", __assign({ className: (0, classnames_1.default)("top", (_b = {}, _b["justify-between"] = customLinkText, _b)) }, { children: [(0, jsx_runtime_1.jsx)("label", __assign({ htmlFor: id }, { children: label })), customLinkText && (0, jsx_runtime_1.jsx)(TextLink_1.default, __assign({}, (customLinkHref && { href: customLinkHref }), { onClick: onCustomLinkClick }, { children: customLinkText }))] }))), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "input" }, { children: [(mask && format) ? ((0, jsx_runtime_1.jsx)(react_number_format_1.PatternFormat, __assign({ "$hasError": hasError, disabled: disabled, onChange: onChange, name: name, placeholder: placeholder, readOnly: readOnly, autoFocus: autoFocus, value: inputValue }, other, { format: format, mask: mask, customInput: Input_styled_1.InputStyled, id: id })))
                         : type === 'date' ? ((0, jsx_runtime_1.jsx)(Input_styled_1.DatePickerWrapperStyled, { children: (0, jsx_runtime_1.jsx)(react_datepicker_1.default, { placeholderText: placeholder, disabled: disabled, name: name, value: value, readOnly: readOnly, autoFocus: autoFocus, onChange: function (date, event) {
@@ -96,6 +98,6 @@ var Input = function (_a) {
                                 } }) })) : ((0, jsx_runtime_1.jsx)(Input_styled_1.InputStyled, __assign({ ref: inputRef, type: inputType, "$hasError": hasError, disabled: disabled, onChange: function (e) {
                                 onChange(e);
                                 setInputValue(e.currentTarget.value);
-                            }, name: name, placeholder: placeholder, readOnly: readOnly, autoFocus: autoFocus, value: inputValue, id: id }, other))), (isClearable && inputValue) ? ((0, jsx_runtime_1.jsx)("div", __assign({ onClick: handleClearValue, className: "removeIcon" }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { color: "var(--dark)", name: "Close", width: "24px", height: "24px", strokeWidth: "2.5px" }) }))) : (type === 'password' ? ((0, jsx_runtime_1.jsx)("div", __assign({ onClick: toggleInputType, className: "inputIcon" }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { color: "var(--dark-opacity-50)", name: inputType === 'password' ? 'Show' : 'Hide' }) }))) : (type === 'date' ? ((0, jsx_runtime_1.jsx)("div", __assign({ className: "inputIcon" }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { color: "var(--grey-50)", name: "Calendar" }) }))) : (hasCopyButton && ((0, jsx_runtime_1.jsx)("div", __assign({ onClick: copyToClipboard, className: "inputIcon" }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { color: "var(--primary)", name: 'Copy' }) })))))), infoText && ((0, jsx_runtime_1.jsx)("div", __assign({ className: "inputIcon" }, { children: (0, jsx_runtime_1.jsx)(Tooltip_1.default, __assign({ iconStrokeWidth: "2px", popupSize: "small", position: "topRight", popupWidth: "160px", popupRight: "-10px", iconWidth: "24px", iconHeight: "24px" }, { children: (0, jsx_runtime_1.jsx)("div", { className: "popupText", dangerouslySetInnerHTML: { __html: infoText } }) })) }))), (0, jsx_runtime_1.jsx)(Input_styled_1.AlertStyled, __assign({ "$visible": alert }, { children: t('copied') }))] })), hasError && (0, jsx_runtime_1.jsxs)("div", __assign({ className: "error" }, { children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { name: "ErrorIcon" }), (0, jsx_runtime_1.jsx)("p", { children: errorMessage })] }))] }));
+                            }, name: name, placeholder: placeholder, readOnly: readOnly, autoFocus: autoFocus, value: inputValue, id: id }, other))), (isClearable && inputValue) ? ((0, jsx_runtime_1.jsx)("div", __assign({ onClick: handleClearValue, className: "removeIcon" }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { color: "var(--dark)", name: "Close", width: "24px", height: "24px", strokeWidth: "2.5px" }) }))) : (type === 'password' ? ((0, jsx_runtime_1.jsx)("div", __assign({ onClick: toggleInputType, className: "inputIcon" }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { color: "var(--dark-opacity-50)", name: inputType === 'password' ? 'Show' : 'Hide' }) }))) : (type === 'date' ? ((0, jsx_runtime_1.jsx)("div", __assign({ className: "inputIcon" }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { color: "var(--grey-50)", name: "Calendar" }) }))) : (hasCopyButton && ((0, jsx_runtime_1.jsx)("div", __assign({ onClick: copyToClipboard, className: "inputIcon" }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { color: "var(--primary)", name: 'Copy' }) })))))), infoText && ((0, jsx_runtime_1.jsx)("div", __assign({ className: "inputIcon hasNoBg" }, { children: (0, jsx_runtime_1.jsx)(Tooltip_1.default, __assign({ iconStrokeWidth: "2px", popupSize: "small", position: "topRight", popupWidth: "160px", popupRight: "-10px", iconWidth: "24px", iconHeight: "24px" }, { children: (0, jsx_runtime_1.jsx)("div", { className: "popupText", dangerouslySetInnerHTML: { __html: infoText } }) })) }))), (0, jsx_runtime_1.jsx)(Input_styled_1.AlertStyled, __assign({ "$visible": alert }, { children: t('copied') }))] })), hasError && (0, jsx_runtime_1.jsxs)("div", __assign({ className: "error" }, { children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { name: "ErrorIcon" }), (0, jsx_runtime_1.jsx)("p", { children: errorMessage })] }))] }));
 };
 exports.default = Input;

package/dist/components/Input/Input.styled.js

@@ -10,7 +10,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.DatePickerWrapperStyled = exports.InputStyled = exports.Container = exports.AlertStyled = void 0;
 var styled_components_1 = __importDefault(require("styled-components"));
 exports.AlertStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: absolute;\n  right: 8px;\n  top: -20px;\n  height: 28px;\n  border-radius: 0.5rem;\n  background-color: white;\n  box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 1rem;\n  user-select: none;\n  pointer-events: none;\n  transition: opacity .4s ease;\n  opacity: ", ";\n  font:var(--caption-medium-10-12);\n"], ["\n  position: absolute;\n  right: 8px;\n  top: -20px;\n  height: 28px;\n  border-radius: 0.5rem;\n  background-color: white;\n  box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 1rem;\n  user-select: none;\n  pointer-events: none;\n  transition: opacity .4s ease;\n  opacity: ", ";\n  font:var(--caption-medium-10-12);\n"])), function (props) { return props.$visible ? '1' : '0'; });
-exports.Container = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  width: ", ";\n\n  .top {\n    display: flex;\n    margin-bottom: 16px;\n    font: var(--caption-bold-12-15);\n    &.justify-between {\n      justify-content: space-between;\n    }\n\n    label {\n      margin: 0;\n      color: var(--dark-opacity-50);\n      display: block;\n    }\n\n    /*a {\n      margin: 0;\n      color: var(--primary);\n      text-decoration: none;\n      cursor: pointer;\n      &:hover,:focus,:active{\n        color: var(--primary-hover) !important;\n      }\n    }*/\n  }\n\n  .input {\n    position: relative;\n\n    .inputIcon {\n      position: absolute;\n      width: 24px;\n      height: 24px;\n      top: 16px;\n      right: 16px;\n      cursor: pointer;\n      &:hover{\n        background-color: var(--primary-opacity-5);\n      }\n    }\n  .removeIcon {\n      position: absolute;\n      top: 17px;\n      right: 16px;\n      cursor: pointer;\n  }\n    .popupText{\n      font: var(--caption-semi-bold-11-13);\n        text-align: center;\n    }\n  }\n\n  .error {\n    display: flex;\n    align-items: center;\n    margin-top: 8px;\n    color: var(--red);\n    svg {\n      margin-right: 8px;\n    }\n\n    p {\n      margin: 0;\n      font:var(--caption-semi-bold-11-13);\n    }\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n  width: ", ";\n\n  .top {\n    display: flex;\n    margin-bottom: 16px;\n    font: var(--caption-bold-12-15);\n    &.justify-between {\n      justify-content: space-between;\n    }\n\n    label {\n      margin: 0;\n      color: var(--dark-opacity-50);\n      display: block;\n    }\n\n    /*a {\n      margin: 0;\n      color: var(--primary);\n      text-decoration: none;\n      cursor: pointer;\n      &:hover,:focus,:active{\n        color: var(--primary-hover) !important;\n      }\n    }*/\n  }\n\n  .input {\n    position: relative;\n\n    .inputIcon {\n      position: absolute;\n      width: 24px;\n      height: 24px;\n      top: 16px;\n      right: 16px;\n      cursor: pointer;\n      &:hover{\n        background-color: var(--primary-opacity-5);\n      }\n    }\n  .removeIcon {\n      position: absolute;\n      top: 17px;\n      right: 16px;\n      cursor: pointer;\n  }\n    .popupText{\n      font: var(--caption-semi-bold-11-13);\n        text-align: center;\n    }\n  }\n\n  .error {\n    display: flex;\n    align-items: center;\n    margin-top: 8px;\n    color: var(--red);\n    svg {\n      margin-right: 8px;\n    }\n\n    p {\n      margin: 0;\n      font:var(--caption-semi-bold-11-13);\n    }\n  }\n"])), function (props) { return props.$width || '370px'; });
+exports.Container = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  width: ", ";\n\n  .top {\n    display: flex;\n    margin-bottom: 16px;\n    font: var(--caption-bold-12-15);\n    &.justify-between {\n      justify-content: space-between;\n    }\n\n    label {\n      margin: 0;\n      color: var(--dark-opacity-50);\n      display: block;\n    }\n\n    /*a {\n      margin: 0;\n      color: var(--primary);\n      text-decoration: none;\n      cursor: pointer;\n      &:hover,:focus,:active{\n        color: var(--primary-hover) !important;\n      }\n    }*/\n  }\n\n  .input {\n    position: relative;\n\n    .inputIcon {\n      position: absolute;\n      width: 24px;\n      height: 24px;\n      top: 16px;\n      right: 16px;\n      cursor: pointer;\n      &:not(.hasNoBg){\n          &:hover{\n              background-color: var(--primary-opacity-5);\n          }\n      }\n    }\n  .removeIcon {\n      position: absolute;\n      top: 17px;\n      right: 16px;\n      cursor: pointer;\n  }\n    .popupText{\n      font: var(--caption-semi-bold-11-13);\n        text-align: center;\n    }\n  }\n\n  .error {\n    display: flex;\n    align-items: center;\n    margin-top: 8px;\n    color: var(--red);\n    svg {\n      margin-right: 8px;\n    }\n\n    p {\n      margin: 0;\n      font:var(--caption-semi-bold-11-13);\n    }\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n  width: ", ";\n\n  .top {\n    display: flex;\n    margin-bottom: 16px;\n    font: var(--caption-bold-12-15);\n    &.justify-between {\n      justify-content: space-between;\n    }\n\n    label {\n      margin: 0;\n      color: var(--dark-opacity-50);\n      display: block;\n    }\n\n    /*a {\n      margin: 0;\n      color: var(--primary);\n      text-decoration: none;\n      cursor: pointer;\n      &:hover,:focus,:active{\n        color: var(--primary-hover) !important;\n      }\n    }*/\n  }\n\n  .input {\n    position: relative;\n\n    .inputIcon {\n      position: absolute;\n      width: 24px;\n      height: 24px;\n      top: 16px;\n      right: 16px;\n      cursor: pointer;\n      &:not(.hasNoBg){\n          &:hover{\n              background-color: var(--primary-opacity-5);\n          }\n      }\n    }\n  .removeIcon {\n      position: absolute;\n      top: 17px;\n      right: 16px;\n      cursor: pointer;\n  }\n    .popupText{\n      font: var(--caption-semi-bold-11-13);\n        text-align: center;\n    }\n  }\n\n  .error {\n    display: flex;\n    align-items: center;\n    margin-top: 8px;\n    color: var(--red);\n    svg {\n      margin-right: 8px;\n    }\n\n    p {\n      margin: 0;\n      font:var(--caption-semi-bold-11-13);\n    }\n  }\n"])), function (props) { return props.$width || '370px'; });
 exports.InputStyled = styled_components_1.default.input(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  box-sizing: border-box;\n  width: 100%;\n  height: 56px;\n  background: ", ";\n  border-radius: 0.5rem;\n  border: ", ";\n  padding: ", ";\n  color: ", ";\n  font: var(--body-semi-bold-14-17);\n  outline: none;\n  user-select: ", ";\n  pointer-events: ", ";\n\n  &::placeholder {\n    color: ", ";\n  }\n\n  &:focus {\n    padding: 18.5px 23px;\n    border: 2px solid ", ";\n    color: ", ";\n    background: white;\n  }\n  &:is([disabled]){\n    color: var(--dark-opacity-25);\n  }\n\n"], ["\n  box-sizing: border-box;\n  width: 100%;\n  height: 56px;\n  background: ", ";\n  border-radius: 0.5rem;\n  border: ", ";\n  padding: ", ";\n  color: ", ";\n  font: var(--body-semi-bold-14-17);\n  outline: none;\n  user-select: ", ";\n  pointer-events: ", ";\n\n  &::placeholder {\n    color: ", ";\n  }\n\n  &:focus {\n    padding: 18.5px 23px;\n    border: 2px solid ", ";\n    color: ", ";\n    background: white;\n  }\n  &:is([disabled]){\n    color: var(--dark-opacity-25);\n  }\n\n"])), function (props) { return props.disabled ? 'var(--dark-opacity-5)' : (props.$hasError ? 'white' : 'var(--dark-opacity-3)'); }, function (props) { return props.$hasError ? '2px solid var(--red)' : '1px solid var(--dark-opacity-10)'; }, function (props) { return props.$hasError ? '18.5px 23px' : '19.5px 24px'; }, function (props) { return props.$hasError ? 'var(--red)' : 'var(--dark)'; }, function (props) { return props.readOnly ? 'none' : 'initial'; }, function (props) { return props.readOnly ? 'none' : 'initial'; }, function (props) { return props.$hasError ? 'var(--red)' : 'var(--dark-opacity-50)'; }, function (props) { return props.$hasError ? 'var(--red)' : 'var(--primary)'; }, function (props) { return props.$hasError ? 'var(--red)' : 'var(--dark)'; });
 exports.DatePickerWrapperStyled = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  .react-datepicker-wrapper{\n    display: block;\n  }\n  .react-datepicker-popper {\n    transform: none !important;\n    top: 100% !important;\n    width: 100%;\n    .react-datepicker__triangle{\n      display: none !important;\n    }\n    .react-datepicker{\n      font-family: inherit !important;\n      width: 100%;\n      border: none !important;\n      border-radius: 0 0 0.5rem 0.5rem!important;\n      box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n      .react-datepicker__day--keyboard-selected, .react-datepicker__month-text--keyboard-selected, .react-datepicker__quarter-text--keyboard-selected, .react-datepicker__year-text--keyboard-selected{\n        background-color: transparent !important;\n        color: inherit !important;\n      }\n      .react-datepicker__day-name, .react-datepicker__day, .react-datepicker__time-name{\n        margin: 0 !important;\n        width: 1.5rem !important;\n        height: 1.5rem !important;\n        line-height: 1.5rem !important;\n      }\n      .react-datepicker__navigation{\n        position: static;\n        border-radius: 0.5rem;\n        transition:all .2s ease;\n        &:hover{\n          background-color: white;\n          box-shadow: 0 0 16px 0 var(--dark-opacity-10);\n          z-index: 2;\n        }\n      }\n      .react-datepicker__month-container{\n        float: none !important;\n        .react-datepicker__header{\n          background-color: white !important;\n          border:none !important;\n          padding: 0 0 0 0 !important;\n          .headerTopContent{\n            display: flex;\n            align-items: center;\n            justify-content: space-between;\n            padding: 1rem 1.5rem;\n            .react-datepicker__navigation{\n              width: 1.5rem;\n              height: 1.5rem;\n            }\n            .leftButtons, .rightButtons{\n              display: flex;\n              align-items: center;\n              justify-content: space-between;\n              color: var(--dark-opacity-50);\n              svg{\n                color: var(--dark-opacity-50);\n              }\n            }\n          }\n          .react-datepicker__current-month{\n            display: block !important;\n          }\n        }\n        .react-datepicker__month{\n          margin: 0 1.5rem 1rem 1.5rem !important;\n        }\n        .react-datepicker__day-names{\n          display: flex;\n          align-items: center;\n          justify-content: space-between;\n          margin: 0.5rem 1.5rem !important;\n          .react-datepicker__day-name{\n            color: var(--grey-50);\n            font: var(--body-medium-13-16);\n          }\n        }\n        .react-datepicker__week{\n          display: flex;\n          align-items: center;\n          justify-content: space-between;\n          + .react-datepicker__week{\n            margin-top: 0.5rem;\n          }\n          .react-datepicker__day{\n            font: var(--caption-bold-12-15);\n            color: var(--dark);\n            outline: none !important;\n            &:is(.react-datepicker__day--selected), &:hover{\n              border-radius: 0.25rem;\n              background-color: var(--primary-opacity-10) !important;\n              color: var(--primary) !important;\n            }\n            &:is(.react-datepicker__day--today){\n              color: var(--primary) !important;\n            }\n            &:is(.react-datepicker__day--outside-month){\n              color: var(--grey-50);\n            }\n          }\n        }\n      }\n    }\n  }\n  input{\n    &:is(.react-datepicker-ignore-onclickoutside){\n      border-bottom-left-radius: 0;\n      border-bottom-right-radius: 0;\n    }\n  }\n\n"], ["\n  .react-datepicker-wrapper{\n    display: block;\n  }\n  .react-datepicker-popper {\n    transform: none !important;\n    top: 100% !important;\n    width: 100%;\n    .react-datepicker__triangle{\n      display: none !important;\n    }\n    .react-datepicker{\n      font-family: inherit !important;\n      width: 100%;\n      border: none !important;\n      border-radius: 0 0 0.5rem 0.5rem!important;\n      box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n      .react-datepicker__day--keyboard-selected, .react-datepicker__month-text--keyboard-selected, .react-datepicker__quarter-text--keyboard-selected, .react-datepicker__year-text--keyboard-selected{\n        background-color: transparent !important;\n        color: inherit !important;\n      }\n      .react-datepicker__day-name, .react-datepicker__day, .react-datepicker__time-name{\n        margin: 0 !important;\n        width: 1.5rem !important;\n        height: 1.5rem !important;\n        line-height: 1.5rem !important;\n      }\n      .react-datepicker__navigation{\n        position: static;\n        border-radius: 0.5rem;\n        transition:all .2s ease;\n        &:hover{\n          background-color: white;\n          box-shadow: 0 0 16px 0 var(--dark-opacity-10);\n          z-index: 2;\n        }\n      }\n      .react-datepicker__month-container{\n        float: none !important;\n        .react-datepicker__header{\n          background-color: white !important;\n          border:none !important;\n          padding: 0 0 0 0 !important;\n          .headerTopContent{\n            display: flex;\n            align-items: center;\n            justify-content: space-between;\n            padding: 1rem 1.5rem;\n            .react-datepicker__navigation{\n              width: 1.5rem;\n              height: 1.5rem;\n            }\n            .leftButtons, .rightButtons{\n              display: flex;\n              align-items: center;\n              justify-content: space-between;\n              color: var(--dark-opacity-50);\n              svg{\n                color: var(--dark-opacity-50);\n              }\n            }\n          }\n          .react-datepicker__current-month{\n            display: block !important;\n          }\n        }\n        .react-datepicker__month{\n          margin: 0 1.5rem 1rem 1.5rem !important;\n        }\n        .react-datepicker__day-names{\n          display: flex;\n          align-items: center;\n          justify-content: space-between;\n          margin: 0.5rem 1.5rem !important;\n          .react-datepicker__day-name{\n            color: var(--grey-50);\n            font: var(--body-medium-13-16);\n          }\n        }\n        .react-datepicker__week{\n          display: flex;\n          align-items: center;\n          justify-content: space-between;\n          + .react-datepicker__week{\n            margin-top: 0.5rem;\n          }\n          .react-datepicker__day{\n            font: var(--caption-bold-12-15);\n            color: var(--dark);\n            outline: none !important;\n            &:is(.react-datepicker__day--selected), &:hover{\n              border-radius: 0.25rem;\n              background-color: var(--primary-opacity-10) !important;\n              color: var(--primary) !important;\n            }\n            &:is(.react-datepicker__day--today){\n              color: var(--primary) !important;\n            }\n            &:is(.react-datepicker__day--outside-month){\n              color: var(--grey-50);\n            }\n          }\n        }\n      }\n    }\n  }\n  input{\n    &:is(.react-datepicker-ignore-onclickoutside){\n      border-bottom-left-radius: 0;\n      border-bottom-right-radius: 0;\n    }\n  }\n\n"])));
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/dist/components/Table/Table.js

@@ -54,7 +54,6 @@ var Table = function (_a) {
     if (!emptyText) {
         emptyText = t("NO_OPTIONS_FOUND");
     }
-    return ((0, jsx_runtime_1.jsx)(Table_styled_1.TableStyled, { children: (0, jsx_runtime_1.jsx)(rc_table_1.default, { columns: tableColumns, data: tableData, emptyText: (0, jsx_runtime_1.jsx)(Table_styled_1.EmptyStyled, { children: emptyText }), className: tableData.length <= 0 && "rc-table-empty" }) }));
+    return ((0, jsx_runtime_1.jsx)(Table_styled_1.TableStyled, { children: (0, jsx_runtime_1.jsx)(rc_table_1.default, { columns: tableColumns, data: tableData, emptyText: (0, jsx_runtime_1.jsx)(Table_styled_1.EmptyStyled, { children: emptyText }), className: (tableData === null || tableData === void 0 ? void 0 : tableData.length) <= 0 && "rc-table-empty" }) }));
 };
-Table.defaultProps = {};
 exports.default = Table;

package/dist/components/TextLink/TextLink.js

@@ -26,11 +26,24 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
 var props_1 = require("./props");
 var TextLink_styled_1 = require("./TextLink.styled");
 var Icon_1 = __importDefault(require("../Icon/Icon"));
 var TextLink = function (_a) {
-    var _b = _a.iconWidth, iconWidth = _b === void 0 ? props_1.TextLinkDefault.iconWidth : _b, _c = _a.iconHeight, iconHeight = _c === void 0 ? props_1.TextLinkDefault.iconHeight : _c, _d = _a.variant, variant = _d === void 0 ? props_1.TextLinkDefault.variant : _d, _e = _a.size, size = _e === void 0 ? props_1.TextLinkDefault.size : _e, _f = _a.iconDirection, iconDirection = _f === void 0 ? props_1.TextLinkDefault.iconDirection : _f, _g = _a.iconStrokeWidth, iconStrokeWidth = _g === void 0 ? props_1.TextLinkDefault.iconStrokeWidth : _g, onClick = _a.onClick, children = _a.children, href = _a.href, target = _a.target, icon = _a.icon, other = __rest(_a, ["iconWidth", "iconHeight", "variant", "size", "iconDirection", "iconStrokeWidth", "onClick", "children", "href", "target", "icon"]);
-    return ((0, jsx_runtime_1.jsx)(TextLink_styled_1.TextLinkStyled, __assign({ "$size": size, "$variant": variant, href: href, target: target, onClick: onClick }, other, { children: (0, jsx_runtime_1.jsxs)(TextLink_styled_1.Inner, __assign({ "$iconDirection": iconDirection }, { children: [icon && ((0, jsx_runtime_1.jsx)(TextLink_styled_1.IconStyled, __assign({ "$iconDirection": iconDirection }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { strokeWidth: iconStrokeWidth, name: icon, width: iconWidth, height: iconHeight }) }))), children] })) })));
+    var _b = _a.iconWidth, iconWidth = _b === void 0 ? props_1.TextLinkDefault.iconWidth : _b, _c = _a.iconHeight, iconHeight = _c === void 0 ? props_1.TextLinkDefault.iconHeight : _c, _d = _a.variant, variant = _d === void 0 ? props_1.TextLinkDefault.variant : _d, _e = _a.size, size = _e === void 0 ? props_1.TextLinkDefault.size : _e, _f = _a.iconDirection, iconDirection = _f === void 0 ? props_1.TextLinkDefault.iconDirection : _f, _g = _a.iconStrokeWidth, iconStrokeWidth = _g === void 0 ? props_1.TextLinkDefault.iconStrokeWidth : _g, _h = _a.alertText, alertText = _h === void 0 ? props_1.TextLinkDefault.alertText : _h, _j = _a.hasAlert, hasAlert = _j === void 0 ? props_1.TextLinkDefault.hasAlert : _j, onClick = _a.onClick, children = _a.children, href = _a.href, target = _a.target, icon = _a.icon, other = __rest(_a, ["iconWidth", "iconHeight", "variant", "size", "iconDirection", "iconStrokeWidth", "alertText", "hasAlert", "onClick", "children", "href", "target", "icon"]);
+    var _k = (0, react_1.useState)(false), showAlert = _k[0], setShowAlert = _k[1];
+    var handleClick = function (e) {
+        onClick(e);
+        if (hasAlert) {
+            setShowAlert(true);
+        }
+    };
+    (0, react_1.useEffect)(function () {
+        if (showAlert) {
+            setTimeout(function () { return setShowAlert(false); }, 1000);
+        }
+    }, [showAlert]);
+    return ((0, jsx_runtime_1.jsxs)(TextLink_styled_1.TextLinkStyled, __assign({ "$size": size, "$variant": variant, href: href, target: target, onClick: handleClick }, other, { children: [(0, jsx_runtime_1.jsxs)(TextLink_styled_1.Inner, __assign({ "$iconDirection": iconDirection }, { children: [icon && ((0, jsx_runtime_1.jsx)(TextLink_styled_1.IconStyled, __assign({ "$iconDirection": iconDirection }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { strokeWidth: iconStrokeWidth, name: icon, width: iconWidth, height: iconHeight }) }))), children] })), showAlert && hasAlert && (0, jsx_runtime_1.jsx)(TextLink_styled_1.AlertStyled, { children: alertText })] })));
 };
 exports.default = TextLink;

package/dist/components/TextLink/TextLink.styled.js

@@ -7,9 +7,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Inner = exports.IconStyled = exports.TextLinkStyled = void 0;
+exports.AlertStyled = exports.Inner = exports.IconStyled = exports.TextLinkStyled = void 0;
 var styled_components_1 = __importDefault(require("styled-components"));
-exports.TextLinkStyled = styled_components_1.default.a(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  color: ", ";\n  font-size: inherit;\n  font-family: inherit;\n  font-weight: inherit;\n  display: inline-block;\n  text-decoration: none;\n  cursor: pointer;\n  vertical-align: middle;\n  padding: ", ";\n  &:hover , :focus , :active {\n    color: ", ";\n  }\n"], ["\n  color: ", ";\n  font-size: inherit;\n  font-family: inherit;\n  font-weight: inherit;\n  display: inline-block;\n  text-decoration: none;\n  cursor: pointer;\n  vertical-align: middle;\n  padding: ", ";\n  &:hover , :focus , :active {\n    color: ", ";\n  }\n"])), function (props) { return props.$variant === "primary" ? "var(--primary)" : "var(--grey-50)"; }, function (props) {
+exports.TextLinkStyled = styled_components_1.default.a(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  color: ", ";\n  font-size: inherit;\n  font-family: inherit;\n  font-weight: inherit;\n  display: inline-block;\n  text-decoration: none;\n  cursor: pointer;\n  vertical-align: middle;\n  padding: ", ";\n  &:hover , :focus , :active {\n    color: ", ";\n  }\n"], ["\n  position: relative;\n  color: ", ";\n  font-size: inherit;\n  font-family: inherit;\n  font-weight: inherit;\n  display: inline-block;\n  text-decoration: none;\n  cursor: pointer;\n  vertical-align: middle;\n  padding: ", ";\n  &:hover , :focus , :active {\n    color: ", ";\n  }\n"])), function (props) { return props.$variant === "primary" ? "var(--primary)" : "var(--grey-50)"; }, function (props) {
     switch (props.$size) {
         case 'small':
             return "0";
@@ -21,4 +21,5 @@ exports.TextLinkStyled = styled_components_1.default.a(templateObject_1 || (temp
 }, function (props) { return props.$variant === "primary" ? "var(--primary-hover)" : "var(--grey-50)"; });
 exports.IconStyled = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    ", ";\n"], ["\n    ", ";\n"])), function (props) { return props.$iconDirection === 'right' ? "margin-left: 0.5rem;" : 'margin-right: 0.5rem;'; });
 exports.Inner = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  flex-direction:", ";\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  flex-direction:", ";\n"])), function (props) { return props.$iconDirection === 'right' ? "row-reverse" : 'row'; });
-var templateObject_1, templateObject_2, templateObject_3;
+exports.AlertStyled = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  position: absolute;\n  right: 0px;\n  top: calc(100% + 6px);\n  height: 28px;\n  border-radius: 0.5rem;\n  background-color: white;\n  box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 1rem;\n  user-select: none;\n  pointer-events: none;\n  transition: opacity .4s ease;\n  font:var(--caption-medium-10-12);\n  color: var(--dark);\n"], ["\n  position: absolute;\n  right: 0px;\n  top: calc(100% + 6px);\n  height: 28px;\n  border-radius: 0.5rem;\n  background-color: white;\n  box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 1rem;\n  user-select: none;\n  pointer-events: none;\n  transition: opacity .4s ease;\n  font:var(--caption-medium-10-12);\n  color: var(--dark);\n"])));
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/dist/components/TextLink/props.js

@@ -13,4 +13,6 @@ exports.TextLinkDefault = {
     size: "small",
     iconDirection: "left",
     iconStrokeWidth: "2px",
+    alertText: "Alert",
+    hasAlert: false
 };

package/dist/components/TextLink/stories/TextLink.stories.js

@@ -24,5 +24,7 @@ exports.Default = {
         variant: "primary",
         size: "small",
         iconDirection: "left",
+        hasAlert: false,
+        alertText: "Kopyalandı",
     },
 };

package/dist/components/Toast/Toast.js

@@ -37,12 +37,17 @@ var Toaster = function (_a) {
     (0, react_1.useEffect)(function () {
         if (isShowToast) {
             if (toastProps.hasClosing) {
-                setTimeout(function () {
+                if (toastProps.timer > 0) {
+                    setTimeout(function () {
+                        setIsShowToast(false);
+                    }, toastProps.timer || props_1.ToastDefault.timer);
+                }
+                else {
                     setIsShowToast(false);
-                }, toastProps.timer || props_1.ToastDefault.timer);
+                }
             }
         }
-    }, [isShowToast, toastProps.hasClosing]);
+    }, [isShowToast, toastProps.hasClosing, toastProps.timer]);
     (0, react_1.useEffect)(function () {
         if (isShowToast) {
             document.body.classList.add('hasToast');
@@ -53,8 +58,8 @@ var Toaster = function (_a) {
         }
     }, [isShowToast]);
     (0, react_1.useEffect)(function () {
-        setIsShowToast(toastProps.show);
-    }, [toastProps, show]);
+        setIsShowToast(toastProps === null || toastProps === void 0 ? void 0 : toastProps.show);
+    }, [toastProps === null || toastProps === void 0 ? void 0 : toastProps.show]);
     (0, react_1.useEffect)(function () {
         switch (toastProps.size) {
             case 'small':

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "krl-alfred",
-  "version": "1.79.2",
+  "version": "1.79.4",
   "files": [
     "dist"
   ],