@madie/madie-design-system 1.2.65 → 1.2.68

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.
Files changed (10) hide show
  1. package/components/RichTextEditor/RichTextEditor.stories.js +20 -0
  2. package/components/RichTextEditor/index.jsx +93 -4
  3. package/dist/browser.js +1 -1
  4. package/dist/index.js +1 -1
  5. package/dist/react/index.js +1 -1
  6. package/dist/react/index.js.map +1 -1
  7. package/package.json +1 -1
  8. package/styles/components/_rich-text-editor.scss +6 -2
  9. package/styles/qppds/components/_rich-text-editor.scss +6 -2
  10. package/test/components/RichTextEditor.test.js +19 -2
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@madie/madie-design-system",
3
- "version": "1.2.65",
3
+ "version": "1.2.68",
4
4
  "description": "Shared style guide across the Madie program.",
5
5
  "main": "dist/index.js",
6
6
  "homepage": "https://github.com/MeasureAuthoringTool/madie-design-system",
package/styles/components/_rich-text-editor.scss CHANGED
@@ -20,8 +20,12 @@
20
20
  border-top: 0;
21
21
  border-bottom-left-radius: 3px;
22
22
  border-bottom-right-radius: 3px;
23
- padding-left: 4px;
24
- padding-right: 4px;
23
+ padding-left: 0.2px;
24
+ padding-right: 0.2px;
25
+
26
+ &.has-error {
27
+ border: 1.5px solid #ae1c1c;
28
+ }
25
29
 
26
30
  :first-child {
27
31
  margin-top: 0;
package/styles/qppds/components/_rich-text-editor.scss CHANGED
@@ -20,8 +20,12 @@
20
20
  border-top: 0;
21
21
  border-bottom-left-radius: 3px;
22
22
  border-bottom-right-radius: 3px;
23
- padding-left: 4px;
24
- padding-right: 4px;
23
+ padding-left: 0.2px;
24
+ padding-right: 0.2px;
25
+
26
+ &.has-error {
27
+ border: 1.5px solid #ae1c1c;
28
+ }
25
29
 
26
30
  :first-child {
27
31
  margin-top: 0;
package/test/components/RichTextEditor.test.js CHANGED
@@ -92,10 +92,10 @@ describe("RichTextEditor Component", () => {
92
92
 
93
93
  it("test renders sanitized content with preserved whitespace when readOnly is true", () => {
94
94
  const content = `this is a statement
95
- this is a statement
95
+ this is a statement
96
96
  this is a statement
97
97
 
98
- ---------------------
98
+ ---------------------
99
99
  this is a statement`;
100
100
 
101
101
  render(
@@ -113,4 +113,21 @@ describe("RichTextEditor Component", () => {
113
113
  // Ensure the innerHTML matches the sanitized version of the content
114
114
  expect(readOnlyContent.innerHTML).toBe(DOMPurify.sanitize(content));
115
115
  });
116
+
117
+ it("displays helper text when error is true", () => {
118
+ render(
119
+ <RichTextEditor
120
+ id="test-editor"
121
+ label="Test Label"
122
+ content={null}
123
+ helperText="This field is required."
124
+ required={true}
125
+ error={true}
126
+ onChange={mockOnChange}
127
+ />
128
+ );
129
+
130
+ const helperTextElement = screen.getByTestId("test-editor-helper-text");
131
+ expect(helperTextElement).toHaveTextContent("This field is required.");
132
+ });
116
133
  });