Merge release/2.1.0 into main branch (#977)

* add target to Alert action (#974) * Bump word-wrap from 1.2.3 to 1.2.4 (#976) Bumps [word-wrap](https://github.com/jonschlinkert/word-wrap) from 1.2.3 to 1.2.4. - [Release notes](https://github.com/jonschlinkert/word-wrap/releases) - [Commits](jonschlinkert/word-wrap@1.2.3...1.2.4) --- updated-dependencies: - dependency-name: word-wrap dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * Bump semver from 5.7.1 to 5.7.2 (#967) Bumps [semver](https://github.com/npm/node-semver) from 5.7.1 to 5.7.2. - [Release notes](https://github.com/npm/node-semver/releases) - [Changelog](https://github.com/npm/node-semver/blob/v5.7.2/CHANGELOG.md) - [Commits](npm/node-semver@v5.7.1...v5.7.2) --- updated-dependencies: - dependency-name: semver dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * Bump tough-cookie from 4.1.2 to 4.1.3 (#966) Bumps [tough-cookie](https://github.com/salesforce/tough-cookie) from 4.1.2 to 4.1.3. - [Release notes](https://github.com/salesforce/tough-cookie/releases) - [Changelog](https://github.com/salesforce/tough-cookie/blob/master/CHANGELOG.md) - [Commits](salesforce/tough-cookie@v4.1.2...v4.1.3) --- updated-dependencies: - dependency-name: tough-cookie dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * Add RichTextEditor component (#972) Adds a RichTextEditor component to input and edit text with formatting. Currently supports bold, italic, link, unordered list, and ordered list.
user-interviews · Jul 19, 2023 · 46f4208 · 46f4208
1 parent ad96e36
commit 46f4208
Show file tree

Hide file tree

Showing 17 changed files with 1,782 additions and 19 deletions.
diff --git a/package.json b/package.json
@@ -1,14 +1,31 @@
 {
   "name": "@user-interviews/ui-design-system",
-  "version": "2.0.4",
+  "version": "2.1.0",
   "dependencies": {
+    "@tiptap/core": "^2.0.3",
+    "@tiptap/extension-bold": "^2.0.3",
+    "@tiptap/extension-bullet-list": "^2.0.3",
+    "@tiptap/extension-character-count": "^2.0.3",
+    "@tiptap/extension-document": "^2.0.3",
+    "@tiptap/extension-hard-break": "^2.0.3",
+    "@tiptap/extension-history": "^2.0.3",
+    "@tiptap/extension-italic": "^2.0.3",
+    "@tiptap/extension-link": "^2.0.3",
+    "@tiptap/extension-list-item": "^2.0.3",
+    "@tiptap/extension-ordered-list": "^2.0.3",
+    "@tiptap/extension-paragraph": "^2.0.3",
+    "@tiptap/extension-placeholder": "^2.0.3",
+    "@tiptap/extension-text": "^2.0.3",
+    "@tiptap/pm": "^2.0.3",
+    "@tiptap/react": "^2.0.3",
     "react-bootstrap": "^2.5.0",
     "react-currency-input-field": "^3.6.10",
     "react-loading-skeleton": "^3.1.0",
     "react-router-dom": "^5.2.0",
     "react-select": "^5.0.0",
     "react-toggle": "4.1.1",
     "react-transition-group": "^4.3.0",
+    "sanitize-html": "^2.11.0",
     "uuid": "^7.0.2"
   },
   "scripts": {

diff --git a/spec/__snapshots__/Storyshots.test.js.snap b/spec/__snapshots__/Storyshots.test.js.snap
@@ -10559,6 +10559,264 @@ exports[`Storyshots Components/RadioButton With Description 1`] = `
 </label>
 `;
 
+exports[`Storyshots Components/RichTextEditor ARIA Attributes 1`] = `
+Array [
+  <span
+    aria-busy={true}
+    aria-live="polite"
+  >
+    <span
+      className="react-loading-skeleton LoadingSkeleton"
+      style={
+        Object {
+          "--base-color": "#E1E1E1",
+          "borderRadius": "0.25rem",
+          "height": 40,
+          "width": "100%",
+        }
+      }
+    >
+      ‌
+    </span>
+    <br />
+  </span>,
+  <span
+    aria-busy={true}
+    aria-live="polite"
+  >
+    <span
+      className="react-loading-skeleton LoadingSkeleton"
+      style={
+        Object {
+          "--base-color": "#E1E1E1",
+          "borderRadius": "0.25rem",
+          "height": 70,
+          "width": "100%",
+        }
+      }
+    >
+      ‌
+    </span>
+    <br />
+  </span>,
+]
+`;
+
+exports[`Storyshots Components/RichTextEditor Available Actions 1`] = `
+Array [
+  <span
+    aria-busy={true}
+    aria-live="polite"
+  >
+    <span
+      className="react-loading-skeleton LoadingSkeleton"
+      style={
+        Object {
+          "--base-color": "#E1E1E1",
+          "borderRadius": "0.25rem",
+          "height": 40,
+          "width": "100%",
+        }
+      }
+    >
+      ‌
+    </span>
+    <br />
+  </span>,
+  <span
+    aria-busy={true}
+    aria-live="polite"
+  >
+    <span
+      className="react-loading-skeleton LoadingSkeleton"
+      style={
+        Object {
+          "--base-color": "#E1E1E1",
+          "borderRadius": "0.25rem",
+          "height": 70,
+          "width": "100%",
+        }
+      }
+    >
+      ‌
+    </span>
+    <br />
+  </span>,
+]
+`;
+
+exports[`Storyshots Components/RichTextEditor Character Limit 1`] = `
+Array [
+  <span
+    aria-busy={true}
+    aria-live="polite"
+  >
+    <span
+      className="react-loading-skeleton LoadingSkeleton"
+      style={
+        Object {
+          "--base-color": "#E1E1E1",
+          "borderRadius": "0.25rem",
+          "height": 40,
+          "width": "100%",
+        }
+      }
+    >
+      ‌
+    </span>
+    <br />
+  </span>,
+  <span
+    aria-busy={true}
+    aria-live="polite"
+  >
+    <span
+      className="react-loading-skeleton LoadingSkeleton"
+      style={
+        Object {
+          "--base-color": "#E1E1E1",
+          "borderRadius": "0.25rem",
+          "height": 70,
+          "width": "100%",
+        }
+      }
+    >
+      ‌
+    </span>
+    <br />
+  </span>,
+]
+`;
+
+exports[`Storyshots Components/RichTextEditor Default 1`] = `
+Array [
+  <span
+    aria-busy={true}
+    aria-live="polite"
+  >
+    <span
+      className="react-loading-skeleton LoadingSkeleton"
+      style={
+        Object {
+          "--base-color": "#E1E1E1",
+          "borderRadius": "0.25rem",
+          "height": 40,
+          "width": "100%",
+        }
+      }
+    >
+      ‌
+    </span>
+    <br />
+  </span>,
+  <span
+    aria-busy={true}
+    aria-live="polite"
+  >
+    <span
+      className="react-loading-skeleton LoadingSkeleton"
+      style={
+        Object {
+          "--base-color": "#E1E1E1",
+          "borderRadius": "0.25rem",
+          "height": 70,
+          "width": "100%",
+        }
+      }
+    >
+      ‌
+    </span>
+    <br />
+  </span>,
+]
+`;
+
+exports[`Storyshots Components/RichTextEditor Error 1`] = `
+Array [
+  <span
+    aria-busy={true}
+    aria-live="polite"
+  >
+    <span
+      className="react-loading-skeleton LoadingSkeleton"
+      style={
+        Object {
+          "--base-color": "#E1E1E1",
+          "borderRadius": "0.25rem",
+          "height": 40,
+          "width": "100%",
+        }
+      }
+    >
+      ‌
+    </span>
+    <br />
+  </span>,
+  <span
+    aria-busy={true}
+    aria-live="polite"
+  >
+    <span
+      className="react-loading-skeleton LoadingSkeleton"
+      style={
+        Object {
+          "--base-color": "#E1E1E1",
+          "borderRadius": "0.25rem",
+          "height": 70,
+          "width": "100%",
+        }
+      }
+    >
+      ‌
+    </span>
+    <br />
+  </span>,
+]
+`;
+
+exports[`Storyshots Components/RichTextEditor One Line 1`] = `
+Array [
+  <span
+    aria-busy={true}
+    aria-live="polite"
+  >
+    <span
+      className="react-loading-skeleton LoadingSkeleton"
+      style={
+        Object {
+          "--base-color": "#E1E1E1",
+          "borderRadius": "0.25rem",
+          "height": 40,
+          "width": "100%",
+        }
+      }
+    >
+      ‌
+    </span>
+    <br />
+  </span>,
+  <span
+    aria-busy={true}
+    aria-live="polite"
+  >
+    <span
+      className="react-loading-skeleton LoadingSkeleton"
+      style={
+        Object {
+          "--base-color": "#E1E1E1",
+          "borderRadius": "0.25rem",
+          "height": 70,
+          "width": "100%",
+        }
+      }
+    >
+      ‌
+    </span>
+    <br />
+  </span>,
+]
+`;
+
 exports[`Storyshots Components/Selects/Async Default 1`] = `
 <div
   className="FormGroup"

diff --git a/src/Alert/Alert.jsx b/src/Alert/Alert.jsx
@@ -108,6 +108,7 @@ function Alert(props) {
                 className={classNames(`Alert-${(props.type)}`, 'primary-action')}
                 href={props.action.url}
                 rel="noopener noreferrer"
+                target={props.actionTarget}
               >
                 {props.action.content}
               </a>
@@ -138,6 +139,10 @@ Alert.propTypes = {
    Creates a CTA button on the Alert
   */
   action: PropTypes.oneOfType([PropTypes.object, PropTypes.node]),
+  /**
+    Specifies where to open the linked document
+  */
+  actionTarget: PropTypes.string,
   /**
    Determines whether the Alert will disappear automatically
   */
@@ -155,6 +160,7 @@ Alert.propTypes = {
 
 Alert.defaultProps = {
   action: undefined,
+  actionTarget: undefined,
   autoDismiss: false,
   removeBorderLeft: false,
   title: undefined,