krl-alfred 1.55.0 → 1.55.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -48,7 +48,7 @@ var ActionButton = function (props) {
48
48
  (0, react_1.useEffect)(function () {
49
49
  count();
50
50
  }, [props.date]);
51
- 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" }) })] }));
51
+ return (0, jsx_runtime_1.jsxs)(ActionButton_styled_1.ActionButtonStyled, __assign({}, props, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "top", 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.jsx)("strong", { className: "title body-bold-13-16", children: props.title })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bottom", children: [(0, jsx_runtime_1.jsx)("div", {}), (0, jsx_runtime_1.jsxs)("div", { children: [(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)(Button_1.default, { size: "xsmall", width: "32px", icon: "ArrowMediumRight", variant: "primary" })] })] })] }));
52
52
  };
53
53
  ActionButton.defaultProps = {
54
54
  title: "Title",
@@ -9,5 +9,5 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
9
9
  Object.defineProperty(exports, "__esModule", { value: true });
10
10
  exports.ActionButtonStyled = void 0;
11
11
  var styled_components_1 = __importDefault(require("styled-components"));
12
- 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; });
12
+ 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 1.5rem;\n width: ", ";\n align-items: center;\n justify-content: space-between;\n color: var(--dark);\n box-sizing: border-box;\n cursor: pointer;\n .top ,.bottom{\n display: grid;\n grid-template-columns: 61px 1fr;\n align-content: center;\n align-items: center;\n }\n .top{\n .icon{\n svg{\n display: block;\n path {\n stroke : var(--primary);\n }\n }\n margin-right: 1rem;\n }\n .title{\n display: block;\n }\n }\n .bottom{\n margin-top: 0.5rem;\n > div{\n display: grid;\n grid-template-columns: 1fr auto;\n align-content: center;\n align-items: center;\n justify-content: space-between;\n .timer{\n display: grid;\n grid-template-columns: repeat(5,auto);\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 } \n"], ["\n border-radius: 0.5rem;\n background-color: var(--primary-opacity-5);\n padding: 1rem 1.5rem;\n width: ", ";\n align-items: center;\n justify-content: space-between;\n color: var(--dark);\n box-sizing: border-box;\n cursor: pointer;\n .top ,.bottom{\n display: grid;\n grid-template-columns: 61px 1fr;\n align-content: center;\n align-items: center;\n }\n .top{\n .icon{\n svg{\n display: block;\n path {\n stroke : var(--primary);\n }\n }\n margin-right: 1rem;\n }\n .title{\n display: block;\n }\n }\n .bottom{\n margin-top: 0.5rem;\n > div{\n display: grid;\n grid-template-columns: 1fr auto;\n align-content: center;\n align-items: center;\n justify-content: space-between;\n .timer{\n display: grid;\n grid-template-columns: repeat(5,auto);\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 } \n"])), function (props) { return props.width; });
13
13
  var templateObject_1;
@@ -5,6 +5,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.Default = void 0;
7
7
  var ActionButton_1 = __importDefault(require("../ActionButton"));
8
+ var Icon_1 = require("../../Icon");
8
9
  var date = new Date();
9
10
  date.setFullYear(new Date().getFullYear() + 1);
10
11
  exports.default = {
@@ -12,14 +13,16 @@ exports.default = {
12
13
  component: ActionButton_1.default,
13
14
  tags: ['autodocs'],
14
15
  argTypes: {
15
- onClick: { action: 'clicked' }
16
+ onClick: { action: 'clicked' },
17
+ icon: { control: 'select', options: Object.keys(Icon_1.iconList) },
16
18
  }
17
19
  };
18
20
  exports.Default = {
19
21
  args: {
20
- width: '300px',
22
+ width: '311px',
21
23
  title: 'Title',
22
24
  date: date.toISOString(),
25
+ icon: 'TimeCircle',
23
26
  onClick: function (e) { return console.log(e); },
24
27
  },
25
28
  };
package/package.json CHANGED
@@ -1,17 +1,17 @@
1
1
  {
2
2
  "name": "krl-alfred",
3
- "version": "1.55.0",
3
+ "version": "1.55.1",
4
4
  "files": [
5
5
  "dist"
6
6
  ],
7
7
  "main": "dist/index.js",
8
8
  "dependencies": {
9
- "@storybook/addon-controls": "^7.0.17",
10
- "@storybook/addon-docs": "^7.0.17",
9
+ "@storybook/addon-controls": "^7.2.0",
10
+ "@storybook/addon-docs": "^7.2.0",
11
11
  "@storybook/addon-knobs": "^7.0.2",
12
- "@storybook/addon-measure": "^7.0.18",
13
- "@storybook/addon-outline": "^7.0.18",
14
- "@storybook/addon-viewport": "^7.0.17",
12
+ "@storybook/addon-measure": "^7.2.0",
13
+ "@storybook/addon-outline": "^7.2.0",
14
+ "@storybook/addon-viewport": "^7.2.0",
15
15
  "@storybook/preset-scss": "^1.0.3",
16
16
  "@testing-library/jest-dom": "^5.16.5",
17
17
  "@testing-library/react": "^14.0.0",
@@ -23,6 +23,7 @@
23
23
  "@types/styled-components": "^5.0.1",
24
24
  "classnames": "^2.3.2",
25
25
  "css-loader": "^6.7.3",
26
+ "events": "^3.3.0",
26
27
  "plop": "^3.1.2",
27
28
  "react": "^18.2.0",
28
29
  "react-circular-progressbar": "^2.1.0",
@@ -36,7 +37,7 @@
36
37
  "sass-loader": "^13.2.2",
37
38
  "style-loader": "^3.3.2",
38
39
  "styled-components": "^5.0.1",
39
- "typescript": "^5.0.3"
40
+ "typescript": "^5.1.6"
40
41
  },
41
42
  "scripts": {
42
43
  "start": "react-scripts start",
@@ -74,18 +75,18 @@
74
75
  "@semantic-release/git"
75
76
  ],
76
77
  "devDependencies": {
77
- "@storybook/addon-actions": "^7.0.17",
78
- "@storybook/addon-links": "^7.0.17",
79
- "@storybook/addon-mdx-gfm": "7.0.17",
80
- "@storybook/addon-styling": "^1.0.8",
81
- "@storybook/addons": "^7.0.17",
82
- "@storybook/cli": "^7.0.17",
83
- "@storybook/preset-create-react-app": "^7.0.17",
84
- "@storybook/react": "^7.0.17",
85
- "@storybook/react-webpack5": "7.0.17",
78
+ "@storybook/addon-actions": "^7.2.0",
79
+ "@storybook/addon-links": "^7.2.0",
80
+ "@storybook/addon-mdx-gfm": "7.2.0",
81
+ "@storybook/addon-styling": "^1.3.5",
82
+ "@storybook/addons": "^7.2.0",
83
+ "@storybook/cli": "^7.2.0",
84
+ "@storybook/preset-create-react-app": "^7.2.0",
85
+ "@storybook/react": "^7.2.0",
86
+ "@storybook/react-webpack5": "7.2.0",
86
87
  "@svgr/cli": "^7.0.0",
87
88
  "@svgr/webpack": "^7.0.0",
88
89
  "semantic-release": "^21.0.1",
89
- "storybook": "7.0.17"
90
+ "storybook": "7.2.0"
90
91
  }
91
92
  }