@dhis2-ui/notice-box 8.13.15 → 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.
@@ -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([["3020667210", [_uiConstants.spacers.dp8]]])
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: "3020667210",
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-top:3px;}")]));
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([["362741486", [_uiConstants.spacers.dp12, _uiConstants.spacers.dp24]]])
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([["362741486", [_uiConstants.spacers.dp12, _uiConstants.spacers.dp24]]])
53
+ className: _style.default.dynamic([["1909501516", [_uiConstants.spacers.dp12, _uiConstants.spacers.dp24]]])
54
54
  }), /*#__PURE__*/_react.default.createElement(_style.default, {
55
- id: "362741486",
55
+ id: "1909501516",
56
56
  dynamic: [_uiConstants.spacers.dp12, _uiConstants.spacers.dp24]
57
- }, [".__jsx-style-dynamic-selector{margin-right:".concat(_uiConstants.spacers.dp12, ";height:").concat(_uiConstants.spacers.dp24, ";}")]));
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;
@@ -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([["1468515753", [_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 || "")
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([["1468515753", [_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]]])
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: "1468515753",
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, " ").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, ";}")]));
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([["3020667210", [spacers.dp8]]])
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: "3020667210",
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-top:3px;}")]));
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([["362741486", [spacers.dp12, spacers.dp24]]])
35
+ className: _JSXStyle.dynamic([["1909501516", [spacers.dp12, spacers.dp24]]])
36
36
  }, /*#__PURE__*/React.createElement(Icon, {
37
37
  color: color,
38
- className: _JSXStyle.dynamic([["362741486", [spacers.dp12, spacers.dp24]]])
38
+ className: _JSXStyle.dynamic([["1909501516", [spacers.dp12, spacers.dp24]]])
39
39
  }), /*#__PURE__*/React.createElement(_JSXStyle, {
40
- id: "362741486",
40
+ id: "1909501516",
41
41
  dynamic: [spacers.dp12, spacers.dp24]
42
- }, [".__jsx-style-dynamic-selector{margin-right:".concat(spacers.dp12, ";height:").concat(spacers.dp24, ";}")]));
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,
@@ -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([["1468515753", [colors.blue050, colors.blue200, spacers.dp12, spacers.dp16, colors.yellow050, colors.yellow200, colors.red050, colors.red500, colors.green050, colors.green200]]]) + " " + (classnames || "")
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([["1468515753", [colors.blue050, colors.blue200, spacers.dp12, spacers.dp16, colors.yellow050, colors.yellow200, colors.red050, colors.red500, colors.green050, colors.green200]]])
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: "1468515753",
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, " ").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, ";}")]));
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.13.15",
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.13.15",
36
- "@dhis2/ui-icons": "8.13.15",
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
  },