krl-alfred 1.54.9 → 1.55.0

package/dist/components/ActionButton/ActionButton.js

@@ -0,0 +1,58 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var ActionButton_styled_1 = require("./ActionButton.styled");
+var Icon_1 = __importDefault(require("../Icon/Icon"));
+var Button_1 = __importDefault(require("../Button"));
+var ActionButton = function (props) {
+    var _a = (0, react_1.useState)(0), days = _a[0], setDays = _a[1];
+    var _b = (0, react_1.useState)(0), minutes = _b[0], setMinutes = _b[1];
+    var _c = (0, react_1.useState)(0), hours = _c[0], setHours = _c[1];
+    //const [secounds,setSecounds] = useState(0);
+    var deadline = new Date(props.date).getTime();
+    var count = function () {
+        var now = new Date().getTime();
+        var t = deadline - now;
+        var dd = Math.floor(t / (1000 * 60 * 60 * 24));
+        var hh = Math.floor((t % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
+        var mm = Math.floor((t % (1000 * 60 * 60)) / (1000 * 60));
+        //const ss = Math.floor((t % (1000 * 60)) / 1000);
+        setDays(dd < 10 ? "0" + dd : dd);
+        setMinutes(mm < 10 ? "0" + mm : mm);
+        setHours(hh < 10 ? "0" + hh : hh);
+        //setSecounds(ss < 10 ? "0" + ss : ss)
+        if (t < 0) {
+            clearInterval(timer);
+            setDays(0);
+            setMinutes(0);
+            setHours(0);
+            //setSecounds(0)
+        }
+    };
+    var timer = setInterval(count, 60 * 1000);
+    (0, react_1.useEffect)(function () {
+        count();
+    }, [props.date]);
+    return (0, jsx_runtime_1.jsxs)(ActionButton_styled_1.ActionButtonStyled, __assign({}, props, { children: [(0, jsx_runtime_1.jsx)("div", { className: "icon", children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: props.icon, width: "45px", height: "45px" }) }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("strong", { className: "title body-bold-13-16", children: props.title }), (0, jsx_runtime_1.jsxs)("div", { className: "timer", children: [(0, jsx_runtime_1.jsxs)("div", { className: "box", children: [(0, jsx_runtime_1.jsx)("div", { className: "title-extra-bold-16-19", children: days }), (0, jsx_runtime_1.jsx)("div", { className: "caption-regular-10-12", children: "G\u00FCn" })] }), (0, jsx_runtime_1.jsx)("div", { className: "dots caption-bold-12-15", children: ":" }), (0, jsx_runtime_1.jsxs)("div", { className: "box", children: [(0, jsx_runtime_1.jsx)("div", { className: "title-extra-bold-16-19", children: hours }), (0, jsx_runtime_1.jsx)("div", { className: "caption-regular-10-12", children: "Saat" })] }), (0, jsx_runtime_1.jsx)("div", { className: "dots caption-bold-12-15", children: ":" }), (0, jsx_runtime_1.jsxs)("div", { className: "box", children: [(0, jsx_runtime_1.jsx)("div", { className: "title-extra-bold-16-19", children: minutes }), (0, jsx_runtime_1.jsx)("div", { className: "caption-regular-10-12", children: "Dk." })] })] })] }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(Button_1.default, { size: "xsmall", width: "32px", icon: "ArrowMediumRight", variant: "primary" }) })] }));
+};
+ActionButton.defaultProps = {
+    title: "Title",
+    width: "100%",
+    icon: 'TimeCircle',
+};
+exports.default = ActionButton;

package/dist/components/ActionButton/ActionButton.styled.js

@@ -0,0 +1,13 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ActionButtonStyled = void 0;
+var styled_components_1 = __importDefault(require("styled-components"));
+exports.ActionButtonStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  border-radius: 0.5rem;\n  background-color: var(--primary-opacity-5);\n  padding: 1rem;\n  width: ", ";\n  display: grid;\n  grid-template-columns: auto 1fr auto;\n  align-items: center;\n  justify-content: space-between;\n  color: var(--dark);\n  box-sizing: border-box;\n  cursor: pointer;\n  .icon{\n    svg{\n      path {\n        stroke : var(--primary);\n      }\n    }\n    margin-right: 1rem;\n  }\n  .title{\n    display: block;\n  }\n  .timer{\n    display: grid;\n    grid-template-columns: repeat(5,auto);\n    margin-top: 0.5rem;\n    align-items:center;\n    justify-content: start;\n    .box{\n      width: 40px;\n      height: 48px;\n      background-color: white;\n      border-radius: 4px;\n      text-align: center;\n      display: grid;\n      align-items: center;\n      align-content: center;\n      box-shadow: 0 6px 30px 0 #EAE9F0;\n    }\n    .dots{\n      margin: 0 5px;\n    }\n  }\n"], ["\n  border-radius: 0.5rem;\n  background-color: var(--primary-opacity-5);\n  padding: 1rem;\n  width: ", ";\n  display: grid;\n  grid-template-columns: auto 1fr auto;\n  align-items: center;\n  justify-content: space-between;\n  color: var(--dark);\n  box-sizing: border-box;\n  cursor: pointer;\n  .icon{\n    svg{\n      path {\n        stroke : var(--primary);\n      }\n    }\n    margin-right: 1rem;\n  }\n  .title{\n    display: block;\n  }\n  .timer{\n    display: grid;\n    grid-template-columns: repeat(5,auto);\n    margin-top: 0.5rem;\n    align-items:center;\n    justify-content: start;\n    .box{\n      width: 40px;\n      height: 48px;\n      background-color: white;\n      border-radius: 4px;\n      text-align: center;\n      display: grid;\n      align-items: center;\n      align-content: center;\n      box-shadow: 0 6px 30px 0 #EAE9F0;\n    }\n    .dots{\n      margin: 0 5px;\n    }\n  }\n"])), function (props) { return props.width; });
+var templateObject_1;

package/dist/components/ActionButton/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var ActionButton_1 = require("./ActionButton");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(ActionButton_1).default; } });

