@eduzz/fidc-alert - npm Package Compare versions

Comparing version 1.1.1 to 1.2.0

build/Alert/Icon.d.ts

@@ -1,2 +0,2 @@
-declare function InfoIcon(): JSX.Element;
-export { InfoIcon };
+declare function AlertIcon(): JSX.Element;
+export { AlertIcon };

build/Alert/Icon.js

@@ -14,7 +14,7 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.InfoIcon = void 0;
+exports.AlertIcon = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
-function InfoIcon() {
-    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: '20', height: '20', focusable: false, viewBox: '0 0 20 20', fill: 'none', xmlns: 'http://www.w3.org/2000/svg' }, { children: (0, jsx_runtime_1.jsx)("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M10 20C15.5228 20 20 15.5228 20 10C20 4.47715 15.5228 0 10 0C4.47715 0 0 4.47715 0 10C0 15.5228 4.47715 20 10 20ZM10 4C10.3414 4 10.635 4.08027 10.881 4.2408C11.127 4.39632 11.25 4.6898 11.25 5.12123C11.25 5.54766 11.127 5.84364 10.881 6.00919C10.635 6.16973 10.3414 6.25 10 6.25C9.65361 6.25 9.35743 6.16973 9.11144 6.00919C8.87048 5.84364 8.75 5.54766 8.75 5.12123C8.75 4.6898 8.87048 4.39632 9.11144 4.2408C9.35743 4.08027 9.65361 4 10 4ZM11.125 7.5V16H8.875V7.5H11.125Z' }) })));
+function AlertIcon() {
+    return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: '22', height: '19', focusable: false, viewBox: '0 0 22 19', fill: 'none', xmlns: 'http://www.w3.org/2000/svg' }, { children: (0, jsx_runtime_1.jsx)("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M12.0802 0.620443C11.5978 -0.206814 10.4022 -0.206815 9.91976 0.620442L0.297077 17.1203C-0.188946 17.9537 0.412367 19 1.37732 19H20.6227C21.5876 19 22.1889 17.9537 21.7029 17.1203L12.0802 0.620443ZM10.0454 7.99897C10.0205 7.45475 10.4551 7 11 7C11.5449 7 11.9795 7.45475 11.9546 7.99897L11.7842 11.7508C11.7651 12.17 11.4194 12.5 11 12.5C10.5806 12.5 10.2349 12.17 10.2158 11.7508L10.0454 7.99897ZM12 15C12 15.5523 11.5522 16 11 16C10.4478 16 10 15.5523 10 15C10 14.4477 10.4478 14 11 14C11.5522 14 12 14.4477 12 15Z' }) })));
 }
-exports.InfoIcon = InfoIcon;
+exports.AlertIcon = AlertIcon;

build/Alert/index.js

@@ -28,8 +28,9 @@ "use strict";
     var title = alertConfig.title.replace('{userName}', userName.trim());
-    return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: className, role: 'alert' }, { children: [(0, jsx_runtime_1.jsx)("span", __assign({ role: 'img', className: '__icon' }, { children: (0, jsx_runtime_1.jsx)(Icon_1.InfoIcon, {}) })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: '__wrapper' }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ className: '__content' }, { children: [(0, jsx_runtime_1.jsx)("p", __assign({ className: '__title' }, { children: title })), (0, jsx_runtime_1.jsx)("p", __assign({ className: '__description' }, { children: alertConfig.description }))] })), (0, jsx_runtime_1.jsx)(Button_1.default, { className: '__action', onClick: onClick })] }))] })));
+    var description = alertConfig.description.replace('{userName}', userName.trim());
+    return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: className, role: 'alert' }, { children: [(0, jsx_runtime_1.jsx)("span", __assign({ role: 'img', className: '__icon' }, { children: (0, jsx_runtime_1.jsx)(Icon_1.AlertIcon, {}) })), (0, jsx_runtime_1.jsxs)("div", __assign({ className: '__wrapper' }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ className: '__content' }, { children: [(0, jsx_runtime_1.jsx)("p", __assign({ className: '__title' }, { children: title })), (0, jsx_runtime_1.jsx)("p", { className: '__description', dangerouslySetInnerHTML: { __html: description } })] })), (0, jsx_runtime_1.jsx)(Button_1.default, { className: '__action', onClick: onClick })] }))] })));
 }
 exports.default = (0, styled_1.default)(Alert, { label: 'fidc-alert' })(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
-    return (0, react_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    padding: ", ";\n    border-radius: ", ";\n    display: flex;\n    position: relative;\n    background-color: ", ";\n\n    svg {\n      fill: ", ";\n    }\n\n    ", " {\n      padding: ", ";\n    }\n\n    .__icon {\n      margin: ", "rem ", " 0 0;\n\n      ", " {\n        display: none;\n      }\n    }\n\n    .__wrapper {\n      flex: 1;\n\n      p {\n        margin: 0;\n        font-family: ", ";\n        color: ", ";\n      }\n\n      .__title {\n        font-weight: ", ";\n        font-size: ", ";\n        line-height: ", ";\n        margin-bottom: ", ";\n\n        ", " {\n          margin-bottom: ", ";\n          font-size: ", ";\n        }\n      }\n\n      .__description {\n        font-size: ", ";\n      }\n\n      .__action {\n        margin-top: ", ";\n\n        ", " {\n          margin-top: ", ";\n          width: 100%;\n        }\n      }\n    }\n  "], ["\n    padding: ", ";\n    border-radius: ", ";\n    display: flex;\n    position: relative;\n    background-color: ", ";\n\n    svg {\n      fill: ", ";\n    }\n\n    ", " {\n      padding: ", ";\n    }\n\n    .__icon {\n      margin: ", "rem ", " 0 0;\n\n      ", " {\n        display: none;\n      }\n    }\n\n    .__wrapper {\n      flex: 1;\n\n      p {\n        margin: 0;\n        font-family: ", ";\n        color: ", ";\n      }\n\n      .__title {\n        font-weight: ", ";\n        font-size: ", ";\n        line-height: ", ";\n        margin-bottom: ", ";\n\n        ", " {\n          margin-bottom: ", ";\n          font-size: ", ";\n        }\n      }\n\n      .__description {\n        font-size: ", ";\n      }\n\n      .__action {\n        margin-top: ", ";\n\n        ", " {\n          margin-top: ", ";\n          width: 100%;\n        }\n      }\n    }\n  "])), theme.spacing.inset.sm, theme.border.radius.sm, theme.feedbackColor.informative.light, theme.feedbackColor.informative.pure, theme.breakpoints.down('md'), theme.spacing.inset.xs, theme.pxToRem(2), theme.spacing.inline.xxxs, theme.breakpoints.down('md'), theme.font.family.base, theme.neutralColor.low.pure, theme.font.weight.semibold, theme.font.size.md, theme.line.height.default, theme.spacing.stack.xxxs, theme.breakpoints.down('md'), theme.spacing.stack.nano, theme.font.size.sm, theme.font.size.xs, theme.spacing.stack.xxxs, theme.breakpoints.down('md'), theme.spacing.stack.xxs);
+    return (0, react_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    padding: ", ";\n    border-radius: ", ";\n    display: flex;\n    position: relative;\n    background-color: ", ";\n\n    svg {\n      fill: ", ";\n    }\n\n    ", " {\n      padding: ", ";\n    }\n\n    .__icon {\n      margin: ", "rem ", " 0 0;\n\n      ", " {\n        display: none;\n      }\n    }\n\n    .__wrapper {\n      flex: 1;\n\n      p {\n        margin: 0;\n        font-family: ", ";\n        color: ", ";\n      }\n\n      a {\n        line-height: ", ";\n        color: ", ";\n\n        :hover {\n          color: ", ";\n        }\n\n        :visited {\n          color: ", ";\n        }\n      }\n\n      .__title {\n        font-weight: ", ";\n        font-size: ", ";\n        line-height: ", ";\n        margin-bottom: ", ";\n\n        ", " {\n          margin-bottom: ", ";\n          font-size: ", ";\n        }\n      }\n\n      .__description {\n        font-size: ", ";\n      }\n\n      .__action {\n        margin-top: ", ";\n\n        ", " {\n          margin-top: ", ";\n          width: 100%;\n        }\n      }\n    }\n  "], ["\n    padding: ", ";\n    border-radius: ", ";\n    display: flex;\n    position: relative;\n    background-color: ", ";\n\n    svg {\n      fill: ", ";\n    }\n\n    ", " {\n      padding: ", ";\n    }\n\n    .__icon {\n      margin: ", "rem ", " 0 0;\n\n      ", " {\n        display: none;\n      }\n    }\n\n    .__wrapper {\n      flex: 1;\n\n      p {\n        margin: 0;\n        font-family: ", ";\n        color: ", ";\n      }\n\n      a {\n        line-height: ", ";\n        color: ", ";\n\n        :hover {\n          color: ", ";\n        }\n\n        :visited {\n          color: ", ";\n        }\n      }\n\n      .__title {\n        font-weight: ", ";\n        font-size: ", ";\n        line-height: ", ";\n        margin-bottom: ", ";\n\n        ", " {\n          margin-bottom: ", ";\n          font-size: ", ";\n        }\n      }\n\n      .__description {\n        font-size: ", ";\n      }\n\n      .__action {\n        margin-top: ", ";\n\n        ", " {\n          margin-top: ", ";\n          width: 100%;\n        }\n      }\n    }\n  "])), theme.spacing.inset.sm, theme.border.radius.sm, theme.feedbackColor.warning.light, theme.feedbackColor.warning.pure, theme.breakpoints.down('md'), theme.spacing.inset.xs, theme.pxToRem(2), theme.spacing.inline.xxxs, theme.breakpoints.down('md'), theme.font.family.base, theme.neutralColor.low.pure, theme.line.height.default, theme.neutralColor.low.pure, theme.hexToRgba(theme.neutralColor.low.pure, theme.opacity.level[7]), theme.hexToRgba(theme.neutralColor.low.pure, theme.opacity.level[8]), theme.font.weight.semibold, theme.font.size.md, theme.line.height.default, theme.spacing.stack.xxxs, theme.breakpoints.down('md'), theme.spacing.stack.nano, theme.font.size.sm, theme.font.size.xs, theme.spacing.stack.xxxs, theme.breakpoints.down('md'), theme.spacing.stack.xxs);
 });
 var templateObject_1, templateObject_2;

package.json

 {
   "name": "@eduzz/fidc-alert",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "main": "./build/index.js",
@@ -5,0 +5,0 @@ "types": "./build/index.d.ts",

No alert changes

Improved metrics

Total package byte prevSize

33028

increased by2.14%

Lines of code

500

increased by0.6%

No dependency changes