@dhis2-ui/notice-box 8.13.14 → 8.14.0
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.
- package/build/cjs/notice-box-content.js +3 -3
- package/build/cjs/notice-box-icon.js +4 -4
- package/build/cjs/notice-box.js +4 -4
- package/build/cjs/notice-box.stories.js +12 -2
- package/build/es/notice-box-content.js +3 -3
- package/build/es/notice-box-icon.js +4 -4
- package/build/es/notice-box.js +4 -4
- package/build/es/notice-box.stories.js +8 -1
- package/package.json +3 -3
|
@@ -27,16 +27,16 @@ const NoticeBoxContent = _ref => {
|
|
|
27
27
|
} = _ref;
|
|
28
28
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
29
29
|
"data-test": dataTest,
|
|
30
|
-
className: _style.default.dynamic([["
|
|
30
|
+
className: _style.default.dynamic([["403435427", [_uiConstants.spacers.dp8]]])
|
|
31
31
|
}, /*#__PURE__*/_react.default.createElement(_noticeBoxTitle.NoticeBoxTitle, {
|
|
32
32
|
title: title,
|
|
33
33
|
dataTest: "".concat(dataTest, "-title")
|
|
34
34
|
}), /*#__PURE__*/_react.default.createElement(_noticeBoxMessage.NoticeBoxMessage, {
|
|
35
35
|
dataTest: "".concat(dataTest, "-message")
|
|
36
36
|
}, children), /*#__PURE__*/_react.default.createElement(_style.default, {
|
|
37
|
-
id: "
|
|
37
|
+
id: "403435427",
|
|
38
38
|
dynamic: [_uiConstants.spacers.dp8]
|
|
39
|
-
}, ["div.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:".concat(_uiConstants.spacers.dp8, ";padding-
|
|
39
|
+
}, ["div.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:".concat(_uiConstants.spacers.dp8, ";padding-block-start:3px;}")]));
|
|
40
40
|
};
|
|
41
41
|
|
|
42
42
|
exports.NoticeBoxContent = NoticeBoxContent;
|
|
@@ -47,14 +47,14 @@ const NoticeBoxIcon = _ref => {
|
|
|
47
47
|
|
|
48
48
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
49
49
|
"data-test": dataTest,
|
|
50
|
-
className: _style.default.dynamic([["
|
|
50
|
+
className: _style.default.dynamic([["1909501516", [_uiConstants.spacers.dp12, _uiConstants.spacers.dp24]]])
|
|
51
51
|
}, /*#__PURE__*/_react.default.createElement(Icon, {
|
|
52
52
|
color: color,
|
|
53
|
-
className: _style.default.dynamic([["
|
|
53
|
+
className: _style.default.dynamic([["1909501516", [_uiConstants.spacers.dp12, _uiConstants.spacers.dp24]]])
|
|
54
54
|
}), /*#__PURE__*/_react.default.createElement(_style.default, {
|
|
55
|
-
id: "
|
|
55
|
+
id: "1909501516",
|
|
56
56
|
dynamic: [_uiConstants.spacers.dp12, _uiConstants.spacers.dp24]
|
|
57
|
-
}, [".__jsx-style-dynamic-selector{margin-
|
|
57
|
+
}, [".__jsx-style-dynamic-selector{margin-inline-end:".concat(_uiConstants.spacers.dp12, ";height:").concat(_uiConstants.spacers.dp24, ";}")]));
|
|
58
58
|
};
|
|
59
59
|
|
|
60
60
|
exports.NoticeBoxIcon = NoticeBoxIcon;
|
package/build/cjs/notice-box.js
CHANGED
|
@@ -40,21 +40,21 @@ const NoticeBox = _ref => {
|
|
|
40
40
|
});
|
|
41
41
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
42
42
|
"data-test": dataTest,
|
|
43
|
-
className: _style.default.dynamic([["
|
|
43
|
+
className: _style.default.dynamic([["243875418", [_uiConstants.colors.blue050, _uiConstants.colors.blue200, _uiConstants.spacers.dp12, _uiConstants.spacers.dp16, _uiConstants.colors.yellow050, _uiConstants.colors.yellow200, _uiConstants.colors.red050, _uiConstants.colors.red500, _uiConstants.colors.green050, _uiConstants.colors.green200]]]) + " " + (classnames || "")
|
|
44
44
|
}, /*#__PURE__*/_react.default.createElement(_noticeBoxIcon.NoticeBoxIcon, {
|
|
45
45
|
error: error,
|
|
46
46
|
warning: warning,
|
|
47
47
|
valid: valid,
|
|
48
48
|
dataTest: "".concat(dataTest, "-icon")
|
|
49
49
|
}), /*#__PURE__*/_react.default.createElement("div", {
|
|
50
|
-
className: _style.default.dynamic([["
|
|
50
|
+
className: _style.default.dynamic([["243875418", [_uiConstants.colors.blue050, _uiConstants.colors.blue200, _uiConstants.spacers.dp12, _uiConstants.spacers.dp16, _uiConstants.colors.yellow050, _uiConstants.colors.yellow200, _uiConstants.colors.red050, _uiConstants.colors.red500, _uiConstants.colors.green050, _uiConstants.colors.green200]]])
|
|
51
51
|
}, /*#__PURE__*/_react.default.createElement(_noticeBoxContent.NoticeBoxContent, {
|
|
52
52
|
title: title,
|
|
53
53
|
dataTest: "".concat(dataTest, "-content")
|
|
54
54
|
}, children)), /*#__PURE__*/_react.default.createElement(_style.default, {
|
|
55
|
-
id: "
|
|
55
|
+
id: "243875418",
|
|
56
56
|
dynamic: [_uiConstants.colors.blue050, _uiConstants.colors.blue200, _uiConstants.spacers.dp12, _uiConstants.spacers.dp16, _uiConstants.colors.yellow050, _uiConstants.colors.yellow200, _uiConstants.colors.red050, _uiConstants.colors.red500, _uiConstants.colors.green050, _uiConstants.colors.green200]
|
|
57
|
-
}, [".root.__jsx-style-dynamic-selector{background:".concat(_uiConstants.colors.blue050, ";border:1px solid ").concat(_uiConstants.colors.blue200, ";border-radius:3px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding:").concat(_uiConstants.spacers.dp12, "
|
|
57
|
+
}, [".root.__jsx-style-dynamic-selector{background:".concat(_uiConstants.colors.blue050, ";border:1px solid ").concat(_uiConstants.colors.blue200, ";border-radius:3px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding-block:").concat(_uiConstants.spacers.dp12, ";padding-inline:").concat(_uiConstants.spacers.dp16, ";}"), ".root.warning.__jsx-style-dynamic-selector{background:".concat(_uiConstants.colors.yellow050, ";border:1px solid ").concat(_uiConstants.colors.yellow200, ";}"), ".root.error.__jsx-style-dynamic-selector{background:".concat(_uiConstants.colors.red050, ";border:2px solid ").concat(_uiConstants.colors.red500, ";}"), ".root.valid.__jsx-style-dynamic-selector{background:".concat(_uiConstants.colors.green050, ";border:1px solid ").concat(_uiConstants.colors.green200, ";}")]));
|
|
58
58
|
};
|
|
59
59
|
|
|
60
60
|
exports.NoticeBox = NoticeBox;
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.default = exports.WithoutTitle = exports.WithALongTitle = exports.Warning = exports.Valid = exports.TitleOnly = exports.Error = exports.Default = void 0;
|
|
6
|
+
exports.default = exports.WithoutTitle = exports.WithALongTitle = exports.Warning = exports.Valid = exports.TitleOnly = exports.RTL = exports.Error = exports.Default = void 0;
|
|
7
7
|
|
|
8
8
|
var _uiConstants = require("@dhis2/ui-constants");
|
|
9
9
|
|
|
@@ -88,4 +88,14 @@ const TitleOnly = () => /*#__PURE__*/_react.default.createElement(_noticeBox.Not
|
|
|
88
88
|
title: "This noticebox has only a title"
|
|
89
89
|
});
|
|
90
90
|
|
|
91
|
-
exports.TitleOnly = TitleOnly;
|
|
91
|
+
exports.TitleOnly = TitleOnly;
|
|
92
|
+
|
|
93
|
+
const RTL = args => /*#__PURE__*/_react.default.createElement("div", {
|
|
94
|
+
dir: "rtl"
|
|
95
|
+
}, /*#__PURE__*/_react.default.createElement(_noticeBox.NoticeBox, args, "\u0647\u0630\u0647 \u0631\u0633\u0627\u0644\u0629 \u0628\u0627\u0644\u0644\u063A\u0629 \u0627\u0644\u0639\u0631\u0628\u064A\u0629."));
|
|
96
|
+
|
|
97
|
+
exports.RTL = RTL;
|
|
98
|
+
RTL.args = {
|
|
99
|
+
title: 'مثال على العنوان'
|
|
100
|
+
};
|
|
101
|
+
RTL.storyName = 'RTL Text';
|
|
@@ -12,16 +12,16 @@ export const NoticeBoxContent = _ref => {
|
|
|
12
12
|
} = _ref;
|
|
13
13
|
return /*#__PURE__*/React.createElement("div", {
|
|
14
14
|
"data-test": dataTest,
|
|
15
|
-
className: _JSXStyle.dynamic([["
|
|
15
|
+
className: _JSXStyle.dynamic([["403435427", [spacers.dp8]]])
|
|
16
16
|
}, /*#__PURE__*/React.createElement(NoticeBoxTitle, {
|
|
17
17
|
title: title,
|
|
18
18
|
dataTest: "".concat(dataTest, "-title")
|
|
19
19
|
}), /*#__PURE__*/React.createElement(NoticeBoxMessage, {
|
|
20
20
|
dataTest: "".concat(dataTest, "-message")
|
|
21
21
|
}, children), /*#__PURE__*/React.createElement(_JSXStyle, {
|
|
22
|
-
id: "
|
|
22
|
+
id: "403435427",
|
|
23
23
|
dynamic: [spacers.dp8]
|
|
24
|
-
}, ["div.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:".concat(spacers.dp8, ";padding-
|
|
24
|
+
}, ["div.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:".concat(spacers.dp8, ";padding-block-start:3px;}")]));
|
|
25
25
|
};
|
|
26
26
|
NoticeBoxContent.defaultProps = {
|
|
27
27
|
dataTest: 'dhis2-uicore-noticebox-content'
|
|
@@ -32,14 +32,14 @@ export const NoticeBoxIcon = _ref => {
|
|
|
32
32
|
|
|
33
33
|
return /*#__PURE__*/React.createElement("div", {
|
|
34
34
|
"data-test": dataTest,
|
|
35
|
-
className: _JSXStyle.dynamic([["
|
|
35
|
+
className: _JSXStyle.dynamic([["1909501516", [spacers.dp12, spacers.dp24]]])
|
|
36
36
|
}, /*#__PURE__*/React.createElement(Icon, {
|
|
37
37
|
color: color,
|
|
38
|
-
className: _JSXStyle.dynamic([["
|
|
38
|
+
className: _JSXStyle.dynamic([["1909501516", [spacers.dp12, spacers.dp24]]])
|
|
39
39
|
}), /*#__PURE__*/React.createElement(_JSXStyle, {
|
|
40
|
-
id: "
|
|
40
|
+
id: "1909501516",
|
|
41
41
|
dynamic: [spacers.dp12, spacers.dp24]
|
|
42
|
-
}, [".__jsx-style-dynamic-selector{margin-
|
|
42
|
+
}, [".__jsx-style-dynamic-selector{margin-inline-end:".concat(spacers.dp12, ";height:").concat(spacers.dp24, ";}")]));
|
|
43
43
|
};
|
|
44
44
|
NoticeBoxIcon.propTypes = {
|
|
45
45
|
dataTest: PropTypes.string.isRequired,
|
package/build/es/notice-box.js
CHANGED
|
@@ -23,21 +23,21 @@ export const NoticeBox = _ref => {
|
|
|
23
23
|
});
|
|
24
24
|
return /*#__PURE__*/React.createElement("div", {
|
|
25
25
|
"data-test": dataTest,
|
|
26
|
-
className: _JSXStyle.dynamic([["
|
|
26
|
+
className: _JSXStyle.dynamic([["243875418", [colors.blue050, colors.blue200, spacers.dp12, spacers.dp16, colors.yellow050, colors.yellow200, colors.red050, colors.red500, colors.green050, colors.green200]]]) + " " + (classnames || "")
|
|
27
27
|
}, /*#__PURE__*/React.createElement(NoticeBoxIcon, {
|
|
28
28
|
error: error,
|
|
29
29
|
warning: warning,
|
|
30
30
|
valid: valid,
|
|
31
31
|
dataTest: "".concat(dataTest, "-icon")
|
|
32
32
|
}), /*#__PURE__*/React.createElement("div", {
|
|
33
|
-
className: _JSXStyle.dynamic([["
|
|
33
|
+
className: _JSXStyle.dynamic([["243875418", [colors.blue050, colors.blue200, spacers.dp12, spacers.dp16, colors.yellow050, colors.yellow200, colors.red050, colors.red500, colors.green050, colors.green200]]])
|
|
34
34
|
}, /*#__PURE__*/React.createElement(NoticeBoxContent, {
|
|
35
35
|
title: title,
|
|
36
36
|
dataTest: "".concat(dataTest, "-content")
|
|
37
37
|
}, children)), /*#__PURE__*/React.createElement(_JSXStyle, {
|
|
38
|
-
id: "
|
|
38
|
+
id: "243875418",
|
|
39
39
|
dynamic: [colors.blue050, colors.blue200, spacers.dp12, spacers.dp16, colors.yellow050, colors.yellow200, colors.red050, colors.red500, colors.green050, colors.green200]
|
|
40
|
-
}, [".root.__jsx-style-dynamic-selector{background:".concat(colors.blue050, ";border:1px solid ").concat(colors.blue200, ";border-radius:3px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding:").concat(spacers.dp12, "
|
|
40
|
+
}, [".root.__jsx-style-dynamic-selector{background:".concat(colors.blue050, ";border:1px solid ").concat(colors.blue200, ";border-radius:3px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding-block:").concat(spacers.dp12, ";padding-inline:").concat(spacers.dp16, ";}"), ".root.warning.__jsx-style-dynamic-selector{background:".concat(colors.yellow050, ";border:1px solid ").concat(colors.yellow200, ";}"), ".root.error.__jsx-style-dynamic-selector{background:".concat(colors.red050, ";border:2px solid ").concat(colors.red500, ";}"), ".root.valid.__jsx-style-dynamic-selector{background:".concat(colors.green050, ";border:1px solid ").concat(colors.green200, ";}")]));
|
|
41
41
|
};
|
|
42
42
|
NoticeBox.defaultProps = {
|
|
43
43
|
dataTest: 'dhis2-uicore-noticebox'
|
|
@@ -54,4 +54,11 @@ WithALongTitle.args = {
|
|
|
54
54
|
export const WithoutTitle = () => /*#__PURE__*/React.createElement(NoticeBox, null, "This noticebox does not have a title.");
|
|
55
55
|
export const TitleOnly = () => /*#__PURE__*/React.createElement(NoticeBox, {
|
|
56
56
|
title: "This noticebox has only a title"
|
|
57
|
-
});
|
|
57
|
+
});
|
|
58
|
+
export const RTL = args => /*#__PURE__*/React.createElement("div", {
|
|
59
|
+
dir: "rtl"
|
|
60
|
+
}, /*#__PURE__*/React.createElement(NoticeBox, args, "\u0647\u0630\u0647 \u0631\u0633\u0627\u0644\u0629 \u0628\u0627\u0644\u0644\u063A\u0629 \u0627\u0644\u0639\u0631\u0628\u064A\u0629."));
|
|
61
|
+
RTL.args = {
|
|
62
|
+
title: 'مثال على العنوان'
|
|
63
|
+
};
|
|
64
|
+
RTL.storyName = 'RTL Text';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dhis2-ui/notice-box",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.14.0",
|
|
4
4
|
"description": "UI NoticeBox",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -32,8 +32,8 @@
|
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
34
|
"@dhis2/prop-types": "^3.1.2",
|
|
35
|
-
"@dhis2/ui-constants": "8.
|
|
36
|
-
"@dhis2/ui-icons": "8.
|
|
35
|
+
"@dhis2/ui-constants": "8.14.0",
|
|
36
|
+
"@dhis2/ui-icons": "8.14.0",
|
|
37
37
|
"classnames": "^2.3.1",
|
|
38
38
|
"prop-types": "^15.7.2"
|
|
39
39
|
},
|