package/dist/components/ActionButton/props.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.iconNames = void 0;
+var Icon_1 = require("../Icon");
+exports.iconNames = Object.keys(Icon_1.iconList);
+var ActionButtonDefault = {
+    width: '100%',
+    title: 'title',
+    icon: 'TimeCircle',
+};

package/dist/components/ActionButton/stories/ActionButton.stories.js

@@ -0,0 +1,25 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Default = void 0;
+var ActionButton_1 = __importDefault(require("../ActionButton"));
+var date = new Date();
+date.setFullYear(new Date().getFullYear() + 1);
+exports.default = {
+    title: 'Components/Action Button',
+    component: ActionButton_1.default,
+    tags: ['autodocs'],
+    argTypes: {
+        onClick: { action: 'clicked' }
+    }
+};
+exports.Default = {
+    args: {
+        width: '300px',
+        title: 'Title',
+        date: date.toISOString(),
+        onClick: function (e) { return console.log(e); },
+    },
+};

package/dist/components/Button/Button.js

@@ -1,4 +1,15 @@
 "use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -10,12 +21,12 @@ var classnames_1 = __importDefault(require("classnames"));
 var Icon_1 = __importDefault(require("../Icon/Icon"));
 var Children = function (props) {
     var children = props.children, icon = props.icon;
-    return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [children, icon && (0, jsx_runtime_1.jsx)(Button_styled_1.IconStyled, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: icon, width: "16px", height: "16px" }) })] });
+    return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "children", children: children }), icon && (0, jsx_runtime_1.jsx)(Button_styled_1.IconStyled, __assign({}, props, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: icon, width: "16px", height: "16px" }) }))] });
 };
 var Button = function (props) {
     var _a;
     var isLoading = props.isLoading, onClick = props.onClick, disabled = props.disabled, size = props.size, variant = props.variant, width = props.width, icon = props.icon, children = props.children;
-    return ((0, jsx_runtime_1.jsx)(Button_styled_1.ButtonStyled, { className: (0, classnames_1.default)((_a = {}, _a["loading"] = isLoading, _a), (size === 'xsmall' ? "caption-bold-12-15" : "body-bold-14-17")), onClick: onClick, disabled: disabled || isLoading, size: size, variant: variant, width: width, children: isLoading ? (0, jsx_runtime_1.jsx)(Spinner_1.default, { width: size === "big" ? "24px" : "16px", height: size === "big" ? "24px" : "16px", variant: variant === 'primary' ? 'secondary' : 'primary' }) :
+    return ((0, jsx_runtime_1.jsx)(Button_styled_1.ButtonStyled, { className: (0, classnames_1.default)((_a = {}, _a["loading"] = isLoading, _a), (size === 'xsmall' ? "caption-bold-12-15" : "body-bold-14-17")), onClick: onClick, disabled: disabled || isLoading, size: size, variant: variant, width: width, icon: icon, children: isLoading ? (0, jsx_runtime_1.jsx)(Spinner_1.default, { width: size === "big" ? "24px" : "16px", height: size === "big" ? "24px" : "16px", variant: variant === 'primary' ? 'secondary' : 'primary' }) :
             (0, jsx_runtime_1.jsx)(Children, { icon: icon, children: children }) }));
 };
 exports.default = Button;

package/dist/components/Button/Button.styled.js

@@ -33,7 +33,7 @@ var primary = (0, styled_components_1.css)(templateObject_1 || (templateObject_1
 var secondary = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: var(--primary-opacity-5);\n  color: var(--primary);\n  border: none;\n  svg{\n    path, rect{\n      stroke : var(--primary);\n    }\n    circle{\n      fill : var(--primary);\n      ~ path{\n        stroke : white;\n      }\n    }\n  }\n\n  &:hover {\n    color: var(--primary-hover);\n    svg{\n      path, rect{\n        stroke : var(--primary-hover);\n      }\n      circle{\n        fill : var(--primary-hover);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n\n  &:active {\n    color: var(--primary-press);\n    svg{\n      path, rect{\n        stroke : var(--primary-press);\n      }\n      circle{\n        fill : var(--primary-press);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n\n  &:disabled:not(.loading) {\n    background-color: var(--dark-opacity-5);\n    color: var(--dark-opacity-25);\n    svg{\n      path, rect{\n        stroke : var(--dark-opacity-25);\n      }\n      circle{\n        fill : var(--dark-opacity-25);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n"], ["\n  background-color: var(--primary-opacity-5);\n  color: var(--primary);\n  border: none;\n  svg{\n    path, rect{\n      stroke : var(--primary);\n    }\n    circle{\n      fill : var(--primary);\n      ~ path{\n        stroke : white;\n      }\n    }\n  }\n\n  &:hover {\n    color: var(--primary-hover);\n    svg{\n      path, rect{\n        stroke : var(--primary-hover);\n      }\n      circle{\n        fill : var(--primary-hover);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n\n  &:active {\n    color: var(--primary-press);\n    svg{\n      path, rect{\n        stroke : var(--primary-press);\n      }\n      circle{\n        fill : var(--primary-press);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n\n  &:disabled:not(.loading) {\n    background-color: var(--dark-opacity-5);\n    color: var(--dark-opacity-25);\n    svg{\n      path, rect{\n        stroke : var(--dark-opacity-25);\n      }\n      circle{\n        fill : var(--dark-opacity-25);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n"])));
 var inverted = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  background-color: transparent;\n  color: var(--primary);\n  border: 1px solid;\n  border-color: var(--primary);\n  svg{\n    path, rect{\n      stroke : var(--primary);\n    }\n    circle{\n      fill : var(--primary);\n      ~ path{\n        stroke : white;\n      }\n    }\n  }\n  &:hover {\n    color: var(--primary-hover);\n    border-color: var(--primary-hover);\n    svg{\n      path, rect{\n        stroke : var(--primary-hover);\n      }\n      circle{\n        fill : var(--primary-hover);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n\n  &:active {\n    color: var(--primary-press);\n    border-color: var(--primary-press);\n    svg{\n      path, rect{\n        stroke : var(--primary-press);\n      }\n      circle{\n        fill : var(--primary-press);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n\n  &:disabled:not(.loading) {\n    color: var(--dark-opacity-25);\n    border-color: var(--dark-opacity-25);\n    svg{\n      path, rect{\n        stroke : var(--dark-opacity-25);\n      }\n      circle{\n        fill : var(--dark-opacity-25);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n"], ["\n  background-color: transparent;\n  color: var(--primary);\n  border: 1px solid;\n  border-color: var(--primary);\n  svg{\n    path, rect{\n      stroke : var(--primary);\n    }\n    circle{\n      fill : var(--primary);\n      ~ path{\n        stroke : white;\n      }\n    }\n  }\n  &:hover {\n    color: var(--primary-hover);\n    border-color: var(--primary-hover);\n    svg{\n      path, rect{\n        stroke : var(--primary-hover);\n      }\n      circle{\n        fill : var(--primary-hover);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n\n  &:active {\n    color: var(--primary-press);\n    border-color: var(--primary-press);\n    svg{\n      path, rect{\n        stroke : var(--primary-press);\n      }\n      circle{\n        fill : var(--primary-press);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n\n  &:disabled:not(.loading) {\n    color: var(--dark-opacity-25);\n    border-color: var(--dark-opacity-25);\n    svg{\n      path, rect{\n        stroke : var(--dark-opacity-25);\n      }\n      circle{\n        fill : var(--dark-opacity-25);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n"])));
 var ghost = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  background-color: transparent;\n  color: var(--primary);\n  border: 0;\n  svg{\n    path, rect{\n      stroke : var(--primary);\n    }\n    circle{\n      fill : var(--primary);\n      ~ path{\n        stroke : white;\n      }\n    }\n  }\n  &:hover {\n    color: var(--primary); \n    background-color: var(--primary-opacity-5);\n    svg{\n      path, rect{\n        stroke : var(--primary);\n      }\n      circle{\n        fill : var(--primary);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n\n  &:active {\n    color: var(--primary-hover);\n    background-color: var(--primary-opacity-5);\n    svg{\n      path, rect{\n        stroke : var(--primary-hover);\n      }\n      circle{\n        fill : var(--primary-hover);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n\n  &:disabled:not(.loading) {\n    color: var(--dark-opacity-25);\n    svg{\n      path, rect{\n        stroke : var(--dark-opacity-25);\n      }\n      circle{\n        fill : var(--dark-opacity-25);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n"], ["\n  background-color: transparent;\n  color: var(--primary);\n  border: 0;\n  svg{\n    path, rect{\n      stroke : var(--primary);\n    }\n    circle{\n      fill : var(--primary);\n      ~ path{\n        stroke : white;\n      }\n    }\n  }\n  &:hover {\n    color: var(--primary); \n    background-color: var(--primary-opacity-5);\n    svg{\n      path, rect{\n        stroke : var(--primary);\n      }\n      circle{\n        fill : var(--primary);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n\n  &:active {\n    color: var(--primary-hover);\n    background-color: var(--primary-opacity-5);\n    svg{\n      path, rect{\n        stroke : var(--primary-hover);\n      }\n      circle{\n        fill : var(--primary-hover);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n\n  &:disabled:not(.loading) {\n    color: var(--dark-opacity-25);\n    svg{\n      path, rect{\n        stroke : var(--dark-opacity-25);\n      }\n      circle{\n        fill : var(--dark-opacity-25);\n        ~ path{\n          stroke : white;\n        }\n      }\n    }\n  }\n"])));
-exports.ButtonStyled = styled_components_1.default.button(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  box-sizing: border-box;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: ", ";\n  padding: ", ";\n  font-family: var(--font-family-sans-serif);\n  cursor: pointer;\n  transition: all .2s;\n  width: ", ";\n  ", "\n  height: ", ";\n  &:disabled {\n    cursor: not-allowed;\n  }\n"], ["\n  box-sizing: border-box;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: ", ";\n  padding: ", ";\n  font-family: var(--font-family-sans-serif);\n  cursor: pointer;\n  transition: all .2s;\n  width: ", ";\n  ", "\n  height: ", ";\n  &:disabled {\n    cursor: not-allowed;\n  }\n"])), function (props) { return props.size === 'xsmall' ? '4px' : '8px'; }, function (props) { return props.width ? '0' : '0 24px'; }, function (props) { return props.width; }, function (props) {
+exports.ButtonStyled = styled_components_1.default.button(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  box-sizing: border-box;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: ", ";\n  padding: ", ";\n  font-family: var(--font-family-sans-serif);\n  cursor: pointer;\n  transition: all .2s;\n  width: ", ";\n  ", "\n  height: ", ";\n  &:disabled {\n    cursor: not-allowed;\n  }\n  .children{\n    margin-right: ", ";\n    &:empty{\n      margin-right: 0;\n    }\n  }\n"], ["\n  box-sizing: border-box;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: ", ";\n  padding: ", ";\n  font-family: var(--font-family-sans-serif);\n  cursor: pointer;\n  transition: all .2s;\n  width: ", ";\n  ", "\n  height: ", ";\n  &:disabled {\n    cursor: not-allowed;\n  }\n  .children{\n    margin-right: ", ";\n    &:empty{\n      margin-right: 0;\n    }\n  }\n"])), function (props) { return props.size === 'xsmall' ? '4px' : '8px'; }, function (props) { return props.width ? '0' : '0 24px'; }, function (props) { return props.width; }, function (props) {
     switch (props.variant) {
         case 'primary':
             return primary;
@@ -59,6 +59,6 @@ exports.ButtonStyled = styled_components_1.default.button(templateObject_5 || (t
         default:
             return "48px";
     }
-});
-exports.IconStyled = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  margin-left: 10px;\n  display: flex;\n  align-items: center;\n"], ["\n  margin-left: 10px;\n  display: flex;\n  align-items: center;\n"])));
+}, function (props) { return props.icon ? "10px" : "0"; });
+exports.IconStyled = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n"], ["\n  display: flex;\n  align-items: center;\n"])));
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/dist/components/Icon/Bag3.js

@@ -0,0 +1,40 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var React = __importStar(require("react"));
+var SvgBag3 = function (props) { return ((0, jsx_runtime_1.jsxs)("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", width: 56, height: 57, viewBox: "0 0 56 57", fill: "none" }, props, { children: [(0, jsx_runtime_1.jsx)("path", { d: "M36.8035 22.2124V15.1377C36.8035 10.2751 32.8625 6.33407 28.0021 6.33407C23.1395 6.31307 19.1798 10.2354 19.1588 15.0981V15.1377V22.2124M39.0652 49.5012H16.9348C11.4466 49.5012 7 45.0562 7 39.5728V26.7022C7 21.2188 11.4466 16.7738 16.9348 16.7738H39.0652C44.5534 16.7738 49 21.2188 49 26.7022V39.5728C49 45.0562 44.5534 49.5012 39.0652 49.5012Z", stroke: "#0A103D", strokeWidth: 4, strokeLinecap: "round", strokeLinejoin: "round" }), (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M28.6001 25.673L30.5502 29.6073C30.6478 29.8058 30.8364 29.9443 31.0554 29.9764L35.421 30.6089C35.5979 30.6325 35.757 30.7254 35.8656 30.8673C36.0694 31.1333 36.0382 31.5099 35.794 31.7387L32.6299 34.8075C32.469 34.9595 32.3975 35.1824 32.4396 35.3994L33.1974 39.7298C33.2504 40.0886 33.0062 40.4247 32.6484 40.483C32.5002 40.5058 32.3486 40.4822 32.2139 40.4154L28.3256 38.371C28.1303 38.2646 27.8962 38.2646 27.7009 38.371L23.784 40.4264C23.4565 40.5936 23.0557 40.4695 22.8772 40.1478C22.809 40.0177 22.7854 39.8699 22.809 39.7255L23.5668 35.3952C23.6046 35.179 23.5331 34.9569 23.3765 34.8041L20.1954 31.7362C19.9361 31.4778 19.9344 31.0573 20.1929 30.7972C20.1938 30.7963 20.1946 30.7946 20.1954 30.7938C20.3024 30.6967 20.4337 30.6317 20.576 30.6063L24.9426 29.9738C25.1606 29.9392 25.3484 29.8024 25.4477 29.604L27.3961 25.673C27.4744 25.5134 27.6133 25.391 27.7817 25.3353C27.951 25.2787 28.1362 25.2922 28.2953 25.3724C28.4258 25.4374 28.5328 25.543 28.6001 25.673Z", stroke: "#0A103D", strokeWidth: 4, strokeLinecap: "round", strokeLinejoin: "round" })] }))); };
+exports.default = SvgBag3;

package/dist/components/Icon/index.js

@@ -25,10 +25,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Calling = exports.Call = exports.Calendar = exports.BuyBig = exports.Buy = exports.ButtonIcon = exports.Box = exports.Bookmark = exports.Bag = exports.Bag2 = exports.Baby = exports.AskedQuestions = exports.ArrowUpSquare = exports.ArrowUpCircle = exports.ArrowUpBig = exports.ArrowUpAnimate = exports.ArrowUp = exports.ArrowSmallUp = exports.ArrowSmallRightStroke = exports.ArrowSmallRightBackground = exports.ArrowSmallRight = exports.ArrowSmallLeftStroke = exports.ArrowSmallLeftHover = exports.ArrowSmallLeft = exports.ArrowSmallDown = exports.ArrowShare = exports.ArrowRightSquare = exports.ArrowRightCircle = exports.ArrowRightBig = exports.ArrowRightAnimate = exports.ArrowRight = exports.ArrowPlusCircle = exports.ArrowMediumRight = exports.ArrowMedium = exports.ArrowLeftSquare = exports.ArrowLeftCircle = exports.ArrowLeftBig = exports.ArrowLeftAnimate = exports.ArrowLeft = exports.ArrowGo = exports.ArrowDownSquare = exports.ArrowDownCircle = exports.ArrowDownBig = exports.ArrowDownAnimate = exports.ArrowDown = exports.AgreementArrowUp = exports.AgreementArrowDown = exports.Again = exports.AddUser = exports.Activity = void 0;
-exports.Language2 = exports.KeyboardClose = exports.Keyboard = exports.InstagramNegative = exports.InfoSquare = exports.InfoCircle = exports.Image = exports.House = exports.Home = exports.Hide = exports.Heart = exports.Grid = exports.Graph = exports.Game = exports.Folder = exports.FilterUp = exports.FilterDown = exports.Filter2 = exports.Filter = exports.Facebook = exports.ErrorIcon = exports.EditSquare = exports.Edit = exports.Download = exports.Document = exports.Discovery = exports.Discount = exports.Delete = exports.Danger = exports.CloseSquare = exports.CloseMiniHover = exports.Closemini = exports.CloseHover = exports.CloseBigHover = exports.CloseBig = exports.Close = exports.CheckMark = exports.CheckboxElementUncheck = exports.CheckboxElementInvalid = exports.CheckboxElementDisabled = exports.CheckboxElementChecked = exports.Chat = exports.Chart = exports.Category = exports.Cargo = exports.Cargo1 = exports.Campaign = exports.Camera = exports.CallSilent = exports.CallMissed = void 0;
-exports.Setting1 = exports.Send = exports.Search = exports.Scan = exports.Sandwatch = exports.RadioButtonElementUnchecked = exports.RadioButtonElementInvalid = exports.RadioButtonElementDisabled = exports.RadioButtonElementChecked = exports.ProfilNamePassive = exports.ProfilName = exports.Profile = exports.PriceTag = exports.Pointinghand = exports.PointFinger = exports.PlusSmall = exports.PlusBig = exports.Plus = exports.Play = exports.Password = exports.PaperUpload = exports.PaperPlus = exports.PaperNegative = exports.PaperFail = exports.PaperDownload = exports.Paper = exports.OrderProgressIcons = exports.NotificationSimpleSmall = exports.NotificationSimple = exports.Notification = exports.Notification1 = exports.NegativeSmall = exports.NegativeBig = exports.MoreSquare = exports.MoreCircle = exports.More = exports.Money = exports.Minus = exports.Message = exports.Logout = exports.Login = exports.Lock = exports.Location = exports.Loading = exports.Live = exports.List = exports.LinkedIn = exports.LikeV1 = exports.Like = exports.Laptop = void 0;
-exports.iconList = exports.Youtube = exports.Work = exports.Watch = exports.Wallet = exports.VolumeUp = exports.VolumeOff = exports.VolumeDown = exports.Voice2 = exports.Voice = exports.Video = exports.Upload = exports.Unlock = exports.TwoUser = exports.Twitter = exports.Trash = exports.TimeSquare = exports.TimeCircle = exports.TickSquare = exports.TicketStar = exports.Ticket = exports.ThreeUser = exports.SwitchPassive = exports.Swap = exports.Steps = exports.Steps2 = exports.Steps1 = exports.Star = exports.SignLanguage = exports.ShufflePlay = exports.Show = exports.ShieldFail = exports.ShieldDone = exports.Setting = void 0;
+exports.Call = exports.Calendar = exports.BuyBig = exports.Buy = exports.ButtonIcon = exports.Box = exports.Bookmark = exports.Bag3 = exports.Bag = exports.Bag2 = exports.Baby = exports.AskedQuestions = exports.ArrowUpSquare = exports.ArrowUpCircle = exports.ArrowUpBig = exports.ArrowUpAnimate = exports.ArrowUp = exports.ArrowSmallUp = exports.ArrowSmallRightStroke = exports.ArrowSmallRightBackground = exports.ArrowSmallRight = exports.ArrowSmallLeftStroke = exports.ArrowSmallLeftHover = exports.ArrowSmallLeft = exports.ArrowSmallDown = exports.ArrowShare = exports.ArrowRightSquare = exports.ArrowRightCircle = exports.ArrowRightBig = exports.ArrowRightAnimate = exports.ArrowRight = exports.ArrowPlusCircle = exports.ArrowMediumRight = exports.ArrowMedium = exports.ArrowLeftSquare = exports.ArrowLeftCircle = exports.ArrowLeftBig = exports.ArrowLeftAnimate = exports.ArrowLeft = exports.ArrowGo = exports.ArrowDownSquare = exports.ArrowDownCircle = exports.ArrowDownBig = exports.ArrowDownAnimate = exports.ArrowDown = exports.AgreementArrowUp = exports.AgreementArrowDown = exports.Again = exports.AddUser = exports.Activity = void 0;
+exports.KeyboardClose = exports.Keyboard = exports.InstagramNegative = exports.InfoSquare = exports.InfoCircle = exports.Image = exports.House = exports.Home = exports.Hide = exports.Heart = exports.Grid = exports.Graph = exports.Game = exports.Folder = exports.FilterUp = exports.FilterDown = exports.Filter2 = exports.Filter = exports.Facebook = exports.ErrorIcon = exports.EditSquare = exports.Edit = exports.Download = exports.Document = exports.Discovery = exports.Discount = exports.Delete = exports.Danger = exports.CloseSquare = exports.CloseMiniHover = exports.Closemini = exports.CloseHover = exports.CloseBigHover = exports.CloseBig = exports.Close = exports.CheckMark = exports.CheckboxElementUncheck = exports.CheckboxElementInvalid = exports.CheckboxElementDisabled = exports.CheckboxElementChecked = exports.Chat = exports.Chart = exports.Category = exports.Cargo = exports.Cargo1 = exports.Campaign = exports.Camera = exports.CallSilent = exports.CallMissed = exports.Calling = void 0;
+exports.Send = exports.Search = exports.Scan = exports.Sandwatch = exports.RadioButtonElementUnchecked = exports.RadioButtonElementInvalid = exports.RadioButtonElementDisabled = exports.RadioButtonElementChecked = exports.ProfilNamePassive = exports.ProfilName = exports.Profile = exports.PriceTag = exports.Pointinghand = exports.PointFinger = exports.PlusSmall = exports.PlusBig = exports.Plus = exports.Play = exports.Password = exports.PaperUpload = exports.PaperPlus = exports.PaperNegative = exports.PaperFail = exports.PaperDownload = exports.Paper = exports.OrderProgressIcons = exports.NotificationSimpleSmall = exports.NotificationSimple = exports.Notification = exports.Notification1 = exports.NegativeSmall = exports.NegativeBig = exports.MoreSquare = exports.MoreCircle = exports.More = exports.Money = exports.Minus = exports.Message = exports.Logout = exports.Login = exports.Lock = exports.Location = exports.Loading = exports.Live = exports.List = exports.LinkedIn = exports.LikeV1 = exports.Like = exports.Laptop = exports.Language2 = void 0;
+exports.iconList = exports.Youtube = exports.Work = exports.Watch = exports.Wallet = exports.VolumeUp = exports.VolumeOff = exports.VolumeDown = exports.Voice2 = exports.Voice = exports.Video = exports.Upload = exports.Unlock = exports.TwoUser = exports.Twitter = exports.Trash = exports.TimeSquare = exports.TimeCircle = exports.TickSquare = exports.TicketStar = exports.Ticket = exports.ThreeUser = exports.SwitchPassive = exports.Swap = exports.Steps = exports.Steps2 = exports.Steps1 = exports.Star = exports.SignLanguage = exports.ShufflePlay = exports.Show = exports.ShieldFail = exports.ShieldDone = exports.Setting = exports.Setting1 = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var Activity_1 = __importDefault(require("./Activity"));
 Object.defineProperty(exports, "Activity", { enumerable: true, get: function () { return Activity_1.default; } });
@@ -114,6 +114,8 @@ var Bag2_1 = __importDefault(require("./Bag2"));
 Object.defineProperty(exports, "Bag2", { enumerable: true, get: function () { return Bag2_1.default; } });
 var Bag_1 = __importDefault(require("./Bag"));
 Object.defineProperty(exports, "Bag", { enumerable: true, get: function () { return Bag_1.default; } });
+var Bag3_1 = __importDefault(require("./Bag3"));
+Object.defineProperty(exports, "Bag3", { enumerable: true, get: function () { return Bag3_1.default; } });
 var Bookmark_1 = __importDefault(require("./Bookmark"));
 Object.defineProperty(exports, "Bookmark", { enumerable: true, get: function () { return Bookmark_1.default; } });
 var Box_1 = __importDefault(require("./Box"));
@@ -565,6 +567,10 @@ exports.iconList = {
         var props = __rest(_a, []);
         return (0, jsx_runtime_1.jsx)(Bag_1.default, __assign({}, props));
     },
+    Bag3: function (_a) {
+        var props = __rest(_a, []);
+        return (0, jsx_runtime_1.jsx)(Bag3_1.default, __assign({}, props));
+    },
     Bookmark: function (_a) {
         var props = __rest(_a, []);
         return (0, jsx_runtime_1.jsx)(Bookmark_1.default, __assign({}, props));

package/dist/components/OtpInput/OtpInput.styled.js

@@ -9,5 +9,5 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.OtpInputStyled = void 0;
 var styled_components_1 = __importDefault(require("styled-components"));
-exports.OtpInputStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n\n  input {\n    font-family: var(--font-family-sans-serif);\n    border: none;\n    width: 48px !important;\n    height: 48px;\n    border-bottom: 2px solid ", ";\n    text-align: center;\n    color: ", ";\n    font-weight: 600;\n    font-size: 40px;\n    line-height: 19px;\n    -moz-appearance: textfield;\n    padding: 0 !important;\n    &::-webkit-outer-spin-button,\n    &::-webkit-inner-spin-button {\n      -webkit-appearance: none;\n      margin: 0;\n    }\n\n    &:-webkit-autofill,\n    &:-webkit-autofill:hover,\n    &:-webkit-autofill:focus,\n    &:-webkit-autofill:active{\n      -webkit-box-shadow: 0 0 0 30px white inset !important;\n    }\n\n    &:not(:last-child) {\n      margin-right: 18.33px;\n    }\n    \n    &:focus,&:not(:placeholder-shown) {\n      outline: none;\n      border-color: ", ";\n    }\n    \n    &::selection{\n      background-color: inherit;\n      color:inherit;\n    }\n  }\n\n  .error {\n    display: flex;\n    align-items: center;\n    margin-top: 8px;\n\n    svg {\n      margin-right: 8px;\n    }\n\n    p {\n      margin: 0;\n      color: var(--red);\n    }\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n\n  input {\n    font-family: var(--font-family-sans-serif);\n    border: none;\n    width: 48px !important;\n    height: 48px;\n    border-bottom: 2px solid ", ";\n    text-align: center;\n    color: ", ";\n    font-weight: 600;\n    font-size: 40px;\n    line-height: 19px;\n    -moz-appearance: textfield;\n    padding: 0 !important;\n    &::-webkit-outer-spin-button,\n    &::-webkit-inner-spin-button {\n      -webkit-appearance: none;\n      margin: 0;\n    }\n\n    &:-webkit-autofill,\n    &:-webkit-autofill:hover,\n    &:-webkit-autofill:focus,\n    &:-webkit-autofill:active{\n      -webkit-box-shadow: 0 0 0 30px white inset !important;\n    }\n\n    &:not(:last-child) {\n      margin-right: 18.33px;\n    }\n    \n    &:focus,&:not(:placeholder-shown) {\n      outline: none;\n      border-color: ", ";\n    }\n    \n    &::selection{\n      background-color: inherit;\n      color:inherit;\n    }\n  }\n\n  .error {\n    display: flex;\n    align-items: center;\n    margin-top: 8px;\n\n    svg {\n      margin-right: 8px;\n    }\n\n    p {\n      margin: 0;\n      color: var(--red);\n    }\n  }\n"])), function (props) { return props.hasError ? 'var(--red)' : 'var(--dark-opacity-10)'; }, function (props) { return props.hasError ? 'var(--red)' : 'var(--dark)'; }, function (props) { return props.hasError ? 'var(--red)' : 'var(--dark)'; });
+exports.OtpInputStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n\n  input {\n    font-family: var(--font-family-sans-serif);\n    border: none;\n    width: 48px !important;\n    height: 48px;\n    border-bottom: 2px solid ", ";\n    text-align: center;\n    color: ", ";\n    font-weight: 600;\n    font-size: 40px;\n    line-height: 19px;\n    -moz-appearance: textfield;\n    padding: 0 !important;\n    border-radius: 0 !important;\n    &::-webkit-outer-spin-button,\n    &::-webkit-inner-spin-button {\n      -webkit-appearance: none;\n      margin: 0;\n    }\n\n    &:-webkit-autofill,\n    &:-webkit-autofill:hover,\n    &:-webkit-autofill:focus,\n    &:-webkit-autofill:active{\n      -webkit-box-shadow: 0 0 0 30px white inset !important;\n    }\n\n    &:not(:last-child) {\n      margin-right: 18.33px;\n    }\n    \n    &:focus,&:not(:placeholder-shown) {\n      outline: none;\n      border-color: ", ";\n    }\n    \n    &::selection{\n      background-color: inherit;\n      color:inherit;\n    }\n  }\n\n  .error {\n    display: flex;\n    align-items: center;\n    margin-top: 8px;\n\n    svg {\n      margin-right: 8px;\n    }\n\n    p {\n      margin: 0;\n      color: var(--red);\n    }\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n\n  input {\n    font-family: var(--font-family-sans-serif);\n    border: none;\n    width: 48px !important;\n    height: 48px;\n    border-bottom: 2px solid ", ";\n    text-align: center;\n    color: ", ";\n    font-weight: 600;\n    font-size: 40px;\n    line-height: 19px;\n    -moz-appearance: textfield;\n    padding: 0 !important;\n    border-radius: 0 !important;\n    &::-webkit-outer-spin-button,\n    &::-webkit-inner-spin-button {\n      -webkit-appearance: none;\n      margin: 0;\n    }\n\n    &:-webkit-autofill,\n    &:-webkit-autofill:hover,\n    &:-webkit-autofill:focus,\n    &:-webkit-autofill:active{\n      -webkit-box-shadow: 0 0 0 30px white inset !important;\n    }\n\n    &:not(:last-child) {\n      margin-right: 18.33px;\n    }\n    \n    &:focus,&:not(:placeholder-shown) {\n      outline: none;\n      border-color: ", ";\n    }\n    \n    &::selection{\n      background-color: inherit;\n      color:inherit;\n    }\n  }\n\n  .error {\n    display: flex;\n    align-items: center;\n    margin-top: 8px;\n\n    svg {\n      margin-right: 8px;\n    }\n\n    p {\n      margin: 0;\n      color: var(--red);\n    }\n  }\n"])), function (props) { return props.hasError ? 'var(--red)' : 'var(--dark-opacity-10)'; }, function (props) { return props.hasError ? 'var(--red)' : 'var(--dark)'; }, function (props) { return props.hasError ? 'var(--red)' : 'var(--dark)'; });
 var templateObject_1;

package/dist/index.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Textarea = exports.RadioButton = exports.Icon = exports.Agreement = exports.Alert = exports.Stepper = exports.ProductCard = exports.OtpInput = exports.Modal = exports.Input = exports.CircleProgress = exports.Checkbox = exports.CategoryMenu = exports.Breadcrumbs = exports.Spinner = exports.Button = void 0;
+exports.Textarea = exports.ActionButton = exports.RadioButton = exports.Icon = exports.Agreement = exports.Alert = exports.Stepper = exports.ProductCard = exports.OtpInput = exports.Modal = exports.Input = exports.CircleProgress = exports.Checkbox = exports.CategoryMenu = exports.Breadcrumbs = exports.Spinner = exports.Button = void 0;
 var Button_1 = __importDefault(require("./components/Button"));
 exports.Button = Button_1.default;
 var Spinner_1 = __importDefault(require("./components/Spinner"));
@@ -34,5 +34,7 @@ var Icon_1 = __importDefault(require("./components/Icon/Icon"));
 exports.Icon = Icon_1.default;
 var RadioButton_1 = __importDefault(require("./components/RadioButton/RadioButton"));
 exports.RadioButton = RadioButton_1.default;
+var ActionButton_1 = __importDefault(require("./components/ActionButton/ActionButton"));
+exports.ActionButton = ActionButton_1.default;
 var Textarea_1 = __importDefault(require("./components/Textarea"));
 exports.Textarea = Textarea_1.default;

package/package.json

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